@charset "utf-8";
/* CSS Document */

* {
	padding: 0;
	margin: 0;
}
html {
	background-color:#000000;
	background-attachment: fixed;
	background-clip: border-box;
	background-image: url(../img/BG.jpg);
	background-origin: padding-box;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}
.craftbeer {
	background-image: url(../img/BG-craft.jpg);
}
.keller {
	background-attachment: fixed;
	background-clip: border-box;
	background-color: transparent;
	background-image: url(../img/BG_keller.jpg);
	background-origin: padding-box;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}
.haus1 {
	background-image: url(../img/hint_brauerei_aussen.jpg);
}
.haus2 {
	background-image: url(../img/hint_brauerei_aussen2.jpg);
}
.keller {
	background-image: url(../img/hint_gewoelbe-keller.jpg) }

.hof {
	background-image: url(../img/hint_hof.jpg);
}
.hof1 {
	background-image: url(../img/hint_hof1.jpg);
}
.innen1 {
	background-image: url(../img/hint_brauerei_innen4.jpg);
}
.innen2 {
	background-image: url(../img/hint_brauerei_innen2.jpg);
}
.innen3 {
	background-image: url(../img/hint_brauerei_innen3.jpg);
}
.gaeren1 {
	background-image: url(../img/hint_brauerei_innen3.jpg);
}
.gaeren2 {
	background-image: url(../img/hint_brauerei_innen3.jpg);
}
.lagern1 {
	background-image: url(../img/hint_tanks_neu.jpg);
}
.lagern2 {
	background-image: url(../img/hint_tanks_alt.jpg);
}
.brauen1 {
	background-image: url(../img/hint_brauprozess1.jpg);
}
.brauen2 {
	background-image: url(../img/hint_brauprozess2.jpg);
}
.brauen3 {
	background-image: url(../img/hint_brauprozess3.jpg);
}
.flaschen1 {
	background-image: url(../img/hint_flaschenfuellanlage.jpg);
}
.flaschen2 {
	background-image: url(../img/hint_flaschenfuellanlage2.jpg);
}
.fass {
	background-image: url(../img/hint_fassfuellung.jpg);
}
.alt1 {
	background-image: url(../img/hint_haehne_alt.jpg);
}
.alt2 {
	background-image: url(../img/hint_tanks_alt.jpg);
}

.export {
	background-image: url(../img/BG_export.jpg);
}
.obernachtwaechter {
	background-image: url("../img/BG_obernachtwaechter.jpg");
}


.hopfen {
	background-image: url(../img/hint_hopfen.jpg);
}
.malzboden {
	background-image: url(../img/hint_malz.jpg);
}
.filtration {
	background-image: url(../img/hint_filtration.jpg);
}
.aktuell {
	background-image: url(../img/BG_aktuell.jpg);
}
.urbrau {
	background-image: url(../img/BG_urbrau.jpg);
}
.weizen {
	background-image: url(../img/BG_weizen.jpg);
}
.malz {
	background-image: url(../img/BG_malz.jpg);
}
.rotgold {
	background-image: url(../img/BG_rotgold.jpg);
}
.pils {
	background-image: url(../img/BG_pils.jpg);
}
.alt {
	background-image: url(../img/BG_alt.jpg);
}
.vorder {
	background-image: url(../img/BG_vorder.jpg);
}
.hasper-gold {
	background-image: url(../img/BG_hasper-gold.jpg);
}
.doppelbock {
	background-image: url(../img/BG_doppelbock.jpg);
}
.AS {
	background-image: url(../img/BG_AS.jpg);
}
.gose {
	background-image: url(../img/BG_gose.jpg);
}
.colaboration {
	background-image: url(../img/BG_colaboration.jpg);
}
.porter {
	background-image: url(../img/BG_porter.jpg);
}
.abraxas {
	background-image: url(../img/BG_starkbier.jpg);
}
.methusalem {
	background-image: url(../img/BG_weissbier.jpg);
}
.muenchhausen {
	background-image: url(../img/BG_lager.jpg);
}
.preussen {
	background-image: url(../img/BG_preussen.jpg);
}
.best_brew_job {
	background-image: url(../img/BG_best_brew_job.jpg);
}
.prototyp {
	background-image: url(../img/BG_prototyp.jpg);
}
.schoko {
	background-image: url(../img/BG_schoko.jpg);
}

