/* 
Title:     website atelier schäffenacker
					 screen css -> navigation
Updated:   11 feb 2007

structure: 
						-- logo header navigation headertop	
						-- navigation	
						-- subnavi  	
						-- self-clearing floats header nav

					
*/


/*   logo header navigation headertop  ------------------------------------------------ */		

#logo {
		 margin: 10px 0 0 0;
		}	
		
#header {
/*	width: 60em;  
 	margin: 0px auto;*/
 	
	list-style: none;			
	background: #fff url(../img/bg.gif) repeat;	
	}
	
#headertop	{
	float: left;				
	margin: 0;
	padding:0 0 0 5px;
	list-style: none;
	}

#header-left{
	float: left;
	margin: 0;
	padding: 0 10px 0px 0 ;
	}
	
#header-right{
	float: right;
	margin: 0;
	padding:20px 10px 0px 10px ;
}
	

/* navigation ------------------------------------------------*/

#navigation{
/*	width: 60em; 
 	margin: 0px auto; */
	padding: 0;
	list-style: none;
/*	border-right : 1px solid #c6c6a9;
 	border-left  : 1px solid #c6c6a9; */
}

#nav {
	float: left;
	width: 60em;  
	margin: 0;
	padding: 0 0 0 0px;
	background:  #c6c6a9; 
	list-style: none;
	border-right : 1px solid #c6c6a9; 
	border-left  : 1px solid #c6c6a9;

 	/* background: #gray url(../../img//on_bg.gif) repeat-x top left; */
	
}


#nav ul {
	float: left;
	margin: 0 0 0 0px;
	padding: 2px 0 0 0px;
	list-style: none;
	background:  #c6c6a9; 
	
	/* background: #FFCB2D url(../../img/nav_bg.gif) repeat-x bottom left; */
	}



#nav li {
	float: left;
	margin: 0;
	padding: 0;
	font-size: 100%;
	}

#nav-re1 li {
	float: right;
	margin: 0;
	padding: 0;
	font-size: 100%;
	}

#nav-re2 li {
	float: right;
	margin: 0;
	padding: 0;
	font-size: 100%;
	}
		
#nav a  {
	float: left;
	display: block;
  	padding: 5px 8px;
	text-decoration: none;
	border-bottom: none;
	color: black;
 
	/* background: #F9E9A9 url(../img/off_bg.gif) repeat-x top left;	
	 border: 1px solid #9B8748;*/
	}
	

#nav a.active, #nav-right a.active
{
	color:  #c30; 
	font-weight: bold;
	padding-bottom: 5px;
 	background: #F4F4E3; 
 	/* oder ffffcc url(../img/on_bg.gif) repeat-x top left; */
	}

/*- ------------  navigation - right  */

#nav-right {
	float: right;
	width:  15em;   
	margin: 0;
	padding: 0;
	background: #c6c6a9;
	list-style: none;
	}	
	
#nav-right ul {
	float: right ;
	margin: 0 0px 0 0;
	list-style: none;
	background: #c6c6a9;
	padding: 2px 0px 0 0px;
	 
	/* background: #FFCB2D url(../img/nav_bg.gif) repeat-x bottom left; */
	}
	
#nav-right li {
	float: right;
	margin: 0;
	padding: 0;
	font-size: 110%;
	}

#nav-right a  {
	float: left;
	display: block;
	margin: 0 0px 0 0;
	padding: 5px 8px;
	text-decoration: none;
	border-bottom: none;
	color: black;
	
	/*border: 1px solid #9B8748;
	 background: #Ffffcc;  url(../img/off_bg.gif) repeat-x top left;	*/
	 
	}


/* #nav a:hover, 			body#home #t-home a {
-------------------		alternativ zu class active #nav a.active

---*/

#nav a:hover, #nav-right a:hover {

	color: #c30;  
	padding-bottom: 5px;
	border-color: #727377;

	background: #F4F4E3; 
	/*ffffcc url(../img/on_bg.gif) repeat-x top left; */
	}


/* -- subnavi boxen */

#subnavi {
  padding: 10px 10px;
	}
	
.box {
  width: 150px;
  margin: 20px 20px 20px 16px; 
  background: url(../img/div-bottom.gif) no-repeat bottom left;
  }
  
.box h3 {
  margin: 0;
  padding: 6px 8px 4px 10px;
  font-size: 130%;
  color: #cc3300;
  border-bottom: 1px solid #c6c6a9;
  background: url(../img/h3-bg.png) no-repeat top left;
  }
  
.box h2 {
  margin: 0;
  padding: 6px 8px 4px 10px;
  font-size: 110%;
  color: #c30;
  border-bottom: 1px solid #E0CFAB;
  background: url(../h3-bg.png) no-repeat top left;
  }
  
.box ul, .box p{
  margin: 0;
  padding: 14px 10px 14px 10px;
  list-style: none;
  }
.box  li {
  margin: 0 0 6px; 
  padding: 0;
  line-height: 1.5em;
  } 
    
/*  headertop header self-clearing floats ----------------*/
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.headertop , 
.header  :after

	{
	content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
   visibility: hidden;
    
   }