/* --- CSS PT. CALCULATOR DURATA BATERIE --- */
.hide {
	width: 0px;
	height: 0px;
	overflow: hidden;
}
.ui-slider-handle:hover {
	cursor:pointer !important;
}
.second_opt {
	float:left;
	padding:5px;
	margin-top:3px;
	position:relative;
}
.second_opt:hover h2 {

}
.second_opt h2 {
	font-size:14px !important;
	text-transform:uppercase;
}
.second_opt ul {
	width: 100%;
	text-align: center;
	
}
.second_opt li {
	background: url("/media/calculator_baterie/assets/checkmark_unchecked.png") 5px 13px no-repeat;
	padding: 1px !important;
	padding-left: 4px !important;
	padding-right: 4px !important;
	list-style: none !important;
	text-align: left !important;
	padding-left:27px !important;
	margin: 2px !important;
	border-bottom:1px solid #888 !important;
	font-size: 13px !important;
	font-weight: bold !important;
	height:40px !important;
	padding-top:15px !important;
	/*padding-bottom:15px !important;*/
	font: 11px/1.55 "Trebuchet MS",arial,helvetica,sans-serif !important;
	color: #3D3D3D !important;
}


.second_opt li:hover {
	cursor: pointer;
		color:#12bd88;
}

.second_opt li p {
	margin:0px !important;
}

label {
	cursor: pointer;
}

.clear {
	clear: both;
}

.second_opt li.active {
	background: url("/media/calculator_baterie/assets/checkmark_checked.png") 5px 13px no-repeat;	
}

.extern li.active {
	background: url("/media/calculator_baterie/assets/checkmark_plus.png") 5px 13px no-repeat !important;
}
	
.leftSide {
	width: 100%;
	min-width:980px !important;
	height: 510px;
	float: left;
	padding-top:5px;
	padding-left: 15px;
	padding-right: 5px;
	background-color: #fff;
	margin-bottom:10px;
}
.rightSide {
	margin-left: -3px;
	padding-left: 15px;
	width: 962px;
	height: 1200px;
	background-color: #fff;
	float: left;"
	-moz-box-shadow: 1px 1px 1px #888;
	-webkit-box-shadow: 1px 1px 1px #888;
	box-shadow: 1px 1px 1px #888;
	border-top-right-radius: 25px 25px;
	border-bottom-right-radius: 25px 25px;
	border-top-left-radius: 25px 25px;
	border-bottom-left-radius: 25px 25px;
	border-top:1px solid #888;
	border-left:1px solid #888;
}
.battery_holder {
	position: absolute;
	/*top :290px;*/
	padding-top: 10px;
	width: 295px;
	height: 115px;
	text-align: center;
	z-index:106;
	float:left;
	display:block;
}
.explicatii_holder {
	position: relative;
	float:left;
	top :505px;
	height: 235px;
	width: 355px;
	margin-bottom: 5px;
	margin-top: 5px;
	-moz-box-shadow: 1px 1px 2px #888;
	-webkit-box-shadow: 1px 1px 2px #888;
	box-shadow: 1px 1px 2px #888;
	border-radius: 25px 25px;
	text-align: left;
	padding-left: 15px;
	padding-right: 5px;
	padding-top: 10px;
	border:1px solid #888;
}
.explicatii_holder h1 {
	font-weight: bold;
}
.battery {
	height: 130px;
}
.icon_holder {
float:left;
	height: 300px;
	position:relative;
	top: 0px;
	left: 0px;
	width: 330px;
	margin-bottom: 5px;
	z-index:104;
	text-align: left;
	padding-right: 5px;
	background: url('/media/calculator_baterie/assets/laptop.jpg');
	background-position:center;
	background-repeat:no-repeat;
	display:block;

}
.osIcon_holder {
position:absolute; 
left:52px;
top:52px;
z-index:103;
display:block;
}
.app_holder {
position:absolute; 
left:52px;
top:52px;
z-index:104;
display:block;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);
opacity:.5;
}
.luminosity_holder {
position:absolute; 
left:85px;
top:37px;
z-index:103;
display:block;
width:361px;
height:205px;
background-color:#000;
display:none;
}

.std {
    overflow: visible;
}

.stick_holder {
position:absolute; 
left:745px;
top:145px;
z-index:104;
display:none;
}
.hddext_holder {
position:absolute; 
left:678px;
top:145px;
z-index:104;
display:none;
}
.mouse_holder {
position:absolute; 
left:595px;
top:145px;
z-index:104;
display:none;
}

