﻿@import url('https://fonts.googleapis.com/css?family=Muli:300,300i');
@import url('https://fonts.googleapis.com/css?family=Raleway:800,800i');

@import url("menu.css") screen and (max-width: 760px);
@import url("menu.css") screen and (max-width : 1024px) and (orientation : portrait);

html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 { -webkit-text-size-adjust:none; }

body { margin-top:0px; margin-left:0px; background-color: #ffffff; } 

h1,h2,h3,.farbe,.mobil,.hinterfarbe,li,nav,#p1 { font-family: 'Muli', Arial, sans-serif; }

h1 { font-size:28px; color:#66BD31; font-weight:normal; text-transform:lowercase; margin-top:0; margin-bottom:20; }
h2,li,input,textarea,option,checkbox,select { font-size:16px; color:#333333; line-height:135%; font-weight:normal; margin-top:0; margin-bottom:0; }
h3 { font-size:15px; color:#333333; line-height:130%; font-weight:normal; margin-top:0; margin-bottom:0; }

nav ul,li { list-style: none; padding-left: 0px; }
nav ul li ul li a { padding-left: 2px; }

a:link { color:#333333; text-decoration:none; }
a:visited { color:#333333; text-decoration:none; }
a:hover { color:#66BD31; text-decoration:none; background-color:#E0E0E0; }
a:active { color:#333333; text-decoration:underline; }

fieldset { border: 1px dotted #E0E0E0; margin-bottom:10px; }
legend   { color:#53B900; font-weight:bold; font-size: 1.1em; padding:5px; }

.farbe { color:#4B4B4B; background-color:#F0F0F0; line-height:130%; font-weight:normal; padding: 15px 10px 15px 25px; margin-top:0; margin-bottom:0; }
.rot { color:#FF0000; }
.vorher  {  background-color: #FFFFFF; }
.nachher { border: 1px solid #FF0000; padding: 2px; }
.telefon { border: 1px solid #66BD31; padding: 3px; }
.gestr { font-weight:bold; border-bottom: 1px dotted #66BD31; }
.gestrn { border-bottom: 1px dotted #66BD31; }

input,textarea,option,select 
{
	border: 1px solid #66BD31; padding: 2px; 
	-moz-border-radius:7x;
	-webkit-border-radius:7px;
	-khtml-border-radius:7px;
	 border-radius:7px;
	 behavior:url(border-radius.htc);
}

input[type=checkbox]
{
	-ms-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-webkit-transform: scale(1.5);
	-o-transform: scale(1.5);
}
 
textarea,input[type=text],input[type=tel],input[type=email],input[type=number],input[type=password] 
{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
}

.bildrahmen
{
	 padding: 8px;
	 background: #ffffff;
	 border: 1px solid #E0E0E0;
} 

img.zoom
{
	padding: 5px;
	background: #ffffff;
	border: 1px dotted #E0E0E0;
	 transition: transform 1.0s;
	 -moz-transition: transform 1.0s;
	 -webkit-transition: transform 1.0s;
	 -o-transition: transform 1.0s;
	 -ms-transition: transform 1.0s;
}

img.zoom:hover
{
	 z-index: 100;
	 position:relative;
	 cursor: zoom-in;
	 cursor: -moz-zoom-in;
	 cursor: -webkit-zoom-in;
	 transform: scale(1.3, 1.3);
	 -moz-transform: scale(1.3, 1.3);
	 -webkit-transform: scale(1.3, 1.3);
	 -o-transform: scale(1.3, 1.3);
	 -ms-transform: scale(1.3, 1.3);
	 transition-duration: 1s,0.5s;
}

img.bildrahmen,#seitenbild
{
	 transition: transform 1.0s;
	 -moz-transition: transform 1.0s;
	 -webkit-transition: transform 1.0s;
	 -o-transition: transform 1.0s;
	 -ms-transition: transform 1.0s;
}

img.bildrahmen:hover,#seitenbild:hover
{
	 cursor: zoom-in;
	 cursor: -moz-zoom-in;
	 cursor: -webkit-zoom-in;
	 transform: scale(1.05, 1.05);
	 -moz-transform: scale(1.05, 1.05);
	 -webkit-transform: scale(1.05, 1.05);
	 -o-transform: scale(1.05, 1.05);
	 -ms-transform: scale(1.05, 1.05);
	 transition-durationxxxx: 1s,0.5s;
	 transition-duration: 2s,1.0s;
}

.kopfbutton
{
	 padding: 2px 5px 2px 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
	-khtml-border-radius:5px;
	 border-radius:5px;
	 behavior:url(border-radius.htc);
	 box-shadow: 3px 3px 5px #999999;
	 background-color:#0199C7;
}

.hinweisrahmen
{
 	background-color:#FFFFFF; 
 	padding: 10px 10px 10px 10px; 
 	box-shadow: 3px 3px 5px #999999;
} 

.hinweisrahmen,.linkfarbe:hover { background-color:#F4F4F4; }
.logorand { padding: 5px; width: 400px; }
.rand td { border-bottom-style: dotted; border-bottom-color: #66BD31; border-bottom-width: 1px; border-left-width: 0px; border-top-width: 0px; border-right-width: 0px; }

button { width: 30px; height:25px; }

.buttonrahmen  { line-height: 20px; margin-right: 10px; padding: 8px; background: #FFFFFF; border-bottom: 1px solid #66BD31; border-right: 1px solid #66BD31; border-top: 1px solid #66BD31; border-left: 1px solid #66BD31; } 
.buttonrahmen1 { line-height: 20px; margin-right: 10px; padding: 8px; background: #FFFFFF; border-bottom: 1px solid #E0E0E0; border-right: 1px solid #E0E0E0; border-top: 1px solid #E0E0E0; border-left: 1px solid #E0E0E0; } 

.buttonnw {  white-space: nowrap; line-height: 45px; margin-right: 7px; padding: 6px; background: #FFFFFF; border-bottom: 1px solid #66BD31; border-right: 1px solid #66BD31; border-top: 1px solid #66BD31; border-left: 1px solid #66BD31; } 
.buttonnw1 { white-space: nowrap; line-height: 45px; margin-right: 7px; padding: 6px; background: #FFFFFF; border-bottom: 1px solid #E0E0E0; border-right: 1px solid #E0E0E0; border-top: 1px solid #E0E0E0; border-left: 1px solid #E0E0E0; } 
 
#suchbegriff { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 80%; }

#seitenbreite1 { width:100%; margin:0px auto; }
#seitenbreite2 { width:1100px; margin:0px auto; }

#kopfzeile { position:fixed; padding: 2px; top:0px; left:0px; right:0px; height:auto; z-index: 5; background-color:#66BD31; text-align:center; }
#kopf1 { margin-left:40px; margin-top:45px; margin-bottom:-150px; z-index:2;  position: relative; }
#kopf2 { width:100%; margin-top:15px; margin-bottom:-152px; z-index: 3; position: relative; }
#seitenbild { width:100%; float:left; margin-bottom: 20px; margin-top:-85px; z-index: 0; position: relative;}

#start  { font-family: 'Raleway', sans-serif; font-size:36px;  background:rgba(54, 25, 25, 0.2); letter-spacing:1px; text-transform:lowercase; text-shadow:0 0 1px #333333; text-align:center; color:#ffffff; font-weight:bold;  }
#jameda { display:inline; }

#links, #mitte { display:inline; float:left; width: 32.2%; text-align:left; margin-right: 15px; margin-bottom:20px; }
#rechts { display:inline; float:left; width: 32.2%; text-align:left; margin-bottom:20px; }
#rechts:hover,#mitte:hover,#links:hover { background-color:#E0E0E0; }

#kopfja { width:100%; display:block; }
#kopfnein { display: none; }
#menukopf { display: none; }

#iphone { display:inline; }
#ipad { display:inline; }

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

#menu1 { clear:both; width: 240px; float: left; margin-bottom: 20px; }
#p0 { display:block; }
#p1 { font-size: 22px; color:#FFFFFF; font-weight:normal; margin-top:0px; margin-bottom:0px; padding-left: 10px; }
#p2 { display: none; } 

#inhalt { width: 550px; float: left; padding: 5px 15px; border: 1px solid #F0F0F0; }
#inhalt_breit { width: 825px; float: left; padding: 5px 10px; }
#inhalt_php { width: 825px; float: center; padding: 5px 10px; }
#kontakt { width: 275px; float: right; }

#formular { display:block; }
#footer1 { clear: both; width: 245px; float: left; padding: 5px 0px; margin-top:20px; }
#footer2 { width: 550px; float: left; padding: 5px 10px; margin-top:20px; }
#footer3 { width: 240px; padding: 5px 0px; text-align: right; float: right; margin-top:20px; }
#footer5 { display:block; width: 100%; }

@media only screen and (max-width:1024px)
{
	h1 { font-size: 28px; }
	h2,li,input,textarea,option,checkbox,select { font-size: 17px; }
	h3 { font-size: 15px; }
	
	li { line-height:140%; }
	
	#seitenbreite1 { width: 95%; }
	#seitenbreite2 { width: 95%; }

	#start { font-size:34px; }

	#kopf1 { margin-left: 0px; margin-bottom: 0px; margin-top: 0px; z-index: 3; position: relative; }
	#kopf2 { width:100%; margin-top: 0px; margin-bottom: -75px; z-index: 2; position: relative; }

	#menukopf { display: none; }
	#kopfja { width:100%; display:block; }
	#kopfnein { display: none; }

	#seitenbild { width:100%; float:left; margin-bottom: 20px; z -index: 0; position: relative; }
	img { max-width: 100%; height: auto; }

	#menu1 { width: 240px; float: left; }
	#p0 { display: block; }
	#p2 { display: none; } 

	#inhalt,#inhalt_breit { width: 69%; padding:0px; float: right; border: 0px; }
	#kontakt { display: none; }

	#footer1 { clear: both; width: 220px; float: left; padding: 5px 0px; }
	#footer2 { display:block; width:69%; padding: 5px 0px; float: right; margin-top:0px; }
	#footer3 { clear: inline; width:69%; float: right; text-align: left; padding: 5px 0px; margin-top:0px; }
	#footer4 { display: none; }
}

@media only screen and (max-width : 1024px) and (orientation : portrait)
{
	h1 { font-size: 26px; }
	h2,li,input,textarea,option,checkbox,select { font-size: 17px; line-height:145%; }
	h3 { font-size: 15px; }

	#kopfja { display:none; }
	#kopfnein { width:100%; text-align:center; display:block; }
	#menukopf { display: block; }
	#ipad { display:none; }

	#links, #mitte { display:inline; float:left; width: 31%; text-align:center; margin-right: 15px; margin-bottom:20px; }
	#rechts { display:inline; float:left; width: 31%; text-align:center; margin-bottom:20px; }
	
	img { max-width: 100%; height: auto; }
	img.zoom { width: 95%; }
	img.zoom:hover
	{
		 z-index: 30;
		 cursor: default;
		 cursor: -moz-default;
		 cursor: -webkit-default;
		 transform: scale(1.0, 1.0);
		 -moz-transform: scale(1.0, 1.0);
		 -webkit-transform: scale(1.0, 1.0);
		 -o-transform: scale(1.0, 1.0);
		 -ms-transform: scale(1.0, 1.0);
	}
	
	nav ul li ul li a { padding-left: 15px; }
	#suchbegriff { width: 100%; }

	#menu1 { display:block; width:100%; }
    #p0 { display:none; }
	#p2 { display:inline; } 
    
    #inhalt,#inhalt_breit,#inhalt_php { width: auto; float: right; border: 0px; }
	#kontakt { display: none; }

	#footer1 { display:none; }
	#footer2 { display:inline; width: 45%;  }
	#footer3 { display:inline; width: 45%; margin-left:0px; float: left; }
	#footer4 { display: none; }
}

@media only screen and (max-width:760px)
{
	h1 { font-size: 22px; }
	h2,li,input,textarea,option,checkbox,select { font-size: 17px; line-height:145%; }
	h3 { font-size: 15px; }

	img { max-width: 100%; height: auto; }
	
	nav ul li ul li a { padding-left: 15px; }
	#suchbegriff { width: 100%; }

	#kopf1 { margin-left:0px; margin-top:0px; margin-bottom: 10px; }
	#kopf2 { width:100%; margin-top: 0px; margin-bottom: -75px; z-index: 2; position: relative; }
	#jameda { display:none; }

	#links,	#mitte, #rechts { float:left; width:100%; margin-bottom:0px; text-align:left; }

    #kopfja { display:none; }
	#kopfnein { width:100%; text-align:center; display:block; }
	
	#kopfzeile { display:none; }

	#menukopf { display: block; }
	#menu1 { display:block; width:100%; }
    #p0 { display:none; }
	#p2 { display:inline; } 
    
	#inhalt,#inhalt_breit,#inhalt_php { display:block; width: auto; float: left; margin-left: 0px; border: 0px; }
	#kontakt { display: none; }

	#footer1 { display:none; }
	#footer2 { width: auto; float: left; }
	#footer3 { width: auto; float: left; text-align: left;  }
	#footer4 { display: none; }
}

@media only screen and (max-width: 480px)
{
	h1 { font-size: 22px; }
	h2,li,input,textarea,option,checkbox,select { font-size: 17px; line-height:150%; }
	h3 { font-size: 15px; }

	#iphone { display:none; }
	#kopfnein { width:100%; text-align:left; display:block; }
	#kopfzeile { display:none; }

	img { max-width: 100%; height: auto; }
	nav ul li ul li a { padding-left: 15px; }
	#suchbegriff { width: 100%; }

	#menu1 { display:block; width:100%; }
    #p0 { display:none; }
	#p2 { display:inline; } 
    
	#inhalt,inhalt_breit,#inhalt_php { width: auto; float: none; margin-left: 0px; border: 0px; }
	
	#formular { display:none; }
	#footer1 { display:none; }
	#footer2 { width: auto; float: left; padding: 15px 5px; }
	#footer4 { display: none; }
}