:root {
    --primaryColor: #021460;
    --secondaryColor: #E3042E;
    --white: #fff;
    --black:#000;
  }
  body{
    overflow-x: hidden;

  }


  ul{
    list-style-type: none;
    padding: 0;
    margin: 0;
  }
  a:hover {
    text-decoration: unset;
  }
  .zoom-in-zoom-out {
    display: inline-block;

  animation: zoom-in-zoom-out 2s ease-out infinite;
}

@keyframes zoom-in-zoom-out {
  0% {
    transform: scale(1, 1);
  }
  50% {
    transform: scale(1.3, 1.3);
  }
  100% {
    transform: scale(1, 1);
  }
}
.textzoomAni{
      animation: zoom 2s infinite linear;
}
@keyframes zoom {
 0% {
    transform: scale(0.8, 0.8);
  }
  50% {
    transform: scale(1.1, 1.1);
  }
  100% {
    transform: scale(0.8, 0.8);
  }
}

  .secPTB{
    padding: 100px 0;
  }
  .sectionTitle h2{
    font-size: 45px;
    text-align: center;
    font-weight: bold;

  }
  .innerSectionTitle{
    font-size: 45px;
    font-weight: bold;
    margin-bottom: 20px;
  }
  @media(min-width:1399px){
    .container{
        max-width:1370px ;
    }
  }
