/* 

© 2019 by Andrew Vakarchuk

*/

/*  Основное */
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&subset=cyrillic-ext');

* {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	font-family: 'Roboto', sans-serif;
	font-size: 16px;
	line-height: 1.3;
}
body.modal-open {overflow: hidden;}
img {border: 0;}
a {text-decoration: none;}
ul {list-style-type: none}

.title {
	font-size: 34px;
	font-weight: 500;
	color: #2a2a2a;
	text-align: center
}
.subtitle {
	font-size: 17px;
	font-weight: 300;
	color: #2a2a2a;
	margin-top: 10px;
	text-align: center
}
.wraper {
	width: 100%;
	max-width: 1170px;
	padding: 0 15px;
	margin-left: auto;
	margin-right: auto;
}
.logo {
	float:left;
	width: 289px;
	height: 47px;
}
.btn {
	min-width: 210px;
	height: 40px;
	color: #fff;
	text-shadow: 1px 1px 1px #a50002;
	font-family: 'Roboto', sans-serif;
	font-size: 17px;
	font-weight: 500;
	text-align: center;
	border-radius: 4px;
	border:none;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#f62b2b), to(#d20202));
	background-image: -webkit-linear-gradient(top, #f62b2b, #d20202);
	background-image: -moz-linear-gradient(top, #f62b2b, #d20202);
	background-image: -ms-linear-gradient(top, #f62b2b, #d20202);
	background-image: -o-linear-gradient(top, #f62b2b, #d20202);
	background-image: linear-gradient(to bottom, #f62b2b, #d20202);
}
.ord {
	display: block;
	margin: 25px auto 0;
}
.callback, .ord {
	position: relative;
	padding-left: 50px;
	padding-right: 20px;
}
.callback::before, .ord::before  {
	content: '';
	position: absolute;
	width: 20px;
	height: 20px;
	margin: 0 0 0 -30px;
	background: url(../img/icons.png) -200px -79px;
}
.callback::before {
	content: '';
	position: absolute;
	width: 20px;
	height: 20px;
	margin: 0 0 0 -30px;
	background: url(../img/icons.png) -200px -50px;
}
.btn:hover {opacity: 0.9;}
/*  /Основное */

/*  Чердак */
#header {padding: 20px 0 10px;}
#header .wraper {overflow: auto;}
#header .half.smaller {width: 43%}
#header .half {
	float: left;
	width: 57%;
}
#header .logo {
	background: url(../img/logo.svg) no-repeat;
	margin-right: 30px;
}
#header h1 {
	font-size: 13px;
	font-weight: 300;
	color: #727272;
	padding-top: 5px;
}
#header .btn {float:right;}
#header .tel {
	float: left;
	margin: 0 0 0 35px;
	text-align: center;
	color: #e80003;
	font-size: 22px;
	font-weight: 700;
}
#header .tel strong {color: #3c3c3b;}
#header .tel span {
	position: relative;
	top: -10px;
	font-size: 11px;
	font-weight: 300;
	color: #3c3c3b;
}

.header-email {
	float: left;
	font-size: 14px;
	line-height: 22px;
	margin: 0 0 0 30px;
	padding: 10px 0 0 0;
}

.header-email a {
	color: #000;
	text-decoration: none !important;
}

.header-email a:hover {
	color: #e80003;
}

#menu {
	padding: 20px 0;
	box-shadow: inset 0px 3px 8px rgba(0,0,0,.2);
}
#menu ul {
	width: 100%;
	text-align: center;
}
#menu ul li {display: inline;}
#menu ul li a {
	color: #3c3c3b;
	font-size: 17px;
	font-weight: 700;
	padding: 0 15px;
	padding: 0 15px;
}
#menu ul li a:hover {
	color: #e80003;
	text-decoration: none;
}


