/*----------------------------
  Screen CSS created by Webfox january 2008
  Edited by Michael Kasten
  ---------------------------- 
*/

/*----------------------------
  ------reset default styles--
  ---------------------------- */
* {
   margin: 0;
   padding: 0;
   }

  
/*----------------------------
  ------reset font sizes------
  ---------------------------- */

li, p, td, th{
	font-size: 1em;
   }

/*----------------------------
  ---generic element styles---
  ---------------------------- */

html{
   height: 101%;
   }

body {
	font: 0.75em Verdana,"Lucida Grande",sans-serif;
	height: 100%;
	margin: 0px;
	text-align:center;
	background:url("../images/background-page-gray.gif") center 194px repeat-x;
   }
body.indexpage{
	background:none;
   }    
   

a {
   
   }

img {border:none;}


/*----------------------------
  ---Visual hidden elements---
  ---------------------------- */
  
.aural,h1{
   position: absolute;
	left: -5000px;
	width: 250px;
   }

/*----------------------------
  ---global layou helper------
  ---------------------------- */

.clear{
   clear:both;
   }

/*----------------------------
  -------layout elements------
  ---------------------------- */

.clear{
   clear:both;
   }
   
#page-body{
   width:980px;
   margin:0 auto;
   }

#page-headerarea-wrapper {
	background:url("../images/encon-logo-mit-slogan.gif") right 18px no-repeat;
	position: relative;
   }

#page-headerarea {
	height: 194px;
   }

#page-headerarea #page-headerarea-mainbox,
#page-headerarea #page-headerarea-rightbox{
   min-height:140px;
   }

#page-headerarea-leftbox{
   position:absolute;
   width:220px;
   left:0;
   }

#page-headerarea-mainbox{
   margin: 0 290px 0 220px;
   }

#page-headerarea-rightbox{
   position:absolute;
   right:0;	
   top:0;
   width: 290px;
   }
 
 #page-headerarea-rightbox img{
    margin-top:24px;
   }
    
#page-headerarea-navigation{
   z-index:4;
   position:absolute;
   width:980px;
   left:0;
   line-height:26px;
   text-align:left;
   font-weight:bold;
   top:166px;
   background:#fff;
   }
    
#img-wrapper{
   float:left;
   }

#page-leftimage,  
#page-mainimage,
#page-rightimage{
   height:117px;
   }
    
#page-mainimage img{
   margin-top:1px;

   }  
    

#page-wrapper {
	float:left;
	background:url("../images/background-wrapper-gray-left.gif") top left repeat-y;
	border-right:solid 1px #ccc;
   }
   

#page-leftimage,
#page-leftside {
	width:220px;
	float:left;
   position:relative;
   }

#page-mainimage,
#page-main {
	width:500px;
   margin:0;
   float:left;
   position:relative;
   }
   
#page-rightimage,
#page-rightside {
   width: 259px;
	float:right;
   position:relative;
   margin:0;
   }
#page-rightside {

	}
	
#page-main-footer {
	clear: both;
	position:relative;
	bottom: 0;
	text-align:center;
   }

#page-footer {
	clear: both;
	position:relative;
   height:13px;
   background:#999;
	}

#page-leftbox{
   background:#ccc;
   }

#page-leftbox,
#page-rightbox{
   min-height:470px;
   }

#page-rightbox{

   }

#page-mainbox{
   padding:10px 10px 15px 20px;
   min-height:440px;
   border-right:solid 1px #ccc;
   text-align:left;
   } 
   
/*----------------------------
  --------indexpage only------
  ---------------------------- */

body.indexpage #page-headerarea-navigation{
   left:50%; 
   margin-left:-490px;
   }

#index-main-box{
   text-align:center;
   position:absolute;
   width:100%;
   }

#logo-holder{
   width:988px;
   margin:0 auto;
   }

#logo-holder img{
   float:right;
   margin-top:20px;    
   }
   
#index-center{
   position:absolute;
   width:100%;
   background:#666;
   top:194px;
   height:300px;
   }

#index-foot{
   position:absolute;
   width:100%;
   top:510px;
   height:20px;
   }

#index-content-wrapper{
   width:980px;
   position:absolute;
   left:50%;
   margin-left:-480px;
  }
   
