/* 
########################################################
Style fuer die grundsaetzliche Ausrichtung der Elemente
########################################################
*/
.item { }
#clear { clear:both; }

html, body {
		scrollbar-arrow-color: #faeed4;
		scrollbar-3dlight-color: #c0c0c0;
		scrollbar-higlight-color: #FF6600;
		scrollbar-face-color: #8a0611;
		scrollbar-shadow-color: #8a0611;
		scrollbar-darkshadow-color: #c0c0c0;
		scrollbar-track-color: #680f13;
		height:100%; margin:0; padding:0;
		}
		
body {
		background-color:#faeed4;
		text-align:center; /* horizontal centering for IE Win quirks */
		}
#distance { 
		width:1px;
		height:50%;
		background-color:#faeed4;
		margin-bottom:-19em; /* half of container's height */
		float:left;
		}
	
#container {
		margin:0 auto;
		position:relative; /* puts container in front of distance */
		text-align:left;
		height:553px;
		width:956px;
		clear:left;
		background:url(../img/maria_jose_bg.gif);
		background-repeat:no-repeat;
		}

#naviBox{
	position: absolute;
	top: 158px;
	left: 120px;
	float:left;
	width: 138px;
   		}
#headline{
	position: absolute;
	top: 105px;
	left: 254px;
	float:left;
	width: 472px;
   		}
#underline{
	position: absolute;
	top: 133px;
	left: 227px;
	float:left;
   		}


#design{
		position: absolute;		
		text-align:right;
		top: 544px;
		left: 720px;
		float:left;
   		}
#copy{
		position: absolute;
		top: 551px;
		left: 105px;
		float:left;
   		}
		
#logo{
		position: absolute;
		top: 20px;
		left: 449px;
		float:left;
   		}		

#main{
	position: absolute;
	top: 157px;
	left: 278px;
	float:left;
	width: 414px;
   		}
	
#mainScroll{
	position: absolute;
	top: 157px;
	left: 278px;
	float:left;
	width: 388px;
	height: 370px;
	overflow:auto;
	padding-right: 15px;
   		}
#mainKontakt{
	position: absolute;
	top: 157px;
	left: 278px;
	float:left;
	width: 438px;
	height: 352px;
   		}		
#rechtliches{
	position: absolute;
	top: 125px;
	left: 587px;
	float:left;
	width: 158px;
	height: 241px;
   		}		
#brotfabrik{
	position: absolute;
	top: 367px;
	left: 515px;
	float:left;
	width: 198px;
	height: 150px;
   		}		
			
		

/*
+++++++++++++++++++++++++++++
Typo
+++++++++++++++++++++++++++++
*/		

.txt {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: normal;
	line-height: 1.4em;
	text-decoration: none;
    color: #e2cfad;
}
.txtOr {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: normal;
	line-height: 1.4em;
	text-decoration: none;
    color: #ff6300;
}
.txtOrSmall {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.7em;
	font-style: normal;
	font-weight: normal;
	line-height: 1.4em;
	text-decoration: none;
    color: #ff6300;
}

.h2 {
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 1.5em;
	font-stretch: 50px;
	font-style: normal;
	font-weight: bold;
	line-height: 1.4em;
	text-decoration: none;
    color: #ff6300;
}
.h3 {
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 1.2em;
	font-stretch: 50px;
	font-style: normal;
	font-weight: bold;
	line-height: 1.2em;
	text-decoration: none;
    color: #ff6300;
}

.txtCopy {
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.6em;
	font-style: normal;
	font-weight: normal;
	line-height: 1.0em;
	text-decoration: none;
    color: #680f13;
}
.txtrights {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.6em;
	font-style: normal;
	font-weight: normal;
	line-height: 1.2em;
	text-decoration: none;
    color: #f44b07;
}


/* 
########################################################
Style fuer Hyperlinks
########################################################
*/
.link:link	{
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	text-decoration: underline;
	color: #ff6300;
}

.link:visited{
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #ff6300;

}
.link:active{
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #e2cfad;

}
.link:hover{
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #e2cfad;
}

.linkSmall:link	{
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.7em;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	text-decoration: underline;
	color: #ff6300;
}

.linkSmall:visited{
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.7em;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #ff6300;

}
.linkSmall:active{
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.7em;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #e2cfad;

}
.linkSmall:hover{
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.7em;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #e2cfad;
}


.linkCopy:link	{
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.6em;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	text-decoration: none;
	color: #680f13;
}

.linkCopy:visited{
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.6em;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #680f13;

}
.linkCopy:active{
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.6em;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000000;

}
.linkCopy:hover{
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.6em;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000000;
}




/* 
+++++++++++++++++++++++++++++++++++
Rollover Mainbuttons
+++++++++++++++++++++++++++++++++++
*/

