*{
box-sizing:border-box;
}
@font-face {
font-family: 'agavantgardecyr';
src: url('./fonts/agavantgardecyr.eot');
src: url('./fonts/agavantgardecyr.eot?#iefix') format('embedded-opentype'),
url('./fonts/agavantgardecyr.woff') format('woff'),
url('./fonts/agavantgardecyr.ttf') format('truetype'),
url('./fonts/agavantgardecyr.svg#agavantgardecyr') format('svg');
font-weight: normal;
font-style: normal;
}
	
@font-face {
		font-family: 'calibri_web';
		src: url('/fonts/calibri.eot');
		src: url('/fonts/calibri.eot?#iefix') format('embedded-opentype'),
			 url('/fonts/calibri.woff') format('woff'),
			 url('/fonts/calibri.ttf') format('truetype'),
			 url('/fonts/calibri.svg#calibri') format('svg');
		font-weight: normal;
		font-style: normal;
	}
	@font-face {
		font-family: 'calibri_web';
		src: url('/fonts/calibrib.eot');
		src: url('/fonts/calibrib.eot?#iefix') format('embedded-opentype'),
			 url('/fonts/calibrib.woff') format('woff'),
			 url('/fonts/calibrib.ttf') format('truetype'),
			 url('/fonts/calibrib.svg#calibri') format('svg');
		font-weight: bold;
		font-style: normal;
	}
	@font-face {
		font-family: 'calibri_web';
		src: url('/fonts/calibrii.eot');
		src: url('/fonts/calibrii.eot?#iefix') format('embedded-opentype'),
			 url('/fonts/calibrii.woff') format('woff'),
			 url('/fonts/calibrii.ttf') format('truetype'),
			 url('/fonts/calibrii.svg#calibri') format('svg');
		font-weight: normal;
		font-style: italic;
	}
	@font-face {
		font-family: 'calibri_web';
		src: url('/fonts/calibriz.eot');
		src: url('/fonts/calibriz.eot?#iefix') format('embedded-opentype'),
			 url('/fonts/calibriz.woff') format('woff'),
			 url('/fonts/calibriz.ttf') format('truetype'),
			 url('/fonts/calibriz.svg#calibri') format('svg');
		font-weight: bold;
		font-style: italic;
	}
BODY{
margin:0px;
font-family: calibri, 'calibri_web', verdana;
font-size:18px;
color:#222;
}
INPUT, TEXTAREA, BUTTON, SELECT{
font-family: calibri, 'calibri_web', verdana;
font-size:18px;
}

/* модальное окно*/
#modal_form {
	width: 400px; 
	height: 520px;
	border-radius: 0px;
	border: 0px #000 solid;
	background: #fff;
	position: fixed;
	top: 45%;
	left: 50%;
	margin-top: -260px;
	margin-left: -200px;
	display: none; 
	opacity: 0; 
	z-index: 5;
	padding: 20px;
	box-sizing: border-box;
}
#modal_form .nametext{
margin:0px;
margin-bottom:10px;
font-size:26px;
}
.textform{
font-size: 20px;
margin-top: 0px;
}
#modal_form .buttons{
}
#modal_form2 {
	width: 290px; 
	height: 382px; /* Размеры должны быть фиксированы */
	border-radius: 0px;
	border: 0px #000 solid;
	background: #fff;
	position: fixed; /* чтобы окно было в видимой зоне в любом месте */
	top: 45%; /* отступаем сверху 45%, остальные 5% подвинет скрипт */
	left: 50%; /* половина экрана слева */
	margin-top: -193px;
	margin-left: -145px; /* тут вся магия центровки css, отступаем влево и вверх минус половину ширины и высоты соответственно =) */
	display: none; /* в обычном состоянии окна не должно быть */
	opacity: 0; /* полностью прозрачно для анимирования */
	z-index: 5; /* окно должно быть наиболее большем слое */
	padding: 20px 20px;
	padding-top: 0px;
	text-align: center;
	box-sizing: border-box;
}

