/* Basis CSS
Monika Klüber-Ott
https://monika-klueber-ott.de/
Start: 23.08.2015
Letzte Aenderung: 23.08.2015
*/


* {
margin:0;
padding:0;
}

html {
	font-size: 75%; 	
}

html>body {
	font-size: 12px;
}

body {
	background: #828387 url(https://monika-klueber-ott.de/images/site-bg-schwarz.jpg) repeat-x;
	text-align: center;	
	font-family: Arial, Tahoma, Verdana, sans-serif;
	color: #000000;
}

a:link {
color: #005DAD;
text-decoration: none;
}

a:visited {
color: #005DAD;
text-decoration: none;
}

a:hover {
text-decoration: underline;
}

a img {
border: none;
}

/* Macht die gepunktete Linie um geklickte Links unsichtbar
--------------------------------------------------------------------------------------- */

a:focus {
outline: none;
}

/* Vertikaler Rhythmus basierend auf 12px Basisgroessee fuer den Fliesstext
--------------------------------------------------------------------------------------- */

p {
font: 1em/1.5em Arial, Tahoma, Verdana, sans-serif;
margin-bottom: 1.5em;
}

h1 {
font: 1.67em/0.9em Arial, Tahoma, Verdana, sans-serif;
margin-top: 0.9em;
margin-bottom: 0.9em;
}

h2 {
font: 1.5em/1em Arial, Tahoma, Verdana, sans-serif;
margin: 1.5em 0 1em 0;
color: #193452;
}

h3 {
font: 1em/1.3em Arial, Tahoma, Verdana, sans-serif;
color: #193452;
font-weight: bold;
margin-bottom: -0.5em;
}

h4 {
font: 1.17em/1.29em Arial, Tahoma, Verdana, sans-serif;
margin-top: 1.29em;
margin-bottom: 1.29em;



}
/* Überschrift auf der Startseite
--------------------------------------------------------------------------------------- */
h5 {
font: 3.0em/1em Arial, Tahoma, Verdana, sans-serif;
margin: 1.0em 0 0em 2;
color: #193452;
padding-left: 40px;
}
/* Überschrift auf der Startseite
--------------------------------------------------------------------------------------- */
#contentgutter ul {
	font: 1em/1.5em Arial, Tahoma, Verdana, sans-serif;
	margin: 1.5em 20px;

}
#contentgutter li {
	list-style-type: square;
}


/* Layout
--------------------------------------------------------------------------------------- */
#wrapper {
	background: #fff;	
	text-align: left;		
    width: 960px;
    margin:  0 auto;
}

#meta-information {
	clear: both;
	color:  #fff;
	height: 160px;
}

/* Anfang, Bild im --- Header --- fuer Sommer und Winter austauschen, Anfang
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */
#meta-information h1{ 
background: #004000 url(https://monika-klueber-ott.de/images/bg-header-1.jpg) no-repeat top left;
font-size:0; 
height:160px; 
} 
/* Ende, Bild im --- Header --- fuer Sommer und Winter austauschen 

Ende
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */
#meta-information  h1 a{ display: block;  height:160px; width:960px; border:none;}

#meta-information  h1 span{ display:none}

#smoothmenu1 {
	float: left;
		clear: both;
		width: 890px;
		height: 32px;
background: #00B600 url(https://monika-klueber-ott.de/images/bg-navi2-gruen.jpg) bottom left repeat-x;
font: 1em/1.5em Arial, Tahoma, Verdana, sans-serif;
text-shadow: #666 2px 2px 4px;
}
#contentgutter {
			width: 910px;
	float: left;
border: 25px solid #FFF;
	background: #00B600 url(https://monika-klueber-ott.de/images/bg-gutter.gif) repeat-y;
}
#contentgutter p {
text-align: justify;
}

