html, body { height: 100%;  margin: 0;  padding: 0;  font-size: 10px;}
body { background: #ffffff;  font-family: 'Roboto', sans-serif;  color: #000000;  min-width: 1200px;}
h1 {	font-size: 3.6rem; font-weight: 300; margin: 0;}
p {	font-size: 1.8rem;}
b {	font-weight: 500;}
a {	transition: .15s ease-in-out;}
section, nav, menu {	display: block;}
input, select, textarea {   margin: 0;    padding: 0;    font-size: 1.8rem;    outline: none;    font-family: inherit;     box-sizing: border-box;}

/* --- grid --- */

.row { width: 94%;  max-width: 1200px;  margin: 0 auto;  box-sizing: border-box;}
.row:before, .row:after { content: "";  display: table;}
.row:after { clear: both;}

.row .row { width: auto;  max-width: none;  margin-left: -20px;  margin-right: -20px;}
[class*="col-"], .bgrid { float: left;}
[class*="col-"] + [class*="col-"].end { float: right;}
[class*="col-"]:first-child { padding-left: 0;}
[class*="col-"]:last-child { padding-right: 0;}
[class*="col-"].end { float: right;}
[class*="col-"] { padding-right: 20px;  box-sizing: border-box;}

.col-one { width: 8.33333%;}
.col-two, .col-1-6 { width: 16.66667%;}
.col-three, .col-1-4 { width: 25%;}
.col-four, .col-1-3 { width: 33.33333%;}
.col-five { width: 41.66667%;}
.col-six, .col-1-2 { width: 50%;}
.col-seven { width: 58.33333%;}
.col-eight, .col-2-3 { width: 66.66667%;}
.col-nine, .col-3-4 { width: 75%;}
.col-ten, .col-5-6 { width: 83.33333%;}
.col-eleven { width: 91.66667%;}
.col-twelve, .col-full { width: 100%;}

/* --- header --- */

header { width: 100%; min-width: 1200px;  height: auto;  position: absolute;  left: 0;  top: 0;  z-index: 700;}
header .row { height: auto;  max-width: 1200px;  min-width: 1200px;  position: relative;}
header .menu {	height: 7.4rem; background-color: #000000; line-height: 7.4rem;}
.left-menu {	font-size: 1.8rem; color: #ffffff; font-weight: 500;}
header .menu ul {	height: 4.3rem; margin: 0; padding: 0;}
header .menu ul li {	display: inline; height: 4.3rem; border-right: 1px solid #ff383f; padding: 12px 20px;}
header .menu ul li:first-child {	padding-left: 0;}
header .menu ul li:last-child {	padding-right: 0; border-right: none;}

header .menu a{	color: #fff; text-decoration: none;}
header .menu a.selected {	color: #ff383f; text-decoration: none;}
header .menu a:hover {	color: #ff383f; text-decoration: none;}
header .menu .phone {	text-align: right; font-size: 2.5rem; color: #fff; position: relative;}
.phone-icon {	background-image: url(tel_icon.png);     width: 31px;     height: 31px;     display: inline-block;    vertical-align: middle;    margin-right: 22px;}

/* --- slider --- */
.slider {	width: 100%; height: 686px; position: relative;}
.slider .slider-logo {	position: absolute; width: 100%; top: 60px; height: 200px; background: linear-gradient(0deg, transparent, #fff); z-index: 99;}
.slider .slider-logo .row{	height: auto; max-width: 1200px; position: relative;}
.slider .slider-logo img{	height: 127px; width: 398px; padding-top: 26px;}
.slider-desc {	width: 700px; height: auto; min-height: 100px; background-color: rgba(255, 255, 255, 0.8); position: absolute; bottom: 60px; padding: 20px; box-sizing: border-box;}
.slider-desc h1{	margin-top: 0; margin-bottom: 10px;}
.slider-desc p{	margin: 0; font-weight: 300;}
.red-btn {	display: block; color: #fff; text-decoration: none; font-size: 1.8rem; width: 377px; height: 60px; background-color: #ff383f; line-height: 6rem; padding-left: 38px; box-sizing: border-box; margin-top: 15px;}
.red-btn:hover {	color: #ff383f; background-color: #fff; border: 1px solid #ff383f;}

/* --- precess --- */
.process {	background-color: #fcee21; text-align: center; padding-top: 45px; padding-bottom: 45px; box-sizing: border-box;}
.process .bg {	background-image: url(bg_proc.svg); background-position: center 35%; background-repeat: no-repeat; background-size: 65%;}
.process h1{	margin-bottom: 40px;}
.process .pic {	height: 110px; display: flex; align-items: center; justify-content: center;}
.process p {	width: 65%; margin: 0 auto; font-weight: 300;}

/* --- Catalog --- */

.catalog {	background-color: #ff383f; text-align: center; padding-top: 45px; padding-bottom: 45px; box-sizing: border-box; height: 500px;}
.catalog h1 {	color: #ffffff; margin-bottom: 40px;}
.catalog .cards {	display: flex; justify-content: space-between;}
.catalog .card {	height: auto; width: 286px; background-color: #fff; opacity: .5; transition: .5s ease-in-out;}
.catalog .card img{	display: block;}
.yel-btn-с {	display: none; color: #000; text-decoration: none; font-size: 1.8rem; width: 100%; height: 60px; background-color: #fcee21; padding-left: 38px; box-sizing: border-box; text-align: left; transition: .2s ease-in-out;  align-items: center;}
.swiper-slide-prev .yel-btn-с, 
.swiper-slide-next .yel-btn-с, 
.swiper-slide-active .yel-btn-с {display: flex !important;} 
.yel-btn-с:hover {	background-color: #fff;}
.yel-btn {	display: block; color: #000; text-decoration: none; font-size: 1.8rem; width: 100%; height: 60px; background-color: #fcee21; padding-left: 38px; box-sizing: border-box; text-align: left;}
.yel-btn:hover {	background-color: #fff;}

/* --- Delivery --- */

.delivery {	text-align: center; padding-top: 45px; padding-bottom: 45px;}
.delivery h1 {	margin-bottom: 40px;}
.delivery ul {	padding-left: 47px; list-style-type: none;}
.delivery ul li {	text-align: left; font-size: 1.4rem; margin-bottom: 20px; position: relative;}
.delivery ul li::before {	content: " "; width: 22px; height: 15px; position: absolute; left: -47px; background-image: url(mark.svg);}

/* --- Map --- */
.map {	height: 633px; border-top: 9px solid #fcee21; position: relative;}
.pin {	position: absolute; top: 260px; left: 997px;}
.map-desc {	width: 562px; height: auto; min-height: 100px; background-color: rgba(255, 255, 255, 0.8); position: absolute; top: 143px; padding: 20px; box-sizing: border-box; z-index: 99;}
.map-desc h1{	margin-top: 0; margin-bottom: 10px;}
.map-desc p{	margin: 0; font-weight: 300; margin-bottom: 10px;}
.map-desc .phone {	font-size: 2.5rem; font-weight: 500;    margin-bottom: 10px;}
.map-desc .phone .phone-icon {	background-image: url(icon_phone_sm.svg);     width: 31px;     height: 31px;     display: inline-block;    vertical-align: middle;    margin-right: 16px;}

/* --- Swiper --- */
.swiper-container {       width: 100%; height: 100%;}
.swiper-slide {       -webkit-box-sizing: border-box; box-sizing: border-box;}
.swiper-slide .slider-bg {	width: 100%; height: 100%; /*background: url(slider-1.jpg) center 10%;*/
	position: relative;}
.prev { background-image: url("arr_l.svg") !important;  left: 15px !important;  right: auto;}
.next { background-image: url("arr_r.svg") !important;  left: 10px;  right: auto;}
.prev, .next { width: 15px !important;  height: 30px !important;  background-size: 15px 30px !important;}
.swiper-pagination-bullet { width: 13px !important;  height: 13px !important;  display: inline-block;  border-radius: 100%;  background: #fff !important;  opacity: 1 !important;}
.swiper-pagination-bullet-active { opacity: 1;  background: #ff383f !important;}
.swiper-container-2 {	width: 100%; height: 100%;  margin-left: auto;  margin-right: auto;  position: relative;  overflow: hidden;  /* Fix of Webkit flickering */  z-index: 1;}
.swiper-container-2 .swiper-button-prev,
.swiper-container-2 .swiper-button-next { position: absolute;  top: 0% !important;  width: 30px !important;  height: 80% !important;  margin-top: 0px !important;  z-index: 10;  cursor: pointer;  -moz-background-size: 27px 44px;  -webkit-background-size: 27px 44px;  background-size: 27px 44px;  background-position: center;  background-repeat: no-repeat;  background-color: #ff383f;}
.swiper-container-2 .swiper-button-prev { left: 0 !important;  background-position: center left;}
.swiper-container-2 .swiper-button-next { right: 0 !important;  background-position: center right;}
.swiper-container-2 .swiper-slide-next .card { opacity: 1;  transition: .5s ease-in-out;}
.swiper-container-2 .swiper-slide-prev .card { opacity: 1;  transition: .5s ease-in-out;}
.swiper-container-2 .swiper-slide-active .card { opacity: 1;  transition: .5s ease-in-out;}
.swiper-container-2 .swiper-slide-next .yel-btn-с,
.swiper-container-2 .swiper-slide-prev .yel-btn-с,
.swiper-container-2 .swiper-slide-active .yel-btn-с {	display: block;}

/* ====== About ====== */

.about-title {	width: 100%; height: 343px; margin-top: 74px; position: relative; background-image: url(about_title.jpg); background-size: cover;}
.about-title h1{	position: absolute; bottom: 32px;}
.about-text {	text-align: left; padding-top: 45px; padding-bottom: 45px;}
.about-text p {	margin-top: 0;}
.about-text ul {	padding-left: 47px; list-style-type: none; margin-bottom: 45px;}
.about-text ul li {	text-align: left; font-size: 1.4rem; margin-bottom: 20px; position: relative;}
.about-text ul li::before {	content: " "; width: 22px; height: 15px; position: absolute; left: -47px; background-image: url(mark.svg);}
.about-text .space-pic {	width: 100%; height: 180px; background-image: url(space_pic.jpg); background-size: cover; margin-bottom: 45px;}
.about-form {	background-color: #ff383f; text-align: center; padding-top: 45px; padding-bottom: 45px; box-sizing: border-box;}
.about-form h1 {	color: #ffffff; margin-bottom: 40px;}
.about-form .row {	text-align: center;}
.about-form .row .col-nine {	margin: 0 auto; float: none;}
.about-form .col-nine .inputs {	display: flex; justify-content: space-between; padding-bottom: 4%;}

/*.about-form form {	display: flex; justify-content: space-between;}*/
.about-form input {	width: 48%; height: 60px; background-color: #ff383f; border: 1px solid #fff; padding-left: 40px; box-sizing: border-box; color: #000;}
.about-form input:focus {	background-color: #fff; color: #000;}
.about-form input::-moz-placeholder {	color: #fff; opacity: 1;}
.about-form input:-moz-placeholder  {	color: #fff; opacity: 1;}
.about-form input::-webkit-input-placeholder  {	color: #fff; opacity: 1;}
.about-form textarea {	width: 100%; background-color: #ff383f; border: 1px solid #fff; padding-left: 40px; padding-top: 20px; padding-right: 40px; box-sizing: border-box; color: #000;}
.about-form textarea:focus {	background-color: #fff; color: #000;}
.about-form textarea::-moz-placeholder {	color: #fff; opacity: 1;}
.about-form textarea:-moz-placeholder  {	color: #fff; opacity: 1;}
.about-form textarea::-webkit-input-placeholder  {	color: #fff; opacity: 1;}
.about-form .yel-btn{	width: 377px; border: none; margin: 0 auto;	
	margin-top: 4%; font-family: 'Roboto', sans-serif; text-align: center; padding-left: 0;}
.about-form .yel-btn:hover{	cursor: pointer;	
}
.about-form .hint{   color: #fff;    font-size: 1.4rem;    padding-top: 10px;}
.about-form .js-remark{   color: #fff;    font-size: 1.4rem;    padding-top: 10px;}

/* ====== Catalog ====== */

.cat {	margin-top: 74px; padding-top: 45px; padding-bottom: 45px;}
.cat .all{	text-align: right; font-size: 1.4rem; height: 60px; line-height: 6rem; box-sizing: border-box; color: #808080;}
.cat .all a{	color: #808080;}
.cat .all a:hover{	text-decoration: none;}
.cat ul{	margin: 0; padding: 0; display: flex; flex-wrap: wrap;}
.cat ul li{	display: inline-block; width: 210px; height: 60px; border: 1px solid #ff383f; margin-right: 18px; margin-bottom: 18px; height: 6rem; text-align: center;}
.cat ul li:hover{	border: 1px solid #000; cursor: pointer;}
.cat ul li img{	max-width: 136px; max-height: 38px;}
.cat ul li a{	display: flex; align-items: center; justify-content: center; height: 100%;}
.line {	height: 1px; border-bottom: 1px solid #999999; margin-top: 45px; margin-bottom: 45px;}
.cat-btn {display: inline-block; min-width: 154px; height: 50px; font-size: 1.5rem; color: #ff383f; border: 1px solid #ff383f; padding-left: 10px; padding-right: 15px; box-sizing: border-box; line-height: 5rem; text-decoration: none; margin-right: 16px; margin-bottom: 16px;}

.cat .inline {	float: left; margin-right: 40px; line-height: 6rem;}
.cat-btn:hover {	color: #fff; background-color: #ff383f;}

.cat .space{	margin-top: 45px; margin-bottom: 45px;}
.cat .items {	margin-top: 45px; margin-bottom: 45px;}
.cat .items ul {	margin: 0; padding: 0;}
.cat .items ul li{	height: 50px; width: 100%; line-height: 5rem; text-align: left; border: none; font-size: 1.4rem; font-weight: 300; display: flex; align-items: center;}
.cat .items ul li img{	height: 50px; width: 60px; max-height: 50px; max-width: 60px; margin-right: 17px;}
.cat .items ul li a{color: #ff383f;display: inline-block;}
.cat .items ul li a:hover{	text-decoration: none;}
.cat .item {	margin-top: 45px; margin-bottom: 45px;}
.cat .item table {	text-align: left; font-size: 1.4rem; margin-left: 40px; font-weight: 300;}
.cat .item table tr th {	font-weight: 300;}
.cat .item table tr th:nth-child(2) {	padding-left: 32px; font-weight: 500;}
.cat-btn-item {	display: inline-block; min-width: 194px; height: 80px; font-size: 3.6rem; color: #000; border: 1px solid #000; padding-left: 40px; padding-right: 45px; box-sizing: border-box; line-height: 8rem; text-decoration: none; margin-right: 16px; margin-bottom: 16px; font-weight: 300;}
.cat-btn-item:hover {	color: #fff; background-color: #000;}
.hide{   display: none;}
.show{   display: block;}