/**
 * lay-out(screen)
 * 
 * @author LzzL
 * @last-updated 2009-11-06
 **/ 
 
/**
 * lay-out(color)
 * 
 * active color: FF7301 replace with new color
 *  
 **/ 
 

/* styles for background-image */
html { height: 100%; }
body { background-color: transparent; margin: 0px; padding: 0px; height: 100%; border-top: 1px transparent solid; margin-top: -1px; z-index:0; position:relative; }
img#background { height: 100%; width: 100%; z-index: -1; position:absolute; color: white; }
 
@font-face {
   font-family: "Graublau";
   src: url("./../font/GraublauWebBold.otf");
}

body 							{ font: 12px/1.4 verdana,arial,helvetiva,sans-serif; }

a:link, a:visited 				{ color:#FF7301; }
a:link:focus, a:visited:focus, 
a:link:hover, a:visited:hover, 
a:link:active, a:visited:active { color:#0e76bc;} 

.menu a:link, .menu a:visited 				{ color:#6e5a5a; }
.menu a:link:focus, .menu a:visited:focus, 
.menu a:link:hover, .menu a:visited:hover, 
.menu a:link:active, .menu a:visited:active { color:#0e76bc;} 

.news a:link, .news a:visited 							{ color:#FF7301; }
.news a:link:focus, .news a:visited:focus, 
.news a:link:hover, .news a:visited:hover, 
.news a:link:active, .news a:visited:active 			{ color:#fff;} 

.tips a:link, .tips a:visited 							{ color:#fff; }
.tips a:link:focus, .tips a:visited:focus, 
.tips a:link:hover, .tips a:visited:hover, 
.tips a:link:active, .tips a:visited:active 			{ color:#6e5a5a;} 



/* --- headers --- */
h2								{ color: #fff; font: bold 17px/1.2em "Graublau", verdana; text-transform: uppercase; }
h3								{ font: bold 20px/1.2em "Graublau", verdana; padding-left: 10px; }

/* --- lay-out --- */
body							{ float: left; width: 100%; background: #fff url(./../images/bgSite.png) repeat-x top left;}
.container						{ margin: 0 auto; position: relative; width: 850px;}

#header							{ float: left; height:270px; margin-top: 80px; width: 100%; background: #fff; background: transparent url(./../images/shadowHeader.png) repeat-x bottom left; }
#header	.headItem				{ display: block; height: 252px; width: 100%; background: #fff; }
#header	h1						{ display: block; height: 235px; text-indent: -666666px; width: 682px; background: #fff url(./../images/logo.gif) no-repeat 27px 0px; }

.headerPage						{ display: block; height: 130px; position: absolute; top: 200px; left: 375px; width: 475px; background: #fff;  } 
.headerPage	h2					{ color: #0e76bc; }


.menu							{ position: absolute; top: 350px;  float: left; width: 100%; }
.menu li						{ float: left; height: 50px; margin-right: 4px; width: 280px; }
.menu li.last					{ margin-right: 0px; width: 281px; }
.menu li a span					{ display: block;font:  bold 20px/1.2em "Graublau", verdana; height: 50px; padding-top: 8px; text-align: center; background: transparent url(./../images/btnBg.png) repeat-x top left; }
.menu li a:hover span,
.menu li.active a span			{ color:#0e76bc; margin-top: 1px; background: transparent url(./../images/shadowHeader.png) repeat-x top left; }

#content						{ float: left; width: 100%; margin: 100px 0px; }

.contentItem					{ float: left; margin-right: 4px; width: 280px; min-height:300px;  }

.news							{ color: #fff; background: #0e76bc; }
.news h2						{ float: right; padding: 5px 10px; }
.news ul						{ float: left; width: 100%; }
.news li						{ margin: 10px; padding: 10px 0px;  width: 250px; background: transparent url(./../images/stroke.png) repeat-x bottom left; }	
.news li.last					{ background: none; }	
.news li a						{ font-weight: bold; }

.card							{ position: relative; }
.card img						{ position: absolute; bottom: 0px;}

.tips							{ color: #fff; background: #FF7301; margin: 0px; }
.tips h2						{ float: right; padding: 5px 10px; }
.tips ul						{ float: left; width: 100%; }
.tips li						{ margin: 10px; padding: 10px 0px;  width: 250px; background: transparent url(./../images/stroke.png) repeat-x bottom left; }	
.tips li.last					{ background: none; }	
.tips li a						{ font-weight: bold; }

.datum                          { text-align:right; }