html {
    font-size: 16px;
    --sp-cointainer-padding: 10vw;
}
@media only screen and (max-width: 1900px) {
    html {
        font-size: 15px;
        --sp-cointainer-padding: 2.5vw;
    }
}

@media only screen and (max-width: 1400px) {
    html {
        font-size: 14px;
        --sp-cointainer-padding: 2.5vw;
    }
}
body {
    font-family: "Mulish", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}
.container {   
    max-width: calc(100vw - (var(--sp-cointainer-padding) * 2) - 0.5vw);
}
  
#header{
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 999;
    
    left: 0px;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    opacity: 1;
}
.header-top {
    padding-top: 1.3rem;
    padding-bottom: 1.5rem;
}
.mobile-counsel {
    display: none !important;
}
.header-left{
    margin-top: 46px;    
}
.logo{
    
    /* UI Properties */
    background: transparent  0% 0% no-repeat padding-box;
    opacity: 1;
}
  .logo img{
      width: 100%;
      height:auto;
  }
  .header-right{
      margin-top: 28px;
      
  }
  
  .collapse-button{
    padding-left: 2px;
    width: 40px;
    height: 40px;
    
  }
  .square-button{
    width: 40px;
    height: 40px;
    padding-top: 6.5px;    
    background: #F0F4F7 0% 0% no-repeat padding-box;
    border-radius: 50%;
    }

    .square-button:hover{
    background: #E5EAED 0% 0% no-repeat padding-box;
    }

    .counsel-code{
        text-align: center;
        font: normal normal 900 1.5rem/1.625rem Mulish;
        color: #035EA5;
    }
    /*Counsel code toggle button transitions*/
    /* Apply transition */

  .collapse-card{
    position: absolute;
    z-index: 99;
    top: 8.7em;
    width: 155%;
    left: -19.1em;
    border: none;
    
  }
  .collapse-card {
    margin-top: -.5rem;
    transition: opacity 0.3s ease-out, transform 0.3s ease-out;
    opacity: 0;
    transform: translateY(-15px); /* gentler motion */
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.1);
    border-radius: unset;
    border-bottom: .3rem solid #DDFFBC;
  }
  .collapse-card {
    /*transition: opacity 0.3s ease-out, transform 0.3s ease-out;*/
    transform: scale(0.95);
    }

.collapse.show .collapse-card {
    opacity: 1;
    transform: scale(1);
}
  
  .collapse.show .collapse-card {
    opacity: 1;
    transform: translateY(0);
  }

  .counsel-code{
    text-align: center;
    font: normal normal 900 1.5rem/1.625rem Mulish;
    color: #035EA5;
  }
  .collapse-text{
    font: normal normal 600 1.25rem/1.25rem Mulish;
    color: #1D2429;
  }
  .collapse-dot {
    height: 8px;
    width: 8px;
    background-color: #159bd7;
    border-radius: 50%;
    display: inline-block;
  }
/* Collapse content animation */
.icon-open img{
    width: 16px;
    height: 16px;    
}

.counsel-lg .collapsing {
    -webkit-transition: none !important;
    transition: none !important;
    }
/* Icons */
.header-icon {
    /* transition: transform 0.3s ease, opacity 0.3s ease; */
}

.icon-close {
    transform: scale(0.95);
}

/* Button styles (optional) */
.btn-counsel {
    background-color: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
}
    
    


    /*Counsel code toggle button transitions ends*/

  .vert-divider{
      height: 45px;
      border-right: 1px solid #CCD0D5;
      padding-left:2em;
      
  }
  .phone-number{
      padding-left:2em;
      padding-right: 2rem;
  }
  .phone-number a {
    font-weight: bold;
    font-size: 1.25rem;
    text-decoration: none;
    color: #488943;
}
  .top-phone-number{
      text-align: center;
      display: none;
  }
  .btn_1 {
    color: #ffffff;
    border-radius: 2em;
    padding: .6em 2.0em .6em 2.0em;
    opacity: 1;
    justify-content: center;
    align-items: center;
    transition: 0.6s ease-in;
    font-size: 1rem;
    margin-left: 1.5rem;
}
.green-btn a, .blue-btn a {
    color: #ffffff;
    text-decoration: none;
    font-family: Montserrat !important;
}
  .sppcri-navbar{
	  }
  .menu{
      position: relative;
      top: 19px;
      margin-left: 139px;
  }
  .buttons{
      top: 33px;
  }
  .menus{
      margin-top: 39px;
      
  }
  .header-icon{
      position: relative;
      /* width: 16px;
      height: 16px; */
      opacity: 1;
}
.nav-link{
    font: normal 1rem/1.25rem "Mulish", sans-serif;
    color: #192526;
}
  .navbar-nav {
    --bs-navbar-nav-link-padding-x: .9rem;
    /* font-family: sans-serif !important; */
    }
 .navbar-nav li {
    transition: 1s;
    }
  .navbar-nav li:hover, .navbar-nav .active {
      background: #E8F5DF 0% 0% no-repeat padding-box;
      transition:background-color 0.8s ease;
      border-radius: 17px;
      opacity: 1;
    }
  
  .dropdown-menu{
      padding-top: 0px;
      padding-bottom: 0px;
  }
  .dropdown-menu li:hover, .dropdown-menu li:active, .dropdown-item:hover, .dropdown-item:active {
      color: #000000 !important;
      text-decoration: none;
      background-color: #E8F5DF !important;    
      transition:background-color 1s ease;
   }
  .hamburger{
      display: none;
  }
  
  .navbar{
      background-color: none !important;
  }
  .navbar {
    display: block;
}
  .dropdown-menu{
      border-radius: 0px;
  }
  .dropdown .dropdown-menu {
      transition: opacity 1s ease;
      opacity: 0;
      display: none;
      
  }
  .dropdown:hover .dropdown-menu {
      display:block;
      opacity: 1;
      height: auto;
      margin-top: 0;
  }
  .dropdown a{
      position:relative;
      
  }
