*{margin:0; padding:0;}  

html{
    background-color:#fdf5e6;
    font-family:Arial, Helvetica, sans-serif;
    font-size: 100.01%;
    color:#000;
  }

  body{  
    background-color:#f8f8ff;
    width:90%;
    margin:auto;
    margin-top:0px;
    /* border:2px solid #663300;*/    
  } 

  .wrapper:before{
    top:0;
    right:-15px;
    bottom:-15px;
    left:-15px;
    background:#fdf5e6;
    max-width:980px;
    width:100%;
    margin:0 auto;
    content:"";
    position:absolute;
    z-index:-1;   
  }

 .wrapper {
  position:relative;
	width:100%;
  max-width:980px;
 	border:1px solid #c9c9c9;
 	border-top:none;
  border-bottom:none;
 	height:100%;
	 margin:0 auto;	 
  }

    /* .wrap{
      width:960px;
      border:1px solid #663300;
      border-top:none;
      height:100%;
      margin:0 auto;
    } */

   .container{
    width:100%;
    margin-bottom:10px;
    margin-left: auto;
    margin-right: auto;
  }


    .center{text-align: center;}
/* Spalten mit float anordnen */
.fl-l{float:left;}
.fl-r{float:right;}
/* clears */
.clear,.clearfix:after{clear:both;}
/*.clearfix:after{
content:"";
display:table;
}*/
    h1{text-align:center;
      padding-left:0px;
    margin-top:10px;
  margin-bottom:10px;}

    h2{text-align:center;
    margin-bottom:12px;}

    p{padding-left:50px;
    padding-right:50px;}

  #teaser{
    /*text-align:center;*/
    margin-top:80px;
    padding-left:50px;
    padding-right:50px;
    margin-bottom:80px;
  }
  
#headline-center{
text-align:center;
}

#img-header{
  position:relative;
  justify-content: center;
  align-items:center;
  z-index:1;
  margin-top:-10px;
  margin-bottom:-5px;
   }


   /* navigation setup general*/
nav{        
  margin-top:20px;
  /* margin-left:150px; */
  text-align:center;
  line-height:40px;
  padding-left:100px;
  /* text-decoration-color:#ffcc00;
  background:#663300; */
  
}

a.active {
  background-color: #ffcc00;
  color: #663300;
}

  #navi {
  /* position:relative;
  float:left; */
  list-style:none;
  background:#ffffcc;
  padding-left:5px;
  
}

#navi a{        
  text-decoration:none;
  display:inline-block;
  color:#663300;
  padding:0 15px;
}

#navi a:hover{
  text-decoration:underline;
}

#navicont{
  position:absolute;
  margin-left:200px;
  margin-top:-35px;
    /*list-style:none;*/
  }
  
  #navicont li a{
    display:block;
    display:inline-block;
    text-decoration:none;
    
    }

/* #navi:hover > a, */
#navi a:hover,
#navi a:focus,
#navicont a:hover,
#navicont a:focus,
#navitop a:hover,
#natitop a:focus
{
background:#ffcc00;
color:#663300;
}

#navi .active a,
#navi .active a:hover,
#navi .active a:focus
#navicont .active a,
#navicont .active a:hover,
#navicont .active a:focus,s
#navitop .active a,
#navitop .active a:hover,
#navitop .active a:focus
{
background:#663300;   
color:#ffcc00;
} 



.picnav-l{
position:relative;
margin-top:50px;
margin-left:160px;
    }

.picnav-r{
position:relative;
margin-left:160px;  
}  

/* navigation: topcon is for the topbar and navigation to Impressum and Kontakt at the top of the pages */

.topcon {
  width:960px;
  border:1px solid #663300;
  border-top:none;
  height:100%;
  margin:0 auto;
  background:#663300;
  color:#cc9933;
  font-size:12px;
  line-height:20px;
  padding:5px;  
}

.topcon a{
  float:right;
  color:inherit;
  text-decoration:none;
  width:100px;
  margin-top:-18px;       
}

.topcon a:hover{
  text-decoration:underline;
}

#footer{
height:60px;
margin-top:100px;
padding:5px;
border:none;
background:#cc9933;
}

/*styling footer in the foot.php: ulfad, ulfcom, ulflegal means ul stands for ul, f stands for footer, then ad for Adresse, com  for communication, legal for the legal stuff */
#ulfad, #ulfcom, #ulflegal{
text-decoration:none;
list-style:none;
margin-top:7px;
margin-left:40px;

}

#ulfcom{ 
  margin-top:7px;
margin-left:100px;
}
      
/* navigation: bottom is for the navigation at the footer to Impressum and Kontakt of the pages */
 
      .bottom a{
        float:right;
        color:inherit;
        text-decoration:none;
        width:100px;
        margin-top: 0;       
      }

      .bottom a:hover{
        text-decoration:underline;
      }
  
      .center{text-align: center;}
  /* Spalten mit float anordnen */
  .fl-l{float:left;}
  .fl-r{float:right;}
  /* clears */
  .clear,.clearfix:after{clear:both;}  
   
.pagetitle{
  margin:10px;
  padding:10px;
}

      /* table */
      h3{text-align:center;
        margin-bottom:20px;}
        
            table{
                margin-left:70px;
            border:1px solid #000;
            /*border-spacing:1em;*/
            border-collapse:collapse;
          }
        
            tbody tr:nth-of-type(1){background:#ffcc00;
            font-weight:bold;}
        
            th{
                background:#cc9933;
            }
        
          td{border:1px solid #000;
            width:200px;
                height:30px;
                text-align:center;
                
          }
          col{width:100px;}    


/* contact form-styling*/
form{
  margin-top: 50px;
margin-left: 150px;
}

label{
  min-width:100px;
  display:inline-block;
} 

 input{border:1px solid#663300;}
 input{padding:5px;}
 input:hover{ border-color:#cc9933;}
 input:focus{background:#ffffcc;}
 
.form-style-1 input[type='submit'],
.form-style-1 input[type='reset'],
.form-style-1 input[type='button'] {
  background: #663300;
  padding: 7px 12px 7px 12px;
  border: none;
  color: #ffffcc;
}

.form-style-1 input[type='submit']:hover,
.form-style-1 input[type='button']:hover {
  background: rgba(61, 38, 2, 0.808);
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
}

.form-style-1 .required {
  color: red;
}

.form-style-1 input.error {
  border: 1px solid red;
}

.error {
  border: 1px solid red;
}

.error_required {
  color: red;
}