* {
    margin: 0;
    padding: 0;
}
header, section, article, nav, main, figure, footer{
    display: block;
}
body {
    font-family: 'Open Sans', sans-serif;
    background-color: whitesmoke;
padding:40px;
}
#wrapper, #wrapper1 {
    width: 1250px;
    margin: 0 auto;
}

        /* Startseite: header */
logo {
    height: 128px;
    margin-top: 10px;
}
.logoschrift1 {                         
    font-family: 'Italiana', serif;
    font-size: 5em;
    color: darkgreen;
    font-weight: normal;
    letter-spacing: 0.3em;
    text-align: center;
    padding-top: 20px;
}

        /* Startseite: Navigation */
#startnav a {
    display: inline-block;
    width: 250px;
}
#navlinks {
    float: left;
    margin-left: 120px;
    margin-top: 80px;
}
#navrechts {
    margin-left: 820px;
    padding-top: 80px;
}
.navitem1, .navitem2, .navitem3, .navitem4, .navitem5, .navitem6 {
    width: 280px;
    height: 70px;
    border: 1px solid darkgreen;
    border-radius: 5px;
    font-size: 1em;
    text-align: center;
    background-color: white;
}
.navitem2, .navitem3, .navitem5, .navitem6 {
    margin-top: 30px;
}
#mittelbild {
    float: left;
    background-image: url(images/logo/logomitte151.png);
    background-repeat: no-repeat;
    opacity: 0.6;
    width: 230px;
    height: 395px;
    margin-left: 88px;
}
.floraa {
    padding-top: 0.4em;
}
.florab {
    padding-top: 1.1em;
}
.florac {
    padding-top: 0.5em;
}
.flora, .flora1  {
    font-size: 1.4em;
    font-weight: normal;
    text-decoration: none;
}
.flora {
    color: darkgreen;
}
.flora:hover, .flora1:hover{
    text-decoration: underline;
}
.flora1 {
    color: brown;
    letter-spacing: 0.2em;
}

            #nav-menue {
                display: none;
            }
        /* Facebook-Hinweis */
#facebookhinweis{
    clear: both;
    text-align: center;
    margin-top: 7em;
    color: darkgreen;
    font-size: 1.4em;
}
.facebooklink {
    color: darkgreen;
}

         /*Trennlinie unter der Navigation */
#trenn {
    clear: both;
    margin-top: 80px;
}

        /* Kopf und Navigation der Unterseiten */
        /* Unterseiten: header */
#unterseitenheader {
    margin-top: 10px;
    height: 60px;
 
}
.logoschriftunterseiten {
    font-family: 'Italiana', serif;
    font-size: 3em;
    font-weight: bold;
    letter-spacing: 0.2em;
    text-align: left;
}
.logoschriftunterseiten a {
    text-decoration: none;
    color: darkgreen;
}       
   
        /* Unterseiten: Navigationsleiste */
#unterseitennav {
    height: 3em;
    background-color: white;
    border-top: 1px solid darkgreen;
    border-left: 1px solid darkgreen;
    border-right: 1px solid darkgreen;
    border-bottom: none;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}
#unterseitennav li {
    display: inline-block;
    padding-left: 55px;
}
#unterseitennav a {
    color: darkgreen;
    text-decoration: none;
    font-size: 1.1em;
    line-height: 3em;
}
#unterseitennav a:hover {
    text-decoration: underline;
}
.aktiv {
    color: brown;
    font-size: 1.1em;
    text-decoration: underline;
}

        /* Unterseiten: Überschriftenbanner*/
#banner1, #banner2, #banner3, #banner4, #banner5, #banner6, #banner7 {
    background-repeat: no-repeat;
    border-left: 1px solid darkgreen;
    border-right: 1px solid darkgreen;
    border-bottom: 1px solid darkgreen;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    margin-bottom: 100px;
}
#banner1 h1, #banner2 h1, #banner3 h1, #banner4 h1, #banner5 h1, #banner6 h1, #banner7 h1 {
    font-size: 2em;
    color: white;
    letter-spacing: 0.1em;
    text-shadow: 2px 2px 2px black;
    padding-top: 100px;
    padding-left: 750px;
}
    /* banner1=Hochzeitsfloristik*/
#banner1 {
    background-image: url(images/hochzeitsfloristik/banner32sk.png);
    height: 239px;
    
}
#banner1 h1 {
    padding-top: 120px;
    padding-left: 840px;
}
    /* banner2=Trauerfloristik*/
#banner2 {
    background-image: url(images/trauerfloristik/bannerliliex1sk2.jpg);
    height: 300px;
}
#banner2 h1 {
    padding-top: 190px;
    padding-left: 800px;
}
    /*banner3 = Floristik*/
#banner3 {
    background-image: url(images/floristik/floristikbanner1a.png);
    height: 250px;
}
#banner3 h1 {
    padding-left: 800px;
    padding-top: 150px;
}
    /*banner4 = Sommerblumen*/
