@font-face {
	font-family: 'Yekan';
	src: url('../fonts/Samim.eot?#') format('eot'),  /* IE6–8 */
		url('../fonts/Samim.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
		url('../fonts/Samim.ttf') format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
	font-weight: normal;
    font-style: normal;
}
@font-face {
	font-family: 'Yekan';
	src: url('../fonts/Samim-Bold.eot?#') format('eot'),  /* IE6–8 */
		url('../fonts/Samim-Bold.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
		url('../fonts/Samim-Bold.ttf') format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
	font-weight: bold;
    font-style: normal;
}
/*---------------------------------*/
img 
{
	border: none 0px;
}
p
{
	margin-top: 0;
}
h3, h4, h5 {
    font-weight: normal;
    line-height: 1.6em;
}
h3 {
    font-size: 11pt;
}
h4 {
    font-size: 11pt;
}
h5 {
    font-size: 10pt;
}
/*---------------------------------*/
.nodisp
{
	display: none;
}
/*---------------------------------*/
.box {
    box-sizing: border-box;
	border-radius: 4px;
	background-color: #fff;
	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2), 1px 1px 1px 0 rgba(0, 0, 0, 0.5);
    /*box-shadow: 0 1px 2px 0 rgba(0,0,0,.1);*/
    border: 1px solid #ebeced !important;
}
/*---------------------------------*/
.title
{
	position: relative;
	text-align: center;
    /*text-shadow: 1px 1px 2px gray;*/
	font-size: 1.8em;
	width: 100%;
}
.content 
{
	display: block;
    box-sizing: border-box;
    text-align: initial !important;
    /* border-top: solid 1px #bcbcbc; */
    /* padding-top: 10px; */
}
.title .slider
{
	position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: 0;
}
.article
{
	box-sizing: border-box;
	padding-right: 15px;
	padding-left: 15px;
}
.article.subtitle
{
	text-align: right;
	font-size: 1.3em;
	font-weight: bold;
}
.article .text
{
	text-align: justify;
	font-size: 1.0em;
	font-weight: normal;
}
.article .text p
{
	margin-top: 0.5em;
    margin-bottom: 0.5em;
}
.article .text .notice
{
	color: #cc0b0b;
}
/*---------------------------------*/
.statuscontainer
{
	position: relative;
    overflow: hidden;
}
.statuslabel
{
	display: block;
	box-sizing: border-box;
	position: absolute;
	left: -25px;
	top: 25px;
	width: 120px;
	height: 20px;
	line-height: 15px;
	transform: rotate(-45deg);
	font-family: Yekan, Tahoma;
	font-size: 15px;
	font-weight: 600;
	color: White;
	box-shadow: 1px 1px 2px #222;
	text-align: center;
}
.statuslabel.new
{
	background-color: #61a564;
}
.statuslabel.new:before
{
	content: "جـدیـد";
}
.statuslabel.haraj
{
	background-color: #5d8eb4;
}
.statuslabel.haraj:before
{
	content: "حـراج";
}
.statuslabel.soon
{
	background-color: #be75c5;
}
.statuslabel.soon:before
{
	content: "بـزودی";
}
.statuslabel.notexist
{
	background-color: #d34354;
	font-size: 15px;
}
.statuslabel.notexist:before
{
	content: "موجود نیست";
}
/*---------------------------------*/
.infotable 
{
	display: flex;
	width: 98%;
	position: relative;
	padding: 5px;
	box-sizing: border-box;
	margin: 3px auto 3px auto;
	background-color: #ffffff;
	flex-direction: column;
	font-family: Yekan, Tahoma;
}
@media screen and (min-width: 1000px) {
	.infotable 
	{
		position: absolute;
		top: 0px;
		right: 0px;
		width: 337px;
	}
}
@media screen and (max-width: 1000px) {
	.infotable 
	{
	}
}
.infotable .column 
{
	display: inline-block;
	overflow: hidden;
	box-sizing: border-box;
	padding: 10px;
	width: 100%;
}
.infotable .item 
{
	display: block;
	justify-content: space-between;
}
.infotable .item .caption 
{
	display: block;
    text-align: right;
    font-size: 11pt;
    font-weight: bold;
    color: #d139d7;
    width: 100%;
}
.infotable .item .value 
{
    box-sizing: border-box;
	display: block;
    width: 100%;
    min-height: 25px;
    background: linear-gradient(to right, #ffffff 15%, #d9d9db 85%);
    margin: 0 auto;
    text-align: right;
    vertical-align: top;
    padding-right: 5px;
    overflow: hidden;
    color: Black;
    font-family: Yekan, Tahoma;
    font-size: 9pt;
    line-height: 25px;
}
.infotable .item .value *
{
	width: 100%;
	font-family: Yekan, Tahoma;
	font-size: 10pt;
	/*margin-top: 8px;*/
}
.infotable .item.boldprice .value > *
{
	font-size: 11pt;
    font-weight: bold;
    color: Black; /*#e6350a;*/
    line-height: 28px;
}
@media screen and (max-width: 1000px) {
	.infotable .item .value *
	{
		display: inline-block;
		font-family: Yekan, Tahoma;
		height: 25px;
		line-height: 25px;
	}
}
.infotable .item .value .notvalid
{
	text-decoration: line-through !important;
	color: #777;
	margin-left: 10px;
}
/*---------------------------------*/
.updateprogress
{
	position: absolute;
	left: 0;
	top: 0;
	width: 600px;
	height: 100%;
	background-color: rgba(85,85,85,0.3);
	z-index: 1000;
}
.updateprogress img
{
	position: relative;
	margin: 150px auto;
	opacity: 0.5;
}
.updateprogress.hide 
{
	display: none;
}
@media screen and (max-width: 1000px) 
{
	.updateprogress
	{
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(85,85,85,0.3);
		z-index: 1000;
	}
	.updateprogress img
	{
		position: relative;
		margin: 0 auto;
	}
}
/*---------------------------------*/
.colorlist
{
	width: 100% !important;
	margin: 1px auto !important;
	min-height: 25px;
}
.colorlist > span
{
	display: inline-block;
	width: 23px !important;
	height: 23px;
	margin: 0 !important;
	margin-top: 1px !important;
}
/*---------------------------------*/
.editpanel
{
	position: relative;
	box-sizing: border-box;
	background-color: White;
	padding: 5px;
	margin: 20px;
}
.editpanel .title
{
	width: 100%;
    text-align: right;
    font-size: 12pt;
    background-color: #662d91;
    color: rgba(255,255,255,0.75);
    font-weight: bold;
    height: 45px;
    line-height: 37px;
    box-sizing: border-box;
    padding-right: 10px;
    margin-bottom: 5px;
    border: double 3px;
    border-radius: 9px;
}
.editpanel .column2, .editpanel .column3
{
	display: inline-block;
	overflow: hidden;
	box-sizing: border-box;
	padding: 5px;
}
.editpanel .column2
{
	width: 50%;
}
.editpanel .column3
{
	width: 32.5%;
}
@media screen and (max-width: 1000px) 
{
	.editpanel .column2, .editpanel .column3
	{
		width: 100%;
	}
}
.editpanel .item
{
	display: flex;
	box-sizing: border-box;
	color: #662D91;
	margin: 4px auto;
	font-weight: bold;
}
.editpanel .caption
{
	display: inline-block;
	text-align: left;
	box-sizing: border-box;
	padding-left: 10px;
	width: 15%;
}
.editpanel .value
{
	display: inline-block;
	text-align: right;
	box-sizing: border-box;
	width: 85%;
}
@media screen and (max-width: 1000px) 
{
	.editpanel .caption
	{
		width: 30%;
	}
	 .editpanel .value
	 {
	 	width: 70%;
	 }
}
.editpanel .column2 .caption, .editpanel .column3 .caption
{
	width: 30%;
}
.editpanel .column2 .value, .editpanel .column3 .value
{
	width: 70%;
}
.editpanel .value *
{
	box-sizing: border-box;
	width: 100%;
	font-family: Yekan, Tahoma;
}
.editpanel .value *[id*=txtEmail] 
{
	direction: ltr;
}
.editpanel .info
{
	box-sizing: border-box;
	text-align: center;
	width: 100%;
}
.editpanel .info *
{
	display: inline-block;
	box-sizing: border-box;
}
.editpanel .submit
{
	text-align: center;
	font: "Yekan,Yekan,Tahoma" bold normal bold 10pt !important;
	/*font-size: 10pt !important;*/
}
.editpanel .progress
{
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 30000;
}
.editpanel .progress img
{
	display: block;
	margin: 15% auto;
}
/*---------------------------------*/
.modal
{
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 200000;
	text-align: center;
}
.modal.tbg:before {
    content: ' ';
    display: inline-block;
    vertical-align: middle;
    height: 100%;
}
.modal.tbg:after 
{
	content: 'x';
    color: White;
    position: absolute;
    right: 10px;
    top: 10px;
    width: 10px;
    height: 12px;
    line-height: 12px;
    font-size: 19px;
    border: solid 1px #fff;
    padding: 1px 5px 5px 5px;
    cursor: pointer;
    box-shadow: 0px 0px 8px white;
}
.modal .fullimage 
{
	display: inline-block;
    vertical-align: middle;
}
.modal .fullimage img
{
	display: block;
	border: 0;
	margin: 0;
}
.modal .circle
{
	border-radius: 50%;
}
.modal .shadow
{
	box-shadow: 
		5px 5px 50px rgba(255, 255, 255, 0.1), 
		-5px 5px 50px rgba(255, 255, 255, 0.1), 
		5px -5px 50px rgba(255, 255, 255, 0.1), 
		-5px 5px 50px rgba(255, 255, 255, 0.1);
}
.dialogbox
{
	position: relative;
	margin: 10% auto;
	box-sizing: border-box;
	background-color: white;
	border: solid 1px #bcbcbc;
	border-radius: 5px;
	box-shadow: 5px 5px 5px #222;
	padding: 5px;
	min-width: 30%;
	max-width: 40%;
	min-height: 40%;
}
@media screen and (max-width: 1000px) 
{
	.dialogbox
	{
		margin: 20% auto;
		min-width: 90%;
		min-height: 50%;
	}
}
.dialogbox .title
{
	position: relative;
	box-sizing: border-box;
	background: linear-gradient(to bottom, White, #dfe1e4);
	color: black;
	border: solid 1px #bcbcbc;
	border-radius: 5px;
	width: 100%;
	padding: 0 10px 0 10px;
    text-align: right;
    font-size: 15pt;
	font-weight: bold;
	height: 36px;
    line-height: 36px;
    cursor: move;
}
.dialogbox .title i 
{
	display: block;
	position: absolute;
	left: 10px;
	top: -1px;
	font: normal normal normal 15pt/36px FontAwesome;
}
.dialogbox .title i:hover
{
	cursor: pointer;
}
.dialogbox .icon
{
	box-sizing: border-box;
}
.dialogbox .icon img
{
	display: block;
	margin: 5px auto;
}
.dialogbox .body
{
	box-sizing: border-box;
	padding: 10px;
	color: black;
	background-color: white;
	width: 100%;
	font-family: Yekan, Tahoma;
	font-size: 11pt;
	font-weight: normal;
	direction: rtl;
	text-align: justify;
}
.dialogbox .body.err
{
	color: Red;
}
.dialogbox .body.ok
{
	color: Green;
}
/*---------------------------------*/
.slider 
{
    box-sizing: border-box;
    position: relative;
}
.slider .caption 
{
	box-sizing: border-box;
	width: 100%;
	text-align: right;
	padding: 5px;
	margin-bottom: 5px;
}
.slider .navigation .navleft, 
.slider .navigation .navright
{
	position: absolute;
    color: #662D91;
    background-color: White;
    z-index: 10000;
    width: 20px;
    height: 20px;
    line-height: 20px;
	bottom: 50%;
	margin-bottom: -10px;
    cursor: pointer;
}
.slider .navigation .navleft:hover, 
.slider .navigation .navright:hover
{
	color: #D139D7;
}
.slider .navigation .navright
{
	right: 0px;
}
.slider .navigation .navleft
{
	left: 0px;
}
.slider .container
{
	box-sizing: border-box;
    position: relative;
    top: 0px;
    right: 0px;
    height: 100%;
    margin-left: 20px;
    margin-right: 20px;
    overflow: hidden;
}
.slider .slides
{
	position: absolute;
    display: block;
    white-space: nowrap;
    box-sizing: border-box;
    top: 0px;
    /*text-align: right;*/
    height: 100%;
    width: 100%;
}
.slider .slides .item
{
	box-sizing: border-box;
    display: inline-flex;
    cursor: pointer;
    vertical-align: top;
    /*text-align: center;*/
}
/*---------------------------------*/
/*			 Above Foter	       */
/*---------------------------------*/
.abovefooter 
{
	box-sizing: border-box;
    display: block;
    width: 100%;
    /*height: 180px;*/
    background-color: #aeaeae; /*#c39ddb;*/
    text-shadow: 1px 1px 2px #000;
    color: #ddd;
    line-height: 1.5em;
}
.abovefooter ul
{
	box-sizing: border-box;
    padding-top: 15px;
    margin: 0;
    text-align: center;
}
.abovefooter ul li
{
	box-sizing: border-box;
    list-style-type: none;
    display: inline-flex;
    width: 144px;
    height: 150px;
    border-radius: 100%;
    background-color: #662d91;
    text-align: center;
    vertical-align: middle;
    padding: 27px;
    padding-top: 37px;
    font-size: 12pt;
    box-shadow: 1px 1px 16px #fff;
    margin-left: 10px;
    margin-bottom: 10px;
    cursor: pointer;
}
.abovefooter ul li a
{
	text-decoration: none;
    color: inherit;
}
.abovefooter ul li:nth-of-type(2n+0):hover
{
	animation: clockwise 0.6s forwards;
}
.abovefooter ul li:nth-of-type(2n+1):hover
{
	animation: counterclockwise 0.6s forwards;
}
@keyframes clockwise {
    0% { transform: rotate(0deg); z-index: 0 }
    50% { transform: rotate(30deg); z-index: 1}
    100% { transform: rotate(0deg); z-index: 0; background-color: #48186d; }
}
@keyframes counterclockwise {
    0% { transform: rotate(0deg); z-index: 0 }
    50% { transform: rotate(-30deg); z-index: 1}
    100% { transform: rotate(0deg); z-index: 0; background-color: #48186d; }
}
/*---------------------------------*/
.stats
{
	text-align: center;
}
.stats p, .stats iframe
{
	display: inline-block;
}
/*---------------------------------*/
.titlebox
{
	width: 100%;
    text-align: right;
    font-size: 12pt;
    background-color: #662d91;
    color: rgba(255,255,255,0.75);
    font-weight: bold;
    height: 45px;
    line-height: 37px;
    box-sizing: border-box;
    padding-right: 10px;
    margin-bottom: 10px;
    border: double 3px;
    border-radius: 9px;
}
.titlebar
{
    box-sizing: border-box;
	width: 100%;
    text-align: right;
    font-size: 13pt;
    color: #662d91;
    font-weight: bold;
    padding-bottom: 5px;
    margin-bottom: 10px;
    border-bottom: solid 1px #eee;
}
/*---------------------------------*/
.pager
{
	margin-top: 10px;
    text-align: left;
    /*margin-left: -20px;*/
}
.pager > span
{
	text-align: center;
}
.pager input[type='submit']
{
	box-sizing: border-box;
	border: solid 1px rgba(56, 7, 94, 0.32);
    background-color: white;
    cursor: pointer;
    font-size: 16px !important;
    line-height: 18px;
    width: 23px;
    height: 22px;
    padding: 0;
}
.pager .pagerNextPrevGroupOrig
{
	border: none 0px !important;
}
.pager .pagerCurrent
{
	box-sizing: border-box;
    display: inline-block;
    border: dotted 1px rgba(56, 7, 94, 0.32);
    background-color: white;
    font-size: 16px !important;
    line-height: 20px;
    width: 23px;
    padding: 0;
}
.pager .pagerNextPrev
{
	text-decoration: none;
    font-size: 10pt;
    margin-left: 15px;
    margin-right: 10px;
    color: #38075e;
    border-bottom: solid 1px rgba(56, 7, 94, 0.32);
}
.pager .pagerNextPrev.aspNetDisabled
{
	display: none
}
/*---------------------------------*/
.artcat
{
	box-sizing: border-box;
    text-align: right;
    padding: 0;
    margin: 0;
    margin-top: 5px;
    margin-bottom: 5px;
    padding-bottom: 10px;
    border-bottom: solid 1px #bcbcbc;
}
.artcat.fix {
	position: fixed;
    top: 92px;
    width: 100%;
    z-index: 1;
    background-color: white;
	padding-top: 15px;
	padding-bottom: 10px;
}
.artcat > .artcattitle
{
	box-sizing: border-box;
    display: inline-block;
    font-size: 10pt;
    font-weight: bold;
    color: #662d91;
}
.artcat > .artcatitem
{
	box-sizing: border-box;
    display: inline-block;
    min-width: 100px;
    padding: 5px;
    padding-left: 7px;
    padding-right: 7px;
    border-radius: 7px;
    font-size: 8pt;
    cursor: pointer;
    margin-left: 5px;
    line-height: 15px;
    height: 27px;
    background-color: #662d91;
    border: solid 1px #bcbcbc;
    color: white;
}
.artcat > .artcatitem:hover
{
	background-color: #d139d7;
}
.artcat > .artcatitem.activeitem
{
	background-color: white;
    border: solid 1px #662d91;
    color: #662d91;
    cursor: default;
}
@media screen and (max-width: 1000px) 
{
	.artcat > .artcatitem
	{
		display: block;
		font-size: 12pt;
		line-height: 28px;
		height: 40px;
		margin-left: 2px;
		margin-bottom: 10px;
		width: 100%;
	}
}
/*---------------------------------*/
#backtotop
{
	position: fixed;
	display: block;
    right: 15px;
    bottom: 15px;
    width: 40px;
    height: 40px;
    z-index: 150000;
    cursor: pointer;
	background: #fff;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
    border: 1px solid #ebeced;
    border-radius: 100%;
}
#backtotop i {
    line-height: 40px;
}
/*---------------------------------*/
.map 
{
	text-align: center;
}
.map iframe
{
	display: inline-block;
}
/*---------------------------------*/
.sectiontitle
{
    width: 100%;
    text-align: right;
    font-size: 12pt;
    background-color: #8c759e;
    color: rgba(255,255,255,0.75);
    font-weight: bold;
    height: 45px;
    line-height: 37px;
    box-sizing: border-box;
    padding-right: 10px;
    margin-bottom: 5px;
    border: double 3px;
    border-radius: 9px;
}
/*---------------------------------*/
.groupsection
{
	position: relative;
	text-align: right;
}
.groupsection #collapse, .groupsection #expand
{
	display: none;
}
.groupsection.closed
{
	display: inline-block;
    height: 40px;
    overflow: hidden;
    text-align: right;
}
@media screen and (max-width: 1000px) 
{
	.groupsection
	{
		text-align: center;
		line-height: 1.5em;
	}
	.groupsection.closed
	{
		display: inline-block;
		height: 80px;
		overflow: hidden;
		text-align: center;
	}
}
.groupsection.open #expand,.groupsection.closed #collapse
{
	display: none;
}
.groupsection.closed #expand,.groupsection.open #collapse
{
	display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    box-sizing: border-box;
    border: solid 1px #bcbcbc;
    padding: 7px 5px 7px 5px;
    cursor: pointer;
}
.groupsection .grouptitle
{
	padding-right: 5px;
	text-align: right;
	font-size: 11pt;
	font-weight: bold;
	display: inline-block;
	vertical-align: middle;
}
.pricelistsection
{
	margin-top: 10px;
}
.pricelistsection .title
{
}
.pricelistsection .sectiontitle
{
	position: relative;
}
.pricelistsection .sectiontitle span
{
}
.pricelistsection .pricelisttitle
{
	border-bottom: solid 2px #bcbcbc;
    padding-bottom: 10px;
    margin-top: 10px;
}
.pricelistsection .pricelisttitle span
{
}
/*---------------------------------*/
.printsection
{
	margin-top: 10px;
    direction: rtl;
    font-family: Yekan;
}
.printsection .printtitle
{
    width: 100%;
    text-align: center;
    font-family: Yekan;
    font-size: 10pt;
    background-color: #f2f2f4;
    color: #000000;
    font-weight: bold;
    line-height: 37px;
    box-sizing: border-box;
    margin-bottom: 5px;
    border: double 3px;
    border-radius: 9px;
}
.printsection .printtitle h2
{
	margin: 0;
}
.printsection .printtitle span
{
}
/*---------------------------------*/
.pricelistsection
{
	margin-top: 10px;
}
.pricelistsection .title
{
}
.pricelistsection .sectiontitle
{
	position: relative;
}
.pricelistsection .sectiontitle span
{
}
.pricelistsection .pricelisttitle
{
	border-bottom: solid 2px #bcbcbc;
    padding-bottom: 10px;
    margin-top: 10px;
}
.pricelistsection .pricelisttitle span
{
}
.pricelistsection .printcontrols
{
	position: absolute;
    left: 150px;
    top: 0px;
    display: inline-block;
    text-align: center;
    box-sizing: border-box;
    padding: 0 10px 0 10px;
    font-size: 11pt;
    font-family: Yekan;
    height: 100%;
}
.pricelistsection .printcontrols .printlink
{
	display: inline-block;
    text-decoration: none;
    color: #d8cae3;
}
.pricelistsection .printcontrols .printlink img
{
	display: inline-block;
    vertical-align: middle;
}
@media screen and (max-width: 1000px) 
{
	.pricelistsection .printcontrols
	{
		left: 50px;
	}
	.pricelistsection .printcontrols .printlink span
	{
		display: none;
	}
	.pricelistsection .printcontrols .printlink img
	{
		display: inline-block;
		vertical-align: middle;
	}
	.sectiontitle .pdf:before
	{
		content: ' ';
		display: inline-block;
		vertical-align: middle;
		height: 100%;
	}
}

/*---------------------------------*/
.grouplist
{
    text-align: center;
    padding: 0;
    margin: 10px 0 0 0;
}
.grouplist li
{
	display: inline-block;
    list-style-type: none;
    box-sizing: border-box;
    padding: 2px 10px 4px 10px;
    margin: 0 0 5px 0;
    font-size: 10pt;
    border: solid 1px #bcbcbc;
    box-shadow: 1px 1px 1px grey;
    line-height: 24px;
    width: 230px;
	overflow: hidden;
}
.grouplist li:hover
{
	background-color: #bcbcbc;
	color: White;
}
.grouplist li a
{
	display: inline-block;
    width: 100%;
    height: 100%;
	text-decoration: none;
    color: black;
    cursor: pointer;
}
.grouplist li a:hover
{
	color: White;
}
/*---------------------------------*/
.pricelist
{
    text-align: center;
    margin: 0 0 0 0;
    padding: 10px 0 0 0;
}
.pricelist li
{
	box-sizing: border-box;
    display: inline-block;
    list-style-type: none;
    font-size: 8pt;
    border: solid 1px #bcbcbc;
    width: 150px;
    height: 170px;
    padding: 5px;
    margin-bottom: 5px;
    vertical-align: top;
}
.pricelist li > a
{
	display: inline-block;
	width: 100px;
	height: 100px;
}
.pricelist li .productimage
{
}
.pricelist li .productinfo
{
}
.pricelist li .productinfo .pname
{
    height: 20px;
    overflow: hidden;
    background-color: #f2f2f4;
}
.pricelist li .productinfo .pcode
{
}
.pricelist li .price
{
}
/*---------------------------------*/
.sectiontitle .pdf
{
    position: absolute;
    left: 0px;
    top: 0;
	box-sizing: border-box;
    display: inline-block;
    padding: 0 10px 0 10px;
    text-align: right;
    font-size: 11pt;
	height: 100%;
}
.sectiontitle .pdf span
{
}
.sectiontitle .pdf input, .sectiontitle .pdf img
{
	vertical-align: middle;
	cursor: pointer;
}
@media screen and (max-width: 1000px) 
{
	.sectiontitle .pdf
	{
		left: 5px;
	}
	.sectiontitle .pdf:before
	{
		content: ' ';
		display: inline-block;
		vertical-align: middle;
		height: 100%;
	}
	.sectiontitle .pdf span
	{
		display: none;
	}
}
/*---------------------------------*/
.albumlist
{
    text-align: center;
    padding: 0;
    margin: 0;
}
.albumlist li
{
	display: inline-block;
    list-style-type: none;
    box-sizing: border-box;
    padding: 2px 10px 4px 10px;
    margin: 0 0 5px 0;
    font-size: 10pt;
    border: solid 1px #bcbcbc;
    box-shadow: 1px 1px 1px grey;
    line-height: 24px;
    width: 160px;
    overflow: hidden;
    height: 190px;
}
.albumlist li:hover
{
	background-color: #bcbcbc;
	color: White;
}
.albumlist li a
{
	position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    color: black;
    cursor: pointer;
    z-index: 2;
}
.albumlist li a:hover
{
	color: White;
}
.albumlist li a > img
{
	position: absolute;
    display: inline-block;
    left: 50%;
    margin-left: -75px;
    bottom: 0;
    z-index: 1;
}
/*---------------------------------*/
.albumimagessection
{
	margin-top: 10px;
}
.albumimagessection .sectiontitle
{
	position: relative;
	text-align: center;
    font-size: 16pt;
}
.albumimagessection .sectiontitle span
{
}
.albumimagessection .albumdesc
{
	border: solid 1px #bcbcbc;
    padding: 10px;
    margin-top: 10px;
    text-align: right;
    font-size: 11pt;
}
.albumimagessection .albumimageslist
{
    text-align: center;
    margin: 0 0 0 0;
    padding: 10px 0 0 0;
}
.albumimagessection .albumimageslist li
{
	box-sizing: border-box;
    display: inline-block;
    list-style-type: none;
    font-size: 8pt;
    border: solid 1px #bcbcbc;
    width: 230px;
    height: 220px;
    padding: 5px;
    margin-bottom: 5px;
    vertical-align: top;
    cursor: pointer;
}
.albumimagessection .albumimageslist li > a
{
	display: inline-block;
    width: 100%;
}
.albumimagessection .albumimageslist li .galleryimagepic
{
}
.albumimagessection .albumimageslist li .albuminfo
{
}
.albumimagessection .albumimageslist li .albuminfo .acomment
{
    height: 20px;
    overflow: hidden;
    background-color: #f2f2f4;
}
/*---------------------------------*/
.toolbar 
{
	box-sizing: border-box;
    border: solid 1px #dedede;
    border-radius: 4px;
    margin: 6px;
    text-align: right;
    padding: 4px;
}
.toolbar .item
{
	box-sizing: border-box;
    border: solid 1px #efecec;
    display: inline-block;
    height: 30px;
    line-height: 25px;
    vertical-align: top;
    margin-left: 2px;
    padding-left: 4px;
    cursor: pointer;
    border-radius: 5px;
}
.toolbar .item.active
{
	background-color: #b084d4;
}
.toolbar .item:before 
{
	content: " ";
    display: inline-block;
    vertical-align: middle;
    height: 100%;
}
.toolbar .item .icon
{
	box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
    width: 24px;
    height: 24px;
    position: relative;
}
.toolbar .item .icon:before 
{
	content: " ";
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}
.toolbar .item .caption
{
	display: inline-block;
    vertical-align: middle;
	font-size: 10pt;
}
.toolbar .item .icon img, .toolbar .item .icon input
{
	display: inline-block;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 24px;
    height: 24px;
}
/*---------------*/
.image-wrapper {
  width: 100%;
  height: 150px;
  position: relative;
  overflow: hidden;
  background: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: center;
}
.image-wrapper img {
  max-width: 100%;
  max-height: 100%;
  display: none; /* تا وقتي کامل لود نشه نمايش داده نشه */
}

.img-spinner, .spinner {
  width: 30px;
  height: 30px;
  border: 3px solid #ccc;
  border-top: 3px solid #3498db;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  position: absolute;
  display: inline-block;
}

@keyframes spin {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.list-loading
{
	display:none;
	text-align:center; 
	margin:20px;
	min-height: 40px;
}
/*---------------*/