.piktobox{
   width:200px;
   background:#fff;
   margin:24px 20px 0 25px;
   float:left;
   }  
 
 .piktobox .content{
   height:210px;
   text-align:center;
   
   }
 
 .piktobox .content a{
   text-decoration:none;
   font-weight:bold;
   color:#666;
   text-transform:uppercase;
   font-size:1.2em;
   } 
 
 .piktobox .content span{
   padding:0 10px;
   }
      
.one2 {
	background: url(../images/topleft.gif) top left no-repeat;
   }

.two2 {
	background: url(../images/topright.gif) top right no-repeat;
	padding: 20px 1em 0 1em
   }

.three2 {
	background: url(../images/bottomright.gif) bottom right no-repeat;
   }

.four2 {
	background: url(../images/bottomleft.gif) bottom left no-repeat;
	padding: 20px 1em 0 1em
   }


/*----------------------------
  --------Navigationen--------
  ---------------------------- */
#page-headerarea-navigation ul,
#footer-navi ul{
  list-style:none;
   }
   
   
#page-headerarea-navigation ul li,
#footer-navi ul li{
   display:inline;
   }
   
#footer-navi ul li{
   margin-right:10px;
   padding:0 0 0 10px;
   border-left:solid 1px;
   }
   
#footer-navi ul li.first{
   border:none;
   }
   
   
   

#page-headerarea-navigation ul li a{
   color:#474948;
   text-decoration:none;
   font-size:0.9em;
   padding-left:10px;

   }
   
#page-headerarea-navigation ul li a:hover,
#page-headerarea-navigation ul li a.current,
#page-headerarea-navigation ul li.current a,
#footer-navi ul li a:hover,
#footer-navi ul li a.current{
   color:#bc0e1d;
   }

#page-headerarea-navigation ul#langnavi{
   float:left;
   }

#page-headerarea-navigation ul#langnavi li a{
   padding-left:30px;
   margin:0 20px 0 10px;
   }
   
#page-headerarea-navigation ul#langnavi li a.de_DE{
	background:url("../images/flag-de_DE.jpg") left center no-repeat;
   }
#page-headerarea-navigation ul#langnavi li a.en_EN{
	background:url("../images/flag-en_EN.jpg") left center no-repeat;
   }
#page-headerarea-navigation ul#langnavi li a.ru_RU{
	background:url("../images/flag-ru_RU.jpg") left center no-repeat;
   }
#page-headerarea-navigation ul#langnavi li a.cn_CN{
	background:url("../images/flag-cn_CN.jpg") left center no-repeat;
   }
  
#page-headerarea-navigation ul#langnavi li a.download{
   padding-left:0;
   margin-left:0;
   }  
  
#page-headerarea-navigation ul.addnavi{
   float:right;
   }
   
#page-headerarea-navigation ul.addnavi li a{
   padding-left:10px;
   margin:0 0 0 20px;
   background:url("../images/headnavi-arrow.gif") left center no-repeat;
   }  
   
  
#page-leftbox-navigation ul{
   list-style:none;
   }

#page-leftbox-navigation {
   margin:0 auto 10px auto;
   text-align:left;
   border-bottom:solid 10px #999;
   }

#page-leftbox-navigation ul li{
   border-bottom:solid 1px #484947;
   }

#page-leftbox-navigation ul li a{
   display:block;
   text-decoration:none;
   padding:5px 2px 5px 30px;
   color:#000;
  	background:url("../images/navigation-level1.gif") 10px center no-repeat;
   }
   
#page-leftbox-navigation ul li a:hover,
#page-leftbox-navigation ul li a.current{
   color:#fff;
  	background:url("../images/navigation-level1-hover.gif") 10px center no-repeat #bc0e1d ;
   }
   
#page-leftbox-navigation ul li.first{}

#page-leftbox-navigation ul li ul {
   border-top:solid 1px #484947;
   }

#page-leftbox-navigation ul li ul li{
   border-color:#fff;
   }
      
#page-leftbox-navigation ul li ul li a{
   background-image:none;
   padding-left:50px;
   background-color:#e9e9e9;
   }

#page-leftbox-navigation ul li ul li a:hover,
#page-leftbox-navigation ul li ul li a.current{
   background:url("../images/navigation-level2-hover.gif") 30px center no-repeat #e9e9e9;
   color:#000;
   }
   
#page-leftbox-navigation ul li ul li ul{
   border:none;
   }
   
#page-leftbox-navigation ul li ul li ul li a{
   font-weight:normal;
   padding-left:70px;
   }

#page-leftbox-navigation ul li ul li ul li a:hover,
#page-leftbox-navigation ul li ul li ul li a.current{
   color:#bc0e1d;
  	background:url("../images/navigation-level3-hover.gif") 50px center no-repeat #fff;
   }



