/* CSS-Datei für: Blumenhaus-Orchidee
- responsiv Version
erstellt a.28.3.2016/ a.thomas 
#################################
letzte Änderungen :
 - 1.1.2018
 Zeile: 736 (Breite d.li-elemente in bildergalerie.php)
 .cd-accordion-menu li {
    list-style-type: none;
    width: 72%;
}

 - Media-Query eingefügt für Handy-Querformat Zeile:955 !--> (@media only screen and (max-width: 500px) {kleiner Viewport_Landscape *)
*/
/* @import url("media_at.css"); */
@import url("accordeon_at.css");

*{
	margin:0;
	padding:0; 
	}
*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
  }
html,body,#wrapper { /* footer ganz unten  */
     height:100%;     
    }
html{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height: 101%; 	/*erzwingt Scrollbar im Firefox Problem:springendes Design je nach Seiteninhalt*/ 
	
background-color:#EEBC53;/* */
	/* background: linear-gradient(135deg, rgba(255, 183, 107, 1) 10%, rgba(180, 204, 0, 1) 50%, 	rgba(255, 183, 107, 1) 90%) repeat scroll 0 0 rgba(0, 0, 0, 0); */		
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d4ab7a+0,77a380+50,e6c9a6+100&1+0,0.65+50,1+100 */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNkNGFiN2EiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSI1MCUiIHN0b3AtY29sb3I9IiM3N2EzODAiIHN0b3Atb3BhY2l0eT0iMC42NSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZTZjOWE2IiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-radial-gradient(center, ellipse cover,  rgba(212,171,122,1) 0%, rgba(119,163,128,0.65) 50%, rgba(230,201,166,1) 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover,  rgba(212,171,122,1) 0%,rgba(119,163,128,0.65) 50%,rgba(230,201,166,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center,  rgba(212,171,122,1) 0%,rgba(119,163,128,0.65) 50%,rgba(230,201,166,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d4ab7a', endColorstr='#e6c9a6',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */
	}
body {
font-family:Verdana,Tahoma,Arial,Helvetica,sans-serif;
font-size:12px;
}
#wrapper{
width:100%;
max-width:1320px;
margin:0px auto;
}
#wrapper:before {/* wichtig f.footer ganz unten */
     content:"";
     height:100%;
     margin-bottom:-50px; /* footer- Höhe*/     
     float:left ;
     display:inline-block; 
    } 
#header{
width:100%;
	position:relative;
}
#header .headergrafik{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#b5bdc8+0,828c95+36,4c6870+100&1+0,0.81+100 */
background: -moz-linear-gradient(-45deg,  rgba(181,189,200,1) 0%, rgba(130,140,149,0.93) 36%, rgba(76,104,112,0.81) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(181,189,200,1) 0%,rgba(130,140,149,0.93) 36%,rgba(76,104,112,0.81) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(181,189,200,1) 0%,rgba(130,140,149,0.93) 36%,rgba(76,104,112,0.81) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b5bdc8', endColorstr='#cf4c6870',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}
#header .headerptag{font-size: 1.2em; }
#slogan { /* neu am: 1.1.2081 --- Probleme beim Safari(IPad)--> Headergrafik wurde zu groß dargestellt !*/
    font-size: 4em;
    font-weight: bolder;
    letter-spacing: 4px;
    position: absolute;
    top: 14%;
    left: 10%;
    color: yellow;
	        transform: rotate(-10deg);
    -webkit-transform: rotate(-10deg);
       -moz-transform: rotate(-10deg);
         -o-transform: rotate(-10deg);
        -ms-transform: rotate(-10deg);
   writing-mode: lr-tb;
   z-index: 4001;
}
 /*
#slogan{
	font-size:2.2em; 
	font-weight:bold;
	letter-spacing:2px;
	position:absolute; 
	top:30%;
	right:5px;
	color:yellow;	
	Rotation nach rechts 
	-webkit-transform: rotate(8deg);
    -moz-transform:    rotate(8deg);
    -o-transform:      rotate(8deg);
	-ms-transform:     rotate(8deg);
    writing-mode: lr-tb;
	z-index:4001;
}*/
#nav{
	/* z-index:3000; */
	padding-top:1em;
}	
#nav .nav-ul{
	margin-bottom:15px;
	padding-left:1em;
}	
#nav li{
background: #8C8160 ; 
border:3px double #fff;/* #615533 */
border-radius:6px;	
display:inline;	
list-style-type:none;
font-size:1.3em;

}
#nav li a{
color:white;
text-decoration:none;
padding:0em 0.5em;
}
#nav li a:hover{
border-radius:6px;	
background: #f8af0c ;
color:#000;
} 
/*nav, auf welcher Seite bin ich?
nav ul li farbig unterlegt
------------------------------------ */
#index #index-link, 
#bildergalerie #bildergalerie-link,
#belegungsplan #belegungsplan-link,
#activities #activities-link,
#kontakt #kontakt-link,
#impressum #impressum-link,
#linksammlung #linksammlung-link
{
background: #f8896b;
color:#000;
}	
h3{text-align:center;}
h2 {
color:black;
font-size:1.4em;
text-align:center;
}
h2.align_left {
color:black;
/* font-size:1.4em; */
text-align:left;
}
marquee{
	color:yellow;
	font-size:1.5em;
	position:absolute;
	bottom:60%;
	z-index:4000;
}
#content{
float:left;
width:70%;
padding:2em;
font-size:1.2em;
 /* border-right:1px dotted black; */
}
#content_belgplan{
float:left;
width:60%;
padding:2em;
font-size:1.2em;
 border-right:1px dotted black;
}
#content-index{
 position:relative;	
}