#modal_form #modal_close {
	width: 21px;
	height: 21px;
	position: absolute;
	top: 10px;
	right: 10px;
	cursor: pointer;
	display: block;
}
#overlay {
	z-index: 3; 
	position: fixed; 
	background-color: #000; 
	opacity: 0.8; 
	width: 100%; 
	height: 100%; 
	top: 0; 
	left: 0;
	cursor: pointer;
	display: none;
}
#overlay2 {
z-index: 1;
position: fixed;
background-color: #000;
opacity: 0.8;
width: 100%; 
height: 100%;
top: 0; 
left: 0;
cursor: pointer;
display: none;
}
#modal_form2 #modal_close2 {
	width: 21px;
	height: 21px;
	position: absolute;
	top: 10px;
	right: 10px;
	cursor: pointer;
	display: block;
}
.nameform{
font-size: 30px;
font-weight: lighter;
padding-right: 20px;
}
.areaform{
border: solid 1px #5A5A5A;
padding: 20px 30px;
margin:10px 0px;
width: 800px;
vertical-align: middle;
}
.inputform{
border: solid 1px #5A5A5A;
padding: 20px 30px;
margin: 10px 0px;
width: 800px;
}
.inputselect{
border: solid 1px #5A5A5A;
padding: 20px 30px;
margin: 10px 0px;
width: 800px;
}
#modal_form .inputform, #modal_form .inputselect, #modal_form .areaform{
width:100%;
padding:10px 20px;
margin-top: 0px;
}
#modal_form .areaform{
height:90px;
}
.orderform{
text-align:right;
padding: 20px;
}
.butform{
margin-top: 10px;
color: #555555;
background: none;
border: solid 1px #555;
padding: 10px 20px;
font-size: 30px;
cursor: pointer;
transition: .3s;
}
.butform:HOVER{
background:#555555;
color:#fff;
}
/* snow */
.snowflake {
  -webkit-animation: spin 4s linear infinite;
  -moz-animation: spin 4s linear infinite;
  animation: spin 4s linear infinite;
}
 @-moz-keyframes 
spin { 100% {
-moz-transform: rotate(360deg);
}
}
 @-webkit-keyframes 
spin { 100% {
-webkit-transform: rotate(360deg);
}
}
 @keyframes 