#footer-navi {
	clear: both;
	position:relative;
   height:13px;
   margin:4px 0;
   color:#484947;
	}
   
#footer-navi a{
   text-decoration:none;
   color:#484947;
   }

#footer-navi a:hover{
   color:#bc0e1d;
   }


/*----------------------------
  -----standard Inhalte-------
  ---------------------------- */

#page-mainbox h2{
   padding:0.15em 0;
   font-size:1.3em;
   text-align:left;
   clear:both;
   height:1%;
   }

#page-mainbox h2 em{
   padding:0.15em 0;
   font-size:0.85em;
   height:1%;
   }

#page-mainbox h3,
#page-mainbox h4,
#page-mainbox h5 {
   padding:0.15em 0;
   font-size:1.1em;
   text-align:left;
   clear:both;
   height:1%;
   } 

#page-mainbox p{
   padding:4px 0;
   text-align:left;
   } 
   
#page-mainbox ul{
   margin:10px 0 10px 24px;
   list-style-image:url("../images/ul-list-image.gif");
   list-style:square;
   }    

#page-mainbox a{
   color:#bc0e1d;
   }

#page-mainbox a.backlink{
   color:#bc0e1d;
   position:absolute;
   right:10px;
   padding-left:10px;
   background:url("../images/backlink-arrow.gif") left center no-repeat;
   }
   
.coldiv{
   border:solid 1px #ccc;
   width:220px;
   float:left;
   margin:10px 2px 0 2px;
   padding:4px;
   min-height:200px;
   }
   
#page-mainbox p.colp{
   width:220px;
   float:left;
   padding:0 0 0 10px;
   text-align:left;
   }
   
#page-mainbox p.colp img{
   margin:4px 0 0 -10px;
   }
   
   
#page-mainbox .coldiv img{
   border:solid 1px #ccc;
   float:right;
   margin: 0;
   }

  #page-mainbox hr {
   border:none;
   clear:both;
   border-top:dotted 2px #f2f2f2;
   margin:20px 10px;  
   }
   
/*Bilder*/
#page-mainbox img{
   float:left;
   margin:10px 20px 10px 0;
   border:solid 1px #999;
   } 
   
#page-mainbox img.halfcol{
   float:left;
   margin:10px 2px 10px 0;
   } 
   

/*Bildertext fuer 100px Bilder*/
#page-mainbox .img-left-text{
   padding-left:120px;
   }
   
#page-mainbox p.img-left-text{
   padding-top:8px;
   }

#page-mainbox div.movie{
   text-align:center;
   padding:30px 0;
   }


/*Tabellen*/

#page-mainbox table{
   border-collapse:collapse;
   width:462px;
   }
   
#page-mainbox table th{
   text-align:center;
   font-size:0.9em;
   border-bottom:solid 2px #999;
   padding:2px ;
   }

#page-mainbox td{
   padding:2px ;
   text-align:center;
   font-size:0.9em;
   border-bottom:solid 1px #ccc;
   }

#page-mainbox tr.tablegray{
   background:#f2f2f2;
   }

#page-rightbox p{
   font-size:0.9em;
   color:#666;
   padding:0 0 10px 0;
   }    
/*----------------------------
  ----------Formulare---------
  ---------------------------- */

fieldset{
   border:solid 1px #ccc;
   padding:10px ;
   background:#f1f1f1;
   }

legend{
   font-weight:bold;
   padding:4px;
   }

label{
   font-weight:bold;
   display:block;
   float:left;
   width:100px;
   margin:4px 0;
   }

input{
   float:left;
   width:330px;
   border:solid 1px #666;
   margin:4px 0;
   }

input:focus,
textarea:focus{
   background:#fffcdf;
   }

textarea{
   border:solid 1px #666;
   width:430px;
   height:200px;   
   }

form div{
   clear:both;
   }

form div.textarea,
form div.buttons{
   padding:10px 0;
   }

.textarea label{
   float:none;
   }

.buttons{
   text-align:center;
   }

.buttons input.button{
   float:none;
   background:#ccc;
   margin:0 20px;
   width:100px;
   font-weight:bold;
   cursor:pointer;
   }

div.warn,
div.succes{
   border:solid 1px;
   padding:10px;
   margin:10px;
   font-weight:bold;
   }

div.warn{color:red;}
div.succes{color:green;}

