/* .......................... RESET und Allgemeines ............................ */
* {
	margin: 0; padding: 0; border: none; outline: none; 
	-o-box-sizing: border-box; 
	-ms-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box;
}
b, strong {font-weight: bold;}
i {font-style: italic;}
em {font-style: normal;}
/* .......................... Ab hier generische Notationen ............................ */
html, body {}
html {font-size: 62.5%; overflow-y: scroll; }
body {
	padding: 4rem 0 0 0;
	font-family: "Trebuchet MS", arial, geneva, sans-serif;
	line-height: 1.5;
	font-weight: normal;
	color: rgb(51,51,51);
	background: url(../bilder/HG_Bilder/HG_Standard.jpg) center top no-repeat rgb(230,230,230) fixed; background-size: cover;
}
body.Wohnung {background-image: url(../bilder/HG_Bilder/HG_2017_Wohnung.jpg);}
body.Umgebung {background-image: url(../bilder/HG_Bilder/HG_Wolke_Weide.jpg);}
body.Region {background-image: url(../bilder/HG_Bilder/IMG_0589.jpg);}
body.Preise {background-image: url(../bilder/HG_Bilder/HG_Sonne_Wolken.jpg);}
body.Kontakt {background-image: url(../bilder/HG_Bilder/HG_Regenbogen.jpg);}
/* body.Impressum {background-image: url(../bilder/HG_Bilder/HG_Rotbaum.jpg);} */

H1, H2, H3, H4, H5, H6, P {margin: 0 0px 20px 0px; overflow: hidden;}
H1 {font-family: verdana, sans-serif; font-size: 2.2rem; font-weight: normal; color: rgb(102,102,102); text-transform: uppercase;}
em, H2 {font-family: verdana, sans-serif; font-size: 2.0rem; font-weight: normal; color: rgb(102,102,102);}
H3 {font-family: verdana, sans-serif; font-size: 1.8rem; font-weight: normal; color: rgb(102,102,102);}
H4 {font-size: 1.6rem; color: rgb(77,77,77);}
H5 {font-size: 1.6rem; color: rgb(77,77,77);}
H6 {font-size: 1.5rem; color: rgb(77,77,77);}
P, TD {
	font-size: 1.5rem;
	-webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto;
}

UL {font-size: 1.4rem; margin: 0 30px 20px 44px;}
LI {}

A  {text-decoration: none; color: rgb(51,51,51); border-bottom: 1px dotted  rgb(0,0,0);}
A:HOVER  {color: rgb(0,0,0); background-color: rgba(255,255,255,0.5);}
A.ohneRand {border: none; padding: 0;}
A.intLink, A.extLink {display: inline-block; padding-left: 20px; background: left 2px no-repeat; color: rgb(2,133,150); border: none;}
A.intLink:HOVER, A.extLink:HOVER {background-color: rgb(250,255,255);}
A.intLink {background-image: url(../eicons/intLink.png);}
A.extLink {background-image: url(../eicons/extLink.png);}

/* .......................... Ab hier seitenspezifische Notationen ............................ */
.topNaviWrapper {position: fixed; top: 0; z-index: 99; width: 100%; height: 4.5rem; padding: 0; border-bottom: 1px solid  rgb(230,230,230);
	-ms-box-shadow: rgba(0,0,0,0.45) 0px 1px 10px 0px;
	-webkit-box-shadow: rgba(0,0,0,0.45) 0px 1px 10px;
	-moz-box-shadow: rgba(0,0,0,0.45) 0px 1px 10px;
	box-shadow: rgba(0,0,0,0.45) 0px 1px 10px;
	/* Color . xOff . yOff . Blur . Breite(nur IE)*/
	background-color: rgb(3,170,197);  /* Old browsers */
}
.topNaviBox {width: 100%; max-width: 980px; margin: 0 auto; position: relative;}
/* .Navigations-Notationen in der navi...css. */
.topNaviBox .logo {position: absolute; top: 0; right: 0rem; font-family: verdana, sans-serif; font-size: 2.4rem; line-height: 4rem; font-weight: normal; color: rgb(255,255,255);}
.topNaviBox .logo A {font-family: verdana, sans-serif; font-size: 2.4rem; line-height: 4rem; font-weight: normal; color: rgb(255,255,255); border: none;}
.topNaviBox .logo A:HOVER {background: none;}
.topNaviBox .logo A IMG {opacity: 0.60;}
.topNaviBox .logo A.aktiv IMG {opacity: 1.0;}

