﻿@charset "utf-8";
/* CSS Document */

/* =========================================================
CSS Document für die kleine Wundertüte - Dezember 2018

Kunde: Andrea Schwarz-Lehmann - Naturheilpraxis Osteopathie
Land: Deutschland
Datum: Dezember 2018
Datei: andrea-schwarz-osteopathie.css
Autor: pd prangedesign, Daniela Prange, www.prangedesign.de
===========================================================*/
@import url();


/* =========================================================
1. body 
===========================================================*/




body {font-family: ;
      font-size: 1.000em;
	  color: #ffffff;
	  width: 100%;
	  height: 100%;
	  min-height: 100%;
	  background-image: url(images/hintergrund/andrea-schwarz-osteopathie.jpg);
	  background-position: center center;
	  background-repeat: no-repeat;
	  background-size: cover;
	  background-attachment: fixed;
	  background-color: rgb(89, 187, 201);}



*{padding: 0; margin: 0;}


#background {}


#wrapper {max-width: 1400px;
          height: auto; 
          background: rgb(89, 187, 201);
		  margin: 0px auto 0px auto;
}

#anrufen {width: 100%; height:auto; padding-top:20px;padding-bottom: 20px; text-align: right;}



picture {width: 100%;
         margin: auto;
         }


#anrufen {margin-top: 30px;}

#logo_andrea-schwarz {padding-top: 0px;
	                  padding-bottom:30px;
                      padding-left: 30px;
					  margin-top: 0px;
                      background: rgb(89, 187, 201);
}		  
  


#trendbox {width: 100%;
          font-size: 2.5em;
          text-align: center;
	letter-spacing: 0.15em;
}

#trendbox img {width: 100%; height: auto;}

/* =========================================================
überschriften
===========================================================*/		  
 h1 {font-size: 1.5em;
	 padding-top: 0.6em;
	 padding-bottom: 0.3em;

}



@media screen and (max-width: 350px) {	
	h1 {font-size: 1.0em;
	    padding-bottom: 0em;}
	
	h2 {font-size: 0.750em;}
	}

   
  
 h2 {font-size: 1.375em;
    padding: 0.6em 0;}


 h3 {
    }

 
 h4 {}
	
    	

h5 {
}
	
h6{	
}


#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;
		  margin:auto;
		  background:;
          color: #ffffff;}
		  
	
			 





#contenttext {width: 59%;
	margin: auto;
	font-size: 1.0em;
}

		 
	


#content2 {
	width: 100%;
	background-color: #DCA84A;
	height:auto;
	margin:auto;
	color: #ffffff;
	padding: 50px 0;
}




/* =========================================================
drei spalten
===========================================================*/


#umschlag {display:flex;
	flex-direction: row;
	/*flex-flow:column;    untereinander*/
	width: 100%;
	margin-top: ;
	margin: auto;
	line-height: 1.7em;
}


#umschlag img {width: 100%; height: auto; padding: 0em 0;}

#blue {width: 100%; padding-bottom: 0px;}

#links {flex: 1;}

#mitte {flex:1; 
}

#rechts {flex: 1; 
}

#testi {flex: 1; padding:0em; border-radius: 0px;}


#umschlagd {display:flex;
	flex-direction: row;
	/*flex-flow:column;    untereinander*/
	width: 100%;
	margin-top: ;
	margin: auto;
	line-height: 1.7em;
}


#umschlagd img {width: 100%; height: auto; padding: 0em 0;}


#linksd {flex: 1;
	     margin-right: 0em;
	     border-radius:0px;
}

#mitted {flex:1; padding: 0em; border-radius: 0px; 
}

#rechtsd {flex: 1; padding:0em; border-radius: 0px; text-align: center; 
}









#links, #mitte, #rechts {}






#umschlag2 {display:flex;
	flex-direction: row;
	/*flex-flow:column;    untereinander*/
	width: 100%;
	margin-top: ;
	margin: auto;
	line-height: 1.7em;
}
#links2, #mitte2, #rechts2 img {width: 100%; height: auto;}


#links2 {flex: 1;
	     padding0em;
	     margin-right: 0em;
	     border-radius:0px;
}

#mitte2 {flex:1; padding: 0em; 
}

#rechts2 {flex: 1; padding:0em; border-radius: 0px; text-align: center;
}



#ausbildungen ul a:link, a:active, a:visited, a:hover {color:;}
#ausbildungen ul a:hover {color:;}



/* =========================================================
flexcontainer
===========================================================*/

.flexcontainer {display: flex;
				flex-direction: row;
				width: 100%;
				flex-wrap: wrap;
}

.flex-item {
  flex-basis: 70%;
  flex-grow: 1;
  flex-shrink: 1;
}
/* =========================================================
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: #ffffff;
	color: #51b8c6;
         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 ul a:link, a:active, a:visited {color: ; text-decoration: none; underline: none;}
#footernav ul a:hover {color:; text-decoration: none;}



@media screen and (max-width: 630px){
		
	#footernav li {display: block;
	              font-size: 22px;}		
}




