@charset "UTF-8";
    
/*RESET==================================*/
    
*{
    padding:0;
	margin:0;
	font-size:100%;
	border:none;
	text-decoration:none;
	font-weight:normal;
    }

.clearer{
    clear: both;
}

/*===============SCHRIFT================================*/
a {
  color: #dda19b;
font-weight: bold; 
}
    a:hover,
a:focus {
  border-bottom: 1px solid #d90000;
}

h2{
    float: left;
    font-size: 3em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 5% 0 0 0%;
}


h2#kontakt{
    float: left;
    font-size: 3em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 3em 0 0 0%;
}

h2#masken{
    float: left;
    font-size: 3em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 8% 0 0 3%;
}

h2#babybauch{
    float: left;
    font-size: 3em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 1em 0 1.5em 3%;
}


h2#impressum{
    float: left;
    font-size: 3em;
    width: 100%;
    color: #000;
    font-family: 'Raleway', sans-serif;
    margin: 1em 0 1.5em 3%;
}


h2#glizer{
    float: left;
    font-size: 3em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 5% 0 0 3%;
}

h2#kinderschminken{
    float: left;
    font-size: 2.3em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 5% 0 0 0;
}


#link_impressum  a{
  margin:1em 0 0 28%;
    width: 100%;
    box-sizing: border-box;
    color: #fff;
    border: 2px solid #fff;
    
}


p{
    float: left;
    font-size: 1em;
    color: #fff;
    font-family: 'Raleway', sans-serif; 
}


p#impressum{
    float: left;
    font-size: 1em;
    width: 100%;
    color: #000;
    margin: 0 0 1em 1em;
    font-family: 'Raleway', sans-serif; 
}

p#info{
    width: 100%;
    float: left;
    font-size: 1em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    float: left;
    background-color: #a3036e;
    box-sizing: border-box;
    padding: 3% 2.9em 3% 0;
}

p#tag{
    font-size: 6em;
    margin: 0 auto;
}

p#monat{
    font-size: 1.7em;
    margin: -0.4em auto 0 auto;
    
}

section#rechts_kontakt{
    width: 60%;
    float: left;
    padding: 4% 0 0 3%;
    box-sizing: border-box;
}

p#termine{
    margin: 2em 0 3em 1em;
    font-size: 1.5em;
    box-sizing: border-box;
}


p#eins_kontakt{
    margin: 2em  0 0 2em;
    font-size: 1em;
    box-sizing: border-box;
    width: 90%;
}

p#zwei_kontakt{
    margin: 5.4em  0 0 2em;
    font-size: 1em;
    box-sizing: border-box;
    width: 90%;
}

p#drei_kontakt{
    margin: 3em  0 0 2em;
    font-size: 1em;
    box-sizing: border-box;
    width: 90%;
}

p#vier_kontakt{
    margin: 4em  0 0 2em;
    font-size: 1em;
    box-sizing: border-box;
    width: 90%;
}
/*===============HAUPTBOXEN================================*/

#wrapper{
    max-width: 900px;
    min-width: 200px;
    width: 100%;
    background-color: #fff;
    margin: 0 auto 0 auto;
}

header{
    width: 100%;
    height: auto;
    background-color: antiquewhite;
}

/*===============navi================================*/



#navi{
    width: 100%;
    height: 3em;
    margin-bottom: 10em;
}

nav{
    width: 900px;
    height: 3.9em;
    background-color: #a3036e;
    padding: 1em 0 0.3em 10%;
    box-sizing: border-box;
    position:fixed;
    /* margin-top:-13em; */
    z-index: 2;
}

nav ul li{
    text-decoration: none;
    display:inline;
    margin-left: 1em;
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

img#kontakt_navi{
    position: absolute;
    margin: -5.6em 0 0 55%;
}

img#termine_navi{
    position: absolute;
    margin: -4em 0 0 70%;
    list-style: none;
}

nav ul li a{
    -webkit-transition: scale 0.7s ease;
    -moz-transition: scale 0.7s ease;
    -o-transition: scale 0.7s ease;
    transform: scale(1.2);
}




/*===============hintergrundbilder================================*/