.hauptinhalt {
	float: left;
	width: 652px;
	min-height: 830px; 	/* Höhe der ganzen Seite */
	padding-bottom: 50px;
	background: url(https://monika-klueber-ott.de/images/bg-col1.gif) no-repeat bottom left;
}

.hauptinhalt2 {
	float: left;
	width: 652px;
	min-height: 750px;
	padding-bottom: 50px;
	background: url(https://monika-klueber-ott.de/images/bg-col1.gif) no-repeat bottom left;
	
}

.hauptinhaltblock {
	float: left;
	width: 652px;
	padding-bottom: 25px;
	
}
/* Anfang, Bild im --- Notizen Container --- fuer Sommer und Winter austauschen, Anfang
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */
.notizen{
	float: right;
	width: 236px;
	height: 50px;
	padding-top: 220px; /* -- Zähler Abstand von oben -- */
	background:  url(https://monika-klueber-ott.de/images/kleinsassen-bild-236x282.jpg)  no-repeat top center; 
}

/* Ende, Bild im --- Notizen Container --- , Ende
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */


/* Anfang, Hier beginnen die Container --- , Anfang
--------------------------------------------------------------------------------------- */
/* Anfang, Container 1 im --- Notizen Container --- , Anfang
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */
.container1{
	width: 236px;
	height: 190px;
	float: left top;
	padding-top: 0px;
}

/* Ende, Container 1 im --- Notizen Container --- , Ende
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */ 

/* Anfang, Container 2 im --- Notizen Container --- , Anfang
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */
.container2{
	width: 236px;
	height: 200px;
	float: left top;
	padding-top: 0px;
} 

/* Ende, Container 2 im --- Notizen Container --- , Ende
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */ 

/* Anfang, Container 3 im --- Notizen Container --- , Anfang
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */
.container3{
	width: 236px;
	height: 370px;
	float: left top;
	
} 

/* Ende, Container 3 im --- Notizen Container --- , Ende
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */ 

/* Ende, Hier enden die Container --- , Ende
--------------------------------------------------------------------------------------- */


/* Anfang, Logo Webdesign im --- Footer Container --- , Anfang
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */
.webdesign{
	width: 250px;
	height: 30px;
	background: url(https://wombach.de/test-html/images/wombach_webdesign-94x30.gif) no-repeat top center;
	
}

/* Ende, Logo Webdesign im --- Footer Container --- , Ende
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */ 



img.notizen-abstand {
padding-top: 70px;

}


.notizenblock {
	width: 236px;
	float: right;
	padding-top: 40px;
	
}

#footer{
clear:both;
margin: 0 25px; 
padding-top: 20px;
}

/* Basics
--------------------------------------------------------------------------------------- */
p {
	font: 1em/1.5em Arial, Tahoma, Verdana, sans-serif;
	margin-top: 1.5em;
	margin-bottom: 1.5em;
	clear: both;
}


h1, .hauptinhalt h2, .hauptinhalt h3, .hauptinhalt h4, .hauptinhalt ul, .hauptinhalt p, .notizen h2, .notizen h3, .notizen ul, .notizen p, .hauptinhaltblock h2, .hauptinhaltblock h3, .hauptinhaltblock h4, .hauptinhaltblock ul, .hauptinhaltblock p, .notizenblock h2, .notizenblock h3, .notizenblock h4, .notizenblock ul, .notizenblock p, #contentgutter h2 {
	padding: 0 20px;	
}

.notizen h2{
font: 1em/1.5em Arial, Tahoma, Verdana, sans-serif;
margin-bottom: 1.5em;
color: #193452;
font-weight: bold;

}

.notizen h3{
font: 1em/1,5em Arial, Tahoma, Verdana, sans-serif;
margin-bottom: 1.5em;
color: #193452;
font-weight: normal;
}


.bild {
	float:  left;
	padding: 5px;
	border:  1px solid #eee;
	margin: 0 18px 18px 0;
	
}

.elastisches-bild {
	float:  left;
	padding: 0.42em;
	border:  0.083em solid #eee;
	margin: 0 1.5em 1.5em 0;
	width: 25em;
	height: 16.7em;	
}

#map {
	width: 610px; 
	height: 350px;
	margin:20px;	
}

/* Footer
--------------------------------------------------------------------------------------- */
#footer p {
padding: 0 20px;
margin: 0;
}
#footer a:link {
color: #666;
text-decoration: none;
}

#footer a:visited {
color: #666;
text-decoration: none;
}

#footer a:hover {
text-decoration: underline;
}