#sun {display: none; width: 70em; margin: 0 auto; height: 0; margin-bottom: 0; text-align: right;}
#illus .image {height: auto;}
body {background-color: #acd5ea;
	background-image: -webkit-gradient(linear, left top, right bottom, from(rgb(38, 118, 160)), to(rgb(179, 218, 238)));
	background-image: -webkit-linear-gradient(left top, rgb(38, 118, 160), rgb(179, 218, 238));
	background-image: -moz-linear-gradient(left top, rgb(38, 118, 160), rgb(179, 218, 238));
	background-image: -o-linear-gradient(left top, rgb(38, 118, 160), rgb(179, 218, 238));
	background-image: -ms-linear-gradient(left top, rgb(38, 118, 160), rgb(179, 218, 238));
	background-image: linear-gradient(left top, rgb(38, 118, 160), rgb(179, 218, 238));
}


@media only screen and (min-width: 768px) {
	body, html {  background: #acd5ea url(../img/bg.png) no-repeat center bottom fixed; 
	  -webkit-background-size: 100% auto;
	  -moz-background-size: 100% auto;
	  -o-background-size: 100% auto;
	  background-size: 100% auto;
	
	background-image: url(../img/bg.png), -webkit-gradient(linear, left top, right bottom, from(rgb(38, 118, 160)), to(rgb(179, 218, 238)));
	background-image: url(../img/bg.png), -webkit-linear-gradient(left top, rgb(38, 118, 160), rgb(179, 218, 238));
	background-image: url(../img/bg.png), -moz-linear-gradient(left top, rgb(38, 118, 160), rgb(179, 218, 238));
	background-image: url(../img/bg.png), -o-linear-gradient(left top, rgb(38, 118, 160), rgb(179, 218, 238));
	background-image: url(../img/bg.png), -ms-linear-gradient(left top, rgb(38, 118, 160), rgb(179, 218, 238));
	background-image: url(../img/bg.png), linear-gradient(left top, rgb(38, 118, 160), rgb(179, 218, 238));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#2676a0', EndColorStr='#b3daee');
	}

	
	
	/*background-color: #8d989f;*/
	background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(27, 49, 63, 0.00)), to(rgba(255, 255, 255, 1.00)));
	background-image: -webkit-radial-gradient(50% 50%, rgba(255, 255, 255, 1.00), rgba(27, 49, 63, 0.00));
	background-image: -moz-radial-gradient(50% 50%, rgba(255, 255, 255, 1.00), rgba(27, 49, 63, 0.00));
	background-image: -o-radial-gradient(50% 50%, rgba(255, 255, 255, 1.00), rgba(27, 49, 63, 0.00));
	background-image: -ms-radial-gradient(50% 50%, rgba(255, 255, 255, 1.00), rgba(27, 49, 63, 0.00));
	background-image: radial-gradient(50% 50%, rgba(255, 255, 255, 1.00), rgba(27, 49, 63, 0.00));
	
		
	#sun {display: none; height: 250px; margin-bottom: -250px;}
	#sun img {position: relative; top: -50px;}
	
	#illus .image {height: 167px; overflow: hidden; margin-top: 7px; margin-bottom: 7px;}
}

hr {border-top: 7px solid #7bb20d; margin: 10px 0;}
hr.small {border-top: 1px solid #abe874;}
#frm-customercenter label {display: none;}

.bgwidth { width: 100%; }
.bgheight { height: 100%; }


#topnav ul, #topnav li {list-style: none; margin: 0; padding: 0;}
#topnav li {display: inline-block; list-style: none;}
#topnav li a {color: #acd5ea; padding: 0 10px; border-left: 1px solid #acd5ea;}
#topnav li:first-child a {border: none; padding-left: 0px; margin-left: -10px}

#sitename {
background-color: #30566f;
background-image: -webkit-gradient(radial, 100% 0%,0,100% 0%,200, from(rgb(27, 49, 63)), to(rgb(69, 124, 160)));
background-image: -webkit-radial-gradient(100% 0%, rgb(69, 124, 160), rgb(27, 49, 63));
background-image: -moz-radial-gradient(100% 0%, rgb(69, 124, 160), rgb(27, 49, 63));
background-image: -o-radial-gradient(100% 0%, rgb(69, 124, 160), rgb(27, 49, 63));
background-image: -ms-radial-gradient(100% 0%, rgb(69, 124, 160), rgb(27, 49, 63));
/*background-image: radial-gradient(100% 0%, rgb(69, 124, 160), rgb(27, 49, 63));	*/
cursor: pointer;
}

#sitename h2 {float: right; margin: .5em 0 0 0; padding: 0; font-size: 1.3em; line-height: 1em; font-weight: normal; color: #fff; text-shadow: 0 -1px 2px #333, 1px 0 2px #333, 0 1px 2px #333, -1px 0 2px #333;}

#sitename p {float: right; color: #acd5ea; padding: 0; font-size: .8em;}
@media only screen and (min-width: 768px) {
	#sitename h2 {float: right; margin: .5em; padding: 0; font-size: 2em; line-height: 1em; font-weight: normal; color: #fff; text-shadow: 0 -1px 2px #333, 1px 0 2px #333, 0 1px 2px #333, -1px 0 2px #333;}
	#sitename {min-height: 50px;}
	#sitename p {float: right; color: #acd5ea; padding: 0; margin: 1.5em 0 0; font-size: 1em;}
}

#mainnav {padding: 0; list-style: none; z-index: 9999;}
#mainnav li {width: 33%; position: relative; float: left; display: inline-block; background-color: #d9e7ef; margin: 0 0 0 .5%; padding: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;	
}
#mainnav li a {text-align: center; display: block; padding: 10px 0; margin-bottom: 6px solid #7bb20d; color: #30566f; font-size: .9em; line-height: .9em; height: 4em; overflow: hidden;}
@media only screen and (min-width: 768px) {
	#mainnav li a {height: auto; overflow: show;}
}
#mainnav li a:hover {font-weight: bold;}
#mainnav li a span.green {color: #507e00;}
#mainnav li.selected a {border-bottom: 6px solid #7bb20d; margin-bottom: 0; font-weight: bold;}
#mainnav li:first-child {margin: 0; width: 33%;}