img.angepasst {
    width: 100%;
	max-width:100%;
	height:auto;
	}
/*===============logo================================*/

article#logo{
    width: 60%;
    height: auto;
    padding: 0%;
    box-sizing: border-box;
    background-color: #fff;
    margin: 0 auto; /* Centers the element horizontally */

}


/*===============inhalt================================*/

#alex{
    width: 100%;
    height: auto;
    float: left;
    margin-bottom: -0.5em;
}

#alex p#info{
    float: left;
    color: #000;
}

.inhalt{
    width: 100%;
    height: auto;
    background-color: #a3036e;
    padding: 2% 6%;
    box-sizing: border-box;
    margin-top: -3%;
}

#mitte_stichpunkte{
    width: 32%;
    height: auto;
    float: left;
    padding: 1em;
    box-sizing: border-box;
}

#rechts_stichpunkte{
    width: 32%;
    height: auto;
    float: left;
    padding: 1em;
    box-sizing: border-box;
}

#links_stichpunkte{
    width: 32%;
    height: auto;
    float: left;
    padding: 1em;
    box-sizing: border-box;
}

#mitte_stichpunkte{
    width: 32%;
    height: auto;
    float: left;
    padding: 1em;
    box-sizing: border-box;
}

#rechts_stichpunkte{
    width: 32%;
    height: auto;
    float: left;
    padding: 1em;
    box-sizing: border-box;
}

#stichpunkte li {
     text-decoration: none;
    display:block;
    font-size: 1em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    line-height: 1.5em;
}

#icon_links{
    width: 10%;
    height: auto;
    float: left;
    margin-left: 50%;
	
}

#icon_rechts{
    width: 10%;
    height: auto;
    float: left;
    margin-top: -4%
}

p#rechts{
    float: left;
    margin: 3% 0 0 3%
}


p#links{
    float: left;
    margin: 0 0% 0 3%;
}


/*===============maskenschminken================================*/




.inhalt_maskenschminken{
    width: 100%;
    height: auto;
    background-color: #048aa8;
    margin-top: -0.4em;
    box-sizing: border-box;
}

img.angepasst_0 {/*bildbox musste nach unten verschoben werden, maskenschminken*/
    width: 100%;
	height:auto;
    margin-top: 3em;
	}

article#box_links{
    width:100%;
    height: auto;
    float: left;
    background-color: #048ba8;
}

section#icon{
    width: 97%;
    height: auto;
    box-sizing: border-box;
    margin-left: 1em;
}

#icon{
    width: 15%;
    height: auto;
    float: left;
}

section#links{
    width: 45%;
    float: left;
    padding: 2%;
    box-sizing: border-box;
}



section#rechts{
    width: 45%;
    float: left;
    padding: 2%;
    box-sizing: border-box;
}

#box_rechts{
    width: 10%;
    height: auto;
    float: left;
    background-color: #048ba8;
    box-sizing: border-box;
    margin-top: -4em;
}


/*===============kinderschminken================================*/

article#box_links_gelb{
    width: 100%;
    height: auto;
    float: left;
    background-color: #efea5a;
    margin: -0.3em 0;
    box-sizing: border-box;
}

#bild_kinderschminken{
    width: 30%;
    height: 30em;
    background-color: antiquewhite;
    position: relative;
    margin-left: 45%;
    margin-top: -30em;
}

#glizertatoo{
    width: 100%;
    height: auto;
}

section#icon_kinderschminken{
    width: 97%;
    height: auto;
    box-sizing: border-box;
    
}

#icon_kinderschminken{
    width: 35%;
    height: auto;
    float: left;
}

img.angepasst_1 {/*bildbox musste nach oben verschoben werden, farbe die nach unten laüft bei kinderschminken*/
    width: 100%;
	max-width:100%;
	height:auto;
    margin: -0.5em 0 7em 0;
	}

section#links_gelb{
    width: 45%;
    float: left;
    background-color: #efea5a;
    padding: 2%;
    box-sizing: border-box;
}

section#rechts_gelb{
    width: 45%;
    float: left;
    background-color: #efea5a;  
    margin-top: -20em;
    position: relative;
    z-index: 1;
    padding: 2%;
    box-sizing: border-box;
}