spin { 100% {
-webkit-transform: rotate(360deg);
transform:rotate(360deg);
}
}
/* snow */
.headermain{
height:358px;
background:url('./img/main-header-bg.jpg') no-repeat left;
display: flex;
align-items: center;
}
.bodytext{
width:1200px;
text-align:left;
margin: auto;
}
.nourl{
text-decoration:none;
color:inherit;
border:none;
}
.logoimg{
width: 200px;
}
.header{
/* background:url('./img/header.png') no-repeat center top; */
/* background:#30426E; */
/* height:300px; */
/* padding-top:20px; */
color:#fff;
}
.header1{
display: inline-block;
vertical-align: top;
text-align: left;
height: 100%;
width: 600px;
padding-top:20px;
padding-bottom:10px;
}
.header2{
display: inline-block;
width: 600px;
vertical-align: top;
/* padding-left: 100px; */
text-align: right;
/* background: red; */
height: 100%;
padding-top:20px;
padding-bottom:10px;
height:136px;
}
.header2 .buttons{
width:280px;
margin:5px 0px;
text-align:left;
font-size:20px;
}
.header3{
display: inline-block;
width: 380px;
/* color: #A6A6A6; */
vertical-align: middle;
text-align: right;
/* padding-left: 80px; */
/* padding-bottom: 150px; */
}
.orange{
/* color:#EA6F2B; */
color:#EF7F1B;
}
.headerurl{
transition: .3s;
}
.headerurl:HOVER{
color:#EA6F2B;
}
.menu{
display: flex;
color:#D6D6D6;
/* width: 1200px; */
margin: auto;
justify-content: center;
/* margin-top: -60px; */
/* margin-bottom: 20px; */
background:#222222;
position:relative;
width:100%;
padding: 4px 0px;
}
.menus{
position:relative;
display: inline-block;
}
.submenu{
position:absolute;
left:0px;
top:0px;
background:#222;
top: 42px;
width: max-content;
display:none;
opacity:0;
z-index: 1;

transition: .3s;
}
.submen:HOVER .submenu{
display:block;
opacity:1;
}
.menuurl{
display: block;
text-decoration: none;
color: #fff;
/* font-size: 28px; */
font-weight: lighter;
padding: 10px 20px;

transition: .3s;
}
.menuurl:HOVER{
color:#fff;
background:#ef7f1b;
}
.submenu .menuurl{

}
.menuactive{
color:#fff;
background:#ef7f1b;
}
.menuseparator{
color: #DDDDDD;
padding: 10px;
font-size: 28px;
font-weight: 100;
}
.sliderdiv{
background:url('./img/main-slider-img.jpg') no-repeat center;
height:600px;
width: 100%;
position: relative;
margin-bottom:50px;
}
.sliceimg{

}
.slicediv{
position:absolute;
bottom: -47px;
left: 0px;
height:47px;
background:url('./img/bevel-left2right.png') no-repeat center;
width: 100%;
}
.centerpromo{
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.promodiv{
background: no-repeat center;
background-size: cover;
text-align: center;
width: 400px;
display: inline-block;
height: 300px;
vertical-align: top;
position:relative;

transition: .3s;
margin-bottom:40px;
}
.promodiv:HOVER{
filter: saturate(1.2);
filter: brightness(1.2);
}
.promoname{
text-align: left;
padding: 20px;
position: absolute;
bottom: 20px;
left: 20px;
margin: 0px;
background: rgba(255, 255, 255, 0.7);
}
.promodivimg{
background: no-repeat center;
background-size: cover;
width:300px;
height:200px;
display:inline-block;
vertical-align: middle;
}
.promoname2{
font-weight: bold;
font-size:20px;
}
.promoimg{

}
.promodivtext{
width: 900px;
display: inline-block;
vertical-align: middle;
padding-left: 40px;
}
.promourl{

}
.promotext{
text-align:justify;
}
.namepromo{
color:#9e9e9e;
font-size:20px;
margin:0px;
font-weight: lighter;
margin-bottom: 20px;
}
.icons{
color:#9e9e9e;
font-weight: lighter;
display: block;
margin-top: 10px;
text-align: left;
}
.icons I{
padding-right:20px;
width: 30px;
}
.nourl:hover, .icons:HOVER{

}
.blackbg{
background:#222222;
}
.buttons{
text-decoration: none;
background: #30426E;
color: #fff;
padding: 10px 20px;
display: inline-block;
cursor: pointer;
border: none;
transition: .3s;
}
.buttons:HOVER{
background:#EF7F1B;
color:#fff;
}
.buttons:disabled{
background:#999;
cursor:unset;
}
.buttons:disabled:HOVER{
color:unset;
color:#fff;
}
.buttons I{
width: 35px;
}
.imgtext{
float:left;
margin-right:20px;
margin-top:-20px;
}
.nametext{
font-weight: bold;
text-align: left;
font-size: 26px;
/* color: #30426E; */
text-transform:uppercase;
}
.footerlogo{
width: 110px;
float: left;
margin-right: 20px;
}
.footer{
/* height:272px; */
padding-top: 110px;
margin-top: 40px;
background: #222222;
color:#fff;
padding: 40px 0px;
}
.footer1{
display:inline-block;
width:400px;
vertical-align: top;
}
.footer2{
display:inline-block;
width:400px;
vertical-align: top;
padding:0px 40px;
}
.footer3{
display:inline-block;
width:400px;
text-align:right;
vertical-align: top;
}
.siteriadiv{
text-align: right;
/* margin-top: 30px; */
font-size: 16px;
/* color: #D6D6D6; */
/* background: red; */
display: inline-block;
width: 250px;
margin-top: 40px;
}
.siteriadiv IMG{
float:right;
margin-left: 10px;
margin-top: 5px;
}
.siteriaurl{
display: block;
text-decoration: none;
color: inherit;
font-size: 24px;
font-weight: bold;
/* text-shadow: 1px 1px 0px #fff; */
transition: .3s;
}
.siteriaurl:HOVER{
color: #FF4700;
}
.map{

}
.preims{
background:#30426E;
color:#fff;
padding:40px 0px;
margin:40px 0px;
}
.preimsdivs{
display: inline-block;
width: 600px;
}
.preimstext{
margin:0px;
color:#fff;
margin-bottom: 30px;
margin-top: 10px;
}
.preimsname{
font-size: 20px;
margin: 0px;
font-weight: bold;
}
.preims I{
font-size: 60px;
width: 80px;
vertical-align: middle;
padding-bottom: 4px;
color: #EF7F1B;
}
.gallery{

}
.imggal{
height: 250px;
margin-right: 5px;
margin-bottom: 5px;
}
.right{
text-align:right;
}
.slider{
width:1200px;
margin:auto;
margin-top:40px;
}
.catalogurl{
text-decoration: none;
color: inherit;
display:block;
padding: 5px 0px;
}
.catalogurl:HOVER{
background: #D6D6D6;
}
.catalogtext{
margin:0px;
}
.itemsdiv{
display: inline-block;
width: 20%;
padding: 10px;
vertical-align:top;
padding-bottom:0px;
margin:0px;
}
.itemsdiv:nth-of-type(4n){
margin-right:0px;
}
.itemsimg{
background:#fff no-repeat center;
background-size:cover;
width: 100%;
height: 200px;
position:relative;
padding:20px;
}
.popular{
position: absolute;
bottom: 20px;
left: 20px;
background: #D6D6D6;
padding: 10px 20px;
font-weight: bold;
}
.itemsimg .stock, .itemsimg .ukladka, .itemsimg .popular{
font-size: 18px;
padding: 5px 10px;
position:unset;
}
.itemsname{
font-weight: bold;
margin: 0px;
margin-top: 20px;
margin-bottom: 10px;
min-height:70px;
}
.itemsparam{
font-size: 16px;
margin: 2px 0px;
}
.itemsprice{
font-size: 20px;
margin: 0px;
text-align: center;
margin-top: 20px;
background: #D6D6D6;
padding: 10px;
}
.itemsprice SPAN{
font-size: 26px;
}
.itemspricenew{
/* font-size: 20px; */
margin: 0px;
text-align: center;
margin-top: 20px;
background: #EF7F1B;
padding: 10px;
color:#fff;
}
.itemspricenew SPAN{
font-size: 26px;
}
.itemspricenew  + .itemsprice SPAN{
text-decoration: line-through;
}
.navicatalog{
text-transform:uppercase;
}
.itemimgdiv{
position:relative;
background:#fff no-repeat center;
background-size:cover;
width: 400px;
height: 300px;
display:inline-block;
vertical-align: top;
}
.itemtextdiv{
display:inline-block;
width:800px;
padding-left: 20px;
vertical-align: top;
}
.itemdescdiv{
margin:20px 0px;
}
.itemtextname{
font-weight: bold;
margin: 0px
}
.itemtextparam{
margin: 0px;
font-size: 20px;
margin: 5px 0px;
border-bottom: solid 1px #999;
padding: 5px 0px;
}
.itemtextparam SPAN{
min-width: 200px;
display: inline-block;
}
.itemtextprice{
display: inline-block;
background: #D6D6D6;
padding: 10px 20px;
margin: 10px 0px;
}
.itemtextprice SUP{
font-size:14px;
}
.itemtextprice SPAN{
font-size:26px;
font-weight:bold;
}
.itemtextpricenew{
display: inline-block;
font-size: 20px;
margin: 0px;
text-align: center;
margin-top: 20px;
background: #EF7F1B;
padding: 10px 20px;
color:#fff;
}
.itemtextpricenew SPAN{
font-weight:bold;
font-size: 26px;
}
.itemtextpricenew + .itemtextprice SPAN{
text-decoration:line-through;
}
SUP{
font-size: 14px;
}
.stock{
position: absolute;
bottom: 20px;
left: 20px;
background: #D6D6D6;
padding: 10px 20px;
font-weight: bold;
}
.ukladka{
position: absolute;
top: 20px;
left: 20px;
background: #D6D6D6;
padding: 10px 20px;
font-weight: bold;
}
.filtrdiv{
background: #D6D6D6;
padding:20px;
margin-bottom:40px;
}
.filtrdiv P{
margin: 10px 0px;
display: inline-block;
}
.filtrdiv P:nth-of-type(odd){
/* background:green; */
width:760px;
}
.filtrdiv P:nth-of-type(even){
/* background:red; */
width:400px;
}
.filtrdiv P SPAN{
min-width:120px;
display:inline-block;
}
.filtrdiv P:nth-of-type(even) SPAN{
min-width: 200px;
}
.inputfiltr{
font-size: 18px;
padding: 5px 10px;
margin: 0px 20px;
text-align:center;
}
.selectfiltr{
font-size: 18px;
padding: 5px 10px;
margin: 0px 20px;
width:150px;
}
.mobilemenubutton{
display:none;
}
.mobilemenu{
display:none;
}
.ploshad{
padding: 10px 20px;
    font-size: 25px;
    width: 180px;
    border: solid 1px #999;
}
.brands{
background: #222;
/* padding: 20px; */
/* margin-bottom: 40px; */
display: inline-block;
margin-right: 10px;
position: relative;
vertical-align: top;
color: #fff;
}
.brandsactive{
background: #ef7f1b;
color: #fff;
}
.brands .catalogurl{
padding:10px 20px;
transition: .3s;
}
.brands .catalogurl:HOVER{
background: #ef7f1b;
color:#fff;
}
.cartitems{
margin:20px 0px;
}
.cartitems .itemimgdiv{
width: 100px;
height: 70px;
vertical-align:middle;
}
.cartitems .itemtextdiv{
vertical-align:middle;
}
.melko{
font-size:14px;
color:#555;
margin: 0px;
}
.textcart{
font-size:20px;
margin:0px;
}
.funcbuts{
font-size:14px;
color:#555;
margin: 0px;
}
.carttrash{
color: red;
font-size: 16px;
cursor:pointer;
}
.inputs{
padding: 5px;
font-size: 16px;
min-width: 190px;
text-align: center;
}
.contacts{
display:none;
}
.colldiv{
position: absolute;
left: 0px;
top: 0px;
background: #222;
top: 42px;
width: max-content;
display: none;
opacity: 0;
z-index: 1;
transition: .3s
}
.colldivs{
display:block;
color: #fff;
}
.brands:HOVER .colldiv{
display:block;
opacity:1;
}
.colldivs .catalogurl:HOVER
{
color:#fff;
background:#ef7f1b;
}
.footertext{
margin: 10px 0px;
}
.blue{
color:#30426E;
}
.orangenew{
color:#EF7F1B;
}
.headerleft{
text-align:right;
background:#EF7F1B;
width:50%;
display:inline-block;
height:100%;
position:relative;
}
.headerright{
text-align:left;
background:#30426E;
width:50%;
display:inline-block;
height:100%;
position:relative;
}
.headername{
font-size: 26px;
margin: 0px;
}
.headertext{
margin: 10px 0px;
}
.headertext I, .footertext I{
margin-right:10px;
}
.header0{
color:#222;
}
.polleft{
display:inline-block;
width:50%;
text-align:left;
vertical-align: top;
}
.polright{
display:inline-block;
width:50%;
text-align:right;
vertical-align: top;
}
.socicons{
vertical-align: middle;
margin-top: -1px;
margin-left: 10px;
}
.footer1 .socicons{
margin:0px;
margin-right:10px;
}
.soctext{
margin: 10px 0px;
font-style: italic;
}
.orangebg{
background:#EF7F1B;
padding:10px 20px;
color:#fff;
}
.bluebg{
background:#30426E;
padding:10px 20px;
color:#fff;
}
.footerurl{
color:#fff;
}
.footerurl:HOVER{
color:#EF7F1B;
}
.spisokorange{
color:#EF7F1B;
}
.spisokorange SPAN{
color:#fff;
}
.footer0{
text-align:center;
}
.promodiv2{
margin-bottom:40px;
}
.urls, .urllink{
color:#30426E;
}
.urls:HOVER, .urllink:HOVER{
color:#EF7F1B;
}
.headerlogo{
position: absolute;
right: 0px;
width: 64px;
top: 5px;
}
.headerlogo2{
position: absolute;
left: 0px;
width: 64px;
top: 5px;
}
.center{
text-align:center;
}
.mobile{
display:none;
}
.itemsdiv .buttons{
width: calc(50% - 2px);
text-align: center;
}
.itemsdiv .buttons:first-child{
margin-right: 4px;
}