/*
* Main styles of site
* Including mobile version (till 1199px)
*/


/* 
* Basic styles 
*/

@font-face {
    font-family: segoe_semi;
    src: url('../fonts/Segoe UI Semibold.ttf');
    font-weight: bold;
}

@font-face {
    font-family: segoe;
    src: url('../fonts/Segoe UI.ttf');
    font-weight: normal;
}

@font-face {
    font-family: segoe_bold;
    src: url('../fonts/Segoe UI Bold.ttf');
    font-weight: bolder;
}

* {
    font-family: segoe;
    box-sizing: border-box;
}

a { text-decoration: none; color: inherit; transition: all .3s; }
img { max-width: 100%; height: auto; }
body { padding: 0; margin: 0; line-height: 1.4; }
input,
button,
select,
textarea { outline: none; font-size: inherit; font-family: inherit; }
a,
button { transition: all .3s; }
::-webkit-input-placeholder { color: inherit; }
::-moz-placeholder { color: inherit; }
:-ms-input-placeholder { color: inherit; }
:-moz-placeholder { color: inherit; }

::selection {
    background: #21ad8c;
    color: white;
}

a:hover { text-decoration: none; color: #21ad8c; }

body {
    font: 16px 'segoe', sans-serif;
}

/* --------------------- End of Site specific styles --------------------- */

input.btn,
button.btn,
a.btn,
button.wpas-btn-default,
input#submit { -webkit-appearance: none; transition: all .3s; display: inline-block; cursor: pointer; border: 2px solid #21ad8c; background: #21ad8c; color: #fff; letter-spacing: 1.5px; font-weight: 600; padding: 9px 40px; border-radius: 20px; }
input.btn:hover,
button.btn:hover,
a.btn:hover,
button.wpas-btn-default:hover,
input#submit:hover { background: none; color: #21ad8c; border-color: #21ad8c; }

input.btn.white { border: 2px solid #21ad8c; background: #fff; color: #21ad8c; }
input.btn.white:hover { background: #21ad8c; color: #fff; }

.pay-btn { -webkit-appearance: none; line-height: 1; transition: all .3s; display: inline-block;
 cursor: pointer; border: 1px solid #21ad8c; background: #21ad8c; color: #fff; 
 letter-spacing: 1.5px; font-weight: 400; padding: 7px 30px; border-radius: 20px; }
.pay-btn:hover { background: none; color: #21ad8c; border-color: #21ad8c; }

.align-center { text-align: center; }

.green-text { color: #21ad8c; }

.title-h2 { margin: 0 auto 20px; font-size: 24px; }

.container-wrap { padding: 0 15px; margin: 0 auto; }

.section-white { background: #fff; padding: 40px 0; }
.section-gray { background: #F5F5F5; padding: 40px 0; }

.p-label { text-transform: uppercase; color: #767676; }

.hidden { display: none !important; transition: all .3s; }

header.site-header { position: relative; width: 100%; z-index: 999; }
body.sticky { margin-top: 50px; }
.sticky header.site-header { position: fixed; left: 0; right: 0; top: 0; background: #fff; box-shadow: 0 -10px 20px 0px #000; }
header.site-header a.custom-logo-link { width: 100px; height: auto; display: block; }
.sticky header.site-header a.custom-logo-link { width: 80px; }
header.site-header img.header_bg { position: absolute; z-index: -1; width: 100%; }
header.site-header .drop_down .toggle { display: none; }
header.site-header .nav { display: flex; flex-direction: row; align-items: center; position: relative; padding: 10px 15px; }
.sticky header.site-header .nav { padding: 0 15px; }
header.site-header .nav ul { display: flex; flex-direction: row; align-items: center; padding-left: 0; width: calc( 100% - 100px ); justify-content: flex-end; }
header.site-header .nav ul li { list-style: none; padding: 0 20px; text-align: center; }
header.site-header .nav ul li:last-of-type { padding-right: 0; }
header.site-header .nav ul li a { text-decoration: none; font-size: 16px; color: black; }
header.site-header .nav ul li.current-menu-item:not(#menu-item-264) a,
header.site-header .nav ul li a:hover { color: #21ad8c; }
header.site-header .nav .account-nav { flex: none; }
header.site-header .nav .account-nav>a { color: black; flex: none; padding: 15px 0 15px 30px; }
header.site-header .nav a.account-nav { color: black; flex: none; padding: 15px 0 15px 30px; }
header.site-header .nav .account-nav>a:before { padding-right: 0px; content: "\e970"; font-family: 'larixicon' !important; }
header.site-header .nav .account-nav>a:after { content: "\e902"; font-family: 'larixicon' !important; }

header.site-header #menu-my-account { position: absolute; background: #fff; padding: 30px 15px 25px; margin-top: 0;
    top: 50px; z-index: 100; right: 0; display: none; flex-direction: column; width: auto; min-width: 140px; align-items: flex-end; }
header.site-header #menu-my-account li { padding: 0 0 5px; }
header.site-header #menu-my-account.active { display: flex; }

@media (min-width: 768px) {
    .close,
    .toggle,
    .logo-mobile { display: none; }
}
@media (max-width: 767px) {
    header.site-header .nav .custom-logo-link { display: none; }
    header.site-header { display: flex; justify-content: space-between; align-items: center; padding: 5px 0; }
    header.site-header .logo-mobile { padding-left: 15px; }
    header.site-header .logo-mobile img { height: 40px; }
    header.site-header .toggle  { padding-right: 15px; font-size: 21px; }
    header.site-header .nav { padding: 15px 15px; transition: all .7s ease-out; position: fixed; height: 100%; width: 100%; background: #21ad8c; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; top: -100%; }
    header.site-header .nav.active { z-index: 2; opacity: 1; height: 100%; transition: all .7s ease-out; top: 0; }
    header.site-header .nav .close { display: block; position: absolute; top: 15px; right: 15px; font-size: 21px; }
    header.site-header .nav ul { flex-direction: column; height: 100%; width: 100%; justify-content: flex-start; align-items: flex-start; margin-top: 0; }
    header.site-header .nav ul li { padding: 0 0 15px 15px; }
    header.site-header .nav ul li a { font-size: 18px; color: white; }
    header.site-header .nav ul li.current-menu-item a,
    header.site-header .nav ul li a:hover { color: black; }
    header.site-header .nav ul li#menu-item-264 a { color: white; }
}


.front-hero { height: 105vh; width: 100%; background-size: cover; background-position: center; }

.switch-wrap { display: flex; justify-content: center; }
.login-wrap .switch-wrap { margin-bottom: 15px; justify-content: start; }
.switch { margin: 0 20px; }
.switch input { position: absolute; opacity: 0; }
.switch { display: inline-block; font-size: 24px; /* 1 */ height: 24px; width: 48px; background: #fff;
  border: 1px solid #707070; border-radius: 20px; box-shadow: 0 3px 6px rgba(0,0,0,0.1); }
.switch div { height: 23px; width: 23px; border-radius: 20px; background: #21ad8c; transition: all 300ms; }
.switch input:checked + div { transform: translate3d(100%, 0, 0); }

.service-items { padding-top: 20px; }
.service-items .inner { padding: 20px 30px 0; }

.how-it-work-text { padding: 0 15px; }

.how-it-work-text .inner { display: flex; align-items: center; }
.how-it-work-text .inner:not(:first-of-type) { margin-top: 60px; }
.how-it-work-text .inner img { margin-right: 40px; }
.how-it-work-text .inner h3 { margin: 0 0 15px; }
.how-it-work-text .inner p { margin: 0; }
.first-request-wrap { margin-top: 60px; }
.first-request-wrap h2 { margin: 0 0 10px; }
.first-request-wrap p { margin: 0 0 20px; }

.front-benefit h2 { margin: 0; }
.front-benefit p { margin: 0 0 15px; }
.front-benefit ul { padding-left: 20px; }
.front-benefit ul li { margin-bottom: 5px; }

.testimonial { position: relative; background-color: #fff; padding: 40px; }
.testimonial .inner h3 { margin: 10px 0 0; }
.testimonial .inner p:first-of-type { margin: 0; }

.front-submit-request { height: 420px; background: url('../images/bg-request.jpg' ); background-position: center; 
	background-repeat: no-repeat; background-size: cover; padding-top: 40px; }
.front-submit-request .text-wrap { background: rgba(255, 255, 255, 0.85); margin: 40px auto 0; padding: 40px 80px; display: inline-block; }
.front-submit-request .text-wrap h2 { font-size: 24px; margin: 0; }
.front-submit-request .text-wrap p { margin-bottom: 0; }

.front-request label { display: block; color: #767676; text-transform: uppercase; margin-bottom: 30px; }

.front-request form { margin-top: 40px; }
.front-request input:not([type="submit"]),
.front-request textarea { width: 100%; border: 1px solid #707070; color: #707070; padding: 7px 15px; margin-top: 5px; }
.front-request input[type="submit"] { margin: 10px 0 0; }


body>footer { background: #21ad8c; padding: 20px 0; text-align: center; color: white; }

@media (max-width: 767px) {

}

@media (min-width: 768px) {
    .front-hero { margin-top: -60px; }
}

@media (min-width: 768px) and (max-width: 1199px) {

}

@media (max-width: 1199px) {
    .home section:not(:first-of-type) { padding: 30px 15px; }

    .service-items h3 { margin: 5px 0 0; }
    .service-items p { margin-top: 5px; }

    .front-hero { margin-top: -60px; background: linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)), url('../images/hero_driver_mobile.jpg' ); background-size: cover; background-position: center; background-repeat: no-repeat; }
    .front-hero .text-wrap {  position: absolute; left: 0; right: 0; top: 35%; bottom: 0; text-align: center; }
    .front-hero .text-wrap h1 { color: #fff; font-size: 36px; margin: 0 0 40px; text-transform: uppercase; }

    .how-it-work-text .inner img { margin-right: 15px; width: 60px; }
    .first-request-wrap h2 { font-size: 18px; }
    .home section.front-benefit { padding: 0; }
    .front-benefit .front-benefit-cover { height: 200px; background: url('../images/benefits.jpg' ); background-size: cover; background-position: center; background-repeat: no-repeat; }
    .front-benefit>div:last-of-type { padding: 30px 15px; }
    .testimonial .inner:not(:last-of-type) { margin-bottom: 40px; }
    .testimonial-wrap>p:first-of-type { margin-bottom: 0; }
    .testimonial-wrap>p:last-of-type { margin-top: 0; }
    .front-submit-request { height: auto; }
    .front-submit-request .text-wrap { margin: 0 auto; padding: 30px; }
    .front-submit-request .text-wrap p { margin: 0; }
    .front-request>div:first-of-type { padding: 0 30px 30px; }
    .front-request label { margin-bottom: 20px; }
    .front-request>div:last-of-type { text-align: center; padding: 20px 0;}
    .front-request>div:last-of-type>div { position: relative; }
    .front-request>div:last-of-type>div:before { content: ''; width: 40%; height: 1px; background: #000; position: absolute; top: -35px; left: 30%; }
}

@media (min-width: 1200px) {
	.container-wrap { width: 1200px; }

	.section-white,
	.section-gray { padding: 60px 0; }

	.front-hero { margin-top: -120px; background: linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)), url('../images/hero_driver.jpg' ); background-size: cover; background-position: center; background-repeat: no-repeat; }
	.front-hero .text-wrap {  position: absolute; left: 0; right: 0; top: 35%; bottom: 0; text-align: center; }
	.front-hero .text-wrap h1 { color: #fff; font-size: 54px; margin: 0 0 40px; text-transform: uppercase; }

	.service-items { display: flex; flex-wrap: wrap; justify-content: center; padding-top: 40px; }
	.service-items .inner { width: 25%; padding: 0 30px; margin-bottom: 30px; }

	.front-how-it-work { padding: 90px 0; }

	.front-how-it-work { background: url('../images/bg-guy.png' ); background-color: #F5F5F5; background-repeat: no-repeat; background-size: contain; background-position: right bottom; }
	.how-it-work-text { padding: 0 50px; width: 50%; }

	.front-benefit { display: flex; }
	.front-benefit .front-benefit-cover { background: url('../images/benefits.jpg' ); background-size: cover; background-position: center; background-repeat: no-repeat; }
	.front-benefit>div:first-of-type { width: 60%; }
	.front-benefit>div:first-of-type img { width: 100%; height: 100%; }
	.front-benefit>div:last-of-type { width: 40%; padding: 80px 50px; }


	.testimonial { display: flex; margin: 60px auto 40px; }

	.testimonial:after { background: url('../images/stars-icon.png' ); background-position: center top; 
	background-repeat: no-repeat; content: ''; width: 120px; height: 70px; position: absolute; left: 50%; top: -30px; margin-left: -60px; z-index: 10; }
	.testimonial .inner { width: 33.3333%; padding: 30px; }

	.front-submit-request { padding-top: 40px; }
	.front-submit-request .text-wrap h2 { font-size: 36px; }

	.front-request { display: flex; background: #fff; border: #707070; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.25); width: 900px; margin: -100px auto 80px; padding: 40px 60px; }
	.front-request>div:first-of-type { width: 70%; padding-right: 40px; }
	.front-request>div:last-of-type { width: 30%; }
	.front-request>div:last-of-type>div { border-left: 1px solid #000; padding: 0 0 80px 40px; }

	.front-request>div p { margin: 0 0 15px; }
}

@media (min-width: 1600px) {
	.container-wrap { width: 1440px; }

	.how-it-work-text { padding: 0 0 0 250px; }
}


.container { background: #F8F8F8; min-height: 75vh; }
.wrapper-login,
.wrapper-registration { padding: 30px 15px; margin: 0 auto; }
.user-registration { background: #fff; margin: 0 !important; }
.wrapper-login form input,
.wrapper-registration form input { padding: 7px 15px; color: #707070; line-height: 1; }
.wrapper-login form label,
.wrapper-registration form label { font-weight: 600; color: #292828; }
.wrapper-login form .button,
.wrapper-registration form .button { -webkit-appearance: none; transition: all .3s; display: inline-block; cursor: pointer; border: 2px solid #21ad8c; background: #21ad8c; color: #fff; letter-spacing: 1.5px; font-weight: 600; padding: 9px 40px; border-radius: 20px; }
.wrapper-login form .button:hover,
.wrapper-registration form .button:hover { background: none; color: #21ad8c; }
.wrapper-login .user-registration-form-login .user-registration-register.register a { color: #21ad8c; }
@media (min-width: 1200px) {
    .wrapper-login,
    .wrapper-registration { width: 640px; }
}


/* profile */
.profile-info .current_page_item { color: #21ad8c; }

#user_profile { margin-bottom: 40px; }
#wpua-upload-existing,
#wpua-upload-messages-existing,
#wpua-images-existing { display: none !important; }

/* account plan */
.wrap-accaunt-info h2 { margin-top: 0; }

.table-head { margin-bottom: 40px; }
.table-head>div { display: flex; flex-wrap: wrap; width: 100%; }
.table-head>div:first-of-type { background: #21ad8c; color: #fff; font-weight: 600; }
.table-head>div:first-of-type div { border-right: 1px solid #fff; }
.table-head>div:first-of-type div:last-of-type { border-right: 0; }
.table-head>div>div { border-right: 1px solid #ececec; }
.table-head>div>div:last-of-type { border-right: 0; }
.table-head>div>div { padding: 10px; width: 20%; border-bottom: 1px solid #ccc; }
.table-head-4>div>div { width: 25%; }


/* profile nav mobile */
.mobile-nav { box-shadow: 0 8px 18px 0px #000; font-size: 24px; list-style: none; background: #21ad8c; position: fixed; bottom: 0; left: 0; right: 0; color: #fff; display: flex; flex-wrap: wrap; justify-content: space-around; padding: 0; margin: 0; }
.mobile-nav li { padding: 9px 0; border-right: 1px solid #fff; width: 16.66667%; text-align: center; }
.mobile-nav li:last-of-type { border-right: 0; }
.mobile-nav li a:hover { color: #000; }

@media (min-width: 1200px) {
    .mobile-nav { display: none !important; }
}

@media (max-width: 1199px) {
    .account-nav-logged-in,
    .wpas-ticket-list .aside,
    .account-page .aside:not(.account) { display: none !important; }

    .aside.account { text-align: center; }

    .table-head>div:nth-child(even) { background: #ececec; }
    .table-head>div:nth-child(odd) { }
    .table-head>div>div { width: 100%;  }
    .table-head-4>div>div { width: 100%; }
}


.my-account-nav.open-ticket li.tickets a,
.my-account-nav.open-inv li.billing a { position: relative; }
.my-account-nav.open-ticket li.tickets a:after,
.my-account-nav.open-inv li.billing a:after { content: ''; width: 7px; height: 7px; border-radius: 50%; background: red; position: absolute; right: -15px; top: 9px; }


.login-wrap h1 { padding: 40px 0; margin-bottom: 0; }
.login-wrap h3 { margin: 0 0 20px; }

#user-registration .user-registration-register { display: none !important; }
#user-registration { padding-bottom: 140px; }
.social-login-wrap { margin-top: -140px; padding-left: 20px; }


@media (max-width: 1199px) {
    .login-wrap>div>div { margin-bottom: 40px; }
}

@media (min-width: 1200px) {
    .login-wrap>div { display: flex; flex-wrap: wrap; }
    .login-wrap>div>div { width: calc( 50% - 25px ); margin-bottom: 80px; }
    .login-wrap>div>div:first-of-type { margin-right: 50px; }
}

/* modal wrap style */
.modal { position: fixed; z-index: 10000; top: 0; left: 0; visibility: hidden; width: 100%; height: 100%; }
.modal.is-visible { visibility: visible; }
.modal-overlay { position: fixed; z-index: 10; top: 0; left: 0; width: 100%; height: 100%; background: hsla(0, 0%, 0%, 0.5); visibility: hidden; opacity: 0; transition: visibility 0s linear 0.3s, opacity 0.3s; }
.modal.is-visible .modal-overlay { opacity: 1; visibility: visible; transition-delay: 0s; }
.modal-wrapper { position: absolute; z-index: 9999; top: 6em; left: 50%; width: 280px;
 margin-left: -140px; background-color: #fff; box-shadow: 0 0 1.5em hsla(0, 0%, 0%, 0.35); }
.modal-transition { transition: all 0.3s 0.12s; transform: translateY(-10%); opacity: 0; }
.modal.is-visible .modal-transition { transform: translateY(0); opacity: 1; }
.modal-content { padding: 40px; text-align: left; }
.modal-close { position: absolute; top: 0; right: 0; padding: 1em; color: #aaa; background: none; border: 0; }
.modal-close:hover { color: #777; }

@media (min-width: 1200px) {
    .modal-wrapper { width: 620px; margin-left: -310px; }
}

.modal-downgrade .modal-content,
.modal-tnk .modal-content { text-align: center; }
.modal-tnk i { color: #21ad8c; font-size: 42px; }
.modal-tnk h3 { font-size: 24px; margin: 15px 0; }
.modal-tnk p { font-size: 18px; margin: 0; }


.modal-downgrade .btn-wrap { display: flex; flex-wrap: wrap; margin-top: 30px; justify-content: center; }
.modal-downgrade .btn-wrap button { margin-right: 20px; }

    .payment.container .wrap { padding: 30px 15px; }
    .payment .title-h1 { text-align: center; margin: 20px auto; }
    .payment .title-h2 { text-align: center; margin: 20px auto; font-size: 24px; }
    .payment .account-Plan-items { margin-top: 40px; }
    .account-Plan-items .inner.hide { display: none !important; }
    .payment .account-Plan-items .inner { text-align: center; background: #fff; border-radius: 15px; padding: 40px 60px; margin: 0 20px 40px; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15); }
    .payment .account-Plan-items .inner:hover { box-shadow: 0 15px 20px rgba(0, 0, 0, 0.15); cursor: pointer; }
    .payment .account-Plan-items .inner h2 { font-size: 28px; margin: 0 0 40px; color: #21ad8c; font-weight: 400; }
    .payment .account-Plan-items .inner .price { font-size: 36px; text-transform: uppercase; margin: 0; }
    .payment .account-Plan-items .inner .price>span { font-size: 0.4em; text-transform: initial; }
    .payment .account-Plan-items .inner .subtitle { text-transform: uppercase; margin: 10px 0; }
    .payment .account-Plan-items .inner .short-descriptions { color: #21ad8c; margin: 0; }
    .payment .account-Plan-items .inner .account-options { margin: 40px 0 60px; text-align: left; }
    .payment .account-Plan-items .inner .account-options ul { margin: 0; padding-left: 0; list-style: none; }
    .payment .account-Plan-items .inner .account-options ul li { margin-bottom: 8px; width: calc( 100% - 30px ); line-height: 1.2; position: relative; }
    .payment .account-Plan-items .inner .account-options ul li .hint-item { position: absolute; top: 50%; right: -20px; }
    .payment .account-Plan-items .inner .account-options ul li .hint-item:after { content: '?'; position: absolute; top: 50%; right: -20px; margin-top: -8px; width: 16px; height: 16px; text-align: center; font-size: 10px; line-height: 16px; border: 1px solid rgba(0, 0, 0, 0.5); border-radius: 50%; color: rgba(0, 0, 0, 0.5); }
    .payment .account-Plan-items .inner .account-options ul li .hint-text { display: none; position: absolute; left: -240px; top: -30px; border-radius: 5px; z-index: 100; width: 220px; padding: 15px 20px; box-shadow: 0 0 20px 5px rgba(0, 0, 0, 0.15); background: #fff; }
    .payment .account-Plan-items .inner .account-options ul li .hint-text:after { position: absolute; right: -5px; top: 20px; content: ''; transform: rotate(45deg); width: 20px; height: 20px; background: #fff; }
    .payment .account-Plan-items .inner .account-options ul li .hint-item:hover .hint-text { display: block; }
    .payment .account-Plan-items .inner .account-options ul li .hint-item.active .hint-text { display: block; }
    @media (max-width: 1199px) {
        .payment .account-Plan-items .inner { padding: 40px 30px; margin: 0 10px 40px; }
    }

    @media (min-width: 1200px) {
        .payment.container .wrap { width: 1200px; margin: 0 auto; }
        .payment .account-Plan-items .inner .account-options { height: 210px; }
        .payment .account-Plan-items { display: flex; }
        .payment .account-Plan-items .inner { padding: 60px 40px; width: 33.3333%; }
    }
    @media (min-width: 1900px) {
        .payment.container .wrap { width: 1440px; margin: 0 auto; }
    }

.single-ticket h1 { margin-top: 0; }

    .carriers-request { max-width: 600px; margin: 0 auto; padding-top: 20px; padding-bottom: 100px; }
    .carriers-request form input:not([type="submit"]),
    .carriers-request form select,
    .carriers-request form textarea { width: 100%; margin-bottom: 15px; border-radius: 5px; border: 1px solid #707070; color: #707070; padding: 7px 15px; }

    .ticket-carriers-meta { margin-bottom: 30px; }
    .ticket-carriers-meta>div { margin-bottom: 10px; }
    @media (max-width: 1199px) {
        .ticket-carriers-meta { background: #21ad8c; color: #fff; padding: 15px; }
    }
    @media (min-width: 1200px) {
        .ticket-carriers-meta { display: flex; flex-wrap: wrap; }
        .ticket-carriers-meta>div { padding-right: 30px; }
        .ticket-carriers-meta>div>b { display: block; }
    }

    .load-link { background: none; border: 0; font-size: 16px; margin-bottom: 15px; font-weight: 600; cursor: pointer; display: block; }
    .load-link:hover { color: #21ad8c; }

    #wpas_ticketlist { font-size: 14px; line-height: 1.2; }
    #wpas_ticketlist tbody tr:nth-child(even) { background: rgba( 33, 173, 140, .1 ); }