@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');

:root {
  --theme-clr: #AB8D58;
}

*,p,ul,li,h1,h2,h3,h4,h5 {
    margin: 0;
    padding: 0;
    
}


/*font size class start*/
.xxs-font {font-size: 12px;line-height: 15px;}
.xs-font {font-size: 18px;line-height: 15px;}
.body-font {font-size: 17px;line-height: 25px;}
.sm-font {font-size: 20px;line-height: 22px;}
.md-font {font-size: 30px;line-height: 36px;}
.lg-font {font-size: 36px;line-height: 44px;}
.xl-font {font-size: 43px;line-height: 44px;}
.xxl-font {font-size: 48px;line-height: 58px;}
.xxxl-font {font-size: 60px;line-height: 62px;}
.v-font {font-size: 64px;line-height: 78px;}
/*font size class end*/
/*color css start*/
.body-clr {color: #111111;}
.black-clr {color: #000;}
.theme-clr {color: var(--theme-clr);}
/*color css end*/
/*links css start*/
.body-link {font-size: 12px;color: #111111;line-height: 15px;text-transform: uppercase;text-decoration: none;display: inline-block;}
.body-link.theme-clr .theme-clr {color: #AB8D58;}
/*links css end*/
/*global css start*/
html,body {margin: 0;padding: 0;outline: 0;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
body {color: #111111;font-family: 'Nunito Sans', sans-serif;font-size: 17px;letter-spacing: 0;line-height: 25px;font-weight: normal;overflow-x: hidden;}
main { margin: 0 auto;max-width: 1440px;}
svg{color:inherit;fill: currentColor;}
img {max-width: 100%;}
ul {list-style-type: none;}
a {text-decoration: none;color:inherit;}
a:hover, a:active, a:focus {outline: none;box-shadow: none;color:inherit;/* color: #AB8D58;*/}
.link-hover:hover{color: #AB8D58;}
.section-padding {padding: 70px 0;}
.section-title {font-size: 60px;letter-spacing: 0;line-height: 62px;}

/*bootstrap grid css*/


@media (min-width: 1366px) and (max-width:1440px){
  .container, .container-lg, .container-md, .container-sm, .container-xl{max-width: 1290px;}
  .container-xxl{max-width: 100%}
}
@media (min-width: 1500px){
  .container-xxl{max-width: 1290px;}
}
/*bootstrap grid css end*/

/*global css end*/
/*button css start*/
button:focus, button:hover, button:active, .btn.focus, .btn:focus, .btn:hover, .btn-focus {outline: none;box-shadow: none;color: #000;}
.btn {color: #fff;border: 0;border-radius: 0;min-width: 150px;padding: 15px 20px;}
.btn-theme {height: 54px;position: relative;overflow: hidden;background: transparent;-webkit-transition: 0.3s all ease-in-out;-ms-transition: 0.3s all ease-in-out;-o-transition: 0.3s all ease-in-out;-moz-transition: 0.3s all ease-in-out;transition: 0.3s all ease-in-out;z-index: 1;}
.btn-theme:before {content: "";background: #000;top: 0;right: 0;bottom: 0;left: 0;position: absolute;clip-path: polygon(100% 0, 100% 33px, 129px 100%, 0 100%, 0 0);z-index: -1;}
.btn-theme:after {content: "";position: absolute;bottom: 6px;width: 30px;height: 2px;background: #000;transform: rotate(-45deg);right: -9px;}
.btn-theme:hover:before, .btn-theme:focus:before, .btn-theme:active:before {background: #AB8D58;}
.btn-theme:hover:after, .btn-theme:focus:after, .btn-theme:active:after {background: #AB8D58;}
/*button css end*/

/*card css start*/
.card {border: 0;border-radius: 0;}
/*card css end*/

/*breadcrumb css start*/.breadcrumb{ padding: 30px 0;}
.breadcrumb-item+.breadcrumb-item{position: relative;padding-left:40px;}
.breadcrumb-item a, .breadcrumb-item.active{text-decoration:none;color: #111111;display: inline-block;}
.breadcrumb-item a:hover{color:#AB8D58;}
.breadcrumb-item+.breadcrumb-item::before{background:url(../img/arrow_right.svg);background-size:11px;background-repeat: no-repeat;content:'';width: 26px;height: 12px; top: 6px;float: none;background-position: center;padding-right: 0;display: inline-block;position: absolute;left: 8px;text-align: center;}
/*breadcrumb css end*/

/*header css start*/
.overlay {background-color: rgba(0, 0, 0, 0.5);height: 100%;width: 100%;z-index: 2;position: absolute;top: 0;bottom: 0;left: 0;right: 0;}
.navbar-toggler {padding: 0;margin-right:30px;font-size: 18px;position: relative;height: 24px;width: 24px;margin-left: auto;-webkit-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;/* margin-top: 15px; */display: flex;flex-direction: column;justify-content: space-around;}
.navbar-toggler .navbar-toggler-icon {-webkit-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.navbar-toggler[aria-expanded = "true"] .navbar-toggler-icon {-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);}
.navbar-toggler:focus {outline: none;}
.navbar-toggler span.icon-bar {-webkit-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;background: #111111;width: 24px;height: 2px;display: block;/* margin-bottom: 6px; */text-align: right;margin-left: auto;opacity: 0.8;}
.navbar-toggler span.icon-bar.bottom-bar {margin-bottom: 0px;}
.navbar-toggler[aria-expanded = "true"] .icon-bar {-webkit-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.navbar-toggler[aria-expanded = "true"] .top-bar {-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);position: absolute;/* top: 12px; */}
.navbar-toggler[aria-expanded = "true"] .middle-bar {opacity: 0;}
.navbar-toggler[aria-expanded = "true"] .bottom-bar {-webkit-transform: rotate(-45deg);-ms-transform: rotate(-45deg);transform: rotate(-45deg);width: 24px !important;position: absolute;/* top: 13px; */}

/*header css end*/

.btn-check:active+.btn-primary:focus, .btn-check:checked+.btn-primary:focus, .btn-primary.active:focus, .btn-primary:active:focus, .show>.btn-primary.dropdown-toggle:focus {
    box-shadow: none;
}

/*head css start*/

.navbar-light .navbar-nav .nav-link {
    padding: 18px 20px;
}

.headerall {box-shadow: 0 10px 17px 6px rgb(224 224 224 / 50%);
    background-color: #FFFFFF;}

.navbar-light .navbar-nav .nav-link {    color: #1D1D1D;}

.headleft {margin-left: 60px;}

.navbar {    padding-top: 14px;
    padding-bottom: 14px; }

    .xologetstartbtn {display: none;}

    .xolostartbtn:active {color: #FFFFFF;
border-radius: 4px;
  background-color: #222C56;
  box-shadow: none;
}

    .xolostartbtn:focus {color: #FFFFFF;
border-radius: 4px;
  background-color: #222C56;
  box-shadow: none;
}

    .xolostartbtn:hover {color: #FFFFFF;
border-radius: 4px;
  background-color: #222C56;
  box-shadow: none;
}

.xolologo {    width: 292px;}

/*head css end*/


/*baneer css start*/


.baneer {margin-bottom: 139px;     margin-top: 48px; background-image: url("../image/img_hero_backround.png"); background-repeat: no-repeat;     background-size: cover;     background-position: center;}

.baneerimg {    object-fit: cover;
    height: 645px;
  width: 514px;
   
    position: absolute;
    border-radius: 18px;
  }



.baneerherosec {      height: 645px;
    width: 496px;
    background-color: #C5D31B;
    position: relative;
    left: 19px;
    bottom: 20px;
}


.aboutwriteimg {     position: absolute;
    object-fit: cover;
    height: 547.3px;
    width: 559.32px;
        top: 885px;
    left: 104px; }

.aboutwrite {  height: 520.78px;
  width: 559px;
  border: 6px solid #C5D31B; position: relative;}

.accordion-button:not(.collapsed) {
    color: #1D1D1D;
    background-color: #ffffff;
}

.accordion-collapse  { border:0px; }

.accordion-button:focus {     border-color: #ffffff; box-shadow: none; }

.aboutxolo {    padding-left: 34px;}

.xoloabout {position: relative;
    z-index: 1;}

    .xoloabout::before {
      width: 1px;
  height: 48px;

    border-left: 6px solid #C5D31B;
    content: "";
    position: absolute;
        left: 0px;
    } 

 .xolochoose  {position: relative;
    z-index: 1;}

    .xolochoose::before {
      width: 1px;
  height: 48px;

    border-left: 6px solid #C5D31B;
    content: "";
    position: absolute;
           left: 468px;
    } 


.accordion-button:not(.collapsed)::after {
    background-image: url("../image/ic_arrow_up.png");

    transform: rotate(0deg);     height: 42px;
    width: 42px;
    background-size: 35px; }

    .accordion-button::after {background-image: url("../image/ic_arrow_down.png");     height: 42px;
    width: 42px;
    background-size: 35px;}

    .about {margin-bottom: 73px;}

    .quickeasy {background-image: url("../image/img_4_steps.png"); background-repeat: no-repeat;     background-size: cover;     background-position: center;}


/*baneer css end*/







/*common css start*/


.xolohead {color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 22px; }

  .xolostartbtn {color: #FFFFFF; 
    font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 22px; 
  border-radius: 4px;
  background-color: #222C56;
  padding-top: 17px;
  padding-bottom: 18px;
      width: 191px;}

  .xolobaneer {color: #222C56;
  font-family: 'Montserrat', sans-serif;
  font-size: 66px;
  font-weight: bold;
  letter-spacing: -1.3px;
  line-height: 81px;}

  .xolosubbaneer {color: #222C56;
  font-family: 'Montserrat', sans-serif;
  font-size: 36px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 44px;
  padding-top: 34px;
  padding-bottom: 34px;
}

  .xologet {color: #1D1D1D;
     font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 22px;
  border-radius: 4px;
  background-color: #C5D31B;
  height: 57px;
    width: 191px;
  }

.xologet:active {background-color: #C5D31B; color: #1D1D1D;}

.xologet:focus {background-color: #C5D31B; color: #1D1D1D;}

.xologet:hover {background-color: #C5D31B; color: #1D1D1D;}


  .xoloabout {color: #263249;
  font-family: 'Montserrat', sans-serif;
  font-size: 36px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 44px;
  padding-bottom: 34px;
      padding-left: 23px;
}

.accordionleft {    margin-left: 21px;}

  .xoloaboutloan {color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  letter-spacing: 0;
  line-height: 27px;
  padding-bottom: 14px;
      padding-left: 21px;

}

  .xoloaboutdispatch {color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 58px;
      border: 0px;
          padding: 0px;
}

.aboutdispatchhow {color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 58px;
  border-top: 1px solid #979797;
    
    border-left: 0px;
    border-right: 0px;
     
          padding: 0px;}

          .aboutdispatchbrd {color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 58px;
  border: 0px;

  padding: 0px;
}

.xoloinform {border: 1px solid #979797;
  border-radius: 4px;
  background-color: #FFFFFF;
  padding-left: 28px;
  padding-top: 8px;
  padding-bottom: 8px;
}


  .xolofax {margin-top: 13px;}

  .xolowaiting { border-top: 1px solid #979797; }

  .xolodispatchcont {color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  letter-spacing: 0;
  line-height: 25px;
      padding-bottom: 10px;

}

.xoloservices {padding: 0px;}

  .xolochoose {color: #FFFFFF;
  font-family: 'Montserrat', sans-serif;
  font-size: 36px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 44px;
  padding-top: 81px;
  padding-bottom: 66px;
}

  .choose {background-color: #222C56;}

  .xolospeedy {color: #FFFFFF;
  font-family: 'Montserrat', sans-serif;
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 29px;
  padding-bottom: 24px;
  

}

.safesecure {    padding-left: 85px;}

.speedyapprov {    margin-left: 43px; background-image: url("../image/ic_speedy.png"); background-repeat: no-repeat;     padding-top: 79px; }

.creditapprov {background-image: url("../image/ic_most.png"); background-repeat: no-repeat;     padding-top: 79px; }

.safeapprov {background-image: url("../image/ic_safe.png"); background-repeat: no-repeat;     padding-top: 79px; }

.acceptall {padding-bottom: 80px;}

.customer {margin-top: 84px; margin-bottom: 84px;} 


.xolofaq  {position: relative;
    z-index: 1;}

    .xolofaq::before {
      width: 1px;
  height: 48px;

    border-left: 6px solid #C5D31B;
    content: "";
    position: absolute;
           left: 468px;
    } 

.xolosteps  {position: relative;
    z-index: 1;}

    .xolosteps::before {
      width: 1px;
  height: 48px;

    border-left: 6px solid #C5D31B;
    content: "";
    position: absolute;
    left: 0px;
           
    }


.xolofaq { color: #263249;
  font-family: 'Montserrat', sans-serif;
  font-size: 36px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 44px;
  padding-bottom: 62px;
}

  .xolospeedycont {color: #FFFFFF;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  letter-spacing: 0;
  line-height: 27px;}

  .xolosteps {color: #222C56;
  font-family: 'Montserrat', sans-serif;
  font-size: 36px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 44px;
  padding-top: 69px;
  padding-bottom: 40px;
      padding-left: 21px;
}

  .xolostephead {color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 29px;}

  .xolostepcont {color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  letter-spacing: 0;
  line-height: 26px;
  padding-top: 14px;
  padding-bottom: 28px;
}

.tellus {padding-bottom: 69px; color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  letter-spacing: 0;
  line-height: 26px;
  padding-top: 14px;}

  .numberone {padding-right: 24px;}

  .xolonumberone {color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 28px;}

  .onenum {border: 4px solid #222C56; padding-top: 8px;
    padding-right: 19px;
    padding-bottom: 8px;
    padding-left: 19px; }

    .twonum {background-color: #C5D31B;     padding-right: 20px;
    padding-top: 11px;
    padding-bottom: 11px;
    padding-left: 20px; }

    .fournum {border: 4px solid #222C56;
    padding-top: 8px;
    padding-right: 17px;
    padding-bottom: 8px;
    padding-left: 17px;}

  .xolonumbertwo {color: #FFFFFF;
  font-family: 'Montserrat', sans-serif;
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 28px;}

  .xolocustomercont {color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  letter-spacing: 0;
  line-height: 24px;}

  .xolocontact {color: #FFFFFF;
  font-family: 'Montserrat', sans-serif;
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 58px;
  padding-top: 44px;
}

.contactall {background-color: #222C56;}

.inquiry { padding-bottom: 44px; }

  .xolophone {color: #FFFFFF;
  font-family: 'Montserrat', sans-serif;
  font-size: 36px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 58px;}

  .xolofooter {color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  letter-spacing: 0;
  line-height: 26px;}

  .footerlogo {width: 187px; padding-bottom: 27px;}


  .xolofooterlink {color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 58px;
      padding-top: 22px;
      padding-bottom:16px;
}

  .xolofootersublink {color: #1D1D1D;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  letter-spacing: 0;
  line-height: 16px;}

  .xolocopyright {color: #FFFFFF;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  letter-spacing: 0;
  line-height: 58px;
  padding-top: 8px;
  padding-bottom: 8px;
}



.footerall {margin-top: 54px; margin-bottom: 54px;}

.copyright {background-color: #222C56; }


/*common css end*/


/*footer css start*/
footer {}
footer a {text-decoration: none;color: #111111;}
footer a:hover {color: #000;text-decoration: underline;}
footer .nav .nav-item {padding: 5px 0;}
footer .footer-top {padding-bottom: 50px;}
footer .footer-bottom {padding-top: 50px;border-top:1px solid rgb(17 17 17 / 0.23);}
/*footer css end*/


/*repsonsive css*/




/* iPadPRO landscape style here */


@media only screen
  and (min-device-width : 1000px)
  and (max-device-width : 1100px)
  and (orientation:landscape) 
{
   
 
}

@media only screen
  and (min-device-width : 1000px)
  and (max-device-width : 1100px)
  and (orientation:portrait) 
  {
    

  }

/* iPad landscape style here */

@media only screen
  and (min-device-width : 768px)
  and (max-device-width : 992px)
  and (orientation:landscape) 
{
 

}


@media only screen
  and (min-device-width : 768px)
  and (max-device-width : 992px)
  and (orientation:portrait) 
{
  
 
}



@media (min-width: 768px) {
}
@media (min-width: 992px) {
}
@media (min-width: 1500px){
}
@media (min-width: 1800px){
}
@media (min-width: 768px) and (max-width: 1199.98px) {
}
@media (max-width: 1199.98px) {
}

@media (max-width: 991.98px) {
}


@media (max-width: 767.98px) {
/*navabr for mobile css start*/


.headleft {margin-left: 0px;}


.xolofaq::before {
    width: 1px;
    height: 48px;
    border-left: 6px solid #C5D31B;
    content: "";
    position: absolute;
    left: 8px;
  }

.xolochoose::before {    width: 1px;
    height: 48px;
    border-left: 6px solid #C5D31B;
    content: "";
    position: absolute;
    left: 0px;
  }

.xologetstartbtn {display: block;}

.xologettt {display: none;}

.xolologo {width: 130px;}


#navbarNav {
    position: fixed;
    height:100vh;
    height:calc(var(--vh, 1vh) * 100) ;
    display: block;
    width: 300px;
    z-index: 11;
    background:#fff;
    left: 0;
    bottom: 0;
    top: 0;
    transform: translateX(-400px);
    transition:0.3s;
    justify-content: center;
  }
  #navbarNav.show{
    transform: translateX(0);
    transition:0.3s;
  }



/*navabr for mobile css end*/
}


@media only screen
  and (min-device-width : 400px)
  and (max-device-width : 700px)
  and (orientation:portrait) 
{
 
  }

@media only screen
  and (min-device-width : 400px)
  and (max-device-width : 700px)
  and (orientation:landscape) 
{

  
}



@media (max-width: 575.98px) {
 
}

@media (max-width: 419.98px) {
 
}
