@charset "UTF-8";
/* CSS MG art Dia Show 2018 Fine art International - Masterworks Masoud Ghafouri */

.jssorb-art {
                position: absolute;
            }
            .jssorb-art div, .jssorb-art div:hover, .jssorb-art .av {
                position: absolute;
                /* size of bullet elment */
                width: 21px;
                height: 21px;
                background: url(../img/b13.png) no-repeat;
                overflow: hidden;
                cursor: pointer;
            }
            .jssorb-art div { background-position: -5px -5px; }
            .jssorb-art div:hover, .jssorb-art .av:hover { background-position: -35px -5px; }
            .jssorb-art .av { background-position: -65px -5px; }
            .jssorb-art .dn, .jssorb-art .dn:hover { background-position: -95px -5px; }
#slider1_container {
	--webkit-box-shadow: 0px 0px 10px 2px #333333;
	-moz-box-shadow: 0px 0px 10px 2px #333333;
	box-shadow: 0px 0px 30px 2px #333333;
	-webkit-box-shadow: 0px 0px 5px 2px #111111;
	-moz-box-shadow: 0px 0px 30px 2px #111111;
	box-shadow: 0px 0px 10px 2px #111111;
	
	-webkit-box-shadow: 0px 0px 10px 2px #333333;
	-moz-box-shadow: 0px 0px 10px 2px #333333;
	box-shadow: 0px 0px 30px 2px #333333;
	-webkit-box-shadow: 0px 0px 5px 2px #111111;
	-moz-box-shadow: 0px 0px 30px 2px #111111;
	box-shadow: 0px 0px 10px 2px #111111;
	border: 6px solid #5a4938;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	vertical-align: middle; 
}
@media (min-width: 991px) and (max-width: 1199px) {
.jssorb-art {
	clear: both;
	float: none;
	width: 100.00%;
	height: 100.00%;
	max-height:100%;
	padding-left:auto;
	padding-right: auto;
	display: block;
	left:50px;
	top:10px;
}

}
@media (min-width: 767px) and (max-width: 990px) {
.jssorb-art{
	clear: both;
	float: none;
	width: 100.00%;
	height: 100.00%;
	max-height:100%;
	padding-left:auto;
	padding-right: auto;
	display: block;
	left:50px;
	top:10px;
}	
}
@media (min-width: 600px) and (max-width: 766px) {
.jssorb-art{
	clear: both;
	float: none;
	width: 100.00%;
	height: 100.00%;
	max-height:100%;
	padding-left:auto;
	padding-right: auto;
	display: block;
	left:0px;
	top:0px;
}
}	 
@media (min-width: 480px) and (max-width: 599px) {
.jssorb-art{
	clear: both;
	float: none;
	margin-left: auto;
	margin-right:auto;
	width: 100.00%;
	height: 100.00%;
	padding-left:0.00%;
	padding-right:0.00%;
	display: block;
	top:-20px;
	left:0px;
	}
}
@media (min-width: 320px) and (max-width: 479px) {
.jssorb-art{
	float: none;
	margin-left: auto;
	margin-right:auto;
	width: 100.00%;
	height: 100.00%;
	.brick img{
	width:100%;height:auto;
	padding-left:0.00%;
	padding-right:0.00%;
	display: block;
	top:-60px;
	padding-bottom:190px;
	}	
}	 


/* ========= */


@media screen and (max-width:767px ){
.jssorb-art{
	clear: both;
	float: none;
	width: 100.00%;
	height: 100.00%;
	max-height:100%;
	padding-left:auto;
	padding-right: auto;
	display: block;
	left:50px;
	top:-20px;
}
}	 
@media screen and (max-width: 600px) {
.jssorb-art{
	clear: both;
	float: left;
	margin-left: 0;
	width: 100.00%;
	height: 100%;
	padding-left:0.00%;
	padding-right:0.00%;
	display: block;
	top:50px;
	left:-20px;
}

	
	}	 