/* Слайдер */
#slider {
	position: relative;
}
#slider .slide {
	min-height: 420px;
	box-shadow: inset 0px 10px 25px rgba(0,0,0,.3), inset 0px -10px 25px rgba(0,0,0,.3);

}
.slick-dots {
	position: absolute;
	bottom: 25px;
	width: 100%;
	text-align: center;
}
.slick-dots li {
	display: inline-block;
	margin: 0 6px;
}
.slick-dots li button {
	width: 16px;
	height: 16px;
	background: transparent;
	border: 4px solid #fff;
	border-radius: 50%;
	text-indent: -999999px;
}
.slick-dots li.slick-active button {border-color: #e80003}
.slick-dots li button:hover {opacity:0.8}
.slide p{
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	padding-top: 115px;
}
.slide p span {
    padding: 5px 20px;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    border-radius: 30px;
    background: #ff0000;
	text-transform: uppercase;
}
.discount p span {background: #ff0000;}
.slide p strong {
	display: block;
	font-size: 35px;
	margin: 10px 0 5px;
}
.slide p strong::after {
    content: '*';
    margin: -10px 0 0 0px;
    position: absolute;
    font-size: 38px;
    font-weight: bold;
    opacity: .5;
}
.slide p em {
	font-style: normal;
	font-size: 18px;
    opacity: .7;
}
.slide button {margin: 40px 0;}


/* Услуги */
#services {margin-top: 50px;}
#services ul {
	overflow: auto;
	margin: 30px -15px 0 -15px;
}
#services ul li {
	float: left;
	width: 33.3333%;
	position: relative;
	padding: 0 15px;
	margin: 20px 0;
}
#services ul li p {
	position: relative;
	padding-left: 60px;
	color: #7c7c7c;
	font-size: 13px;
	font-weight: 300;
}
#services ul li p strong {
	display: block;
	margin-bottom: 5px;
	font-size: 16px;
	color: #383838;
}
#services ul li p:before {
	content: '';
	position: absolute;
	left: 0; top:5px;
	background-image: url(../img/icons.png);
}
#services ul li.ico-1 p:before {
	width: 48px;
	height: 48px;
}
#services ul li.ico-2 p:before {
	width: 44px;
	height: 48px;
	background-position: -50px 0;
}
#services ul li.ico-3 p:before {
	width: 48px;
	height: 48px;
	background-position: -100px 0;
}
#services ul li.ico-4 p:before {
	width: 46px;
	height: 48px;
	background-position: -150px 0;
}
#services ul li.ico-5 p:before {
	width: 44px;
	height: 48px;
	background-position: -200px 0;
}
#services ul li.ico-6 p:before {
	width: 47px;
	height: 48px;
	background-position: -250px 0;
}
#services ul li.ico-7 p:before {
	width: 47px;
	height: 48px;
	background-position: -300px -50px;
}
#services ul li.ico-8 p:before {
	width: 47px;
	height: 48px;
	background-position: -350px -50px;
}
#services ul li.ico-9 p:before {
	width: 48px;
	height: 48px;
	background-position: -400px -50px;
}

/* Преимущества */
#why {
	margin-top: 50px;
	padding: 50px 0;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	background: #f8f8f8;
}
#why ul {
	overflow: auto;
	margin: 50px -15px 0 -15px;
}
#why ul li {
	float: left;
	width: 25%;
	position: relative;
	padding: 50px 15px 0 15px;
	font-size: 17px;
	text-align: center;
}
#why ul li::before {
	content: '';
	width: 36px;
	height: 36px;
	background: url(../img/icons.png) -150px -50px;
	position: absolute;
	top: 0;left: 50%;
	margin: 0 0 0 -18px;
}