#banner4 {
    background-image: url(images/garten/bannergarten1.JPG);
    height: 216px;
}
#banner4 h1 {
    padding-top: 120px;
    padding-left: 750px;
}
    /*banner5 = Aktuelles*/
#banner5 {
    background-image: url(images/aktuelles/banneraktuelles1.jpg);
    height: 250px;
} 
#banner5 h1 {
    padding-top: 150px;
    padding-left: 900px;
}
    /*banner6 = Kontakt, #banner7 =  Impressum */
#banner6, #banner7 {
    background-image: url(images/logo/bannergruen1.png);
    height: 200px;
}
#banner6 h1{
    padding-top: 60px;
    padding-left: 850px;
}

        /*Startseite: article*/
#ueberschrifthandy2 {
    display: none;
}
article p {
    line-height: 1.5em;
    margin-bottom: 0.8em;
}
#ueberunstext2 {
    display: none;
}
#ueberuns {
    width: 80%;
    margin:  0 auto;
}
.logoschrift2 {
    font-family: 'Italiana', serif;
    font-size: 1.3em;
    font-weight: bold;
    color: darkgreen;
    letter-spacing: 0.1em;
}
.hauptueberschrift1, .hauptueberschrift2, .hauptueberschrift3, .hauptueberschrift4 {
    font-family: 'Italiana', serif;
    font-size: 2em;
    color: brown;
    letter-spacing: 0.15em;
    margin-bottom: 30px;
}
.hauptueberschrift1 {
    font-weight: bold;
    margin-top:  150px;
    text-align: left;
}
.hauptueberschrift2 {
    text-align: center;
    margin-top: 150px;
}
.hauptueberschrift3 {
    margin-top: 50px;
}


.rahmen1, .rahmen2, .rahmen3, .rahmen4, .rahmen5, .rahmen51 {
    width: 450px;
    border: 2px solid darkred;
    border-radius: 5px;
}
.rahmen1 p, .rahmen2 p, .rahmen3 p, .rahmen4 p, .rahmen5 p, .rahmen51 p {
    text-align: left;
    color: white;
    padding-left: 30px;
    padding-top: 35px;
}
.rahmen1 a, .rahmen2 a, .rahmen3 a, .rahmen4 a, .rahmen5 a, .rahmen51 a {
    color: white;
    font-size: 1.8em;
    text-decoration: none;
    text-shadow: 2px 2px 2px black;
}
.rahmen1 a:hover, .rahmen2 a:hover, .rahmen3 a:hover, .rahmen4 a:hover, .rahmen5 a:hover, .rahmen51 a:hover {
    color: black;
    text-decoration: underline;
    text-shadow: 2px 2px 2px white;
}
.rahmen1, .rahmen3, .rahmen5 {
    float: left;
}
.rahmen2, .rahmen3, .rahmen4, .rahmen5 {
    height: 350px;
}
.rahmen1 {
    background-image: url(images/startseite/straussxy.JPG);
    background-repeat: no-repeat;
    height: 379px;
    margin-right: 30px;
    margin-top: 30px;
}

.rahmen2 {
    background-image: url(images/startseite/innendeko01.jpg);
    background-repeat: no-repeat;
    margin-top: 80px;
    margin-left: 720px;
}
.rahmen3 {
    background-image: url(images/startseite/lavendel1.jpg);
    background-repeat: no-repeat;
}
.rahmen4 {
    background-image: url(images/startseite/rose01.jpg);
    background-repeat: no-repeat;
    margin-top: 250px;
    margin-left: 720px;
}
.rahmen5 {
    background-image: url(images/startseite/lilie1.jpg);
    background-repeat: no-repeat;
    margin-top: 200px;
}
.rahmen51 {
    display: none;
}
.floristikangebot, .dekorationsangebot, .sommerblumenangebot, .hochzeitsfloristikangebot, .trauerfloristikangebot {
    width: 680px;
}
.dekorationsangebot, .hochzeitsfloristikangebot {
    float: left;
}
.floristikangebot {
    margin-top: 80px;
    margin-left: 500px;
}
.dekorationsangebot {
    clear: both;
    margin-top: 60px;
}
.sommerblumenangebot {
    margin-top: 80px;
    margin-left: 500px;
}
.hochzeitsfloristikangebot {
    clear: both;
    margin-top: 120px;
}
.trauerfloristikangebot {
    margin-top: 200px;
    margin-left: 500px;
}
.abstand1 {
    margin-bottom: 30px;
}
.galerielink {
    font-size: 1em;
    color: brown;
}
.galerielink:hover {
    color: darkgreen;
    font-size: 1em;
}

        /* Bilderrahmung auf den Unterseiten*/
