@charset "utf-8";

#amount-gesamt {
	position:absolute;
	border: 0;
	color: #29557c;
	font-weight: 700;
	left: 175px;
	top: -60px;
	font-size: 48px;
	width: 200px;
	text-align: center;
	background-color: transparent;
	font-family: 'Ubuntu', sans-serif;
}
#amount-liter {
	position:absolute;
	border: 0;
	color: #29557c;
	font-weight: 400;
	left: 200px;
	top: -10px;
	font-size: 24px;
	width: 150px;
	text-align: center;
	background-color: transparent;
	font-family: 'Ubuntu', sans-serif;
}
#amount-l, #amount-b, #amount-h {
	border: 0;
	color: #29557c;
	font-weight: bold;
	font-family: 'Ubuntu', sans-serif;
	width: 30px;
	background-color: transparent;
	margin-top: -5px;
	text-align: right;
}

#slider-vertical-l, #slider-vertical-b, #slider-vertical-h {
	height: 12px; width:300px;
}

#menge {
	position:absolute;
	width:416px;
	height:199px;
	background-image:url(../images/bisdreisig.png);
	left: 200px;
	top: 120px;
	background-repeat: no-repeat;
}

/* Slider */

.ui-slider .ui-slider-handle{
    width:50px; 
    height:50px; 
    background:url(../images/slider_grabber.png) no-repeat; overflow: hidden; 
    position:absolute;
    top: -10px;
    border-style:none; 
}

.ui-slider-vertical .ui-state-default { 
    border: none; 
    width: 28px; 
    height: 82px; 
    background: transparent url(../images/shattle.jpg) no-repeat 0 0;
}

.ui-slider-range, .ui-widget-header, .ui-slider-range-min {
    background: none;
}
#slider-vertical-l, #slider-vertical-b, #slider-vertical-h, .ui-slider {
	border: none;
	width: 250px;
	height: 30px;
	position:relative;
}
#inner_sandkastenrechner {
	width: 622px;
	background-image: url(../images/background.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	position: relative;
	height: 417px;
	float: right;
	margin-bottom: 50px;
	margin-left: 25px;
	margin-right: 80px;
}
#inner_sandkastenrechner #slider-vertical-l {
	position: absolute;
	left: 310px;
	top: 320px;
}
#inner_sandkastenrechner #slider-vertical-b {
	position: absolute;
	left: 310px;
	top: 355px;
}
#inner_sandkastenrechner #slider-vertical-h {
	position: absolute;
	left: 310px;
	top: 385px;
}
#inner_sandkastenrechner #infobox {
	position: absolute;
	width: 315px;
	-moz-border-radius: 16px;
	-webkit-border-radius: 16px;
	border-radius: 16px;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#e5eff7', endColorstr = '#f2fbff');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr = '#e5eff7', endColorstr = '#f2fbff')";
	background-image: -moz-linear-gradient(top, #e5eff7, #f2fbff);
	background-image: -ms-linear-gradient(top, #e5eff7, #f2fbff);
	background-image: -o-linear-gradient(top, #e5eff7, #f2fbff);
	background-image: -webkit-gradient(linear, center top, center bottom, from(#e5eff7), to(#f2fbff));
	background-image: -webkit-linear-gradient(top, #e5eff7, #f2fbff);
	background-image: linear-gradient(top, #e5eff7, #f2fbff);
	-moz-background-clip: padding;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	left: 10px;
	top: 50px;
	padding: 10px;
	border: 1px solid white;
	color: #29557c;
	z-index:500;
}
#inner_sandkastenrechner #infobox h2 {
	font-family: 'Ubuntu', sans-serif;
	font-size: 24px;
	font-weight: 400;
	margin-bottom: 10px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
	color: #29557c;
}
#inner_sandkastenrechner #infobox p {
	line-height: 16px;
	margin-bottom: 10px;
}
#inner_sandkastenrechner #infobox .border-top {
	padding-top: 10px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #FFFFFF;
}
#inner_sandkastenrechner a:hover {
	text-decoration: none;
}
#inner_sandkastenrechner a.ui-slider-handle:hover {
	text-decoration: none;
}
#infobox .userinfo {
	display: none;
	background-color:#FF9F9F;
	position: absolute;
	height: 119px;
	left: 3px;
	top: 56px;
	width: 297px;
	font-weight: bold;
	color: #333333;
	z-index:500;
	border: 1px dotted #FF0000;
	-moz-border-radius: 16px;
	-webkit-border-radius: 16px;
	border-radius: 16px;
	padding: 15px;
	background-image: url(../images/info_pfeile.jpg);
	background-repeat: no-repeat;
	background-position: right;
}
#infobox .userinfo h3 {
	color: #333333;
	font-size: 16px;
}
#infobox .userinfo p {
	font-size: 12px;
	font-weight: normal;
}