/* Отзывы */
#responses{
	margin-top: 50px;
}
#responses ul {
	overflow: auto;
	margin: 25px 0 0;
}
#responses ul li {
	float: left;
	width: 33.33333%;
	padding: 5px 25px;
}
#responses ul li p {
	position: relative;
	z-index: 2;
	min-height: 180px;
	font-size: 13px;
	font-weight: 300;
	color: #3c3c3b;
	padding: 25px;
	margin-bottom: 15px;
	border-radius: 10px;
	box-shadow: 0px 2px 8px 2px rgba(0, 0, 0, 0.08)
}
#responses ul li p::before {
	content: '';
	width: 37px;
	height: 15px;
	position: absolute;
	left: 5px;
	bottom: -15px;
	background: url(../img/icons.png) 0 -100px;
}
#responses ul li strong {
	padding: 0 10px 0 25px;
	font-size: 13px;
	font-weight: 300;
}
#responses ul li strong span {color: #e80003}


/* BOOKS */
#books {
	padding: 50px 0;
}
#books ul {
	overflow: auto;
	margin: 50px -15px 0 -15px;;
}
#books ul li {
	float:left;
	width: 25%;
	text-align: center;
}
#books ul li a {
	display: block;
	position: relative;
}
#books ul li a img {max-width: 100%;}
#books ul li a span {
	position: absolute;
	top:50%;left:50%;
	width: 100px;
	height: 100px;
	margin: -50px 0 0 -50px;
	opacity: 0;
	background: url(../img/icons.png) -50px -100px;
}
#books ul li a:hover span {opacity: .7;}


/* Стоимость */
#cost {
	overflow: hidden;
	position: relative;
	background: #fff;
	padding-top: 69px;
}
#cost::before {
	content: '';
	width: 100%;
	height: 500px;
	position: absolute;
	z-index: 1;
	left:0; top: 69px;
	background: url(../img/bgrnd.jpg) no-repeat;
}

#cost .row {
	position: relative;
	z-index: 2;
	margin: 0 -15px;
}
#cost .row .side-l,
#cost .row .side-r {
	float:left;
	width: 50%;
	padding: 0 15px 100% 15px;
    margin-bottom: -100%;
}
#cost form {padding: 0 75px;}
.side-l strong {
	position: relative;
	display: block;
	margin: 100px 0 5px;
	font-size: 75px;
	font-weight: 700;
	line-height: 1;
	color: #fff;
}

