﻿/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain) */


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* ++++++++++++++++++++
	  BCS-Styles 
++++++++++++++++++++++++++ */ 

html {height:100%;}

body {
 font-family:"Roboto", sans-serif;
 font-weight:300;
 height:100%;
 margin:0%;
 padding:0%;
 background: url(../img/bg.png) repeat fixed;
 background-color:#ffffff;
}

h1{font-size:2.7em;font-weight:900; margin-bottom:25px; font-style:italic;}
h2{font-size:1.6em;font-weight:900; margin-bottom:20px; margin-top:15px;}
h3{font-size:1.4em;font-weight:700; margin-bottom:10px;}
p{ margin: 0 0 20px 0;}

a:link, a:visited{
  text-decoration:none;
  color:#2f3196;
  text-shadow:0 0 0 transparent;
  -moz-transition: color 0.8s ease, text-shadow 0.8s ease;
  -webkit-transition: color 0.8s ease, text-shadow 0.8s ease;
  -ms-transition: color 0.8s ease, text-shadow 0.8s ease;
  -o-transition: color 0.8s ease, text-shadow 0.8s ease;
  transition: color 0.8s ease, text-shadow 0.8s ease;
}

a:hover, a:active{
  text-decoration:none; 
  color:#0066ff;
  text-shadow:0px 0px 5px #ffffff;
}

#alles {
 margin:0 auto;
 padding:0;
 width:90%;
 max-width:1280px;
 border-left:1px solid #9f8146;
 border-right:1px solid #9f8146;
 background-color:rgba(255, 255, 255, .9);
 height: 100%;
 position: relative;
}

#title {
padding:0 0 15px 0;
margin:0 auto;
background-color:#ffffff;
width:420px;
height:260px;
}
#title img{ width:420px; height:260px; }

#header {
margin:0 auto;
border-bottom:1px solid #9f8146;
}
#header > h1{ color:#9f8146; padding: 20px 20px 10px; text-align:center;}

#content {
margin:0 auto;
width:70%;
text-align:center;
position: absolute;
top: 50%;
transform: translateY(-50%);
padding: 34%;
}

#content > h1{ color:#000080; }
#content > h2{ color:#000080; }
#content p{ font-size:1.2em; line-height:1.6em; }
#content ul{ font-size:1.2em; line-height:1.6em; }
#content > video, .resized {  
   width:100%; 
   max-width:750px; 
   height:auto;
}

#playplay{
border: 1px solid #000;
max-width: 1000px;
}

.centertext{
margin:0 auto;
width:68%;
max-width: 750px;
text-align:left;
margin-bottom: 20px;
font-size:1.2em;font-weight:400;line-height:1.2em;
}

.impressum{
margin:0 auto;
width:68%;
text-align:left;
margin-bottom: 20px;
font-size:1.2em;font-weight:400;line-height:1.2em;
}

.schwoof{
/* font-family: 'Petit Formal Script', cursive; */
margin:0 auto;
max-width: 1000px;
text-align:left;
color:#d2ab66;
font-size:1.2em;
font-weight:700;
line-height:1.6em;
margin-bottom: 20px;

}

#footer {
padding:10px 10px;
border-top:1px solid #9f8146;
border-bottom:1px solid #9f8146;
margin:15px 0;
font-size:1em;
font-weight:400;
background-color:rgba(159, 129, 70, .2);
clear:both;

}
#footerp {
padding:10px 10px;
border-top:1px solid #9f8146;
border-bottom:1px solid #9f8146;
margin:15px 0;
font-size:1em;
font-weight:400;
background-color:rgba(159, 129, 70, .2);
clear:both;
position: absolute;
bottom: 0px;
width: 100%;
max-width: 1260px;
}
#footclear {
margin-bottom:10px;
height:10px;
}

.cl {
clear:both;
}

.righted {
float:right;
}

.huged {
font-size:1.3em;font-weight:900;
}

.moarhuged {
font-size:1.5em;font-weight:900;
}

.redded{
color:#ac0000;
}

.spaced {
margin-bottom:20px;
}

.morespaced {
margin-bottom:40px;
}

.muchmorespaced {
margin-bottom:60px;
}

.rightspaced {
margin-right:20px;
}

.toppopper{
padding-top:30px;
}

.lined {
border: 1px solid #000080;
}

.ulined {
text-decoration: underline;
}

.resizd {  
   width:100%; 
   max-width:300px; 
   height:auto;
}

.nized {  
   width:100%;
   max-width: 450px;
   height:auto;
   border: 5px solid #fff;
   box-shadow: 5px 5px 10px grey;
}

.scriptify{
font-family: 'Petit Formal Script', cursive;
font-weight:700;
}

.goldify{
color:#9f8146;
}

.blackify{
color:#000;
}

.boldify{
font-weight:bold;
}

.noncursive{
font-style:normal;
}

.boldify{
font-weight:bold;
}

.menulogo {  
   width:100%; 
   max-width:200px; 
   height:auto;
   float:left;
   margin: 5px 20px;
}

.sunslider{
max-width: 900px;
margin: 40px auto;
}

.dottify{
list-style-type:disc;
}

.bcmap{
width:800px;
height:500px;
border:1px solid #9f8146;
}





.menu:link, .menu:visited{
  -moz-transition: background-color 0.8s ease;
  -webkit-transition: background-color 0.8s ease;
  -ms-transition: background-color 0.8s ease;
  -o-transition: background-color 0.8s ease;
  transition: background-color 0.8s ease;
}

