:root{
    --color-blue:#008da6;
    --color-dark-blue:#005375;
    --color-white:#FFFFFF;
    --color-light:#f8f8f8;
    --color-black:#000000;
    --color-grey:#888686;
    --color-light-grey:#535353;
    --color-red:#be3137;
    --color-yellow:#f4c146;
}
    .main-navbar,
    .tablet-navbar,
    .mobile-navbar{
        padding-block: 15px;
        background-color: var(--color-white);
        position: fixed;
    }
    .main-btn{
      padding:10px 20px;
      text-align:center;
      background:var(--color-dark-blue);
      color:var(--color-white);
      font-size:15px;
      font-weight:500;
      transition:all .3s linear;
      border:0;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      position:relative;
      border-radius:3px;
      z-index:1;
    }
    .main-btn:focus,
    .main-btn:active{
        -webkit-box-shadow:none;
        box-shadow:none;
        border:0;
    }
    .main-btn:hover{
        color: var(--color-white);
        transition: all .5s ease-in-out;
    }
    .main-btn:after{
        content:"";
        position:absolute;
        width:0%;
        height:100%;
        background-color:var(--color-yellow);
        transition:all .3s linear;
        z-index:-1;
        right:0;
        top:0;
    }

    .main-btn:hover:after{
        left:0;
        width:100%;
    }
    .lang-name{
        font-weight:500;
        font-size:12px;
        color: var(--color-black);
    }
    .lang-name:hover{
        color:var(--color-yellow);
        transition: all .5s ease-in-out;
    }
    .language-flag{
        width: 20%;
        height: 20%;
    }
    .nav-link:hover{
      color: var(--color-yellow);
      transition: all .5s ease-in-out;
    }
    .nav-link{
        color:var(--color-black);
        margin-right: 10px;
        font-weight:500;
        font-size:12px;
        text-transform:none;
    }
    .nav-item .main-nav-link{
        color:var(--color-black);
        margin-right: 10px;
        font-weight:500;
        font-size:12px;
        text-transform:none;
    }
    .main-nav-link:hover {
        color:var(--color-yellow);
        transition: all .5s ease-in-out;
    }
    .choose-lang-name{
        font-size: 14px;
    }
    .dropdown-menu a{
        color: var(--color-black);
    }
    .dropdown-menu a:hover {
        color: var(--color-yellow);
        transition: all .5s ease-in-out;
    }
    .main-navbar-input-group{
        width: 250px;
        padding:8px;
        margin-left: 20px;
        border-radius: 3px;
        background-color:var(--color-light);
    }
    .main-navbar-input-group-text{
        border:none;
        border-radius:0;
        padding:0;
        background:0;
        color:var(--color-light-grey);
        font-size:14px;
        margin-right:5px;
        margin-left:5px;
    }
    .main-navbar-form-input{
        border: none;
        border-radius: 0;
        background-color:var(--color-light);
    }
    .main-navbar-form-input:focus,
    .main-navbar-form-input:active{
        background-color:var(--color-light);
    }
    .main-navbar-form-input::placeholder{
        color: var(--color-grey);
    }
    .main-dropdown-menu{
        border: none;
        padding: 20px;
    }
    .nested-dropdown-item:hover{
        color: var(--color-yellow);
      background-color: var(--color-white);
      transition: all .5s ease-in-out;
    }
    .tablet-navbar{
      display: none;
    }
    .tablet-nav-link:visited{
        color: var(--color-black);
    }

    .tablet-nav-link:hover{
        color: var(--color-yellow);
    }

    .nav-item a{
        color:var(--color-black);
        margin-right: 10px;
        font-weight:500;
        font-size:14px;
        text-transform:none;
    }
    .nav-item a:hover {
        color:var(--color-yellow);
        transition: all .5s ease-in-out;
    }
    .nested-dropdown-item:hover{
        background-color: var(--color-white);
        transition: all .5s ease-in-out;
    }
    .lang-name{
        font-weight:500;
        font-size:15px;
        color: var(--color-black);
    }
    .lang-name:hover{
        color:var(--color-yellow);
    }
    .language-dropdown-item:hover{
        color:var(--color-yellow);
        background-color: var(--color-white);
        transition: all .5s ease-in-out;
    }
    .language-flag{
        width: 20%;
        height: 20%;
    }
    .nav-link:hover{
        color: var(--color-yellow);
        transition: all .5s ease-in-out;
     }
     .nav-link-button{
        border: none;
        background-color:var(--color-white);
     }
     .nav-link-button:hover{
        color: var(--color-yellow);
        transition: all .5s ease-in-out;
     }
     .tablet-input-group{
        width: 250px;
        padding:8px;
        border-radius: 3px;
        flex-wrap: nowrap;
        background-color:var(--color-light);
    }
    .tablet-form-input:active,
    .tablet-form-input:focus{
        background-color:var(--color-white);
    }
    .tablet-input-group-text{
        border:none;
        border-radius:0;
        padding:0;
        background:0;
        color:var(--color-light-grey);
        font-size:14px;
        margin-right:5px;
        margin-left:5px;
    }
    .tablet-form-input{
        border: none;
        border-radius: 0;
        background-color:var(--color-light);
    }
    .tablet-form-input:focus{
        background-color:var(--color-light);
    }
    .tablet-form-input::placeholder{
        color: var(--color-light-grey);
    }
    .tablet-navbar-collapse{
        background-color: var(--color-white);
    }
    hr{
        border-color: var(--color-dark-blue);
        background-color: var(--color-dark-blue);
    }
    .bi-x{
        display: none;
    }
    .tablet-menu{
        display: flex;
        align-items: center;
    }
    .mobile-navbar{
        display: none;
    }
    .mobile-navbar{
        display: none;
    }
    .mobile-form-input{
        border: none;
        border-radius: 0;
        background-color:var(--color-light);
    }
    .mobile-input-group{
        background-color:#f8f8f8; 
        width:200px;
        padding:8px;
        border-radius: 3px;
    }
    .mobile-form-input::placeholder{
        color: var(--color-grey);
    }
