@font-face{
font-family:myFirstFont;
src:url(../fonts/avantn.ttf)}

html,body{
font-family:myFirstFont!important;
font-weight:500;
overflow-x:hidden;
margin:0}

a{
outline:none!important}

body::-webkit-scrollbar,.chat-inner::-webkit-scrollbar{
width:8px}

body::-webkit-scrollbar-thumb,.chat-inner::-webkit-scrollbar-thumb{
background:#666;
-webkit-border-radius:10px;
-moz-border-radius:10px;
-ms-border-radius:10px;
border-radius:10px}

body::-webkit-scrollbar-track,.chat-inner::-webkit-scrollbar-track{
background:#ddd;
-webkit-border-radius:0;
-moz-border-radius:0;
-ms-border-radius:0;
border-radius:0;
background-clip:content-box}

body{
display:flex;
min-height:100vh;
flex-direction:column}

main{
flex:1 0 auto}

nav{
position:absolute;
z-index:999;
background:transparent;
box-shadow:none}


.video-section{
background: url('../images/ghana.jpg') no-repeat;
background-position: center bottom;
right:0;
bottom:0;
min-width:100%;
min-height:100%;
width:auto;
height:auto;
z-index:1}

.video-section{
position:relative;
min-height:800px}

.video-section h1{
font-family:myFirstFont!important;
max-width:960px;
,margin-top:0;
margin:0 auto;
line-height:59px;
letter-spacing:2px;
text-shadow:0 1px 1px #fff}

.video-section p.lead{
margin-top:20px;
max-width:600px;
margin:20px auto;
line-height:40px}

.video-section .navbar{
position:relative;
z-index:2;
background:transparent!important;
border-bottom:none!important}

.video-section .header-content{
position:relative;
width:100%;
padding:100px 15px 50px 15px;
text-align:center;
z-index:2;
color:#fff;
display:table;
height:550px;
overflow:hidden}

.video-section .header-content .inner{
display:table-cell;
vertical-align:middle}

a.down_arrow{
position:relative;
z-index:999;
text-align:center;
width:100%;
display:inline-block;
-webkit-animation:b 1s infinite alternate ease-in-out;
animation:b 1s infinite alternate ease-in-out;
top:-4em}

.down_arrow:after{
border-right:2px solid #fff;
border-bottom:2px solid #fff;
-webkit-transform:rotate(45deg);
-moz-transform:rotate(45deg);
-ms-transform:rotate(45deg);
-o-transform:rotate(45deg);
transform:rotate(45deg);
content:'';
width:40px;
height:40px;
position:absolute;
margin:auto;
top:0;
left:48.5%;
-webkit-animation:2s arrow-bounce infinite ease;
animation:2s arrow-bounce infinite}

@-webkit-keyframes b{
0%{
opacity:.4;
-webkit-transform:translateY(0);
transform:translateY(0)}

to{
opacity:1;
-webkit-transform:translateY(20px);
transform:translateY(20px)}

}

@keyframes b{
0%{
opacity:.4;
-webkit-transform:translateY(0);
transform:translateY(0)}

to{
opacity:1;
-webkit-transform:translateY(20px);
transform:translateY(20px)}

}

section.video-section .store-btns{
position:relative;
z-index:999}

section.video-section .store-btns .btn,.store-btns .btn,.store-btns a.btn{
background:transparent;
border:2px solid #fff;
text-transform:capitalize;
font-size:17px;
letter-spacing:1px;
height:auto;
margin:5px;
padding:6px 40px;
transition:all ease-in-out 0.5s;
-webkit-transition:all ease-in-out 0.5s;
-o-transition:all ease-in-out 0.5s;
-moz-transition:all ease-in-out 0.5s;
position:relative}

section.video-section .store-btns a.btn #playstore,section.video-section .store-btns a.btn #appstore,.store-btns a.btn #playstore,.store-btns a.btn #appstore{
transition:all ease-in-out 0.5s;
-webkit-transition:all ease-in-out 0.5s;
-o-transition:all ease-in-out 0.5s;
-moz-transition:all ease-in-out 0.5s}

