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

/* NEW CSS */
body { font-family:'Open Sans', "Arial", "serif"; color:#260303; font-size:16px; font-weight:300; background:#fff; position:relative;}
a { font-family:'Open Sans', "Arial", "serif"; color:#260303; font-size:16px; font-weight:300; text-decoration:none; }
a:hover { font-family:'Open Sans', "Arial", "serif"; color:#260303; font-size:16px; font-weight:300; text-decoration:none; }

a, img, input, button, textarea, select { outline:none; }

* { margin:0; padding:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }
.clearfix:after { clear:both; content:""; display:block; font-size:0; height:0; visibility:hidden;}

a, .trans { -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -ms-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease; }

.preloader { background:#fff; position:fixed; left:0;top:0; right:0; bottom:0; z-index:10}
.preloader .logo { opacity: 0; width:300px; height:74px; position:absolute; left:50%; top:50%; margin:-38px 0 0 -150px; z-index:10; animation: jump 3s infinite linear;}
.preloader .logo img { width:100%; display:block}

@keyframes jump {
	100% { opacity: 0; }
	75% { opacity: 1; }
	50% { opacity: 0; }
	25% { opacity: 1; } 
	0% { opacity: 0; }
}


#wrapper { position:relative; overflow:hidden;}
.wrapper { width:1254px; margin:auto; position:relative; z-index: 3}

.no-scroll { overflow:hidden}

.no-scroll #header, .no-scroll #footer { z-index: 0}

.btn { display: inline-block; border-radius:70px; border: 2px solid #260303; height: 54px; color: #000; text-align: center; background: #fff; cursor: pointer; font-size: 18px; text-transform: uppercase; line-height: 52px; padding: 0 40px;}
.btn:hover { font-size: 18px; border: 2px solid #ccc; }
.btn span {display: inline-block; position: relative}
.btn.arrow span { background:url("../images/arrow-line-black.svg") no-repeat 100% 50%; padding-right: 40px;}


strong { font-weight: 700}
.center { text-align: center}

.sidebar { float:left; width: 32%; }
.common { float:right; width: 66%; }

.sidebar.reverse { float:right; }
.common.reverse { float:left; }

.row { display:flex; flex-direction:row; position: relative;  margin: 0 -10px}
.row .col { flex-grow:1; position:relative; min-height:46px; padding: 10px; }

.row .col-12 { width:100%; }
.row .col-11 { width:91.666%; }
.row .col-10 { width:83.333%; }
.row .col-9 { width:75%; }
.row .col-8 { width:66.666%; }
.row .col-7 { width:58.333%; }
.row .col-6 { width:50%; }
.row .col-5 { width:41.333%; }
.row .col-4 { width:33.333%; }
.row .col-3 { width:25%; }
.row .col-2 { width:16.666%; }
.row .col-1 { width:8.333%; }


h1 { font-size: 60px; margin: 0; padding: 0; line-height: 1.1}

/* HEADER */
#header { position: fixed; top: 0; left: 0; width: 100%; z-index:5; background:#ffd356; padding: 10px 0}

#header .logo { float:left; position: relative}
#header .logo a, #header .logo a img { display: block; }

#header .phone { float: right; text-align: right}
#header .phone .tel { font-size: 24px; line-height:1; display: block;}
#header .phone a { font-weight: bold; text-transform: uppercase; font-size: 12px}

#header .toggle-nav { display:none; float:left; position:relative; z-index:10; width:40px; height:40px; top:0;  }
#header .toggle-nav i { position:absolute; display:block; height:2px; background:#000; width:30px; right:5px; }

#header .toggle-nav i:nth-child(1) { top:10px; }
#header .toggle-nav i:nth-child(2) { top:19px; }
#header .toggle-nav i:nth-child(3) { top:28px; }

#header .toggle-nav.active { border-radius:40px; }
#header .toggle-nav.active i:nth-child(1) { top:19px; -webkit-transform:rotateZ(45deg); -moz-transform:rotateZ(45deg); -o-transform:rotateZ(45deg); transform:rotateZ(45deg); }
#header .toggle-nav.active i:nth-child(2) { background:transparent; }
#header .toggle-nav.active i:nth-child(3) { top:19px; -webkit-transform:rotateZ(-45deg); -moz-transform:rotateZ(-45deg); -o-transform:rotateZ(-45deg); transform:rotateZ(-45deg); }

#header .lang ul li { list-style-type:none; position:relative}
#header .lang ul li a { display:block; font-size: 14px; letter-spacing: 0.5px; padding-bottom: 10px; text-transform: uppercase; }
#header .lang ul li:hover ul { display: block}

#header .lang { float: left; margin-left:15%; margin-top:15px }
#header .lang ul li ul { position: absolute; top:100%; display: none }
#header .lang ul li ul li { float: none; display: block; white-space: nowrap; margin:0 0 5px 0}
#header .lang ul li ul li:last-child { margin-bottom: 0}
#header .lang ul li ul li a { padding-bottom: 0}
#header .lang a.tree { background: url("../images/chevron.svg") no-repeat 100% 7px; padding-right: 20px}

#header .user { float: left; margin-left:15%; margin-top:7px; }
#header .user a { height: 36px; background: url("../images/icon-user.png") no-repeat 0 50%; padding-left: 40px; display: flex; align-items: center; line-height: 1; font-size: 14px; color: #000; text-transform: uppercase; padding-top: 2px}

#main { padding: 58px 0}

.menu-mobile { position: fixed; left:-300px; top: 0; bottom: 0; background: #e11f1a; z-index: 20; width: 300px; padding: 20px; overflow-y: scroll; visibility: hidden;}


.menu-mobile .menu { padding: 0 0 20px 0}

.menu-mobile .menu li { position: relative; list-style-type: none}

.menu-mobile .menu li a { display:inline-block; color:#fff; text-transform: uppercase; font-size: 16px; padding: 3px 0 3px 0; position: relative}
.menu-mobile .menu li a:hover, .menu-mobile .menu li a.active { color:#fff; font-size: 16px; }

.menu-mobile .menu.big li a { display:inline-block; color:#ffd356; text-transform: uppercase; font-size: 24px; padding: 3px 0 3px 0; position: relative; font-weight: bold}
.menu-mobile .menu.big li a:hover, .menu-mobile .menu.big li a.active { color:#fff; font-size: 24px; font-weight: bold; }

.menu-mobile .menu li .trigger { height:36px; width: 36px; display: block; position:absolute; right: 0; top: 0; background:url("../images/icon-triangle.svg") no-repeat 50% 50%; cursor: pointer}
.menu-mobile .menu li.active .trigger { transform: rotate(180deg); }
.menu-mobile .menu li a.active+ul { display: block}

.menu-mobile .lang { margin: 40px 0; border-bottom: 1px solid #fff;; border-top: 1px solid #fff;}
.menu-mobile .lang li { float: left; width:50%; text-align: center; list-style-type: none}
.menu-mobile .lang li a { display: block; padding: 5px 0 5px 0; font-size: 16px; color:#fff;}
.menu-mobile .lang li a:hover, .menu-mobile .lang li a.active { color:#fff; font-weight: bold}

.menu-mobile .phone a, .menu-mobile .email a { font-size: 20px; font-weight: bold; color: #fff}
.menu-mobile .phone .tg { background: url("../images/icon-tg-white.svg") no-repeat 50% 50%; width: 16px; height: 16px; display: inline-block; margin-left: 10px}
.menu-mobile .phone .whatsapp { background: url("../images/icon-whatsapp-white.svg") no-repeat 50% 50%; width: 16px; height: 16px; display: inline-block; margin-left: 10px}


.menu-mobile .toggle-nav { display:block; position:relative; z-index:10; width:40px; height:40px; margin-top: -10px; margin-bottom: 10px}
.menu-mobile .toggle-nav i { position:absolute; display:block; height:2px; background:#fff; width:30px; right:5px; }


.menu-mobile .toggle-nav i:nth-child(1) { top:19px; -webkit-transform:rotateZ(45deg); -moz-transform:rotateZ(45deg); -o-transform:rotateZ(45deg); transform:rotateZ(45deg); }
.menu-mobile .toggle-nav i:nth-child(2) { background:transparent; }
.menu-mobile .toggle-nav i:nth-child(3) { top:19px; -webkit-transform:rotateZ(-45deg); -moz-transform:rotateZ(-45deg); -o-transform:rotateZ(-45deg); transform:rotateZ(-45deg); }


.content {}
.content ul { }
.content li { padding-left: 24px; list-style-type: none; position: relative}
.content li:before { content: '';  width: 15px; height: 3px; background:#24347a; position: absolute; top: 11px; left: 0;}
.content p { padding-bottom: 20px}

.first-screen { position: relative; padding:20px 0 40px 0; background:#ffd356; margin-bottom: 58px}
.first-screen .block { }
.first-screen h1 { color: #24347a; }
.first-screen h1 span { color: #e11f1a; }
.first-screen .block-header, .first-screen .block-content { max-width: 760px;}


.block { border-top: 2px solid #e11f1a; border-radius: 22px; padding: 40px 20px 80px 20px; overflow: hidden }
.block.no-border { border-top: none;}
.block.shadow { box-shadow: 0px 15px 20px rgba(0,0,0,0.2); margin: 40px 0}
.block .block-header { position: relative; padding-bottom: 20px; color: #24347a; font-size:42px; line-height: 1.1}
.block .block-header strong { font-weight: bold; display: block; color: #e11f1a}
.block .block-header.black { color: #000}
.block .block-content { position: relative; z-index: 4; padding-bottom: 20px}

.block.user { padding: 0;}
.block.user .sidebar { padding: 100px 20px; background:#ffd356; min-height:780px; text-align: center}
.block.user .common { padding: 40px 20px; }

.box { padding: 20px; border-radius: 20px; margin-bottom: 20px}
.box .block-header { color: #24347a}
.box.yellow { background: #ffd356}
.box.border { border:1px solid #c5c5ca}



.tariff-list { padding-bottom: 20px}
.tariff-list .tariff-item {  display:flex; flex-direction:row; position: relative; z-index: 1; background: #fff; border-radius: 50px; margin-bottom: 10px}
.tariff-list .tariff-item:nth-child(1) { background: none}
.tariff-list .tariff-item div { flex-grow:1; position:relative; width: 20%; padding: 10px 10px; text-align: center; align-items: center; justify-content: center; display: flex;}
.tariff-list .tariff-item div:nth-child(1) { width: 160px; text-align: left; justify-content: left;}


.ceo { padding: 40px; background: #ffd356; position: relative; margin-top: 115px}
.ceo:before { content: ""; height: 0; position: absolute; top: 0; right: 0; border-bottom: 40px solid #e6c65f; border-right: 40px solid #ffffff; }

.ceo blockquote { font-size: 32px; font-weight: 400; padding: 20px 40px; letter-spacing: -2px; margin-bottom: 20px; position: relative; line-height: 1.3}
.ceo blockquote:before { position: absolute; content: ''; background: url("../images/quote-left.svg") no-repeat 50% 50%; width: 30px; height: 27px; display: block; left: 0; top: 0}
.ceo blockquote:after { position: absolute; content: ''; background: url("../images/quote-right.svg") no-repeat 50% 50%; width: 29px; height: 27px; display: block; right: 0; bottom: 0}
.ceo .thumb { float: left}
.ceo .info { padding-left: 80px; padding-top: 5px}

.service-list { }
.service-list .service-item {padding-bottom: 40px}
.service-list .service-item .thumb { float: left;}
.service-list .service-item .thumb img { display: block}
.service-list .service-item .info { padding-left: 200px}
.service-list .service-item .info .name { font-size: 24px; font-weight: 700; }
.service-list .service-item .info .button { padding-top: 20px; text-align: right}


.booking-steps { }
.booking-steps .step { float: left; width:calc(33% - 40px); position: relative; padding-left:40px }
.booking-steps .step:before { content: ''; height: 1px; width:calc(100% - 120px); background: #e11f1a; position: absolute; top: 16px; right: 10px}
.booking-steps .step:last-child { width: 120px}
.booking-steps .step .num { width: 32px; height: 32px; border-radius: 32px; border: 1px solid #e11f1a; font-size: 14px; color: #e11f1a; text-align: center; display: block; line-height: 30px; position: absolute; left: 0; top: 0;}
.booking-steps .step.active .num { background: #e11f1a; color: #fff}
.booking-steps .step .name { padding-top: 3px}
.booking-steps .step .name h3 { color: #260303; font-size: 18px;}


.accord-content { display: none}
.active .accord-content { display: block}

.faq-list .faq-item { padding-bottom: 20px}

.faq-list .faq-item .name { border:2px solid #fff; border-radius:40px; padding:12px 24px 12px 48px; position: relative}
.faq-list .faq-item .name .trigger { position: absolute; left: 12px; width: 25px; height: 25px; top: 50%; margin-top: -12px; background: url("../images/arrow.svg") no-repeat 50% 50%; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -ms-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease;}
.faq-list .faq-item.active .name .trigger { transform: rotate(-90deg);  }
.faq-list .faq-item.active .name { background: #fff}
.faq-list .faq-item .accord-content { padding: 20px 15px 0 15px}


/* SLIDER */
.slider { position:relative; padding-bottom:10px}
.slider .owl-stage-outer  { overflow: hidden}
.slider .owl-item { float:left }

.slider .owl-nav.disabled { display: none; }
.slider .owl-dots.disabled { display: none; }

.slider .owl-dots { position:absolute; width: max-content; transform:translate(-50%, 0); bottom:-20px; left: 50%; }
.slider .owl-dots button { display:block; border:1px solid #fff; background:none; border-radius: 10px; width: 15px; height: 15px; float:left; margin:0 5px;}
.slider .owl-dots button.active { background:#fff;  }
.slider .owl-dots span { display:none }

.slider .owl-nav button.disabled { opacity: 0.5}
.slider .owl-nav button { position:absolute; top:50%; z-index: 10; display: block; width: 50px; height: 50px; border-radius:4px; background:#BE0027; text-align: center; border:none; margin-top: -30px; cursor: pointer; color: #fff; font-size: 36px}
.slider .owl-nav button:hover { background:#A00021; }
.slider .owl-nav button span { display: block; text-align: center; font-size: 24px}
.slider .owl-nav .owl-prev { left: -80px; }
.slider .owl-nav .owl-next { right:-80px;}




#footer { background:#ffd356; padding: 40px 0; position: relative}
#footer .email { padding-bottom: 30px}
#footer .phone a, #footer .email a { font-size: 20px; font-weight: bold}
#footer .phone .tg { background: url("../images/icon-tg.svg") no-repeat 50% 50%; width: 16px; height: 16px; display: inline-block; margin-right: 10px}
#footer .phone .whatsapp { background: url("../images/icon-whatsapp.svg") no-repeat 50% 50%; width: 16px; height: 16px; display: inline-block; margin-right: 10px}

#footer .menu { }
#footer .menu li { list-style-type: none; text-transform: uppercase; padding-bottom: 10px }

#footer a { position: relative}
#footer .menu a:hover:after { transform:scaleX(1); transform-origin:left center; }
#footer .menu a:after { transform:scaleX(0); transform-origin:right center; }
#footer .menu a:after { background:currentColor; bottom:-2px; content:''; height:1px; left:0; position:absolute; transition:transform 0.4s ease; width:100%; }

#footer .social { }
#footer .social span {  }
#footer .social ul { float: right; padding-top: 2px; padding-left: 10px }
#footer .social li { list-style-type: none; float: left; margin: 0 5px 0 0}


#footer .col:last-child { text-align: right}


#footer .pay li { list-style-type: none; float: left; margin: 0 5px 0 0}


/* POP */

.pop-overlay { display:none; position:fixed; left:0; right:0; top:0; bottom:0; z-index:100; padding: 40px 0 }
.pop-overlay.scroll { overflow-y:scroll}
.pop-overlay .overlay { position:fixed; left:0; right:0; top:0; bottom:0; background:rgba(0, 0, 0, 0.33); backdrop-filter:blur(64px); z-index:1;}
.pop-overlay .pop-wrapper { width:100%; max-width:1240px; left:50%; top:0; transform:translate(-50%,0); z-index:100; position:relative; background:#fff; border-radius:20px; padding:40px; color:#000; overflow:hidden; border: 4px solid #00D1FF; box-shadow: 0 5px 10px rgba(0,0,0,0.2);}
.pop-overlay .pop-wrapper .close { position:absolute; right:10px; top:10px; width:40px; height:40px; }
.pop-overlay .pop-wrapper .close:before, .pop-overlay .pop-wrapper .close:after { position: absolute; content: ''; display:block; height:2px; background:#4F5157; width:30px; right:5px; top:19px;}
.pop-overlay .pop-wrapper .close:before { -webkit-transform:rotateZ(45deg); -moz-transform:rotateZ(45deg); -o-transform:rotateZ(45deg); transform:rotateZ(45deg); }
.pop-overlay .pop-wrapper .close:after { -webkit-transform:rotateZ(-45deg); -moz-transform:rotateZ(-45deg); -o-transform:rotateZ(-45deg); transform:rotateZ(-45deg); }


/* WEB FORM */
.web-form .field { padding:10px 0; position:relative}
.web-form .field input[type="text"], .web-form .field input[type="password"], .web-form .field input[type="email"], .web-form .field input[type="number"]
{ background:#fff; border-radius:54px; padding:0 20px; height:54px; width:100%; font-family:'Open Sans'; font-size:16px; font-weight:500; border:1px solid #260303; color:#260303; }

.web-form .field input.disabled { opacity:0.2 }

.web-form .field select { background:#fff; border-radius:54px; padding:0 20px; height:54px; width:100%; font-family:'Open Sans'; font-size:16px; font-weight:500; }
.web-form .field select option { height: 50px}
.web-form .field textarea { background:#fff; border-radius:10px; padding:10px 10px; height:120px; width:100%; font-family:'Open Sans'; font-size:16px; font-weight:500; }

.web-form .field input + .switch-type { position: absolute; right: 20px; top: 27px; display: block; background:url("../images/icon-eye.svg") no-repeat 50% 50%; width: 20px; height: 20px; cursor: pointer; opacity: 0.3}
.web-form .field input + .switch-type.active { opacity: 0.9}

.web-form .field-file { position: relative}
.web-form .field-file span { display: block; width: 100%; border-radius:50px;  height: 54px; color: #fff; text-align: center; background: #e11f1a; cursor: pointer; font-size: 18px; font-weight: bold; text-transform: uppercase; line-height: 54px; }
.web-form .field-file input { position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; z-index: 1}


.web-form .field-check .add { float: right; padding:15px 0; text-align: right; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 106px}

.web-form .field-notice { background: #00D1FF50 url("../images/icon-notice.svg") no-repeat 10px 15px; border-radius: 10px; padding: 15px 15px 15px 40px;}
.web-form .field-notice strong { display: block}

.web-form .field-warning { background: #F4511E50 url("../images/icon-warning.svg") no-repeat 10px 15px; border-radius: 10px; padding: 15px 15px 15px 40px;}
.web-form .field-warning strong { display: block}

.web-form .field-success { background: #2F8D5350 url("../images/icon-success.svg") no-repeat 10px 15px; border-radius: 10px; padding: 15px 15px 15px 40px;}
.web-form .field-success strong { display: block}

.web-form .gallery-image { position: relative; }
.web-form .gallery-image .preview { position: relative; float: left; width: 32%; margin: 0 2% 2% 0}
.web-form .gallery-image .preview:nth-child(3n) { margin-right: 0}
.web-form .gallery-image .preview .item { border-radius: 5px; overflow: hidden; width: 100%; height: 200%;}
.web-form .gallery-image .preview img { width: 100%; height: 100%; object-fit: cover; overflow: hidden; display: block }
.web-form .gallery-image .preview a { background: url("../images/delete-image.svg") no-repeat 50% 50%; display: block; width: 19px; height: 19px; position: absolute; right: 10px; top: 10px;}

.web-form .button { padding-top:20px; }
.web-form .button button { display: block; width: 100%; border-radius:50px; border: 4px solid #e11f1a; height: 54px; color: #fff; text-align: center; background: #e11f1a; cursor: pointer; font-size: 18px; font-weight: bold; text-transform: uppercase; }
.web-form .button button:hover {border: 4px solid #FFD2C7; }
.web-form .button button span {display: inline-block; position: relative}
.web-form .button button.arrow span { background:url("../images/arrow-line.svg") no-repeat 100% 1px; padding-right: 40px;}

.web-form .button a.back { display: block; width:54px; border-radius:50px; border: 2px solid #260303; height: 54px; cursor: pointer; margin-right: 20px; background: url("../images/arrow-line-black.svg") no-repeat 50% 50%; transform: rotate(180deg);}


.web-form input[type="number"]::-webkit-outer-spin-button,
.web-form input[type="number"]::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }

.web-form .field-block { padding:10px 0; position: relative}

.web-form .field-qty { padding:0 25px 10px 0; font-size:16px;}
.web-form .field-qty .qty { width: 110px; height: 36px; border-radius: 36px; border:1px solid #260303; padding:0; text-align: center; float: left}
.web-form .field-qty .qty .plus, .web-form .field-qty .qty .minus { float: left; width: 34px; height: 34px; line-height: 32px; cursor: pointer}
.web-form .field-qty .qty input { float: left; width: 36px; height: 34px; display: block; border:none; text-align: center; font-size:16px;}
.web-form .field-qty input[type="number"]::-webkit-outer-spin-button, .web-form input[type="number"]::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }

.web-form .field-qty .label { float: left; width: calc(100% - 170px); padding:5px 5px 5px 15px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden}
.web-form .field-qty .add { float: right; width: 50px; padding:5px 0; text-align: right}


.web-form .field-check { border-radius: 54px; height: 54px; border:1px solid #260303; margin-bottom: 10px; font-size:16px;}
.web-form .field-check label { display: block; height: 100%; width: 100%; padding: 0 25px; position: relative}
.web-form .field-check label a { color:#0755B1; text-decoration: underline}
.web-form .field-check span.checkmark { width: 20px; height: 20px; border:1px solid #260303; border-radius: 5px; display: block; float: left; margin-top: 16px }
.web-form .field-check input:checked ~ span.checkmark { background-color: #260303; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e"); background-size: 70% auto; background-repeat: no-repeat; background-position: 50% 50%}
.web-form .field-check input { opacity: 0; position: absolute; top: 20px;}
.web-form .field-check .label { float: left; width: calc(100% - 130px); padding:15px 15px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden}
.web-form .field-check .add { float: right; padding:15px 0; text-align: right; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 106px}

.web-form .field-check.simple { border:none; height: auto}
.web-form .field-check.simple .label { float: left; width: calc(100% - 130px); padding:15px 15px; white-space:inherit; text-overflow:inherit; overflow:inherit}

.web-form .row .col-1 { padding: 0; min-height: 0}


.web-form p a { color:#0755B1; text-decoration: underline}

.web-form .drop-down.active { z-index: 5}
.web-form .drop-down.disabled { opacity: 0.2}
.web-form .drop-down { position: relative; display:block; width: 100%; height:54px; margin-top: 0;} 
.web-form .drop-down .button { display: block; height: 54px; width: 100%; position: relative; z-index: 4; text-align: left; padding-top: 0; border:1px solid #260303; color:#260303; border-radius: 27px}
.web-form .drop-down .button span { background-repeat: no-repeat; display: block; height: 54px; background-position: left 10px center; padding: 0 60px 0 25px; line-height: 54px; white-space: nowrap; overflow: hidden; width: calc(90% ); text-overflow: ellipsis}
.web-form .drop-down .button span span { float: right; display: inline; width: auto; padding: 0}

.web-form .drop-down .button span .price { position: absolute; right: 55px; top: 0px; height: 52px;}

.web-form .drop-down .select-list-link { position: absolute; width: 100%; height: 100%; left: 0; top: 0}

.web-form .drop-down .select-list-link:before { content: ''; display: block; height: 16px; width: 16px; background: url("../images/icon-chevron.svg") no-repeat 50% 50%; background-size: 16px auto; -webkit-transform:rotateZ(0); -moz-transform:rotateZ(0); -o-transform:rotateZ(0); transform:rotateZ(0); position: absolute; right: 30px; top: 19px}
.web-form .drop-down.active .select-list-link:before { -webkit-transform:rotateZ(180deg); -moz-transform:rotateZ(180deg); -o-transform:rotateZ(180deg); transform:rotateZ(180deg);}


.web-form .drop-down select { display: none; } 
.web-form .drop-down .select-wrapper { position: absolute; left: 0; right: 0; z-index: 3; top:26px; padding:27px 0 0 0;  border-radius: 0 0 27px 27px; overflow: hidden} 
.web-form .drop-down.active .select-wrapper { border: 1px solid #260303; border-top: none;} 
.web-form .drop-down .select-list li { display: none; list-style: none; background-color: #fff; overflow: hidden; cursor:pointer; position: relative;} 
.web-form .drop-down .select-list li.show { display: block}
.web-form .drop-down .select-list li .price { position: absolute; right: 25px; top: 0px;}

.web-form .drop-down .select-list li span.trigger {  display: inline-block; min-height: 40px; min-width: 280px; padding: 0 75px 0 25px; line-height: 40px; background-position: left 10px center; background-repeat: no-repeat; font-size: 18px; text-align: left; color: #000; box-sizing: border-box; white-space: nowrap; overflow: hidden; width: calc(100%); text-overflow: ellipsis } 
.web-form .drop-down .select-list li span.trigger:hover, .drop-down .select-list li span.trigger:focus, .drop-down .select-list li.active span.trigger { background-color:#D5D5D5;   }

.web-form .drop-down .select-wrapper .select-sub { position: absolute; left: 100%; top:0; width: 100%; min-height: 100%; height: 100%; overflow-y: scroll; border-left: 1px solid #333; background: #f8f8f8; }

.web-form .drop-down .select-wrapper .active .select-sub, .filter .drop-down .select-wrapper .active .select-sub li { display: block}

.web-form .drop-down .checkbox { padding: 0 20px; margin: 5px 0 !important; line-height: 16px !important; float: none !important}
.web-form .drop-down .checkbox .check { cursor: pointer;  }
.web-form .drop-down .checkbox .check span { display: block; width: 16px !important; height: 16px !important; min-width: 14px !important; min-height:14px !important; border-radius: 0 !important}
.web-form .drop-down .checkbox .check input { display: none}


/* STIPES */
.web-form .field #card_number, .web-form .field #card_expiry, .web-form .field #card_cvc { background:#fff; border-radius:54px; padding:0 20px; height:54px; width:100%; font-family:'Open Sans'; font-size:14px; font-weight:500; border:1px solid #260303; color:#260303; }


#calc h2 { margin:0; padding:0; }

.total h3 { font-size:20px}
.total a { color: #0755B1; border-bottom: 2px dashed #0755B1; font-weight: bold; margin-left: 20px; font-size:20px; display: inline-block}
.total a:hover { border-bottom: 2px dashed transparent }

/**/
.main-web-form { background:#fff; border-radius: 50px; margin: 40px 0 100px 0;  position: relative}
.main-web-form .field { float: left; padding:10px 25px 12px 25px; position:relative; z-index: 2; height:70px; width: 25%}
.main-web-form .field:nth-child(2):before, .main-web-form .field:nth-child(3):before { background: #ccc; width: 1px; height:40px; display: block; position: absolute; left: 0; top:15px; content: ''; }
.main-web-form .field label { display:inline-block; color:#666669; font-size: 13px; line-height: 1; padding-right:20px; background-position: 100% 45%; background-repeat: no-repeat; position: relative}
.main-web-form .field label.flight { background-image: url("../images/icon-airplane.svg")}
.main-web-form .field label.date { background-image: url("../images/icon-calendar.svg")}

.main-web-form .field input { font-size: 18px; font-weight: bold; height: 24px; display: block; border: none; color: #260303}

.main-web-form .field .notice, .web-form .notice { position: absolute; width: calc(100% - 50px); min-width: 280px; padding:5px 10px; border-radius: 5px; color: #000; background: #fff; box-shadow: 0 5px 10px rgba(0,0,0,0.2); bottom: 100%}
.main-web-form .field .notice:before, .web-form .notice:before { content: ""; height: 0; position: absolute; top: 100%; left: 10px; border-bottom: 10px solid transparent; border-right: 10px solid #ffffff; }

.main-web-form .field .notice .tg, .web-form .notice .tg { background: url("../images/icon-tg.svg") no-repeat 50% 50%; width: 16px; height: 16px; display: inline-block;  vertical-align: middle;}
.main-web-form .field .notice .whatsapp, .web-form .notice .whatsapp { background: url("../images/icon-whatsapp.svg") no-repeat 50% 50%; width: 16px; height: 16px; display: inline-block; margin-left: 10px; vertical-align: middle;}

.web-form .notice a { color:#0755B1; text-decoration: underline }

.main-web-form .addition { position: absolute; bottom: -70px; width: 100%}
.main-web-form .addition .field { width: 25%; position: relative}
.main-web-form .addition .field .radio { display: block; position: relative; line-height: 24px;}
.main-web-form .addition .field .radio input { float: left; margin-right: 10px}

.main-web-form .button { float: left; padding:10px 10px; position:relative; z-index: 2; width: 25%}
.main-web-form .button button { display: block; width: 100%; border-radius:50px; border: 4px solid #e11f1a; height: 50px; color: #fff; text-align: center; background: #e11f1a; cursor: pointer; font-size: 18px; font-weight: bold; text-transform: uppercase }
.main-web-form .button button:hover {border: 4px solid #FFD2C7; }

.main-web-form .button button.disabled { opacity: 0.5}

/**/
.main-web-form.schedule .field { width:37.5%}


.schedule-result { position: absolute; top:35px; left:0; right: 0; z-index: 1; padding: 40px 20px 20px 0; border-radius: 0 0 35px 35px; background: #fff; }
.schedule-result .schedule-item { color: #000; padding: 5px 25px;}
.schedule-result .schedule-item .flight { text-transform: uppercase; font-weight: 500}
.schedule-result .schedule-item .carrier { font-weight: 500}
.schedule-result .schedule-item .direction  { color: #666666}
.schedule-result .schedule-item .flight span { background:#F7BF04}
.schedule-result .schedule-item .direction span { background:#F7BF04; }

.schedule-result .scrollbar { max-height: 170px; overflow-y: scroll }

.scrollbar::-webkit-scrollbar-track {} 
.scrollbar::-webkit-scrollbar { width:8px; background-color: #e11f1a20; border-radius: 8px; } 
.scrollbar::-webkit-scrollbar-thumb { background-color:#e11f1a; border-radius: 8px; }
.scrollbar:hover::-webkit-scrollbar-thumb:hover { opacity:1} 

.xdsoft_datetimepicker .xdsoft_calendar th { background: #fff}
.xdsoft_datetimepicker .xdsoft_calendar td>div { padding: 0}
.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_default, .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current, .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box>div>div.xdsoft_current { border:none; color: #000; background:#ffd356; box-shadow:none;}
.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_other_month, .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_disabled, .xdsoft_datetimepicker .xdsoft_time_box>div>div.xdsoft_disabled { background: #fff; opacity: 0.3; border:none; color: #000}
.xdsoft_datetimepicker .xdsoft_calendar td, .xdsoft_datetimepicker .xdsoft_calendar th {  border:none; color: #000}
.xdsoft_datetimepicker .xdsoft_calendar td, .xdsoft_datetimepicker .xdsoft_calendar th div { width: 32px; height: 32px; border-radius: 32px; text-align: center; padding: 0; background:#fff}
.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_today { box-shadow: #000 0px 0px 2px inset; width: 32px; height: 32px; border-radius: 32px; background:#fff; color:#000}



.schedule-show { background:#fff; border-radius: 80px; margin: 40px 0; position: relative }
.schedule-show .from, .schedule-show .to { float: left; width:calc(50% - 32px); height: 80px; padding:15px 0 10px 30px; position: relative}

.schedule-show .to:before { background: #ccc; width: 1px; height:50px; display: block; position: absolute; left: 0; top:15px; content: ''; }
.schedule-show .to:after { background:#fff url(../images/icon-airplane.svg) no-repeat 50% 50%; width: 14px; height: 20px; display: block; content: ''; position: absolute; left: -7px; top:30px;  }

.schedule-show .city { font-size: 18px; font-weight: bold; color:#260303}
.schedule-show .date { font-size: 14px; color:#e11f1a}
.schedule-show .button  { float: right; margin-top: 15px; margin-right: 10px; }
.schedule-show .button .back { background:#e11f1a url(../images/arrow-line.svg) no-repeat 50% 50%; border-radius:50px; display: block; height: 50px; width: 50px; border: 4px solid #e11f1a; transform: rotate(180deg);}
.main-web-form .button .back:hover {border: 4px solid #FFD2C7; }

.payment-status { width: 100%; max-width: 600px;  border-radius: 20px; padding: 30px; margin: auto; text-align: center; box-shadow: 0px 15px 20px rgba(0,0,0,0.2);}
.payment-status h2 { padding: 20px 0}
.payment-status .button { padding: 40px 0 0 0}
.payment-status.success { border:4px solid #00D1FF; }
.payment-status.error {  border:4px solid #e11f1a; }

/* TOOLTIP */
.tooltip { cursor:help; position: relative}
.tooltip:hover {color: #007bff;}
.tooltip:after { background:rgba(0,0,0,0.8); border-radius:5px; color:#FFF; content:attr(data-tooltip); opacity:0; padding:5px; position:absolute; visibility:hidden; z-index:10; bottom:105%; left:-5px; min-width:160px; width: 100%; line-height: 1.1}
.tooltip:hover:after {opacity: 1; visibility:visible;}



.user-detail { border:4px solid #00D1FF; border-radius: 20px; padding: 30px; text-align: center; box-shadow: 0px 15px 20px rgba(0,0,0,0.2);}
.user-detail .thumb { width: 80px; height: 80px; background:#e11f1a url("../images/icon-user-ava.svg") no-repeat 50% 50%; border-radius: 80px; margin: auto; margin-bottom:30px; position: relative}
.user-detail .thumb a { display: block; height: 100%; position:relative}

.user-detail .thumb img { width:28px; position:absolute; right:-4px; top:-4px; background:#e11f1a; border-radius: 20px; padding:4px; border:1px solid #fff; }

.user-detail .name { font-size: 18px; font-weight: bold; padding: 10px 0}
.user-detail .email { font-size: 16px; padding: 10px 0 }
.user-detail .phone { font-size: 16px; padding: 10px 0 }
.user-detail .button { padding-top:30px}

.order-list { border-top: 1px solid #260303; border-bottom: 1px solid #260303;}
.order-list .order-item { display: flex; flex-direction: row; border-bottom: 1px solid #C4C4C4}
.order-list .order-item:last-child { border:none}
.order-list .order-item div { flex-grow: 1; padding:12px 10px 5px 10px;}
.order-list .order-item .action { text-align: right}
.order-list .order-item .action a { margin-left: 10px;}


.payment-method { padding: 40px; box-shadow: 0px 15px 20px rgba(0,0,0,0.2); border-radius: 20px; height: 100%}
.payment-method .qr { width: 290px; margin: auto; padding: 40px; border-radius: 20px; background:#e11f1a; box-shadow: 0px 10px 20px rgba(0,0,0,0.2); margin-top: 20px}
.payment-method .qr.tether { background: #ffd356}
.payment-method .qr img { border:20px solid #fff; display: block; width: 100%}

.pay-type { text-align: right; padding-top: 13px; font-size: 14px}
.pay-type ul { float: right; margin-left: 20px}
.pay-type li { list-style-type: none; float: left; margin: 0 5px 0 0}


@media (max-width:1200px) {
	.wrapper { width:100%; padding:0 10px}
	
	.sidebar { float:left; width: 49%; }
    .common { float:right; width: 49%; }
}

/* Portrait tablet to landscape and desktop */
@media (min-width:768px) and (max-width:979px) { 
	
}

/* Landscape phone to portrait tablet */
@media (max-width:767px) {

	h1 { font-size:32px; }
	
	#header .logo img { height: 40px; width: auto}
	#header .phone .tel { font-size: 18px;}
	
	#header .toggle-nav { display: block; margin-right: 10px }
	#header .lang, #header .user { display: none}
	
	.menu-mobile.active { visibility: visible; left: 0;}
	
	.sidebar { float:none; width: 100%; }
	.common { float:none; width: 100%; margin-top:40px}

	.sidebar.reverse { float:none; }
	.common.reverse { float:none; }

	.block.user .sidebar { display: none}
	
	.block .block-header { font-size:32px;}
	
	.main-web-form { background:transparent; border-radius: 0;}
	.main-web-form .field, .main-web-form.schedule .field { background:#fff; border-radius: 50px; float: none; padding:10px 25px 12px 25px; position:relative; height:70px; width: 100%; margin-bottom: 20px;}
	.main-web-form .field:nth-child(2):before { display: none }
	
	.main-web-form .field.trigger, .main-web-form .button { z-index:1}

	.main-web-form .field.focus{ z-index:3}


	.main-web-form .button { float: none; padding:0; position:relative; width: 100%}
	.main-web-form .button button { height:70px; }
	
	.main-web-form .addition { position: relative; bottom: 0}
	.main-web-form .addition .field { background:#fff; border-radius: 50px; float: none; padding:10px 25px 12px 25px; position:relative; height:70px; width: 100%; margin-bottom: 20px;}
	
	.web-form .field-check.simple .label { width: calc(100% - 25px); }

	
	.booking-steps { display: none}
	
	#footer .col:last-child { text-align:left}
	#footer .social ul { float: left; padding: 2px 10px 0 0}
	
	.ceo { margin-top: 0;}
	
	.pay-type { text-align: left; padding-top: 13px; font-size: 14px;}
	.pay-type ul { float: none; margin-left: 0; margin-top: 10px}
	
	.schedule-show .from, .schedule-show .to { width: 50%;}
	.schedule-show .button { display: none}
	
	/* GRID */
	.row { display:block; margin: 0}
	.row .col-12, .row .col-11, .row .col-10, .row .col-9, .row .col-8, .row .col-7, .row .col-6, .row .col-5, .row .col-4, .row .col-3, .row .col-2, .row .col-1 { width:100%; padding: 0;  }
}

/* Landscape phones and down */
@media (max-width:480px) { 
	
	.block { border-top:none; border-radius: 22px; padding: 20px 10px 20px 10px }
	
	.tariff-list .tariff-item div:nth-child(1) { width: 140px }
	.tariff-list .tariff-item div:nth-child(4) { display: none}
	
	.web-form .field-qty { padding-right:0 }
	.web-form .field-qty .label { width: calc(100% - 160px); padding-right: 0}


	.order-list .order-item { display: block}
	.order-list .order-item .date { text-align: right}
	.order-list .order-item div { width: 50%; float: left}
	
	.service-list .service-item .thumb { width: 115px; margin: auto; float: none}
	.service-list .service-item .info { padding-left: 0; text-align: center}
	.service-list .service-item .info .button { text-align: center}
	
	.payment-method { padding: 40px 20px}
	.payment-method .qr { width: 240px; margin: auto; padding: 30px; }
	
	.schedule-show { background: none;}
	.schedule-show .from, .schedule-show .to { width: 100%; background: #fff; border-radius: 80px; margin: 10px 0; position: relative;}
	
	.schedule-show .to:before, .schedule-show .to:after { display: none}

	
	/* GRID */
	.row { display:block; margin: 0}
	.row .col-12, .row .col-11, .row .col-10, .row .col-9, .row .col-8, .row .col-7, .row .col-6, .row .col-5, .row .col-4, .row .col-3, .row .col-2, .row .col-1 { width:100%; }
}