/* --------------------------------------------------------- */
/* BASIC CSS ----------------------------------------------- */
/* --------------------------------------------------------- */
/* CSS Document fuer CMS   */
/* blau: #1e4277 */

/* --------------------------------------------------------- */


html, body {
	margin:0;
	padding:0;
    font-family: 'GraublauWebRegular';
	font-weight: normal;
	font-style: normal;
	font-size: 90%;
	color: #1e4277 ;
    height: 101%;
	text-align:center;
	line-height: 1.4em;
}

 body {
	    background: url(../images/hg_logo.gif) no-repeat center 600px;
}

#no {
	background: none;
}



@font-face {
    font-family: 'GraublauWebRegular';
    src: url('graublauweb-webfont.eot');
    src: url('graublauweb-webfont.eot?#iefix') format('embedded-opentype'),
         url('graublauweb-webfont.woff') format('woff'),
         url('graublauweb-webfont.ttf') format('truetype'),
         url('graublauweb-webfont.svg#GraublauWebRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}






/* mit der Angabe von % im body und der folgenden Angabe in em wird eine einheitliche Schriftgroesse in den versch. Browsern ermoeglicht */
* {
	font-size:1em;
}

/* Bilder skalieren und Rahmen ausschalten*/
img {
	max-width: 100%;
	height: auto;
	border: none;
}
div#header_ganz {
	width:100%;
	padding: 0px;
	margin: 0px;
	height: 150px;
	color:#fff;
	z-index:99;
	background-color: #1e4277;
    -webkit-box-shadow: 0px 3px 4px #333;  /*webkit browser*/
    -moz-box-shadow: 0px 3px 4px #333;  /*firefox */
     box-shadow: 0px 3px 4px #333; /**/
    z-index:99;
	}
/* umfliessende Box fuer die Groesse und Position wird mit auto in die Mitte positioniert */
div#wrapper{
	width:100%;
	max-width:960px !important;
	min-height:300px; /* Mindesthöhe für moderne Browser */
	margin: 0px auto 0px;
	background: url(../images/hg_trans.png);
	position:relative;
}
div#wrapper_ohne {
	width:100%;
	max-width:960px !important;
	min-height:1000px; /* Mindesthöhe für moderne Browser */
	margin: 0px auto 0px;
	background: url(../images/hg_trans.png);
	position:relative;
}

   .abgerundet {
    -moz-border-bottom-left-radius:20px; /* Firefox */
	-moz-border-bottom-right-radius:20px; /* Firefox */
    -webkit-border-bottom-left-radius:20px; /* Safari, Chrome */
	-webkit-border-bottom-right-radius:20px; /* Safari, Chrome */
    -khtml-border-bottom-left-radius:20px; /* Konqueror */
	-khtml-border-bottom-right-radius:20px; /* Konqueror */
    border-bottom-left-radius:20px; /* CSS3 */
	border-bottom-right-radius:20px; /* CSS3 */
	overflow:hidden;
	-webkit-box-shadow: 0px 6px 8px #333;  /*webkit browser*/
    -moz-box-shadow: 0px 6px 8px #333;  /*firefox */
    box-shadow: 0px 6px 8px #333; /**/
    }



/* oberste Box fuer Logo u. Navigation */

div#header {
	width:100%;
	max-width:960px !important;
	padding: 0px;
    margin: 0px auto 0px;
	height: 190px;
	color:#fff;
	z-index:98;

	}


/* Logo */

div#logo {
	margin: 0px 0px 0px 30px;
	padding: 0px;
	width: 250px;
    position:absolute;
    z-index:2;
	}

div#titel {
	margin: 100px 0px 0px 630px;
	padding: 0px;
	width: 250px;
    position:absolute;
    z-index:2;
	}	
	
div#sliderbox {
	margin: -50px auto 0px auto;
	padding: 0px;
	width: 950px;
	height: 313px;
	z-index:95;
	-webkit-box-shadow: 0px 6px 8px #333;  /*webkit browser*/
   -moz-box-shadow: 0px 6px 8px #333;  /*firefox */
   box-shadow: 0px 6px 8px #333; /**/
  -moz-border-radius:20px; /* Firefox */
   -webkit-border-radius:20px; /* Safari, Chrome */
   -khtml-border-radius:20px; /* Konqueror */
    border-radius:20px; /* CSS3 */
	overflow:hidden;	
	
	}
	
	div#sliderbox_weihnachten {
	margin: -50px auto 0px auto;
	padding: 0px;
	width: 950px;
	height: 180px;
	z-index:95;
	-webkit-box-shadow: 0px 6px 8px #333;  /*webkit browser*/
   -moz-box-shadow: 0px 6px 8px #333;  /*firefox */
   box-shadow: 0px 6px 8px #333; /**/
  -moz-border-radius:20px; /* Firefox */
   -webkit-border-radius:20px; /* Safari, Chrome */
   -khtml-border-radius:20px; /* Konqueror */
    border-radius:20px; /* CSS3 */
	overflow:hidden;	
	
	}
/* Styling  for responsive slider */
.slider {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0px auto 20px auto;
  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
  box-sizing: border-box;
  }

.slider li {
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.slider li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.slider img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  max-width:100%;
  border: 0;
  }

/* Navigation */
div#navi {
	position:relative;
	margin: 0;
	padding: 0px 30px 0px 0px;
	height: 105px;
	float: right;
	width: 640px;
	
}

#navi ul {
  overflow: hidden;
  margin: 0 auto;
  padding: 30px 0px 5px 10px;
  text-align:right;


}
#navi ul li {
  width:25%;
  list-style: none;
  text-align:right;
  display: inline;
  font-size:105%;

}


