@charset "UTF-8";
/*---------------------------------*/
/*            Compare Info         */
/*---------------------------------*/
@keyframes a {
	12.5%	{ height: 5px;  }
	25%		{ height: 10px; }
	37.5%	{ height: 15px; }
	50%		{ height: 20px; }
	62.5%	{ height: 15px; }
	75%		{ height: 10px; }
	87.5%	{ height: 5px;  }
	to		{ height: 0px;  }
}
@keyframes c {
	0% {
		opacity: 0;
		transform: translate3d(0, 325px, 0)
	}
	50% {
		opacity: .5;
		transform: translate3d(0, 285px, 0)
	}
	to {
		opacity: 1;
		transform: translate3d(0, 290px, 0)
	}
}
@keyframes d {
	0% {
		transform: translate3d(0, 290px, 0)
	}
	50% {
		transform: translate3d(0, 285px, 0)
	}
	to {
		transform: translate3d(0, 325px, 0)
	}
}
.compare
{
	position: fixed;
    width: 100%;
    left: 0;
    bottom: 0;
    background-color: var(--color-white);
    border: solid 1px var(--theme-accent);
    height: 210px;
    box-shadow: 0px -4px 14px var(--color-gray);
    transition: all .35s ease;
	direction: rtl;
}
.compare:not(.cempty) {
	animation: c .35s linear;
	opacity: 1
}
.cempty {
	opacity: 0;
	animation: d .35s;
	pointer-events: none
}
.compare .toggle
{
	position: absolute;
    top: -36px;
    right: 40px;
    padding: 0 20px;
    height: 36px;
    width: 185px;
    background: var(--theme-primary);
    border-radius: 15px 15px 0 0;
    font-size: 14px;
    font-size: .875rem;
    text-align: center;
    line-height: 36px;
    box-shadow: 0 -4px 14px var(--color-gray);
    cursor: pointer;
    color: var(--color-white);
    transition: all .35s ease;
}
.compare .toggle:before
{
	box-shadow: -9px 9px 0 -2px var(--color-green-bright);
    right: -27px;
    transform: rotate(-5deg);
}
.compare .toggle:after
{
	box-shadow: 9px 9px 0 -2px var(--color-yellow);
    left: -27px;
    transform: rotate(5deg);
}
.compare .wrapper 
{
}
.compare .wrapper .list
{
	position: absolute;
    box-sizing: border-box;
    width: 78%;
    /*background-color: yellow;*/
    height: 210px;
    /* top: 7px; */
    right: 1%;
    text-align: right;
    padding: 5px 0 5px 0;
    overflow: auto;
}
.compare .wrapper .action
{
	box-sizing: border-box;
    position: absolute;
    width: 19%;
    border-right: solid 1px var(--color-border-pale);
    border-left: solid 1px var(--color-border-pale);
    height: 190px;
    left: 1%;
    top: 10px;
    padding: 15px 10px 15px 10px;
}
.compare .wrapper .action > .fullitem, .compare .wrapper .action > .halfitem
{
    box-sizing: border-box;
	border: solid 1px var(--color-border-pale);
    margin-bottom: 10px;
    line-height: 22px;
    font-size: 9pt;
    color: var(--color-black);
	cursor: pointer;
}
.compare .wrapper .action > .fullitem
{
    display: block;
    padding: 2px 10px 2px 10px;
}
.compare .wrapper .action > .halfitem
{
    display: inline-block;
    padding: 2px 10px 2px 10px;
    width: 49%
}
.compare .wrapper .action .halfitem.pdf
{
	text-align: center;
}
.compare .wrapper .action .halfitem.pdf span
{
    display: block;
    line-height: 1.5em;
}
.compare .wrapper .action .halfitem.pdf img
{
    display: inline-block;
    margin-top: 10px;
}
.compare .wrapper .action .docompare
{
    color: var(--theme-primary);
}
.compare .wrapper .action .docompare:before
{
	content: "\f00c";
    font: normal normal normal 14px/1 FontAwesome;
    padding-left: 10px;
}
.compare .wrapper .action .clearcompares
{
    color: var(--color-named-red);
    padding: 2px 15px;
}
.compare .wrapper .action .clearcompares:before
{
	content: "\f00d";
    font: normal normal normal 14px/1 FontAwesome;
    padding-left: 10px;
}
.compare .wrapper .action .clearquants
{
	cursor: pointer;
    color: var(--color-orange);
    padding: 2px 15px;
}
/*-------------------*/
.compare .list .pcitem
{
	position: relative;
    display: inline-block;
    box-sizing: border-box;
    padding: 2px;
    border: solid 1px var(--color-border-pale);
    width: 130px;
    height: 160px;
    text-align: center;
    vertical-align: top;
    margin: 8px 10px 8px 5px;
}
.compare .list .pcitem img
{
}
.compare .list .pcitem .pciteminfo
{
	ddisplay: inline-block;
    box-sizing: border-box;
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: var(--color-white);
    width: 100%;
    height: 38px;
    font-size: 8pt;
    overflow: hidden;
}
.compare .list .pcitem .pciteminfo .itemname
{
	height: 20px;
    box-sizing: border-box;
    background-color: var(--color-border-pale);
    overflow: hidden;
    line-height: 19px;
}
.compare .list .pcitem .pciteminfo .itemcode
{
}
.compare .list .pcitem .itemremove
{
	position: absolute;
    top: -10px;
    left: -10px;
    box-sizing: border-box;
    border: solid 1px var(--color-border-pale);
    border-radius: 50%;
    width: 20px;
    height: 20px;
    line-height: 15px;
    cursor: pointer;
}
.compare .list .pcitem .itemremove:before
{
	content: "\f00d";
    font: normal normal normal 14px/1 FontAwesome;
}
.compare .list .pcitem .quantity
{
	position: absolute;
    bottom: -21px;
    height: 20px;
    left: -1px;
    line-height: 15px;
    width: 130px;
    display: none;
    background-color: var(--theme-accent-alpha-14);
}
.compare .list .pcitem .quantity:before
{
	content: "تعداد مورد نیاز:";
    font-size: 8pt;
    color: var(--theme-primary);
    margin-left: 5px;
}
.compare .list .pcitem .quantity > input
{
	box-sizing: border-box;
	width: 40px;
    height: 15px;
    border-radius: 4px;
    border: solid 1px var(--color-border-pale);
    text-align: center;
    font-size: 8pt;
}
/*---------------------------------*/
/*         Compare Slider          */
/*---------------------------------*/
.compslider
{
    width: 100%;
	height: 1000px;
    padding: 5px;
    margin: 0 0 10px 0;
}
.compslider .caption 
{
	color: var(--color-white);
	background-color: var(--color-purple-gray);
	font-size: 10pt;
	height: 30px !important;
	padding: 0 !important;
}
.compslider .caption:before
{
	content: ' ';
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}
.compslider .caption .sumprice
{
	border-right: solid 1px var(--color-white);
    padding-right: 10px;
    margin-right: 10px
}
.compslider .slides .item
{
	width: 282px;
	height: 930px;
	position: relative;
	margin-left: 10px;
	border-radius: 4px;
    overflow: hidden;
    text-align: center;
	cursor: url('/images/move.png'),default;
}
.compslider .slides .item a
{
	text-decoration: none;
	width: 100%;
	height: 220px;
}
.compslider .slides .item .info
{
	box-sizing: border-box;
    position: absolute;
    top: 230px;
    padding-right: 10px;
    padding-left: 10px;
    width: 100%;
    font-size: 10pt;
    color: var(--color-black);
    font-weight: normal;
    overflow: hidden;
    /* white-space: normal; */
    line-height: 1.7em;
	text-align: right;
}
.compslider .slides .item .info span
{
	font-weight: bold;
    font-size: 10.5pt;
}
.compslider .slides .item .info .productname
{
	box-sizing: border-box;
    padding-bottom: 5px;
    margin-bottom: 5px;
    border-bottom: solid 1px var(--color-black);
    overflow: hidden;
    font-weight: bold;
}
.compslider .slides .item .baseprice
{
	box-sizing: border-box;
    text-align: right;
    color: var(--color-gray-77);
    text-decoration: line-through !important;
}
.compslider .slides .item .discountprice
{
	box-sizing: border-box;
    text-align: right;
    color: var(--theme-accent);
    text-decoration: none !important;
}
.compslider .slides .item .discountpercent
{
	box-sizing: border-box;
    text-align: right;
    color: var(--color-black);
}
.compslider .slides .item .pdesc
{
	font-size: 8pt;
    white-space: pre-wrap;
    border-top: dashed 1px var(--color-bg-hover);
}
.compslider .slides .item .pdesc ul
{
	padding-right: 16px;
}
.compslider .slides .item .pdesc li
{
}
.compslider .slides .item .info .pprinttypes 
{
	white-space: normal;
}
.compslider .slides .item .info .separator
{
    padding: 0;
    margin: 0px;
    border-bottom: solid 1px var(--color-black);
    overflow: hidden;
    font-weight: bold;
    font-size: 0pt;
    margin-top: 10px;
    margin-bottom: 10px;
}
/*---------------------------------*/
.compslider .caption .pdf
{
    box-sizing: border-box;
    display: inline-block;
    padding: 0 10px 0 10px;
    margin-right: 10px;
    height: 20px;
    vertical-align: middle;
    border-right: solid 1px var(--color-white);
	cursor: pointer;
}
.compslider .caption .pdf span
{
}
.compslider .caption .pdf input, .compslider .caption .pdf img
{
	vertical-align: middle;
	margin-top: -2px;
}
@media screen and (max-width: 1000px) 
{
	.compslider .caption .pdf
	{
		left: 5px;
	}
	.compslider .caption .pdf:before
	{
		content: ' ';
		display: inline-block;
		vertical-align: middle;
		height: 100%;
	}
	.compslider .caption .pdf span
	{
		display: none;
	}
}
/*---------------------------------*/