/* =======================================================

Allgemeine Styles

======================================================= */

/* =================== CSS-Reset ====================== */

body, div,
h1, h2, h3, h4, h5, h6,
p, blockquote, pre, code,
ul, ol, li,
table, th, td,
form, fieldset, legend, input, textarea { padding: 0; margin: 0; }

/* ============= Abstände restaurieren ================ */

h2, h3, h4, h5, h6,
p, blockquote, pre,
ul, ol {
       margin-bottom: 1em;
}

ul, ol { margin-left: 2em; }

ul ul, ul ol, ol ol, ol ul { margin-bottom: 0; }

blockquote { margin: 1em 2em; }

/* ====== HTML5-Elemente als Block definieren ========= */

header, nav, main, aside, footer,
section, article, figure, figcaption,
audio, video {
   display: block;
}

/* ==================================================== */

body { background-color: white; 
	   color: darkgrey;
	   text-align: left;
	   font-family: Arial, Helvetica, Verdana, sans-serif;
	   font-size: 87.5%;
}

a { text-decoration: none; }	    
a:link { color: darkgrey; }
a:visited { color: darkgrey; }
a:hover,
a:focus { color: #e6007e; }
a:active { color: darkgrey; }

/* =======================================================

Styles für die Layoutbereiche

======================================================= */

#wrapper {
	  margin-left: auto;
	  margin-right: auto;
	  margin-top: 90px;
	  margin-bottom: 150px;
	  width: 963px;
	  min-height: 990px;
}
#kopfbereich {
	  width: 963px;
	  height: 57px;
	  margin-bottom: 60px;
	  
}
#logo { 
      float: left;
	  margin-right: 504px;
	  padding: 0px;
	  width:306px;
      height:57px;
}

#shop {
	  float: left;
	  background:url(shop_weiss_78x57.png);
	  margin: 0px;
	  padding: 0px;
	  width: 78px;
	  height: 57px;
}

#shop :hover {
	  float: left;
	  background:url(shop_magenta_78x57.png);
	  margin: 0px;
	  padding: 0px;
	  width: 78px;
	  height: 57px;
}

.menue1 {
	  margin: 0px;
	  padding: 0px;
      font-size: 80%;
      font-weight: bold;
}


.menue2 {
	  margin: 0px;
	  padding: 0px;
      font-size: 60%;
}
#navibereich {
      float: left;
      margin: 0 2px 0 0;
      padding-right: 90px;
      width: 101px;
      height: 873px;
      
}
#navibereich p { 
      float: left; 
      margin: 0px;
      padding: 0px;
}
#navibereich ul {
	  float: left;
	  margin: 0px;
	  padding: 0px;
}	    
#navibereich ul li {
      float: left;
	  list-style-type: none;
}

#inhaltsbereich {
      float: left;
      width: 577px;
      min-height: 873px;
}

#inhaltsbereich img {
      margin-bottom: 40px;
      outline: 1px solid lightgrey;
      outline-offset: -1px;
}

#inhaltsbereich iframe {
      margin-bottom: 40px;
}

#inhaltsbereich video {
      margin-bottom: 40px;
}

#inhaltsbereich a { 
      font-size: 80%; 
      padding-bottom: 100px;
      
}

#side {
      float: left;
      width: 151px;
      height: 873px;
      margin-left: 2px;
      padding-left: 40px;
}

#side h1 { font-size: 100%; 
           color: #e6007e;
}
#side h2 { font-size: 80%; }
#side h3 { font-size: 60%; }
#side p { font-size: 80%; }

#side a { font-size: 80%;
          font-weight: bold;
}
