@charset "utf-8";
/*..............embedded fonts..............*/

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

/*..............embedded fonts..............*/
/*
    font-family: "Open Sans", sans-serif;
    font-family: "Roboto", sans-serif;
*/
/*..............custom fonts..............*/

/*..............custom fonts..............*/

:root{
    /* ~-~-~-~-~ common transition ~-~-~-~-~ */
    --transition-common: all 0.6s ease 0s;
    /* ~-~-~-~-~ common transition ~-~-~-~-~ */

    /* ~-~-~-~-~ colors ~-~-~-~-~ */
    --clr-primary: #7F7F7F;
    --clr-secondary: #1F4E79;
    --clr-white: #fff;
    --clr-yellow: #FFC000;
    --clr-blue-light: #BDD7EE;
    /* ~-~-~-~-~ colors ~-~-~-~-~ */

    /* ~-~-~-~-~ other adjustments ~-~-~-~-~ */
    --margin-title: 0 0 20px 0;
    --button-border-width: 1px;
    --button-border-style: solid;
    --button-broder-radius: 50px;
    --button-broder-color: #FFC000;

    /* ~-~-~-~-~ other adjustments ~-~-~-~-~ */
}

:root{
    /* ~-~-~-~-~ declare font family & weight ~-~-~-~-~ */
    --ff-base: "Roboto", sans-serif;
    --ff-title: "Open Sans", sans-serif;
    --fw-regular: 400;
    --fw-medium: 500;
    --fw-samibold: 600;
    --fw-bold: 700;
    /* ~-~-~-~-~ declare font family & weight ~-~-~-~-~ */

    /* ~-~-~-~-~ declare font size ~-~-~-~-~ */
    --f-size-XXXL: 72px;
    --f-size-XXL: 48px;
    --f-size-XL: 36px;
    --f-size-L: 30px;
    --f-size-M: 28px;
    --f-size-S: 24px;
    --f-size-Body: 20px;
    /* ~-~-~-~-~ declare font size ~-~-~-~-~ */
}

body, p{ font-family: var(--ff-base); font-weight: var(--fw-regular); font-size: var(--f-size-Body); color: var(--clr-primary);}
h1, h2, h3, h4, h5, h6{ font-family: var(--ff-title); font-weight: var(--fw-bold); color: var(--clr-secondary); margin: var(--margin-title);}

h1{ font-size: var(--f-size-XXXL);}
h2{ font-size: var(--f-size-XXL);}
h3{ font-size: var(--f-size-XL);}
h4{ font-size: var(--f-size-L);}
h5{ font-size: var(--f-size-M);}
h6{ font-size: var(--f-size-S); font-family: var(--ff-base);}
p{margin: var(--margin-title);}


/*..............common styles..............*/
body { margin: 0; padding: 0; }
img{ max-width: 100%;}
a, img{ border:0; text-decoration: none; outline: none;}
a, a:link, a:visited, a:focus, a:hover { outline: none; text-decoration: none; transition:all 0.3s ease 0s;}
a:hover{ text-decoration:none;}

input, textarea, select{ font-family: var(--ff-base); font-weight: var(--fw-regular); font-size: var(--f-size-Body); color: var(--clr-primary); outline: none;}


.text-white h1, .text-white h2, .text-white h3, .text-white h4, .text-white h5, .text-white h6, .text-white p{color: var(--clr-white);}

/* --- Button Styles --- */
.btn { border: 0; border-radius: var(--button-broder-radius); display: inline-block; vertical-align: top; background-color: var(--clr-yellow); color: #fff; font-family: var(--ff-base);
    padding: 14px 25px; font-size: var(--f-size-Body); font-weight: var(--fw-samibold); text-transform: capitalize;}
.btn-full-with{width: 100%;}

.btn.border { background: transparent; color: var(--clr-yellow); border: 1px solid var(--button-broder-color) !important; }
.btn:hover{background-color: var(--clr-secondary); color: var(--clr-white);}
.btn.border:hover{background-color: var(--clr-yellow); color: var(--clr-white);}

.btn:focus, button:focus, input:focus, textarea:focus, select:focus { outline: none; box-shadow: none;}

/* --- Button Styles --- */


/*..............common styles..............*/

