/* ------------------ gutebrote.de - STYLE----------------- */

/*	01)-- basics --
	02)-- global-styles --
	03)-- branding/logo --
	04)-- content --
	05)-- content-styles--
	06)-- main-navigation --
	07)-- footer --
*/

/*-----------------------------------------------------*/
/*-----------------|   01=basics   |-------------------*/
/*-----------------------------------------------------*/

html, body, div, p, h1, h2, h3, ul, ol, span, a, table, td, form, img, li, input, form, object, textarea {
	margin: 0px;
	padding: 0px;
}
:focus {
	outline: 0;
}
html, body {
	background: url(../images/index/bg/bg.jpg) #fff top center repeat-x;
	color:#3c1901;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:0.9em;
	line-height:1.5em;
}
html {
	scrollbar-face-color:#3c1901;
	scrollbar-highlight-color: white;
	scrollbar-shadow-color: white;
	scrollbar-arrow-color: white;
	scrollbar-track-color: white;
	scrollbar-darkshadow-color: white;
	scrollbar-base-color: white;
	scrollbar-3d-light-color: white;
	overflow-x:hidden;
	overflow:-moz-scrollbars-vertical;
}
h1 {
	font-size: 0.001em;
	height:45px;
	text-indent:-4000px;
}
h1 img {display:none;}
h2 {
	color:#fffcf4;
	margin-bottom:20px;
}
h3 {color:#c00;
	font-size:1.0em;
	border-bottom: 1px solid #faebbc;
	padding:20px 0 20px 0;
	width:645px;
}
p 	{margin:25px 0 25px 0;}
hr	{display:none;
}
/*-----------------------------------------------------*/
/*--------------|   02=global-styles   |---------------*/
/*-----------------------------------------------------*/

a {
	text-decoration:underline;
	color:#ea7605;
}
a:hover {
	text-decoration:none;
	color:#c00;
}
.highlight-yellow {color:#ea7605; }
.highlight-red {color:#c00; }

.clear
	{clear:both; 
}

.image {
	border:1px solid #faebbc;
}
.floatRight {
	float:right;
	padding:20px 10px 0 25px;
}
.floatLeft {
	float:left;
	margin:0px;
}

.tab20 {
	margin-left:20px;
}
.tab52 {
	margin-left:52px;
}
.tab65 {
	margin-left:65px;
}
.tab75 {
	margin-left:75px;
}

.liste{ 
	border-bottom: 1px solid #faebbc;
	width:620px;}
	
.liste ul{ 
	padding-bottom:20px;}
	
.liste li{ background: url(../images/index/content/li.gif) no-repeat;
	display:block;
	padding:0 0 5px 20px;}

.back{margin-left:525px;}

.hidden {display: none !important;}

/*-----------------------------------------------------*/
/*--------------|   03=branding/logo   |---------------*/
/*-----------------------------------------------------*/

div#container {
	margin: 0px auto;
	width:980px;
	position:relative;
}
div#header {
	background: url(../images/index/bg/bg-header.jpg) no-repeat;
	height:207px;
	position:relative;
	z-index: 1;
}
div#header h1 {
	color:white;
	font-size: 0.001em;
	position:absolute;
	text-indent:-4000px;
	z-index: 1;
}
div#header h1 a {
	display: block;
	font-size: 0.001em;
	height:170px;
	left:0px;
	overflow: hidden;
	position:absolute;
	text-decoration: none;
	top:37px;
	width:248px;
	z-index: 1;
}
div#header h1 a:hover {
	background: url(../images/index/bg/bg-branding-hover.jpg) no-repeat;
	z-index: 1;
}
#adresse{
	left:290px;
	top:72px;
	position:absolute;
	color:#ef7902;
	line-height:1.2em;}
/*-----------------------------------------------------*/
/*-----------------|   04=content   |------------------*/
/*-----------------------------------------------------*/

div#contentContainer{
	margin: 0px auto;
	width:940px;
	position:relative;
}
div#contentMain {
	background: url(../images/index/bg/bg-content.jpg) no-repeat;
	margin-left:248px;
	min-height:550px;
	padding:50px 40px 20px 40px;
	width:660px;
}
*html div#contentMain {  /*---  IE6-Hack  ---*/
	height:550px;
}
#contentSidebar {
	background: url(../images/index/bg/bg-oeffnungszeiten.jpg) no-repeat;
	height:130px;
	left:0px;
	position:absolute;
	top:680px;
	width:216px;
	color: #ea7605;
	padding:45px 0 0 32px;
	line-height:1.2em;}

/*-----------------------------------------------------*/
/*--------------|   05=content-styles   |--------------*/
/*-----------------------------------------------------*/

.liste {
	margin:5px 0 5px 0px;
	padding:15px 0 0 25px;
}
.liste li {
	list-style-image: url(../images/li-arrow.gif);
	margin:5px 30px 3px 0px;
}
.ul-showlayer{ 
	font-size:1em;
	line-height:1.5em;
	margin:0px 0 25px 0;	
}
.ul-showlayer li {
	list-style-type: none;
	line-height:1.5em;
	margin-bottom:6px;
	text-align:justify;
}