/* Slider 1 auf HP */
.rslides { /* Slider 1 auf HP */
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0 auto;
  box-shadow:10px;
  }
.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
   box-shadow:10px;
  }
.rslides li p,.rslides2 li p{
 background: rgba(255,73,41,0.8);
background: -moz-linear-gradient(left, rgba(255,73,41,0.8) 0%, rgba(237,223,182,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(255,73,41,0.8)), color-stop(100%, rgba(237,223,182,1)));
background: -webkit-linear-gradient(left, rgba(255,73,41,0.8) 0%, rgba(237,223,182,1) 100%);
background: -o-linear-gradient(left, rgba(255,73,41,0.8) 0%, rgba(237,223,182,1) 100%);
background: -ms-linear-gradient(left, rgba(255,73,41,0.8) 0%, rgba(237,223,182,1) 100%);
background: linear-gradient(to right, rgba(255,73,41,0.8) 0%, rgba(237,223,182,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff4929', endColorstr='#eddfb6', GradientType=1 ); /**/
	 /*background-color:#DED7C2; */
	color:white;
	text-align:left;
	padding-left:30px;
	 border-radius:16px;
	 font-size:1em;
	 letter-spacing:0.1em;
	}
.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }
.rslides img {
  display: block;
 /*  height: auto; */
  float: left;
  width: 100%;
  border: 0;
  border-radius:16px;
  }

 .rslides2 { /* Slider 2 auf HP*/
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
   margin: 0 auto;
  }
.rslides2 li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }
.rslides2 li:first-child {
  position: relative;
  display: block;
  float: left;
  }
.rslides2 img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
 border-radius:16px;
 }
/* Slider ...Ende*/

