/* wall color */
#colortxt {
	padding-right:4px;
	display: none;	/* 2019 */
	}
.background-color-box{	
	position:relative;width:44px;height:18px;display:inline-block;cursor:pointer;color:#333;	/* bottom: height:21px */
	margin:0 -1px !important;padding:1px;text-align:center;border:1px solid transparent;font-weight: 400;font-family: arial,sans-serif;
}
/*.background-color-box-clean {height:21px;width:28px;margin:0 -1px !important;padding:1px 0 0 4px;border:1px solid transparent;font-weight: 400;font-family: arial,sans-serif;}*/
.background-color-box:after{ 
	content:" ";
	display:block;	
	/*top:-1px;*/
	left:-1px;right:-1px;bottom:-1px;
	position:absolute;
	border:1px solid transparent;
	transition:border 600ms;
}
.background-color-box+.background-color-box{ margin-left:0;}
.background-color-box-white{background-color:#fafafa;color:#333;}
.background-color-box-grey{	background-color:#cacad6;}
.background-color-box-black{background-color:#3e3e4c;color:#ccc;padding-left: 4px;}

#btnblack, #btngray, #btnwhite, #btnretina, #prev, #next {transition: all 0.3s ease-in-out;}
#btnblack, #btngray, #btnwhite, #btnretina {margin-right: 0;}
#btnblack, #btngray, #btnwhite, #btnretina {font-size:11px;letter-spacing:0.06em;}
#btnblack::first-letter, #btngray::first-letter, #btnwhite::first-letter {text-decoration: underline;}

@media
/*only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and ( min--moz-device-pixel-ratio: 2),
only screen and ( -o-min-device-pixel-ratio: 2/1),
only screen and ( min-device-pixel-ratio: 2),*/

/*only screen and ( min-resolution: 1.5dppx),
only screen and ( min-resolution: 144dpi)*/
only screen and (-webkit-min-device-pixel-ratio: 1.5),
	only screen and (-o-min-device-pixel-ratio: 15/10),
	only screen and (min-resolution: 1.5dppx)	/* 120dpi cmp. code in photo.js hasretina() */
	{
	#btnretina {display:inline-block;left:4px;/*left:21px; display:none;*/}
	.background-color-box-retina{background-color:transparent;color:#444;width:40px;}
	.background-color-box-retina::after {
		content:"hi-res";color:#000;background: #ccc;
		/*border:1px solid #999;*/
		}
	.background-color-box-retina.lores:after {
		content:"lo-res";color:#000;background: #ccc;
		/*border:1px solid #999;*/
		}	
}

/* hover */
.background-color-box-white:hover, .background-color-box-grey:hover, .background-color-box-black:hover {border:1px solid #d20;}
.background-color-box-retina:hover {cursor:pointer;}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait)  { /* iPad */
	/*.background-color-selector{font-size: 1.1em;}*/
}
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : portrait) {	/* iPhone */
	.background-color-box-frame::before, .background-color-box-frame.framethumb_noframe::before {top:60px;}
	.background-color-box-frame{border:8px ridge rgba(255,255,255,0.9);}
	#btnblack, #btngray, #btnwhite {display:none;}
	/*#btnclean {display:block;}*/
	}
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape) {	/* iPhone */
	.background-color-box+.background-color-box{ margin-left:18px}
}