.bild1 img, .bild2 img, .bild15 img, .bild10 img, .bild20 img, .bild11 img, .bild12 img, .bild21 img, .bild22 img, .bild100 img, .bild30 img, .bild31 img, .bild32 img, .bild33 img, .bild34 img, .bild35 img, .bild36 img, .bild37 img, .bild38 img, .bild39 img, .bild40 img, .bild41 img, .bild42 img, .bild43 img, .bild44 img, .bild45 img, .bild46 img, .bild50 img, .bild51 img, .bild52 img, .bild53 img, .bild54 img, .bild55 img, .bild56 img, .bild57 img, .bild58 img, .bild60 img, .bild61 img, .bild62 img, .bild63 img, .bild64 img,  .bild70 img, .bild71 img, .bild72 img, .bild73 img, .bild74 img, .bild75 img {
    border: 1px solid brown;
    border-radius: 5px;
}

        /*Unterseite: Aktuelles*/
.textaktuelles {
    font-size: 1.2em;
    width: 80%;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 3em;
    margin-top: 3em;
}
.bild71, .bild73, .bild74{
    float: left;
}
.bild70, .bild76, .bild77, .bild78 {
    text-align: center;
}
.bild71, .bild72, .bild73, .bild75 {
    margin-top: 100px;
}
.bild71 {
    margin-right: 45px;
}
.bild73, .bild74 {
    margin-right: 20px;
}
.bild74, .bild78, .bild77 {
   padding-top: 45px;
}
.centriert5 {
    clear: both;
}
.angebot {
    font-size: 3em;
    color: red;
    text-align: center;
}

        /*Unterseite: Galerie Floristik*/
.bild32, .bild34, .bild36, .bild38 {
    float: left;
}
.bild30, .bild31, .bild32, .bild33, .bild60, .bild61, .bild62, .bild63, .bild64  {
    margin-bottom: 50px;
}
.bild30, .bild39 {
    margin-left: 680px;
}
.bild31 {
    margin-left: 230px;
}
.bild33 {
    margin-left: 250px;
}
.bild34, .bild36 {
    margin-right: 27px;
}
.bild35 {
    margin-top: 150px;
}
.bild36  {
    margin-top: 100px;
}
.bild37 {
    margin-left: 220px;
    margin-top: 50px;
}
.bild60, .bild61, .bild62, .bild63, .bild64 {
    margin: 0 0 30px 0;
    text-align: center;
}

    /*Unterseite: Galerie Sommerblumen*/
.bild41, .bild43, .bild44, .bild52 {
    float: left;
}
.bild40, .bild41,  .bild42, .bild43, .bild44, .bild45, .bild46 {
    margin-bottom: 50px;
}
.bild40, .bild46 {
    margin-left: 225px;
}
.bild41, .bild44 {
    margin-right: 22px;
}
.bild43 {
    margin-right: 46px;
}
.bild50, .bild51, .bild54, .bild55, .bild56, .bild57, .bild58 {
    text-align: center;
}
.bild50, .bild53, .bild56, .bild58  {
    margin-bottom: 50px;
}
.bild52 {
    margin: 50px 50px 0 100px;
}
.bild53, .bild55, .bild57, .bild58 {
    margin-top: 50px;
}
.bild57 {
    clear: both;
}
#freifl {
    clear: both;
    margin-top: 200px;
}

        /*Unterseite: Galerie Hochzeitsfloristik*/
.bild10, .bild11, .bild12 {
    float: left;
}
.bild10, .bild12, .bild11, .bild15, .bild20, .bild100 {
    margin-left: 60px;
}
.bild10, .bild11, .bild12, .bild100 {
    margin-right: 7em;
}
.bild10, .bild100 {
    margin-bottom: 6em;
}
.bild20, .bild21, .bild22 {
    margin-bottom: 7em;
}
.bild11{
    margin-bottom: 9em;
}
.bild12{
    margin-bottom: 18em;
}

        /*Unterseite: Galerie Trauerfloristik*/
 .bild1{
    float: left;
    margin-right: 7em;
    margin-bottom: 6em;
    margin-left: 60px;
}
.bild2 {
    margin-bottom: 7em;
}
.bild15 {
    clear: left;
    margin-bottom: 5em;
}

        /*Unterseite: Öffnungszeiten "Öffnungszeiten und Anfahrtskizze*/
.ueberschrift1 {
    font-size: 1.2em;
    font-weight: bold;
    margin-bottom: 1em;
}
.ueberschrift2 {
    text-decoration: underline;
}
.telefon {
    font-size: 2.5em;
    
    text-align: center;
}
#infobox2, #infobox3 {
    border: 1px solid darkgreen;
    border-radius: 5px;
    color: darkgreen;
    text-shadow: 2px 2px 2px white;
}
#infobox2, #infobox3 {
    float: left;
    width: 460px;
    font-size: 1.2em;
    padding: 2em 2em;
    margin-bottom: 200px;
    margin-top: 50px;
}
#infobox2 {
    margin-left: 60px;
}
#infobox3 {
    margin-left: 50px;
}
.einrueck {
    font-size: 0.9em;
    padding-left: 1em;
}
#karte1 {
    margin-top: 100px;
    margin-bottom: 100px;
}
#karte2 {
    margin-top: 140px; 
}

        /* Unterseite: Impressum und Datenschutz*/
