@import url('https://fonts.googleapis.com/css2?family=Wix+Madefor+Display:wght@400;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;800;900&display=swap');
:root {
--color-red:#F20544;	
--color-d:#071526;
--color-m:#263440;	
--color-dblue:#002682;	
--color-lblue:#099fd7;
--color-lgray:#ebf2f8;
--color-mgray:#8FADBF;
--color-white:#ffffff;
--color-black:#ffffff;	
}
body {font-size: 25px;padding: 0;margin: 0;font-family: 'Wix Madefor Display', sans-serif; background-color:var(--color-lgray)}
p {font-family: 'Wix Madefor Display', sans-serif; font-size: 16px; line-height: 22px;}
h1, h2, h3  {font-weight:800;font-family: 'Montserrat', sans-serif;}
.color-red {color:var(--color-red);}
.text-justify {text-align: justify;}
/*===========  TOP NAV ================*/
.navbar-light .navbar-nav .nav-link {color: var(--color-mgray);}
@media (min-width : 992px) {
  .offcanvas {visibility: visible;position: relative; background: none;border: none;justify-content : end;color: var(--color-red);}
}
@media (max-width : 992px) {
  .offcanvas {width : 250px !important;}
  .offcanvas-start-lg {top: 0;right: 0;border-right : 1px solid rgba(0, 0, 0, .2);transform: translateX(-100%);}
}
.navbar-nav li a {color:var(--color-d:#071526);!important; font-size:16px; font-weight: 600; text-transform:uppercase;}
.navbar-nav .nav-link.active, .navbar-nav .show>.nav-link {color: var(--color-red)!important;}
/*===========  TOP NAV END ================*/
.slider01 {background-image: url("../images/slider/slider01.jpg"); background-position: top center; background-size: cover;}
.slider02 {background-image: url("../images/slider/slider02.jpg"); background-position: top center; background-size: cover;}
.slider03 {background-image: url("../images/slider/slider03.jpg"); background-position: top center; background-size: cover;}

.hero-slider{width:100%;max-height:90vh;margin-top: 80px; display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;z-index:0}
@media (max-width: 991px) {.hero-slider{height:600px}}
@media (max-width: 767px) {.hero-slider{height:500px}}
.hero-slider .swiper-slide{overflow:hidden;color:#fff}
.hero-slider .swiper-container{width:100%;height:100%;position:absolute;left:0;top:0}
.hero-slider .slide-inner{width:100%;height:100%;position:absolute;left:0;top:0;z-index:1;background-size:cover;background-position:center;display:flex;justify-content:center;align-items:center;text-align:left}
.hero-slider .swiper-button-prev,.hero-slider .swiper-button-next{background:transparent;width:50px;height:50px;line-height:50px;margin-top:-30px;text-align:center; opacity:0;visibility:hidden;transition:all .3s ease}
.hero-slider:hover .swiper-button-prev,.hero-slider:hover .swiper-button-next{transform:translateX(0);opacity:1;visibility:visible}
@media (max-width: 767px) {
.hero-slider .swiper-button-prev,.hero-slider .swiper-button-next{display:none}
}
.hero-slider .swiper-button-prev{left:25px;transform:translateX(50px)}
.hero-slider .swiper-button-prev:before{content:url("../images/pre.png");background-repeat: no-repeat; background-position: center center; display:inline-block;vertical-align:middle; }
.hero-slider .swiper-button-next{right:25px;transform:translateX(-50px)}
.hero-slider .swiper-button-next:before{content:url("../images/next.png");background-repeat: no-repeat; background-position: center center; display:inline-block;vertical-align:middle;}
.hero-slider .swiper-pagination-bullet{width:12px;height:12px;text-align:left;line-height:12px;font-size:12px;color:#000;opacity:.3;background:#fff;transition:all .2s ease}
.hero-slider .swiper-pagination-bullet-active{opacity:1}
.hero-slider .swiper-container-horizontal > .swiper-pagination-bullets,.hero-slider .swiper-pagination-custom,.hero-slider .swiper-pagination-fraction{bottom:30px}
.swiper-pagination{text-align:left}
.hero-slider .swiper-container-horizontal > .swiper-pagination-bullets{bottom:50px;max-width:1200px;padding:0 15px;margin:0 auto;left:50%;transform:translateX(-50%)}
.hero-style{height:850px;transition:all .4s ease}
@media screen and (min-width: 992px) {
.hero-style .container{padding-top:95px}
}
.hero-style .slide-title,.hero-style .slide-text,.hero-style .slide-btns{max-width:690px}
.hero-style .slide-title h2{font-size:100px;font-weight:600;line-height:1;color:#fff;margin:0 0 40px;text-transform:capitalize;transition:all .4s ease}
@media (max-width: 1199px) {
.hero-style .slide-title h2{font-size:75px}
}
@media (max-width: 991px) {
.hero-style .slide-title h2{font-size:50px;margin:0 0 35px}
}
.hero-style .slide-text p{opacity:.8; font-size:26px; font-weight:500;line-height:1.25;letter-spacing:normal;color:#fff;margin:0 0 40px;transition:all .4s ease}
@media (max-width: 767px) {
.hero-slider .swiper-container-horizontal > .swiper-pagination-bullets{bottom:30px}	
.hero-slider {min-height:88vh; max-height:88vh; }	
.hero-style{height:100vh;}	
.hero-style .slide-title h2 {font-size:35px;margin:0 0 30px}	
.hero-style .slide-text p {font-size:16px;font-size:1rem;font-weight:400;margin:0 0 30px}
.title-box a {font-size: 30px!important;}	
}
.hero-style .slide-btns > a:first-child{margin-right:10px}
/*===========  HOME CARD ================*/
.our-mission-con {position: relative; margin-top: -80px; z-index: 99;}
.our-mission-con .box {padding:30px;background: rgb(191,39,39); background: linear-gradient(140deg, rgba(191,39,39,1) 10%, rgba(255,0,0,1) 100%);}
.our-mission-con .box h2 {color:var(--color-white);}
.our-mission-con p {font-size:22px; line-height: 30px;}
/*===========  HOME CARD END ================*/
.text-shadow {text-shadow: 1px 1px 1px rgba(0,0,0,0.6);}
.title-animation svg {width: 100%; display: inline-block;font-family: 'Montserrat', sans-serif; font-size:110px; font-weight: 900; text-align: left;}
.title-animation .text-copy {fill:var(--color-white);stroke: white;stroke-dasharray: 6% 29%;stroke-width:4px; stroke-dashoffset: 0%;animation: stroke-offset 15s infinite linear;}
.title-animation .text-copy:nth-child(1){stroke:var(--color-red);animation-delay: -1;}
.title-animation .text-copy:nth-child(2){stroke:var(--color-dblue);animation-delay: -2s;}
.title-animation .text-copy:nth-child(3){stroke:var(--color-mblue);animation-delay: -3s;}
.title-animation .text-copy:nth-child(4){stroke:var(--color-m);animation-delay: -4s;}
.title-animation .text-copy:nth-child(5){stroke:var(--color-lblue);animation-delay: -5s;}
@keyframes stroke-offset{
	100% {stroke-dashoffset: -35%;}
}


.service-con {padding:100px 0 40px 0; position: relative;}
.service-box {background-color: var(--color-white); padding: 30px;}
.icons {font-size:120px; background: -webkit-radial-gradient(33% 100% circle, #515ECF 4%, #9B36B7 30%, #D92E7F 62%, #F15245 85%, #FED373);
	background: radial-gradient(circle at 0% 100%, #F20544 5%, #002682 85%);
	-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.title-box .title {font-size:80px; color:var(--color-dblue);}


.title-box a {font-family: 'Montserrat', sans-serif; font-size:48px; font-weight:900; letter-spacing:4px; color:var(--color-red);text-decoration: none; text-transform: uppercase; background:linear-gradient(to right, rgba(100, 200, 200, 1), rgba(100, 200, 200, 1)),linear-gradient(to right,rgba(255, 0, 0, 1),rgba(255, 0, 180, 1), rgba(0, 100, 200, 1)); background-size: 100% 3px, 0 3px;background-position: 100% 100%, 0 100%; background-repeat: no-repeat;transition: background-size 400ms;}
.service-con:hover .title-box a {background-size: 0 3px, 100% 3px;}

.grid {position: relative;clear: both;margin: 0 auto;padding: 1em 0 4em;max-width: 1000px;list-style: none;	text-align: center;}
/* Common style */
.grid figure {position: relative;float: left;overflow: hidden;margin: 10px 1%;min-width: 320px;max-width: 480px;
	min-height:250px; max-height: 250px; width:100%;height: auto;background: #3085a3;text-align: center;cursor: pointer;}
.grid figure img {position: relative;display: block;min-height: 100%;max-width: 100%;opacity: 0.8;}
.grid figure figcaption {padding:1em;color: #fff;font-size: 1.25em;	-webkit-backface-visibility: hidden;backface-visibility: hidden;}
.grid figure figcaption::before,.grid figure figcaption::after {pointer-events: none;}
.grid figure figcaption,.grid figure figcaption > a {position: absolute;top: 0;left: 0;width: 100%;	height: 100%;}
/* Anchor will cover the whole item by default */
.grid figure figcaption > a {z-index: 1000;text-indent: 200%;white-space: nowrap;font-size: 0;opacity: 0;}
.grid figure h2 {font-size:0.8em; text-transform: uppercase; }
.grid figure h2 span {font-weight: 800;}
.grid figure h2,.grid figure p {margin: 0;}
.grid figure p {letter-spacing: 1px; font-size: 68.5%;}
figure.effect-apollo {background: rgb(242,5,68);background: linear-gradient(145deg, rgba(242,5,68,1) 0%, rgba(0,38,130,1) 100%);}
figure.effect-apollo img {opacity: 0.95;-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;	transition: opacity 0.35s, transform 0.35s;	-webkit-transform: scale3d(1.05,1.05,1);transform: scale3d(1.05,1.05,1);}
figure.effect-apollo figcaption::before {position: absolute;top: 0;left: 0;width: 150%;	height: 100%;background: rgba(255,255,255,0.5);	content: '';-webkit-transition: -webkit-transform 0.6s;	transition: transform 0.6s;	-webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);	transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);}
figure.effect-apollo p {position: absolute;	left:20px;bottom: 0; margin:3em 1em;padding: 0 1em;/*	max-width: 150px;*/border-left: 4px solid var(--color-white); text-align: left; opacity: 0; -webkit-transition: opacity 0.35s;	transition: opacity 0.35s;}
figure.effect-apollo h2 {text-align: left;}
figure.effect-apollo:hover img {opacity: 0.3;-webkit-transform: scale3d(1,1,1);	transform: scale3d(1,1,1);}
figure.effect-apollo:hover figcaption::before {-webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);}
figure.effect-apollo:hover p {opacity: 1;-webkit-transition-delay: 0.1s;transition-delay: 0.1s;}

.shape1{width:100%;height:50px;position: relative;top: 0px;left: 0;}
.shape2{width:200px;height:50px;position: relative;top: 0px;right: 0; animation: move 35s linear infinite;}
@keyframes move{
  0%{right:0px;}
  50%{right:200px;}
  75%{right:100px;}
  100%{right:0%}
}
.home-service-con {background-image: url("../images/icon-1.png"); background-position: right top; background-repeat: no-repeat; background-size: 60%; background-attachment: fixed; padding-bottom:70px;}
.home-service-con .carousel-indicators {position: static!important;margin-left:0!important; margin-top:20px!important; justify-content: start!important;}
/*.home-service-con .service-con {margin-top:15%;}*/

.safe-logistic {background-image: url("../images/bg002.png"); background-position:top center; background-repeat: no-repeat; background-size:contain; padding-top: 70px; padding-bottom:80px; min-height: 650px;}

.request-quote {padding: 70px; background-color: var(--color-white); border-radius:30px; -webkit-box-shadow: 0px 0px 22px 0px rgba(0,0,0,0.15);-moz-box-shadow: 0px 0px 22px 0px rgba(0,0,0,0.15);box-shadow: 0px 0px 22px 0px rgba(0,0,0,0.15);}

.my-btn:hover{cursor: pointer}
.my-btn {outline: none;position: relative;border: none;padding:9px 50px; overflow: hidden;background: rgb(242,5,68);background: linear-gradient(129deg, rgba(242,5,68,1) 0%, rgba(0,38,130,1) 100%); color: #ffffff; border-radius: 7px;}
.my-btn:hover:before{ opacity: 1; transform: translate(0,0);}
.my-btn:before{content: attr(data-hover); position: absolute; top:.4em; left: 0; width: 100%; text-transform: capitalize;
 font-size: .8em; opacity: 0; transform: translate(-100%,0);transition: all .3s ease-in-out;}
.my-btn:hover div{opacity: 0; transform: translate(100%,0)}
.my-btn div{text-transform: capitalize;  font-size: .8em;transition: all .3s ease-in-out;}

.association {background-color:var(--color-dblue); padding: 70px 0;}
@keyframes move_wave {
    0% {
        transform: translateX(0) translateZ(0) scaleY(1)
    }
    50% {
        transform: translateX(-25%) translateZ(0) scaleY(0.55)
    }
    100% {
        transform: translateX(-50%) translateZ(0) scaleY(1)
    }
}
.waveWrapper { overflow: hidden; position: absolute;left: 0;right: 0; bottom: 0; top: 0;margin: auto;}
.waveWrapperInner {position: absolute; width: 100%; overflow: hidden; height:180px; bottom: -1px;}
.bgTop { z-index:3; opacity: 0.5;}
.bgMiddle { z-index:2; opacity: 0.75;}
.bgBottom {z-index:1;}
.wave {position: absolute; left: 0; width: 200%; height: 100%;background-repeat: repeat no-repeat; background-position: 0 bottom;transform-origin: center bottom;}
.waveTop {background-size: 50% 100px;}
.waveAnimation .waveTop {animation: move-wave 3s;-webkit-animation: move-wave 3s; -webkit-animation-delay: 1s;animation-delay: 1s;}
.waveMiddle {background-size: 50% 120px;}
.waveAnimation .waveMiddle { animation: move_wave 10s linear infinite;}
.waveBottom {background-size: 50% 100px;}
.waveAnimation .waveBottom {animation: move_wave 15s linear infinite;}

.footer {padding: 70px 0; color: var(--color-m); background-image: url("../images/wave.png"); background-repeat: no-repeat; background-position: top center; background-size: contain;}
.footer h5 {color:#000000!important;}
.footer ul {list-style-type: none;padding: 0;}
.footer .footer-link {}
.footer .footer-link a {text-decoration: none; font-size: 16px; padding: 0 15px; color: var(--color-m);transition: all .3s ease-in-out;line-height: 22px;}
.footer .footer-link a i {margin-right:10px;}
.footer .footer-link a:hover {color: var(--color-red);transition: all .3s ease-in-out; margin-left: 5px; font-weight: bold;}
#button-top {display:inline-block;width:50px;height:50px;text-align:center;border-radius:50px;position:fixed; bottom:30px; right:30px;background: rgb(191,39,39); background: linear-gradient(140deg, rgba(191,39,39,1) 10%, rgba(255,0,0,1) 100%); transition:background-color .3s,opacity .5s,visibility .5s;opacity:0;visibility:hidden;z-index:1000; text-decoration: none; line-height: 50px; color: var(--color-white);}
#button-top:hover{ cursor:pointer;background: rgb(0,38,130);background: linear-gradient(129deg, rgba(0,38,130,1) 0%, rgba(9,159,215,1) 100%);}
#button-top.show{opacity:1;visibility:visible}

.service-list li {font-size: 16px;}


@media screen and (max-width:601px) {
.shape1 {display: none;}
}





.top-header-sec {padding:220px 0 140px 0; background-image: url("../images/header-bg.jpg"); background-repeat: no-repeat; background-position: top center; background-attachment: fixed;}
.about-con-box {background-image: url("../images/about-bg001.png"); background-position: top -20px right; min-height: 550px; background-repeat: no-repeat; background-size: contain; padding: 80px 0;}
.about-con-box:after {content:""; position: absolute; }

.contactus-icons {width:70px; height:70px; display: block; text-align: center; background-color:var(--color-red); color: var(--color-white); border-radius:70px; line-height:70px;}



.item {
    background:var(--color-white);
    text-align: center!important;
    padding: 30px 25px;
    -webkit-box-shadow:0 0px 25px rgba(0, 0, 0, 0.07);
    box-shadow:0 0px 25px rgba(0, 0, 0, 0.07);
    border-radius: 20px;
    border:5px solid rgba(0, 0, 0, 0.07);
    margin-bottom: 30px;
    -webkit-transition: all .5s ease 0;
    transition: all .5s ease 0;
    transition: all 0.5s ease 0s;
	min-height: 200px;
	display: flex;
	align-items: center;
}
.item:hover{
    background:var(--color-red);
    box-shadow:0 8px 20px 0px rgba(0, 0, 0, 0.2);
    -webkit-transition: all .5s ease 0;
    transition: all .5s ease 0;
    transition: all 0.5s ease 0s;
}
.item:hover .item, .item:hover span.icon{
    background:var(--color-white);
    border-radius:10px;
    -webkit-transition: all .5s ease 0;
    transition: all .5s ease 0;
    transition: all 0.5s ease 0s;
}
.item h6 {font-size: 20px; font-weight: bold;}

.item:hover h6, .item:hover p{
    color:var(--color-white);
    -webkit-transition: all .5s ease 0;
    transition: all .5s ease 0;
    transition: all 0.5s ease 0s;
}
.item .icon {
    font-size: 40px;
    margin-bottom:25px;
    color:var(--color-red);   
    width: 90px;
    height: 90px;
    line-height: 96px;
    border-radius: 50px;
}