body {
  background-color: #00315c;
}

#header {
  background-image: url(/img/bg_header_solarlight.png);
}

#header h1 {
  background: transparent url(/img/logo_solarlight.jpg) no-repeat 11px 8px;
  height: 115px;
  right: auto;
  width: 230px;
}

#header h1 img {
  padding: 10px 0 0 8px;
}

#main {
  background-image: url(/img/bg_main_solarlight.png);
}

#content {
  margin-right: 162px;
}

#products h2 {
  font-size: 1.2em;
  margin-bottom: 20px;
}

#products{
  position: relative;
  background: url(/img/bg_mainnav.png) repeat-x left bottom #BEDF48;
  border-color: #728B19;
  -moz-box-shadow: 0 0 20px rgba(0,0,0,0.5);
  -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.5);
  box-shadow: 0 0 20px rgba(0,0,0,0.5);
  z-index: 10;
  margin-left: -230px;
  clear: both;
}

#products.home{
  margin-left: 0px;
}

#illustration{
  float:left;
  margin-top: 30px;
}

#overview{
  float:left;
  padding: 20px 10px;
  width: 390px;
}

#overview li {
  padding-left: 13px;
  background: url(/img/li_blue.png) 0 0.4em no-repeat;
}

#overview ul li{
  margin-top: 5px;
}

#overview ul li a {
  color: #00315c;
  text-decoration:none;
}

#overview a:hover,
#overview a:focus,
#overview a:active {
  text-decoration: underline;
}

#meetus a{
  color: #00315c;
  text-decoration:none;
}

#meetus a:hover,
#meetus a:focus,
#meetus a:active{
  text-decoration:underline;
}

#meetus p{
  margin-top:5px;
  width: 180px;
}

#meetus{
  float: left;
  padding: 20px 10px;
  width: 210px;
}

#footer {
  background-image: url(/img/bg_footer_solarlight.png);
  background-color: #00315c;
  position: relative;
  z-index: 100;
}

#servicenav a,
#footer a  {
  border-right-color: #aed81c;
  color: #aed81c;
}

#solarlight {
  cursor: pointer;
  height: 100%;
  overflow: hidden;
  position: absolute;
  right: 21px;
  top: 0;
  width: 162px;
}

#solarlight img {
  float: left;
}

#solarlight div {
  background: url(/img/solarlight_bg.png) repeat-y 0 0;
  height: 100%;
  margin-top: 869px;
  width: 162px;
}

#solarlighticons {
  color: #00315c;
  margin: 0;
  padding: 0 0 3em 60px;
}

#solarlighticons h2 {
  font-size: 1.2em;
  margin-bottom: 20px;
}

#solarlighticons li {
  float: left;
  margin: 20px 10px 0 0;
  width: 222px;
}

#solarlighticons li img {
  float: left;
  margin: 0 10px 0 0;
}

#solarlighticons p {
	clear: left;
	font-size: 0.85em;
	margin: 0;
	text-align: right;
	width: 670px;
}

.iconlist p {
  clear: left;
  margin: 2em 0;
}

.iconlist p img {
	float: left;
	margin: 0 10px 20px 0;
}

.iconlist a {
	text-decoration: none;
	color: #00315C;
}

.iconlist a:hover,
.iconlist a:focus,
.iconlist a:active {
	text-decoration: underline;
}

#content img.home {
	position: absolute;
}

#main.home {

}

#main.home #content {
  padding-bottom: 400px;
}

#content h1.home {
	margin: 0;
}

#skiplinks p a:focus, 
#skiplinks p a:active {
  color: white;
}


/* --- carousel ------------------------------------------------------------ */

#carouselWrapper {
  background: white url(/img/bg_content_inverted.png) repeat-x left bottom;
  clear: both;
  margin: 0 0 40px 0;
  padding-bottom: 25px;
}

#carousel {
  background: white url(/img/bg_content.png) repeat-x left top;
  padding: 25px 190px 0 60px;
}

#itemList {
  float: right;
  width: 222px;
}

#itemList li {
  background-color: white;
  border: 1px solid white;
  border-width: 1px 1px 1px 0;
  color: #777777;
  cursor: pointer;
  font-size: 0.8em;
  padding: 5px 10px 5px 20px;
}

#itemList li.active {
  background: #BEDF48 url(/img/bg_mainnav.png) repeat-x scroll left bottom;
  border-color: #728B19;
  -moz-box-shadow: 0 0 8px rgba(0,0,0,0.5);
  -webkit-box-shadow: 0 0 8px #AAAAAA;
  box-shadow: 0 0 8px #AAAAAA;
  color: #00315D;
  position: relative;
  z-index: 10;
}

#itemList li span {
  display: block;
  font-size: 1.3em;
  font-weight: bold;
}

#itemContainer {
  float: left;
  min-height: 230px;
  position: relative;
}

#carousel .item {
  background-color: white;
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 462px;
}

#carousel .active {
  display: block;
}

#carousel .itemDesc {
  float: left;
  width: 222px;
}

#carousel .itemDesc h3 {
  font-size: 1.3em;
  line-height: 1.1;
  margin-bottom: 1em;
}

#carousel .itemDesc p {
  margin-bottom: 0.7em;
}

#carousel .itemDesc p.subline {
  font-weight: bold;
  font-style: italic;
}

#carousel .itemDesc h3 span {
  display: block;
  font-size: 0.6em;
  font-weight: normal;
}

#carousel .item img {
  display: block;
  float: right;
}

#playPause {
  background: transparent url(/img/playPause.png) no-repeat 0 -24px;
  display: block;
  position: absolute;
  bottom: 0;
  left: 198px;
  height: 24px;
  width: 24px;
  text-indent: -999em;
}

#playPause.play {
  background-position: 0 0;
}


#playPause:hover,
#playPause:focus,
#playPause:active {
  background-position: 0 -72px;
}

#playPause.play:hover,
#playPause.play:focus,
#playPause.play:active {
  background-position: 0 -48px;
}

/* --- light effect -------------------------------------------------------- */

html, body {
  height: 100%;
}

body.light {
  background-color: #00070d;
}

.light #footer {
  background-color: #00070d;
  background-image: url("/img/bg_footer_solarlight_on.png");
}

.light #footer * {
  color: #00070d !important;
  border-color: #00070d !important;
}

#spot {
  display: none;
}

.solarswitch {
  color: #AED81C;
  font-size: 0.85em;
  padding: 0 26px 2px 0;
  position: absolute;
  right: 190px;
  top: 0.5em;
  text-decoration: none;
  z-index: 101;
}

.solarswitch:hover,
.solarswitch:focus,
.solarswitch:active {
  text-decoration: underline;
}

#solaroff {
  background: transparent url(/img/iconSwitchSun.png) no-repeat right center;
}

#solaron {
  background: transparent url(/img/iconSwitchMoon.png) no-repeat right center;
}

#solaron,
.light #solaroff {
  display: block;
}

#solaroff,
.light #solaron {
  display: none;
}

.light #spot {
  background: url("/img/solarlight_on_overlay.png") no-repeat 0 0;
  cursor: pointer;
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  overflow: hidden;
  top: 0;
  width: 976px;
  z-index: 100;
}

.light #spot div {
  background: url(/img/solarlight_on_bottom.png) repeat-y 0 0;
  height: 100%;
  margin-top: 924px;
  width: 976px;
}

#skiplinks {
  z-index: 10000;
}

.light #skiplinks p a:focus, 
.light #skiplinks p a:active {
  color: #fff !important;
  z-index: 10000;
}