.imprueberschrift1 {
    font-size: 1.2em;
    margin-bottom: 1em;
    margin-top: 1.5em;
}
.imprueberschrift11 {
    font-size: 0.7em;
    font-weight: normal;
}
.imprueberschrift2 {
    font-weight: bold;
}    
#impr h2 {
    font-size: 1.2em;
    margin-top: 2em;
    margin-bottom: 1em;
}
#impr h3 {
    font-size: 1em;
    margin-top: 1.5em;
    margin-bottom: 1em;
}

        /* Footer */
footer {
    clear: both;
    height: 175px;
    font-size: 0.9em;
    line-height: 1.7em;
    border: 1px solid darkgreen;
    border-radius: 5px;
    background-color: white;
    box-sizing: border-box;
    padding-left: 20px;;
    padding-top: 25px;
    margin-bottom: 50px;
    margin-top: 180px;
}
.logoschrift3 {
    font-family: 'Italiana', serif;
    font-size: 1.8em;
    font-weight: bold;
    letter-spacing: 0.2em;
    color: darkgreen;
    margin-bottom: 0.5em;
}
#footerbox1 {
    float: left;
    padding-right: 70px;
}
#footerbox2 {
    float: left;
    padding-right: 120px;
}
#footerbox3 {
    float: left;
    padding-right: 80px;
}
#footerbox3 li, #footerbox4 li {
    list-style-type: none;
}
.normal {
    text-decoration: none;
}
#footerbox4 {
    float: left;
    margin-top: 1.5em;
}
.wichtig1 {
    font-weight: bold;
    font-size: 1.1em;
}
.wichtig2 {
    font-weight: bold;
    font-size: 1em;
}
.hervorheb {
    font-weight: bold;
    padding-bottom: 0.5em;
}
.normal, .linkwichtig {
    color: black;
}
#footerbox4 a:hover, #footerbox3 a:hover {
    text-decoration: underline;
}
.linkwichtig {
    font-weight: bold;
    font-size: 1.1em;
}

        /* Überschriften über den Galeriebildern - alle Seiten */
.centriert1, .centriert2, .centriert21, .centriert5 {
    font-size: 2em;
    line-height: 2em;
    letter-spacing: 0.5em;
    text-align: center;
    color: darkgreen;
    text-shadow: 2px 2px white;
}
.centriert2, .centriert1 {
    margin: 2em 0;
}
.centriert21 {
    margin-top: 7em;
    margin-bottom: 3em;
    
}
.centriert3 {
    font-size: 1em;
    letter-spacing: 0.1em;
}
.centriert5 {
    clear: both;
    margin-top: 5em;
}

        /*Sprungmarke am Ende der Unterseite zum Menü zurück*/
