<?
require($_SERVER["DOCUMENT_ROOT"]."/bitrix/header.php");
$APPLICATION->SetTitle("Title");
?>	h1, h2, h3, h4, h5, h6 {font-family: Oswald; }
	.banner {background: url(/img/banner.jpg) no-repeat center; height: 534px; margin-bottom: 30px!important;}
	.banner h1 {color: #2b2e4b;     text-transform: uppercase;    font-size: 30px; font-weight: 600;    text-align: center;    font-family: Oswald;    padding-top: 17%;    width: 50%;    float: right;    line-height: 1.3;}
	.container.razdel, .container.assortiment {margin: auto;}
	.razdel {display:flex; flex-wrap: wrap; text-align:center; margin:50px 0; margin-bottom: 30px!important; }
	.razdel img {width:300px;}
	.razdel div {background:#f2f2f2; padding-bottom:10px;}
	.roznica {margin-left:11px}
	.opt {margin-right:12px}
	.col-3 {width:23%;}
	.col-6 {width:49%;}
	.col-4 {width:32%;}
	.assortiment {display:flex;flex-wrap: wrap;text-align:center;color:#fff;}
	.assortiment h3 {font-size:30px;}
	.assortiment > div {padding-top:5%;}
	.assortiment > div a {border:1px solid #fff; padding:10px 0; margin:5px; width:100px; font-family:Oswald;}
	.preim {display:flex;flex-wrap:wrap; align-items: center;background:#f2f2f2; padding:30px; margin:auto; margin-bottom:30px;}
	.preim h6 {font-size: 17px; font-weight: 400; line-height: 1.2;}
	.m-sh {background: url(/img/mo.jpg) no-repeat; height:200px; margin-right:23px; margin-bottom:23px;}
	.w-sh {background: url(/img/wo.jpg) no-repeat; height:200px; margin-right:23px; margin-bottom:23px;}
	.k-sh {background: url(/img/do.jpg) no-repeat; height:200px; margin-bottom:23px;}
	.s-sh {background: url(/img/so.jpg) no-repeat; height:200px; margin-right:23px; margin-bottom:23px;}
	.h-sh {background: url(/img/dom.jpg) no-repeat; height:200px; margin-right:23px; margin-bottom:23px;}
	.bag {background: url(/img/bag.jpg) no-repeat; height:200px; margin-bottom:23px; }

	.pr1 {background: url(/img/preim-1.png) no-repeat left center; background-size: 80px auto; padding-left:100px; padding-right:20px;}
	.pr2 {background: url(/img/preim-2.png) no-repeat left center; background-size: 80px auto; padding-left:100px; padding-right:20px;}
	.pr3 {background: url(/img/preim-3.png) no-repeat left center; background-size: 80px auto; padding-left:100px; padding-right:20px;}
	.pr4 {background: url(/img/preim-4.png) no-repeat left center; background-size: 80px auto; padding-left:100px; padding-right:20px;}
	.pr5 {background: url(/img/preim-5.png) no-repeat left center; background-size: 80px auto; padding-left:100px; padding-right:20px;}
	.pr6 {background: url(/img/preim-6.png) no-repeat left center; background-size: 80px auto; padding-left:100px; padding-right:20px;}

	h5 {width:100%; background: #fff; margin-top: 0px; text-align: left;    border-bottom: 1px solid #2b2e4b;    padding-bottom: 5px;    color: #2b2e4b;    font-family: oswald;    font-size: 24px;		font-weight: normal;}
	.second_block {  display: none;}
	.assortiment > div:hover .second_block {  display: flex; margin-top:15px;justify-content: center;}
	.brands > div:hover .second_block {  margin-top:15px; display: flex;align-items: flex-end; justify-content: center;   height: 142px;}

	.main-menu .nav__item.-visible {
    visibility: visible;
}

.main-menu .nav {background:transparent;}

.main-menu .nav__item-link {
    color: #444; font-family: 'Oswald';    font-size: 20px;
}

.main-menu {width:75%; padding:0 5%;}
.midisa, .pyatka {width:20%}

.main-popular {margin-bottom:30px;}
.main-popular h1, .main-popular .product__price-box {display:none;}

.main-popular .product {max-width: 275px;  min-width: 275px; margin-right: 5px;}

.main-popular .product__more {background: #701111; color: #fff;}


.brands {display: flex;  flex-wrap: wrap; text-align: center; margin-bottom:100px;}

.brands > div {margin:10px; background-size:contain;}
.brands a { color:#000;   border: 1px solid #000;    padding: 10px 0;    margin: 5px;    width: 100px;    font-family: Oswald;align-self: flex-end;}

.brand-1 {height:142px; background: url(/img/brands/brand-1.jpg);}
.brand-2 {height:142px; background: url(/img/brands/brand-2.jpg);}
.brand-3 {height:142px; background: url(/img/brands/brand-3.jpg);}
.brand-4 {height:142px; background: url(/img/brands/brand-4.jpg);}
.brand-5 {height:142px; background: url(/img/brands/brand-5.jpg);}
.brand-6 {height:142px; background: url(/img/brands/brand-6.jpg);}
.brand-7 {height:142px; background: url(/img/brands/brand-7.jpg);}
.brand-8 {height:142px; background: url(/img/brands/brand-8.jpg);}

@media screen and (max-width: 480px) {
	.banner {height:auto;}
.opt {
    margin-right: 0px; 
}
.roznica {
    margin-left: 0px;
}

	.m-sh {margin-right:0;}

	.banner h1 {width:100%; float:none;}
	.col-6, .col-4 {width:100%;}
	.brands .col-3 {width:44%;}
	.brand-1, .brand-2, .brand-3, .brand-4, .brand-5, .brand-6, .brand-7, .brand-8 {background-repeat: no-repeat;}


}<?require($_SERVER["DOCUMENT_ROOT"]."/bitrix/footer.php");?>