.navbar-toggler{
    border: none;
    font-size: 1.25rem;
}
.navbar-toggler:focus{
    box-shadow: none;
}
.btn a{
    font: normal normal medium 16px/19px Montserrat !important;
}
  
.green-btn{
    background: #488943 0% 0% no-repeat padding-box;
    color: #ffffff;
    border-radius: 25px;
    justify-content: center;
    align-items: center;
    padding: .8em 2.3em .8em 2.3em;
    opacity: 1;
    transition: 0.6s ease-out;
}
.green-btn:hover{
    background: #58A553 0% 0% no-repeat padding-box;    
}

.green-btn a, .blue-btn a{
    color: #ffffff;
    text-decoration: none;    
}
.blue-btn{
    color: #ffffff;
    border-radius: 25px;
    padding-left: 2.3em;
    padding-right: 2.3em;
    opacity: 1;
    justify-content: center;
    align-items: center;
    background: #0070A2 0% 0% no-repeat padding-box;
    transition: 0.6s ease-in;
}
.blue-btn:hover{
    background: #008AC7 0% 0% no-repeat padding-box;
}
.row-break{
    display: none;
}
.offcanvas-body {
    flex-grow: 0;
    margin-top: 1.5rem !important;
}
.scrollbar{
    background: #DDFFBC 0% 0% no-repeat padding-box;
    
}
.carousel-control-next-icon {
    background: transparent url('../img/Icon-ion-arrow-back-circle.png') 0% 0% no-repeat padding-box !important;
    opacity: .8;
    transition: 0.6s;
}
.carousel-control-prev-icon {
    background: transparent url('../img/Icon-ion-arrow-back-circle.png') 0% 0% no-repeat padding-box !important;
    transform: rotate(180deg);
    opacity: .8 !important;
    transition: 0.6s;
}

.carousel-control-next, .carousel-control-prev {
    opacity: .8 !important;
}
.carousel-control-prev-icon:hover {
    opacity: 1 !important;
    margin-left: -1em;
}
.carousel-control-next-icon:hover {
    margin-right: -1em;
    opacity: 1 !important;
}



    @media only screen and (max-width: 768px) {
      /* For mobile phones: */
      .header-top {
        padding-top: 0rem;
        padding-bottom: 0.0rem;
    }
    .mobile-counsel{
        display: block !important;
      }
    .navbar {
        margin-top: 0rem !important;
        margin-bottom: 0rem !important;
    }
    .navbar-brand {
        margin-top: 0rem !important;
    }
    .navbar-toggler {
        text-align: end;
        width: 20vw;
        margin-right: 2vw;
    }
    .phone-number, .vert-divider{
        display: none !important;
    }
    .top-phone-number {
            text-align: center;
            display: block;
            font-size: 1.5rem;
    }
      
    .menu{
        margin-left: 0px;;
    }
    .row-break{
        display: inline;
    }
    
    .counsel-lg {
        display: none;
    }
    .collapse-card{
        width: 100%;
        left: .0em;
        top: 8.6rem;        
    }
    .btn_1{
        padding: unset;
        padding: 1rem;
        border-radius: .8rem !important;
        margin-left: unset;
    }
    .offcanvas-header {
        margin-top: 2rem;
    }
    .header-buttons-col {
        justify-content: center;
    }
    .nav-link {
        color: #565656;
        font-size: 1.4rem;
    }
    .dropdown .dropdown-menu {
        opacity: 1 !important;
        display: block !important;
        border: none !important;
    }
    .dropdown-menu li::before {
        content: "-";
        position: absolute;
        left: 0;
        font-size: 1.8em;
        line-height: 1;
        color: inherit;
    }
    .dropdown-toggle::after {
        display: none;
    }
    .sppcri-navbar {
        padding-left: 1em;
        gap: .5em;
    }
    .nav-item {
        border-bottom: 1px solid #D7D7D7;
        padding-bottom: .6rem;
        padding-top: .6rem;
    }
}
  
    /* Medium devices (landscape tablets, 768px and up) */
  @media only screen and (max-width: 992px) {
       .phone-number, .vert-divider{
          display: none !important;
          margin-left: 0px !important;
      }
      .header-buttons {
          margin-left: 0px !important;
      }
  }