/* Новые миниатюры товаров */
.test {width: 845px; border: 1px solid #240; padding: 5px 10px 10px; margin: 0 auto;}			/* удалить */

@font-face {
	font-family: 'rouble';
	src: url('temp/fonts/rouble.woff') format('woff'),
		 url('temp/fonts/rouble.ttf') format('truetype'),
		 url('temp/fonts/rouble.svg#pt_sans_narrowbold') format('svg');
	font-weight: normal;
	font-style: normal;
}

body {background-color: white;}

.items_area * {box-sizing: border-box; font-family: arial;}
.items_area {
	font-size: 13px;
	display: -webkit-flex;
	-webkit-flex-flow: row wrap;
	-webkit-justify-content: left;

	display: flex;
	flex-flow: row wrap;
	justify-content: left;
}
.items_area .itemwrap {
	-webkit-flex: 1 1 200px;
	flex: 1 1 200px;
	position: relative;
	max-width: 200px;
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 20px;
	min-height: 237px;
}
.items_area .item {
	padding: 17px 20px;
	border: 1px solid #ccc;
	background: white;
	z-index: 22;
	min-height: 100%;
	overflow: hidden;
}
/* Скрытый товар, видимый только администратору */
.items_area .item.blocked {opacity: 0.3;}
.items_area .item.blocked:hover {opacity: 1;}

.items_area .item .corner {
	position: absolute;
	top: 0;
	right: 0;
	background: 0 0 url('/images/flags_sprite.png') no-repeat;
	width: 95px;
	height: 95px;
	opacity: 0.7;
}
.items_area .item .corner.soon {right: auto; left: 0; background-position: 0 -1320px;}
.items_area .item:hover .corner.soon {background-position: -1px -1320px;} /* Странный костыль, но без него никак */
.items_area .item .corner.sale {background-position: 0 -1014px;}
.items_area .item .corner.recommend {background-position: 0 -676px;}
.items_area .item .corner.preorder {background-position: 0 -1500px;}
.items_area .item .corner.new {background-position: 0 -338px;}
.items_area .item .corner.hit {background-position: 0 0px;}

.items_area .item .picture {text-align: center; cursor: pointer;}

/* Название товара */
.items_area .item .name {
	color: black;
	font-weight: bold;
	margin: 15px 0 8px;
	height: 72px;
	position: relative;
	overflow: hidden;
	text-align: left;
}
.items_area .item .name .fader {
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 0;
	height: 37px;
	background-image: linear-gradient(to top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}

.items_area .item .price {font-size: 18px; font-weight: bold; color: #ff0063; line-height: 20px;}
.items_area .item .price span {font-family: rouble; font-size: 15px;}
.items_area .item .price div.MiniOldPrice {display: inline-block; margin-right: 20px; text-decoration: line-through; color: #888;}

/* Если нет цены, то в "Скоро в продаже" скрывает знак рубля */
.items_area .item.noprice .price {color: #555; font-size: 14px; font-weight: normal; line-height: 23px;}
.items_area .item.noprice .price span {display: none;}

/* Блоки, которые становятся видимыми при наведении */
.items_area .item .show_on_hover,  .items_area .item .flex_on_hover {display: none;}

/* Информация о товаре: артикул, цвет, сайт */
.items_area .item .iteminfo {margin: 15px 0;} 
.items_area .item .iteminfo span,
	.items_area .item .iteminfo a {color: #FF0063;}
.items_area .item .iteminfo span {white-space: nowrap;}
.items_area .item .iteminfo a {text-decoration: underline;}
.items_area .item .iteminfo a:hover {color: #A428FF;}

/* Скрытый блок с ценами */
.items_area .item .prices {margin: 15px 0 10px;}
.items_area .item .prices span {font-size: 16px;}
.items_area .item .prices div > span {font-weight: bold;}
.items_area .item .prices span.stroke {text-decoration: line-through;}
.items_area .item .prices span > span {font-family: rouble;}

/* Кнопки */
.items_area .item .buttons {
	margin-top: 10px;
	cursor: pointer;
	-webkit-flex-flow: row nowrap;
	-webkit-justify-content: space-between;

	flex-flow: row nowrap;
	justify-content: space-between;
}
.items_area .item .buttons > div {width: 78px; height: 29px;}
.items_area .item .buttons .b_buy {background: 0 0 url('/images/miniatures/mini_buy.png') no-repeat;}
.items_area .item .buttons .b_buy.preorder {background: 0 0 url('/images/miniatures/mini_preorder.png') no-repeat;}
.items_area .item .buttons .b_open {background: 0 0 url('/images/miniatures/mini_more.png') no-repeat;}
.items_area .item .buttons > div:hover {background-position: 0 -29px !important;}
/* Неактивная кнопка покупки, если нет цены */
.items_area .item.noprice .buttons .b_buy {cursor: default; opacity: 0.3;}

/* Стили для развёрнутого блока */
.items_area .item:hover  {position: absolute; top: 0; left: 0px; right: 0px; box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.2);}
.items_area .item:hover .corner {top: -1px; right: -1px; cursor: pointer;}
.items_area .item:hover .corner.left {left: -1px; right: auto}
.items_area .item:hover .name {overflow: none; height: auto;}
.items_area .item:hover .name .fader {display: none;}
.items_area .item:hover .price div.MiniOldPrice {display: none;}
.items_area .item:hover .show_on_hover {display: block;}
.items_area .item:hover .flex_on_hover {display: -webkit-flex; display: flex;}
.items_area .item.noprice:hover .prices {display: none;}

/* Кнопки "Показать" */
.items_area .mores {
	width: 100%;
	display: -webkit-flex;
	-webkit-justify-content: space-between;
	display: flex;
	justify-content: space-between;
}
.items_area .more {
	border: 1px solid #ccc;
	padding: 10px 0;
	text-align: center;
	width: 100%;
	cursor: pointer;
	font-size: 12px;
	font-weight: bold;
	margin: 20px 5px 0;
	
	width: calc(50% - 12px);
}
.items_area .more.all {margin-right: 10px;}
.items_area .more.dark {background-color: #EEE;}
.items_area .more.dark:hover {background-color: #FFF;}

.items_area .innerline {display: none;
border: 1px solid #CCC;
border-width: 0 0 1px;
margin: 20px 0;}
.items_area .item:hover .innerline {display: block;}

/* Кнопки-листалки */
.items_area .hidden {display: none !important;}
.items_area .pages {
	margin: 20px 0;
	width: 100%;
	display: -webkit-flex;
	-webkit-flex-direction: row;
	-webkit-justify-content: center;

	display: flex;
	flex-direction: row;
	justify-content: center;

}
.items_area .pages .page {
	border: 1px solid #ccc;
	border-right-width: 0;
	padding: 6px 6px;
	min-width: 27px;
	display: block;
	text-align: center;
	font-weight: bold;
	cursor: pointer;
	font-size: 12px;
}
.items_area .pages .page.arrow {padding: 6px 14px;}
.items_area .pages .page:last-child {border-right-width: 1px;}
.items_area .pages .page.active {background-color: #ff0063; color: white; cursor: initial;}
.items_area .more:hover, .items_area .pages .page:not(.active):hover {background-color: #EEE;}
.items_area .pages .page.dots:hover {background-color: #FFF;}
.items_area .page.dots {border-width: 0; border-left-width: 1px; cursor: initial; padding: 0; padding-top: 12px;}

/* Хлебные крошки */
.breadcrumbs {margin-top: 5px !important;}
.breadcrumbs a {color: #ff0063; font-size: 12px; font-weight: normal;}
/* Разделитель хлебных крошек */
img.breadsep {display: inline-block; vertical-align: middle; margin: 0 5px;}