body{
	font-family: Arial, Sans-serif; 
	font-size:12px;
	background-image: url(http://susen-game.eu/wp-content/uploads/2015/01/background.jpg);
    background-repeat: repeat-x;
    background-attachment: scroll;
    background-position:bottom center;
    background-color: #C4D0D2;
	min-height:800px;
}

#content{
	width:90%;
	margin:20px auto;
	padding:10px;
	background-color:#fff;
}

.box{
	margin:0 auto;
}

.clear{ width:100%; clear:both; }

.spacer{
	float:left;
	width:100%;
	height:30px;
}

.box{
	width:100%;
}
	
.half{
	float:left;
	width:47%;
	height:39px;
	padding:1%;
	margin-top:1px;
	margin-right:1px;
}
.quart{
	float:left;
	width:24%;
	height:39px;
	padding:1%;
	margin-top:1px;
	margin-right:1px;
}
.threequart{
	float:left;
	width:70%;
	height:39px;
	padding:1%;
	margin-top:1px;
	margin-right:1px;
}

.plusminus{
	float:left;
	width:40px;
	height:39px;
	background-color:#df4a12;
	text-align:center;
}

.plusminusb{
	float:right;
	width:40px;
	height:39px;
	background-color:#df4a12;
	text-align:center;
}

.center{
	width:auto;
	margin: 0 auto;
	height:39px;
	text-align:center;
}

.midtxt{text-align:center;}

@media screen and (min-width: 820px){


.label{
		font-size:22px;
}
}




@media screen and (min-width: 600px) and (max-width: 819px){
/*
.spacer{
	float:left;
	width:600px;
	height:30px;
}

.box{
	width:600px;
}
	
.half{
	float:left;
	width:289px;
	height:39px;
	padding:5px;
	margin-top:1px;
	margin-right:1px;
}
.quart{
	float:left;
	width:139px;
	height:39px;
	padding:10px 5px 0 5px;
	margin-top:1px;
	margin-right:1px;
}
.threequart{
	float:left;
	width:439px;
	height:39px;
	padding:5px;
	margin-top:1px;
	margin-right:1px;
}

.plusminus{
	float:left;
	width:40px;
	height:39px;
	background-color:#df4a12;
	text-align:center;
}

.center{
	float:left;
	width:209px;
	height:39px;
	text-align:center;
}

*/
.label{
		font-size:22px;
}

}


@media screen and (max-width: 599px){
	
	/*
.spacer{
	float:left;
	width:320px;
	height:30px;
}

.box{
	width:320px;
}
	
.half{
	float:left;
	width:149px;
	height:29px;
	padding:5px;
	margin-top:1px;
	margin-right:1px;
}
.quart{
	float:left;
	width:69px;
	height:29px;
	padding:10px 5px 0 5px;
	margin-top:1px;
	margin-right:1px;
}
.threequart{
	float:left;
	width:229px;
	height:29px;
	padding:5px;
	margin-top:1px;
	margin-right:1px;
}

.plusminus{
	float:left;
	width:30px;
	height:29px;
	background-color:#df4a12;
	text-align:center;
}

.center{
	float:left;
	width:89px;
	height:29px;
	text-align:center;
}

*/
.label{
		font-size:18px;
}

}


h1{ 
	color:#DF4A12;
	font-family: "Permanent Marker", Arial, sans serif;
	font-size:28px
	}


a{ color:#ffffff;
text-decoration:none; 
}

.label{
	font-family: "Permanent Marker", Arial, sans serif;
	color:#ffffff;
	background-color: #3D62A8; 
}







#energy_board{
	-moz-transition: all 0.5s ease-out; 
	-webkit-transition: all 0.5s ease-out; 
	transition: all 0.5s ease-out;
}

input[type=checkbox] {
	margin:0 auto;
    display: block;
    width: 30px;
    height: 30px;
    -webkit-appearance: none;
    outline: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

input[type=checkbox]:not(:checked) {
    background-image: url(../images/unchecked.png);

	-moz-transition: all 0.25s ease-out; -webkit-transition: all 0.25s ease-out; transition: all 0.25s ease-out;
}

input[type=checkbox]:checked {
    background-image: url(../images/checked.png);

	-moz-transition: all 0.25s ease-out; -webkit-transition: all 0.25s ease-out; transition: all 0.25s ease-out;
	
}

.btn {
  border: none;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  background: #df4912;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
}

.btn:hover {
  background: #3D62A8;
  text-decoration: none;
}