#box_rechts_gelb{
    width: 10%;
    height: auto;
    float: left;
    background-color: #efea5a;
    position: relative;
    margin: -20em 0;
}

/*===============babybauch================================*/

article#babybauch{
    height: auto;
    margin-top: 15em;
}

.inhalt_babybauch{
    width: 100%;
    background-color: #048aa8;
    margin-top: -0.5em;
}


section#icon_babybauch{
    width: 97%;
    height: auto;
    box-sizing: border-box;
    margin-left: 1.5em;
    box-sizing: border-box;
}


#icon_babybauch{
    width: 10%;
    height: auto;
    float: left;
    margin-bottom: 
}

#box_rechts_baby{
    width: 10%;
    height: auto;
    float: left;
    background-color: #048ba8;
    margin-top: -7em
}


/*===============kindergeburtstag================================*/



img.angepasst_2 {/*bildbox musste nach oben verschoben werden, pinsel bei kinderschminken*/
    width: 100%;
	max-width:100%;
	height:auto;
    margin-top: -10em;
	}



#icon_kindergeburtstag{
    width: 10%;
    height: auto;
    float: left;
    margin-bottom: 1em;
}

img.bilder {
    width: 100%;
	max-width:100%;
	height:auto;
    border-color: aqua;
    border: 1em;
    box-sizing: border-box;
    float: left;
	}

section#icon_kindergeburtstag{
    width: 87%;
    height: auto;
    box-sizing: border-box;
    margin-left: 1em;
    float: left;
    padding: 2% 2% 0 0;
}

.inhalt_kindergeburtstag{
    background-color: #16db93;
    width: 100%;
    margin-top: -0.4em;
    height: auto;
}

#box_links_rechts{
    float: right;
    width: 100%;
    height: auto;
    background-color: #16db93;
}

#box_rechts_links{
    float: left;
    width: 10%;
    height: auto;
    background-color: #16db93;
    box-sizing: border-box;
}



section#ganze_breite_kindergebutstag{
    width: 100%;
    float: left;
    padding: 2%;
    box-sizing: border-box;
}

/*===============theater================================*/

section#ganze_breite_theater{
    width: 90%;
    float: left;
    padding: 2%;
    box-sizing: border-box;
}


section#icon_theater{
    width: 88%;
    height: auto;
    box-sizing: border-box;
    margin-left: 1em;
    float: left;
}

img.angepasst_3 {/*bildbox musste nach unten verschoben werden, vorhang bei theater*/
    width: 100%;
	max-width:100%;
	height:auto;
    margin-top: 10em;
	}


.inhalt_theater{
    background-color: #048aa8;
    width: 100%;
    height: 30em;
    margin-top: -0.4em;
}

#box_rechts_theater{
    width: 10%;
    height: auto;
    float: left;
    background-color: #048ba8;
    box-sizing: border-box;
    margin-top: -10em;
}

#icon_theater{
    width: 15%;
    height: auto;
    float: left;
    margin-bottom: 1em;
    box-sizing: border-box;
}

article#box_links_puppentheater{
    width:100%;
    height: auto;
    float: left;
    background-color: #048ba8;
    
}



/*===============wandbemalung================================*/


.inhalt_wandbemalung{
    background-color: #f19e4b;
    width: 100%;
    height: 30em;
    margin-top: -0.4em;
}



#box_links_rechts_orange{
    float: right;
    width: 100%;
    height: auto;
    background-color: #f29e4c;
}

#punkt{
    float: left;
    width: 10%;
    height: auto;
    background-color:  #f29e4c;
}

section#icon_wand{
    width: 87%;
    height: auto;
    box-sizing: border-box;
    margin-left: 1em;
    float: left
}

#icon_wand{
    width: 10%;
    height: auto;
    float: left;
    margin: 1em 00 0 0
}

/*===============kontakt================================*/


.inhalt_kontakt{
    background-color: #a3036e;
    width: 100%;
    margin-top: 10em;
}

article#box_links_pink{
    width: 100%;
    height: auto;
    float: left;
    background-color: #a3036e;
    padding-bottom: 2em;
}