@media screen and (max-width:1200px){
  .main-navbar{
    display: none;
  }
  .tablet-navbar{
    display: block;
  }
}

  @media screen and (max-width:992px){
      .main-navbar,
      .tablet-navbar{
          display:none;
      }
      .mobile-navbar{
          display:block;
      }
  }
    /*header*/
.header-page{
    padding-top:100px;
    padding-bottom:100px;
    background-repeat:no-repeat;
    background-size:contain;
    background-position:left 75% top;
    background-image:url('../images/shapes/line-area-shape.png');
    background-color:var(--color-light);
    position:relative;
    margin-top: 89px;
}
.extra-bottom-space-lg{
    padding-bottom:300px;
}
.header-page-shape{
    position:absolute;
    right:20%;
}
.header-page-shape.header-page-shape-top{
    top:0;
}
.header-page-shape.header-page-shape-middle{
    top:50%;
    transform:translateY(-50%);
}
.header-page-shape.header-page-shape-bottom{
    bottom:0;
}
.header-page-content{
    position:relative;
    max-width:680px;
}
.header-page-content h1{
    font-size:60px;
    font-weight:700;
    color:var(--color-black);
    font-family:sans-serif;
    margin-bottom:10px;
}
.header-page-content {
    margin-bottom:15px;
}
.header-page-content nav{
    margin-bottom:22px;
}
.header-page-content nav:last-child{
    margin-bottom:0;
}
.breadcrumb-link{
    text-decoration: none;
    -webkit-transition:all .3s linear;
    transition:all .3s linear;
    color: var(--color-blue);
}
.breadcrumb-link:hover{
    color:var(--color-yellow);
}
@media screen and (max-width:991px){
    .header-page-shape{
        display: none;
    }
    .header-page-content{
        display: flex;
        flex-direction: column;
        align-items: center;
        
    }
}
@media screen and (max-width:650px) {
    .header-page{
        background-position:left 75% center;
    }
}
@media screen and (max-width:700px){
    .header-page-content h1{
        font-size: 32px;
        text-align: center;
    }
    .breadcrumb{
        font-size: 12px;
        text-align: center;
    }
}
@media screen and (max-width:380px){
    .header-page-content h1{
        font-size: 20px;
       
    }
    .breadcrumb{
        font-size: 10px;
        text-align: center;
    }
}


/*footer*/
.pt-100{
    padding-top: 100px;
}
.pb-80{
    padding-bottom: 80px;
}
.footer-upper{
    position: relative;
    height: auto;
    background: var(--color-blue);
    z-index: 1;
}
.footer-upper .footer-details p{
    color:var(--color-light);
}
.footer-upper .footer-content-title h4{
    color:var(--color-white);;
}
.footer-upper .footer-address-info-item p{
    color:var(--color-light);
}
.footer-upper .footer-address-info-item h4{
    color:var(--color-white);
}
.footer-upper .footer-address-info-item .footer-contact-number{
    font-size:16px;
    color:var(--color-light);
}
.footer-upper .footer-address-info-item .footer-contact-number a{
    color:var(--color-white);
    text-decoration: none;
    transition:all .3s linear;
}
.footer-upper .footer-address-info-item .footer-contact-number a:hover{
    color:var(--color-yellow);
}
.footer-upper .footer-address-info-item .footer-email{
    font-size:16px;
}
.footer-upper .footer-address-info-item .footer-email a{
    color:var(--color-white);
    text-decoration: none;
    transition:all .3s linear;
}

