*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Hide scrollbar for all elements */
::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera */
}

/* Hide scrollbar for Firefox */
html {
    scrollbar-width: none;
}

body {
    scrollbar-width: none;
}

#navbarHeader{
    position: sticky;
    top: 0;
    z-index: 1111111;
}
#navbarOuterContainer {
    top: 0;
    position: sticky;
    display: flex;
    justify-content: center;
    z-index: 10;
    width: 100%;
}

#navbarContainer {
    /* height: 70px; */
    z-index: 10;
    width: 100%;
    position: absolute;
    top: 0;
    transition: background-color 0.3s ease-in-out;
}

.scrolled {
    background-color: #00435A;
}

/* Add vendor prefixes for 'gap' property */
#navbar ul {
    gap: 29px;
    -webkit-gap: 29px;
    -moz-gap: 29px;
}

/* Add vendor prefixes for 'text-decoration-thickness' property */
#websiteName {
    text-decoration: underline;
    text-decoration-thickness: 1.2px;
    -webkit-text-decoration-thickness: 1.2px;
}

/* Add more vendor prefixes and fixes for cross-browser compatibility */

/* Your existing CSS continues... */


    
    #navbarContainer{
        /* height: 70px; */
        z-index: 10;
        width: 100%;
        position: absolute;
   top: 0;
   transition:  background-color 0.2s ease-in-out;
   
}
.scrolled{
    background-color: #00435A;

}
#navbar{
    display: flex;

}
#navbarLogo{
    margin-left: 12px!important;
}
#navbar ul{
    gap: 29px;
}
#navbar ul li {
  text-decoration: none;
  list-style: none;
    color: white!important;

}
#logo{
    height: 50px;
    width: 50px;
    font-weight: bolder;
        font-size: 28px;
        color: #00435A;
        margin: 0 5px;

}
#websiteName{
    display: flex;
    flex-direction: column;
    font-size: 32px;
    margin-left: 0px;
    text-decoration: underline;
      text-decoration-thickness: 1.2px;
      margin-bottom: 0;
}
#websiteSlogan{
    font-size:10px;
    position: relative;
    top: -3px;
    margin-bottom: 0;
}

#navbar ul li a{

    color: white;

}
#navbar a{

    color: white;

}
#navbar #iconContainer{
    display: flex;
    gap: 15px;
    
}
#iconContainer li a{
margin-right: 0!important;
margin-left: 0 !important;
}
#watsappIcon{
    color: white;
    height: 36px;
    width: 36px;
    background-color: rgb(0, 191, 0);
    transition: all 0.3s ease-in-out;
}
#watsappIcon:hover{
    color: rgb(0, 255, 0);

    background-color: rgba(0, 191, 0, 0.461);
}
#responsiveNavIcons{
    display: none;
}
#navbar #gmailIcon{
    height: 36px;
    width: 36px;
    font-size: 22px;
    background-color: rgb(255, 255, 255);
    transition: all 0.3s ease-in-out;
}
#navbar #gmailIcon svg{
 fill:#004955 ;
}
#navbar #gmailIcon:hover{
    color: rgb(0, 255, 0);

    background-color: rgba(255, 255, 255, 0.461);
}

#navbar #phoneIcon{
    color: rgb(255, 255, 255);
    height: 35px;
    font-size: 22px;
    margin: 0 7px;
    width: 35px;
    background-color: #004955;
    transition: all 0.3s ease-in-out;
    fill: white;
}


#phoneIcon:hover{
    color: rgb(0, 255, 0);
    
    background-color: rgba(255, 255, 255, 0.461);
}

#navbar #phoneNumber{
    color: #004955;
   
}
#numberContainer{
    padding-right: 23px;
    text-decoration: none;
    transition: all 0.3s ease-in-out;
    
}
#numberContainer:hover{
background-color: rgba(255, 255, 255, 0.505)!important;
}
@media (max-width: 991.5px) {
    #navbar #phoneIcon {
 margin: 0 7px!important;
}
    #hamburgerIcon{
        background: url('https://www.clipartmax.com/png/middle/56-565031_clipart-cross-wrong-png-transparent-images-pluspng-x-icon-black-transparent.png')no-repeat center center/cover;
    }
    
    #navbarContainer{
        background-color: #00435A;
        
        
    }
    #navbarLogo {
    margin-left: 12px !important;
    margin-right: 12px !important;
}
#navbar {
    width: 100%;
    justify-content: space-between;
    padding: 0 0;
}
#navbarNavDropdown{
    background-color: white;
    color: rgb(0, 0, 0)!important;
    padding: 0 20px;
}
#navbar ul li a{
    display: flex;
    color: rgb(0, 0, 0) !important;
}
.container-fluid{
    padding: 0 0;
}
.navbar-toggler{
    margin-right: 14px;
    padding: 2px 4px;
    background-color: white;
}

#responsiveNavIcons{
    display: flex;
}
#navContactIcons{
    display: none;
}
#numberContainer {
    padding-right: 0px;
    
}
#navbar #iconContainer {
    margin-right: 22px;
    margin-bottom: 0;
}
#navbar #phoneIcon {
    background: white;
}
#navbar #phoneIcon svg{
    fill: #004955;
}
#responsiveNavIconsContainer{
    display: flex;
}
#websiteSlogan{
    position: relative;
    top: -7px;
    font-size: 9px;
    margin-bottom: 0;
}
}
@media (max-width: 410.5px) {

#websiteName {
    font-size: 22px;
    text-decoration: underline;
    text-decoration-thickness: 1.2px;
    margin-bottom: 0;
}
#navbar #iconContainer {
    margin-right: 0px;
    margin-bottom: 0;
}
#navbar #iconContainer {
    gap: 4px;
    padding-left: 0;
}
#navbar ul {
    gap: 14px;
}
#websiteSlogan{
    font-size:8px;
    position: relative;
    top: -3px;
    margin-bottom: 0;
}
}

@media (max-width: 320.5px) {
#websiteSlogan{
    font-size:5px;
    position: relative;
    top: -3px;
    margin-bottom: 0;
}
#websiteName {
    font-size: 16px;
    position: relative;
    top: 5px;
    text-decoration: underline;
    text-decoration-thickness: 1.2px;
    margin-bottom: 10px;
}


#navbar a {
      margin-right: 0!important;

}
#navbar #iconContainer {
    margin-right: 0px;
    margin-bottom: 0;
}
#navbar #iconContainer {
    gap: 2px;
    padding-left: 0;
}
.navbar-toggler {
    margin-right: 14px;
    padding: 1px 2px;
    background-color: white;
}

}