.IPA {
	background-image: url(../img/BG_IPA.jpg);
}

body {
	height: 100%;
	font-size: 100.01%;
	background-color: #000000;
	font-family: Arial, Helvetica, sans-serif;
}
#topnav {
	position: fixed;
	width: 100%;
	height: 42px;
	background-image: url(../img/BG_topnav.png);
	top: 0;
	z-index: 3;
	color: #b4c5bf;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 0.75em
}
#topnav a, #topnav a:visited {
	color: #fff;
	text-decoration: none;
	text-shadow: 1px 1px 0 #000000;
}
#topnav a:hover {
	color: #b4c5bf;
	text-decoration: none
}
#topnav img {
	margin-bottom: -4px
}
.topnavWIDTH {
	width: 1000px;
	margin: 9px auto
}
.topnavLEFT {
	float: left;
	letter-spacing: 0.05em;
	margin-top: 3px
}
.topnavRIGHT {
	float: right
}
.logo {
	width: 480px;
	height: 106px;
	position: absolute;
	top: 57px;
	left: 50%;
	margin-left: -240px;
	z-index: 2
}
#bier_aktuell {
	width:34%;
	height: auto;
	position: absolute;
	top: 250px;
	left: 30%;
	margin-left: -280px;
	z-index: 2;
	color: #fff;
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 0.8em;

}

.bier_aktuell-text {
	margin-bottom:23px;
	padding: 20px;
	background-image: url(../img/BG_content.png);

	}
#content {
	display:table;
	position: absolute;
	width: 500px;
	height: 100%;
	background-image: url(../img/BG_content.png);
	left: 50%;
	z-index: 1;
	color: #fff;
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 0.8em; 
}
.contentAREA {
	width: 450px;
	height: auto;
	margin: 180px 25px 50px 25px;
}
#content h1, #bier_aktuell h1 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 2.3em;
	color: #fff;
	font-weight: normal;
	margin-bottom: 0.5em;
	text-shadow: 2px 2px 0 #000000;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#000000, direction=113, Strength=3)
}
#content h2 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.8em;
	color: #16d06e;
	font-weight: normal;
	margin-bottom: 0.5em;
	text-shadow: 1px 1px 0 #000000;
}
#content h3, #bier_aktuell h3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 0.9em;
	color: #ccb35b;
	font-weight: normal;
	margin-bottom: 0.3em
}
#content h4, #bier_aktuell h4 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.3em;
	color: #16d06e;
	font-weight: normal;
	margin-bottom: 0.5em;
	text-shadow: 1px 1px 0 #000000;
}
#content h5 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.3em;
	color: #ccb35b;
	font-weight: normal;
	margin-bottom: 0.5em;
	text-shadow: 1px 1px 0 #000000;
}
#content p, #bier_aktuell p {
	margin-bottom: 0.7em
}
#content a, #content a:visited, #bier_aktuell a, #bier_aktuell a:visited {
	color: #e4844a;
	text-decoration: none
}
#content a:hover, #bier_aktuell a:hover {
	color: #ccb35b;
	text-decoration: none
}
#content hr, #bier_aktuell hr {
	border: none;
	border-top: 1px solid #5f5f5f;
	color: #5f5f5f;
	background-color: #5f5f5f;
	height: 0px;
	margin: 15px 0;
}
.pictcopy {

	padding: 3px;
	border: 1px solid #858585;
}
.pictcopyL {
	float: left;
	font-size: 11px;
	color: #858585;
	margin: 2px 16px 9px 0;
	padding: 3px;
	font-style: italic;
	border: 1px solid #858585;
}
.pictcopyR {
	float: right;
	font-size: 11px;
	color: #858585;
	margin: 0 0 9px 16px;
	font-style: italic;
	padding: 3px;
	border: 1px solid #858585;
}
.pictcopyL p, .pictcopyR p {
	margin: 5px
}
.pic-border {
	border: 1px solid #999
}
.picticonL {
	float: left;
	font-size: 11px;
	color: #858585;
	margin: 2px 16px 9px 0;
	padding: 0px;
	font-style: italic;
	border: 0px solid #1a7d57;
}
.arr {
	font: bold 1.7em/0.5em Arial;
	vertical-align: -5%;
}
.arr-kl {
	font: bold 1.2em/0.5em Arial;
	vertical-align: -5%;
}
.tabUntertitel {
	font-size: 0.85em;
	color: #5c5c5c;
	font-style: italic;
	margin-top: 10px
}
.klein {
	font-size: 10px
}
.rot {
	color: #bd3737;
}
.gelb {
	color: #a7934b;
}
#quicknav {
	display: none
}
.TopAreaMobile {
	display: none
}


