From c1febebfe3502e9756b5c82ca5e9049a330f320d Mon Sep 17 00:00:00 2001
From: Divyanjali Sharma <152084615+Divyanjali-sharma@users.noreply.github.com>
Date: Fri, 28 Jun 2024 16:55:08 +0530
Subject: [PATCH] commit new

---
 Html-Files/Css-Files/style.css | 444 +++++++--------------------------
 Html-Files/ent.html            |   8 +-
 2 files changed, 97 insertions(+), 355 deletions(-)

diff --git a/Html-Files/Css-Files/style.css b/Html-Files/Css-Files/style.css
index a856acd5..1fcf89da 100644
--- a/Html-Files/Css-Files/style.css
+++ b/Html-Files/Css-Files/style.css
@@ -1,384 +1,126 @@
 
-  @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300&display=swap');
+ /* Import Font (Optional) */
+@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;700&display=swap');
 
-/* Default (Light) Mode */
-:root {
-    --background-color: #ffffff; /* Light background color */
-    --text-color: #333333; /* Dark text color */
-    --card-background: rgba(128, 128, 128, 0.204); /* Card background color */
-  }
-  
-  /* Dark Mode */
-  body.dark-mode {
-    --background-color: #333333; /* Dark background color */
-    --text-color: #ffffff; /* Light text color */
-    --card-background: rgba(0, 0, 0, 0.24); /* Dark card background color */
-  }
-  body {
-    background-color: var(--background-color);
-    color: var(--text-color);
-  }
-  .head {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    flex-direction: column;
-    padding: 12px;
-    margin: 12px auto;
+/* Base Styles */
+body {
+  margin: 0;
+  padding: 0;
+  font-family: 'Poppins', sans-serif;
+  color: #333; /* Default text color */
+  background-color: #fff; /* Light background color (default) */
+  transition: background-color 0.3s ease-in-out; /* Smooth background color transition */
 }
 
-
-.card-body{
-    padding: 1rem;
+/* Dark Mode Toggle (Optional) */
+.dark-mode-toggle {
+  position: fixed;
+  top: 10px;
+  right: 10px;
+  padding: 10px;
+  border-radius: 50%;
+  cursor: pointer;
+  transition: background-color 0.3s ease-in-out;
 }
 
-.card-title{
-    color: rgb(248, 65, 14);
-    letter-spacing: 1px;
-    font-size: 16px;
-    font-weight: bold;
-    font-family: 'Poppins', sans-serif;
-    text-overflow: ellipsis;
-    display: -webkit-box;
-    -webkit-line-clamp: 2;
-    -webkit-box-orient: vertical;  
-    max-height: 80px; /* 4 lines at 20px per line */
-    white-space: normal;
-    overflow: hidden;
-
-
-}
-.card-text{
-    max-height: 100px; /* 4 lines at 20px per line */
-  overflow: hidden;
-  text-overflow: ellipsis;
-  letter-spacing: 1px;
-  font-family: 'Poppins', sans-serif;
-  white-space: normal;
-  font-size: 13px;
-  display: -webkit-box;
-  -webkit-line-clamp: 4;
-  -webkit-box-orient: vertical;  
+.dark-mode-toggle:hover {
+  background-color: rgba(0, 0, 0, 0.2); /* Slightly darken on hover */
 }
 
-
-.card-author{
-    font-weight: bold;
-    font-family: 'Poppins', sans-serif;
-    letter-spacing: 1px;
-    padding-top: 12px;
-    font-size: 12px;
+/* Dark Mode Styles */
+body.dark-mode {
+  background-color: #333; /* Dark background color */
+  color: #fff; /* Light text color for dark mode */
 }
-.card-date{
-    font-family: 'Poppins', sans-serif;
-    letter-spacing: 1px;
-    font-size: 10px;
-}
-
-#newsBox {
-    display: flex;
-    justify-content: center;
-align-items: center;
-    gap: 2rem;
-    flex-wrap: wrap;
 
+/* Container (for overall site layout) */
+.container {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 20px;
 }
 
-.newsCard {
-    display: flex;
-    flex-direction: column;
-    background-color: var(--card-background);
-    height: 450px;
-    width: 360px;
-    border-radius: 9px;
-    overflow: hidden;
-    box-sizing: border-box;
-}
-.thumnail{
-    width: 100%;
-    height: 100%;
+/* Header */
+header {
+  text-align: center;
+  padding: 20px;
 }
 
-.imageWrapper{
-    width: 100%;
-    height: 180px;
-    object-fit: cover;
+header h1 {
+  font-size: 2em;
+  margin-bottom: 0;
 }
 
-#img {
-    height: 406px;
-    width: 721px;
+/* Navigation (Optional) */
+nav {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 10px;
+  background-color: #eee; /* Light background for navigation (optional) */
+  border-bottom: 1px solid #ddd; /* Light border for navigation (optional) */
 }
 
-.line {
-    width: 30vw;
-    border: 1px solid black;
-    margin: 7px;
-    background-color: black;
-    height: 4px;
-    border-radius: 24px;
+nav ul {
+  list-style: none;
+  margin: 0;
+  padding: 0;
 }
 
-footer {
-    position: fixed;
-    left: 0;
-    bottom: 0;
-    width: 100%;
+nav li {
+  display: inline-block;
+  margin-right: 20px;
 }
 
-.mySpin {
-    margin: 50px auto;
-    display: block;
-    height: 10vh;
-    ;
-    width: 10vh;
-    ;
-    visibility: visible;
+nav a {
+  text-decoration: none;
+  color: inherit; /* Inherit text color from body */
+  font-weight: bold;
+  transition: color 0.3s ease-in-out;
 }
 
-.card-header{
-    border: none;
+nav a:hover {
+  color: #f00; /* Red hover color (optional) */
 }
 
-/* Media Quries */
+/* News Box */
+#newsBox {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  margin: 20px 0;
+}
 
-@media only screen and (min-width:844px) and (max-width:1142px){
-   
-    .newsCard {
-        display: flex;
-        flex-direction: column;
-        background-color: rgba(128, 128, 128, 0.204);
-        height: 380px;
-        width: 250px;
-        border-radius: 9px;
-        overflow: hidden;
-        box-sizing: border-box;
-    }
-    .card-title{
-        color: rgb(248, 65, 14);
-        letter-spacing: 1px;
-        font-size: 14px;
-        font-weight: bold;
-        font-family: 'Poppins', sans-serif;
-        text-overflow: ellipsis;
-        display: -webkit-box;
-        -webkit-line-clamp: 2;
-        -webkit-box-orient: vertical;  
-        max-height: 80px; /* 4 lines at 20px per line */
-        white-space: normal;
-        overflow: hidden;
-    
-    
-    }
-    .card-author{
-        font-weight: bold;
-        font-family: 'Poppins', sans-serif;
-        letter-spacing: 1px;
-        padding-top: 12px;
-        font-size: 8px;
-    }
-    .card-text{
-        max-height: 100px; /* 4 lines at 20px per line */
-      overflow: hidden;
-      text-overflow: ellipsis;
-      letter-spacing: 1px;
-      font-family: 'Poppins', sans-serif;
-      white-space: normal;
-      font-size: 11px;
-      display: -webkit-box;
-      -webkit-line-clamp: 4;
-      -webkit-box-orient: vertical;  
-    }
-    .imageWrapper{
-        width: 100%;
-        height: 150px;
-        object-fit: cover;
-    }
-    .card-body{
-        padding: 0.5rem;
-    }
-    
+.newsCard {
+  display: flex;
+  flex-direction: column;
+  background-color: rgba(255, 255, 255, 0.8); /* Semi-transparent white background */
+  border-radius: 10px;
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Subtle shadow */
+  overflow: hidden;
+  margin: 10px;
+  width: 30%; /* Adjust width as needed */
+  transition: transform 0.3s ease-in-out;
 }
-label {
-    width:50px;
-    height:25px;
-    position: relative;
-    display: block;
-    background: #fffdf3;
-    border-radius: 50px;
-    box-shadow: inset 0px 5px 15px rgba(0,0,0,0.4), inset 0px -5px 15px rgba(255,255,255,0.4);
-    cursor: pointer;
-  }
-  label:after {
-    content: "";
-    width:23px;
-    height: 23px;
-    position: absolute;
-    top:1px;
-    left:1px;
-    background: linear-gradient(180deg,#ffcc89,#d8860b);
-    border-radius: 50px;
-    box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
-  }
-  input {
-    width: 0;
-    height: 0;
-    visibility: hidden;
-  }
-  input:checked + label {
-    background: #242424;
-  }
-  input:checked + label:after {
-    left: 49px; 
-    transform: translateX(-100%); 
-    background: linear-gradient(180deg, #777, #3a3a3a);
+
+.newsCard:hover {
+  transform: scale(1.02); /* Slight zoom on hover */
 }
-  label, label:after {
-    transition: 0.3s
-  }
-  label:active:after{ 
-     width: 30px;
-  }
-  label svg {
-    position: absolute;
-    width: 20px;
-    top: 4.5px;
-    left:2px;
-    z-index: 100;
-  }
-  label svg.sun {
-    opacity: 1;
-    transition: 0.3s;
-  }
-  label svg.moon {
-    opacity: 0.5;
-    left:28px;
-    transition: 0.3s;
-  }
-  input:checked + label svg.sun {
-    opacity: 0.2;
-  }
-  input:checked + label svg.moon {
-     opacity: 1;
-  }
-  .form-switch{
-    padding-left: 0;
-  }
-  .form-check{
-    padding-left: 0;
-  }
-@media only screen and (min-width:492px) and (max-width:842px){
 
-      
-    .newsCard {
-        display: flex;
-        flex-direction: column;
-        background-color: rgba(128, 128, 128, 0.204);
-        height: 360px;
-        width: 230px;
-        border-radius: 9px;
-        overflow: hidden;
-        box-sizing: border-box;
-    }
-    .imageWrapper{
-        width: 100%;
-        height: 130px;
-        object-fit: cover;
-    }
-    .card-title{
-        color: rgb(248, 65, 14);
-        letter-spacing: 1px;
-        font-size: 13px;
-        font-weight: bold;
-        font-family: 'Poppins', sans-serif;
-        text-overflow: ellipsis;
-        display: -webkit-box;
-        -webkit-line-clamp: 2;
-        -webkit-box-orient: vertical;  
-        max-height: 80px; /* 4 lines at 20px per line */
-        white-space: normal;
-        overflow: hidden;
-    
-    
-    }
-    .card-text{
-        max-height: 100px; /* 4 lines at 20px per line */
-      overflow: hidden;
-      text-overflow: ellipsis;
-      letter-spacing: 1px;
-      font-family: 'Poppins', sans-serif;
-      white-space: normal;
-      font-size: 10px;
-      display: -webkit-box;
-      -webkit-line-clamp: 4;
-      -webkit-box-orient: vertical;  
-    }
-    .card-author{
-        font-weight: bold;
-        font-family: 'Poppins', sans-serif;
-        letter-spacing: 1px;
-        padding-top: 12px;
-        font-size: 8px;
-    }
+/* Image Wrapper */
+.imageWrapper {
+  position: relative; /* Necessary for hover effect */
+  width: 100%;
+  height: 180px;
+  overflow: hidden;
 }
-@media (prefers-color-scheme: dark) {
-    body {
-      background-color: var(--background-color);
-      color: var(--text-color);
-    }
-    /* Add dark mode specific styles here */
-}  
-@media only screen and (min-width:400px) and (max-width:490px){
 
-      
-    .newsCard {
-        display: flex;
-        flex-direction: column;
-        background-color: rgba(128, 128, 128, 0.204);
-        height: 360px;
-        width: 80%;
-        border-radius: 9px;
-        overflow: hidden;
-        box-sizing: border-box;
-    }
-    .imageWrapper{
-        width: 100%;
-        height: 130px;
-        object-fit: cover;
-    }
-    .card-title{
-        color: rgb(248, 65, 14);
-        letter-spacing: 1px;
-        font-size: 13px;
-        font-weight: bold;
-        font-family: 'Poppins', sans-serif;
-        text-overflow: ellipsis;
-        display: -webkit-box;
-        -webkit-line-clamp: 2;
-        -webkit-box-orient: vertical;  
-        max-height: 80px; /* 4 lines at 20px per line */
-        white-space: normal;
-        overflow: hidden;
-    
-    
-    }
-    .card-text{
-        max-height: 100px; /* 4 lines at 20px per line */
-      overflow: hidden;
-      text-overflow: ellipsis;
-      letter-spacing: 1px;
-      font-family: 'Poppins', sans-serif;
-      white-space: normal;
-      font-size: 10px;
-      display: -webkit-box;
-      -webkit-line-clamp: 4;
-      -webkit-box-orient: vertical;  
-    }
-    .card-author{
-        font-weight: bold;
-        font-family: 'Poppins', sans-serif;
-        letter-spacing: 1px;
-        padding-top: 12px;
-        font-size: 8px;
-    }
+.imageWrapper img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover; /* Ensure image fills container */
+  transition: transform 0.3s ease-in-out;
 }
+
+.newsCard:hover .imageWrapper img {
+  transform: scale(1.1); /* Slight image zoom
diff --git a/Html-Files/ent.html b/Html-Files/ent.html
index 8ab2e6b1..6f5f55fd 100644
--- a/Html-Files/ent.html
+++ b/Html-Files/ent.html
@@ -18,11 +18,11 @@
             top: 10px;
             right: 10px;
             z-index: 1000;
-            background-color: #007074d5;
+            background-color: #09cad1d5;
             cursor: pointer;
         }
         .home-button:hover {
-            background-color: #02969bd5;
+            background-color: #09abb1d5;
         }
     </style>
 </head>
@@ -51,7 +51,7 @@
                         </div>
                     </div>
                     <div class="card-content">
-                        <h2 class="name">Dr. Jayant Jaswal</h2>
+                        <h2 class="name">Dr. Jayant Jaiswal</h2>
                         <p class="discription">Ear-nose-throat (ENT)</p>
                         <a href="appointment.html"><button class="button">Make an Appointment</button></a>
                         <div id="topbar1" class="d-flex align-items-center fixed-top">
@@ -117,7 +117,7 @@ <h2 class="name">Dr. Jayant Jaswal</h2>
                         </div>
                     </div>
                     <div class="card-content">
-                        <h2 class="name">Dr. Vibhuti</h2>
+                        <h2 class="name">Dr.Vibhuti</h2>
                         <p class="discription">Ear-nose-throat (ENT)</p>
                         <a href="appointment.html"><button class="button">Make an Appointment</button></a>
                         <div id="topbar1" class="d-flex align-items-center fixed-top">