#box_rechts_pink{
    width: 10%;
    height: auto;
    float: left;
    background-color: #a3036e;
}

section#ganze_breite{
    width: 100%;
    height: auto;
}


section#icon_kontakt{
    width: 84%;
    height: auto;
    box-sizing: border-box;
    float: left;
    margin: 1em;
}


section#links_kontakt{
    width: 12%;
    float: left;
    padding: 2%;
    box-sizing: border-box;
}

section#daten{
    width: 70%;
    float: left;
    padding: 2%;
    box-sizing: border-box;
    margin-bottom: 5em;
}

img.bilder_kontakt {
    width: 100%;
	max-width:100%;
	height:auto;
    border-color: aqua;
    border: 1em;
    box-sizing: border-box;
    margin: 1em;
    
	}

#icon_kontakt{
    width: 15%;
    height: auto;
    float: left;
    margin:  1em 2em 2em 0;
    box-sizing: border-box;
}

#email{
    float: left;
    width: auto;
}


#link_impressum{
  margin-top: 2em;
    width: 100%;
    box-sizing: border-box;
    
}


/*===============termine================================*/


#box_links_rechts_pink{
    float: right;
    width: 100%;
    height: auto;
    background-color: #a3036e;
    margin-top: -0.5em;
    padding-left: 3%;
    box-sizing: border-box;
}

#box_rechts_links_pink{
    float: left;
    width: 10%;
    height: auto;
    background-color: #a3036e;
    margin-top: 5em
}

section#icon_termine{
    width: 88%;
    height: auto;
    box-sizing: border-box;
    margin: 1em 0 0 0;
    float: left;
}

#icon_kontakt{
    width: 15%;
    height: auto;
    float: left;
}


section#links_termine{
    width: 20%;
    float: left;
    margin-left: 2em;
    box-sizing: border-box;
}




#wrapper #navi {
     display: none;
}














@media screen and (max-width: 768px) {
    
    
/*====================NAVI=========================*/

    

#wrapper {
        min-height: 100%;
        min-height: 100vh;
        position: relative;
      }
    
#wrapper #navi {
        min-height: 100%;
        min-height: 100vh;
        display: block;

        width: 300px;
        overflow-y: auto;

        position: fixed;
        top: 0;
        left: -300px;

        transition: left 250ms;
        z-index: 50000;
        background-color: #ffffff;
      }
    
button#open-drawer-button{
        position: fixed;
    
    }

#wrapper #fade-overlay {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;

        display: none;
        background-color: #000000;
        opacity: 0;

        transition: opacity 200ms;
        z-index: 49999;
      }

#wrapper.drawer-opened #navi {
        left: 0;
      }

 #wrapper.drawer-opened #fade-overlay {
        display: block;
        opacity: 0.4;
      }
    
    
    
      /* Not really needded */
.just-some-styling {
        max-width: 900px;
        margin: auto;
      }

#drawer {
        background-color: #ffffff;
      }
    
    
    
    
    
    
#navi{
    width: 100%;
    height: 3em;
    margin-bottom: 10em;
}

nav{
    width: 1200px;
    height: 3.9em;
    background-color: #a3036e;
    padding: 1em 0 0.5em 10%;
    box-sizing: border-box;
    position:fixed;
    margin-top:-13em;
    z-index: 2;
}

nav ul li{
    color: aqua;
    text-decoration: none;
    display:inline;
    margin-left: 1em;
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

img#kontakt_navi{
    position: absolute;
    margin: -5.6em 0 0 55%;
}

img#termine_navi{
    position: absolute;
    margin: 0 70%;
    list-style: none;
}

nav ul li a{
    -webkit-transition: scale 0.7s ease;
    -moz-transition: scale 0.7s ease;
    -o-transition: scale 0.7s ease;
    transform: scale(1.2);
}
    
#navi ul li a{
        font-size: 1.4em;
        color: #a3036e;
        padding: 1em;
        line-height: 1.8;
        font-family: 'Raleway', sans-serif;
        box-sizing: border-box;
    }

    

}