/*Mobile Menu*/
.mobileHeader{
    position: fixed;
    top: 0;
    left: 0;
    background-color: transparent;
    z-index: 9999;
    width: 100%;
    min-height: 90px;
    padding: 15px 20px;
    display: flex;
    align-items: center;
}
.mobileHeader .mobileLogo img{
    height: 40px;
}
.mobileHeaderWrapper{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.mobileMenuBtn{
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    color: #ffffffba
}
.mobileHeader.scrolled-header{
background-image: linear-gradient(45deg, rgba(2,20,96,1) 100%, rgba(227,4,46,1) 100%);
}
.mobileLeftMenu{
    width: 80%;
    background-color: #fff;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    height: 100vh;
    transform: translateX(-103%);
    opacity: 0;
    transition: 0.3s all linear;
}
.mobileLeftMenuOverlay{
       width: 100%;
    height: 100vh;
    background-color: #000;
    opacity: 0.5;
    z-index: 999;
    position: fixed;
}
.leftMenuList{
    padding: 20px 25px;
    margin-top: 25px;
}
.leftMenuHeader img{
    height: 40px;
       margin-top: 25px;
    margin-bottom: 25px;
    padding:  0 20px;
}
.leftMenuList li {
    margin-bottom: 20px;
}
.leftMenuList a{
        text-decoration: none;
    color: #000;
    font-weight: 500;
    padding: 10px 0;
    display: inline-block;
}
.leftMenuList a i {
    color: var(--secondaryColor);
    margin-right: 10px;
}
.leftMenuSocialLink{
    padding: 20px 25px;
    text-align: center;
}
.leftMenuSocialLink .headerSocialLink{
    justify-content: center;
    margin-top: 20px;
}
.leftMenuSocialLink .headerSocialLink li:last-child a {
    margin: 0;
}
.leftMenuHeader{
    background-color: var(--primaryColor);
}
.leftMenuCloseBtn{
    position: fixed;
    z-index: 999999999;
    top: 33px;
    right: 28px;
    background: #fff;
    color: red;
    font-size: 32px;
    display: inline-block;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
}
.mobileLeftMenuOverlay, .leftMenuCloseBtn  {
    display: none;
} 
.mobileLeftMenuOverlay__block{
    display: block;
}
.leftMenuCloseBtn__block{
    display: flex;
}
.mobileLeftMenu__block{
transform: translateX(0%);
    opacity: 1;
    transition: 0.3s ease-in-out;
}
/*Mobile Menu*/
/* HEADER */
.headerSection{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    box-shadow: rgba(35, 55, 80, 0.3) 0px 6px 12px;
 
}
.headerTopSection{
    width: 100%;
    background-color: var(--primaryColor);
    padding: 10px 0;
}
.headerTopSectionItem{
    display: flex;
    align-items: center;
}
.headerTopSectionWrapper{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.headerSocialLink{
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #fff;
}
.headerSocialLinkTitle{
    margin-right: 10px;
}
.headerSocialLink a {
    background: var(--secondaryColor);
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* flex-direction: column; */
    color: var(--white);
    border-radius: 100%;
    font-size: 14px;
    margin-right: 10px;
}
.headerTopSectionList{
    display: flex;
    align-items: center;
}
.headerTopSectionList .headerTopSectionItem{
  margin-right: 20px;
}
.headerTopSectionList .headerTopSectionLink{
    color: var(--primaryColor);
    font-weight: bold;
    padding: 15px 20px;
    display: inline-block;
    transition: 0.3s all linear;
    position: relative;
    font-size: 14px;
}
.headerTopSectionLink.active{
    color: var(--secondaryColor);
}
.headerTopSectionList .headerTopSectionItem:last-child{
    margin-right: 0;
}

.headerTopSectionList .headerTopSectionLink:hover{
   color: var(--secondaryColor);
    transition: 0.3s all linear;
   
}
.headerBtmSection{
    width: 100%;
    background-color: var(--white);
    height: 80px;
    display: flex;
    align-items: center;
}

.headerLogo img {
    height: 70px;
}
.headerBtmSectionContent{
    width: calc(100% - 300px);
    display: flex;
    align-items: center;
    justify-content: end;
}
.headerBtmSectionWraper{
    display: flex;
    align-items: center;
}
.tollFreeNumberWrap{
    margin-right: 15px;
}
.tollFreeNumberWrap i{
    background: var(--secondaryColor);
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* flex-direction: column; */
    color: var(--white);
    border-radius: 100%;
    font-size: 14px;
}
.tollFreeNumberWrap{
    display: flex;
    align-items: center;
}
.tollFreeNumber{
   font-size: 15px;
    color: #ffffffc7;
    margin-left: 15px;
    display: inline-block;
}
/* HEADER */

/* BANNER */
.bannerSection{
    width: 100%;
    height: 100vh;
    position: relative;
}
.bannerItem::after{
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgb(2,20,96);
    background: linear-gradient(45deg, rgba(2,20,96,1) 64%, rgba(227,4,46,1) 100%);
    z-index: 1;
    opacity: 0.7;
}
.bannerItem img{
    width: 100%;
    height: 100vh;

}
.bannerItem{
    position: relative;
}
.bannerText{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: bold;
   
}
.bannerText span{
    font-size: 22px;
    color: #ffffffbf;
}
.bannerText p {
    font-size: 65px;
    color: var(--white);
    font-weight: bold;
    text-align: left;
    width: 50%;
    line-height: 79px;
}
.bannerScrollRatting{
    position: absolute;
    bottom: 40px;
    z-index: 10;
    background-color: #000000c2;
    color: #fff;
    padding: 10px 0;
    left:0;
    width:100%;
}
.bannerRatingContainer{
    display: flex;
    align-items: center;
}
.curLogo {
    margin-right: 5px;
}
.curLogo img{
height: 30px;
margin-right: 10px;
}
.bannerRatingWrap{
    display: flex;
    align-items: baseline;
    font-size: 17px;
    font-weight: 500;
    margin-right: 30px;
}

.curLabel {
    color: #00BCD4;
}
.curPoint.Plus {
    color: #4CAF50;
    position: relative;
}
.curPoint.Plus::after{
    content: '';
    position: absolute;
    bottom: -10px;
    left: 0;
    right: 0;
    margin: auto;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #4CAF50;
}

.curPoint.minus {
    color: red;
    position: relative;
}
.curPoint.minus::before{
    content: '';
    position: absolute;
    bottom: -10px;
    left: 0;
    right: 0;
    margin: auto;
    width: 0; 
    height: 0; 
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #f00;
}
/* BANNER */


/*CONVERTER*/
.select2-container{
    width: 100% !important;
}
.formGroup label{
        font-size: 18px;
    font-weight: 500;
    color: #ffffffb0;
}
.formGroup input, .select2-container--default .select2-selection--single{
    height: 50px;
    padding: 0 15px;
    border:1px solid #8686866b;
    border-radius: 7px;
    color: var(--black);
}
.formGroup textarea{
    
    padding: 10 15px;
    border:1px solid #8686866b;
    border-radius: 7px;
    color: var(--black);
}
.select2-container--default .select2-selection--single{
    display: flex;
    align-items: center;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
    color: var(--black);
}
.select2-container--default .select2-selection--single .select2-selection__arrow{
    top: 0;
    bottom: 0;
    margin: auto;
}
.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #0214601c;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #e3042e;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid #0214604f;
    border-radius: 50px;
        outline: none;
    padding: 5px 15px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b{
    border-color: var(--secondaryColor) transparent transparent transparent;
}
.select2-results__option{
border-bottom: 1px solid #0214604f;
}
.select2-dropdown {
   
     border:unset; 
   
    border-bottom-right-radius: 10px;
    overflow: hidden;
    border-bottom-left-radius: 10px;
    box-shadow: rgba(35, 55, 80, 0.3) 0px 6px 12px;
}
.currencyConverterWraper{
   box-shadow: rgba(35, 55, 80, 0.3) 0px 6px 12px;
    padding: 40px 20px;
       width: 85%;
    margin: auto;
    margin-top: 0px;
    border-radius: 8px;
    padding-top: 15px;
}
.currencyConverterBgImg{
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.7;
    left: 0;
}
.currencyConverter {
    background-color: #efeff7;
}
.currencyConverter .sectionTitle h2{
    color: #fff;
    padding-top: 40px;
}
.interchangeBtn{
    width: 50px;
    height: 50px;
    border-radius: 100%;
    box-shadow: rgba(35, 55, 80, 0.3) 0px 6px 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    top: 16px;
    cursor: pointer;
        background-color: #fff;
}
.interchangeBtn img{
    width: 25px;
}
.formGroupFlxWrap{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.formGroupFlxWrap .formGroup {
    width: 43%;
}
.convertionDetail{
    margin-top: 30px;
        display: flex;
    flex-direction: column;
    align-items: center;
}
.givenCurr{
    font-weight: 500;
    font-size: 16px;
    color: #ffffffbf;
    margin-bottom: 15px;
    display: inline-block;
}
.convertCurr{
    font-size: 24px;
    font-weight: bold;
    color: #fff;
}
.currPerUnit{
    font-size: 14px;
    color: #ffffff87;
    display: block;
   
}
/*CONVERTER*/

/*About Us*/
.homeAbout{
    width: 100%;
    background-color: #efeff7;
}
.smallTitle{
    font-size: 18px;
    color: var(--secondaryColor);
    font-weight: bold;
}
.aboutImg{
    width: 100%;
    border-radius: 8px;
    
        height: 758px;
    object-fit: cover;      
}
.homeAbout p {
    font-size: 18px;
    color: #3d3d3d;
    line-height: 31px;
}
.themeBtn{
    width: 210px;
    min-height: 45px;
    background-color: var(--secondaryColor);
    color: #fff !important;
    border-radius: 7px;
    display: inline-block;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px 10px;
    box-shadow: rgba(35, 55, 80, 0.3) 0px 6px 12px;
     transition: 0.2s all linear;
     font-size: 18px;
     font-weight: 400;
     cursor: pointer;
}
.themeBtn:hover{
    background-color: var(--primaryColor);
    color: #fff;
    text-decoration: none;
    transition: 0.2s all linear;
}
.aboutStatics{
        width: 100%;
    background: linear-gradient(45deg, rgba(2,20,96,1) 64%, rgba(227,4,46,1) 100%);
    position: absolute;
    bottom: 66px;
    top: unset;
    padding: 15px 20px;
    border-radius: 8px;
    min-height: 150px;
    display: flex;
    align-items: center;
    box-shadow: rgba(35, 55, 80, 0.3) 0px 6px 12px;
    right: 130px;
    z-index: 1;
}
 .aboutStatics ul{
   
    color: #fff;
   width: 100%;
   
    display: flex;
    align-items: center;
    justify-content: space-between;
   
}
.aboutStatics ul span{
    opacity: 0.9;
    margin-bottom: 10px;
    display: inline-block;
}
.aboutStatics ul li {
    width: calc(100% / 3);
    position: relative;
        margin-right: 20px;
}
.aboutStatics ul li::after{
    position: absolute;
    content: '';
    width: 1px;
    height: 70px;
    background-color: #fff;
    opacity: 0.5;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;

}
.aboutStatics ul li::before{
    position: absolute;
    content: '';
    width: 15px;
    height: 15px;
    border-radius: 100%;
    background-color: var(--secondaryColor);
   
    right: -7px;
    z-index: 1;
    top: 0;
    bottom: 0;
    animation: moveUpDown 5s linear infinite;
}
  @keyframes moveUpDown {
        0% {
            top: 0;
        }
        50% {
            top: calc(100% - 15px); /* Adjust this value according to your needs */
        }
        100% {
            top: 0;
        }
    }
.aboutStatics ul li:last-child:after, .aboutStatics ul li:last-child:before{
    content: unset;
        margin-right: 0px;
}
.aboutStatics ul h4{
    font-size: 24px;
    color: #fff;
    font-weight: bold;

}
/*About Us*/


/*Rate Graph*/
.homeGraphSection{
    position: relative;
}
.homeGraphSection::after{
    position: absolute;
/*    content: '';*/
    width: 100%;
    height: 100%;
    background-image: url('../img/glob-map.png');
    background-size: cover;
    top: 0;
    left: 0;
    z-index: -1;
    opacity: 0.3;
}
.homeGraphSection .sectionTitle{
    margin-bottom: 70px;
}
/*.homeGraphSection::after{
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url('../img/banner1.jpg');
    content: '';
    top: 0;
    left: 0;
    background-size: cover;
    z-index: -1;
}*/
.homeGraphSectionWrapper{
    margin-top: 50px;
}
.homeGraphSectionWrapper ul{
    border-radius: 8px;
    overflow: hidden;
        max-height: 676px;
    overflow-y: auto;
        border-top-right-radius: 0px;
    border-top-left-radius: 0px;
}
.headerList{
    min-height: 45px;
    background-color: var(--primaryColor);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 15px;
    color: #fff;
    font-weight: 500;
        border-top-right-radius: 8px;
    border-top-left-radius: 8px;
}
.headerListLables{
    width: 150px;
    display: flex;
    align-items: center;
}
.headerListLablesItem{
      width: 50%;
    border-left: 1px solid #ffffff61;
    padding-left: 5px;
    text-align: center;
}
.rateItem a{
          display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 15px;
    background-color: #e5e7ef;
        border-bottom: 1px solid #02146029;
        cursor: pointer;
        transition: 0.2s all linear;
}


.rateItem .rightArrow{
    width: 18px;
}
.rateLable{
  display: flex;
    align-items: center;
    margin-bottom: 5px;
    font-size: 18px;
    color: #000;
    position: relative;
}
.rateArrow{
    position: absolute !important;
    right: -22px;
}

.rateItem .headerListLablesItem{
 border-left: 1px solid var(--primaryColor);
 font-weight: 500;
}
.rateItem:last-child{
    border: unset;
}
.currName{
        font-size: 24px;
    font-weight: 500;
    color: #021460;
}
.currName img{
    width: 30px;
    margin-right: 10px;
        position: relative;
    top: 2px;
}
.currName span{
    font-size: 14px;
    display: block;
    color: #3d3d3d;
    font-weight: 400;
}
.rateItem.active a{
background-color:#02146047;
}
.rateItem a:hover{
      background-color:#02146024;
      transition: 0.2s all linear;
}
.homeCurrencyList .formGroup{
    margin-bottom: 20px;
}
.selectCurrInfo{
    width: 100%;
    min-height: 150px;
    border-radius: 8px;
    box-shadow: rgba(35, 55, 80, 0.3) 0px 6px 12px;
    background-color: #fff;
    
}
.selectCurrInfoHead{
   padding: 0 15px;
    padding-top: 15px;
    background: #e5e7ef;
    padding-bottom: 3px;
}
.selectCurrInfoHead span{
    font-size: 14px;
}
.selectCurrInfoHead img{
    width: 30px;
}
.selectCurrInfoBody{
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.selectCurrInfoLabel {
   color: #868686;
    width: 150px;
    display: inline-block;
    font-weight: 500;
    font-size: 14px;
}
.colorGreen{
   color: #4CAF50;

}
.colorRed{
    color: red;
}
.valueCurrPoint{
    font-size: 14px !important;
    font-weight: 500;
}
.selectCurrInfoValue{
    font-size: 20px;
    font-weight: 500;
}
.grapgFilter{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 30px;
}
.grapgFilter ul{
        display: flex;
    align-items: center;
    
}
.grapgFilter ul .dateItem{
    margin-right: 10px;
    width: 30px;
    height: 30px;
}
.grapgFilter ul .dateItem {
    margin-right: 15px;
    width: 30px;
    height: 30px;
    background-color: #e5e7ef;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    border-radius: 7px;
    transition: 0.2s all linear;
    cursor: pointer;
}
.grapgFilter ul .dateItem:hover{
    background-color: var(--secondaryColor);
    color: #fff;
    transition: 0.2s all linear;
}
.grapgFilter ul .dateItem.active{
    background-color: var(--secondaryColor);
    color: #fff;
}
.grapgFilter ul .dateField input{
        border: 1px solid #ccccccc9;
    padding: 2px 15px;
    border-radius: 8px;
    width: 188px;
    outline: none;
}
.homeGraphSection .select2-container{

width: 320px !important;

}
.homeGraphSection  .formGroup input, .select2-container--default .select2-selection--single{
border-color: transparent;
background-color: #e5e7ef;
}
.homeGraphSectionWrapper{
    position: relative;
}
.homeGraphSectionWrapper .formGroup{
    position: absolute;
    right: 0;
    top: -58px;
}
#chartdiv {
    width: 100%;
    height: 500px;
/*     box-shadow: rgba(35, 55, 80, 0.3) 0px 6px 12px; */
    border-radius: 8px;
    border: 2px solid #e5e7ef;
    background-color: #fff;
}
/*Rate Graph*/

/*testimonial*/
.testimonial{
    width: 100%;
  position: relative;
/*    background-image: url('../img/testmonials.png');*/
    background-size: cover;
    background-color: #efeff7;
}
.testimonial .iconAnimation{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.testimonialItem{
    margin-top: 40px;
}
.testimonialContent{
    width: 60%;
    margin: auto;
    text-align: center;
}
.testimonialItem p{
font-size: 18px;
text-align: center;
line-height: 29px;
}
.testimonialItem img{
    width: 75px;
    height: 75px;
    border-radius: 100%;
}
.testiName{
        font-size: 18px;
    color: #021460;
    font-weight: 500;
}
.testiPosition{
        font-size: 13px;
    color: #021460b8;
    font-weight: 500;
}
.iconAnimation1{
       position: absolute;
    right: 25%;
    bottom: 132px;
}
.iconAnimation2{
       position: absolute;
    left: 15%;
  
}
.iconAnimation3{
       position: absolute;
    left: 20%;
    top: 150px;
  
}
.iconAnimation8{
        position: absolute;
    left: 40%;
    top: 50px;
}
.iconAnimation7{
        position: absolute;
    bottom: 130px;
    left: 25%;
}
.iconAnimation5{
        position: absolute;
    right: 15%;
}
.iconAnimation4{
            position: absolute;
    bottom: 57px;
    left: 50%;
}
.iconAnimation6{
               position: absolute;
    right: 22%;
    top: 150px;
}
.testiSwiper .swiper-wrapper{
    padding-bottom: 40px;
}
.swiper-pagination-bullet{
    width: 15px;
    height: 15px;
    background-color: var(--secondaryColor);
}
/*testimonial*/
/*footer*/
.footer{
    width: 100%;
    min-height: 250px;
    background-color: var(--primaryColor);
    padding: 50px 0;
    padding-bottom: 0;
}
.footerLogo{
    height: 60px;
    margin-bottom: 15px;
}
.footerDesc{
       font-size: 16px;
    color: #ffffffc4;
}
.footerLink{
        margin-top: 27px;
    padding-left: 100px;
}
.footerLink li {
    color: #fff;
    font-size: 18px;
    font-weight: bold;
}
.footerLink li a {
    color: #ffffffc4;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 10px;
       display: flex;
    align-items: center;
}
.ftrLinkHead{
    margin-bottom: 15px;
}
.footerLink img{
    height: 15px;
    margin-right: 10px;
}
.footerLink i {
        background: var(--secondaryColor);
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* flex-direction: column; */
    color: var(--white);
    border-radius: 100%;
    font-size: 14px;
    margin-right: 15px;
}
.footerLink  span{
    display: inline-block;
    width: calc(100% - 40px );
}
.footerCopyRights{
    background: #010c3c;
    color: #ffffffd1;
    padding: 9px 0;
    text-align: center;
    font-size: 14px;
}
.footerCopyRights p {
    margin-bottom: 0;
}
.footerCopyRights a {
    color: var(--white);
    transition: 0.2s all linear;
}
.footerCopyRights a:hover{
    color: var(--secondaryColor);
    transition: 0.2s all linear;
}
/*footer*/

.scrollBar::-webkit-scrollbar-track, html::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
}

.scrollBar::-webkit-scrollbar, html::-webkit-scrollbar
{
    width: 6px;
    background-color: #F5F5F5;
}

.scrollBar::-webkit-scrollbar-thumb, html::-webkit-scrollbar-thumb
{
    background-color: var(--secondaryColor);
}

/*Contact Page*/
.contactUsSection .bannerItem img{
    height: 250px;
    object-fit: cover;
}
.contactUsSection.bannerSection{
        width: 100%;
     height: auto; 
    position: relative;
    margin-top: 128px;
}
.contactUsSection.bannerSection .bannerText p{
    width: auto;
    text-align: center;
    font-size: 45px;
}
.contactContentHead{
    padding-top: 50px;
    padding-bottom: 50px;
    background-color: #efeff7;
}
.contactContentHead h4{
        font-size: 45px;
    font-weight: bold;
    margin-bottom: 0;
}
.contactContentHead p{
           font-size: 18px;
    color: #3d3d3d;
    line-height: 31px;
    margin-bottom: 0;
    
}
.contactAddrSec{
/*        background: #d1d5e2;*/
border: 1px solid #d1d5e2;
    padding: 50px;
    border-radius: 8px;
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
}
.contactAddrSec ul li {
    margin-bottom: 35px;
}
.contactAddrSec ul li i {
        background: var(--secondaryColor);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* flex-direction: column; */
    color: var(--white);
    border-radius: 100%;
    font-size: 16px;
    margin-right: 15px
}
.contactAddrSec ul li a {
        color: #021460;
    display: flex;
    align-items: baseline;
    font-weight: 500;
    font-size: 17px;
}
.contactAddrSec ul li a span{
    display: inline-block;
    width: calc(100% - 50px);
}
.contactAddrSecHead{
        padding: 15px 40px;
    background: #021460;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
}
.contactFormTitle{
       padding: 15px 40px;
    background: #d1d5e2;
    color: var(--primaryColor);
    font-size: 20px;
    font-weight: bold;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    border-radius: 0;
    position: relative;
    margin-bottom: 20px;
}
.contactFormTitle::after{
    position: absolute;
    left: 0;
    width: 4px;
    content: '';
    height: 100%;
    background-color: var(--secondaryColor);
    top: 0;
}
#contactForm .formGroup{
    margin-bottom: 20px;
}
#contactForm .formGroup label{
color: var(--primaryColor);
}
#contactForm{
    position: relative;
}
#contactForm::after{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url('../img/glob-map.png');
    z-index: -1;
    background-size: cover;
    background-attachment: fixed;
    opacity: 0.5;
}
.branches{
    background-color: #efeff7;
}
.branchItemWrapper{
    margin-top: 80px;
}
.branchItemHead{
      font-size: 22px;
    font-weight: 500;
    color: var(--primaryColor);
    margin-bottom: 15px;
    position: relative; 
    padding: 5px 15px; 
}
.branchItemHead::after{
    position: absolute;
    left: 0;
    width: 4px;
    content: '';
    top: 0;
    height: 100%;
    background-color: var(--primaryColor);
}
.branchItem ul li{
    padding: 5px 15px;
}
.branchItem ul li i {
    background: var(--secondaryColor);
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* flex-direction: column; */
    color: var(--white);
    border-radius: 100%;
    font-size: 12px;
    margin-right: 15px;
}
.branchItem ul li a {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    font-size: 14px;
    cursor: pointer;
}
.branchItem ul li span{
    width: calc(100% - 45px);
    color: #000;
    font-weight: 500;
}
.branchItem{
        background: #fff;
    padding: 15px;
    border-radius: 8px;
    box-shadow: rgba(35, 55, 80, 0.3) 0px 6px 12px;
    margin-bottom: 20px;
}
/*Contact Page*/