.click { display:none; /*color: #000; float: right; font-size: 28px;*/     position: absolute;
    top: 0;
    right: 0;
    /*background-color: #777575;*/
    background-color: var(--clr-white);
    width: 50px;
    height: 100%;
    border-radius: 0 7px 7px 0;
    }
.main_menu a.closebtn{
    display: none;
    }
.common-padding{padding-top: 80px; padding-bottom: 80px;}
.common-padding-sm{padding-top: 40px; padding-bottom: 40px;}
.common-pic-box{border-radius: 10px; overflow: hidden;}
.blue-bg{background-color: var(--clr-secondary);}
.common-bg{background-repeat: no-repeat; background-size: cover;}

/*for header css*/
.main-header { /*padding: 30px 0 0;*/ padding: 20px 0 0; position: fixed; top: 0; width: 100%; left: 0; right: 0; z-index: 2; transition: all 0.6s ease-in-out 0s;}
.headerRow{display: flex; justify-content: space-between; align-items: center;}
.header-design{border: 1px solid var(--clr-white); border-radius: 20px; padding: 14px 40px; background-color: rgba(255, 255, 255, 0.15);}


.main-header.darkHeader .header-design { background-color: rgba(88, 118, 159, 0.8); backdrop-filter: blur(6px); padding: 7px 40px; box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.2);}
/*header.main-header.darkHeader { padding-top: 0;}*/

header.main-header.darkHeader .logo{/*width: 120px;*/ transition: var(--transition-common); animation: smoothScroll 1s forwards;}

@keyframes smoothScroll {
  0% {
    width: 195px;
  }
  100% {
    width: 120px;
  }
}

header.main-header.darkHeader .main_menu ul li{transform: scale(0.8);}

.logo { width: 160px;}
/*.main_menu { float: right; }*/
.main_menu ul { margin: 0; padding: 0; list-style: none;}
.main_menu ul li { list-style: none; display: inline-block; vertical-align: top; /*font-size: 24px;*/ font-size: 20px; font-weight: var(--fw-samibold); margin: 0 20px; text-transform: capitalize; position: relative;}
.main_menu ul li:last-child { margin-right: 0px;}
.main_menu ul li a { display: block; padding: 10px 0; color: var(--clr-white);}
.main_menu ul li:last-child a { /*padding: 10px 25px;*/ padding: 8px 25px; background-color: var(--clr-yellow); color: var(--clr-white); border-radius: var(--button-broder-radius); text-decoration: none;}
.main_menu ul li:last-child:hover a{text-decoration: none;}
.main_menu ul li:hover a, .main_menu ul li.current-menu-item a { color: var(--clr-yellow); text-decoration: underline;}
.main_menu ul li:last-child a:hover{background-color: var(--clr-secondary); color: var(--clr-white);}

.main_menu ul li.menu-item-has-children span { position: absolute; top: 12px; right: -15px; width: 10px; height: 24px;}
.main_menu ul li.current-menu-item:last-child a { color: var(--clr-white); text-decoration: none;}

/*for header css*/

