body {
    margin: 0;
    font: 1em/1.5 Helvetica, Arial, sans-seif;
    background: #84945c;
    background-image: url(bilder/background/backhtml.jpg);
    background-attachment: fixed;
}


.wrapper {
    max-width: 960px;
    width: 100%;
    margin: 0 auto;
    background-color: rgba(222, 222, 222, 0.67);
    font-size: 15px;
}

h1,
h2,
h3 {
    font-weight: bold;
}

h1 {
    font-size: 1.6em;
    text-align: center;
    padding: 140px;
}

h2 {
    font-size: 1.5em;
    text-align: center;
}

h3 {
    font-size: 1.4em;
}

li {
    font-size: 0.9em;
    color: black;
}

a {
    text-decoration: none;
}

nav ul li a {
    text-decoration: none;
    color: #000;
    padding: 0.5em;
    font-size: 1.5em;
}

nav ul li a:hover {
    background-color: #5c6834;
    color: #fff;
}

a.linkout {
    font-size: 1.1em;
    color: rgb(37, 9, 132);
    padding: 0.1em 0.1em 0.1em 0.0em;
 background: -moz-linear-gradient(top, rgba(180,227,145,0.3) 0%, rgba(180,234,164,0.59) 50%, rgba(180,234,164,0.6) 51%, rgba(180,227,145,0.3) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(180,227,145,0.3) 0%,rgba(180,234,164,0.59) 50%,rgba(180,234,164,0.6) 51%,rgba(180,227,145,0.3) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(180,227,145,0.3) 0%,rgba(180,234,164,0.59) 50%,rgba(180,234,164,0.6) 51%,rgba(180,227,145,0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4db4e391', endColorstr='#4db4e391',GradientType=0 );
}

a.linkout:hover {
    font-size: 1.1em;
    color: #040;
}

nav {
    width: 100%;
    max-width: 960px;
    position: fixed;
    top: 0;
    z-index: 2;
    display: block;
    text-align: center;
    background: rgba(232, 244, 224, 0.92);
    padding: 0;
    margin: 0;
}

nav ul {
    list-style-type: none;
    padding: 0;
    margin: 8px 0 5px 0;
}

nav ul li {
    display: inline-block;
}

.wrapper-banner {
    background-image: url(bilder/background/hochkant.jpg);
    position: relative;
    height: 600px;
    width: 100%;
    margin: 0 auto;
}


.slogan {
    position: absolute;
    top: 40%;
    left: 12%;
    max-width: 736px;
    width: 80%;
}


section {
    padding: 25px 0;
    height: auto;
    font-size: 20px;
}


.wrapper-text {
    width: 95%;
    max-width: 960px;
    margin: 0 auto;
    padding-bottom: 1%;

}

.wrapper-text h2 {
    padding-top: 35px;
    padding-bottom: 20px;
    margin: 0;

}

.part1text {}

.schaubild {
    max-width: 100%;
    width: 500px;
    float: left;
    padding-right: 4%;
    padding-bottom: 0.4%;
}

.part2text, .part3text {
    -webkit-column-count: 2;
    /* Chrome, Safari, Opera */
    -moz-column-count: 2;
    /* Firefox */
    column-count: 2;
    -webkit-column-gap: 40px;
    /* Chrome, Safari, Opera */
    -moz-column-gap: 40px;
    /* Firefox */
    column-gap: 40px;
}

.ab {
    width: 42%;
    float: left;
    padding: 2% 4% 2% 0;
}

.mikropartikelbildcd {
    width: 98%;
    float: left;
    padding: 2% 2% 10% 0;
}

#noch_fragen {
    background: url(bilder/kunstrasen.jpg);
    height: 700px;
}

  #wuesten, #und_jetzt {
    background: rgba(224, 245, 218, 0.22);
} 


@media only screen and (max-width:768px) {
    
 nav ul li a {
    padding: 0.5em;
    font-size: 1.2em;
}
    
}

@media only screen and (max-width:620px) {
    
 nav ul li a {
    padding: 0.2em;
    font-size: 1.2em;
}
    
}


@media only screen and (max-width:550px) {
    
 nav ul li a {
    padding: 0.2em;
    font-size: 1.2em;
}
    
}



@media only screen and (max-width:550px) {

    .part2text, .part3text {
        -webkit-column-count: 1;
        /* Chrome, Safari, Opera */
        -moz-column-count: 1;
        /* Firefox */
        column-count: 1;
    }
    
    section {
    font-size: 18px;
}
    
h1 {
    font-size: 1.4em;
}

h2 {
    font-size: 1.3em;
}

h3 {
    font-size: 1.2em;
}
    
    .schaubild {
    padding-right: 0;
    padding-bottom: 2%;
}
   
}

@media only screen and (max-width:500px) {
    
  #wuesten, #ertrinken, #und_jetzt, #noch_fragen {
    padding-top: 50px;
}       
}