/* .Streifenboxen Wrapper. */
.wrapper  {width: 100%; min-height: 1rem; position: relative;}
.buttonBox, .header, #navigation, .inhalteBox, .fuszBox {width: 980px; margin: 0 auto;}

/* ..header mit .bildBox. */
.header {position: relative; margin: 20px auto 10px auto;}
.header img {width: 73.5%; max-width: 720px; height: auto;}
.header a {border: none;}
.header a:HOVER {background: none;}

/* .Inhalteboxen innerhalb Wrapper. */
.inhalteBox {position: relative; overflow: hidden; padding: 3rem; 
	background: rgb(255,255,255);
	background: rgba(255,255,255,0.95); 
	-webkit-border-radius: 2rem 2rem 2rem 2rem;
	-moz-border-radius: 2rem 2rem 2rem 2rem;
	border-radius: 2rem 2rem 2rem 2rem;
	/* OL OR UR UL */
}
.inhalteBox .topLink {position: absolute; right: 1rem; bottom: 1rem; width: 17px; height: 12px;}
.inhalteBox .topLink A {border: none;}

.googleKarte {width: 90%; max-width: 800px; height: 600px; border: 2px solid rgb(153,153,153);}

.fuszBox {padding: 2rem; background: rgb(2,133,150); border: 1px solid  rgb(1,80,91); text-align: center; 
	-webkit-border-radius: 2rem 2rem 0 0;
	-moz-border-radius: 2rem 2rem 0 0;
	border-radius: 2rem 2rem 0 0;
	/* OL OR UR UL */
}
.fuszBox H2 {font-family: verdana, arial, geneva, sans-serif; font-size: 4rem; line-height: 1.25; color: rgb(255,255,255);}
.fuszBox P {font-family: verdana, arial, geneva, sans-serif; font-size: 2rem; line-height: 1.25; color: rgb(255,255,255);}

.inhalteBox, .fuszBox {	
	-ms-box-shadow: #666 1px 0px 4px 0px;
	-webkit-box-shadow: #666 1px 0px 4px;
	-moz-box-shadow: #666 1px 0px 4px;
	box-shadow: #666 1px 0px 4px;
	/* Color . xOff . yOff . Blur . Breite(nur IE)*/
}

#stoerer {
	width: 60%;
	margin: 3rem auto;
	padding: 2rem;
	border: 8px dashed rgb(204,0,0);
	background-color: rgb(250,250,250);
	-webkit-box-shadow: #666 3px 3px 8px;
	-moz-box-shadow: #666 3px 3px 8px;
	box-shadow: #666 3px 3px 8px;
	/* Col xOff yOff Blur */
}

#stoerer H1 {
	font-size: 4rem;
	font-weight: bold;
	color: rgb(204,0,0);
	text-align: center;
}

#stoerer P {
	font-size: 2rem;
	color: rgb(0,0,153);
	text-align: center;
}

/* .Tabellen. */
TABLE {border-collapse: collapse; margin: 3rem auto;}
TR {vertical-align: top;}
TH {padding: 3px 10px;}
TD {padding: 3px 15px 3px 0;}
TD SPAN {padding: 0px 10px 0px 0px; line-height: 2;}
TD input {width: 200px;}
TD input.kurz {width: 100px;}
TD input[type="image"] {border: none; height: 32px; width: 32px; vertical-align: middle;}
TD input[type="radio"] {border: none; height: 16px; width: 16px;}
TD input[type="checkbox"] {border: none; height: 16px; width: 16px; vertical-align: text-bottom;}
TD.flat {padding: 0px;}