#ruecksprung {
    clear: both;
    margin-top: 130px;
    margin-left: 50px;
}
.ueberuns-button {
    display: none;
}
#togglenav1 {
    display: none;
}
.menue-button1 {
    display: none;
}
            /* Zähler für die Seitenbreite */
                        #zaehler {
                            clear: both;
                        }

        
    /* 1. media queries 80em - 62.5em (1280px - 1000px) */
    @media only screen and ( max-width: 80em ) {
                /* Startseite */
        #togglenav1 {
            display: none;
            }
        .menue-button1 {
            display: none;
        }
        #wrapper {
            width: 900px;
            margin: 0 auto;
            /*background-color: aquamarine;*/
        }
        .logoschrift1 {
            font-size: 4.5em;
        }
        #navlinks {
            margin-left: 60px;
            margin-top: 60px; 
        }
        #navrechts {
            margin-left: 580px;
            padding-top: 60px;
        }
        .navitem1, .navitem2, .navitem3, .navitem4, .navitem5, .navitem6 {
            width: 240px;
            height: 60px;
            font-size: 0.8em;
        }
        #startnav a {
            width: 200px;
        }
        #mittelbild {
            background-image: url(images/logo/logomitte141.png);
            width: 200px;
            height: 343px;
            margin-left: 70px;
        }
        #facebookhinweis{
            font-size: 1em;
        }
                
        article {
            font-size: 0.95em;
            margin: 0 30px 0 30px;
        }
        .hauptueberschrift1, .hauptueberschrift2, .hauptueberschrift3  {
            font-size: 1.8em;
        }
        .hauptueberschrift1, .hauptueberschrift2 {
            margin-top: 100px;
        }
        .hauptueberschrift3 {
            margin-top: 80px;
        }
        #ueberuns {
            width: 90%px;
            margin: 0 auto;
        }
        
        .floristikangebot {
            margin-left: 450px;
            width: 380px;
            margin-top: 60px;
        }
        .rahmen2 {
            margin-top: 60px;
            margin-left: 400px;
        }
        .dekorationsangebot {
            clear: both;
            width: 340px;
            margin-top: 80px;
        }
        .sommerblumenangebot {
            width: 370px;
            margin-left: 480px;
            margin-top: 60px;
        }
        .rahmen4 {
            margin-left: 400px;
            margin-top: 200px;
        }
        .hochzeitsfloristikangebot {
            width: 350px;
            margin-top: 80px;
        }
        .rahmen5 {
            margin-top: 150px;
        }
        .trauerfloristikangebot {
            width: 360px;
            margin-top: 170px;
        }
                
        footer {
            width: 100%;
            margin: 0 auto;
            height: 120px;
            font-size: 0.8em;
            padding-left: 20px;;
            padding-top: 10px;
            margin-bottom: 40px;
            margin-top: 150px;
        }
        .logoschrift3 {
            letter-spacing: 0.1em;
            padding-top: 11px;
        }
        .hervorheb {
            padding-bottom: 0em;
        }
        #footerbox1 {
            padding-right: 20px;
        }
        #footerbox2 {
            padding-right: 40px;
        }
        #footerbox3 {
            padding-right: 20px;
        }
        .linkwichtig  {
            font-size: 1.1em;
            font-weight: bold;
        }
        
             /* *** Unterseiten (1280 - 1000px *** */
        #wrapper1 {
            width: 100%;
            margin: 0 auto;
            /*background-color: aquamarine;*/
        }
        #unterseitenheader {
            margin-left: 32px;
        }
        .logoschriftunterseiten {
            font-size: 2.8em;
        }
                /* Unterseiten: Navigationsleiste */
        #unterseitennav {
            margin-left: 30px;
            margin-right: 30px;
            text-align: center;
        }
        #unterseitennav li {
            padding: 5px 8px;
        }
        #unterseitennav a {
            font-size: 1.1em;
            line-height: 2.2em;
        }
        .aktiv {
            font-size: 1.1em;
        }
             /* Unterseiten: Überschriftenbanner*/
        #banner1, #banner2, #banner3, #banner4, #banner5, #banner6, #banner7 {
            margin-left: 30px;
            margin-right: 30px;
            height: 200px;
        }
        #banner1 h1, #banner2 h1, #banner3 h1, #banner4 h1, #banner5 h1, #banner6 h1, #banner7 h1 {
            padding-top: 100px;
            padding-left: 50px;
        }
        .footerunterseiten {
            width: 93%;
        }
                 /* Bilder - responsive Darstellung auf allen Seiten*/
        .bilds1 {
            max-width: 100%;
            height: auto;
        }
                /* Unterseite Aktuelles Nr. 70 -... */
        .bild71, .bild72 {
            float: none;
            text-align: center;
            margin: 50px auto 0 auto;
        }
        .bild73, .bild74, .bild75 {
            float: none;
            text-align: center;
            margin: 50px auto 0 auto;
            padding: 0;
        }                    
        .centriert5 {
            clear: both;
        }
                /* Bilder Floristikangebot Nr. 30 -... und 60 -... */
        .bild32, .bild34, .bild36, .bild38 {
            float: none;
        }
        .bild30, .bild31, .bild32, .bild33, .bild36, .bild34, .bild35, .bild37, .bild38, .bild39, 
        .bild60, .bild61, .bild62, .bild63, .bild64 {
            margin: 0 0 30px 0;
            text-align: center;
        }
                /* Bilder Sommerblumen Nr. 40 - ... und 50 - ... */
        .bild41, .bild43, .bild44 {
            float: none;
        }
        .bild40, .bild41, .bild42, .bild43, .bild44, .bild45, .bild46 {
            margin: 0 0 30px 0;
            text-align: center;
        }
        .bild52 {
            float: none;
            text-align: center;
            margin: 50px 0 0 0;
        }
        .bild53 {
            text-align: center;
        }
        .bild56 {
            display: none;
        }
        #freifl {
            clear: both;
            margin-top: 200px;
        }
                /* Galerie Hochzeitsfloristik */
        .bild10, .bild11, .bild12, .bild20, .bild21, .bild22, .bild100 {
            margin: 0 0 50px 0;
            text-align: center;
        }
        .bild10, .bild11, .bild12 {
            float: none;
        }
        
            /* Galerie Trauerfloristik */
        .bild1, .bild2, .bild15, .bild20 {
            margin: 0 0 50px 0;
            text-align: center;
            float: none;
        }
        
            /* Telefon u. Öffnungszeiten */
        .telefon {
            font-size: 2.5em;
            margin-top: 2em;
        }
        #infobox2, #infobox3 {
            float: none;
        }
        #infobox2 {
            margin: 100px auto;
        }
        #infobox3 {
            margin: 0 auto 100px auto;
        }
    }

     
