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

@font-face {
    font-family:MEFont;
    src:url("../fonts/meta_normal_reg_numbers.otf") format("opentype"),
		url("../fonts/meta_normal_reg_numbers.woff") format("woff");
}

/* NEW CSS */
body { font-family:'MEFont'; color:#4F5157; font-size:18px; font-weight:300; background-color:#fff; position:relative; }
a { font-family:'MEFont'; color:#4F5157; font-size:18px; font-weight:300; text-decoration:none; }
a:hover { font-family:'MEFont'; color:#4F5157; font-size:18px; 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; }

#wrapper { position:relative; overflow:hidden;}
.wrapper { width:1200px; margin:auto; position:relative}

.btn { height:22px; line-height:22px; padding:0 10px; font-weight:700; font-size:12px; text-align:center; display:inline-block; border:1px solid #EE761C; background-color:none; color:#4F5157; cursor:pointer; -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; position:relative; border-radius:5px; text-transform:uppercase }
.btn:hover { font-weight:700; font-size:12px; color:#4F5157; background-repeat:no-repeat;}

.btn.orange { background:#EE761C; color:#fff }
.btn.orange:hover { background:#EE761C; color:#fff;  }

.btn span { position:relative; z-index:2}

strong { font-weight:700}

.row { display:flex; flex-direction:row; position:relative; margin:0 -10px}

.row .col { flex-grow:1; position:relative; min-height:auto; 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%; }

.center { text-align: center }

/* HEADER */
.header { border-bottom:1px solid #D9D9D9; padding-bottom:20px}
.header .button { text-align:center; padding-bottom:20px; margin:-1px 0 0 0;}
.header .button a { display:inline-block; margin:0 5px; height:28px; border-radius:0 0 5px 5px; line-height:30px; background-repeat:no-repeat; background-position:7px 50% !important; padding-left:30px;}
.header .button a:hover { background-repeat:no-repeat}
.header .button a.rupor {  background-image:url("../images/icon-rupor.svg"); }
.header .button a.truck {  background-image:url("../images/icon-truck-cargo.svg"); background-position:5px 50% !important; }

.header .button a.search {  background-image:url("../images/icon-search-small.svg"); }
.header .button a.document {  background-image:url("../images/icon-document.svg"); }

.header .left-part { float:left; width:calc(50% - 105px); padding-top:20px}

.header .menu li { float:left; margin-right:24px; list-style-type:none}
.header .menu li a { font-size:18px; color:#4F5157; font-weight:700; position:relative}

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

.header .right-part { float:right; width:calc(50% - 105px); padding-top:20px}

.header .logo { display:block; float:left}
.header .logo a, .header .logo a img { display:block; margin:auto; text-align:center}

.header .city { float:left; margin-left:40px; background:url("../images/icon-city.svg") no-repeat 0 50%; padding-left:20px}
.header .phone { float:left; margin-left:40px; background:url("../images/icon-phone.svg") no-repeat 0 50%; padding-left:20px}

.header .user  {float:right; margin-top:-10px}
.header .user .login { background-color:#D9D9D9; background-image:url("../images/icon-user.svg"); background-repeat:no-repeat; background-position:15px 50%; border-radius:24px; height:48px; display:block; color:#4F5157; padding:0 20px 0 40px; line-height:46px }

.header .toggle-nav { display:none; float:right; position:relative; z-index:10; width:40px; height:40px; top:25px; margin-left:10px  }
.header .toggle-nav i { position:absolute; display:block; height:2px; background:#4F5157; 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); }


/* MOBILE HEADER */
.header-mobile { position:fixed; right:-290px; top:0; bottom:0; background:#F8F8F8; z-index:22; width:290px; padding:20px; overflow-y:scroll; visibility:hidden;}
.header-mobile.active { visibility:visible; right:0;}

.header-mobile .menu { padding: 20px 0}
.header-mobile .menu li { border-top:1px solid #ccc; position:relative; list-style-type:none}
.header-mobile .menu li a { display:inline-block; font-size:18px; padding:5px 36px 5px 0; min-height:36px; position:relative}
.header-mobile .menu li:last-child { border-bottom:1px solid #ccc; }

.header-mobile .city { float:left;  background:url("../images/icon-city.svg") no-repeat 0 50%; padding-left:20px}
.header-mobile .phone { float:left;  background:url("../images/icon-phone.svg") no-repeat 0 50%; padding-left:20px}

.header-mobile .user  { text-align: center; padding-top: 20px}
.header-mobile .user .login { background-color:#D9D9D9; background-image:url("../images/icon-user.svg"); background-repeat:no-repeat; background-position:15px 50%; border-radius:24px; height:48px; color:#4F5157; padding:0 20px 0 40px; line-height:46px; display: inline-block}


.header-mobile .button { text-align: center}
.header-mobile .button a { background-repeat:no-repeat; background-position:7px 50% !important; padding-left:30px; margin: 5px 0}
.header-mobile .button a:hover { background-repeat:no-repeat}
.header-mobile .button a.rupor {  background-image:url("../images/icon-rupor.svg"); }
.header-mobile .button a.truck {  background-image:url("../images/icon-truck-cargo.svg"); background-position:5px 50% !important; }

.header-mobile .button a.search {  background-image:url("../images/icon-search-small.svg"); }
.header-mobile .button a.document {  background-image:url("../images/icon-document.svg"); }

.scrollbar::-webkit-scrollbar-track {} 
.scrollbar::-webkit-scrollbar { width:4px; background: #D9D9D9 } 
.scrollbar::-webkit-scrollbar-thumb {  background-color:#808080   }
.scrollbar:hover::-webkit-scrollbar-thumb:hover { opacity:1} 

/* WEB PAGE */
.web-page { left:0; position:relative;}
.web-page.move-left { position:relative; left:-290px}
.web-page.move-right { position:relative; left:290px}
.web-page.move-right:before, .web-page.move-left:before {  content:''; position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(79, 81, 87, 0.63); z-index:10; -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;}

.breadcrumbs { padding:20px 0; border-bottom:1px dashed #D9D9D9; }
.breadcrumbs li { list-style-type:none; display:inline-block}
.breadcrumbs li:after {content:''; display:inline-block; margin:0 5px 0 10px; width: 10px; height: 14px; background: url("../images/icon-arrow-right-small.svg") no-repeat 50% 50%; background-size: 8px auto}
.breadcrumbs li:last-child:after { display:none}
.breadcrumbs li a:hover { color:#ee761c }

.content {}
.content a { color: #1e82b2}
.content p { padding-bottom:20px}
.content ul, .content ol { padding-left: 20px; padding-bottom:20px}
.content ol li { position:relative; padding:5px 0}
.content ul {list-style: none}
.content ul li { position:relative; padding:5px 0}
.content ul li::before {content: "•"; color:#ee761c ; margin-left:-12px; position:absolute}
.content h3 { color:#ee761c; font-size:22px; padding-bottom:10px}




/* WIDGET */
.widget { border: 1px solid #D9D9D9; border-radius: 8px; margin-bottom: 20px; -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; overflow: hidden; background:#fff}

.widget.expand { position: fixed !important; left: 20px; top: 20px; right: 20px; bottom: 20px; z-index: 10; box-shadow: 0 0 20px rgba(0,0,0,0.5) }

.widget.expand .widget-content { overflow-y: scroll; height: calc(100vh - 67px)}

.col .widget:last-child { margin: 0}

.widget .widget-header { background: #D9D9D990; color:#4F5157; font-weight: bold; font-size: 12px; height: 25px; line-height: 25px; padding: 0 30px 0 10px; position: relative}
.widget .widget-header .action { position: absolute; right: 0; top: 0; width: 23px; height: 100%;  }
.widget .widget-header .action a.trigger { display: block; position: relative; width: 100%; height: 100%}
.widget .widget-header .action a.trigger i { width: 3px; height: 3px; border-radius: 3px; background: #4F5157; position: absolute; left: 10px;}
.widget .widget-header .action a.trigger i:nth-child(1) { top:6px }
.widget .widget-header .action a.trigger i:nth-child(2) { top:11px }
.widget .widget-header .action a.trigger i:nth-child(3) { top:16px }

.widget .widget-header .action:hover .list { display: block;}

.widget .widget-header .action .list { display: none; position: absolute; z-index: 5; right: 0;top: 100%; background: #fff; border-radius:8px; box-shadow: 0 0px 8px rgba(0,0,0,0.3); padding: 5px 10px}
.widget .widget-header .action .list li { list-style-type: none}
.widget .widget-header .action .list li a { font-size: 12px; display: block; padding-left: 20px; margin: 2px 0; background-position: 0 50%; background-repeat: no-repeat;}

.widget .widget-header .action .list li a.expand { background-image: url("../images/icon-from.svg")}
.widget .widget-header .action .list li a.collapse { background-image: url("../images/icon-to.svg")}

.widget .widget-content { padding: 10px; position: relative; z-index: 1}

.widget.map { position: relative}
.widget.map .widget-header { width: 100%; left: 0; top: 0;  position: absolute; z-index: 2}
.widget.map .widget-content { padding: 0; height:360px}

.widget.map.expand .widget-content {height: calc(100vh - 41px); overflow: hidden;}

#map { height:calc(100% + 60px); width: 100%; margin-top: -30px;}
#map .ymaps-balloon { font-size: 14px; color: #000}
#map .ymaps-balloon a { font-size: 14px; color: #EE761C; font-weight: bold}
#map .ymaps-balloon a:hover { font-size: 14px; }


.map-caption { position: absolute; left: 0; width: 100%; padding: 10px; bottom: 0; background: #ffffff90; font-size: 12px; color: #000}

.map-caption .city-list  { float: left; width:calc(50% - 80px); height: 52px; overflow-y: scroll; border-left: 1px solid #4F5157; padding: 0 10px 0 20px; color: #858585}

.map-caption .city-legend { float: left; width:80px; background-size: 14px; padding-top: 26px; font-size: 18px; text-align: center}

.map-caption .city-legend.shipper { background: url("../images/icon-from.svg") no-repeat 50% 8px; }
.map-caption .city-legend.consignee { background: url("../images/icon-from.svg") no-repeat 50% 8px; }







/* CALC */
.simple-calc {  background:url("../images/icon-calculator.svg") no-repeat 95% 0;}
.simple-calc.border { border:1px solid #D9D9D9; border-radius:8px; padding:10px; background-position: 95% 10px}
.simple-calc .fast-city li { float:left; margin-right:5px; list-style-type:none; font-size:12px;}
.simple-calc .fast-city li a { font-size:12px; font-weight:bold}
.simple-calc .fast-city li:after {content:',';}
.simple-calc .fast-city li:last-child:after {content:'';}

.simple-calc .web-form .field { padding-bottom:5px; }

.simple-calc .swap { padding-bottom:5px;}
.simple-calc .swap a { background:#D9D9D9 url("../images/icon-swich.svg") no-repeat 50% 50%; width:22px; height:22px; border-radius:50%; display:block}

.simple-calc .notice { border-bottom: 1px solid #EE761C; border-top: 1px solid #EE761C; padding: 5px 0; margin: 10px 0; color: #FF0004; font-size: 12px; position: relative}
.simple-calc .notice:after { content: ''; background: url("../images/icon-calc-notice.svg") no-repeat 50% 50%; width:19px; height:20px; display: block; position: absolute; right:38px; bottom:-10px}

.simple-calc .fast-info { float:left; margin-right:10px}
.simple-calc .fast-info .info-item { float:left; font-weight:900; margin-right:5px}

.simple-calc .fast-info .info-item  .label { color:#EE761C; font-size:10px;}
.simple-calc .fast-info .info-item  .value { font-size:40px; color:#4F5157; line-height:1;}
.simple-calc .fast-info .info-item  .value span { color:#EE761C; font-size:25px; vertical-align:super; font-family:Manrope; font-weight:bolder}

.simple-calc .button { float:right; padding-top:10px}
.simple-calc .button .btn { display: block; margin-bottom: 5px}
.simple-calc .button .btn:last-child{ margin: 0}


/* INVOICE */
.invoice-wrapper { border:1px solid #D9D9D9; border-radius:8px; padding:15px; }
.invoice-wrapper .help { font-size:12px; float: left; width: calc(100% - 180px)}
.invoice-wrapper .sample { float: right; width: 170px; height:111px; position: relative}
.invoice-wrapper .sample img { width: 100%; display: block; position: absolute; transform: scale(1); }
.invoice-wrapper .sample img:hover { transform: scale(1.8);}
.invoice-detail .history ul li {
    color: #333; /* Или любой другой цвет */
}
.invoice-detail .history li {
    position: relative; /*  Это важно для позиционирования */
}

.invoice-detail .history li span:first-child { /*  Для названия события */
    float: left; /*  Прижимаем к левому краю */
}

.invoice-detail .history li span:nth-child(2) { /*  Для города */
    position: absolute; /*  Абсолютное позиционирование */
    right: 0; /*  Прижимаем к правому краю */
    top: 0;   /*  Выравниваем по верхнему краю с названием события */
}
.invoice-detail .history li label {
    display: inline-block;
    margin: 0;  /*  Убираем все отступы по умолчанию */
}

.invoice-detail .history li label:first-child {
    float: left;
}

.invoice-detail .history li label:nth-child(2) {
    float: right;
}
/* 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;}

.service-slider {}
.service-slider .service-item { background:#F5F5F5; border-radius:8px; padding:15px; background-position:98% 88%; background-repeat:no-repeat; background-size: auto 60px}
.service-slider .service-item .info { min-height: 120px }
.service-slider .service-item .name { font-size:18px; font-weight:700; padding-bottom:5px; line-height: 1.1}
.service-slider .service-item .resume {  font-size:12px; padding-bottom:20px; font-weight:700; }
.service-slider .service-item .button { padding-bottom:5px }

.service-list { }
.service-list .service-item { padding:20px; border:1px solid #fff; position:relative }
.service-list .service-item:hover {  border:1px solid #ee761c }
.service-list .service-item .thumb { float: left; width: 30%; border: 1px solid #D9D9D9}
.service-list .service-item .thumb img { width: 100%; display:block}
.service-list .service-item .info { float: left; width:70%; padding:0 0 0 20px; }
.service-list .service-item .info .name { padding-bottom: 10px}
.service-list .service-item .info .name a { font-size: 30px; color: #4b4b4b;}
.service-list .service-item .info .resume { padding-bottom: 10px; font-size:16px}


.service-detail { max-width: 880px; margin: auto}
.service-detail .info { padding: 20px 0}
.service-detail .thumb { padding:0 0 20px 0}
.service-detail .thumb img { width:100%; display:block}



/* POST DETAIL */
.post-slider {}
.post-slider .post-item { background:#fff; border-radius:8px; padding:10px; border:1px solid #D9D9D9}
.post-slider .post-item .published { font-size:10px; color:#808080;  padding-bottom:5px}
.post-slider .post-item .name, .post-slider .post-item .name a { font-size:12px; font-weight:700; padding-bottom:5px}

.post-list { }
.post-list .post-item { padding:20px; border:1px solid #fff; position:relative }
.post-list .post-item:hover {  border:1px solid #ee761c }
.post-list .post-item .thumb { float: left; width: 30%; border: 1px solid #D9D9D9}
.post-list .post-item .thumb img { width: 100%; display:block}
.post-list .post-item .info { float: left; width:70%; padding:0 0 0 20px; }
.post-list .post-item .info .name { padding-bottom: 10px}
.post-list .post-item .info .name a { font-size: 30px; color: #4b4b4b;}
.post-list .post-item .info .resume { padding-bottom: 10px; font-size:16px}
.post-list .post-item .info .date { color:#000; display:inline;  bottom: 20px;  background: #D9D9D9; border-radius: 5px;  font-size: 15px; padding: 5px 10px; position: absolute;}
.post-list .post-item .info .category { color:#000; display:inline;  bottom: 20px; right:20px;  background: #D9D9D9; border-radius: 5px; font-size: 15px; padding: 5px 10px; position: absolute; }

.post-detail { max-width: 880px; margin: auto}
.post-detail .info { padding: 20px 0}
.post-detail .info .date { float: right}
.post-detail .info .category { float: left}
.post-detail .thumb { padding:0 0 20px 0}
.post-detail .thumb img { width:100%; display:block}








.block { padding:20px 0 20px 0; }
.block-header { padding-bottom:20px; font-weight:700;}
.block-header .h2 { font-size:18px; font-weight:700; color:#4F5157 }
.block-header .more { float: right; font-size: 11px; font-weight:700; color: #4F5157; background: url("../images/icon-arrow-right-small.svg") no-repeat 100% 50%; margin-top:7px; padding-right: 10px}

/* CUSTOM DELIVERU CARD */
.delivery-card-wrapper { position:relative; margin-top:160px;}
.delivery-card-wrapper .courier { position:absolute; z-index:2; bottom:-40px; right:0}

.perspective-200 {  perspective:200px; }
.rotate-y { transform:rotateY(-10deg); }

.delivery-card { background:#4F5157; padding:20px; border-radius:20px; position:relative;  width:90%}
.delivery-card img { width:80%; right:0px; bottom:80px; position:absolute; z-index:1}
.delivery-card .direction { border-radius:15px; background:rgb(255,255,255); background:linear-gradient(90deg, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 100%); padding:15px; position:relative; z-index:2}
.delivery-card .direction .city { font-weight:bold; font-size:36px; padding-bottom:10px;}

.delivery-card .fast-info { border-radius:15px; background:#fff; margin-top:20px; padding:15px; position:relative; z-index:2}
.delivery-card .fast-info .info-item { float:left; font-weight:900; width:40%}
.delivery-card .fast-info .info-item:nth-child(2) { width:20%}
.delivery-card .fast-info .info-item .label { color:#EE761C; font-size:10px;}
.delivery-card .fast-info .info-item .value { font-size:40px; color:#4F5157; line-height:1;}
.delivery-card .fast-info .info-item .value span { color:#EE761C; font-size:25px; vertical-align:super;}

.delivery-card-info { background:rgba(79, 81, 87, 0.63); border-radius:8px; color:#fff; padding:20px; width:60%; font-size:12px; position:absolute; z-index:3; bottom:-40px; left:0}
/* END CUSTOM DELIVERU CARD */



/* WEB FORM */
.web-form {  }
.web-form p { padding:20px 0 40px 0; font-weight:400}
.web-form .field { padding-bottom:10px; position:relative}
.web-form .field .clear { position: absolute; right: 7px; top: 10px; display: block; width: 12px; height: 12px; cursor: pointer}
.web-form .field .clear:before, .web-form .field span.clear:after { position: absolute; content: ''; display:block; height:2px; background:#4F5157; width:15px; right:-1px; top: 5px;}
.web-form .field .clear:before { -webkit-transform:rotateZ(45deg); -moz-transform:rotateZ(45deg); -o-transform:rotateZ(45deg); transform:rotateZ(45deg); }
.web-form .field .clear:after { -webkit-transform:rotateZ(-45deg); -moz-transform:rotateZ(-45deg); -o-transform:rotateZ(-45deg); transform:rotateZ(-45deg); }
.web-form .field .empty + .clear { display: none}

.web-form .field input[type="text"], .web-form .field input[type="password"], .web-form .field input[type="email"], .web-form .field input[type="number"], .web-form .field input[type="date"]
{ background-color:#fff; background-position:7px 50%; background-repeat:no-repeat; border-radius:5px; padding:0 10px; height:30px; width:100%; font-family:'MEFont'; font-size:12px; font-weight:700; border:1px solid #EE761C; color:#EE761C}
.web-form .field select { background:none; border-radius:8px; padding:0 10px; height:28px; width:100%; font-family:'MEFont'; font-size:16px; font-weight:400; }
.web-form .field textarea { background:none; border-radius:8px; padding:10px; height:120px; width:100%; font-family:'MEFont'; font-size:18px; font-weight:400; }
.web-form .button { padding-top:20px}
.web-form .button button { background-color:#D9D9D9; background-repeat:no-repeat; border-radius:5px; padding:0 10px; height:30px; width:100%; font-family:'MEFont'; font-size:12px; font-weight:700; border:1px solid #D9D9D9; color:#000; text-transform:uppercase; cursor:pointer}

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

#form-invoice-result .field { float:left; width:calc(100% - 60px)}
#form-invoice-result .button { float:right; padding:0; margin:0; width:50px}
#form-invoice-result .button  button { background-image:url("../images/icon-search.svg"); background-position:50% 50%}

#calc-city-from { background-image:url("../images/icon-from.svg"); padding-left:24px}
#calc-city-to { background-image:url("../images/icon-to.svg"); padding-left:24px}



/* POP */
.pop-overlay { display:none; position:fixed; left:0; right:0; top:0; bottom:0; z-index: 100;}
.pop-overlay.scroll { overflow-y:scroll}
.pop-overlay .overlay { position:fixed; left:0; right:0; top:0; bottom:0; background:rgba(79, 81, 87, 0.63); z-index: 1;}
.pop-overlay .pop-wrapper { 
	position:relative; z-index: 10; max-width:760px; width:100%; 
	left: 50%;
    top: 50%;
	max-height: calc(100% - 80px);
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
.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); }

.pop-overlay .pop-wrapper .pop-block { border:1px solid #D9D9D9; border-radius:8px; background:#fff }
.pop-overlay .pop-wrapper .pop-header { text-align: center; padding: 20px; }
.pop-overlay .pop-wrapper .pop-header h2 { }

.pop-overlay .pop-wrapper .pop-content { padding:10px 20px 20px 20px; }
.pop-overlay .pop-wrapper .pop-content .web-form .button { text-align: center } 

.pop-overlay .pop-wrapper .pop-content .drop { margin: 20px 0; position: relative; text-align: center}
.pop-overlay .pop-wrapper .pop-content .drop span { position: relative; z-index: 2; background: #fff; padding: 0 10px;}
.pop-overlay .pop-wrapper .pop-content .drop:before { content: ''; height: 1px; width: 100%; background:#D9D9D9; position: absolute; z-index: 1; left: 0; top:50%}


/* TAB */

.tab-control ul li a { display:block;}


.tab-item { display: none}
.tab-item.active { display: block}


.tab-auth {}
.tab-auth .tab-control { border-bottom: 1px solid #D9D9D9; margin-bottom: 20px}
.tab-auth .tab-control li { display:block; float: left; width: 50%}
.tab-auth .tab-control li a { display: block; padding: 5px; text-align: center}
.tab-auth .tab-control li a.active { background: #EE761C; color: #fff;}

/* INVOICE */
.invoice-detail {}
.invoice-detail .field { padding:2px 0;}
.invoice-detail .field span { color:#000;}

.invoice-detail strong { color:#000; display: block; padding: 10px 0}

.invoice-detail .history li { list-style-type: none; padding:2px 0}
.invoice-detail .history span { color:#000;}

.mobile { display:none}
.desktop { display:block}

.preloader { background:rgba(79, 81, 87, 0.63); background-image:url(../images/preloader.svg); background-position:50% 50%; background-repeat:no-repeat; position:fixed; left:0;top:0; right:0; bottom:0; z-index:10}

.no-scroll { overflow:hidden}


.footer {}





@media (max-width:1200px) {
	.wrapper { width:100%; padding:0 10px}
	
	.header .user { margin-top: -80px; }
	
}

/* Portrait tablet to landscape and desktop */
@media (min-width:768px) and (max-width:979px) { 
	.wrapper { width:100%; padding:0 10px}
	
	.col .widget:last-child { margin-bottom: 20px}
	
}

/* Landscape phone to portrait tablet */
@media (max-width:767px) {
	.wrapper { width:100%; padding:0 10px}
	
	.header { padding: 0;}
	.header .left-part, .header .right-part, .header .button { display: none}
	.header .logo { padding: 10px 0;}
	.header .toggle-nav { display:block}
	
	.row { display:block; flex-direction:none; margin:0; }
	.row .col { margin:0; padding: 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%; }

	.delivery-card-wrapper .courier { display: none}
	.delivery-card-info { width: 100%; bottom: 10px;}
	
	.col .widget:last-child { margin-bottom: 20px}
	
	
}

/* Landscape phones and down */
@media (max-width:480px) { 
	.wrapper { width:100%; padding:0 10px}
	
}