.mobile-img {display:none}

@media only screen and (max-width: 800px) {

.topnavWIDTH {
	width: 100%;
	margin: 9px auto
}
}

@media only screen and (max-width: 640px) {
	
.abstand180 {	margin: 0px 0px 20px 0px !important}	
   

.mobile-img {display: block}
    
    .no-bg { background:none !important;}


#content {
	position: relative !important;
	width: 95%;
	left: 0%;
	z-index: 1 !important;
	font-size:15px;	float:left;
	margin:20px;

}
.contentAREA {
	width: 98%;
	z-index: 12 !important;
	margin: 5px 1% 50px 1% !important;
}


/* #content_menu h3, #content_menu a {
	font-size: 1.0em;
	padding: 0px 4px 0px 4px;
}
#content_menu h3
	{border-right: 1px solid #666666}*/
	
#content_menu  { 
margin-left:15px;
width:103%;
padding-left:0px}
#content_menu ul {padding-left:0px}
	
.content_menu-mob  {
	display:block!important;
	width: 98% !important;
	float: left; 

}

.content_menu-mob  ul {
	width: 98% !important;
	list-style: none;
	margin:0px;
	padding:0px 0px 0px 21px !important;
	background-image:url(../img/BG_content_nav.png); 		
	font-size: 1.3em;}

	
	
content_menu-mob h3 {
	font-size: 1.3em;
	padding: 2px 4px 2px 4px;
}

a.content_menu-mob:link {
	font-size: 1.3em;
	padding: 2px 4px 2px 4px;
}


h3.content_menu-mob

	{border-right: 1px solid #666666}
	
	
.no-mob {
	display: none
}

.pictcopyL, .pictcopyR  { font-size:15px}
	

.logo {
	position: absolute;
	top: 1px;
	left: 1%;
	margin-left: 15px;
	width: 72%;
	z-index: 2
}

.logo img {width: 100%}
    
    .logo-mob-start {	width: 80%;position: relative; margin:0px auto;  }

#bier_aktuell {
	position:relative!important;
	width:100%;
	float:left!important;
	top:auto!important;
	left:0%;
	margin-left:0px;
	z-index: 2;
	color: #d0d0d0;
	font-family: Tahoma, Geneva, sans-serif;
	}
.bier_aktuell-text {
	margin:20px;
	font-size:14px
}