.desk{width:150px;	height:20px;}
.value{height:20px;}

.headline{  /*---  headlines  ---*/
	height:65px;
	margin: -22px 0 0 40px;
	font-size: 0.001em;
	text-indent:-4000px;
}	
.h2-willkommen{ background: url(../images/index/headlines/bg-h2-willkommen.gif) no-repeat;}
.h2-cafe{ background: url(../images/index/headlines/bg-h2-cafe.gif) no-repeat;}
.h2-auszeichnungen{ background: url(../images/index/headlines/bg-h2-auszeichnungen.gif) no-repeat;}
.h2-auszeichnungen2011{ background: url(../images/index/headlines/bg-h2-auszeichnungen2011.gif) no-repeat;}
.h2-auszeichnungen2010{ background: url(../images/index/headlines/bg-h2-auszeichnungen2010.gif) no-repeat;}
.h2-auszeichnungen2009{ background: url(../images/index/headlines/bg-h2-auszeichnungen2009.gif) no-repeat;}
.h2-demeter{ background: url(../images/index/headlines/bg-h2-demeter.gif) no-repeat;}
.h2-natursauerteig{ background: url(../images/index/headlines/bg-h2-natursauerteig.gif) no-repeat;}
.h2-spezialitaeten{ background: url(../images/index/headlines/bg-h2-spezialitaeten.gif) no-repeat;}
.h2-natursauerteig{ background: url(../images/index/headlines/bg-h2-natursauerteig.gif) no-repeat;}
.h2-kinderbacken{ background: url(../images/index/headlines/bg-h2-kinderbacken.gif) no-repeat;}
.h2-ueber-uns{ background: url(../images/index/headlines/bg-h2-ueber-uns.gif) no-repeat;}
.h2-brezel{ background: url(../images/index/headlines/bg-h2-brezel.gif) no-repeat;}
.h2-briegel{ background: url(../images/index/headlines/bg-h2-briegel.gif) no-repeat;}
.h2-gaestebuch{ background: url(../images/index/headlines/bg-h2-gaestebuch.gif) no-repeat;}
.h2-kontakt{ background: url(../images/index/headlines/bg-h2-kontakt.gif) no-repeat;}
.h2-anfahrt{ background: url(../images/index/headlines/bg-h2-anfahrt.gif) no-repeat;}
.h2-impressum{ background: url(../images/index/headlines/bg-h2-impressum.gif) no-repeat;}
.h2-danke{ background: url(../images/index/headlines/bg-h2-danke.gif) no-repeat;}
.h2-error404{ background: url(../images/index/headlines/bg-h2-error404.gif) no-repeat;}

/*-----------------------------------------------------*/
/*---------------|  06=main-navigation   |-------------*/
/*-----------------------------------------------------*/

#navi {
	background:url(../images/index/bg/bg-navi.jpg) repeat-y;
	left:0px;
	top:213px;
	width:276px;
	position:absolute;
}
#navi ul {
	list-style: none;
}
#navi li {
	text-align: left;
}
#navi li a {
	color:#c00;
	background: url(../images/index/bg/border-navi-bottom.jpg) no-repeat bottom left;
	display:block;
	height:25px;
	line-height:22px;
	padding-left:10px;
	text-decoration: none;
	margin-left:15px;
}
#navi li a:hover {
	font-weight:bold;
	background:#feebcc;
	width:212px;
	margin-left:16px;
}

.bg-navi-baecker{
	background: url(../images/index/bg/bg-navi-baecker.jpg) no-repeat;
	height:30px;}

.bg-navi-geschichten{
	background: url(../images/index/bg/bg-navi-geschichten.jpg) no-repeat;
	height:40px;}

.bg-navi-kontakt{
	background: url(../images/index/bg/bg-navi-kontakt.jpg) no-repeat;
	height:40px;}

.border-bottom{
	background:url(../images/index/bg/bg-border-bottom.jpg) no-repeat;
	height:10px;
	margin-top:-2px;}
	
.aktiv{
	font-weight:bold;
	background:#feebcc;
	width:212px;
	margin-left:16px;
}
/*-----------------------------------------------------*/
/*------------------|   07=footer   |------------------*/
/*-----------------------------------------------------*/

div#footer {
	border-top: 1px solid #faebbc;
	padding:20px 0 20px 0;
	text-align:right;
	width:650px;
	margin-left:288px;
}

/* - Mobile Styles -*/
#mobile-link{
	border: 1px solid #ccc;
	background:#fff url(../images/mobile/bg-btn-desktop.png) repeat-x 0 bottom;
	display:none;
	clear:both;
	position:relative;
	z-index:99999;
}

.btn-mobile {
	display: block!important;
	margin: 0 auto;
	color: #666 !important;
	background:url(../images/mobile/icon-mobile.png) no-repeat 5% 24px;
	text-indent:20%;
	text-decoration: none!important;
	font-size:30px;
	padding: 60px 20px;
	text-transform: uppercase;
	border-bottom: 6px solid #ccc;
}