/* General Style */
body {
font-family: Verdana, Arial, Helvetica, sans-serif; 
font-weight: 200em;
color: #7c2919;
background:#fecc71; 
font-size:100%;
margin:0em;
padding: 0em;
text-align:left;
}

a:link { 
color: #0c632a; 
text-decoration: none;
}

a:visited { 
color: #08411c; 
}

a:hover { 
color: olive; 

}

a:active { 
color: #08411c; 
}

h1 {
font-size:1.5em;
text-align: left;
line-height:1.5em;
font-weight:bold;
padding-bottom: 1em;
}

h2 {
font-size:1em;
text-align: left;
line-height:1.5em;
padding-bottom: 1em;

}

h3 {
font-size:0.8em;
line-height:2em;
font-weight: bold;
margin:0em;

padding-bottom: 1em;
}


p {
font-size:0.8em;
line-height:2em;
margin:0em;



padding-bottom: 1em;
}

ul{
font-size:100%;
padding-bottom: 1em;
}

li {
font-size:100%;
list-style:square;
}

ul li a{

line-height:2em;

}


img {
width:90%;
height:auto;
max-width:100%;
}



/* On Top Bar */
#menubar {
display:block;
}
#menubar ul {
display:block;
width:2em;

}
#menubar ul li {
display:inline;
}
#menubar ul li a.menubutton {
display:none;
}


/* Navigation */
nav {
display:block;
height:5em;
background:#fee0a8;


padding-left: 0em;
}

nav ul {
display:block;

float: left;
}
nav ul li{
display:inline;
margin:0em 0.188em 0em 0.188em
}
nav ul li a{
line-height:3em;
transition:background 0.2s;
-webkit-transition:background 0.2s;
}















/* image container */
#imageContainer {
position: relative;
	width:100%;
height: 250px;


}
#imageContainer img {
position: absolute;
	display: none;
	width:100%;

	
}



#main headeralt {
text-align:center;
display:none;
}

#main headeralt img {
display:block;
width:100%;
}





/* Content Area */
#main {
display:block;
width:96%;
max-width:950px;
background:#fee0a8;
margin:0em auto;

box-shadow: 5px 5px 10px #707070;
}










#main menue { text-align:center; font-size:15px; position:relative; padding-top: 15px; }

#main menue ul { list-style-type:none; list-style-image:none; margin:0; padding:0; }

#main menue li { list-style-type:none; list-style-image:none;}

#main menue li.topmenue {
  float:center;
}

.topmenue a {
  float:right;
  width:17em;
  text-align:center;
}

.topmenue ul{
  display:none;
}

.topmenue a, 
.submenue a{ padding:3px 5px; border-collapse:collapse; color:#7c2919; font-size: 15px; font-family: Arial, Verdana, Helvetica, sans-serif; font-weight: normal; background-color:#fecc71; text-decoration: none; margin:0; border-right: 5px solid #fee0a8; }

.submenue a{
  font-size:15px;
  width:17em;
  position:relative;
  clear:both; /* special IE6 */
}

#main menue a:hover, .topmenue.on a { color:olive; background-color:#fee0a8; text-decoration: none; }

.topmenue:hover ul {
  display:block;  
  z-index:500;
}

















#main header {
text-align:center;

}

#main header img {


display:block;
width:100%;
}




#main breit {
display:inline-block;
width:80%;
background:#fee0a8;
vertical-align:top;
margin:0em;
text-align:left;

padding-left: 3em;
padding-right: 3em;

}


#main breit ul {
font-size:0.8em;
line-height:2em;
}



#main article { display:inline-block; width:50%; background:#fee0a8; vertical-align:top; margin:0; padding-right: 2em; padding-left: 3em; }

#main article ul {
font-size:0.8em;
line-height:2em;
}

#main article img {
max-width:500px;
}




#main aside {
display:inline-block;
width:40%;
padding-left:0.5em;
padding-bottom: 3em;
vertical-align:top;
}



#main aside section {
background:#fee0a8;

}

#main aside img {
max-width:200px;
}


/* Footer */
#main footer {
font-size:0.8em;
line-height:2.5em;
text-decoration: none;
color:#FFFFFF;
display:block;
background:#7c2919;
text-align:center;
}

#main footer ul {
width:96%;
max-width:950px;
text-align:left;
margin:0px auto;
}

#main footer ul li {
display:inline;
padding:0em 1em 0em 1em;
}

#main footer ul li a {
font-size:100%;
line-height:100%;
text-decoration: none;
color:#FFFFFF;
}

/* Mobile Style */
@media screen and (max-width:800px) {
body {
font-size:90%;
}
}


@media screen and (max-width:700px) {
#main aside, #main article {
width:80%;
display:block;
padding-left: 3em}
}







@media screen and (min-width:650px) {
nav.nav {
display:block !important;
}

}




@media screen and (max-width:650px) {
body {
font-size:86%;
}



footer ul li {
display:block !important;
}





#main menue {
display:none;
height:auto;

}




#menubar ul li a.menubutton {
display:block;
}
nav {
display:none;
height:auto;
}
nav ul li {
display:block;

}



#imageContainer {
height: 150px;
}

#main breit {
width:70%;
}



}