@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Roboto:400,700);

html,body 	{margin: 0; padding: 0; border: 0; height: 101%; background-color: #FFFFFF; font-family: 'Roboto', Arial, Verdana; font-size: 95%; -webkit-font-smoothing: antialiased;}
.clear {height: 0; clear: both; visibility: hidden; line-height:1px; font-size:1px;}


#wrapper 	{margin: 0 auto; width: 970px; padding: 10px 0 0 0;}

.fs90	{font-size: 90%;}
.fs85	{font-size: 85%;}
.fs80	{font-size: 80%;}
.fs75	{font-size: 75%;}
.fs70	{font-size: 70%;}


/* Sidenav ========================================================= */
#navi				{float: left; width: 145px; min-height: 550px; text-align: right; line-height: 25px; font-size: 90%;}
#navi	img		{border: 0;}

.nav0				{color: #b9b893; font-weight: 700; font-size: 110%}
.nav0 a			{font-weight: 700; color: #b9b893; text-decoration:none;}
.nav0	span 	{text-decoration: underline;}

#nav	a			{font-weight: 700; color: #333333; text-decoration:none;}
#nav	span 	{text-decoration: underline; }


.logo_zus	{margin-top: 25px;}
.spacer		{line-height: 30px;}



/* Main ========================================================= */
#main {float: left; width: 780px; margin: 0 0 0 35px;}
#main a {color: #333333;}

/* Topnav ========================================================= */
#topnav							{margin:0 auto; width: 100%; height: 64px; background-color: #e8e8e9; padding: 0; text-align: center;}
#topnav	.spacer			{float:left; padding: 0 0 0 8px; letter-spacing: 0.9px;}
#topnav	img					{border: 0;}

#topnav a								{text-decoration: none;}
#topnav	.verkauf a			{float:left; background-image:url(images/ich_verkaufe.gif); width: 146px; height: 64px;}
#topnav	.verkauf a:hover{background-image:url(images/ich_verkaufe_.gif);}
#topnav	.verkauf_a a		{float:left; background-image:url(images/ich_verkaufe_.gif); width: 146px; height: 64px;}

#topnav	.suche a				{float:left; background-image:url(images/ich_suche.gif); width: 146px; height: 64px;}
#topnav	.suche a:hover	{background-image:url(images/ich_suche_.gif);}
#topnav	.suche_a a			{float:left; background-image:url(images/ich_suche_.gif); width: 146px; height: 64px;}

#topnav	.service a			{float:left; background-image:url(images/service.gif); width: 146px; height: 64px;}
#topnav	.service a:hover{background-image:url(images/service_.gif);}
#topnav	.service_a a		{float:left; background-image:url(images/service_.gif); width: 146px; height: 64px;}

#topnav	.groessing a		{float:left; background-image:url(images/groessing.gif); width: 146px; height: 64px;}
#topnav	.groessing a:hover{background-image:url(images/groessing_.gif);}
#topnav	.groessing_a a	{float:left; background-image:url(images/groessing_.gif); width: 146px; height: 64px;}

#topnav	.kontakt a			{float:left; background-image:url(images/kontakt.gif); width: 146px; height: 64px;}
#topnav	.kontakt a:hover{background-image:url(images/kontakt_.gif);}
#topnav	.kontakt_a a		{float:left; background-image:url(images/kontakt_.gif); width: 146px; height: 64px;}

.clear_topnav		{height: 15px;}

/* MainContent ========================================================= */
#content		{clear:both; font-size: 100%;}
h1 {margin: 0.5em 0; font-size: 160%; font-weight: 400; font-family: 'Roboto', Arial, Verdana, sans-serif; }
h2 {margin: 0.5em 0; font-size: 140%; font-weight: 400; font-family: 'Roboto', Arial, Verdana, sans-serif; color: #414141;}

#index		{clear:both;}
#index .l {float: left; width: 440px; padding: 0 15px 0 0;}
#index .r {position: relative; float: right; width: 250px;  min-height: 550px; padding: 0 15px 0 20px; background-color: #efeec3; }
#index .t0{position: absolute; top: 90px; margin: 0; font-size: 150%; font-weight: 400; font-family: 'Roboto', Arial, Verdana, sans-serif; color: #414141; line-height: 130%;}
#index .t {position: absolute; bottom: 25px; margin: 0.5em 0; font-size: 150%; font-weight: 400; font-family: 'Roboto', Arial, Verdana, sans-serif; color: #414141; line-height: 130%;}




#verkauf		{}
#verkauf .l {float: left;  width: 440px; height: 550px; padding: 0 15px 0 20px; background-color: #eae5d9;}
#verkauf .r {float: right; width: 285px; height: 550px; background-color: #afab8a;}
#verkauf .r h2 {margin: 160px 25px 0 0; font-size: 130%; font-family: 'Roboto', Arial, Verdana, sans-serif; color: #414141; text-align: right;}
#verkauf .form_verkauf				{}
#verkauf .form_verkauf .tf		{width: 400px; background-color: #f3f2ea; border: 1px solid #cecbae; padding: 2px; margin-top: 2px;}
#verkauf .form_verkauf .ta		{width: 400px; height: 85px; background-color: #f3f2ea; border: 1px solid #cecbae; padding: 2px; margin-top: 2px;}
#verkauf .text_button {border: none; background-color: transparent; padding: 0; margin-left: -4px; text-decoration: none; font-family: 'Roboto', Arial, Verdana, sans-serif; font-size: 100%; font-weight: bold; color: #333333;}


#suche			{}
#suche .l 	{float: left;  width: 440px; height: 595px; padding: 0 15px 0 20px; background-color: #e6f0ec;}
#suche .r 	{float: right; width: 285px; height: 595px; background-color: #aacec1;}
#suche .r h2{margin: 210px 25px 0 0; font-size: 130%; font-family: 'Roboto', Arial, Verdana, sans-serif; color: #414141; text-align: right;}
#suche input {background-color: #f7faf9;  border: 1px solid #d1e4dd; padding: 2px; margin-left: 5px; }
#suche .text_button {border: none; background-color: transparent; padding: 0; margin-left: -4px; text-decoration: none; font-family: 'Roboto', Arial, Verdana, sans-serif; font-size: 100%; font-weight: bold; color: #333333;}


#service			{}
#service .l 	{float: left;  width: 440px; height: 500px; padding: 0 15px 0 20px; background-color: #cadced;}
#service .r 	{float: right; width: 285px; height: 500px; background-color: #60a4d0;}
#service .r h2{margin: 170px 25px 0 0; font-size: 130%; font-family: 'Roboto', Arial, Verdana, sans-serif; color: #414141; text-align: right;}
#service ul		{margin-top: 25px;}
#service li		{line-height: 185%; font-size: 90%;}


#groessing			{}
#groessing .l 	{float: left;  width: 440px; height: 480px; padding: 0 15px 0 20px; background-color: #ccd8ba;}
#groessing .l p	{line-height: 165%;}
#groessing .r 	{float: right; width: 285px; height: 480px; background-color: #6c903d;}
#groessing .r h2{margin: 150px 25px 0 0; font-size: 130%; font-family: 'Roboto', Arial, Verdana, sans-serif; color: #414141; text-align: right;}


#kontakt		{}
#kontakt .l {float: left;  width: 440px; height: 500px; padding: 0 15px 0 20px;background-color: #faf8e9;}
#kontakt .r {float: right; width: 285px; height: 500px;}


#angebote 		{clear:both; min-height: 500px; background-color: #faf8e9; padding: 3px 15px 15px 20px; font-family: 'Roboto', Arial, Verdana, sans-serif; font-size: 90%;}
#angebote h1 	{margin: 0.5em 0; font-size: 150%; font-weight: normal; }
#angebote h2	{margin: 10px 0; font-size: 115%; font-weight: 500; color: #009900; text-transform: uppercase;}
#angebote .details 				{float:left; border-bottom: 1px dotted #666666; padding: 0 0 5px 0; width: 99%;}
#angebote .details 	p			{margin:0;}
#angebote .details .bild 	{float:left; min-width: 20%; border: 0;}
#angebote .details img 		{padding: 1px; background-color: #FFFFFF; border: 1px solid #666666;}
#angebote .details .facts {float:left; width: 40%; margin: 0 0 0 15px;}
#angebote .details .zinfo {float:right; width: 34%; padding: 0 0 0 15px;}


/* DETAILSEITE */

#details	 		{clear:both; min-height: 500px; background-color: #faf8e9; padding: 3px 15px 15px 20px; font-family: 'Roboto', Arial, Verdana, sans-serif; font-size: 90%;}
#details h1 	{margin: 0.5em 0; font-size: 150%; font-weight: normal; color: #009900; text-transform: uppercase;}
#details h2		{margin: 0; font-size: 100%; font-weight: bold;}

#details .wrap {font-size: 100%; width: 100%;}

#details .l {float: left;  width: 40%; margin: 10px 0 10px 0; padding: 10px; background-color: #f9f8f4; border: 1px solid #efecd8;}

#details .eckdaten			{float: left;}
#details .eckdaten .key {float: left; width: 160px; font-weight: bold; color: #333333;}
#details .eckdaten .val {float: left; width: 120px;}

#details .features			{float: left;}
#details .features .key {float: left; width: 160px; font-weight: bold; color: #333333;}
#details .features .val {float: left; width: 120px;}

#details .line{width: 100%; border-bottom: 1px dotted #C0C0C0; height: 1px; line-height: 1px; margin: 5px 0;}

#details .r {float: right; width: 52%; margin: 10px 0 10px 0; padding: 10px; background-color: #f9f8f4; border: 1px solid #efecd8;}


#details .popup-gallery			{width: 95%; text-align: center;}
#details .popup-gallery img {margin: 1px; padding: 1px; background-color: #FFFFFF; border: 1px solid #666666;}

#details .footer 	{width: 100%;}
#details .footer_l{float: left; margin-left: 5px;}
#details .footer_r{float: right; text-align: right; font-weight: bold; margin-right: 5px;}


#wir_suchen				{clear:both; min-height: 518px; background-image:url(images/bg_wir_suchen.gif); width: 780px; background-repeat: repeat-y;}
#wir_suchen .l 		{float: left;  width: 440px; min-height: 518px; padding: 0 15px 0 20px;}
#wir_suchen .r 		{float: right; width: 285px; min-height: 518px;}
#wir_suchen .r h2	{margin: 100px 25px 0 0; font-size: 130%; font-family: 'Roboto', Arial, Verdana, sans-serif; color: #414141; text-align: right;}
.dott	{margin:0; padding: 0; line-height: 1px; border-bottom: 1px dotted #666666;}




#impressum		{clear:both;background-image:url(images/bg_impressum.gif); width: 780px; background-repeat: repeat-y;}
#impressum .l	{float: left;  width: 435px; padding: 0 20px;}
#impressum .r	{float: right; width: 245px; padding: 0 20px;}
#impressum .imprint	{font-size: 70%; color: #666666;}
#impressum .ds	{font-size: 85%; color: #666666;}



/* Footer ========================================================= */
#footer				{margin: 0 auto; width: 970px; padding: 15px 0;}
#footer 		p 	{margin: 5px 0 0 0;}
#footer			a	{text-decoration: none; color: #333333;}
.impressum			{float: left; width: 145px; height: 66px; line-height: 2em; margin-top: 10px; text-align: right; font-size: 80%;}
.impressum	a 		{text-decoration:none; color: #333333;}
#f_kontakt			{float: left; width: 780px; height: 64px; margin: 0 0 0 33px; background-color: #e8e8e9; padding: 2px; font-size: 90%; font-family: 'Roboto', Arial, Verdana, sans-serif; letter-spacing: normal;}
#footer .gi						{font-size: 140%;}
#footer .f_kontakt		{border: 2px solid #FFFFFF; height: 60px; line-height: 130%;}
#footer .f_kontakt1		{float: left; width: 300px; padding: 15px 0 0 10px;}
#footer .f_kontakt2		{float: left; width: 185px; padding: 15px 0 0 0;}
#footer .f_kontakt3		{float: left; width: 140px; padding: 15px 0 0 0;}
#footer .f_kontakt4		{float: left; width: 135px; padding: 15px 0 0 0;}

#a4u  	{margin: 0 auto; width: 945px; padding: 0.5em 0; font-size: 70%; color: #C0C0C0; text-align: right; font-family: Tahoma}
#a4u a 	{color: #C0C0C0; text-decoration: none;}





.cookie_banner-wrapper{z-index:9001;position:relative}
.cookie_container .cookie_btn{cursor:pointer;text-align:center;font-size:0.6em;-webkit-transition:font-size 200ms;transition:font-size 200ms;line-height:1em}
.cookie_container .cookie_message{font-size:0.6em;-webkit-transition:font-size 200ms;transition:font-size 200ms;margin:0;padding:0;line-height:1.5em}
@media screen and (min-width:500px){
.cookie_container .cookie_btn{font-size:0.8em}
.cookie_container .cookie_message{font-size:0.8em}
}
@media screen and (min-width:768px){
.cookie_container .cookie_btn{font-size:1em}
.cookie_container .cookie_message{font-size:1em;line-height:1em}
}
@media screen and (min-width:992px){
.cookie_container .cookie_message{font-size:1em}
}
@media print{.cookie_banner-wrapper,.cookie_container{display:none}}
.cookie_container{position:fixed;left:0;right:0;bottom:0;overflow:hidden;padding:10px}
.cookie_container .cookie_btn{
padding: 0.8em 1em; background-color:#f1d600;background-color:black;cursor:pointer;-webkit-transition:font-size 200ms;transition:font-size 200ms;text-align:center;font-size:0.6em;display:block;width:33%;margin-left:10px;float:right;max-width:80px
}
.cookie_container .cookie_message{-webkit-transition:font-size 200ms;transition:font-size 200ms;font-size:0.6em;display:block}
@media screen and (min-width:500px){
.cookie_container .cookie_btn{font-size:0.8em}
.cookie_container .cookie_message{margin-top:0.5em;font-size:0.8em}
}
@media screen and (min-width:768px){
.cookie_container{padding:15px 30px 15px}
.cookie_container .cookie_btn{font-size:1em;padding:8px 15px}
.cookie_container .cookie_message{font-size:1em}
}
@media screen and (min-width:992px){
.cookie_container .cookie_message{font-size:1em}
}
.cookie_container{background-color:#4c4c4c; opacity: 0.96; color: #FFFFFF; font-family: Arial; box-sizing: border-box; border-top: 1px solid #CCCCCC;}
.cookie_container::-moz-selection {background: #FF5E99; color: #FFFFFF; text-shadow: none}
.cookie_container .cookie_btn,.cookie_container .cookie_btn:visited{
color: #000000; background-color: #009900; background-color: #33cc33; transition:background 200ms ease-in-out,color 200ms ease-in-out,box-shadow 200ms ease-in-out;-webkit-transition:background 200ms ease-in-out,color 200ms ease-in-out,box-shadow 200ms ease-in-out;border-radius:5px;-webkit-border-radius:5px
}
.cookie_container .cookie_btn:hover,.cookie_container .cookie_btn:active {background-color: #33FF00; color: #000000;}
.cookie_container a,.cookie_container a:visited{text-decoration:none;color:#FFFFFF;-webkit-transition:200ms color;transition:200ms color}
.cookie_container a:hover,.cookie_container a:active{color:#FFFFFF;}

@-webkit-keyframes slideUp{0%{-webkit-transform:translateY(66px);transform:translateY(66px)}
100%{-webkit-transform:translateY(0);transform:translateY(0)}
}
@keyframes slideUp{0%{-webkit-transform:translateY(66px);-ms-transform:translateY(66px);transform:translateY(66px)}
100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}
}
.cookie_container,.cookie_message,.cookie_btn{animation-duration:0.8s;-webkit-animation-duration:0.8s;-moz-animation-duration:0.8s;-o-animation-duration:0.8s;-webkit-animation-name:slideUp;animation-name:slideUp}
.cookie_container a, .cookie_message a {font-size: 0.8em; font-weight: normal; color: #FFFFFF; text-decoration: underline;}