.menu:hover, .menu:active{
  background-color:#f2d19c;
}

.nav ul { display: none; list-style: none; padding: 0px; margin: 0px; font-weight: bold; text-align: center; line-height:2.0em}
.nav ul li { display: inline-block; text-align: left;}
.nav ul li a { display:inline-block; padding: 15px 10px; text-decoration: none;}
.nav ul li a:hover { }

.anchor-link { display: block; text-align: center; padding: 10px 15px; background-color: #f2d19c; text-decoration: none; margin: 3px; float: right; }

#mobile-nav { display: block; }
#mobile-nav ul { list-style: none; margin: 0px; padding: 0px; }
#mobile-nav ul li { list-style: none; text-align: center; }
#mobile-nav ul li a { display: block; padding: 20px 10px; border-top: 1px solid #9f8146; text-decoration: none; background-color:#f2d19c;}
#mobile-nav ul li a:hover { background-color: #f2d19c;  }

@media all and (min-width:48em){
	
	.nav ul { display: block; }
	.anchor-link { display: none; }
	#mobile-nav { display: none; }
	
}







.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12 {
color: #000000;
margin-bottom: 20px;
text-align: center;
padding: 10px 0 0;
background-color:rgba(159, 129, 70, .2);
}

.neutral {
background: none;
text-align: left;
}
.neutralmid{
background: none;
}

/*
.onerow a img, #content  a  img { 
  opacity: 0.88; 
  -webkit-transition: all 0.5s ease; 
  -moz-transition: all 0.5s ease; 
  -o-transition: all 0.5s ease; 
} 
.onerow a img:hover, #content  a  img:hover { 
  opacity: 1; 
  -webkit-box-shadow: 0px 0px 20px rgba(255,255,255,0.8); 
  -moz-box-shadow: 0px 0px 20px rgba(255,255,255,0.8); 
  box-shadow: 0px 0px 20px rgba(255,255,255,0.8); 
  /*-webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -o-transform: rotate(-3deg);*/
} 
*/


	
@media screen and (max-width : 1024px) {
	.bcmap{width:600px;height:300px;}
}

@media screen and (max-width : 768px) {
	
	h1{font-size:2.3em;font-weight:900; margin-bottom:25px;font-style:italic;}
	h2{font-size:1.5em;font-weight:900; margin-bottom:10px; margin-top:15px;}
	h3{font-size:1.3em;font-weight:700; margin-bottom:20px;}
	#alles{width:90%;}
	#content{width:80%;padding:10px 8px 10px 8px;}
	.centertext{font-size:1.2em;font-weight:400;line-height:1.1em;width:78%;}
	.schwoof{font-size:1.2em;font-weight:400;line-height:1.1em;}
	.impressum{font-size:1.2em;font-weight:400;line-height:1.1em;width:78%;}
	#linklist{width:70%}
	.onerow {margin: 0 0 0;}
	#footer { display:none; }
	.bcmap{width:490px;}
}

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

	h1{font-size:2.1em;font-weight:900; margin-bottom:25px;font-style:italic;}
	h2{font-size:1.4em;font-weight:900; margin-bottom:10px; margin-top:15px;}
	h3{font-size:1.2em;font-weight:700; margin-bottom:20px;}
	#alles{width:100%;}
	#content{width:88%;padding:8px 5px 8px 5px;}
	#content p {font-size:1em; line-height:1.2em;}
	#content ul {font-size:1em; line-height:1.2em;}
	.centertext{font-size:1.1em;font-weight:400;line-height:1.1em;width:78%;}
	.impressum{font-size:1.1em;font-weight:400;line-height:1.1em;width:78%;}
	#schwoof{font-size:1.1em;font-weight:400;line-height:1.1em;}
	.bcmap{width:380px;}
}

@media screen and (max-width : 480px) {
	
	h1{font-size:1.9em;font-weight:700; margin-bottom:25px;font-style:italic;}
	h2{font-size:1.3em;font-weight:700; margin-bottom:10px; margin-top:10px;}
	h3{font-size:1.2em;font-weight:400; margin-bottom:20px;}
	#title {	width:300px; height:187px; padding:0 0 10px 0; }
	#title img{ width:300px; height:187px;}	
	#header > h1{clear:both;}
	#content{width:90%;padding:6px 4px 6px 4px;}
	
	.centertext{font-size:1.1em;font-weight:400;line-height:1.1em;width:89%;}
	.schwoof{font-size:1.1em;font-weight:400;line-height:1.1em;}
	.impressum{font-size:1.1em;font-weight:400;line-height:1.1em;width:89%;}
	#alles {border-left:0px;border-right:0px;}
	.bcmap{width:250px;}
}

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

	h1{font-size:1.5em;font-weight:700; margin-bottom:25px;font-style:italic;}
	h2{font-size:1.2em;font-weight:700; margin-bottom:10px; margin-top:10px;}
	h3{font-size:1.1em;font-weight:400; margin-bottom:20px;}
	#title {	width:250px; height:156x; padding:0 0 5px 0;}
	#title img{ width:250px; height:156px;}	
	#content{width:95%;padding:5px 2px 5px 2px;}
	.centertext{font-size:1.0em;font-weight:400;line-height:1.0em;width:94%;}
	.schwoof{font-size:1.0em;font-weight:400;line-height:1.0em;}
	.imporessum{font-size:1.0em;font-weight:400;line-height:1.0em;width:94%;}
	#alles {border-left:0px;border-right:0px;}
	
}