/* 2. media queries max. 1000px (900px - 1000px) (nur Unterseiten!!)*/   
        @media only screen and ( max-width: 62.5em ) {
         /*#wrapper1 {
                background-color: red;}*/ 
            
                /* Unterseiten: Navigationsleiste */
            #togglenav1 {
                display: none;
            }
            .menue-button1 {
                display: none;
            }
            
            #unterseitennav a {
                font-size: 0.97em;
                line-height: 3em;
            }
            .aktiv {
                font-size: 0.97em;
            }
                /* Unterseiten: Überschriftenbanner*/
            #banner1, #banner2, #banner3, #banner4, #banner5, #banner6, #banner7 {
                height: 150px;
            }
            #banner1 h1, #banner2 h1, #banner3 h1, #banner4 h1, #banner5 h1, #banner6 h1, #banner7 h1 {
                padding-top: 80px;
                padding-left: 50px;
            }
                /* banner1=Hochzeitsfloristik*/
            #banner1 {
                background-image: url(images/hochzeitsfloristik/banner32sk.png);
            }
                /* banner2=Trauerfloristik*/
            #banner2 {
                background-image: url(images/trauerfloristik/bannerliliex1sk2.jpg);
            }
                /*banner3 = Floristik*/
            #banner3 {
                background-image: url(images/floristik/floristikbanner1a.png);
            }
                /*banner4 = Sommerblumen*/
            #banner4 {
                background-image: url(images/garten/bannergarten1.JPG);
            }
                /*banner5 = Aktuelles*/
            #banner5 {
                background-image: url(images/aktuelles/banneraktuelles1.jpg);
            } 
                /*banner6 = Kontakt, #banner7 =  Impressum */
            #banner6, #banner7 {
                background-image: url(images/logo/bannergruen1.png);
            }
            .footerunterseiten {
                font-size: 0.7em;
                }
            #footerbox1 {
            padding-right: 10px;
            }
            #footerbox2 {
                padding-right: 30px;
            }
            #footerbox3 {
                padding-right: 10px;
            }
            
            /* Überschriften auf den Galerieseiten */
            .centriert1, .centriert2, .centriert21 {
                font-size: 1.5em;
                letter-spacing: 0.4em;
                margin: 4em 0 2em 0; 
            }
        }

            /*3. media queries  max. 900px (650px - 900px)*/   
            @media only screen and ( max-width: 56.25em ) {
                #wrapper {
                    width: 100%;
                    margin: 0 auto;
                    /*background-color: burlywood;*/
                }
                #startnav, #logo {
                    display: none;
                }
                #trenn {
                    display: none;
                }
                #handylogo {
                    background-image: url(images/logo/logomitte1411.png);
                    background-repeat: no-repeat;
                    opacity: 0.7;
                    width: 100%;
                    height: 206px;
                    margin-top: 3em;
                    margin-left: 3em;
                }
                .logoschrift1h {
                    font-family: 'Italiana', serif;
                    font-weight: bold;
                    font-size: 3.5em;
                    color: darkgreen;
                    letter-spacing: 0.1em;
                    text-align: left;
                    padding-top: 2.7em;
                    padding-left: 2em;
                    width: 100%;
                }
                
                /* Togglemenü Startseite*/
                
                #nav-menue {
                    display: block;
                    
                }
                #togglenav {
                    width: 75%;
                    margin: 0 auto;
                }
                #togglenav li{
                    list-style-type: none;
                }
                #togglenav a {
                    display: block;
                    padding: 0.5em 0.5em 0.5em 3.5em;
                    text-decoration: none;
                    color: white;
                }
                .galerie {
                    background-color: darksalmon;
                }
                .linki {
                    background-color: darkseagreen;
                }
                .menue-button {
                    display: none;
                }    
                #togglenav {
                    margin: 8em auto 0 auto;
                }
                #togglenav a:hover {
                    color: darkgreen;
                }
                .menue-button {
                    display: block;
                    background-color: darkseagreen;
                    border: 1px solid white;
                    color: white;
                    text-align: center;
                    width: 5em;
                    position: absolute;
                        left: 3em;
                        top: 18em;   
                    padding: 0.5em;
                    cursor: pointer;
                    text-decoration: none;
                }
                .menue-button:hover {
                    color: darkgreen;
                    background-color: white;
                    border: 1px solid darkgreen;
                }
                #togglenav li {
                    border-bottom: 1px solid white;
                }
                #togglenav {
                    display: none;
                }
                #nav-menue:target #togglenav {
                    display: block;
                }
                #nav-menue:target .menue-button-beschr-open {
                    display: none;
                }
                
               #facebookhinweis{
                margin-top: 7em;
                font-size: 0.8em;
                margin-top: 10em;
                margin-left: 3em;
                margin-right: 3em;
            }
                
                #ueberschriftoben {
                    clear: both;
                    padding-top: 5em;
                    padding-bottom: 3em;
                }                
                .hauptueberschrift1 {
                    font-size: 1.6em;
                    text-align: center;
                }
                #ueberunstext1 {
                    display: none;
                }
                #ueberschrifthandy1 {
                    display: none;
                }
                #ueberschrifthandy2 {
                    display: block;
                }
                #ueberschrifthandy2 .hauptueberschrift2 {
                    margin-top: 1em;
                    margin-bottom: 0em;
                }
                .hauptueberschrift2 {
                    font-size: 1.4em;
                }
                .rahmen1, .rahmen2, .rahmen3, .rahmen4, rahmen6 {
                    width: 420px;
                    margin: 0 auto;
                }
                .rahmen1, .rahmen3  {
                    float: none;
                }
                .rahmen2 {
                    margin-bottom: 100px;
                }
                .rahmen5 {
                    display: none;
                }
                .rahmen51 {
                    display: block;
                    width: 420px;
                    height: 350px;
                    margin: 30px auto;
                    background-image: url(images/startseite/lilie1.jpg);
                    background-repeat: no-repeat;
                }
                .rahmen6 {
                    width: 420px;
                    height: 324px;
                    margin: 0 auto;
                    background-image: url(images/startseite/schnittblumen1.jpg);
                    background-repeat: no-repeat;
                }
                .dekorationsangebot, .hochzeitsfloristikangebot {
                    float: none;
                }
                .floristikangebot, .dekorationsangebot, .sommerblumenangebot, .hochzeitsfloristikangebot, .floristikangebot, .trauerfloristikangebot {
                    width: 100%;
                }
                .floristikangebot {
                    margin: 2em auto 2em auto;
                }
                .dekorationsangebot {
                    margin: 0 auto 2em auto;
                }
                .sommerblumenangebot {
                    margin: 4em auto 6em auto;
                }
                .hochzeitsfloristikangebot, .trauerfloristikangebot {
                    margin: 7em auto 2em auto;
                }
                    
                #ueberunstext2 {
                    display: block;
                }
                .hauptueberschrift4 {
                    margin-top: 3em;
                    margin-bottom: 0.5em;
                }
                #ueberuns p {
                    font-size: 0.9em;
                }
                footer {
                    width: 90%;
                    height: 200px;;
                    font-size: 0.7em;
                }
                #footerbox2 {
                    float: left;
                    margin-top: 1em;
                }
                    
                    /**** Unterseiten (900 - 650px****/
                /*#wrapper1 {
                    background-color: burlywood;
                }*/
                
                #unterseitenheader {
                    font-size: 1em;
                }
                #unterseitennav {
                    display: none;
                }
                #banner1, #banner2, #banner3, #banner4, #banner5 {
                    border-top-left-radius: 5px;
                    border-top-right-radius: 5px;
                }
                                
                        /* Togglemenue Unterseiten*/
                #nav-menue1 {
                    display: block;
                    width: 100%;
                }
                #togglenav1 li{
                    list-style-type: none;
                    margin-right: 50em;
                    float: left;
                }
                #togglenav1 a {
                    display: block;
                    height: 100%;
                    width: 100%;
                    padding: 0.5em 0.5em 0.5em 3.5em;
                    text-decoration: none;
                    color: white;
                }
                .menue-button1 {
                    display: none;
                }    
                #togglenav1 {
                    margin-top: 1em;
                    border: 1px solid white;
                    margin-left: 2em;
                    margin-right: 3em;
                    margin-bottom: 3em;
                }
                #togglenav1 a:hover {
                    color: darkgreen;
                }
                .menue-button1 {
                    display: block;
                    background-color: darkseagreen;
                    color: white;
                    text-align: center;
                    width: 5em;
                     position: absolute;
                        left: 2em;
                        top: 15em;   
                    padding: 0.5em;
                    cursor: pointer;
                    text-decoration: none;
                }
                .menue-button1:hover {
                    color: darkgreen;
                    background-color: white;
                    border: 1px solid darkgreen;
                }
                #togglenav1 li {
                    width: 100%;
                    border-bottom: 1px solid white;
                    background-color: darkseagreen;
                }
                #togglenav1 a {
                    width: 100%;
                }
                #togglenav1 {
                    width: 60%;
                    display: none;
                }
                #nav-menue1:target #togglenav1 {
                    display: block;
                }
                #nav-menue1:target .menue-button1-beschr-open {
                    display: none;
                }
                .toggleabstand {
                    margin-bottom: 3em;
                }
                .centriert2 {
                    margin-top: 7em;
                }
                        /* Überschriften Aktuelles*/
                .centriert5 {
                    font-size: 1.5em;
                    letter-spacing: 0.3em;
                    line-height: 1.5em;
                }
                        /* Impressum - Überschrift */
                #impr {
                    margin-top: 10em;
                }
                        /*Unterseite Telefon/Öffnungszeiten*/
                #nav-menue1 {
                    margin-bottom: 3em;
                }
            }


                /* 4. media querie max. 650px (500px - 650px)*/   
