/* for tablets  */
@media only screen and (min-width: 600px) {
.refrenAkram {
	width: 80%;
}
.refrenFateme {
	width: 120%;
}
.refrenKhalili {
	width: 60%;
}
}
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (max-width: 768px) {
.marge{
    margin-top: 15px;
}
.refrenH {
	margin-left: 80px;
}
.refrenI {
	width: 100%;
}
.refrenTehran {
	width: 200%;
}
.refrenEsfehan {
	width: 200%;
}
.refrenAkram {
	width: 100%;
}
.refrenFateme {
	width: 100%;
}
.refrenKhalili {
	width: 50%;
}
}
/* for desktop  */
@media all and (min-width: 1100px) and (max-width:1405px) {
.refrenAkram {
	width: 30%;
}
.refrenFateme {
	width: 30%;
}
.refrenKhalili {
	width: 30%;
}	
}
/* sm610  */
.m1{
    display: none;
    background-color: #44cc2941;
    cursor: pointer;
    padding: 85px 20px;
}


.hover1  img {
	-webkit-filter: grayscale(0) blur(0);
	filter: grayscale(0) blur(0);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.hover1:hover img {
	-webkit-filter: grayscale(100%) blur(3px);
	filter: grayscale(100%) blur(3px);
}
/* sm620  */
.m2{
    display: none;
    background-color: #44cc2941;
    cursor: pointer;
    padding: 110px 20px;
}
.pad2 {
	padding: 70px 20px !important;
}

.hover2  img {
	-webkit-filter: grayscale(0) blur(0);
	filter: grayscale(0) blur(0);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.hover2:hover img {
	-webkit-filter: grayscale(100%) blur(3px);
	filter: grayscale(100%) blur(3px);
}

/* Loupes  */
/* Loupe 3  */
.m3{
    display: none;
    background-color: #44cc2941;
    cursor: pointer;
    padding: 110px 20px;
}

.pad3 {
	padding: 70px 20px;
}

.hover3  img {
	-webkit-filter: grayscale(0) blur(0);
	filter: grayscale(0) blur(0);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.hover3:hover img {
	-webkit-filter: grayscale(100%) blur(3px);
	filter: grayscale(100%) blur(3px);
}
/* Loupe 4  */
.m4{
    display: none;
    background-color: #44cc2941;
    cursor: pointer;
    padding: 110px 20px;
}

.hover4  img {
	-webkit-filter: grayscale(0) blur(0);
	filter: grayscale(0) blur(0);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.hover4:hover img {
	-webkit-filter: grayscale(100%) blur(3px);
	filter: grayscale(100%) blur(3px);
}
/* Loupe 5  */
.m5{
    display: none;
    background-color: #44cc2941;
    cursor: pointer;
    padding: 110px 20px;
}

.hover5  img {
	-webkit-filter: grayscale(0) blur(0);
	filter: grayscale(0) blur(0);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.hover5:hover img {
	-webkit-filter: grayscale(100%) blur(3px);
	filter: grayscale(100%) blur(3px);
}
/* Clip type */
.m6{
    display: none;
    background-color: #44cc2941;
    cursor: pointer;
    padding: 110px 20px;
}

.hover6  img {
	-webkit-filter: grayscale(0) blur(0);
	filter: grayscale(0) blur(0);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.hover6:hover img {
	-webkit-filter: grayscale(100%) blur(3px);
	filter: grayscale(100%) blur(3px);
}
/* buttons  */
.buttHover:hover {
	opacity: 0.5;
}

.disp {
	display: block !important;
}
.stuff {
	display: none;
	margin-top: 15px;
	padding: 10px;
	border: solid 1px #43CC29;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
	background-color: #44cc2929;
	box-shadow: 2px 0 4px 2px rgba(0,0,0,.2);
}
.stuffRef {
	display: none;
	margin-top: 15px;
	padding: 10px;
	border: solid 1px #43CC29;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
	background-color: #44cc2929;
	box-shadow: 2px 0 4px 2px rgba(0,0,0,.2);
}
.dispRef {
	display: block !important;
}
.colorBlack {
	cursor: pointer;
	margin-bottom: 15px;
	width: 15px;
	height: 15px;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
	background-color: black;
}
.colorYes {
	margin-left: 15px;
	width: 15px;
	height: 15px;
	background-color: black;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
}
.colorNo {
	margin-left: 15px;
	width: 15px;
	height: 15px;
	background-color: white;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
}
.colorWhite {
	cursor: pointer;
	margin-bottom: 15px;
	width: 15px;
	height: 15px;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
	background-color: white;
}
.colorSilver {
	cursor: pointer;
	margin-bottom: 15px;
	width: 15px;
	height: 15px;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
	background-color: silver;
}
.balance {
	margin: auto;
	width: 110%;
}