/* spezielle - Formatierungen 
--------------------------------*/
#bildergalerie #content,
#impressum #content,
#linksammlung #content,
#linksammlung2 #content,
#datenschutz #content
{
	width:100%;
	border:none;
}
#bildergalerie #sidebar,
#impressum #sidebar,
#linksammlung #sidebar,
#datenschutz #sidebar
{
	display:none;	
}
#speziell .liste-vorteile{/* ferienhaus.php---ul--- */
	margin-left:2em;
	list-style-type:circle;
	line-height:1.8em;
}
#speziell .liste-vorteile a{
	color:blue;
	text-decoration:none;
	/* text-align:left; */
	display: inline;
	margin:0;
	padding:0; 	
}
#ul_bildergalerie{
	padding-top:10px;
	text-align:center;
}
#ul_bildergalerie a{
	font-size:1.0em;
	color:blue;
	text-decoration:none;
	/* text-align:left; */
	display: inline;
	margin:0;
	padding:0; 	
}
.ul_index{
padding-left:2em;
line-height:1.8em;	
}

.p_index{
/* border-top:1px solid black;*/
border-bottom:1px solid black; 
padding:1em 0em;
text-align:left;
/* font-family:'Handlee';	 */
}
.p_index2{
/* border-top:1px solid black;
border-bottom:1px solid black;*/ 
padding:1em 0em;
text-align:left;
/* font-family:'Handlee';	 */
}


p.firstletter{ 
/* 	margin-top:1em; */
	line-height:1.45em;
	padding:10px 5px ;
	border-bottom:1px solid black;
}
p.firstletter2{/* class="firstletter2" ==> ohne Border */
	/* margin-top:0.5em; */
	padding:5px 5px ;
}
.firstletter::first-letter,
.firstletter2::first-letter{
	font-size: 50px;
	line-height:50px;
    color:#f8896b;
}
p.text-small{font-size:0.5em;}
.align-rechts{text-align:right;}

.marker-gelb{background-color:yellow; opacity:0.6;}

/* class marquee2 */
@keyframes marquee {
 0%   { text-indent: 0% }
 100% { text-indent: 100% }
}
@-webkit-keyframes marquee {
 0%   { text-indent: 0% }
 100% { text-indent: 100% }
}
.marquee2 {
 width: 100%;
 margin: auto;
 overflow: hidden;
 white-space: nowrap;
 animation: marquee 10s linear infinite; /**/
 color:blue;
 font-size:1.3em;
 text-shadow: 0 0 15px white;
}

.marquee2:hover {
 animation-play-state: paused;
}
/* Ende marquee */

#sidebar{
display:block;
float:left; 
width:30%;
/* text-align:justify; */ 
font-size:1.2em;	
padding:2em; 
}
#sidebar .preise{
	/* margin:0px auto; */
	padding-left:5em; 
}
#sidebar .bez-saison{
	text-decoration:underline;
	font-size:1.2em;
}
#sidebar .preise li{
	margin-bottom:2em; 
	}
#sidebar .preise .eingerueckt{
	margin-top:0.5em;
	padding-left:4.1em; 
	 border-bottom:1px solid black;
}
#sidebar .preise .eingerueckt li{
	text-decoration:none;
}
#sidebar .h3preise{
	font-size:1.5em;
	color:#f8896b;
	text-decoration:underline;
}
#sidebar .sidebar_bilder_ul{
	list-style-type:none;
}
.kalender{
position:relative;
}
.iframe_kalender{
	width:100%;
	height:650px;
	border:none;
}

/* tabelle legende-belplan i.oberen Teil*/
.legende {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}
.legende td {
    background-position: center center;
    background-repeat: no-repeat;
    border: medium none;
    font-size: 11px;
    height: 15px;
    margin: 0;
    padding: 0;
    width: 15px;
}
td.leg {
    width: 65px;
}
td.txt {
    color: #666666;
    text-align: left;
}