.ebene1 { 
    width: 138px;
	padding:0px 0px 8px 2px;  	/*Texteinzug top-right-bottom-left*/	
	display:block;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: normal;
	text-decoration: none;
    color: #faeed4;
	-moz-box-sizing:border-box;
	box-sizing : border-box;

}

.ebene1:hover { 				 /*Rollover  Hauptmenue*/
	width: 138px;				 
	padding:0px 0px 8px 2px;  	/*Texteinzug top-right-bottom-left*/	
	display:block;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
    color: #ff6300;
	-moz-box-sizing:border-box;
	box-sizing : border-box;
}

.ebene1_active { /*Geklickt Home*/
	width: 138px;				 
	padding:0px 0px 8px 2px;  	/*Texteinzug top-right-bottom-left*/	
	display:block;
	background-image:url(../img/btn_home_ov.gif);
	background-repeat:no-repeat;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
    color: #ff6300;
	-moz-box-sizing:border-box;
	box-sizing : border-box;
	}
.ebene2_active { /*Geklickt Maria Jose*/
	width: 138px;				 
	padding:0px 0px 8px 2px;  	/*Texteinzug top-right-bottom-left*/	
	display:block;
	background-image:url(../img/btn_mj_ov.gif);
	background-repeat:no-repeat;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
    color: #ff6300;
	-moz-box-sizing:border-box;
	box-sizing : border-box;
	}
.ebene3_active { /*Geklickt Flamencotreff + Impresssum*/
	width: 138px;				 
	padding:0px 0px 8px 2px;  	/*Texteinzug top-right-bottom-left*/	
	display:block;
	background-image:url(../img/btn_flamencotreff_ov.gif);
	background-repeat:no-repeat;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
    color: #ff6300;
	-moz-box-sizing:border-box;
	box-sizing : border-box;
	}
.ebene4_active { /*Geklickt Workshops + Anmeldung */
	width: 138px;				 
	padding:0px 0px 8px 2px;  	/*Texteinzug top-right-bottom-left*/	
	display:block;
	background-image:url(../img/btn_workshops_ov.gif);
	background-repeat:no-repeat;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
    color: #ff6300;
	-moz-box-sizing:border-box;
	box-sizing : border-box;
	}
.ebene5_active { /*Geklickt Unterricht + Coro Rociero*/
	width: 138px;				 
	padding:0px 0px 8px 2px;  	/*Texteinzug top-right-bottom-left*/	
	display:block;
	background-image:url(../img/btn_unterricht_ov.gif);
	background-repeat:no-repeat;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
    color: #ff6300;
	-moz-box-sizing:border-box;
	box-sizing : border-box;
	}
.ebene6_active { /*Geklickt Kontakt*/
	width: 138px;				 
	padding:0px 0px 8px 2px;  	/*Texteinzug top-right-bottom-left*/	
	display:block;
	background-image:url(../img/btn_kontakt_ov.gif);
	background-repeat:no-repeat;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
    color: #ff6300;
	-moz-box-sizing:border-box;
	box-sizing : border-box;
	}

.ebene7_active { /*Geklickt Kontakt*/
	width: 138px;				 
	padding:0px 0px 8px 2px;  	/*Texteinzug top-right-bottom-left*/	
	display:block;
	background-image:url(../img/btn_impressum_ov.gif);
	background-repeat:no-repeat;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
    color: #ff6300;
	-moz-box-sizing:border-box;
	box-sizing : border-box;
	}
	
.ebene8_active { /*Geklickt Kontakt*/
	width: 138px;				 
	padding:0px 0px 8px 2px;  	/*Texteinzug top-right-bottom-left*/	
	display:block;
	background-image:url(../img/btn_links_ov.gif);
	background-repeat:no-repeat;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
    color: #ff6300;
	-moz-box-sizing:border-box;
	box-sizing : border-box;
	}
/* 
+++++++++++++++++++++++++++++++++++
Rollover Subnavigation
+++++++++++++++++++++++++++++++++++
*/

.ebeneSub { 
    width: 138px;
	padding:0px 0px 8px 16px;  	/*Texteinzug top-right-bottom-left*/	
	display:block;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
    color: #faeed4;
	-moz-box-sizing:border-box;
	box-sizing : border-box;

}

.ebeneSub:hover { 				 /*Rollover  Hauptmenue*/
	width: 138px;				 
	padding:0px 0px 8px 16px;  	/*Texteinzug top-right-bottom-left*/	
	display:block;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
    color: #ff6300;
	-moz-box-sizing:border-box;
	box-sizing : border-box;
}
.ebeneSub_active { 				 /*Rollover  Hauptmenue*/
	width: 138px;				 
	padding:0px 0px 8px 16px;  	/*Texteinzug top-right-bottom-left*/	
	display:block;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
    color: #ff6300;
	-moz-box-sizing:border-box;
	box-sizing : border-box;
}
