body{ font-family: Myriad Pro; }

.banner-section{ background-image: url(../../../public/images/logistics/background-img.png); background-position: center; background-size: cover; background-repeat: no-repeat; background-attachment: fixed; height: 655px;}
.banner-section .container .overview-section .main-content h2{ font-size: 100px; font-weight: 800; color: #ffffff; }
.banner-section .container .overview-section .main-content p{ font-size: 15px; font-weight: 400; color: #ffffff; }
.banner-section .container .overview-section .main-content{ text-align: center; }
.banner-section .container .overview-section{text-align: center; margin: 0 auto; top: 0; left: 0; bottom: 0; right: 0; justify-content: center; display: flex; flex-direction: column; position: absolute; }
.banner-section .container .overview-section .main-content .modal .imgcontainer p{ margin: 50px 50px; font-weight: 400; font-size: 15px; color: #000000; }
.banner-section .container .overview-section .main-content button {border: 2px solid #fb7d35; border-radius: 20px; background-color: #fb7d35; color: #ffffff; padding: 10px 40px; font-size: 17px; font-weight: 400; margin: 8px 0;  cursor: pointer; width: 100%; }
.banner-section .container .overview-section .main-content button:hover {transition: all 0.8s; background-color: #00000087; border: 2px solid #fb7d35; color: #fb7d35 }
.banner-section .container .overview-section .main-content .modal {display: none; /* Hidden by default */ position: fixed; /* Stay in place */ z-index: 10000; /* Sit on top */ left: 0; top: 0; width: 100%; /* Full width */ height: 100%; /* Full height */ overflow: auto; /* Enable scroll if needed */ background-color: rgb(0,0,0); /* Fallback color */ background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ padding-top: 60px; }
.banner-section .container .overview-section .main-content .modal .modal-content {background-color: #fefefe; margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */ border: 1px solid #888; width: 80%; /* Could be more or less, depending on screen size */ }
.banner-section .container .overview-section .main-content .modal .imgcontainer .close {position: absolute; right: 25px; top: 10px; color: #000; font-size: 35px; font-weight: bold; }
.banner-section .container .overview-section .main-content .modal .imgcontainer .close:hover, .close:focus {color: #fb7d35; cursor: pointer; }
.banner-section .container .overview-section .main-content .modal .animate {-webkit-animation: animatezoom 0.8s; animation: animatezoom 0.8s; }
@-webkit-keyframes animatezoom {from {-webkit-transform: scale(0)} to {-webkit-transform: scale(1)} }
@keyframes animatezoom {from {transform: scale(0)} to {transform: scale(1)} }
.banner-section .container .overview-section .main-content button:focus { outline: none;}


.custom-aap{ margin-top: 50px; }
.custom-aap .container .image-section img{ width: 100%; }
.custom-aap .container .main-content h2{ font-size: 35px; font-weight: 800; color: #000000; }
.custom-aap .container .main-content .developer-text{ color: #fb7d35; }
.custom-aap .container .main-content p{ font-weight: 400; font-size: 15px; color: #000000; }
.custom-aap .container .row-section{ align-items: center; }


.challenge-solution .main-section .main-content h2{ font-size: 35px; font-weight: 800; color: #ffffff; }
.challenge-solution{ background-color: #fb7d35; margin-top: 50px;  height: 460px; padding-top: 50px;}
.challenge-solution .main-section .main-content p{ font-size: 15px; font-weight: 400; color: #ffffff; }
.challenge-solution .main-section .image-section img{ width: 100%;  position: absolute; z-index: 100; padding: 20px }
.challenge-solution .main-section .content h2{ font-size: 25px; font-weight: 500; color: #000000; }
.challenge-solution .main-section .content p{ font-size: 15px; font-weight: 400; color: #000000; }
.challenge-solution .main-section .content{ text-align: right; }
.challenge-solution .main-section .image-section-2 img{ width: 78%;  padding: 20px; }
.challenge-solution .main-section .image-section-2{ text-align: right; }


.real-chat .container .image-section img{ width: 100%; padding: 20px; }
.real-chat{ margin-top: 120px; }
.real-chat .container .content h2{ font-weight: 500; font-size: 25px; color: #000000; }
.real-chat .container .content p{ font-weight: 400; font-size: 15px; color: #000000; }
.real-chat .container .content{ padding: 90px 30px; }


.help-to-build{ margin-top: 50px; padding: 100px 0px; background-image: url(../../../public/images/logistics/help-to-build.png); background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; }
.help-to-build .container .main-content h2{ font-weight: 800; font-size: 35px; color: #ffffff; }
.help-to-build .container .main-content p{ font-weight: 400;font-size: 15px; color: #ffffff }
.help-to-build .container .main-content{ text-align: center; }


.understant-samosys{ background-color: #fb7d35; }
.understant-samosys .container-fluid .content-section p{ padding: 40px; font-weight: 400; font-size: 15px; color: #ffffff; }
.understant-samosys .container-fluid .images-sec img{ width: 100%; }
.understant-samosys .container-fluid .col-md-6{ margin: 0px; padding: 0px; }
.understant-samosys .container-fluid .row-section{ align-items: center; }
.understant-samosys .container-fluid .content h2{ font-weight: 800; font-size: 35px; color: #ffffff; }
.understant-samosys .container-fluid .content p{ font-weight: 400; font-size: 15px; color: #ffffff; }
.understant-samosys .container-fluid .content{ padding: 40px; }
.understant-samosys .container-fluid .content h3{ font-weight: 500; font-size: 25px; color: #ffffff; }


.section-col{ margin-top: 50px; margin-bottom: 50px; }
.section-col .container .main-section{height: 215px; border: 1px solid #fb7d35; }
.section-col .container .main-section .content h2{ font-weight: 500; font-size: 25px; color: #000000; }
.section-col .container .main-section .content p{ font-weight: 400; font-size: 15px; color: #000000; }
.section-col .container .main-section .content{ padding: 30px; }
.section-col .container .main-section:hover{  box-shadow: 0 4px 8px 0 rgb(251 125 53 / 29%), 0 6px 20px 0 rgb(251 125 53 / 10%); }


.why-choose-us{  background-color: #fb7d35;  }
.why-choose-us .container .images-sec img{ width: 100%; }
.why-choose-us .container .main-content h2{ font-weight: 800; font-size: 35px; color: #ffffff }
.why-choose-us .container .main-content p{ font-weight: 400; font-size: 15px; color: #ffffff; }
.why-choose-us .container .row-section{ align-items: center; }


.taxi-app-developer{ padding: 80px 0px; background-image: url(../../../public/images/logistics/taxi-developer.png); background-position: center; background-attachment: fixed; background-repeat: no-repeat; background-size: cover; }
.taxi-app-developer .container .content{ text-align: center; }
.taxi-app-developer .container .content h2{ font-size: 35px; font-weight: 800; color: #ffffff; }
.taxi-app-developer .container .content p{ font-weight: 400; font-size: 15px; color: #ffffff; }


.what-do{ padding: 50px 0px; }
.what-do .container .content h2{ font-weight: 800; font-size: 35px; color: #000000; }
.what-do .container .content{ text-align: center; }
.what-do .container .content p{ font-weight: 400; font-size: 15px; color: #000000; }
.what-do .container .content .seamless{ font-weight: 400; font-size: 25px; color: #000000; }


.automation{  background-color: #fb7d35; }
.automation .container .content-sec h2{ font-weight: 800; font-size: 35px; color: #ffffff; }
.automation .container .content-sec p{ font-size: 15px; font-weight: 400; color: #ffffff; }
.automation .container .images-sec img{ width: 100%; }
.automation .container .row-section{ align-items: center; }
.automation .container .content-sec .automation-point{ font-weight: 600; font-size: 20px; }



/*****************************************************Responsive******************************************************/


@media(max-width: 1920px){

.banner-section {height: 970px; }
.banner-section .container .overview-section {height: 970px; }
}

@media( max-width: 1640px){

.banner-section .container .overview-section {height: 870px; }
.banner-section {height: 870px; }
}

@media( max-width: 1440px){

.banner-section {height: 670px; }
.banner-section .container .overview-section {height: 670px; } 

}

@media(max-width: 1180px){

.banner-section .container .overview-section {height: 570px; }
.banner-section {height: 570px; }
.understant-samosys .container-fluid .content {padding: 25px; }


}

@media(max-width: 800px){

.challenge-solution .main-section .image-section img {display: none; }
.real-chat .container .content {padding: 7px 30px; }
.custom-aap .container .main-content h2 {font-size: 25px; } 
.custom-aap .container .main-content p { font-size: 13px;}
.challenge-solution .main-section .main-content h2 { font-size: 25px;}
.challenge-solution .main-section .main-content p {font-size: 13px; font-weight: 400; color: #ffffff; }
.challenge-solution .main-section .content p { font-size: 13px;}
.real-chat .container .content p { font-size: 13px;}
.help-to-build .container .main-content h2 {font-size: 25px;}
.help-to-build .container .main-content p { font-size: 13px;}
.understant-samosys .container-fluid .content-section p { font-size: 13px;}
.understant-samosys .container-fluid .content h2 { font-size: 25px;}
.understant-samosys .container-fluid .content p { font-size: 13px;}
.section-col .container .main-section .content h2 { font-size: 20px;}
.section-col .container .main-section .content p { font-size: 10px;}
.why-choose-us .container .main-content h2 { font-size: 25px;}
.why-choose-us .container .main-content p { font-size: 13px;}
.taxi-app-developer .container .content h2 { font-size: 25px;}
.taxi-app-developer .container .content p { font-size: 13px;}
.what-do .container .content h2 { font-size: 25px;}
.what-do .container .content p { font-size: 13px;}
.automation .container .content-sec h2 { font-size: 25px;}
.automation .container .content-sec p { font-size: 13px;}

}


@media(max-width: 767px){

.challenge-solution .main-section .content {text-align: left; }
.challenge-solution .main-section .image-section-2 {text-align: left; }
.challenge-solution .main-section .image-section-2 img {width: 65%; padding: 20px; }
.real-chat .container .image-section img {width: 100%; padding: 20px; margin-top: 30px; }
.section-col .container .main-section {  margin: 20px;}
.section-col .container .main-section .content p {font-size: 13px; }
.section-col .container .main-section .content {padding: 42px; text-align: center; }
.why-choose-us .container .main-content {margin: 20px; }

}

@media(max-width: 320px){

.challenge-solution {
    background-color: #fb7d35;
    margin-top: 50px;
    height: 490px;
    padding-top: 50px;
}

}