@charset "utf-8";
/* CSS Document */

/* =========================================================
CSS Document für prostone - November 2017

Kunde: Sabine Stüttgen - Beratung und Lernbegleitung
Land: Deutschland
Datum: Januar 2018
Datei: sabine-stuttgen.css
Autor: pd prangedesign, Daniela Prange, www.prangedesign.de
===========================================================*/
@import url(nivo-slider.css);
@import url(kontakt.css);
@import url(tumbnails.css);
@import url(breakpoints.css);
@import url(card-layout.css);

/* =========================================================
1. body 
===========================================================*/





body {font-family: 'Open Sans', sans-serif;
      font-size: 100%;
	  color: #666;
	  width: 100%;
	  min-height: 100%;
	line-height: 1.5 em;
	  background-image: url('fotos/hg-himmel.jpg');
	  background-repeat: no-repeat;
	  background-size: cover;
	  background-color:#fffff;}



*{padding: 0; margin: 0;}





#wrapper {max-width: 1200px;
          height: auto; 
          position: relative;
          background: ;
          padding: ;
		  margin: 0px auto 0px auto;
}

#anrufen {width: 100%; height:auto; padding-top:20px;padding-bottom: 20px; text-align: right;}



picture {width: 100%;
         margin: auto;
         }

		  
#logo {max-width: 1200px;
     margin:auto;}	  


#logo img {max-width: 100%;
           height: auto;}
	
#sabine_stuettgen_beratung_und_training {width:100%; height:auto; margin:auto;}
#sabine_stuettgen_beratung_und_training img {width:100%; height:auto;}




/* =========================================================
überschriften
===========================================================*/		  
 h1 {text-align: center;
	 font-size: 6vw;
	 color: #9E9C2A;
	 line-height: 0.8em;
	 padding: 45px 0 20px 0;
	 font-family: 'Indie Flower', cursive;

}

   
  
 h2 {font-size: 32px;}


 h3 {font-size: 20px; font-style: italic; color: #CC6633; font-weight: bold;
    }

 
 h4 {color: #9ba010; font-size: 25px;  font-family:'Handlee', cursive;}
	
    	

h5 {
}
	
h6{	
}

.gruen {color: #9ba010; font-style: italic; font-size: 17px;}

.orange {
	color: #CC6633;}
}

.beratung {color: #9ba010; font-size: 33px;  font-family:'Handlee', cursive;}

#tumbnailcover {width: 932px;
                margin: auto;}	
                

/* =========================================================
2. head
===========================================================*/

#header {width: 100%;
       height: auto;
       margin:auto;
       padding: 36px 0 0px 0;
       text-align: center;
       	background: #c8c63600;
        font-size: 2.188em;/*35px*/
}


#header img {
	max-width: 100%;
	height: auto;
}


#headerbild {
	width: 100%;
    margin: auto;
}

#headerbild img {
	max-width: 100%;
	height: auto;
}




picture img {border: 0px;}

/* =========================================================
3. navigation
===========================================================*/	
	   
 #navoben { max-width: 950px; 
 			margin: auto;
 			height: 75px;}	 



/* =========================================================
ul lists
===========================================================*/	
.list {padding-left: 20px;}

.list li {padding-bottom: 20px;}

  
/* =========================================================
4. content
===========================================================*/	   

#content {width: 100%;
          height: auto;
		  position: relative;
		  margin:auto;
		  clear: both;
		  background:#ffffffba;}
		  
#content img {width: 100%;
              height: auto;
	}	
			 
img {
	max-width: 100%;
	height: auto;
}		 

#contentright {}




#contenttext {
	margin: auto;
	font-size: 1.4em;
	padding-bottom: 30px;
}

#contenttext p {
	padding-bottom:;
}		 
	



#training {width: 100%; background: #ffffffab;}
#training img {width: 100%; height: auto; padding-top: 25px;}

#content3 img {width: 100%; height: auto;}
















/* =========================================================
4. leistungen
===========================================================*/	

/*
#leistungen { width: 85%; margin: auto; border: 1px solid orange;
}

#leistungen img {
	width: 100%; height: auto;
}

#leistungen p {
	margin: 20px 0 20px 0;
}

.box1, .box2, .box3, .box4 {
	width: 20%;
    margin: auto;
    margin-right: 23px;
}

@media screen and (max-width: 500px){
		
	.box1, .box2, .box3, .box4 {
		width: 100%; float: left; margin-right: 0px;}
		
	#leistungen {
	 background: red;
}	
}

*/





			 
			 
/* =========================================================
footer
===========================================================*/			 

#footer {width: 100%;
	background: #c6be10;
	color: white;
         height: auto;
		 margin: auto;
		 clear: both;
		 font-size: 14px;}
		 
#footernav {width: 100%; 
            height: auto;
	        padding-top: 30px;
			padding-bottom: 50px;
            text-decoration: none;
			text-align: center;}		 

#footernav li {width: ;
               height: ;
	font-size: 18px;
			   text-align: center;
	           margin-right: 20px;
               display: inline;}
			   
#footernav a:link, a:active, a:visited {color: white; text-decoration: none; underline: none;}
#footernav a:hover {color:white; text-decoration: none;}



@media screen and (max-width: 630px){
		
	#footernav li {display: block;
	              font-size: 22px;}		
}





#veranstaltungsbild img {width: 100%; height: auto;}

#veranstaltunglinks {padding: 2em; font-size: 1.2em;}

#veranstaltungrechts {padding: 1em;}

#veranstaltunglinks, #veranstaltungrechts {text-align: center; color: black;}

class#one {font-size: 1.5em;padding:0.5em 0 0.5em 0; display: block; line-height: 0.9em;}
class#two {font-weight: bolder; padding: 1em 0;}




.veranstaltungmaerz {width: ; text-align: left; padding-left: 4em;}