@import url('https://fonts.googleapis.com/css?family=Nunito:400,700');
*{
    -webkit-box-sizing: border-box;   /* weis ich nicht */
    -moz-box-sizing: border-box;     /* weis ich nicht */
    -o-box-sizing: border-box;/* weis ich nicht */
     box-sizing: border-box;/* weis ich nicht */
    
}
body{
    font-family: 'Roboto', sans-serif;   /* Schriftart */
    background-image: url(inc/Holzwand.jpg);
    background-size:cover;
    background-repeat: no-repeat;/* Hintergrundbild wiederholen */
    background-attachment: fixed;/* Hintergrund bild nicht mitscrollen */
    margin: 0;/* keinen Rand nach ausen */
    
}

a{/* alle links */
    text-decoration: none;  /* Unterstriche weg */
    color: #b65423;         /* Farbe aller links */
    
}

.Test{
background-image:url(inc/Holzwand.jpg);
background-size:cover;
background-attachment:fixed;
width: 100%;
position: fixed;
left: 0;
top: 0;
border-bottom:1px solid transparent;
border-top:1px solid transparent;
    

}
#logo{
margin-left: 150px;
 float: left;   
}



.main-header,.intro,.intro-content,.columns,.slogan,.legal,.content-container,.content,.gallery{/* Inhalt breite */
    max-width: 960px;/* Inhalt breite */
    padding: 20px;/* Rand zur inhaltsbreite */
    margin: 0 auto; /* Rand bis zum fenster ende */
    
}



.main header.logo{  
float: left;/* Lässt logo nach links fließen */
}

.main-header nav{
    
    float: right;  /* Lässt Navigation nach rechts fließen */
    margin-top: 22px;  /* Abstand zur navigation von oben */
    margin-right: 37px;
    background: rgba(255, 255, 255, 0.7);

}


.main-header ul{  /* Element der nav */
    list-style:none;  /* Entfernt sämtliche Style elemente der Liste */
    margin: 0;      /* Elemente der nav */
    padding: 0;   /* Elemente der nav */
    padding: 10px;
    
}

.main-header ul li{ /* Ul */
    float: left; /* Lässt die Menü Punkte nach links fließen und so nebeneinander Gliedern */ 
    
}
.main-header nav a{
    display: block; /*  Durch display: block; wird es zu einem Block-Element, das dann rechts an der Seite ausgerichtet wird. */
    padding: 10px 20px; 
    text-transform: uppercase; /* Großschrift */
    font-size:23px; /* schriftgröße */
    font-weight: 300;/* schriftdicke */
    color:black;/* schriftfarbe */
    border-bottom: 3px solid transparent; /* Kasten um den Link */
    transition: all .5s ease;  /* Verlauf zur Hover klasse*/
}

.main-header nav a:hover{ /* Was Passiert beim überfahren des linkes */
    border-bottom: 3px solid #ea4c0e; /* Farbe ändern */
    
}

.main-header nav .current a{ /* Die aktuell ausgewählte seite im menü */
color:#ea4c0e;/* Farbe ändern */
}
.intro-container { /* Eingangsinhalt */
background-image:url(inc/Steyr.jpg);/* hintgrund der Pseudoklasse */
background-size:cover; /* anzeige des hintergundes */
background-position: 50% 37%;/* Zentieren */
width: 100%;/* Breite des Containers */
height:100%; /* Höhe des Containers */
}
 
.intro{
    text-align: center;
    padding-top: 0px;
    opacity:1;
    padding-top: 650px;
    
}
.intro-content-container{
background-image: url(inc/Holzwand.jpg);
background-size:cover; /* anzeige des hintergundes */
background-attachment: fixed
}

.intro-content{
background: rgba(255, 255, 255, 0.7);
padding-top:30px;
}

.intro-text{
text-align: left;    
width: 100%;
padding: 0px;
box-sizing: border-box;
border-radius:13px;
background: rgba(255, 255, 255, 0.7);
padding-top: 6px;
padding-bottom: 16px;
margin-bottom: 20px;
border: 1px solid #bfbfbf;
}

.intro-text h2{
font-family: 'Nunito', sans-serif;
font-weight: 400;
text-align: left;
color: #555555;
font-size: 17px;
margin-top: 0;
padding-bottom:6px; 
border-bottom:1px solid #ea4c0e;
margin-left: 6px;
}
.uberschrift img{
vertical-align:text-bottom;
margin-left: 6px;
}

.text{
    margin-left: 20px;
}

.intro-text p{
font-family: 'Nunito', sans-serif;
font-weight: 700;
text-align: left;
color: #555555;
font-size: 14px;
float: left;
width: 50%;
}
















.footer-container{
background: rgba(46, 46, 46,0.32);   
}
.legal{
background: #2e2e2e;
color: #e3d8c6;
}

.legal a {
color: #e3d8c6;
font-weight: 700;
border-bottom: 1px solid transparent;
padding-bottom: 2px;
transition: all .5s ease;
}

.legal a:hover{
    
border-bottom: 1px solid #e3d8c6;  
    
}

.legal img{
margin: 0 4px;
vertical-align: text-bottom;
}
/* Clearfix */

.clearfix:before,
.clearfix:after {
    content: "";
    display: table;
    
}

.clearfix:after{
clear: both;
}

/* Mediaqueries */



@media screen and (max-width:850px)
{
    
    main-header.logo,.main-header nav,.main-header li{
        
        float: none;
    }   
    
    .main-header li{
    display: inline-block;
    }
    
      .main-header Nav{      
    display: inline-block;
    padding-top: 10px;
    }

    .main-header{
    text-align: center;
    }
      
}


@media screen and (max-width:700px){
    .intro-container{
        height: 200px;
    }
    
    .intro{
    padding-top: 20px;
    }
    .intro h1{
    font-size: 30px;        
    }    
    .intro h1 span{
        font-size: 16px;
    }
}
}