/*Exchange Rate*/
#rateBoard{
    position: relative;
    background: linear-gradient(45deg, rgba(2,20,96,1) 64%, rgba(227,4,46,1) 100%);
    padding-top: 190px;
}
#rateBoard table{
    background-color: #fff;
}
#rateBoard .container{
    position: relative;
    z-index: 1;
}
#rateBoard  .sectionTitle h2{
    color: #fff;
}
#rateBoard  .smallTitle{
    color: #fff;
}
#rateBoard::after{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url('../img/about4.jpg');
    background-position: center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 0;
    opacity: 0.2;
}
.rateBoardTable{
        width: 90%;
    margin: auto;
    margin-top: 40px;
}

.rateBoardTable  .formGroup {
        width: 300px;
    margin-left: auto;
    margin-bottom: 10px;
}
.rateBoardTable thead{
    background-color: var(--primaryColor);
    color: #fff;
    border-radius: 15px;
}
.rateBoardTable td {
    font-weight: bold;
    font-size: 16px;
}
.green{
    color: green;
}
.red{
    color: var(--secondaryColor);
}
/*Exchange Rate*/

/*About Us*/
.aboutUs{
    background-color: #efeff7;
}
.aboutBoxItem{
        display: flex;
    align-items: center;
    width: 100%;
    background: white;
    min-height: 208px;
    padding: 20px;
    border-radius: 8px;
    box-shadow: rgba(35, 55, 80, 0.3) 0px 6px 12px;
}
.aboutBoxIcon img{
        height: 80px;
    margin-right: 15px;
}
.aboutUs p{
    font-size: 18px;
    line-height: 29px;
   
    margin: auto;
   margin-top: 40px;
}
.aboutUpdateContent div {
    font-size: 18px;
    line-height: 29px;
    margin: auto;
    margin-top: 20px;
}
.aboutBoxContent{
        font-size: 28px;
    font-weight: bold;
}
.locationMap:hover{
text-decoration:underline;
}
.abtPage .aboutImg{
        width: 100%;
    border-radius: 8px;
    height: 500px;
    object-fit: cover;
    border: 10px solid #fff;
}
.aboutPageSwiperSlide{
    width: 80%;
    margin: auto;
}
/*About Us*/