/* .Formularfelder. */
input {height: 2rem; border: 1px solid rgb(220,220,220); padding: 0.3rem; line-height: 1.6rem; width: 400px;}
input.gesperrt {color: rgb(204,0,0); background: url(../eicons/lock.png) right center no-repeat rgb(255,230,230);}
input[type="image"] {border: none; height: 16px; width: 16px;}
input[type="radio"] {border: none; height: 12px; width: 12px;}
input[type="checkbox"] {border: none; height: 14px; width: 14px; vertical-align: middle;}
input[type="submit"] {
	border: 1px solid  rgb(153,153,153);
	height: 25px;
	width: 200px;
	-webkit-border-radius: 8px; /*.OL, OR, UR, UL.*/
	-moz-border-radius: 8px;
	border-radius: 8px;
	color: rgb(0,0,0);
	font-weight: bold;
}
textarea {
	font-family: arial, geneva, sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 1.3rem;
	border: 1px solid rgb(210,210,210);
	padding: 5px;
	width: 100%;
}
/* .Placeholder-Styles. NICHT gruppierbar!. */
textarea::-webkit-input-placeholder { /* WebKit, Blink, Edge */color: rgb(3,170,197); font-style: italic;}
textarea:-moz-placeholder { /* Mozilla Firefox 4 to 18 */color: rgb(3,170,197); opacity:  1; font-style: italic;}
textarea::-moz-placeholder { /* Mozilla Firefox 19+ */color: rgb(3,170,197); opacity:  1; font-style: italic;}
textarea:-ms-input-placeholder { /* Internet Explorer 10-11 */color: rgb(3,170,197); font-style: italic;}
textarea:placeholder-shown { /* Standard */ color: rgb(3,170,197); font-style: italic;}

select {border: 1px solid rgb(204,204,204);}
select option { padding: 0 10px;}

.Datenschutz .DS_Einzug {margin-left: 3rem;}
.Datenschutz .DS_Erklaerung {font-style: italic; color: rgb(77,77,77);}

/* .ALLGEMEINE Einstellungen. */
/* .Hintergrundfarben und Schatten. */
.schatten {
	-webkit-box-shadow: rgb(153,153,153) 1px 1px 8px;
	-moz-box-shadow: rgb(153,153,153) 1px 1px 8px;
	box-shadow: rgb(153,153,153) 1px 1px 8px;
	/* Col xOff yOff Blur */
}

/* .Schriftfarben und Schriftverhalten. */
.keinUmbruch {white-space: nowrap;}
.weisz {color: rgb(255,255,255);}
.hellGrau {color: rgb(230,230,230);}
.grau {color: rgb(153,153,153);}
.igrau, .igrau A {color: rgb(153,153,153); font-style: italic;}
.rot {color: rgb(204,0,0);}
.cyan {color: rgb(0,153,153);}
.gruen {color: rgb(0,102,0);}

/* Orientierung + Abstaende*/
.clearB {clear: both;}
.clearL {clear: left;}
.clearR {clear: right;}

/* .Bilder. */
.linksBild, .linksBildRand {width: 50%; max-width: 360px; height: auto; float: left; margin: 1px 15px 6px 1px;}
.rechtsBild, .rechtsBildRand {width: 50%; max-width: 360px; height: auto; float: right; margin: 1px 1px 6px 15px;}
.linksBildRand, .rechtsBildRand {border: 20px solid; border-color: rgb(245,250,255); outline: 1px solid rgb(204,204,204);}
.mitte {vertical-align: middle;}
/* .. */
.autoImage {display: block; width: 100%; height: auto;}