section.video-section .store-btns a.btn:hover #playstore,section.video-section .store-btns a.btn:hover #appstore,.store-btns a.btn:hover #playstore,.store-btns a.btn:hover #appstore{
fill:#000}

section.video-section .store-btns a.btn:hover,.store-btns a.btn:hover{
color:#000;
border-color:#000}

#scroll{
position:fixed;
right:25px;
bottom:6em;
cursor:pointer;
width:50px;
height:50px;
background-color:rgba(0,0,0,.6);
display:none;
-webkit-border-radius:50%;
-moz-border-radius:50%;
border-radius:50%;
outline:none;
display:inline;
display:none}

#scroll i{
position:absolute;
top:50%;
left:50%;
margin-left:-11px;
margin-top:-12px;
height:0;
width:0;
color:#fff;
display:block}

.view-video{
padding:0 0 2em 0}

.view-video p{
font-size:18px;
margin-bottom:2em}

.intro-section{
padding:3em 0;
display:inline-block;
width:100%}

.intro-section p{
display:inline-block}

.intro-section p.capt{
font-size:20px;
max-width:600px;
margin:0 auto 3em;
line-height:30px}

.feature-section i{
float:left;
color:#454545;
font-size:40px;
margin-right:20px}

.feature-section h4 b{
color:#999;
font-size:14px;
display:block;
font-weight:400;
letter-spacing:0}

.feature-section h2{
margin-top:0;
margin-bottom:10px}

.feature-section p{
margin-bottom:2em;
margin-top:0;
line-height:26px}

.feature-section h4{
font-size:23px;
line-height:22px;
margin-bottom:18px;
font-style:normal;
letter-spacing:2px;
color:#fbc02d;
font-weight:500}