.footer-upper .footer-address-info-item .footer-email a:hover{
    color:var(--color-yellow);
    transition: all .5s ease-in-out;
}
.footer-upper .footer-address-info-item .footer-availability{
    color:var(--color-light);
}
.footer-upper .footer-address-info-item .footer-availability span{
    color:var(--color-white);
}
.footer-upper .footer-address-info-item .footer-physical-address{
    color:var(--color-light);
}
.footer-upper .footer-address-info-item .footer-physical-address span{
    color:var(--color-white);
}
.footer-upper .footer-list li a{
    color:var(--color-light);
    text-decoration: none;
    transition:all .3s linear;
}
.footer-upper .footer-list li p{
    margin-top:3px;
    color:var(--color-light);
}
.footer-upper .footer-list li:before{
    color:var(--color-light);
}
.footer-upper .footer-list li:hover a{
    color:var(--color-yellow);
    transition: all .5s ease-in-out;
}
.footer-upper .footer-list li:hover:before{
    color:var(--color-yellow);
}
.footer-upper .footer-address li{
    color:var(--color-light);
}
.footer-upper .footer-address li a{
    color:var(--color-white);
    transition:all .3s linear;
}
.footer-upper .footer-address li span{
    color:var(--color-light);
}
.footer-upper .footer-address li p{
    margin-top:3px;
    color:var(--color-light);
}
.footer-upper.footer-address li:hover a{
    color:var(--color-yellow);
    transition: all .5s ease-in-out;
}
.footer-upper .footer-newsletter-form .input-group{
    border:1px solid var(--color-white);
    background-color:var(--color-white);
}
.footer-content-item{
    margin-bottom:20px;
}
.footer-logo a{
    display:block;
}
.footer-details{
    margin-top:30px;
    margin-bottom:0;
}
.footer-details p{
    font-size:15px;
}  
.footer-lower{
    height: auto;
    padding-block: 30px;
    display: flex;
    flex-direction: row;
    align-items: center;
    background-color: var(--color-light);
}
.footer-lower-grid{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;

}
.footer-copyright-text{
    position: relative;
   padding-right:20px;
   margin-right:20px;
   z-index: 1;
}
.footer-copyright-text p{
    font-size:16px;
    font-weight:400;
    margin-bottom:0;
}
.footer-copyright-link{
    transition:all .3s linear;
    color: var(--color-blue);
    text-decoration: none;
    cursor: pointer;
}
.footer-copyright-link:hover{
    color:var(--color-yellow);
    transition: all .5s ease-in-out;
}
.footer-social-list{
    position:relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-top: 15px;
    z-index: 1;
}
.footer-background-shape-img{
    width: 70%;
    height: 50%;
    position:absolute;
    left:22%;
    top: 37%;
    z-index: 0;
}

.shake{
    animation:shake 1s ease-in 2;
}
@keyframes shake {
    10%, 90% {
      transform: translate3d(-2px, 0, 0);
    }
    
    20%, 80% {
      transform: translate3d(4px, 0, 0);
    }
  
    30%, 50%, 70% {
      transform: translate3d(-6px, 0, 0);
    }
  
    40%, 60% {
      transform: translate3d(6px, 0, 0);
    }
  }
  @media screen and (min-width:2500px){
    .footer-background-shape-scale{
        width: 180px;
        position: absolute;
        top: -65%;
        left: 2%;
        z-index: 0;
    }
    .footer-background-shape-circle{
        width:250px;
        position:absolute;
        left: 90%;
        top: -98%;
        z-index: 0;
    }
  }
  @media screen and (max-width:2500px){
    .footer-background-shape-scale{
        width: 180px;
        position: absolute;
        top: -65%;
        left: 2%;
        z-index: 0;
    }
    .footer-background-shape-circle{
        width:250px;
        position:absolute;
        left: 85%;
        top: -98%;
        z-index: 0;
    }
  }
  @media screen and (max-width:1690px){
    .footer-background-shape-scale{
        width: 180px;
        position: absolute;
        top: -65%;
        left: 2%;
        z-index: 0;
    }
    .footer-background-shape-circle{
        width:250px;
        position:absolute;
        left: 80%;
        top: -98%;
        z-index: 0;
    }
  }
  @media screen and (max-width:1270px){
    .footer-background-shape-scale{
        width: 150px;
        position: absolute;
        top: -58%;
        left: 2%;
        z-index: 0;
    }
    .footer-background-shape-circle{
        width:250px;
        position:absolute;
        left: 73%;
        top: -99%;
        z-index: 0;
    }
  }

  @media screen and (max-width:992px){
    .footer-background-shape-img,
    .footer-background-shape-circle,
    .footer-background-shape-scale{
        display: none;
    }
  }
@media screen and (max-width:768px){
    .footer-lower-grid{
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 10px;
    }
    .footer-copyright-text{
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        align-items: center;
        text-align: center;
    }
    
}

@media screen and (max-width:450px){
    .tablet-menu{
       display: none;
    }
}