@media screen and (max-width: 600px) {
    
    
 /*====================INHALT=========================*/   
    
 #icon_links{
    width: 10%;
    height: auto;
    float: left;
    margin-left: 50%;
     display: none;
} 
    
p#rechts{
    float: left;
    margin: 3% 0 0 3%;
    display: none;
}
    
#icon_rechts{
    width: 10%;
    height: auto;
    float: left;
    margin-top: -4%;
    display: none;
}
    
h2#inhalt{
    float: left;
    font-size: 3em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 5% 0 0 0%;
    display: none;
}
    
p#links{
    float: left;
    margin: 0 0% 0 3%;
    display: none;
}
    

    
#mitte_stichpunkte{
    width: 32%;
    height: auto;
    float: left;
    padding: 1em;
    box-sizing: border-box;
    display: none;
}

#rechts_stichpunkte{
    width: 32%;
    height: auto;
    float: left;
    padding: 1em;
    box-sizing: border-box;
    display: none;
}
    
    
    
 /*====================MASKEN=========================*/ 
    
    article#maskenschminken{
        display: none;
    }
    
.inhalt_maskenschminken{
    width: 100%;
    height: auto;
    background-color: #048aa8;
    margin-top: 3em;
    box-sizing: border-box;
}
    
    
#box_rechts{
    width: 10%;
    height: auto;
    float: left;
    background-color: #048ba8;
    box-sizing: border-box;
    margin-top: -4em;
    display: none;
}
    
section#links{
    width: 50%;
    float: left;
    padding: 2%;
    box-sizing: border-box;
}
    
section#rechts{
    width: 50%;
    float: left;
    padding: 2%;
    box-sizing: border-box;
}
    
 /*====================KINDERSCHMINKEN=========================*/ 

article#kinderschminken{
        display: none;
    }
    
    
h2#kinderschminken{
    float: left;
    font-size: 1.4em;
    
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 5% 0 0 0;
}
    
#box_rechts_gelb{
    width: 10%;
    height: auto;
    float: left;
    background-color: #efea5a;
    position: relative;
    margin: 0 0;
    display: none;
}  
    
section#rechts_gelb{
    width: 50%;
    float: left;
    background-color: #efea5a;  
    margin-top: 0;
    position: relative;
    z-index: 1;
    padding: 2%;
    box-sizing: border-box;
}
    
section#links_gelb{
    width: 50%;
    float: left;
    background-color: #efea5a;
    padding: 2%;
    margin-top: 2em;
    box-sizing: border-box;
}
    
#box_rechts_gelb{
    width: 10%;
    height: auto;
    float: left;
    background-color: #efea5a;
    position: relative;
    margin: -20em 0;
    display: none;
}
 
.inhalt_kinderschminken{
        margin-top: 3em;
    margin-bottom: 0em;
    }

#ausblenden{
   display: none;
    }    
    
    
 /*====================BABYBAUCH=========================*/
    
  article#babybauch{
    height: auto;
      display: none;
    
}  
    
article#box_links{
    width:100%;
    height: auto;
    float: left;
    background-color: #048ba8;
    margin-top: 3em;
}

    
h2#babybauch{
    float: left;
    font-size: 2em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 1em 0 1.5em 3%;
}
    
section#icon_babybauch{
    width: 97%;
    height: auto;
    box-sizing: border-box;
    margin-left: 1em;
    box-sizing: border-box;
}
    
#box_rechts_baby{
    width: 10%;
    height: auto;
    float: left;
    background-color: #048ba8;
    margin-top: -7em;
    display: none;
}
    
 /*====================KINDERGEBURTSTAG=========================*/
    
    article#kindergeburtstag{
        display: none;
    }
    
#box_rechts_links{
    float: left;
    width: 10%;
    height: auto;
    background-color: #16db93;
    box-sizing: border-box;
    display: none;
}
    
#box_links_rechts{
    float: right;
    width: 100%;
    height: auto;
    background-color: #16db93;
    margin-top: 3em;
}
    
    
.inhalt_kindergeburtstag{
    background-color: #16db93;
    width: 100%;
    margin-top: 3em;
    height: auto;
}
    
 /*====================PUPPENTHEATER=========================*/
    
