/* Dark theme styles */
 
html,
body {
    overflow-x: hidden !important;
    width: 100vw !important;
}
.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: flex-start;
    background-color: rgba(0, 0, 0, 0.7);
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    /* Adjust the opacity as needed */
}

h1,
h2,

h4,
h5,
h6 {
    font-family: Playfair Display, sans-serif;
    
    font-weight: 500;
    line-height: 130%;
color:#ebd894;
}
h3{color:#ebd894;font-family: Playfair Display, sans-serif;}
.hero-text h2 {

    padding-bottom: 0;
      line-height: 50px;
    font-weight: 400;
    text-align: left;
    letter-spacing: normal;
    white-space: normal;

}

@media (max-width: 767px) {
    .hero-text h2 {
        max-width: 100%;
        line-height: 100%;
    }

    .hero-text p {
        max-width: 100%;
    }
}

/* Custom textbox height */
.custom-textbox {
    height: 28px;
    background-color: rgba(0, 0, 0, 0.5);
    padding: 4;
}

.custom-textbox:focus,
.custom-textbox:active {
    background-color: #FFFF8F;
    /* Adjust the color as needed */
}

.contact-info {
    display: none;
    color: black;
    font-size: 14px;
    margin-top: 5px;
}

.contact-link {
    color: black;
    /* Yellow color */
    font-size: 16px;
    /* Adjust the font size as needed */
}

a:focus {
    color: black;
    /* Change the focus color as desired */
    outline: none;
    /* Remove the default focus outline */
}

p {

    font-family: Lato, sans-serif;
    font-size: 16px;
    font-weight: 100;
    line-height: 120%;

}

.navbar-nav .nav-link {
    padding: 0.5rem 1rem;
    margin-right: 10px;

    font-family: Lato, sans-serif;
    font-size: 16px;
    color: black !important;
    ;
}

/*.hero-content {
      background-image: url('https://img.freepik.com/free-photo/empty-modern-teethcare-stomatology-hospital-office-with-nobody-it-equipped-with-dental-intruments-ready-orthodontist-healthcare-treatment-tooth-radiography-images-display_482257-9418.jpg?w=740&t=st=1687808211~exp=1687808811~hmac=fd89e36fe259e5c956bb87865b7526441830b0c88e02e2c0937026a6b1093658');
      background-position: center;
      background-size: cover;
    }*/
.position-relative {
    padding-top: calc(80px + 15px);
    /* Adjust as needed based on your header height */
    padding-bottom: 40px;
    /* Adjust as needed based on your footer height */
    height: auto;
    overflow-y: auto;
    /* Hide overflow content */
    color: white !important;
max-width: 100%;
    align-items: center;
    overflow-x: hidden !important;
}

 
 
header {

    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;

}

footer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;

    color: white;
    padding: 10px;
    z-index: 1000;
}

footer a {
    font-size: small;
    color: black;
}

.section-container {
    display: flex;
   
    align-items: center;
     
}

.content-column {
    flex: 1;
    padding: 20px;
}

.image-column {
    flex: 1;
    padding: 20px;
}

.hero-image {
    width: 100%;
    max-height: 100%;
}
.div-text-card{

        text-align: center;
        border: 1px solid #addbc6;
        border-radius: 14px;
        margin-bottom: 5%;
        
        padding: 20px;
}
.section-fullscreen-black {
     
    padding-top: calc(80px + 15px);
    padding-bottom: 25%;
    
    }
        .custom-section {
        padding-top: calc(80px + 25px);
            /* Adjust the top padding as needed */
            background-color: #222;
            /* Background color for the section */
            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
            /* Add a box shadow for the cards */
        padding-bottom: 15%;
        }
    
        /* Custom styles for the cards */
        .custom-card {
            background-color: #000;
            /* Black background color for the cards */
            box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.5);
            /* Glow effect on hover */
        }
 .navbar .navbar-toggler-icon {
     background-color: #292424 !important;
     /* Change this color to your desired dark color */
 }
 .lead{color: white;}
 .why-choose{
padding-top: 40px;

 }
 .about{
padding-top: calc(80px + 25px);
padding-bottom: 15%;
 }
   .image-container {
       border: 5px solid black;
       border-radius: 10px;
       box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    
        /* Ensure the image covers the entire width */
        object-fit: cover;
      
       
       /* Scale and crop image to cover the container */
       margin-top: 10px;
       

   }
   .made-with-love {
       text-align: center;
       font-size: 14px;
       margin-top: 20px;
       color: black;
   }

   .made-with-love i {
       color: #ff0000;
       /* Change the color to your preference */
       font-size: 16px;
       vertical-align: middle;
   }