@media only screen and ( max-width: 40.625em ) {
                    /*#wrapper {
                        background-color:lavender;}*/
                    #handylogo {
                        background-image: url(images/logo/logomitte1411.png);
                        background-repeat: no-repeat;
                        opacity: 0.6;
                        width: 100%;
                        height: 206px;
                        margin-top: 3em;
                        margin-left: 2em;
                    }
                    .logoschrift1h {
                        font-family: 'Italiana', serif;
                        font-weight: normal;
                        font-size: 3.1em;
                        color: darkgreen;
                        letter-spacing: 0.1em;
                        text-align: left;
                        padding-top: 3em;
                        padding-left: 2em;
                        font-weight: bold;
                    }
                    .menue-button {
                        display: block;
                        background-color: darkseagreen;
                        color: white;
                        text-align: center;
                        width: 5em;
                            position: absolute;
                            left: 3em;
                            top: 20em;
                        padding: 0.5em;
                        cursor: pointer;
                        text-decoration: none;
                    }
                    footer {
                        height: 380px;
                    }
                    
                    /**** Unterseiten (650px - 500px) ****/
                   
                    /*#wrapper1 {background-color:lavender;}*/
                    
                    #banner1 h1, #banner2 h1, #banner3 h1, #banner4 h1, #banner5 h1, #banner6 h1, #banner7 h1 {
                        padding-top: 60px;
                        padding-left: 30px;
                    }
                    .telefon {
                        font-size: 2em;
                        margin-top: 5em;
                    }
                    #infobox2, #infobox3 {
                        width: 300px;
                        font-size: 1.1em;
                    }
                    #infobox2, #infobox3{
                        padding: 1em;
                    }
                    .einrueck {
                        font-size: 0.9em;
                        padding-left: 0em;
                    }
                    .footerunterseiten {
                        height: 460px;
                        width: 380px;
                        font-size: 0.8em;
                    }
                    #footerbox1, #footerbox2, #footerbox3  {
                        float: none;
                    }
                    #footerbox2 {
                        margin-top: 0px;
                    }
                    #footerbox3 {
                        margin-top: 1em;
                    }                    
                    #footerbox4 {
                        margin-top: 0px;
                    }
                    .logoschriftunterseiten {
                        font-size: 2.5em;
                    }                    
                    .centriert21, .centriert2 {
                        font-size: 1.6em;
                        letter-spacing: 0.1em;
                    }
                }

                    /* 5. bis max. 500px = 31.24em) */     
                    @media only screen and ( max-width: 31.25em ) {
                        /*#wrapper {background-color: pink;}*/
                        
body {
padding:0px;  }
                        #handylogo {
                            margin-left: 1em;
                        }
                        .logoschrift1h {
                            font-size: 1.8em;
                            padding-top: 170px;
                            padding-left: 2em;
                        }
                        .menue-button {
                            position: absolute;
                            left: 2em;
                            top: 18em;
                            font-size: 1em;
                        }
                        #togglenav {
                            margin-top: 6em;
                            margin-bottom: 3em;
                        }
                        #togglenav a {
                            padding: 0.5em 0.5em 0.5em 1em;
                            font-size: 0.9em;
                        }    
                        #togglenav li {
                            margin-left: 0em;
                        }    
                        .hauptueberschrift1 {
                            font-size: 1.2em;
                        }    
                        .hauptueberschrift2 {
                            font-size: 1.2em;
                        }    
                        .hauptueberschrift3 {
                            font-size: 1.4em;
                        }    
                        .hauptueberschrift4 {
                            font-size: 1.4em;
                        }    
                        .rahmen1, .rahmen2, .rahmen3, .rahmen4, .rahmen51 {
                            width: 230px;
                            height: 300px;
                        }        
                        .rahmen1 {
                            background-image: url(images/startseite/straussxyz.JPG);
                        }
                        .rahmen4 {
                            background-image: url(images/startseite/rose02.jpg);
                        }
                        .rahmen51 {
                            background-image: url(images/startseite/lilie2.jpg);
                        }
                        
                        /* *** Unterseiten ( - 500px) *** */
                        
                        /*#wrapper1 {background-color: pink;}*/
                        
                        .logoschriftunterseiten {
                            font-size: 1.8em;
                        }
                        #unterseitenheader {
                            height: 40px;
                        }
                        #banner2 h1, #banner3 h1, #banner4 h1, #banner5 h1, #banner6 h1, #banner7 h1 {
                            font-size: 1.5em;
                            padding-top: 80px;
                            padding-left: 0.5em;
                            text-align: left;
                        }
                        #banner1 h1 {
                            font-size: 1.2em;
                            padding-top: 20px;
                            padding-left: 0.5em;
                            text-align: left;
                        }
                        #banner4 h1 {
                            font-size: 1.2em;
                        }
                        #togglenav1 {
                            width: 85%;
                        }
                        #togglenav1 a {
                            padding: 0.5em 0.5em 0.5em 1em;
                        }
                        #nav-menue1 {
                            margin-bottom: 3em;
                        }
                            /* Überschriften auf den Galerieseiten */
                        .centriert1, .centriert2, .centriert21 {
                            font-size: 1.2em;
                            letter-spacing: 0.2em;
                            margin: 4em 0 2em 0; 
                        }
                            /* Überschriften Aktuelles*/
                        .centriert5 {
                            font-size: 1.5em;
                            letter-spacing: 0.1em;
                            line-height: 1.5em;
                        }
                        .angebot {
                            font-size: 2em;
                        }
                            /* Unterseite Telefon und Öffnungszeiten*/
                        #infobox2, #infobox3 {
                            width: 98%;
                        }
                        #infobox2, #infobox3{
                            padding: 0.5em;
                            font-size: 1em;
                        }
                        .footerunterseiten {
                            width: 95%;
                        }
                    }
                        
                        /* *** Ende *** */