article#theater{
        display: none;
    }  
    
    
.inhalt_theater{
    background-color: #048aa8;
    width: 100%;
    height: 30em;
    margin-top: 3em;
}
    
#icon_theater{
    width: 15%;
    height: auto;
    float: left;
    margin-bottom: 0em;
    margin-top: 1em;
    box-sizing: border-box;
}
    
#box_rechts_theater{
    width: 10%;
    height: auto;
    float: left;
    background-color: #048ba8;
    box-sizing: border-box;
    margin-top: 0em;
    display: none;
}
    
section#icon_theater{
    width: 90%;
    height: auto;
    box-sizing: border-box;
    margin-left: 1em;
    float: left;
}
    
/*====================WANDBEMALUNG=========================*/

    article#wandbemalung{
        display: none;
    }
    
#punkt{
    float: left;
    width: 10%;
    height: auto;
    background-color:  #f29e4c;
    display: none;
}
    
#box_links_rechts_orange{
    float: right;
    width: 100%;
    height: auto;
    background-color: #f29e4c;
    
}
    
.inhalt_wandbemalung{
    background-color: #f19e4b;
    width: 100%;
    height: 30em;
    margin-top: 3em;
}
    
/*====================KONTAKT=========================*/
    
#box_rechts_pink{
    width: 10%;
    height: auto;
    float: left;
    background-color: #a3036e;
    display: none;
}
    
p#eins_kontakt{
    margin: 1.2em  0 0 2em;
    font-size: 1em;
    box-sizing: border-box;
    width: 90%;
}
    
p#zwei_kontakt{
    margin: 2.3em  0 0 2em;
    font-size: 1em;
    box-sizing: border-box;
    width: 90%;
}
    
p#drei_kontakt{
    margin: 1.5em  0 0 2em;
    font-size: 1em;
    box-sizing: border-box;
    width: 90%;
}
    
p#vier_kontakt{
    margin: 1.7em  0 0 2em;
    font-size: 1em;
    box-sizing: border-box;
    width: 90%;
}
    
h2#kontakt{
    float: left;
    font-size: 3em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 0 0 0 0%;
}
    
    
.inhalt_kontakt{
    background-color: #a3036e;
    width: 100%;
    margin-top: 3em;
}
    
/*====================TERMINE=========================*/
    
p#termine{
    margin: 2em 0 3em 3em;
    font-size: 1.2em;
    box-sizing: border-box;
}
    
    article#termine{
        display: none;
    }
    
    .inhalt_termine{
        margin-top: 5em;
    }
    
#box_rechts_links_pink{
    float: left;
    width: 10%;
    height: auto;
    background-color: #a3036e;
    margin-top: 7em;
    display: none;
}
    
section#icon_termine{
    width: 88%;
    height: auto;
    box-sizing: border-box;
    margin: 1em 0 0 1em;
    float: left;
}

    
}
#stichpunkte {
    
}






@media screen and (max-width: 400px) {
    
  h2#kinderschminken{
    float: left;
    font-size: 1.1em;
    
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 5% 0 0 0;
}  
    
    
h2#glizer{
    float: left;
    font-size: 1.4em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 0% 0 0 3%;
}
    
h2{
    float: left;
    font-size: 1.5em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 5% 0 0 0%;
}   
    
    
h2#babybauch{
    float: left;
    font-size: 1.2em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 1em 0 1.5em 3%;
}
    
h2#masken{
    float: left;
    font-size: 1.5em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 7% 0 0 3%;
}
    
 p#vier_kontakt{
    margin: 2.2em  0 0 2em;
    font-size: 0.85em;
    box-sizing: border-box;
    width: 90%;
} 
    
    
img.bilder_kontakt {
    width: 100%;
	max-width:100%;
	height:auto;
    border-color: aqua;
    border: 1em;
    box-sizing: border-box;
    margin: 1.2em;
    
	}
    
    
article#box_links{
    width:100%;
    height: auto;
    float: left;
    background-color: #048ba8;
    margin-top: 0em;
}
    
h2#kontakt{
    float: left;
    font-size: 1.4em;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin: 3em 0 0 0%;
}
    

}