.bluetooth_holder {
position:absolute; 
left:553px;
top:145px;
z-index:104;
display:none;
}
.wireless_holder {
position:absolute; 
left:505px;
top:145px;
z-index:104;
display:none;
}
.cd_holder {
position:absolute; 
left:505px;
top:195px;
z-index:104;
display:none;
}
.webc_holder {
position:absolute; 
left:552px;
top:195px;
z-index:104;
display:none;
}
.tel_holder {
position:absolute; 
left:625px;
top:195px;
z-index:104;
display:none;
}
.card_holder {
position:absolute; 
left:675px;
top:195px;
z-index:104;
display:none;
}
.screenW_holder {
position:absolute; 
left:248px;
top:49px;
z-index:107;
display:block;
	
}
.head_spot {

}
.left_spot {
width:30%;
min-width:350px;

float:left;
position:relative;

}
.right_spot {
width:70%;
min-width:600px;

float:right;
margin-left:-20px;
position:relative;
}
.bottom_spot {
width:830px;
float:left;
position:relative;
}

.custom-slider .ui-slider-handle {
background: url('/media/calculator_baterie/assets/slider_knob.png') !important;
background-position:center;
width:20px !important;
height:20px !important;
border:none !important;
border-radius:100px !important;
margin-top:-4px;
}

.custom-slider .ui-slider {
	height:3px !important;
	border:none !important;
	background: #12bd88 !important;
}
.custom-slider .ui-slider-range {
	background: #aaa !important;
}
.breadcrumbs {
	display:none;
}
.exp_ {
width:300px;
height:110px;
padding:10px;
border-top:1px solid #ccc;
border-left:1px solid #dedede;
border-right:1px solid #dedede;
border-bottom:1px solid #dedede;
box-shadow:0px 3px 3px #ccc;
position:absolute;
display:none;	
vertical-align:middle;
background-color: #fff;
top:-90px;
margin-left:125px;
z-index:9999 !important;
font: 11px/1.55 "Trebuchet MS",arial,helvetica,sans-serif !important;
color: #3D3D3D !important;

}
.exp_ .active{
	background-color: #fff;
	display:block;
	z-index:9999;
	
}

@media only screen and (min-width: 1200px) {
	.right_spot {
		padding-left:150px;
	}
}
@media only screen and (max-width: 1199px) {
	.right_spot {
		width:65%;
	}
}

@media only screen and (max-width: 980px) {
	#exp_1 {
		margin-left:-300px !important;
	}
	#exp_5 {
		margin-left:-300px !important;
	}
	.right_spot {
		width:50%;
		min-width:50%;
	}
	#right_1 {
		position:relative;
		
	}
	#right_2 {
		position:relative;	
		margin-bottom:20px;	
		height:auto !important;
	}
	#right_3 {
		float:none !important;
		position:relative;
		margin-top:15px;
		clear:left;
	}
	#right_4 {
		float:none !important;
		position:relative;
		clear:left;
		top:-150px;
		left:-380px;
	}
	.leftSide {
		height:700px !important;
		min-width:100% !important;
	}
}

@media only screen and (max-width: 740px) { 
	#exp_1 {
		margin-left:0px !important;
		top:20px !important;
	}
	#exp_5 {
		margin-left:-150px !important;
		top:20px !important;
	}
	#exp_6 {
		margin-left:0px !important;
		top:20px !important;
	}
	#exp_7 {
		margin-left:-150px !important;
		top:20px !important;
	}
	#exp_celule, #exp_vechime, #exp_luminosity {
		top:20px !important;
		right:20px !important;
	}
	#exp_dimensiune {
		top:325px !important;
		right:10px !important;	
	}
	.leftSide {
		height:100% !important;
	}
	.right_spot {
		margin-top:20px;
		width:100%;
		float:left;
		clear:left;
	}
	#right_4 {
		float:left;
		position:relative;
		clear:left;
		top:0px;
		left:0px;
		margin-left:10px !important;
	}
	}
@media only screen and (max-width: 440px) { 
	.left_spot {
		min-width:95%;
		width:95%;
	}	
	#right_4 {
		width:97% !important;
	}
	.right_spot {
		min-width:302px;
	}
	.icon_holder{
		width:100%;
	}
	.osIcon_holder, .app_holder{
			margin-left: -115px;
			left:50%;
		}
		
		#qmark {
			/*display:none;*/
		}
}
@media only screen and (max-width: 355px) {
	#qmark {
			display:none;
		}
}
@media only screen and (max-width: 340px) { 
		.custom-slider {
			width:250px !important;
		}
		.screenW_holder {
			/*right:13% !important;*/
			left:220px !important;
		}
		
}