.side-l p {
	position: relative;
	font-size: 22px;
	font-weight: 700;
	padding: 70px 0 100px;
	color: #fff;
}
.side-l p::before {
	content: '';
	position: absolute;
	top: 12px;;left: 0;
	width: 114px;
	height: 41px;
	background: url(/img/arr.png) no-repeat;
}
#cost .row .side-r {
	position: relative;
	background: #f8f8f8;
}
.side-r::before, .side-r::after {
	content: '';
	position: absolute;
	z-index: 3;
	top: -69px; left:0;
	width: 100%;
	height: 69px;
	background: #f8f8f8;
}
.side-r::after {
	width: 69px;
	left: auto;right:0;
	background: url(../img/icons.png) -150px -100px;
}
.steps {
	text-align: center;
	margin: 25px 0;
}
.steps li {display: inline;}
.steps li button {
	width: 40px;
	height: 40px;
	color: #fff;
	font-size: 20px;
	font-weight: 700;
	color: #fff;
	background: #b9b9b9;
	border:none;
	border-radius: 50%;
	margin: 0 12px;
}
.steps li button.act,
.steps li button:hover {background: #f90002}
.nxt, .prv {
	position: absolute;
	bottom:35px;
	background: none;
	border: none;
	color: #dfdfdf;
	font-size: 26px;
	font-weight: 700;
}
.prv {left: 0;padding-left: 25px;}
.nxt {right: 0;padding-right: 25px;color: #f91214;}
.nxt:hover, .prv:hover {opacity: .7;}
.prv::before, .prv::after,
.nxt::before, .nxt::after{
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 12px;
	height: 3px;
	border-radius: 5px;
	background: #dfdfdf;
}
.nxt::before, .nxt::after {
	left: auto;
	right: 0;
	background: #f91214;
}
.prv::before {margin-top: 12px;}
.prv::after  {margin-top: 19px;}
.nxt::before {margin-top: 19px;}
.nxt::after  {margin-top: 12px;}
.prv::before, .nxt::before {
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}
.prv::after, .nxt::after{
    -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}
.step {
	position: relative;
	display: none;
	overflow: hidden;
	min-height: 395px;
}
.current {display: block;}
.formtitle {
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    color: #f91214;
}
.hhh, .nnn {display: none;}
.chooser {
	list-style: none;
	overflow: auto;
	margin: 0 -10px;
}
.chooser li {
	float:left;
	width: 50%;
	padding: 0 10px;
	margin: 10px 0;
	text-align: center;
}
.paper li, .size li, .sss li {width: 33.33333%}

.chooser li button {
	position: relative;
	padding-top: 65px;
	text-align: center;
	border: none;
	background: none;
	font-size: 16px;
	font-weight: bold;
}
.chooser li button::before {
	content: '';
	position: absolute;
	top: 0;left: 50%;
	width: 50px;
	height: 50px;
	margin-left: -25px;
	background: #fff;
	border: 3px solid #ccc;
	border-radius: 10px;
}
.chooser li button::after {
	content: '';
	position: absolute;
	top:0;left:50%;
	margin: 3px 0 0 -22px;
	display: block;
	width: 50px;
	height: 50px;
	border-radius: 6px;
}
.chooser li button.soft::after {background: url(../img/icons.png) -50px -200px;}
.chooser li button.hard::after {background: url(../img/icons.png) -50px -250px;}
.chooser li button.noncolored::after {background: url(../img/icons.png) -100px -200px;}
.chooser li button.colored::after {background: url(../img/icons.png) -100px -250px;}
.chooser li button.a4::after {background: url(../img/icons.png) 0 -150px;}
.chooser li button.a5::after {background: url(../img/icons.png) 0 -200px;}
.chooser li button.a6::after {background: url(../img/icons.png) 0 -200px;}
.chooser li button.let::after {background: url(../img/icons.png) -150px -200px;}
.chooser li button.dig::after {background: url(../img/icons.png) -150px -250px;}
.chooser li button.squ::after {background: url(../img/icons.png) -200px -200px;}
.chooser li button.soft-1::after {background: url(../img/icons.png) -200px -250px;}
.chooser li button.soft-2::after {background: url(../img/icons.png) -250px -250px;}
.chooser li button.soft-3::after {background: url(../img/icons.png) -250px -200px;}
.chooser li button.hard-1::after {background: url(../img/icons.png) -250px -150px;}
.chooser li button.hard-2::after {background: url(../img/icons.png) -250px -100px;}

.chooser li button span {
	display: block;
	margin-top: 3px;
	font-size: 14px;
	font-weight: 400;
	color: #999;
}
.chooser li button:hover {opacity: .7}
.chooser li button.act {color: #f91214}
.chooser li button.act::before {border-color: #f91214;}
#step5 {position: relative;}
.success {
	display: none;
	position: absolute;
	width: 100%;
	left:0;
	bottom: 0;
	clear: both;
	padding: 25px;
	border-radius: 10px 10px 0 0;
	background: rgba(0,0,0,.8);
	color: #2fff5c;
	text-align: center;
}
#services-form .success,
#callback-form .success{border-radius:0;bottom: 40px;}

/* Схема */
#scheme {
	clear: both;
	padding: 50px 0;
	border-bottom: 1px solid #f2f2f2;
}
#scheme .title {margin-bottom: 25px;}
#scheme .title span {
	display: block;
	color: #f92c2e;
}
#scheme ul {
	overflow: auto;
	margin: 0 -15px;
}
#scheme ul li {
	float: left;
	width: 25%;
	padding: 0 15px;
	margin: 20px 0;
}
#scheme ul li p {
	position: relative;
	min-height: 115px;
	padding: 25px;
	font-size: 17px;
	border: 2px solid #acacac;
}
#scheme ul li p span {
	position: absolute;
	top: -20px; left: 15px;
	color: #f92c2e;
	background: #fff;
	padding: 0 10px;
	font-size: 28px;
	font-weight: 700;
}