.s1 {
    background-color: #95dc94;
}
.s2 {
    background-color: #ff8080;
}
.s3 {
    background-color: #ffff80;
}
.s4 {
    background-color: #777777;
}
/* ----------------------------
spezielle anker-formatierungen */
a.anker_belegplan{
	position:absolute;
	right:0px;
	top:0px;
	color:#fff;
	background:#B3A98B;
	padding:0.3em;
	font-size:0.65em;
	text-decoration:none;
	border:1px solid #000;
	border-radius:6px;
}
a.anker_belegplan:hover{
	background:#f8af0c ;
	text-decoration:underline;
	color:#000;
}
a.buchungsanfrage{
	color:#fff;
	background: #f8896b;
	padding:0.3em 0.5em;
	font-size:0.9em;
	text-decoration:none;
	border:1px solid #fff;
	border-radius:6px;
}
a.buchungsanfrage:hover{
	color:#000;
}
a.button{
	color:#fff;
	background:#B3A98B;
	padding:0.3em;
	font-size:0.65em;
	text-decoration:none;
	border:2px solid #f8896b;
	border-radius:6px;
}
a.button:hover{
	background:#f8af0c ;
	text-decoration:underline;
	color:#000;
}

/* normaler link (a) */
#footer .link_normal,
#content .link_normal,
#sidebar .link_normal{/* normaler link (a) */
font-size:1.0em;
color:blue;
text-decoration:none;
/* text-align:left; */
display: inline;
margin:0;
	padding:0; 	
}
#footer .link_normal:hover,
#content .link_normal:hover,
#sidebar .link_normal:hover{/* normaler link (a) */
color:#d10b97;
text-decoration:underline;
}
#footer .link_normal:visited,
#content .link_normal:visited,
#sidebar .link_normal:visited{/* normaler link (a) */
/* color:yellow; */
text-decoration:underline;
}

/*--------- Bilder---------- */
img{
max-width : 100% ;
height : auto ;
border-radius:6px;
}
img.header-img{
max-width : 100% ;
height:auto ;
border-radius:6px;
}
img.img-content-oben{ /* Bild i.Header*/
position:absolute; 
bottom:-40px;
right:15%;
 /* Rotation nach rechts */ 	-webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -o-transform: rotate(4deg);
	-ms-transform: rotate(4deg);
    writing-mode: lr-tb;
width: 300px; 
height: 210px;
/* max-width :100% ;
height : auto ; */
opacity:1;
z-index:200;
}
img.ante{
display:block;	
margin:0px auto;
max-width :100% ;
height : auto ;
border-radius:16px;
}
img.hovereffekt{
display:block;	
margin:0px auto;
max-width :95% ;
height : auto ;
border:6px solid orange;
border-radius:16px;
} 
#navbild{
display:block;	
margin:0px auto;
max-width :95% ;
height : auto ;
border:3px solid #615533;
border-radius:6px;
}
img.baustelle{
display:block;	
margin:0px auto;
max-width :100% ;
height : auto ; 
}
#img_klein{
position:absolute;
width :60px ;
height : 40px ;	
}
img.fleurop1img{
position: absolute;
right: 20px;
bottom:-6px;
width :136px ;
height : 349px ;	
}
img.accordion_bildgalerie{
	border:3px solid white;
	 border-radius:13px;
	 display:inline;
	
}
.footer_img{
width: 25px;
height:25px;	
border-radius:1px;
vertical-align:middle;	
}


#footer{
position:relative;
clear:both;	
width:100%;
height:50px;  /* footer- Höhe (wird hier def.=> #coverer:before) */ 
padding:10px 0px 0px 0px;
background: #8C8160 ;
color:white;
text-align:center;
border-radius:6px 6px 0px 0px;
}
#footer #nav-nachoben{
position:fixed;
position:-ms-device-fixed;
bottom:15px;
right:5px;	
}
#footer .pfeil_nachoben{
text-decoration:none;
font-size:3em;
font-weight:bold;
color:black;
background: #f8896b ; 
border:3px solid red;/*#fff #615533*/
border-radius:6px;
padding:0px 2px 6px 2px;
opacity:0.7;		
}
#footer p{
vertical-align:bottom;
}

