@charset "utf-8";
#ListContainer{
	height: 350px;
	width: 200px;
	background: #333;
	position: relative;
	display: inline-block;
	vertical-align: top;
	margin: 3px;
	overflow: hidden;
}
#ListIMG{
	width: 200px;
	height: 267px;
	overflow: hidden;
	background: black;
}
#Price{
	color: white;
	font-size: 33px;
	padding-top: 5px;
	margin-top: 10px;
	text-align: center;
}
#Rating{
	width: 70%;
    	padding-top: 5px;
    	text-align: center;
    	margin: auto;
	height: 20px;
}
.rating-plus {
    display: inline;
    vertical-align: top;
    color: #cbbfb3;
    font-size: 25px;
}
.rating-minus {
	font-size: 30px;
    display: inline;
    vertical-align: top;
    margin-left: -5px;
    text-shadow: 0 0 0 #000000;
    line-height: 25px;
    color: black;
    letter-spacing: -3px;
}
#ListDescription{
	color: white;
	padding-top: 30px;
	padding-left: 20px;
	height: 237px;
	width: 180px;
	overflow: hidden;
	text-overflow: ellipsis;
	font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
	position: absolute;
	top: 0px;
	background: #333;
	display: none;
	text-align: left;
}
@keyframes LDA{
	0%{height: 1px;}
	100%{height: 237px;}
}
#ListContainer:hover > #ListDescription{
	display: block;
	animation: LDA 0.4s;
}
pdet{
	background: hsla(31,18%,75%,1.00);
	text-align: center;
	margin-left: -4px;
	padding-top: 5px;
	padding-bottom: 5px;
	position: absolute;
	bottom: 5px;
	width: 167px;
	max-width: 167px;
}
#New{
	position: absolute;
    --size: 122px;
    --fontS: 28px;
    top: calc(var(--size)/2*-1);
    left: calc(var(--size)/2*-1);
    width: var(--size);
    height: var(--size);
    color: white;
    background-color: #d40101;
    font-size: var(--fontS);
    font-family: Trebuchet MS;
    font-weight: bold;
    transform: rotate(-45deg);
	line-height: calc(var(--size)*2 - var(--fontS) - 10px);
	opacity: 0.8;
	text-align: center;
}
#New-lv{
	position: absolute;
    --size: 122px;
    --fontS: 18px;
    top: calc(var(--size)/2*-1);
    left: calc(var(--size)/2*-1);
    width: var(--size);
    height: var(--size);
    color: white;
    background-color: #d40101;
    font-size: var(--fontS);
    font-family: Trebuchet MS;
    font-weight: bold;
    transform: rotate(-45deg);
	line-height: calc(var(--size)*2 - var(--fontS) - 10px);
	opacity: 0.8;
	text-align: center;
}
#New-ru{
	position: absolute;
    --size: 122px;
    --fontS: 21px;
    top: calc(var(--size)/2*-1);
    left: calc(var(--size)/2*-1);
    width: var(--size);
    height: var(--size);
    color: white;
    background-color: #d40101;
    font-size: var(--fontS);
    font-family: Trebuchet MS;
    font-weight: bold;
    transform: rotate(-45deg);
	line-height: calc(var(--size)*2 - var(--fontS) - 10px);
	opacity: 0.8;
	text-align: center;
}
#DetailsB{
	position: absolute;
	height: 100%;
	width: 100%;
	background: transparent;
	top: 0;
	left: 0;
	border: none;
	z-index: 10;
	cursor: pointer;
	outline: none;
}
#DetailsB:hover{
	box-shadow: 0 0 1px hsla(0,100%,100%,0.3);
}
plowt{
	color: hsla(0,0%,100%,0.4);
}
pHt{
	color: #cabfb3;
}