.exchangeRateTable tbody tr:nth-child(even) {
    background-color: #efeff7;
}

@media(min-width:1200px) and (max-width: 1399px){
.headerLogo img{
    height: 55px;
}
.bannerText p{
    width: 75%;
}
.aboutStatics{
    bottom: 30px;
}
.bannerText p{
    font-size: 55px;
    line-height: 69px;
}
.sectionTitle h2, .innerSectionTitle, .contactContentHead h4{
    font-size: 40px;
}
.aboutBoxContent{
    font-size: 26px;
}
}
@media(min-width:992px) and (max-width: 1199px){
    #exchangeRateTable{
        display:table;
    }
    .container{
        max-width: 990px;
    }
.bannerText p{
    width: 75%;
    font-size: 50px;
}
.headerLogo img{
    height: 50px;
}
.sectionTitle h2, .innerSectionTitle, .contactContentHead h4{
    font-size: 35px;
}
.aboutStatics{
    bottom: 18px;
    width: 120%;
}
.rateLable, .formGroup label, .contactAddrSec ul li a{
    font-size: 16px;
}

.aboutBoxContent{
    font-size: 22px;
}
}
@media(min-width:768px) and (max-width: 991px){

    #rateBoard{
        padding-top: 115px;
    }
    .rateBoardTable{
        width: 100%;
    }
    .mobileHeader .mobileLogo img{
        height: 55px;
    }
 .bannerText p{
    font-size: 50px;
    width: 100%;
    line-height: 63px;
    }
    .bannerItem img{
        object-fit: cover;
    }
    .sectionTitle h2{
        font-size: 30px;
        line-height: 43px;
    }
    .currencyConverterWraper{
        width: 100%;
    }
    .currencyConverterWraper .formGroup{
        margin-bottom: 20px;
    }
    .formGroupFlxWrap{
        flex-direction: column;
    }
    .formGroupFlxWrap .formGroup{
        width: 100%;
    }
    .aboutImg{
        height: 330px;
    }
   
    .interchangeBtn{
      transform: rotate(90deg);
    }
    .innerSectionTitle{
       line-height: 43px;
    font-size:  30px;
    }
    .aboutUsWrapper{
        text-align: center;
    }
    .aboutUsWrapper .themeBtn{
        margin: auto;
    }
    .smallTitle{
     margin-top: 20px;
     display: inline-block;
    }
   
    .aboutStatics{
        position: unset;
        padding: 20px;
    margin-top: 40px;
    }
    .aboutStatics ul{
        flex-direction: row;
    }
    
    .aboutStatics ul li:last-child{
        margin-bottom: 0;
    }
    .secPTB{
        padding: 50px 0;
    }
    
    .homeGraphSection .sectionTitle{
        margin-bottom: 0;
    }
    .selectCurrInfo{
        margin-top: 40px;
    }
    .footerLogo {
        height: 45px;
    }
   
    .testimonialContent{
        width: 100%;
    }
    
    .iconAnimation{
        display: none;
    }
    .footerLink{
        padding-left: 0;
    }
    
    .footerCopyRights a{
        display: block;
    }
    .bannerRatingWrap{
        font-size: 15px;
    }
    
    .contactUsSection.bannerSection{
         margin-top: 0;
    }