/* Effekte */
.effect1{color: #FFFFFF;text-shadow: -3px 5px 5px rgba(0,0,0, 0.1);letter-spacing: 0.3em; }
.effect2{color: #FFFFFF;text-shadow: -3px 5px 5px rgba(0,0,0, 0.5);letter-spacing: 0.3em; }
.effect3{font-family: "Great Vibes",cursive;;color: black;text-shadow: -3px 5px 5px rgba(0,0,0, 0.5);letter-spacing: 0.1em; }
.effect4{
	font-family:'Handlee', cursive;
	color: black;
	/* text-shadow: 5px -3px 5px rgba(0,0,0, 0.5); */
	letter-spacing: 0.1em;
	} 
.boxshadow{
-webkit-box-shadow: 2px 2px 12px 4px rgba(207,173,72,1);/* 15,15,15,1 */
-moz-box-shadow:    2px 2px 12px 4px rgba(207,173,72,1);
box-shadow:         2px 2px 12px 4px rgba(207,173,72,1);
}
.boxshadow2{
-webkit-box-shadow:  0px 0px 14px 4px rgba(255,255,107,1);/* 15,15,15,1 */
-moz-box-shadow:     0px 0px 14px 4px rgba(255,255,107,1);
box-shadow:          0px 0px 14px 4px rgba(255,255,107,1);
}

/* Kontaktformular */
form input.felder{
	font-size:1em; /* */
	background:#FFFFCC;
	border-radius:6px;
	padding:5px 5px 5px 5px;	
	-webkit-box-shadow: 8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	-moz-box-shadow:    8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	box-shadow:         8px -4px 8px 1px rgba(138, 50, 50, 0.36);
}
form textarea.felder{
	font-size:1.2em;
	background:#FFFFCC;
	border-radius:6px;
	padding:5px 5px 5px 5px;	
	-webkit-box-shadow: 8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	-moz-box-shadow:    8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	box-shadow:         8px -4px 8px 1px rgba(138, 50, 50, 0.36);
}
form p{
	margin-top:1em;
}
/* extra Formatierung senden button */
form input.sendenbtn{
	font-size:1.2em;
	background:#FFFFCC;
	margin-top:-80px; /* */
	margin-left:180px;
	border:4px solid #cc6666;
	border-radius:6px;
	padding:5px 5px 5px 5px;
	-webkit-box-shadow: 8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	-moz-box-shadow:    8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	box-shadow:         8px -4px 8px 1px rgba(138, 50, 50, 0.36);
}
.Pflichtfeld{
color:red;
font-size:1.7em;
vertical-align:middle;
}	
.Meldung{/*gehört z.kontakt.php */
	color: red/* #99FF99 */;	
	font-size:1em;
	}
.meldung-erfolg{/*gehört z.kontakt.php */
	color: green;/* #00BD00*/	
	font-size:1em;
	text-decoration:underline;
	}
#kontaktinfo{
	border:4px solid #cc6666;
	border-radius:6px;
	padding:10px;
	margin-top:15px;
	/* Rotation nach rechts  
	-webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
	writing-mode: lr-tb;*/	
	/* boxshadow */
	-webkit-box-shadow: 8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	-moz-box-shadow:    8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	box-shadow:         8px -4px 8px 1px rgba(138, 50, 50, 0.36);	
}
#oeffnungszeiten{
	margin-top:20px;
}
table#kontaktinfo2{
	background:#CC6666;/*  */
	border:3px solid white;
	border-radius:6px;
	margin:10px 15px;
	padding:5px 5px;
	/* boxshadow */
	-webkit-box-shadow: 8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	-moz-box-shadow:    8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	box-shadow:         8px -4px 8px 1px rgba(138, 50, 50, 0.36);	
	}
table#kontaktinfo2 td{
	padding:0px 4px;
	}
table#kontaktinfo2 .first-td{
	border-bottom:1px dotted white;
	padding-bottom:4px;
	}
table#kontaktinfo2 .sec-td{
	border-right:1px dotted white;
	}
#counter{
	border-top:1px dotted black;
	margin-top:25px;
	padding-top:15px;
}	

