/* ---- START GENERAL ---- */
body{
	background-color: #181818;
	padding-bottom: 2em;
	font-size: 100%;
	font-family: Verdana, Arial, Sans-Serif;
	line-height: 1.125em;
}
img{
	max-width: 100%;
	display: block;
}

p,td{
	font-size: 0.75em;
}

h1,h2{
	font-size: 0.875em;
}

h1{
	background-color: #0033CC;
	color: white;
	text-align:center;
	font-style: italic;
	text-transform: uppercase;
	padding: 0.5em;
}

h2{
	background-color: #FFCB18;
	cursor:pointer;
	padding: 0.5em;
}

.dpd{
	background-color: #e3002a;
	color: #ffffff;
}

.logo-dpd{
	background-color: #FFFFFF;
	width: 100%;
}

.logo-dpd img{
	margin: 0 auto;
	width: 20%;
}

.btn-phone{
	width: 100%;
	margin: 0 auto;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
	text-decoration: none;
	font-weight: bold;
	display:block;
	text-align:center;
	color: #ffcb18;
}

.kuehlhaus_temp{
	width: 100%;
	margin: 0 auto;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
	color: #ffffff;
	text-decoration: none;
	display:block;
	text-align:center;
}

.bg-yellow{
	background-color: #ffcb18;
}

.no-display{
	display: none;
}
/* ---- END GENERAL ---- */

#wrapper-container{
	position: relative;
	width: 100%;
}


/* ---- START HEADER ---- */
#container-header{
	width: 96%;
	background-color: #ffcb18;
	padding: 2%;
}

#logo{
	width: 30%;
	margin: 0 auto;
	display: block;
}
/* ---- END HEADER ---- */




/* ---- START BACKGROUND IMAGE ---- */
#container-image{
	width: 100%;
	display:block;
	background-color: #000000;
	background-repeat: no-repeat;
	background-size: 100% auto;
}
/* ---- END BACKGROUND IMAGE ---- */




/* ---- START RESPONSIVE BACKGROUND IMAGE ---- */

@media all and (min-width:100px) and (max-width:320px){
	#container-image.webp{
		background-image:url(../img/bg/soestentank_320.webp);
	}
	#container-image.no-webp{
		background-image:url(../img/bg/soestentank_320.jpg);
	}
}
@media all and (min-width:321px) and (max-width:480px){
	#container-image.webp{
		background-image:url(../img/bg/soestentank_480.webp);
	}
	#container-image.no-webp{
		background-image:url(../img/bg/soestentank_480.jpg);
	}
}
@media all and (min-width:481px) and (max-width:640px){
	#container-image.webp{
		background-image:url(../img/bg/soestentank_640.webp);
	}
	#container-image.no-webp{
		background-image:url(../img/bg/soestentank_640.jpg);
	}
}
@media all and (min-width:641px) and (max-width:720px){
	#container-image.webp{
		background-image:url(../img/bg/soestentank_720.webp);
	}
	#container-image.no-webp{
		background-image:url(../img/bg/soestentank_720.jpg);
	}
}
@media all and (min-width:721px) and (max-width:800px){
	#container-image.webp{
		background-image:url(../img/bg/soestentank_800.webp);
	}
	#container-image.no-webp{
		background-image:url(../img/bg/soestentank_800.jpg);
	}
}
@media all and (min-width:801px) and (max-width:920px){
	#container-image.webp{
		background-image:url(../img/bg/soestentank_920.webp);
	}
	#container-image.no-webp{
		background-image:url(../img/bg/soestentank_920.jpg);
	}
}
@media all and (min-width:921px) and (max-width:1024px){
	#container-image.webp{
		background-image:url(../img/bg/soestentank_1024.webp);
	}
	#container-image.no-webp{
		background-image:url(../img/bg/soestentank_1024.jpg);
	}
}
@media all and (min-width:1025px) and (max-width:1200px){
	#container-image.webp{
		background-image:url(../img/bg/soestentank_1200.webp);
	}
	#container-image.no-webp{
		background-image:url(../img/bg/soestentank_1200.jpg);
	}
}
@media all and (min-width:1201px) and (max-width:1400px){
	#container-image.webp{
		background-image:url(../img/bg/soestentank_1400.webp);
	}
	#container-image.no-webp{
		background-image:url(../img/bg/soestentank_1400.jpg);
	}
}
@media all and (min-width:1401px) {
	#container-image.webp{
		background-image:url(../img/bg/soestentank_1600.webp);
	}
	#container-image.no-webp{
		background-image:url(../img/bg/soestentank_1600.jpg);
	}
}
/* ---- END RESPONSIVE BACKGROUND IMAGE ---- */



table td {
  display: table-cell;
  vertical-align: top;
}


/* START DETAILS TABLE */
.table-details{
	border-collapse: collapse;
	width: 100%;
}

.table-details,.table-details th, .table-details td{
	border: thin solid black;
	background-color: #fff;
}

td, th{
	text-align:left;
	vertical-align: middle;
	padding: 1%;
}


.table-details tr th{
	font-weight: bold;
}
.table-details tr{
	width: 100%;
}

.table-details tbody tr:nth-child(even) td {
    background-color: #f2f2f2;
}

.table-details tbody tr td{
	word-wrap: break-word;
}
/* END DETAILS TABLE */


/* START PREPAID */
.sprite{
	height: 100px;
	width: 100px;
	border: 2px #000000 solid;
	float: left;
	margin: 10px;
	background-image: url(../img/Sprite.png);
	background-color: #ffffff;
}
.bg-1{
	background-position: 0px 0px;
}

.bg-2{

	background-position: -100px 0px;

}

.bg-3{

	background-position: -200px 0px;
}
.bg-4{

	background-position: -300px 0px;
}
.bg-5{

	background-position: -400px 0px;
}
.bg-6{

	background-position: -500px 0px;
}
.bg-7{

	background-position: -600px 0px;
}
.bg-8{

	background-position: -700px 0px;
}
.bg-9{

	background-position: -800px 0px;
}

.bg-10{

	background-position: -900px 0px;
}

.bg-11{

	background-position: -1000px 0px;
}
.bg-12{

	background-position: -1100px 0px;
}
.bg-13{

	background-position: -1200px 0px;
}
.bg-14{

	background-position: -1300px 0px;
}
.bg-15{

	background-position: -1400px 0px;
}