.contactUsSection .bannerItem img{
    height: 350px;
   
}

.deskOnly{
    display: none;
}
.aboutBoxContent {
    font-size: 18px;
}
.aboutBoxItem{
    margin-bottom: 20px;
    min-height: 150px;
}
.aboutBoxIcon img{
    height: 55px;
}
.contactUsSection.bannerSection .bannerText p{
    font-size: 40px;
}
.rateBoardTable .formGroup{
    margin: auto;
}
.rateBoardTable table{
    white-space: nowrap;
}
.rateLable{
    font-size: 16px;
}
.rateBoardTable td{
    font-size: 14px;
}
.contactContentHead h4{
        font-size: 30px;
    line-height: 43px;   
    text-align: left;
}
.contactContentHead p{
    font-size: 16px;
    text-align: justify;
}
.contactAddrSec ul li a span{
    font-size: 16px;
}
.contactAddrSec{
    padding: 25px;
}
.contactAddrSecHead{
    font-size: 18px;
    padding: 20px 25px;
}
.contactFormSec{
    margin-top: 40px;
}
.formGroup label{
    font-size: 16px;
}
}

@media(max-width:767px){
   
    #exchangeRateTable .limtStockStatus{
        left:-40px !important;
        font-size:12px;
    }
    .noStockStatus{
        font-size:12px;
    }
      #rateBoard{
        padding-top: 115px;
    }
    .rateBoardTable{
        width: 100%;
    }
    .bannerText p{
    font-size: 28px;
    width: 100%;
    line-height: 41px;
    }
    .bannerItem img{
        object-fit: cover;
    }
    .sectionTitle h2{
        font-size: 23px;
        line-height: 36px;
    }
    .currencyConverterWraper{
        width: 100%;
    }
    .currencyConverterWraper .formGroup{
        margin-bottom: 20px;
    }
    .formGroupFlxWrap{
        flex-direction: column;
    }
    .formGroupFlxWrap .formGroup{
        width: 100%;
    }
    .aboutImg{
        height: 215px;
    }
    .convertCurr{
        font-size: 15px;
    }
    .interchangeBtn{
      transform: rotate(90deg);
    }
    .innerSectionTitle{
       ine-height: 36px;
    font-size: 23px;
    }
    .aboutUsWrapper{
        text-align: center;
    }
    .aboutUsWrapper .themeBtn{
        margin: auto;
    }
    .smallTitle{
     margin-top: 20px;
     display: inline-block;
    }
    .homeAbout p{
        font-size: 16px;
        line-height: 29px;
    }
    .aboutStatics{
        position: unset;
        padding: 20px;
    margin-top: 40px;
    }
    .aboutStatics ul{
        flex-direction: column;
    }
    .aboutStatics ul li{
        width: 100%;
        margin: auto;
    text-align: center;
    margin-bottom: 30px;
    }
    .aboutStatics ul li:last-child{
        margin-bottom: 0;
    }
    .secPTB{
        padding: 50px 0;
    }
    .bannerText span{
        font-weight: 500;
        font-size: 16px;
    }
    .homeGraphSection .sectionTitle{
        margin-bottom: 0;
    }
    .selectCurrInfo{
        margin-top: 40px;
    }
    .footerLogo {
        height: 45px;
    }
    .aboutStatics ul li::after, .aboutStatics ul li::before{
        content: unset;
    }
    .testimonialContent{
        width: 100%;
    }
    .testimonialItem p{
        font-size: 16px;
    }
    .iconAnimation{
        display: none;
    }
    .footerLink{
        padding-left: 0;
    }
    .footerLink li a{
        font-size: 15px;
        font-weight: normal;
    }
    .footerCopyRights a{
        display: block;
    }
    .bannerRatingWrap{
        font-size: 15px;
    }
    .themeBtn{
        font-size: 16px;
    }
    .contactUsSection.bannerSection{
         margin-top: 0;
    }