/********************* quicknav ***************************/
#quicknav {
	display: none;
	width: 45%;
	border-left: 1px solid #015d3c;
	/*float:left;
	clear:both;
		line-height:180%;background-image: url(../img/quicknav_arr.png);*/
	position: absolute;
	top: 0px;
	right: 0px;
	z-index: 1000!important;
	padding: 0px;
	color: #fff;
}
#quicknav ul {
	list-style-position: inside;
	list-style-type: none;
	float: left;
	width: 100%;
	padding: 0px;
	font-family: Tahoma, Geneva, sans-serif !important;
	font-size: 1.1em;
	background: #023621; /* Old browsers */
	background: -moz-linear-gradient(top, #023621 0%, #155432 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #023621), color-stop(100%, #155432)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #023621 0%, #155432 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #023621 0%, #155432 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #023621 0%, #155432 100%); /* IE10+ */
	background: linear-gradient(to bottom, #023621 0%, #155432 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#023621', endColorstr='#155432', GradientType=0 ); /* IE6-9 */
}
#quicknav a, #quicknav a:visited {
	display: block;
	border-bottom: 1px solid #015d3c;
	padding: 6px 0px 6px 15px;
	width: auto;
	color: #fff;
	font-weight: normal;
	margin-bottom: 0em;
	text-decoration: none;
	
}
#quicknav a:hover {
	color: #01b675;
}
#quicknav h2 {
	border-top: none !important;
	color: #012517 !important;
	text-transform: uppercase;
	padding: 0px 0px 0px 0px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: bold;
	display: block;
	font-size: 1.15em;
	background: #01744b;
	background: -moz-linear-gradient(top, #01744b 0%, #01b675 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #01744b), color-stop(100%, #01b675)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #01744b 0%, #01b675 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #01744b 0%, #01b675 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #01744b 0%, #01b675 100%); /* IE10+ */
	background: linear-gradient(to bottom, #01744b 0%, #01b675 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#01744b', endColorstr='#01b675', GradientType=0 ); /* IE6-9 */
}
#quicknav h2 a {
	color: #fff !important;
}
#quicknav h3 {
	border-top: none !important;
	color: #012517 !important;
	padding: 0px 0px 0px 0px;
	font-style:italic;
	font-weight: bold;
	display: block;
	font-size: 1.0em;
	background: #023621;
}
#quicknav h3 a {
	color: #fff !important;
}
#quicknav ul ul li a {
	color: #fff !important;
	font-family: Tahoma, Geneva, sans-serif !important;
	font-weight: normal;
	text-shadow: #172B08;
	font-size: 0.9em;
}
div#quicknav ul li ul li:hover, div#quicknav ul li ul li:hover {
	background: #ccb35b; /* Old browsers */
	background: -moz-linear-gradient(top, #a58512 0%, #e5bd27 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a58512), color-stop(100%, #e5bd27)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #a58512 0%, #e5bd27 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #a58512 0%, #e5bd27 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #a58512 0%, #e5bd27 100%); /* IE10+ */
	background: linear-gradient(to bottom, #a58512 0%, #e5bd27 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a58512', endColorstr='#e5bd27', GradientType=0 ); /* IE6-9 */
}
.TopAreaMobile {
	display: block;
	width: 100%
}
.TopAreaMobile img {
	width: 100%;
}
}

@media only screen and (max-width: 640px) { 

#quicknav {width:77%}

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

.img-mob  {
	margin: 0px 0px 5px 0px;
	 float: none !important;
	clear:both!important;
	width: 100% !important;
	font-size: 15px;
	color:#ffffff
}
    .pictcopy-home { width: 98% }

#content_menu  {
	display: none;
	width: 98%;
	float: left;
	
}

}
/************************************************************************************
                D R U C K V E R S I O N
*************************************************************************************/

@media print {
html {
	background-image: none !important;
	background-color: #FFFFFF;
}
 .haus1, .haus2, .innen1, .innen2, .innen3, .gaeren1, .gaeren2, .lagern1, .lagern2, .brauen1, .brauen2, .brauen3, .flaschen1, .flaschen2, .alt1, .alt2, .hopfen {
background-image:none !important;
background-color:#FFFFFF !important;
}
#content {
	position: absolute;
	width: 95% !important;
	height: auto;
	left: 0%;
	z-index: 1;
	color: #000000;
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 0.8em;
}
#topnav {
	display: none
}
.contentAREA {
	width: 95% !important;
	height: auto;
	margin: 120px 25px 50px 25px;
	left: 0%;
}
#content h1 {
	font-family: "Times New Roman", Times, serif;
	font-size: 2.3em;
	color: #1a7d57;
	font-weight: normal;
	margin-bottom: 0.5em;
	text-shadow: none !important;
}
#content h2 {
	font-family: "Times New Roman", Times, serif;
	text-shadow: none !important;
}
#content h3 {
	font-family: "Times New Roman", Times, serif;
	text-shadow: none !important;
}
#content h4 {
	font-family: "Times New Roman", Times, serif;
	text-shadow: none !important;
}
#content h5 {
	font-family: "Times New Roman", Times, serif;
	text-shadow: none !important;
}
.logo {
	position: absolute;
	top: 1px;
	left: 50%;
	margin-left: -240px;
	z-index: 2
}
}