/* Форма и карта */
#map {
	position: relative;
	width: 100%;
	height: 650px;
	margin-top: 200px;
	z-index: 1;
}
#map .wraper {
	position: relative;
	z-index: 2;
}
#block {
	position: absolute;
	z-index: 9;
	top: -150px; left:3%;
	width: 94%;
	background: #fff;
	box-shadow: 0 0 25px rgba(0, 0, 0, .2) inset;
	border-radius: 10px;
}
#block .title {margin-top: 50px;}
#block .subtitle {margin-bottom: 10px;}
#block .subtitle strong {display: block;}
#block form {padding: 0 150px;}
#block form .row {overflow: auto;margin: 0 -15px;}
.twin {float:left;width: 50%;padding: 0 15px;}
.twin .send {width: 100%}
.gift {
	position: relative;
	padding-left: 50px;
	margin: 40px 0;
	color: red;
	font-size: 15px;
	font-weight: 600;
}
.gift strong {
	display: block;
	color: #222;
	font-size: 14px;
	font-weight: 400;
	margin-bottom: -3px;
}
.uno::before, .duo::before {
	content: '';
	position: absolute;
	left:0;top:-2px;
	width: 35px;
	height: 35px;
	background-size: 100%;
}
.uno::before {background-image: url(../img/gift.svg);}
.duo::before {background-image: url(../img/bonus.svg);}
.duo {display: none;}
#block form .box {position: relative;}
.box span {
	display: block;
	font-size: 17px;
	font-weight: 700;
	margin: 10px 0 5px 0;
}
.box input {
	position: relative;
	z-index: 5;
	width: 100%;
	height: 50px;
	padding: 0 15px;
	border-radius: 10px;
	border: 3px solid #b9b9b9;
	font-size: 20px;
	font-weight: 700;
	color: #333;
	background: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.box input.sel {padding-right: 45px;}
#block form .box ul {
	display: none;
	position: absolute;
	z-index: 6;
	width: 100%;
	background: #fff;
	padding: 0px 0 7px;
	margin-top: -8px;
	border-radius: 0 0 10px 10px;
	border: 3px solid #b9b9b9;
	border-top: 0;
}
#block form .box ul li {
	font-size: 20px;
	font-weight: 700;
	padding: 5px 15px;
}
#block form .box ul li:hover {
	background: #eee;
	cursor: pointer;
}
#block form .box ul li.act {color:red;}
.arr {position: relative;}
.arr::after {
	content: '';
	width: 25px;
	height: 15px;
	position: absolute;
	z-index: 3;
	right:15px; bottom:-41px;
	background: url(../img/icons.png) -250px -50px;
}
.sel:hover {cursor: pointer}
.send {
	display: block;
	width: 285px;
	height: 50px;
	border: 0;
	border-radius: 10px;
	margin: 35px auto 50px auto;
	font-size: 26px;
	font-weight: 700;
	text-shadow: 0px 1px 1px #a50002;
}

#footer {
	overflow: auto;
	background: #3c3c3b;
	padding: 25px 0;
}
#footer .logo {
	background: url(../img/logo-white.svg) no-repeat;
}
#footer .half {
	float: left;
	width: 33.333333%;
}
#footer .half .btn {
	display: block;
	margin: 3px auto 0;
}
.copyrights {
	float: right;
	color: #b0b0b0;
	font: 11px Tahoma;
	margin-top: 7px;
	text-align: right;
}
.copyrights a {
	color: #fff;
}