#nav1 {background-image: url(../img/bg_energie_aus_sonne.jpg);}
#nav2 {background-image: url(../img/bg_produkte_und_infos.jpg);}
#nav3 {background-image: url(../img/bg_installationen_und_referenzen.jpg);}
#nav4 {background-image: url(../img/bg_ueberwachung_und_video.jpg);}

#illus div {width: 24.5%; position: relative; float: left; display: inline-block; margin: 0 0 0 .5%; padding: 0;}
#illus div:first-child {margin-left: 0; width: 25%;}
#illus .image img { opacity: .8;}

#illubtns {margin-bottom: 350px;}
#illubtns div {cursor: pointer; padding: 2px 0; line-height: 1.3em;}
#illubtns div a { margin-left: 1.7em; display: block; padding: 2px 4px;}
#illubtns div:hover {background-image: url(/img/pfeil_gruen.png); background-repeat: no-repeat; background-position: center left;}
#illubtns div:hover a {background-color: #acd5ea;}
#refimgs div {display: none;}

#content {border-top: 7px solid #7bb20d; border-bottom: 20px solid #a8b3b9; background-color: #d8e6ed; padding-top: 20px;}
#content h3 {color: #30566f; font-size: 1.2em; font-weight: normal;}
#content h3 span {font-weight: bold;}

#page-home #content {border: none; background-color: transparent; padding-top: 0;}
#page-impressum #content {margin-top: 6px;}
#content .bluebg {background-color: #00345a; border-bottom: 27px solid #001b2f; padding-top: 20px; height: 25em; overflow: auto;}
#content .bluebg h3 {color: #7ec8fe; font-size: 1.1em; font-weight: normal;}
#content .bluebg p {color: #efefef;}
#content .greenbg {background-color: #226719; border-bottom: 27px solid #12360d; padding-top: 20px; height: 25em; overflow: auto;}
@media only screen and (min-width: 768px) {
	#content .greenbg {width: 49.5%; margin-left: .5%; }
}
#content .greenbg h3 {color: #abe874; font-size: 1.1em; font-weight: normal;}
#content .greenbg p {color: #b7dfb2;}
#content .greenbg a {color: #b7dfb2; text-decoration: underline;}
#content .centered {margin: 0 auto; display: block;}

input.error {background-color: #febfc2;}
#frm-customercenter input[type="text"], #frm-customercenter input[type="email"]{background-color: #9ab996; color: #226719; border-color: #bdb;}
fieldset {border: none; margin: 0; padding: 0;}
.success, .failed {display:none; text-align:left; padding: 5px; color: #12360d; border: 2px solid #12360d; margin: 10px 0; background-color: #abe874;}
.failed {border-color: #c00; background-color: #ffefef;}
.error, .empty{position:relative; color:red; font-size:11px; top:0px;}
.button {margin-bottom: 20px; background-color: #226719;}
.button:hover {background-color: #12360d;}

#frm-customercenter ::-webkit-input-placeholder {
  color: #226719;
}
#frm-customercenter #myInput:-moz-placeholder {
  color: #226719;
}
#frm-customercenter #myInput:-ms-input-placeholder {
  color: #226719;
}


.imagedescription {font-style: italic; font-size: .8em; color: #607f8e;}

#revealKontakt {width: 500px; margin-left: -250px;}
.imprint {text-align: right;}
.imprint li {display: inline-block; list-style: none; padding: 0 5px; line-height: 1em;}
.imprint li.tepax {padding-right: 30px;}
.imprint li.tepax #tepax-logo {position: absolute; top: -10px;}
.imprint li:first-child {border-right: 1px solid #acd5ea;}
.imprint a {color: #acd5ea;}
.imprint a:hover {color: #efefef;}