.contactUsSection .bannerItem img{
    height: 350px;
   
}
.aboutUs p{
    width: 100%;
    font-size: 16px;
}
.aboutUpdateContent div {
        font-size: 16px;
}
.deskOnly{
    display: none;
}
.aboutBoxContent {
    font-size: 18px;
}
.aboutBoxItem{
    margin-bottom: 20px;
    min-height: 150px;
}
.aboutBoxIcon img{
    height: 55px;
}
.contactUsSection.bannerSection .bannerText p{
    font-size: 30px;
}
.rateBoardTable .formGroup{
    margin: auto;
}
.rateBoardTable table{
    white-space: nowrap;
}
.rateLable{
       font-size: 14px;
    width: 94%;
    white-space: break-spaces;
}
.rateBoardTable td{
    font-size: 14px;
}
.rateArrow {
   
    right: -11px;
}
.currName img {
    width: 25px;
    margin-right: 0;
}
.contactContentHead h4{
        font-size: 23px;
    line-height: 36px;
    margin-bottom: 20px;
    text-align: center;
}
.contactContentHead p{
    font-size: 16px;
    text-align: justify;
}
.contactAddrSec ul li a span{
    font-size: 16px;
}
.contactAddrSec{
    padding: 25px;
}
.contactAddrSecHead{
    font-size: 18px;
    padding: 20px 25px;
}
.contactFormSec{
    margin-top: 40px;
}
.formGroup label{
    font-size: 16px;
}