#navi ul li a:link, #navi ul li  a:visited {
	margin: 0 4% 0 4%;
    padding: 0;
    color: #fff;
	font-weight:normal;
	text-decoration: none;

    }

#navi ul li a:hover {
	border-top: 3px solid #fff;
	color:#fff;
}

#navi ul li a:active {
	color:#fff;

}


a.aktiv {
	color:#000;
}

#navi a:link, #navi a:visited {
    color: #fff;
	font-weight:normal;
	text-decoration: none;
	font-size:95%;

    }

#navi  a:hover {
	border-top: 2px solid #fff;
	color:#fff;
    font-size:95%;
}

#navi a:active {
	color:#fff;
	font-size:95%;

}


/* unternav */
div#unternavi {
	position:relative;
	margin: 15px 0px 0px 0px;

	height: 30px;
	float: center;
	width: 950px;
	
}

#unternavi a:link, #unternavi  a:visited {
    color: #1e4277;
	font-weight: bold;
	text-decoration: none;

    }

#unternavi ul li a:hover {
	border-top: 1px solid #1e4277;
	color:#1e4277;
}

#content_li {
  width: 60%;
  max-width: 520px;
  text-align:left;
  float:left;
  margin: 50px 0px 10px 40px;
  padding: 0px 0px 0px 0px;
  height:100%;
  min-height:260px;
}

#content_weihnachten {
  width: 60%;
  max-width: 520px;
  text-align:left;
  float:left;
  margin: 50px 0px 10px 40px;
  padding: 0px 0px 0px 0px;
  height:100%;
  min-height:260px;
}
#content_re {
  width: 40%;
  max-width: 300px;
  text-align:left;
  float:right;
  margin: 50px 40px 0px 30px;
  padding: 0px 0px 0px 20px;
  height:100%;
	border-left: 1px solid #1e4277;
  color:#1e4277;

  overflow:hidden;	
}



#content_li a:link, #content_li a:visited, #content_re a:link, #content_re a:visited {
    color: #1e4277;
	font-weight:normal;
	text-decoration: none;

    }

#content_li  a:hover, #content_re  a:hover {
	color:#1e4277;
	text-decoration: underline;
}

#content_li a:active, #content_re a:active {
	color:#483035;
		text-decoration: underline;
}



#footer {
  width: 100%;
  max-width: 960px;
  min-height: 40px;
  height:auto !important; /* Important Regel für moderne Browser */
  height:40px; /* Mindesthöhe für den IE */
  margin: 0px auto 0px auto;
  clear: both;
  color:#1e4277;
  text-align:left;
  padding-left:90px;
}





/* Textformatierung */

h1 {
	color:#1e4277;
	font-size: 1.5em;
	font-weight:normal;
	line-height:1.5em;
	}

 /* Diese Klasse sollte in einem div- oder break-Element platziert werden und das letzte Element vor dem Schlie?en eines Containers sein, */
 /* der wiederum alle seine untergeordneten Floats enthalten sollte. */
.clearfloat {
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
 }
 
 .groesser {
	 
	 font-size: 105%;
	 font-weight:bold;}
	 
	  .kleiner {
	 
	 font-size: 85%;
	}
	
.rot {
	color:#900;
	}	
	
	/* ===================================
    cookie
====================================== */

#cookie a {color:#fff; text-decoration:none;}
#cookie span {color:#fff; text-decoration:none;}

#cookie a:hover {text-decoration:underline;}

#cookie div {padding:10px; padding-right:40px;}

#cookie { 
   outline: 1px solid #7b92a9; 
   text-align:right; 
   border-top:1px solid #fff;
   background: #f39c2c; 
   background: -moz-linear-gradient(top, #1e4277  0%, #1e4277  100%); 
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f39c2c), color-stop(100%,#f39c2c)); 
   background: -webkit-linear-gradient(top, #1e4277  0%,  #1e4277  100%); 
   background: -o-linear-gradient(top, #1e4277  0%, #1e4277  100%);
   background: -ms-linear-gradient(top, #1e4277  0%, #1e4277  100%); 
   background: linear-gradient(to bottom, #1e4277  0%, #1e4277  100%); 
   filter: progid:DXImageTransform.Microsoft.gradient(   startColorstr='#f39c2c', endColorstr='#f39c2c',GradientType=0 ); 
   position:fixed;
   bottom:0px; 
   z-index:10000; 
   width:100%; 
   font-size:12px; 
   line-height:16px;}

#cookieCloser {
   color: #777;
   font: 14px/100% arial, sans-serif;
   position: absolute;
   right: 5px;
   text-decoration: none;
   text-shadow: 0 1px 0 #fff;
   top: 5px;
   cursor:pointer;
   border-top:1px solid white; 
   border-left:1px solid white; 
   border-bottom:1px solid #7b92a9; 
   border-right:1px solid #7b92a9; 
   padding:4px;
   background: #ced6df; /* Old browsers */
   background: -moz-linear-gradient(top, #ced6df0%, #f2f6f9 100%); 
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ced6df), color-stop(100%,#f2f6f9)); 
   background: -webkit-linear-gradient(top, #ced6df0%,#f2f6f9 100%); 
   background: -o-linear-gradient(top, #ced6df0%,#f2f6f9 100%); 
   background: -ms-linear-gradient(top, #ced6df0%,#f2f6f9 100%); 
   background: linear-gradient(to bottom, #ced6df0%,#f2f6f9 100%); 
   filter: progid:DXImageTransform.Microsoft.gradient(    startColorstr='#ced6df', endColorstr='#f2f6f9',GradientType=0 ); 
 }

#cookieCloser:hover {border-bottom:1px solid white; border-right:1px solid white; border-top:1px solid #7b92a9; border-left:1px solid #7b92a9;}