/*##### 	Media-Queries 	############*/

@media only screen and (min-width: 1024px) {
#slogan{
	font-size: 3.5em;
    font-weight: bolder;
    letter-spacing: 4px;
    position: absolute;
    top: 26%;
    left: 13%;
    color: yellow;
	        transform: rotate(-10deg);
    -webkit-transform: rotate(-10deg);
       -moz-transform: rotate(-10deg);
         -o-transform: rotate(-10deg);
        -ms-transform: rotate(-10deg);
    z-index: 4001;
}

/* (Breite d.li-elemente in bildergalerie.php) */
.cd-accordion-menu li {
    list-style-type: none;
    width: 78%;
}

}
@media only screen and (max-width: 1024px) {
img.fleurop1img{
position: absolute;
right: 0px;
bottom:0px;
width :136px ;
height : 300px ;	
}
#kontaktformular{
	max-width:810px;

}
}
@media only screen and (max-width: 960px) {
img.img-content-oben{ /* frühlingsbild i.Header*/
position:absolute; 
bottom:0px;
right:2%;
 /* Rotation nach rechts */ 	-webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -o-transform: rotate(4deg);
	-ms-transform: rotate(4deg);
    writing-mode: lr-tb;
width: 160px; 
height: 90px;
/* max-width :100% ;
height : auto ; */
opacity:0.9;
z-index:200;
}	
}
@media only screen 
and (min-width : 719px) 
and (max-width : 871px){
img.fleurop1img{
position: absolute;
right: 0px;
bottom:18px;
width :136px ;
height : 300px ;	
}	
}
/*
ipad-mini(portrait)....
beim ipad-mini(portrait) wird die sidebar ausgeblendet! 
------------------------------------------------------------*/
@media only screen 
and (min-width : 570px) 
and (max-width : 713px) 
and (orientation : portrait){

section#sidebar #sidebar_bel_plan{/* beim ipad-mini(portrait) wird die sidebar ausgeblendet! */
 	display:none; 
	}
form textarea.felder{
	font-size:1em;
	background:#FFFFCC;
	border-radius:14px;+++++
	padding:5px 5px 5px 5px;	
	-webkit-box-shadow: 8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	-moz-box-shadow:    8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	box-shadow:         8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	
}	
#content_belgplan{
float:none;
width:100%;	/*  */
padding:1em;
}
img.fleurop1img{
position: absolute;
right: -20px;
bottom:50px;
width :136px ;
height : 280px ;	
}
}

@media only screen and (max-width: 600px) {
img.accordeon_label4{/* img im label activities.php wird anders pos. */
/* */ border:3px double #f8af0c;
border-radius:8px;
position:absolute;
width:60px;
height:50px;
left:200px;
bottom:2px;
}	
#slogan{
	font-size:1.6em; 
	font-weight:bold;
	letter-spacing:2px;
	position:absolute;  /**/
	top:15%;
	right:-5px;
	color:yellow;	
	/* Rotation nach rechts  */
	-webkit-transform: rotate(-10deg);
    -moz-transform:    rotate(-10deg);
    -o-transform:      rotate(-10deg);
	-ms-transform:     rotate(-10deg);
    writing-mode: lr-tb;
	z-index:4001;
}
img.img-content-oben{
display:none;
}
}

@media only screen and (max-width: 570px) { /*vorher 480px */

body {
margin-top:0px;	
font-family:Tahoma,Verdana,Arial,Helvetica,sans-serif;
font-size:12px;
}
#wrapper{
width:100%;
margin:0px auto;
}
#header.rslides{
	padding:1em;	 
}
#nav{
 width: 90%;		 