#exchangeRateTable tr th:last-child{
    display:none;
}
#exchangeRateTable tr td:last-child{
    display:none;
}
}


@media (min-width:1400px){
    
.rateBoardTable{
        width: 70%;
   
}

}


@media(min-width: 576px and max-width:767px){
    .container{
    max-width: 575px;
    }
}

@media(min-width:1200px){
    .table-responsive{
        display: table;
    }
}

.limStock{
    color: orange;
}
.noStock{
    color: var(--secondaryColor);
}
.rateLable{
       font-size: 16px;
    width: 220px;
    white-space: break-spaces;
}
.rateLable img:first-child{
    margin-right: 10px;
}
.rateLableHome{
    width: 100%;
}

.locationMap{
    cursor: pointer;
}
.locationMap .mapViewBtn{
        display: inline-block;
    color: red;
    margin-left: 15px;
    width: auto;
}
.limtStockStatus{
    color: #ff8000;
    display: block;
}

#exchangeRateTable td{
    position: relative;
}
#exchangeRateTable .limtStockStatus{
    position: absolute;
    right: 0;
    left: 0;
}

.noStockStatus{
color: var(--secondaryColor);
display: block;
}
.formSubmitErrorTxt{
    font-size: 12px;
    color: var(--secondaryColor);
}