.slider-wrap { position: relative;}
.slider-wrap>img{width: 100%;}
.slider-wrap:before{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; content: ""; background: linear-gradient(272deg, #1f4e79, rgb(31 78 121 / 31%), rgb(31 78 121 / 0%));}

.banner-container{position: relative;}
.banner-content{
    position: absolute;
    bottom: 230px;
    max-width: 580px;
    margin-left: auto;
    right: 12px;
}
.banner-content h1{font-weight: var(--fw-medium);}
.banner-content h1 span{color: var(--clr-yellow); font-weight: var(--fw-bold);}
.banner-btn-row a.btn:not(:last-child) { margin-right: 10px;}
.banner-btn-row .btn.border{color: var(--clr-white);}

.banner-content h6 { font-weight: var(--fw-samibold);}

/*for main sections css*/

/*main.main-section { padding: 80px 0;}*/

.slick-arrow {
    background-color: #fff;
    width: 50px;
    height: 50px;
    border-radius: 100px;
    z-index: 1;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.14);
    transition: all 0.6s ease-in-out 0s;
}
.slick-prev {
    background-image: url(../images/strategic-arrowL.png);
    background-repeat: no-repeat;
    background-position: center center;
    left: 0;
}
.slick-next {
    background-image: url(../images/strategic-arrowR.png);
    background-repeat: no-repeat;
    background-position: center center;
    right: 0;
}
/*.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus*/

.slick-prev:before, .slick-next:before{display: none;}

/*-- home-about-css(Start) --*/

.hom-about-pic>img{width: 100%;}
.badge-apart{padding: 5px 15px; background-color: var(--clr-blue-light); color: var(--clr-secondary); font-size: 16px; font-weight: var(--fw-regular); border-radius: var(--button-broder-radius); display: inline-block;}
.about-list ul{padding-left: 0; list-style: none;}
.about-list ul li{position: relative; padding-left: 20px; margin-bottom: 15px;}
.about-list ul li:before{width: 10px; height: 10px; border-radius: 50px; background-color: var(--clr-yellow); position: absolute; left: 0; top: 10px; content: "";}

/*-- hom-expertise-sec-css(Start) --*/

.hom-expertise-sec{position: relative;}
.hom-expertise-sec:before{position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ""; background-color: #F6FBFF; z-index: -2;}

.sre-top-title-row h6{color: var(--clr-primary); font-weight: var(--fw-samibold);}
.hom-exp-icon-box{padding: 30px 24px; height: 100%;}
.hom-exp-icon-row{display: flex; flex-flow: row wrap; align-items: center; margin-bottom: 20px;}
.hom-exp-icon{width: 57px; height: 57px; display: flex; align-items: center; justify-content: center; border-radius: 100%; background-color: var(--clr-blue-light);}
.hom-exp-icon-title{width: calc(100% - 57px); padding-left: 15px;}
.hom-exp-icon-title h6{margin-bottom: 0;}
.hom-exp-icon-title h6 a{color: var(--clr-white);}
.hom-exp-icon-title h6 a:hover{color: var(--clr-yellow);}

.hom-sre-pic-group{display: flex; flex-flow: row wrap; gap: 20px}
.hom-sre-pic-left{width: 41%;}
.hom-sre-pic-right{width: 56%; position: relative; padding-top: 30%; border-radius: 10px; overflow: hidden;}
.hom-sre-pic-left-half{position: relative; padding-top: 50%; border-radius: 10px; overflow: hidden;}
.hom-sre-pic-left-half img, .hom-sre-pic-right img{width: 100%; height: 100%; position: absolute; top: 0; left: 0; object-fit: cover;}
.hom-sre-pic-left-top{margin-bottom: 20px;}

.sre-accordion-design .accordion-header .accordion-button{font-size: var(--f-size-XL); color: var(--clr-secondary); background-color: transparent; box-shadow: none; padding: 0; font-weight: var(--fw-regular);}
.sre-accordion-design .accordion-header .accordion-button.collapsed{color: var(--clr-secondary);}
.sre-accordion-design .accordion-body{padding-left: 0; padding-right: 0; color: #7F7F7F;}
.sre-accordion-design .accordion-body p{ margin-bottom: 10px; color: #7F7F7F;}
.sre-accordion-design .accordion-item{border: none; margin-bottom: 30px;}
.sre-accordion-design .accordion-button:not(.collapsed) { font-weight: bold;}

.hom-sre-content-scroll { height: 300px; overflow-y: auto; direction: rtl; padding-left: 40px; padding-right: 20px;}
.sre-accordion-design .accordion{direction: ltr;}
.sre-accordion-design .accordion-button::after{background-image: url(../images/accordion-arrow.png);}
.sre-accordion-design .accordion-button:not(.collapsed)::after{background-image: url(../images/accordion-arrow.png);}
.sre-accordion-design .accordion-body p{margin-bottom: 10px;}


/*-- Custom-scroll-bar-css(Start) --*/

/* width */
::-webkit-scrollbar {
  width: 4px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: var(--clr-secondary); 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: var(--clr-primary); 
}
/*-- Custom-scroll-bar-css(End) --*/

/*-- Ready-sec-css(Start) --*/

.hom-ready-box{position: relative;}
.hom-ready-box:before{position: absolute; background-color: rgba(31, 78, 121, 0.7); top: 0; left: 0; width: 100%; height: 100%; content: "";}
.hom-ready-box .row{position: relative;}

/*-- Ready-sec-css(End) --*/

/*for main sections css*/


/*for footer sections css*/

/*footer { border-top:1px solid #f3f2f0;}*/
.ftr-top { padding: 75px 0 0;}
.ftr-logo { margin: 0 0 30px;}
.ftr-logo-content p span { display: block;}
.ftr-menu ul { margin: 0; padding: 0; list-style: none;}
.ftr-menu ul li {  text-transform:capitalize; margin-bottom: 10px; font-weight: var(--fw-samibold);}
.ftr-menu ul li a { color: #C9C9C9;}
.ftr-menu ul li a:hover, .copyrht-menu ul li a:hover, ul.adrs li a:hover{ color: var(--clr-white);}


.ftr-btm { border-top: 1px solid #C9C9C9; padding: 20px 0; margin-top: 20px;}
.ftr-btm p { margin-bottom: 0; color: #C9C9C9;}
.copyrht-menu ul { margin: 0; padding: 0; list-style: none; display: flex; flex-flow: row wrap; justify-content: flex-end;}
.copyrht-menu ul li { list-style: none; border-left: 1px solid #fff; padding: 0 10px; line-height: 16px;}
.copyrht-menu ul li:first-child { border: 0;}
.copyrht-menu ul li a { color: #C9C9C9;}


.ftr-col h4 { text-transform: uppercase; font-weight: 500;}


ul.adrs { margin: 0; padding: 0; list-style: none;}
ul.adrs li { margin: 0 0 15px; padding-left: 36px; position: relative; color:  #C9C9C9; font-weight: var(--fw-regular); word-break: break-word;}
ul.adrs li img { position: absolute; left: 0; top: 4px;}
ul.adrs li a {color:  #C9C9C9;}


/*for footer sections css*/

/*-- Inner-pages(Start) --*/
.slider-wrap.inner-banner {
    height: 500px;
    overflow: hidden;
}
.slider-wrap.inner-banner>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.inner-banner .banner-content {
    position: absolute;
    bottom: 90px;
    max-width: 580px;
    margin: 0 auto;
    right: 0;
    left: 0;
    text-align: center;
}
.inner-banner:before { background: linear-gradient(272deg, #1F4E79, rgba(31, 78, 121, 0.78));}
.inner-banner .banner-content h6{margin-bottom: 0;}

/*-- About-us-page(Start) --*/

.about-content, .broker-content{max-width: 700px; margin-left: auto;}
.about-alternate-sec .about-alternate-row:nth-child(2n + 2) .about-content{ margin-left: 0;}

.about-alternate-sec .about-alternate-row:nth-child(2n + 2) .row{ flex-direction: row-reverse;}
.about-broker-sec {
    background-color: #F6FBFF;
}
.about-pic img, .broker-pic img{width: 100%;}


/*-- About-us-page(End) --*/

/*-- Contact-us-page(Start) --*/

.contact-form-box{ background-color: #F6FBFF; border-radius: 8px; padding: 40px;}
.contact-info-box{border: 1px solid rgba(15, 22, 52, 0.15); background-color: #fff; border-radius: 10px; padding: 40px 35px; transition: var(--transition-common); height: 100%;}
.contact-info-box:hover{background-color: var(--clr-secondary);}

.contact-info-contect p,  .contact-info-contect p a{color: #414042;}
.contact-info-contect p span{font-weight: var(--fw-bold);}
.contact-info-contect p:last-child{margin-bottom: 0;}


.contact-info-box:hover .contact-info-contect p, 
.contact-info-box:hover .contact-info-contect p a{color: var(--clr-white);}

.contact-info-box:hover .contact-info-icon img{ filter: brightness(0) invert(1);}
.contact-info-icon { width: 40px; height: 45px; display: flex; justify-content: center; align-items: center; margin: 0 auto 15px;}
.contact-form-box .form-control{border: 1px solid rgba(0, 178, 255, 0.5); border-radius: 30px; height: 50px; font-weight: var(--fw-samibold);}
.contact-form-box textarea.form-control{height: auto; border-radius: 10px; resize: none;}
.form-control:focus{outline: none; box-shadow: none;}
.contact-map-sec{line-height: 0;}
.wpcf7-response-output{text-align: center;}
form.invalid .wpcf7-response-output{color: #dc3232;}
form.sent .wpcf7-response-output{color: #26872f;}
form.invalid .form-control.wpcf7-not-valid{border-color: #dc3232;}
.wpcf7-not-valid-tip{display: none;}

.contact-form-box .form-control::placeholder {
  color: #7F7F7F;
  opacity: 0.5;
}

.contact-form-box .form-control::-ms-input-placeholder {
  color: #7F7F7F;
}

/*-- Contact-us-page(End) --*/

.not-found-box{
    border: 1px solid rgba(15, 22, 52, 0.15);
    background-color: #fff;
    border-radius: 10px;
    padding: 40px 30px;
    background-color: #F6FBFF;}

body.error404 .not-found-sec {
    min-height: calc(100vh - 531px);
}
body.error404 header.main-header {
    position: relative;
}
body.error404 header.main-header .header-design {
    border: 1px solid var(--clr-white);
    background-color: rgba(88, 118, 159, 1);
}

/*Media Query css*/

@media only screen and ( min-width:1601px ) {
    .container { max-width: 1450px;}

}

/*@media only screen and ( min-width:1921px ) {

    body{max-width: 1920px!important; margin: 0 auto!important;}
    header { max-width: 1920px; margin: 0 auto; }
    
}*/

@media only screen and ( max-width:1600px ) {
    :root{
        --f-size-XXXL: 62px;
        --f-size-XXL: 40px;
        --f-size-XL: 34px;
    }
    /*--f-size-XXXL: 72px;
    --f-size-XXL: 48px;
    --f-size-XL: 36px;
    --f-size-L: 30px;
    --f-size-M: 28px;
    --f-size-S: 24px;
    --f-size-Body: 20px;*/
    .main_menu ul li{font-size: 22px;}
    .banner-content { max-width: 530px;}

    .common-padding{padding-top: 70px; padding-bottom: 70px;}
    .common-padding-sm{padding-top: 35px; padding-bottom: 35px;}
    .ftr-top { padding: 65px 0 0;}
    .hom-exp-icon-box { padding: 20px 15px;}
    .hom-sre-content-scroll { padding-left: 30px; padding-right: 15px;}
    .slider-wrap.inner-banner {height: 400px;}



}

@media only screen and ( max-width: 1500px ) {
    .banner-content { bottom: 130px;}

    :root{
        --f-size-XXXL: 52px;
        --f-size-XXL: 38px;
        --f-size-XL: 32px;
        --f-size-L: 28px;
        --f-size-M: 26px;
        --f-size-S: 22px;
        --f-size-Body: 18px;
    }
      /*--f-size-XXXL: 62px;
        --f-size-XXL: 40px;
        --f-size-XL: 34px;
        
        --f-size-L: 30px;
        --f-size-M: 28px;
        --f-size-S: 24px;
        --f-size-Body: 20px;*/
        .logo { width: 150px;}
        @keyframes smoothScroll {
          0% {
            width: 150px;
          }
          100% {
            width: 100px;
          }
        }
        .header-design { border-radius: 15px; padding: 10px 30px;}
        .main-header.darkHeader .header-design { padding: 5px 30px;}
        .main-header { padding: 20px 0 0;}
        .banner-content { max-width: 400px;}

        .common-padding{padding-top: 60px; padding-bottom: 60px;}
        .common-padding-sm{padding-top: 30px; padding-bottom: 30px;}
        .ftr-top { padding: 55px 0 0;}
        /*.ftr-btm { padding: 20px 0; margin-top: 20px;}*/
        .sre-accordion-design .accordion-item { margin-bottom: 20px;}
        

}
@media only screen and ( max-width: 1400px ) {
    :root{
        --f-size-XXXL: 48px;
        --f-size-XXL: 36px;
        --f-size-XL: 30px;
        --f-size-L: 26px;
        --f-size-M: 24px;
        --f-size-S: 20px;
        --f-size-Body: 16px;
    }
      /*--f-size-XXXL: 52px;
        --f-size-XXL: 38px;
        --f-size-XL: 32px;
        --f-size-L: 28px;
        --f-size-M: 26px;
        --f-size-S: 22px;
        --f-size-Body: 18px;*/
    .main_menu ul li{font-size: 20px;}
    .hom-sre-pic-group { gap: 19px;}
    .banner-content { bottom: 100px;}
    .logo { width: 130px;}
    @keyframes smoothScroll {
          0% {
            width: 130px;
          }
          100% {
            width: 90px;
          }
        }
    .hom-exp-icon-row { margin-bottom: 15px;}
    .hom-exp-icon { width: 47px; height: 47px; padding: 10px;}
    .hom-exp-icon-title {width: calc(100% - 47px); padding-left: 10px;}
    .hom-sre-content-scroll { padding-left: 0px; padding-right: 10px;}
    .sre-accordion-design .accordion-item { margin-bottom: 15px;}
    .slider-wrap.inner-banner {height: 350px;}

    


}
@media only screen and ( max-width: 1199px ) {
    :root{
        --f-size-XXXL: 42px;
        --f-size-XXL: 34px;
        --f-size-XL: 28px;
        --f-size-L: 24px;
        --f-size-M: 22px;
        --f-size-S: 18px;

        /*--f-size-Body: 16px;*/
    }

        /*--f-size-XXXL: 48px;
        --f-size-XXL: 36px;
        --f-size-XL: 30px;
        --f-size-L: 26px;
        --f-size-M: 24px;
        --f-size-S: 20px;
        --f-size-Body: 16px;*/
    
    .hom-sre-pic-group { gap: 15px;}
    .hom-sre-pic-left-top { margin-bottom: 15px;}
    .banner-content {max-width: 300px;}

    .common-padding{padding-top: 50px; padding-bottom: 50px;}
    .common-padding-sm{padding-top: 25px; padding-bottom: 25px;}
    .ftr-top { padding: 45px 0 0;}
    .ftr-btm { /*padding: 15px 0;*/ margin-top: 15px; }
    .hom-sre-content-scroll { padding-left: 15px;}
    .btn {padding: 10px 20px;}
    .inner-banner .banner-content { bottom: 60px;}
    .main-header { padding: 10px 0 0;}
    .logo { width: 110px;}
    .header-design { padding: 5px 30px;}
    .inner-banner .banner-content h1{margin-bottom: 10px;}
    .contact-info-box { padding: 30px 20px;}
    .contact-form-box .form-control { height: 45px;}


}
@media only screen and ( max-width:1024px ) {

    .common-padding{padding-top: 40px; padding-bottom: 40px;}
    .common-padding-sm{padding-top: 20px; padding-bottom: 20px;}
    .ftr-top { padding: 35px 0 0;}
    /*.ftr-btm { padding: 15px 0; margin-top: 15px;}*/
    

}
@media only screen and ( max-width: 991px ) {
    :root{
        --f-size-XXXL: 38px;
        --f-size-XXL: 32px;
        --f-size-XL: 26px;
        --f-size-L: 22px;
        --f-size-M: 20px;
        --f-size-S: 16px;
        
        /*--f-size-Body: 16px;*/
    }

       /* --f-size-XXXL: 42px;
        --f-size-XXL: 34px;
        --f-size-XL: 28px;
        --f-size-L: 24px;
        --f-size-M: 22px;
        --f-size-S: 18px;
        --f-size-Body: 16px;*/
        .main_menu ul li{font-size: 18px;}
        .hom-about-content, .hom-sre-content{ margin-top: 20px;}
        .hom-sre-content-scroll { padding-left: 15px; padding-right: 0;}
        .ftr-logo-content { text-align: center; margin-bottom: 40px;}
        .banner-content {bottom: 80px;}
        .hom-sre-content-scroll { /*height: 230px;*/ padding-left: 0px; height: auto; min-height: 190px;}
        .about-content, .broker-content{ margin-top: 20px; text-align: center;}
        .inner-banner .banner-content { bottom: 40px;}
        .slider-wrap.inner-banner>img { height: 300px; object-fit: cover;}
        .slider-wrap.inner-banner {height: 300px;}
        .contact-info-icon { width: 35px; height: 35px; margin: 0 auto 10px;}
            



}

@media only screen and ( min-width: 768px ) {
    .main_menu{
        display: block !important;
    }
    #mySidenav{
        width: auto !important;
    }
}
@media only screen and ( max-width: 767px ) {

    /*-- toggle-new-menu-icon to cross-icon(Start) --*/
  /*{position: relative;
  padding: 1.5rem;}*/
    .menu-toggle {
  position: absolute;
  right: 0;
  top: 0;
  /*transform: translate(0, -50%);*/
  /*height: 26px;
  width: 29px;*/
}
.menu-toggle, .menu-toggle:hover {
  color: #000;
}

.menu-toggle-bar {
  display: block;
  position: absolute;
  top: 50%;
  margin-top: -1px;
  right: 0;
  margin: 0 auto;
  left: 0;
  width: 26px;
  height: 3px;
  border-radius: 4px;
  background-color: black;
  transition: all 0.3s ease;
}
.menu-toggle-bar.menu-toggle-bar--top {
  transform: translate(0, -8px);
}
.menu-toggle-bar.menu-toggle-bar--bottom {
  transform: translate(0, 8px);
}
.nav-open .menu-toggle-bar.menu-toggle-bar--top {
  transform: translate(0, 0) rotate(45deg);
}
.nav-open .menu-toggle-bar.menu-toggle-bar--middle {
  opacity: 0;
}
.nav-open .menu-toggle-bar.menu-toggle-bar--bottom {
  transform: translate(0, 0) rotate(-45deg);
}
    /*-- toggle-new-menu-icon to cross-icon(End) --*/

    .click{
        display: block;
        cursor: pointer;
    }
    .main_menu a.closebtn{
        color: #000;
        display: block;
    }
   

    /*-- For_mob_menu(Start) --*/
    .main_menu {
        /*height: 100%;*/
    /*min-height: calc(100vh - 106px);*/
    min-height: 100vh;
    width: 100%;
    position: fixed;
    z-index: 1;
    /*top: 106px;*/
    top: 0;
    bottom: 0;
    /*background-color: rgba(255, 255, 255, 0.97);*/
    background-color: rgba(31, 78, 121, 0.97);;
    overflow-x: hidden;
    transition: 0.5s;
    /*padding-top: 60px;*/
    padding-top: 110px;
    /*z-index: 999;*/
    z-index: -1;
    right: -100%;
    }
    body.nav-open .main_menu {
    right: 0 !important;
    }

    .main_menu a {
        /*padding: 8px 8px 8px 32px;
        text-decoration: none;
        font-size: 25px;
        color: #818181;*/
        display: block;
        transition: 0.3s;
    }

    .main_menu a:hover {
        color: #333;
    }

    .main_menu .closebtn {
        position: absolute;
        top: 0;
        right: 25px;
        font-size: 36px;
        margin-left: 50px;
    }
    body.scrollOff{height: 100vh; overflow: hidden; position: relative;}
    /*body.scrollOff:before { position: fixed; top: 0; left: 0; width: 100%; height: 100%; content: ""; background-color: rgba(0, 0, 0, 0.5); z-index: 1;}*/

    .main_menu ul li:hover ul.sub-menu { display: none;}
    .main_menu ul li.menu-item-has-children.active ul.sub-menu{display: block;}
    ul.sub-menu { position: relative; left: 0; width: 100%; border-radius: 0px; top: 0px;}
    .main_menu ul li.menu-item-has-children span { top: 12px; right: 0px; width: 14px; height: 18px;}
    .main_menu ul li{display: block; margin: 0 10px;}
    .main_menu ul li:last-child { margin-right: 10px;}
    .headerRow.header-design{position: relative; border-radius: 10px; padding: 7px 20px;}
    .main-header.darkHeader .header-design { backdrop-filter: inherit; padding: 3px 20px;}
    header.main-header.darkHeader .main_menu ul li{ transform: inherit;}

    /*-- For_mob_menu(End) --*/

    :root{
        --f-size-XXXL: 32px;
        --f-size-XXL: 28px;
        --f-size-XL: 22px;
        --f-size-L: 20px;
        --f-size-M: 18px;
        /*--f-size-S: 16px;
        
        --f-size-Body: 16px;*/
        --margin-title: 0 0 15px 0;
    }

        /*--f-size-XXXL: 38px;
        --f-size-XXL: 32px;
        --f-size-XL: 26px;
        --f-size-L: 22px;
        --f-size-M: 20px;
        --f-size-S: 16px;*/

        .banner-content { max-width: inherit; position: relative; bottom: 0; right: 0; text-align: center; padding: 20px 0;}
        .logo { width: 100px;}
        @keyframes smoothScroll {
          0% {
            width: 100px;
          }
          100% {
            width: 80px;
          }
        }
        .container.banner-container{background-color: var(--clr-secondary); max-width: inherit;}
        .ftr-col{text-align: center; margin-bottom: 40px;}
        ul.adrs li img { position: relative; top: 0px; margin-right: 8px;}

        .common-padding{padding-top: 30px; padding-bottom: 30px;}
        .common-padding-sm{padding-top: 15px; padding-bottom: 15px;}
        .ftr-top { padding: 30px 0 0;}
        /*.ftr-btm { padding: 10px 0; margin-top: 10px;}*/
        .main-header { padding: 10px 0 0;}
        .hom-sre-pic-group { gap: 13px;}
        .hom-sre-pic-left-top { margin-bottom: 13px;}
        .hom-sre-pic-left-half, .hom-sre-pic-right, .common-pic-box { border-radius: 8px}
        .ftr-btm { margin-top: 0px;}
        .ftr-btm-copyrht { text-align: center; padding-top: 15px;}
        .copyrht-menu ul { justify-content: center;}
        .btn { padding: 7px 16px;}
        .inner-banner .banner-content { position: relative; bottom: 0px;}
        .inner-banner .banner-content h6{margin-bottom: 10px;}
        .slider-wrap.inner-banner>img { height: 250px;}
        .contact-info-box { padding: 25px 15px;}
        .contact-form-box .form-control { height: 40px;}
        .contact-form-box textarea.form-control{border-radius: 10px;}
        ul.adrs li{padding-left: 0;}
        .ftr-btm .row { flex-direction: column-reverse;}
        .ftr-logo { margin: 0 0 20px;}
        section.slider-wrap.inner-banner { height: auto;}
        

}
@media only screen and ( max-width: 575px ) {
    :root{
        --f-size-XXXL: 28px;
        --f-size-XXL: 26px;
        --f-size-XL: 20px;
        --f-size-L: 19px;
        --f-size-M: 17px;
        /*--f-size-S: 16px;
        
        --f-size-Body: 16px;*/
    }

       /*--f-size-XXXL: 32px;
        --f-size-XXL: 28px;
        --f-size-XL: 22px;
        --f-size-L: 20px;
        --f-size-M: 18px;
        --f-size-S: 16px;
        
        --f-size-Body: 16px;*/
        .contact-form-box { padding: 30px 20px;}
        .contact-info-box { padding: 20px 10px;}
        .ftr-col { margin-bottom: 30px;}


}
@media only screen and ( max-width: 480px ) {
    :root{
        --f-size-XXXL: 26px;
        --f-size-XXL: 24px;

        /*--f-size-XL: 20px;
        --f-size-L: 19px;
        --f-size-M: 17px;
        --f-size-S: 16px;
        
        --f-size-Body: 16px;*/
    }

    
       /* --f-size-XXXL: 28px;
        --f-size-XXL: 26px;
        --f-size-XL: 20px;
        --f-size-L: 19px;
        --f-size-M: 17px;
        --f-size-S: 16px;
        
        --f-size-Body: 16px;*/
        .hom-sre-pic-left{ width: 100%;}
        .hom-sre-pic-right { width: 100%; padding-top: 50%;}
        .hom-sre-pic-left-top { margin-bottom: 13px;}
        .hom-sre-pic-group { gap: 10px;}
        .headerRow.header-design{ padding: 7px 15px;}
        .main-header.darkHeader .header-design { padding: 3px 15px;}
        .contact-form-box { padding: 20px 16px;}
    

}
@media only screen and ( max-width: 380px ) {
    :root{
        --f-size-XXXL: 24px;
        --f-size-XXL: 22px;

        /*--f-size-XL: 20px;
        --f-size-L: 19px;
        --f-size-M: 17px;
        --f-size-S: 16px;
        
        --f-size-Body: 16px;*/
    }

        /*--f-size-XXXL: 26px;
        --f-size-XXL: 24px;

        --f-size-XL: 20px;
        --f-size-L: 19px;
        --f-size-M: 17px;
        --f-size-S: 16px;
        
        --f-size-Body: 16px;*/

}

/*Media Query css*/