/* other */
button, #menu a, #books ul li a span {
	-webkit-transition: all ease 0.5s;
	-moz-transition: all ease 0.5s;
	-o-transition: all ease 0.5s;
	transition: all ease 0.5s;
}
button:focus, input:focus {outline:none}
button:hover {cursor: pointer;}
.protect {color: #888;font-size: 14px;text-align: center;margin-top: 5px;}
	
/* MODAL */
.window {
  overflow: auto;
  display: none;
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
}
.window .block,
.window .thanks {
  display: none;
  position: relative;
  margin: 5% auto;
  width: 100%;
  max-width: 550px;
  padding: 50px 80px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 0 25px rgba(0, 0, 0, .2) inset;
}
.window .block .box {margin: 20px 0;}
.window .block  p.title,
.window .thanks p.title {font-size: 27px;}
.window .block  p.subtitle,
.window .thanks p.subtitle {margin-bottom: 10px;}
.window .block button.send {margin-bottom: 0px;}
.window button.close {
	position: absolute;
	top:10px;right:10px;
	width: 40px;
    height: 40px;
    border: none;
	background: none;
    border-radius: 50%;
	text-indent: -999999px;
}
.window button.close::before,
.window button.close::after {
	content: '';
	position: absolute;
	display: block;
	width: 20px;
    height: 3px;
    border-radius: 10px;
	background: #f91214;
}
.window button.close::before {
	 -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
	margin: 6px 0 0 12px;
}
.window button.close::after {
	 -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
	margin: -9px 0 0 12px;
}
.window button.close:hover {opacity: .8}


/* ADAPTIVE */
@media screen and (max-width: 1140px) {
	#header .logo {margin-right: 0;}
	#header h1 {display: none;}
	#header .half.smaller {width: 35%}
	#header .half {width: 65%;}
	#menu ul li a {font-size: 16px;padding: 0 10px;}
	#scheme ul li p {min-height: 135px;font-size: 16px;}
	#responses ul li {width: 50%;margin: 15px 0;}
}


@media screen and (max-width: 960px) {
	#header .half, #header .half.smaller {
		overflow: auto;
		float:none;
		width: 100%;
		text-align: center;
	}
	#header .logo {float:none;display: block;margin: 0 auto;}
	#header .tel {padding-top: 15px;margin: 0 10px;}
	.header-email {
		padding-top: 21px;
	}
	#header .btn {
		margin-top: 12px;
	}
	#menu ul li a {font-size: 15px;}
	.title {font-size: 30px;}
	#services ul li {width: 50%;min-height: 90px;}
	
	#cost .row .side-l, #cost .row .side-r {float:none;width:100%}
	.side-l strong, .side-l p {text-align: center;}
	.side-l p {padding: 10px 0 85px;}
	.side-l p::before {
		width: 69px;
		left:50%;
		top: 125px;
		margin-left:-39px;
		-webkit-transform: rotate(90deg);
  		-moz-transform: rotate(90deg);
  		-ms-transform: rotate(90deg);
  		-o-transform: rotate(90deg);
  		transform: rotate(90deg);}
	#cost form {padding-bottom: 100px;}
	#block form {padding: 0 100px;}
}

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

	#header .tel {margin: 0 15px}
	.title {font-size: 25px;}
	.subtitle {font-size: 15px;}
	#services ul li {width: 100%;min-height: auto}
	#why ul li {width: 50%;margin: 10px 0;}
	#books ul li {width: 50%;margin: 10px 0;}
	#scheme ul li {width: 33.33333%}
}

@media screen and (max-width: 660px) {
	#scheme ul li {width: 50%;}
	#scheme ul li p {min-height: 100px;font-size: 15px;}
	#responses ul li {width: 100%;padding: 0 5px;}
	#block form {padding: 0 75px;}
	.twin, .send {float: none;width: 100%;}
	.slide p strong {font-size: 25px}
	.slide p {text-align: center;}
	.slide .send {width: 285px;margin: 40px auto;}
	.side-l strong {font-size: 60px;}
	.side-l p {font-size: 20px;}
	.side-r::before, .side-r::after {display: none;}
	.steps {padding-top: 30px;}
	.steps li button {margin: 0 10px;}
	.gift {margin: 35px 0 0;}

	#header .half {
		float: none;
		width: auto;
	}

	#header .half:last-child {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		float: none;
		width: auto;
		clear: both;
	}

	#header .tel {
		order: 1;
		padding: 0 0 0 0;
		margin: 11px 30px 0 0;
	}

	.header-email {
		margin: 0;
		padding: 0 10px;
		flex-basis: 100%;
		flex-grow: 0;
		flex-shrink: 0;
		order: 3;
	}

	#header .btn {
		align-self: flex-start;
		border: none;
		order: 2;
	}






}

