/*##########################################
  Stylesheet TYPO3 CMS 6.2 Webseitenlayout
  Datei: style.css
  Autor: Karen Falkenberg
  ##########################################*/

/* ###### Grundgeruest ######*/

html {
 
}

body {
  margin: 2%;
  background: #ffffff;
  font-family:Arial, Helvetica, sans-serif;
     box-sizing:border-box;
     *behavior: url(boxsizing.htc);
     -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
}

/* ###### Container - Banner und Inhalte - ###### */

#container {
  position:relative;
  margin: 0 auto;
  padding: 2%;
  max-width: 970px;
  background:#F3F0F0;
}

header {
  top:15px;
  margin: 0;
  width: 100%;
  height: 370px;
  background:url(../images/banner.jpg) 0 0 repeat;
}

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

/*  ###### Inhaltsbereich ###### */

#content {
  float: left;
  width: 100%;
  margin-top:2%:
  margin-bottom: 5%;
  padding-top: 1%;
  top:0;
}

#content h1 {
  margin-bottom: 0em !important;
   color:#000000;
  font-size: 2.0em;
}

#content h2 {
  margin-bottom: 0em !important;
  color:#000000;
  font-size: 1.4em;
}



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



article {
  float:left;
     width:74%;
}

aside {
     width:23%;
  float:right;
}

/*  ###### Footerbereich ###### */

footer {
  float:left;
  margin-top:2%;
  color:#F8F4F4;
  width:100%;
  height:auto;
  background:#4F4F4F;
  font-size: 0.75em;
}


#impressum {
  float:left;
  margin: 0 2% 0 2%;
  width:46%;
}

#kontakt {
	float:left;
	width:46%;
	margin: 0 2% 0 2%;
	text-align:right;
}
	
	

.links {
  float:left;
  width:28%;
}

.rechts {
  float:right;
  padding-top:15px;
  width:68%;
  font-size:1.4em;
}

.rechts a ,
.rechts a:link,
.rechts a:hover,
.rechts a:visited,
.rechts a:active {
        color: #000;
  text-decoration: none;
}

#clear {
    clear: both;
}


/* Allgemeine Einstellungen */

a, a:visited, a:active, a:link {
   color: #bbb8b8;
  
}

a:hover {
   color:#bbb999;
  
}

/* Zusatzsymbole */
.download img,
.external-link img,
.external-link-new-window img,
.internal-link img,
.internal-link-new-window img,
.mail img {
    width: 14px !important;
    height:10px !important;
}
/*  ###### media screen max-width 960px ###### */

@media screen and (max-width:960px) {
/* Slider */

header {
  height: 334px !important;
}

#article {
  margin-left: 2%;
  padding-top:1%;    
}

#aside {
  margin-right: 2%;
  padding-top:1%;
}  

#content img {
    width:100%;
}
  
  
}

/*  ###### media screen max-width 800px ###### */
@media screen and (max-width:800px) {

article,
aside   {
  width: 100%;
  text-align:center;
}


header {
  height: 273px !important;
}

.links,
.rechts {
  width: 100%;
  text-align:center;
  font-size:1.4em;
}

footer {
  height:auto;
}  
}


@media screen and (max-width:600px) {
header {
  height: 179px !important;
}
}

@media screen and (max-width:450px) {
header {
  height: 147px !important;
}

#kontakt,
#impressum {
	width:100%;
	text-align:center;
}
}