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

/* ----- Custom menu ----- */
.header-main .logo-area{border-right: 1px solid #FFFFFF12;height: 100%;}
.menubar{width: 100%;position: absolute;top: 60px;}
.header-main{background: linear-gradient(48deg, #041F3D 78%, #765c0091);padding: 0 30px;border-radius: 6px;height: 91px;display: flex;align-items: center;}
#menu{position:relative; justify-content: end;height: 100%;}
#menu ul{list-style:none;margin:0;padding:0;height: 100%;white-space: nowrap;}
#menu ul li{display:inline-block;position:relative;margin: 0 30px;height: 100%;}
header a{color: var(--text-wight);}
#menu ul li a{color: #ffffff3f;font-size: 18px;font-family: Agrandir-bold;height: 100%; display:flex;align-items: center; position:relative; -webkit-transition:all .3s linear;transition:all .3s linear; font-weight:400;}
#menu > ul > li:last-child > a {padding-right:0;}
#menu > ul > li:last-child .btn {text-align: center; padding: 8px 25px;}
#menu li > a:after { content: '\F282'; font-family: bootstrap-icons; margin-left:5px; }
#menu li > a:only-child:after { margin-left: 0; content: ''; }
#menu ul li a:hover,#menu ul li.active a,#menu ul li.current_page_item>a,#menu ul li.current-menu-ancestor>a,#menu ul li.current-menu-item>a,#menu ul li.current-menu-parent>a{color: var(--text-wight);}
#menu li.active ul li a{color:var(--text-primary);background:#fff;}
#menu li.active ul li a:hover{color: #333;background:#fff;}
#menu li>ul{position:absolute;left:0;top:100%;z-index:999;min-width:220px;white-space:nowrap;}
#menu ul li.active ul li a { background:#fff; color:#333;}
#menu li>ul li{background:#fff;border-bottom:1px solid rgba(0,0,0,0.09);display:block;position:relative; margin:0; text-align:left;}
#menu li>ul li:hover{background:#25beac;border-bottom:1px solid rgba(0,0,0,0.09)}
#menu li>ul li a{color:#333;font-size:13px; padding:10px 15px;  border-right:0;}
#menu li>ul li a:hover{color:#fff;text-decoration:none}
#menu li ul li.current_page_item>a,#menu li ul li.current-menu-ancestor>a,#menu li ul li.current-menu-item>a,#menu li ul li.current-menu-parent>a{background: #333;color:#fff}
#menu>li{border-left:1px solid #999}
#menu>li:first-child,#menu>li.has-submenu+li{border-left:0}
#menu li>ul>li>ul{position:absolute;left:100%;top:0;transition:all linear .2s 0s;-webkit-transition:all linear .2s 0s;visibility:hidden;opacity:0}
#menu li>ul>li:hover>ul{visibility:visible;opacity:1;display:block}
#menu li>ul{transition:all linear .2s 0s;-webkit-transition:all linear .2s 0s;visibility:hidden;opacity:0}
#menu li:hover>ul{visibility:visible;opacity:1}
#menu li>ul li a{padding:0 23px;transition: 0.2s;}
#menu li:hover>ul li a{padding:10px 23px}
#menu li>ul li:hover a {color:#fff;}
#menu li>ul li:hover ul li a {color:var(--dark);}
#menu li>ul li ul li a:hover {color:#ff9e00;}
.top_right {float: right;}
.top_right ul {list-style: none;margin: 0;padding: 0;}
.top_right ul li {display: inline-block;}
.top_right ul li+li {margin-left: 12px;}
.top_right ul li a {color: var(--info); text-decoration: none;}
.top_right ul li a:hover {color: var(--secondary); text-decoration: none;}
.top_right ul li a:hover svg {fill: var(--secondary); stroke: var(--secondary);}
.top_right_contents i{
    color: var(--text-dark);
}
#menu ul li a::after{
    content: "";
    width: 0;
    height: 4px;
    background-color: var(--text-secondery);
    position: absolute;
    top: -3px;
    left: 0;
    transition: 0.2s;
}
#menu ul li a:hover:after{
    width: 100%;
}

/* scroll-top-sticky-manu-bar */

@keyframes menu_sticky {
0%   {margin-top:-240px;}
50%  {margin-top: -90px;}
100% {margin-top: 0;}
}
.menubar.sticky {margin:0;  position: fixed; top: 30px; left:0; width:100%; z-index:99999; animation-name:menu_sticky; animation-duration: 0.60s; animation-timing-function:ease-out;}

.header-main .top-contact{
    width: 100%;
    justify-content: end;
    height: 100%;
    display: flex;
    align-items: center;
    border-left: 1px solid #FFFFFF12;
}
.header-main .top-contact i{
    color: #ffffff62;
    margin-right: 10px;
    font-size: 20px;
}
.header-main .top-contact h6{
    font-size: 12px;
    color: #ffffff85;
}
.header-main .top-contact a{
    font-family: Agrandir-bold;
}
.header-main .top-btn{
    width: 40px;
    height: 40px;
    border: 1px solid #ffffff5d;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin-left: 30px;
    transition: .4s;
}
.header-main .top-btn i{
    margin-right: 0;
    color: #fff;
    font-size: 15px;
    transition: .5s;
}
.header-main .top-btn:hover{
    background-color: #fff;
}
.header-main .top-btn:hover i{
    color: var(--text-color-1);
}
/*---- Custom menu end -----*/

/* Css Colors Variables */

:root{
    --text-primary: #041F3D;
    --text-secondery: #FFD84F;
    --text-color-1: #003973;
    --text-dark: #000000;
    --text-wight: #ffffff;
}
body{
    overflow-x: hidden;
}
/* Text Size */

h1,h2,h3,h4,h5,h6{
    color: var(--text-wight);
}
h1{
    font-size: 80px;
    line-height: 72px;
    font-family: Agrandir-bold;
    color: var(--text-wight);
}
h2{
    font-size: 56px;
    font-family: Agrandir-bold;
    line-height: 79.2px; 
    color: var(--text-color-1);
    margin: 0;
}
h3{
    font-size: 40px;
    line-height: 56px;
    color: var(--text-color-2);
    margin: 0;
    font-weight: 400;
}
h4{
    font-size: 32px;
    line-height: 38px;
    color: var(--text-color-1);
    font-family: Agrandir-bold;
    margin: 0;
    font-weight: 400;
}
h5{
    font-size: 25px;
    color: var(--text-primary);
    line-height: 30.4px;
    font-family: Agrandir-bold;
    margin: 0;
}
h6{
    font-size: 16px;
    font-weight: 500;
    font-family: Agrandir-bold;
    padding: 0 ;
    margin: 0;
}
p{
    font-size: 21px;
    line-height: 33px;
    padding: 0;
    margin: 0;
    color: #002c5f80;
    font-family: "Cabin", sans-serif;
}

/* Default Css */

a{
    text-decoration: none;
}
ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
section{
    padding: 70px 0;
}

/* Buttons */

.btn-1{
    background-color: var(--text-wight);
    min-width: 248px;
    height: 65px;
    width: fit-content;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: bolder;
    color: var(--text-color-1);
    border-radius: 5px;
    transition: .3s;
}
.btn-1:hover{
    transform: scale(1.1);
    background-color: var(--text-secondery);
}
.btn-2{
    padding: 20px 40px;
    font-size: 18px;
    font-weight: bolder;
    color: var(--text-wight);
    transition: .3s;
}
.btn-2:hover{
    transform: scale(1.1);
    color: var(--text-secondery);
}

/* Home Css */

.hero-banner{
    height: 800px;
    display: flex;
    align-items: center;
    background-image:linear-gradient( to right,  #091b32 30%, #091b324f), url(./images/banner/bg-banner.jpeg);
    background-position: right;
    background-size: cover;
}
.hero-banner h1{
    max-width: 70%;
    font-size: 64px;
}
.hero-banner h1 span{
    color: var(--text-secondery);
    font-family: Agrandir-bold;
}
.hero-banner p{
    max-width: 600px;
    color: #ffffff71;
}
.hero-banner .banner-btn{
    display: flex;
    align-items: center;
    margin-top: 40px;
    flex-wrap: wrap;
}
.heading{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}
.heading span{
    width: fit-content;
    background-color: #ffd84f;
    padding: 10px 10px 8px;
    border-radius: 3px;
    line-height: 10px;
    color: var(--text-color-1);
    font-family: Agrandir-bold;
    margin-bottom: 10px;
    display: block;
}
.heading p{
   max-width: 700px;
}
.about-us .about-grid{
display: flex;
flex-wrap: wrap;
column-gap: 100px;
row-gap: 50px;
align-items: center;
justify-content: center;
margin-top: 80px;
}
 
.about-grid .about-box{
    width: 350px;
    max-height: 280px;
    /* overflow: hidden; */
    transition: .4s;
}
.about-grid .about-box span{
    width: 55px;
    height: 55px;
    background-color: #FFD84F;
    display: flex;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    font-size: 27px;
    color: #003973;
    transition: .3s;
}
.about-grid .about-box:hover span{
    transform: scale(1.1);
}
.about-grid .about-box h5{
    margin: 30px 0 20px;
    color: var(--text-color-1);
}

.about-box .arrow-btn{
    font-family: Agrandir-bold;
    font-size: 20px;
    transition: .4s;
    margin-top: 20px;
    display: block;
    opacity: 0;
    transition: .3s;
}
.about-grid .about-box:hover{
    transform: translateY(-30px);
}
.about-box:hover .arrow-btn{
    transform: translateY(-7px);
    opacity: 1;
}
.services .service-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit , minmax(350px , 1fr));
    grid-gap: 40px;
    margin-top: 70px;
}
.service-grid .services-box{
    background-color: #F5F7FA;
    border-radius: 20px !important;
    padding: 20px;
    position: relative;
    min-height: 237px;
    display: flex;
    justify-content: end;
    transition: .3s linear !important;
    cursor: pointer;
    border: none;
    box-shadow: rgba(17, 12, 46, 0.15) 0px 0px 0px 0px;
}
.service-grid .services-box:hover{
    background-color: #FFD84F;
    box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
}
.service-grid .services-box img{
    position: absolute;
    right: 20px;
    top: 20px;
    transition: .5s;
}
/* .service-grid .services-box:hover img{
    transform: scale(1.1);
} */
.card {
    transform: rotateX(0) rotateY(0);
    transform-style: preserve-3d;
    transition-duration: 0.1s;
    transition-timing-function: ease !important;
    backface-visibility: hidden;
    will-change: tranform;
}
 .card.is-out {
    transform: rotateX(0) rotateY(0) !important;
    transition-duration: 1s;
}
footer{
    background:linear-gradient( #0C2035 ,  #0C2035);
    padding: 200px 0 40px;
    position: relative;
}
footer::after{
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    background: url(./images/icons/patt-1.png);
    left: 0;
    top: 0;
    z-index: 1;
    background-size: 45px auto;
    opacity: .1;
}
footer .footer-top{
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #FFFFFF33;
    padding-bottom: 60px;
    z-index: 5;
    position: relative;
    flex-wrap: wrap;
}
footer .footer-top h3{
    font-size: 80px;
    font-family: Agrandir-bold;
    color: var(--text-wight);
    line-height: 80px;
}
footer .footer-top h3 span{
    color: var(--text-secondery);
    font-family: Agrandir-bold;
}
footer .footer-main{
    padding: 70px 0;
    border-bottom: 1px solid #FFFFFF33;
    z-index: 5;
    position: relative;
}
.footer-main .logo-area .effect{margin-top: 5px;}
footer .footer-main > div{
    margin-top: 20px;
}
footer .footer-main ul{
    margin-top: 30px;
}
footer .footer-main ul li{
    margin-top: 24px;
}
footer .footer-main ul li a{
    color: #ffffff6c;
    transition: .3s;
    display: flex;
    width: fit-content;
}
footer .footer-main ul li a:hover{
    color: var(--text-secondery);
}
footer .footer-main ul li a i{
    margin-right: 15px;
    color: var(--text-secondery);
}
footer .copy-right{
    position: relative;
    z-index: 5;
}
footer .copy-right p{
    font-size: 14px;
    line-height: 20px;
    color: #ffffff6c;
    padding: 30px 0 0;
}
.contact-us{
    transform: translateY(100px);
    position: relative;
    z-index: 6;
}
.contact-us form{
    background-color: #FBFCFC;
    border-radius: 30px;
    padding: 50px;
}
.contact-us h3{
    color: var(--text-color-1);
    font-family: Agrandir-bold;
    font-size: 50px;
    margin-bottom: 10px;
}
.contact-us form textarea,
.contact-us form input{
    width: 100%;
    height: 45px;
    outline: none;
    border: 1px solid #003a7360;
    padding-left: 15px;
    border-radius: 5px;
}
.contact-us form textarea{
    resize: none;
    height: 200px;
}
.contact-us form label{
    color: #003973;
    font-family: Agrandir-bold;
    margin-top: 10px;
}
.contact-us form input::placeholder{
    color: #9999998c;
}
.contact-us .submit-btn{
    width: fit-content;
    min-width: 200px;
    height: 60px;
    background-color: var(--text-secondery);
    font-family: Agrandir-bold;
    color: var(--text-color-1);
    font-size: 20px;
    border: 1px solid var(--text-secondery);
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 5px;
    margin: 10px auto 0;
    transition: .3s;
}
.contact-us .submit-btn:hover{
    transform: scale(1.1);
}

   /* ali_our_project_sec */
.our_project_sec{padding: clamp(1.25rem, 2.586vw + 0.668rem, 3.125rem) 0;}
.our_project_sec .heading h5{color: var(--text-color-1);font-size:18px;}
.our_project_sec .heading span{background-color:transparent;color: #5a96e3;}
.our_project_sec .projec_logo{display: flex;align-items: center;flex-wrap: wrap;margin-top: clamp(1.25rem, 1.923vw + 0.817rem, 3.125rem);justify-content: space-around;}
.projec_logo img{width: 14%;}
.trusted_services_sec{background:#F5F7FA;}
.trusted_services_sec .heading{text-align: start;gap: 10px;}
.trusted_services_sec .heading h2{font-size: clamp(2.5rem, 2.807vw + 1.868rem, 4.5rem);line-height: clamp(0.5rem, 1.807vw + 1.868rem, 4.5rem);}
.count_project{display: flex;width: 100%;margin: 25px 0 0 0;justify-content: space-between;}
.count_project .count_box{display: flex;background: var(--color-1);flex-direction: column;padding:10px 0;justify-content: center;border-radius: 24px;width: 33.5%;}
.count_project .count_box p{line-height:21px;}
.trusted_image{width: 100%;height:65%;background-image: url(images/poster/pins.svg), url(images/poster/route.svg), url(images/poster/vehicle.png);background-position: top center,bottom center,bottom left;background-repeat: no-repeat, no-repeat, no-repeat;background-size:contain,cover;display: flex;min-height: 250px;}
.national_partner_sec{background:#092949;color: var(--text-wight);}
.national_partner_sec p{color:#FFffff91;}
.national_partner_sec .heading h2{color: var(--text-wight);}
.testiomonial_box{display: flex;flex-direction: column;width:100%;padding: 60px 45px;gap: 20px;background:rgba(255, 254, 254, 0.01); border-radius: 24px;height: 100%;}
/* .product-slider .owl-item img {width:60%;height: auto;} */
.testiomonial_box p{font-size: 22px;color: #FFffff91;transition: .3s linear;}
.testiomonial_box span{font-size: 18px;color: #FFffff91;transition: .3s linear;}
.national_partner_sec .heading{margin-bottom:clamp(1.25rem, 1.923vw + 0.817rem, 3.125rem) ;}
.testiomonial_box:hover p,.testiomonial_box:hover span{color: var(--text-wight);}
.testiomonial_box .logo{width: 260px;height: 50px;display: flex;}
.testiomonial_box .logo img{width:30%;object-fit: contain;}

.product-slider .owl-nav.disabled { position:absolute;
    width: 116%;
    height: fit-content;
    display: flex ;
    justify-content: space-between;top: 0%;
    left: -8%;
    bottom: 0;
    margin: auto;}
.product-slider .owl-next,.product-slider .owl-prev{font-size: 20px !important;color:#FFffff91 !important;background: transparent !important;border: 1px solid #FFffff91 !important;border-radius: 50% !important; width: 50px !important;height: 50px !important;}

.product-slider .owl-next:hover,.product-slider .owl-prev:hover{background: var(--text-wight) !important;color: #000000 !important;}
.note_box{border-radius: 64px;border: .5px solid #FFffff91; width: fit-content;padding: 5px 15px;margin:clamp(1.25rem, 1.923vw + 0.817rem, 3.125rem) auto ;text-align: center;}
.note_box span{font-size: 14px;}
.note_box span a{color: var(--text-secondery);text-decoration: underline;}
.footer-main .logo-area img{height:50px;}
footer .copy-right p a{color: var(--text-wight);}
footer .copy-right p a:hover{color: var(--text-secondery);}

.transportation h2{
    max-width: 75%;
    font-size: 48px;
    line-height: 72.2px;
}
.transportation .service-grid{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;

}
.transportation .service-grid .services-box{
    max-width: 31%;
}
.med-transport h2{
    max-width: 75%;
    font-size: 48px;
    line-height: 72px;
}
.med-transport .med-group{
    margin-top: 20px;
}
.med-transport .med-group h4{
    font-size: 28px;
    text-align: center;

}
/* .med-transport .med-group .about-grid{
    margin-top: 70px;
} */
.appointment .heading h2{
    font-size: 54px;
}
.appointment img{
    max-width: 100%;
}
.appointment ul{
    margin-top: 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.appointment ul li{
    width: 33%;
    margin-bottom: 20px;
    color: #003973;
    display: flex;
}
.appointment ul li::before{
    content: "\f058";
    font-family: FontAwesome;
    margin-right: 10px;
    color:  #003973;
}
.appointment p{
    color: #003973;
}
.appointment p+span{
    color: #003973;
    display: block;
    margin-top: 20px;
    font-size: 21px;
}
.transportation .services-box img{
    width: 100%;
    height: 200px;
    object-fit: cover;
    position: relative;
    right: 0;
    top: 0;
    margin-bottom: 20px;
    border-radius: 20px;
    border: 3px solid var(--text-color-1);

   
}
.transportation .services-box{
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 300px;
    justify-content: start;
    padding: 15px;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}
.transportation .services-box h4{
    font-size: 27px;
}

.med-group .about-box img{
    max-width: 100%;
    object-fit: cover;
    object-position: right;
    

}
.med-group .about-box .image{
    border-radius: 100%;
    overflow: hidden;
    width: 200px;
    height: 200px;
    margin: auto;
    display: flex;
    box-shadow: rgba(0, 0, 0, 0.473) 1.95px 1.95px 2.6px ;
    backdrop-filter: drop-shadow(21px 11px 42px black);
}
.med-group .about-box .text{
    background: #fff;
    padding: 25px 20px;
    text-align: center;
}
.med-group .about-box .text h5{
    margin: 0 0 20px ;
}
.med-group .about-box{
    padding-top: 20px;
    max-height: none;
    height: 490px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}