/*Header*/
.navbar{width: 100%;float: left;padding: 0;background-color: #fff;position: fixed;z-index: 1000;display: flex;}

.backdrop-blur {--tw-backdrop-blur: blur(8px);opacity: .9;}
a.navbar-brand {width: 40%;}
.navbar-brand img{width: 40%;float: left;}
.navbar-nav{float: right;}
.navigation{text-align: end;}
.nav-item .nav-link{color:#226427;font-size: 16px;font-weight: 700;text-transform: uppercase;}
.navbar-light .navbar-nav .nav-link {color: #226427;}
.navbar-light .navbar-nav .nav-link:hover {color: #ffc20f;}
.navbar-light .navbar-nav .nav-link.active{color: #ffc20f;}

.nav-item .nav-link:hover{color:#226427;font-weight: 700;text-transform: uppercase;transition: all ease .2s;}
.nav-item-button{float: left;}
.nav-item-button a{background-color: #226427;color: #fff;border: 1px solid #226427;border-radius: 0;padding: 10px 15px;text-decoration: none;}
/*Home*/
.main-banner{width: 100%;float: left;padding:40px 0;position: absolute;top: 0;left: 0;z-index:999;overflow: hidden;margin-top: 75px;}
.main-banner{width: 100%;float: left;background-image: url(../img/1717077880570.png);padding: 100px 20px;text-align: left;
background-position: center;background-repeat: no-repeat;position: relative;background-size: cover;overflow: hidden;}
.main-banner .overlay{ width: 100%;height: 100%;background-color: rgb(34,100,39,.6);position: absolute;top: 0;left: 0;overflow: hidden;}
.banner-content{float: left;margin-bottom: 20px;vertical-align: middle;}
.banner-content h1{font-size: 50px;color: #fff;font-weight: 800;margin-bottom: 40px;position: relative;z-index: 1}
.banner-content button {background-color: #ffc20f;font-size: 15px;color: #000;padding: 15px 15px;border: none;margin: 0 10px;font-weight: 700;margin-bottom: 20px;z-index: 1;position: relative;}
.banner-content button:hover{background-color: #226427;transition: all ease .1s;color: #fff;transition: all ease .3s;}
.sliderform{position: relative;background-color: rgba(255,194,15,.3);padding: 30px;border-radius: 30px;float: left;}
 form input{width: 100%;float: left;padding: 10px 5px;border: 1px solid #ccc;border-radius: 5px;outline: 0;margin-bottom: 10px;}
 form textarea {resize: vertical;width: 100%;outline: 0;margin-bottom: 10px;height: 100px;}
 form .submitform{width: 100%;float: left;background-color: #226427;border: 1px solid #226427;color: #ffc20f;text-transform: capitalize;font-weight: 500;font-size: 18px;}
 form .submitform:hover{background-color:#ffc20f;color: #226427;transition: all ease .3s;border: 1 px solid #ffc20f;}
.customer{width: 100%;float: left;padding: 50PX 0;background-image: url(../img/map.png);position:relative;background-repeat: no-repeat;background-size:cover;background-position: center;text-align: center;}
.customer .overlay2{ width: 100%;height: 100%;background-color: rgb(204,204,204,.6);position: absolute;top: 0;left: 0;overflow: hidden;}
.customer h2{position:relative;color:#226427;margin-bottom:20px;display: inline-block;font-size: 15px;text-transform: uppercase;font-weight: 700;padding: 5px 10px;letter-spacing: 1px;}
.customer h3{font-size: 55px;color:#226427;font-weight: 800;margin-bottom: 40px;text-transform: uppercase;position: relative;}
.icon-box{width: 20%;float: left;text-align: center;position: relative;}
.icon-box:hover i{transform: rotate(360deg);transition: all ease 1s;}
.icon-box i{font-size: 65px;color :#226427;margin-bottom: 15px;}
.icon-box h4{font-size: 25px;color: #222;font-weight: 700;}
.icon-box h1{font-size: 20px;color: #222;font-weight: 400;text-transform: capitalize;}
.mooving-needs{width: 100%;float: left;padding: 60px 0;background-color: #fff;}
.moov{width:50%;float:left;padding:20px; }
.moov h2{color: #226427;border: 2px solid #226427;margin-bottom:20px;border-radius: 20px;display: inline-block;font-size: 15px;text-transform: uppercase;font-weight: 700;padding: 5px 10px;letter-spacing: 1px;}
.moov h3{font-size: 35px;color:#226427;font-weight: 800;margin-bottom: 40px;text-transform: uppercase;}
.accordion {background-color: #226427;color: #fff;cursor: pointer;padding: 18px;width: 100%;border: none;text-align: left;outline: none;font-size: 15px;transition: 0.4s;margin-bottom: 10px;}
.accordion:hover { background-color: #ffc20f;}
.accordion:after {content: '\002B';color: #ffc20f;font-weight: bold;float: right;margin-left: 5px;}
.accordion.active{color: #fff;}
.accordion.active:after {content: "\2212";}
.panel {padding: 0 18px;background-color: #ffc20f;max-height: 0;overflow: hidden;transition: max-height 0.2s ease-out;color: #000;font-size: 16px;}
.panel p {color: #226427;padding: 10px;font-size: 17px;font-weight: 400;}
.moov-image{width: 50%;float: left;padding: 90px 10px 0 10px;}
.moov-image img{width: 100%;border-radius: 40px;}
.how-it-works{width: 100%;float: left;padding: 50px 0;}
.bestfrom{width: 100%;float: left;padding: 50px 0;background-color: #fff;}
.fromothers{width: 100%;float: left;padding: 20px;text-align: center;}
.fromothers h2{font-size: 32px;font-weight: 500;color: #226427;text-transform: capitalize;margin-bottom: 40px;}
.othersimage img{max-width: 100%;}
.service-box {box-shadow: 0 0 5px #ccc;background-color: #f6f6f6;width: 100%;float: left;margin-bottom: 15px;padding: 10px;border-radius: 5px;position: relative;}
.service-box:hover img{transform: rotate(360deg);transition: all ease 1s;}
.service-box-img {width: 20%;float: left;}
.service-box-info {float: left;width: 80%;text-align: left;padding: 10px;position: relative;}
.service-box-info h4{color: #226427;font-size: 20px;font-weight: 600;text-transform: capitalize;position: relative;}
.service-box-info p {font-size: 16px;color: #666;font-weight: 400;position: relative;}

.difference{width: 100%;float: left;background-color: #226427;padding: 50px;border-radius: 30px;text-align: center;}
.difference h2{color: #fff;border: 2px solid #fff;margin-bottom:20px;border-radius: 20px;display: inline-block;font-size: 15px;text-transform: uppercase;font-weight: 700;padding: 5px 10px;letter-spacing: 1px;}
.difference h3{font-size: 55px;color:#fff;font-weight: 800;margin-bottom: 40px;text-transform: uppercase;}
.difference p{font-size: 20px;color: #fff;}
.work-icon-box{width: 30%;float: left;background-color: #fff;border-radius:15px;margin:0 10px;padding:30px;text-align: left;position: relative;}
.work-icon-box:hover i{transform: rotate(360deg);transition: all ease 1s;}
.work-icon-box i{font-size: 45px;color: #fff;margin-bottom: 15px;background-color:#226427;border-radius:100%;padding: 10px;}
.work-icon-box h2{color: #222;text-transform: uppercase;font-weight: 700;font-size: 20px;padding: 0;position: relative;border: none;}
.work-icon-box p{ font-size:17px;color:#222;font-weight:400;position:relative; }
.business{width: 100%;float: left;background-color: #fff;padding: 50px 0;}
.Deliver {width: 100%;float: left;background:#226427;border-radius: 30px;text-align: center;padding: 30px;}
.Deliver h2{color: #fff;border: 2px solid #fff;margin-bottom:20px;border-radius: 20px;display: inline-block;font-size: 15px;text-transform: uppercase;font-weight: 700;padding: 5px 10px;letter-spacing: 1px;}
.Deliver h3{font-size: 55px;color:#fff;font-weight: 800;margin-bottom: 20px;text-transform: uppercase;}
.Deliver p{font-size: 17px;color: #fff;}
.Deliver button{background-color: #ffc20f;color: #000;border: 2px solid #ffc20f;padding: 15px 10px;margin-bottom:30px;}
.Deliver button:hover{background-color: #226427;transition: all ease .2s;border: 2px solid #ffc20f;color: #fff;box-shadow:0 0 2px #ffc20f;}
.Deliver-icon-box{width: 30%;margin: 0 10px;background-color: #ffc20f;float: left;text-align: left;border-radius: 20px;padding: 30px;}
.Deliver-icon-box:hover i{transform: rotate(360deg);transition: all ease 1s;}
.Deliver-icon-box i{color: #000;font-size: 45px;text-align: left;margin-bottom:10px; }
.Deliver-icon-box h2 {text-transform: uppercase;font-weight: 700;color: #000;border: 0;font-size: 20px;padding: 0;}
.Deliver-icon-box p{ font-size:17px;color:#000;font-weight:400;}
.money{width: 100%;float: left;padding: 50px 0;background-color: #fff;}
.earn-money{width: 100%;float: left;padding: 50px;background-image: url(../img/Untitleddesign.png);background-repeat: no-repeat;background-size: cover;background-position: center-right;border-radius: 20px;}
.drivers{width: 45%;float: left;padding: 30px;border-radius: 10px;background-color: #fff;}
.drivers h2{font-size: 20px;text-transform: uppercase;color:#226427;font-weight:600;}
.drivers h3{color: #226427;text-transform: uppercase;font-size: 40px;font-weight: 700;}
.drivers p{font-size: 20px;color: #222;font-weight: 300;margin-bottom: 40px;}
.drivers button {background-color: #ffc20f;border: 2px solid #ffc20f; font-size: 15px; padding:15px 15px;color: #000;}
.drivers button:hover{background-color: #226427;border: 2px solid #226427;color: #fff;border: 2px solid #226427;transition: all ease .3s;}
.questions{width: 100%;float: left;padding: 50px 0;background-color: #fff;}
.questions h3 {color: #226427;text-transform: uppercase;font-size: 50px;font-weight: 700;}
.PicDrop{width: 100%;float: left;padding: 20px;}



.drop-in {animation: drop-in 1s ease 200ms backwards;}
@keyframes drop-in {
 from {opacity: 0;transform: translateY(-100px);}
 to {opacity: 1;transform: translate(0px);}
}
.drop-left {animation: drop-left 1s ease 200ms backwards;}
@keyframes drop-left{
  from {opacity: 0;transform: translatex(-100px);}
 to {opacity: 1;transform: translate(0px);}
}
.drop-right {animation: drop-right 1s ease 200ms backwards;}
@keyframes drop-right{
  from {opacity: 0;transform: translatex(100px);}
 to {opacity: 1;transform: translate(0px);}
}

/*apply-to-drive*/

.apply-to-drive{width: 100%;float: left;padding: 60px 0 120px 0;background-color: #fff;margin-top: 100px;}
.drive-form{width: 100%;float: left;text-align: left;border: 1px solid #ccc; border-radius: 10px;padding: 30px;}
.drive-form h1{color: #226427;text-transform: uppercase;font-size: 60px;font-weight: 700;}
.drive-form h3{font-size: 22px;font-weight: 700;color: #000;text-transform: uppercase;letter-spacing: 1px;text-align: left;}
.apply-to-drive-form{width: 100%;float: left;padding-bottom: 30px;}
.apply-to-drive-form label{width: 100%;float: left;font-size: 15px;color: #222;text-transform: capitalize;margin-bottom: 10px;text-align: left;}
.apply-to-drive-form input{font-size: 17px;color: #666;border: 1px solid #ccc;background-color: #fff;box-shadow: 0 5px 5px  #ccc;width: 100%;border-radius: 10px;padding: 8px;outline: 0;}
.apply-to-drive-form select{font-size: 17px;color: #666;border: 1px solid #ccc;background-color: #fff;box-shadow: 0 5px 5px  #ccc;width: 100%;border-radius: 10px;padding: 8px;outline: 0;}
.apply-to-drive-form textarea{font-size: 17px;color: #666;border: 1px solid #ccc;background-color: #fff;box-shadow: 0 5px 5px  #ccc;width: 100%;border-radius: 10px;padding: 8px;outline: 0;}
.checkout-confirm{width: 2%;float: left;}
.checkout-confirm input{width:auto;display: inline-block;}
.checkout{width: 98%;float: left;}
.apply-to-drive-form button{float:inline-start;background-color: #ffc20f;border: 2px solid #ffc20f; font-size: 15px; padding:15px 10px;width: 25%;color: #000;font-weight: 600;text-transform: uppercase;}
.apply-to-drive-form button:hover{background-color: #226427;color: #fff;transition: all ease .3s;color: #fff;}

/*Contact*/

.main-contact{width: 100%;float: left;padding: 60px 0;background-color: #fff;margin-top: 100px;}
.contact-section{width: 100%;border-radius: 10px;background-color: #f3f4f6;padding:60px 40px;margin-bottom: 40px;}
.contact-section h2{font-weight: 700;text-transform: uppercase;color: #226427}
.contact-details{width:100%;margin-bottom: 30px;}
.support{width: 48%;float: left;margin:0 10px;background-color: #fff;padding: 15px;position: relative;}
.bold-font{background-color: #fff;padding: 20px;margin-top: 30px;}
.bold-font p{color: #000;font-size: 17px;font-weight: 700;}
.contact-info{width: 48%;float: left;background-color: #226427;opacity: .7;border-radius: 15px;margin: 10px 10px;padding: 30px;}
.contact-info h2{font-size: 40px;text-transform: uppercase;font-weight: 700;color: #fff;}
.contact-info p{font-size: 18px;color: #fff;font-weight: 400;}
.contact-info button {background-color: #ffc20f;border: 1px solid #ffc20f;padding: 10px 15px;color: #000;font-weight: 500;}
.contact-info button:hover{background-color: transparent;border: 1px solid #ffc20f;box-shadow: 0 2px 2px  #ffc20f;transition: all ease .3s;color:#ffc20f; }

/*terms*/
.terms{width: 100%;float: left;padding: 70px 0;background-color: #fff;margin-top: 100px;}
.terms h3{font-size: 45px;color: #226427;text-transform: uppercase;font-weight: 800;}
.terms p{font-size:17px;font-weight: 400;font-style: italic;color: #226427;}
.conditions{width: 100%;float: left;border-bottom: 1px solid #ccc;}
.conditions h2{font-size: 23px;text-transform: uppercase;font-weight: 500;color: #226427;text-decoration: underline;margin-bottom: 20px;}
.conditions p{font-size: 18px;color: #226427;font-style: normal;margin-bottom: 25px;}


/*privacy*/
.Privacy{width: 100%;float: left;padding: 200px 0 60px 0;}
.Policy{width: 100%;float: left;}
.Policy h3{font-size: 45px;color: #226427;text-transform: uppercase;font-weight: 800;margin-bottom: 15px;}
.Policy p{font-size: 18px;font-weight: 500;color: #226427}
.Policy b{text-decoration: underline;}

/*login*/
.login{width: 100%;height:100%;float:left;background-color:#226427;padding:100px 0;opacity: .8}
.logindetail{width: 40%;float: left;padding: 40px;background-color: #fff;box-shadow: 0 0 5px #ccc;border-radius: 10px;align-items:center;margin: 0 auto;}
.logindetail img{max-width: 50%;margin-bottom: 20px;}
form{width: 100%;float: left;text-align: center;}
.logindetail form h2{font-size:25px;color: #000;text-transform: uppercase;text-align: left;}
form button{width: 100%;background-color:#ffc20f;border:1px solid #ffc20f;border-radius:10px;padding:10px 5px;font-weight:500;text-transform:capitalize;font-size:18px;margin-bottom:15px; }
form button:hover{background-color:#226427;border:1px solid #226427;transition:all ease .3s;color:#fff; }
form button a{justify-content: center;}

/*signin*/
.popup{width: 100%;background-color: rgb(0, 0, 0, .6);padding: 144px 0;float: left;}
.signdetail{width: 40%;float: left;padding: 40px;background-color: #fff;box-shadow: 0 0 5px #ccc;border-radius: 10px;align-items:center;margin: 0 auto;}
.signin{width: 100%;float: left;}
.signin label{float: left;}
/*overlay*/
.work-icon-box .overlay2 {width: 100%;height: 0;bottom: 100%;left: 0;top: 0;position: absolute;background-color: #ffc20f;transition: .5s ease;opacity: .6;overflow: hidden;border-radius: 15px;}

.work-icon-box:hover .overlay2{bottom: 0;height: 100%;border-radius: 15px}
.service-box .overlay3{width: 100%;top:100%;left: 0;height: 0;bottom: 0;position: absolute;background-color: #226427;opacity: .6;overflow: hidden;transition:ease .5s;}
.service-box:hover .overlay3{top: 0;height: 100%;}
.service-box:hover .service-box-info p{color: #fff;}

/*Footer*/
.footer-fixed{width: 100%;float: left;bottom: 0;position: fixed;background-color: transparent;padding: 5px 0;z-index: 1000;}
.footer-fixed .phone i{color: #fff;font-size: 25px;background-color:#008A00;border-radius:100px;padding:15px; margin: 0 10px;}
.whatsapp i{float: right;color: #fff;font-size: 25px;background-color:#008A00;border-radius:100px;padding:15px; margin: 0 10px;}
.footer-fixed .phone i:hover{background-color: #226427;transition: all ease .3s;}
footer{width: 100%;float: left;background-color: #f6f6f6;padding: 60px 0;}
.footerd{ margin-bottom:10px; }
.footerd img{width: 50%;margin-bottom: 20px;}
.footerd i{font-size: 25px;padding: 0 10px;color: #226427;margin-bottom: 10px;}
.footerd h6{color: #226427;font-weight: 400;}
.footerm h2{font-size: 22px;text-transform: uppercase;font-weight: 700;color: #226427}
.footerm ul{float: left;padding: 0;margin:0;}
.footerm ul li {list-style: none;text-align:left;color: #666;margin-bottom: 10px;}
.footerm ul li a{color: #226427;text-transform: capitalize;text-decoration: none;font-size: 17px;font-weight: 600;}
.footerm ul li a:hover{color: #ffc20f;}

/*responsive*/
@media(max-width:320px){
  .phone{width: 50%;float: left;}
  .whatsapp{width: 50%;float: left;}
  .col-xs-6{width: 50%;}
  .col-xs-12 {width: 100%;margin: 0;padding-right: 0;}
  a.navbar-brand {width: 50%;}
  .navbar-brand img {width: 100%;}
  ul.navbar-nav.me-auto.mb-2.mb-lg-0 {width: 100%;float: left;text-align: left;}
  .main-banner{padding: 40px 10px;}
  .banner-content h2 {font-size: 40px;}
  .banner-content button{margin-bottom: 20px;}
  .customer h3 {font-size: 25px;}
  .moov h3 {font-size: 30px;}
  .difference {padding: 50px 20px;}
  .difference h3 {font-size: 30px;}
  .work-icon-box {margin: 0;margin-bottom: 10px;}
  .Deliver h3 {font-size: 35px;}
  .Deliver-icon-box {margin-left:0;margin-bottom: 10px;}
  .drivers {padding: 30px 10px;}
  .drivers h3 {font-size: 27px}
  .questions{padding: 40px 0;}
  .questions h3{font-size: 40px;}
  footer{padding: 40px 0;}
  .footerm{margin-bottom: 10px;}
  .earn-money{padding: 50px 30px;}
  .apply-to-drive{padding: 20px;}
  .drive-form{padding: 15px;}
  .drive-form h1 {font-size: 28px;text-align: center;}
  .drive-form h3 {font-size: 20px;text-align: center;}
  .checkout-confirm {width: 100%;float: left;}
  .footerd{ margin-bottom:10px;text-align:center; }
  .terms h3 {font-size: 25px;}
  .Privacy{padding: 100px 0 50px 0;}
  .contact-info{width: 45%;float: left;background-color: #226427;opacity: .7;border-radius: 15px;margin:0;padding: 15px;}
  input#confirm_terms {float: inline-start;}
  .logindetail{margin: 0;}
  .contact-info h2 {font-size: 27px;} 
}

@media(max-width:480px){
  .phone{width: 50%;float: left;}
  .whatsapp{width: 50%;float: left;}
  .col-xs-6{width: 50%;}
  .col-xs-12 {width: 100%;margin:10px;padding:10px;}
  a.navbar-brand {width: 50%;}
  ul.navbar-nav.me-auto.mb-2.mb-lg-0 {width: 100%;float: left;text-align: left;}
  .main-banner{padding: 40px 10px;}
  .banner-content h2 {font-size: 40px;}
  .banner-content button{pad: 0p;margin: 0;}
  .customer h3 {font-size: 25px;}
  .moov h3 {font-size: 30px;}
  .difference {padding: 50px 20px;}
  .difference h3 {font-size: 30px;}
  .work-icon-box {margin: 0;margin-bottom: 10px;}
  .Deliver h3 {font-size: 35px;}
  .Deliver-icon-box {margin-left:0;margin-bottom: 10px;}
  .drivers {padding: 30px 10px;}
  .drivers h3 {font-size: 27px}
  .questions{padding: 40px 0;}
  .questions h3{font-size: 40px;}
  footer{padding: 40px 0;}
  .footerm{margin-bottom: 10px;}
  .earn-money{padding: 50px 30px;}
  .apply-to-drive{padding: 20px;}
  .drive-form{padding: 15px;}
  .drive-form h1 {font-size: 28px;text-align: center;}
  .drive-form h3 {font-size: 20px;text-align: center;}
  .checkout-confirm {width: 100%;float: left;}
  .footerd{ margin-bottom:10px;text-align:center; }
  .support{margin-bottom: 10px;width: 100%;}
  .terms h3 {font-size: 25px;}
.Policy h3 {font-size: 30px;}
.Privacy{padding: 100px 0;}
input#confirm_terms {float: inline-start;}
.logindetail{margin: 0;}
.contact-info h2 {font-size: 27px;}
}