float:none;
margin-top:1em;
}
#nav li{
border:none;

}
#nav li a{
display:block;	
background: #8C8160 ; 
color:white;
border-radius:6px; 
text-decoration:none; 
font-size:1.5em; 
margin-bottom:0.5em;
}
#content{
float:none;
width:100%;	/*  */
padding:2em;
}
#content_belgplan{
float:none;
width:100%;	/*  */
padding:1em;
}
#content h2 {
color:black;
font-size:1.8em;
text-align:center;
}
#content p,#sidebar p{
font-size:1.4em;
}
#content p.text-small,#sidebar p.text-small{font-size:0.5em;}
#sidebar{
width:100%;	
padding:2em;	
}
#sidebar_bel_plan{
display:none;	
}
img{
max-width : 100% ;
height : auto ;
border-radius:6px;
}
img#navpic{
display:none;
}
/*img.header-img{
 display:block;	
margin:0px auto; 	
max-width : 150% ;
height:auto ;
} */

img.fleurop1img{
position: absolute;
right: 0px;
bottom:50px;
width :136px ;
height : 300px ;	
}
/* Kontaktformular */
form input.felder{
	width:100%;
	font-size:1em; /* */
	background:#FFFFCC;
	border-radius:6px;
	padding:5px 5px 5px 5px;	
	-webkit-box-shadow: 8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	-moz-box-shadow:    8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	box-shadow:         8px -4px 8px 1px rgba(138, 50, 50, 0.36);
}
form textarea.felder{
	width:100%;
	font-size:1em;
	background:#FFFFCC;
	border-radius:6px;
	padding:5px 5px 5px 5px;	
	-webkit-box-shadow: 8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	-moz-box-shadow:    8px -4px 8px 1px rgba(138, 50, 50, 0.36);
	box-shadow:         8px -4px 8px 1px rgba(138, 50, 50, 0.36);
}
}

@media only screen and (max-width: 500px) {/*kleiner Viewport_Landscape */

img.accordeon_label13{
/* position:absolute;
width:60px;
height:70px;
left:400px;
bottom:-10px; */
display:none;
}
img.accordeon_label14{
/* border-radius:8px;
position:absolute;
width:60px;
height:50px;
left:480px;
bottom:2px; */
display:none;
}	
	
	
}
@media only screen and (max-width: 420px) { /*kleiner Viewport_Portrait */
#content{
float:none;
width:100%;	/*  */
padding:2em 0.5em;
}
#sidebar{
width:100%;	
padding:2em 0.5em;	
}

/* Bilder i.accordion-label / bildergalerie.php 
es wird nur ein Bild angezeigt...*/
#label_gaertnerei,
#label_radfahren,
#label_schwimmen,
#label_museen,
#label_ausfluege
{
position:relative;	
}
img.accordeon_label1{
/* border:3px double #f8af0c;
border-radius:6px; */
position:absolute;
width:50px;
height:60px;
left:45%;
bottom:2px;
}
img.accordeon_label11{
/* border:3px double #f8af0c;
border-radius:6px; 
position:absolute;
width:55px;
height:70px;
left:185px;
bottom:-3px;*/
display:none;
}
img.accordeon_label12{
/* position:absolute;
width:60px;
height:70px;
left:240px;
bottom:-10px; */
display:none;
}
img.accordeon_label4{
/*  border:3px double #f8af0c;*/
border-radius:8px;
position:absolute;
width:60px;
height:50px;
left:260px;
bottom:2px;
}
/* Ende Bilder i.accordion-label / bildergalerie.php */

#slogan{
	font-size:1.5em; 
	font-weight:bold;
	letter-spacing:2px;
	position:absolute;  /**/
	top:20%;
	right:2px;
	color:yellow;	
	/* Rotation nach rechts  */
	-webkit-transform: rotate(-5deg);
    -moz-transform:    rotate(-5deg);
    -o-transform:      rotate(-5deg);
	-ms-transform:     rotate(-5deg);
    writing-mode: lr-tb;
	z-index:4001;
}
.effect4{
	font-family:'Handlee', cursive;
	color: black;
	/* text-shadow: 5px -3px 5px rgba(0,0,0, 0.5); */
	letter-spacing: 0.1em;
	} 
}