.noticeExchangeRateTableHeader{
    display: flex;
}

.noticeExchangeRate {
    display: flex;
    align-items: center;
        margin-bottom: 10px;
    border-radius: 10px;
    overflow: hidden;
}
.tableRealTime{
        background: #021460;
    color: #fff;
    padding: 15px;
    font-weight: bold;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    font-size: 14px;
}
.exchangeTableNotes{
        background: #e5e7ef;
    color: #e3042e;
    padding: 15px;
    font-weight: bold;
    font-size: 13px;
}

.whatappChat{
      display: flex;
    position: fixed;
    z-index: 9999;
    bottom: 30px;
    right: 20px;
    background-color: #fff;
    align-items: center;
    padding: 8px 18px;
    border-radius: 50px;
    color: #000;
    font-size: 14px;
    font-weight: 500;
    box-shadow: 0 1px 15px rgba(32, 33, 36, 0.28);
}
.whatappChat img {
    height: 20px;
    margin-right: 8px;
}
.whatappChat:hover{
    color: var(--primaryColor);
}

@media(max-width:1199px){
    .exchangeTableNotes{
        font-size: 14px;
    }
    .tableRealTime{
        font-size: 14px;
    }
}

@media(max-width:991px){
    .noticeExchangeRateTableHeader{
        display: block;
    }
    .noticeExchangeRate{
        margin-bottom: 20px;
    }

    .exchangeTableNotes{
        font-size: 12px;
                padding: 15px 10px;
    }

    .rateBoardTable .formGroup {
        width: 100%;
        margin-bottom: 20px;
    }
}

@media(max-width:767px){
    .whatappChat{
        padding: 0;
        width: 50px;
        height: 50px;
        align-items: center;
        justify-content: center;
    }
.whatappChat span{
    display: none;
}
.whatappChat img {
    height: 30px;
    margin-right: 0px;
}

.mobDsklView{
    display: none;
}
.rateLable{
    font-size: 15px;
}
.mobCellView{
    display: inline-block;
}
.exPgCurUnit {
    display: flex !important;
    align-items: center;
    color: #6a6a6a !important;
    padding-left: 35px;
    font-weight: 500 !important;

}
.exPgCurUnit b{
    display: inline-block;
    min-width: 20px;
}
.exPgCurUnit  img{
    margin-left: 20px;
    width: 20px;
}
.rateLable{
    width: 180px;
}
.aboutPageSwiperSlide{
    width: 100%;
}
}
.mobCellView{
    display: none;
}

@media(max-width:575px){
.noticeExchangeRate{
    display: block;
    text-align: center;
}
}
/* --- WhatsApp Branch List Hover Effect --- */
#branchOptions a {
  display: block;
  color: #333;
  text-decoration: none;
  margin-bottom: 8px;
  padding: 4px 6px;
  border-radius: 5px;
  transition: background-color 0.2s ease;
}

#branchOptions a:hover {
  background-color: rgba(0, 0, 0, 0.08); /* soft grey backlight */
}