.section3{
float:left;
width:100%;
padding:90px 0 0 0;
background:#1a94c7 url(http://king-theme.com/preview/hoxa/wp-content/themes/hoxa/assets/images/para-bg2.jpg) repeat-y center -150px}

h1.white{
background:rgba(0,0,0,0) url(http://king-theme.com/preview/hoxa/wp-content/themes/hoxa/assets/images/arrow-02.png) no-repeat scroll left 8px;
color:#fff;
padding-left:60px;
margin-bottom:20px}

.feature-section .row{
margin-bottom:0}

.feature-section{
padding:3em 1em 2em}

.feature-section .king-elements{
margin-bottom:2em}

footer{
padding:0 1em}

footer ul li{
display:inline-block;
padding:0 10px}

footer ul.right{
margin-right:5em!important}

section.get_lift{
padding:2em 0}

section.get_lift .get_lift-inner{
margin:4em 0 0}

section.get_lift .get_lift-inner p{
font-size:20px}

.driver-main h1{
font-family:roboto;
font-weight:100;
margin-top:0}

.driver-main nav{
position:static;
color:#000}

.driver-main nav .brand-logo,.driver-main nav ul a{
color:#fff}

.brand-logo img{
width:113px;
height:auto;
margin-top:2px}

.driver-main .features-inner{
padding:4em 0 0}

.driver-main .features-inner .features-inner-list{
margin-bottom:2em;
min-height:145px}

.driver-main .features-inner .row{
margin-bottom:0}

.driver-main .features-inner .features-inner-list,.driver-main .features-inner,.driver-main .features-inner .features-inner-list p{
transition:all ease-in-out 0.5s;
-o-transition:all ease-in-out 0.5s;
-webkit-transition:all ease-in-out 0.5s;
-moz-transition:all ease-in-out 0.5s}

.driver-main .features-inner .features-inner-list p.caption{
display:none}

.driver-main .features-inner .features-inner-list:hover p.caption{
display:block}

.quotes .col{
padding:0}

.quotes .quotes-one,.quotes .quotes-two{
min-height:350px;
padding-top:1em}

.quotes .quotes-one i{
color:#fbc02d}

.quotes .quotes-one .flow-text{
color:#ddd;
margin:0;
font-size:23px}

.quotes .quotes-two .btn{
background:#fff;
color:#000;
height:64px;
padding:0 4em;
margin:2em 0 0;
font-size:17px}

.quotes .quotes-two{
padding-top:4em}

.quotes h1{
margin:0;
font-size:4rem}

.quotes .black{
background-color:#212121!important}

.quotes .carousel{
height:250px}

.signup_new{
padding:2em 0 4em}

.ds-outer{
display:table}

.ds-outer .middle{
display:table-cell;
vertical-align:middle}

.contact .contact-box{
padding:30px 10px;
background:#f6f6f6;
margin-bottom:1em}

.contact .contact-box h5{
font-size:18px;
font-style:normal;
font-weight:600;
line-height:24px;
text-transform:uppercase;
letter-spacing:.5px}

.contact .contact-form .input-field{
margin:0}

.contact .contact-box p{
min-height:44px;
max-height:44px}

.contact .page-section-ptb .gray-form .button{
display:block;
text-align:center;
border:0;
width:100%;
background-color:#fbc02d!important;
margin-top:1em}

.contact .contact-box i{
color:#f7c235;
font-size:30px;
display:block;
margin-bottom:20px}

.contact .contact-box,.contact .contact-box h5,.contact .contact-box,.contact .contact-box p{
transition:all 0.5s ease-in-out;
-moz-transition:all 0.5s ease-in-out;
-ms-transition:all 0.5s ease-in-out;
-o-transition:all 0.5s ease-in-out;
-webkit-transition:all 0.5s ease-in-out}

.contact .page-section-ptb{
padding:80px 0}

.contact .form-horizontal .form-group{
width:100%;
margin-left:0;
margin-right:0}

.contact .gray-form textarea:focus{
outline:none}

.contact .gray-form input,.contact .gray-form textarea{
width:100%;
padding:0 5px;
resize:vertical;
background:#f6f6f6;
border:1px solid transparent;
transition:all 0.5s ease-in-out;
-moz-transition:all 0.5s ease-in-out;
-ms-transition:all 0.5s ease-in-out;
-o-transition:all 0.5s ease-in-out;
-webkit-transition:all 0.5s ease-in-out}

.contact .gray-form input:last-child{
padding:0 0 0 1px}

.contact .gray-form textarea{
height:auto;
padding:10px}

.contact .opening-hours{
padding:25px}

.contact .gray-bg{
background:#f6f6f6}

.contact .opening-hours h6{
position:relative;
padding-bottom:10px;
margin-bottom:15px}

.contact .opening-hours strong{
width:100px;
display:inline-block;
color:#363636;
font-weight:700;
text-transform:uppercase}

.contact ul li{
padding:0;
margin:0;
line-height:30px}

@media only screen and (min-width:993px){
.driver-main .container{
width:77%}

}

section.driver_outer{
background-color:#888;
background-position:center center;
background-repeat:no-repeat;
background-attachment:fixed;
background-size:cover;
height:60vh;
color:#fff;
position:relative}

section.driver_outer .overlay{
position:absolute;
width:100%;
height:100%;
background-color:rgba(0,0,0,.2)}

section.driver_outer h1{
margin-top:0;
padding-top:2.5em}

section.driver_outer h1,section.driver_outer p{
position:relative}

section.driver_outer p{
font-size:16px}

.login-outer{
display:table;
position:absolute;
height:100%;
width:100%;
background-size:cover;
background-position:center bottom}

.login-outer .middle{
display:table-cell;
vertical-align:middle}

.login-outer .inner{
margin-left:auto;
margin-right:auto;
max-width:430px;
border-radius:3px;
padding:3.5em}

.login-outer .inner .btn{
width:100%;
letter-spacing:2.5px;
font-weight:700}

.login-outer .inner h4{
margin-top:0}

.login-outer .input-field.fg_passcode input{
margin-bottom:3px}

.login-outer .input-field.fg_passcode a{
display:inline-block;
color:#aaa;
margin-bottom:10px;
font-size:13px}

.cms_outer{
padding-top:4em;
margin-bottom:3em}

.cms_outer ul li{
list-style-type:disc}

.cms_outer h6{
font-weight:700;
text-transform:uppercase;
letter-spacing:1px}

.cms_outer p{
line-height:25px;
letter-spacing:.3px}

.cms_outer p b{
letter-spacing:.5px}

.slick-prev,.slick-next,.slick-prev:before,.slick-next:before{
display:none}

.slick-initialized .slick-slide{
outline:none!important}

.slick-dots li button:before{
color:#fff!important}

.delivery-outer section.driver_outer{
background-image:url(../images/delivery.jpg);
background-position-y:inherit}

.d-u-o section.driver_outer{
background-image:url(../images/1.jpg);
background-position-y:inherit}

.d-u-o.dlry-user section.driver_outer{
background-image:url(../images/delivery.jpg);
background-position-y:inherit}

.d-u-o section.features-inner{
padding-bottom:4em}

.d-u-o section.features-inner .feature-driver-user{
background:#f1f1f1;
padding:1em;
margin-bottom:20px}

.d-u-o section.features-inner .feature-driver-user .icon{
position:relative}

.d-u-o section.features-inner .feature-driver-user .icon i{
position:absolute}

.d-u-o section.features-inner .feature-driver-user span{
position:relative;
display:inline-block;
padding-left:40px;
font-size:30px;
top:-5px}

.d-u-o section.features-inner .feature-driver-user span p{
font-size:15px;
line-height:25px}

.dm-width{
max-width:300px;
margin:0 auto;
width:300px}

.iphone-mockup{
position:relative;
z-index:5}

.dm-device{
position:relative;
width:100%;
padding-bottom:203.477897%;
margin-bottom:20px}

.device{
position:absolute;
top:0em;
bottom:0;
left:0;
right:0;
width:100%;
height:100%;
-webkit-background-size:100% 100%;
background-repeat:no-repeat;
background-image:url(../images/apple-iphone.png);
background-size:cover;
background-position:center center}

.screen{
overflow:hidden;
position:absolute;
top:18.1%;
bottom:20.6%;
left:12.49%;
right:17.4%}

.slider{
height:100%}

.slider div{
height:100%}

.slider__item{
font-size:100px;
color:rgba(255,255,255,.7);
display:flex;
justify-content:center;
align-items:center}

.slider__item img{
width:100%}

.faq_outer{
margin:7em 0 0}

.faq_outer .center-align p{
margin:5px 0}

.faq_outer .center-align div{
max-width:100px;
margin:10px auto 0;
height:1px;
padding:0;
border:1px solid #f7c235}

.faq_outer .center-align div:last-child{
max-width:50px;
margin:6px auto 20px;
height:1px;
padding:0;
border:1px solid #f7c235}

.faq_outer .collapsible.popout{
margin-top:2em}

.faq_outer .collapsible-header p{
margin:0;
font-weight:600;
letter-spacing:.5px}

.faq_outer .collapsible-body{
padding:1rem 2rem}

@media(max-width:991px){
section.features .features_heading_content p{
margin-bottom:25px}

section,section.View-demo-section .container{
padding:2em 0}

.video-section{
min-height:700px}

.driver-main section,.driver-main section.View-demo-section .container{
padding:0}

.driver-main nav{
/*margin-bottom:1em*/
height: 68px;
}

nav .button-collapse i{
color:#000}

.quotes .quotes-two .btn{
padding:0 2em}

}

nav .nav-wrapper {
    position: relative;
    height: 100%;
    z-index: 999;
}
.driver-main nav ul a {
    color: #fff;
    font-weight: 600;
}

@media only screen and (max-width:800px){
.dm-width{
width:100%}

}

@media only screen and (max-width:600px){
.view-video iframe{
width:100%}

section.driver_outer{
height:auto;
padding-bottom:4em}

nav .button-collapse{
float:left;
position:absolute;
z-index:1;
height:56px;
left:-1em;
margin:0}

nav.grey.darken-1{
height:66px}

.cms_outer ul:not(.browser-default){
padding-left:25px}

.dm-width{
margin-bottom:-5em}

.dm-device{
margin-bottom:0}

section.video-section .store-btns .btn,.store-btns .btn{
width:100%}

}

@media(min-width:320px) and (max-width:991px){
.video-section h1{
font-size:45px;
line-height:51px}

.driver-main nav ul a {
    color: #1f1f1f;
    font-weight: 600;
}

}