@media screen and (max-width: 480px) {
	#header .btn {top:0;margin: 10px 0 10px;}
	#why ul li, #books ul li {width: 100%;}
	#scheme ul li {width: 100%;}
	#cost form {padding: 0 15px 100px 15px;}
	.steps li button {width: 35px; height: 35px;margin: 0 8px;    font-size: 18px;}
	.nxt, .prv {font-size: 22px;line-height: 31px;}
	#block form {padding: 0 35px;}
	#block .title {padding: 0 40px;margin-bottom: 20px;}
	#block .subtitle {display: none;}
	.box span {font-size: 15px;margin-top: 15px;}
	.send {font-size: 24px;}
	.slide p strong {font-size: 23px}
	.side-l strong {font-size: 50px;margin-top: 125px;}
	#footer .half {float:none;width:100%;}
	#footer .logo {display: block;float: none;margin: 0 auto;}
	#footer .half .btn {margin: 15px auto;}
	.copyrights {float:none;text-align: center;}
	.window .block, .window .thanks {width: 90%;padding: 50px 25px}

	#header .tel {
		margin: 10px 0 0 0;
	}

	#header .btn {
		margin: 0 0 11px 0;
	}

}

/* Реализация */

#selling {
	margin: 0 0 0 0;
	padding: 80px 0 40px 0;
	border-bottom: 1px solid #f2f2f2;
	background: #f8f8f8;
}

.selling-wrapper {
	display: flex;
	justify-content: space-between;
	margin: 30px -15px 0 -15px;
}

.selling-col {
	padding: 0 15px;
	flex-basis: 33.333%;
}

.selling-col-2 {
	padding: 0 15px;
	flex-basis: 66.666%;
}

.selling-item {
	display: flex;
	color: #7c7c7c;
	font-size: 13px;
	font-weight: 300;
	margin: 0 0 30px 0;
}

.selling-item-ico {
	flex-basis: 60px;
	flex-grow: 0;
	flex-shrink: 0;
	position: relative;
}

.selling-item-ico:before {
	content: '';
	position: absolute;
	left: 0;
	top: 5px;
	background-image: url(../img/icons.png);
}

.selling-item-ico-5:before {
	width: 44px;
	height: 48px;
	background-position: -200px 0;
}

.selling-item-ico-1:before {
	width: 48px;
	height: 48px;
	background-position: 0 0;
}

.selling-item-ico-8:before {
	width: 47px;
	height: 48px;
	background-position: -350px -50px;
}

.selling-item .ttl {
	margin-bottom: 5px;
	font-size: 16px;
	color: #383838;
	font-weight: bold;
}

ul.list-alt {
	list-style: none;
	margin: 0;
	padding: 0;
}

ul.list-alt > li {
	margin: 0 0 5px 0;
	padding: 0 0 0 15px;
	position: relative;
}

ul.list-alt > li:before {
	content: "";
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #7c7c7c;
	position: absolute;
	left: 0;
	top: 5px;
}

ul.list-col-2 {
	column-count: 2;
	column-gap: 30px;
}

@media (max-width: 767px) {

	#selling {
		margin: 0 0 0 0;
		padding: 50px 0 30px 0;
	}

	.selling-wrapper {
		flex-wrap: wrap;
	}

	.selling-col,
	.selling-col-2 {
		flex-basis: 100%;
	}

	ul.list-col-2 {
		column-count: 1;
		column-gap: 0;
	}

}

/* /Реализация */