@import url(style-reset.css?v=201907091605);
@import url(include.header.css?v=201907091605);

body
{
	max-width: 900px;
	margin: auto;
	background-image: url(bg.gif);
	font-family: Trebuchet, Arial, sans-serif;
	font-size: 14px;
	-webkit-text-size-adjust: none;
	text-size-adjust: none;
}

#inhaltsverzeichnis a:hover,
#ads                a:hover,
#mission            a:hover,
footer              a:hover
{
	color: blue;
	text-decoration: underline;
}

#inhaltsverzeichnis a:visited,
#ads                a:visited,
#mission            a:visited,
footer              a:visited
{
	color: #551A8B;
}



/* ----------------------- Seitenabschnitt Header --------------------------- */

#header
{
	margin-bottom: 0.75em;
}

#header h1
{
	font-size: 27px;
	margin: 0 0 0.75em 0;
	padding-left: 10px;
	text-align: left;
}

#header #toolbar h2
{
	text-align: left;
	padding-left: 10px;
}

#header #toolbar
{
	border: 0 none;
}


/* ------------------------ Seitenabschnitt Schaukasten --------------------- */

#schaukasten1
{
	margin-top: 0 !important;
}



/* ---- Konkrete Folien ---- */

#schaukasten1 .Folie
{
	text-shadow: none;
	text-align: left;
}

#schaukasten1 .Folie a:not([href^="tel:"])
{
	background-color: #FFcc00; 
	padding: 0.2em 2.5em 0.2em 0.5em; 
	color: #000; 
	border: 0 none; 
	display: block; 
	float: left; 
	margin-top: 0.5em;
	text-decoration: underline;
	background-image: url("Startseite/buchen-pfeil.png");
	background-repeat: no-repeat;
	background-position: 95% center; 
}

#schaukasten1 .Folie a[href^="tel:"],
#schaukasten1 .Folie a[href^="tel:"]:hover
{
	color: inherit;
	background-color: inherit;
	text-decoration: none;
	border: 0 none;
}



#folieJasmund
{
	left: 5%;
	top: 56%;
}

#folieBinz
{
	left: 5%;
	top: 6%;
}

#folieRuema1
{
	left: 5%;
	top: 27.5%;
}

#folieRuema2
{
	left: 43%;
	top: 27.5%;
}

#folieRuema .subtext
{
	line-height: 2em;
}


#folieWittow 
{
	left: 5%;
	top: 6%;
}

#folieSellin 
{
	left: 5%;
	top: 6%;
}

#folieGoehren
{
	left: 56%;
	top: 66.6%;

	left: 5%;
	top: 6%;
}

#folieMoenchgut 
{
	left: 58%;
	top: 55.6%;


	left: 5%;
	top: 6%;

}

#foliePutbus
{
	left: 5%;
	top: 66%;
}



/* -------------------- Seitenabschnitt Inhaltsverzeichnis ------------------ */

#inhaltsverzeichnis
{
	background-image: url(bg2.png);	
	margin: 1em auto 2em auto;
	width: 98.5%;
	font-size: 11pt;
	color: #002e00;
	padding: 2em 0em 0 2em; 
	box-sizing: border-box;
}

#inhaltsverzeichnis ul
{
	list-style: none;
}

#inhaltsverzeichnis > ul > li
{
	width: 25%;
	float: left;
	margin-bottom: 2em;
}

#inhaltsverzeichnis .kattitel
{
	font-size: 1.55em;
}


#inhaltsverzeichnis > ul > li > ul
{
	list-style: none;	
}

#inhaltsverzeichnis > ul > li > ul > li
{
	margin: 1em 0 1em 0;
	font-size: 1em;
}

#inhaltsverzeichnis a
{
	color: #204e20;
	text-decoration: none;
}




/* ---------------- Seitenabschnitt Sozialmedien / Unternehmensmission --------------- */



#ads
{
	display: inline;
	width: 24%;
	min-width: 170px;
	margin-bottom: 2em;
	float: left;
	margin-left: 1.8%;
	position: relative;
}

#ads ul
{
	list-style: none;
}

#ads ul li
{
	margin-top: 0.8em;
	font-size: 12.5pt;
}

#ads img
{
	margin-right: 0.4em;
	position: relative;
	float: left;
}

#ads a
{
	color: #3c3c3c;
	text-decoration: none;
}

#mission
{
	display: inline;
	float: left;
	width: 70.5%;
	margin-left: 1.5%;
	margin-right: 1%;
	padding: 0;
	box-sizing: border-box;

}

#ads h2,
#mission h2
{
	margin: 0 0 0.35em 0;
	font-size: 14.25pt;
	font-weight: normal;
	line-height: 1.35em;
	color: #252525;
}

#ads .Werbebanner
{
	float: left;
	clear: left;
	border: 1px solid #606060;
	margin: 0.25em 0 1em 0;
}


#mission p
{
	font-size: 1em;
	text-align: justify;
	-webkit-hyphens: auto;
	    -ms-hyphens: auto; 
	        hyphens: auto;

	display: inline;
	float: left;
	margin-right: 0.5%;
	margin-bottom: 0.5em;
	text-align: justify;
	line-height: 1.45em;
	font-size: 11.6pt;
	color: #444444;
}

#mission a
{
	color: #104e10;
	text-decoration: underline;
}

#mission .Profilbild
{
	margin-right: 0.8em;
	position: relative;
	top: 0.2em;
	float: left;
	border: 1px dotted #fff;	
}



/* ------------------------ Seitenabschnitt Footer ------------------------ */

footer
{
	display: inline;
	clear: both;
	float: left;
	width: 100%;
	padding: 2em 0 3em 2em;
	border-top: 1px dashed #808080;
	box-sizing: border-box;
}

footer ul
{
	list-style: none;
}

footer > nav > ul > li
{
	display: inline;
	float: left;
	width: 25%;
	height: 12em;
	margin-bottom: 2em;
	min-width: 144px;
	font-size: 13pt;
	font-weight: bold;
	color: #666;
}

footer li li
{
	margin-bottom: 0;
	margin-top: 0.5em;
	font-size: 10pt;
	font-weight: normal;
}

footer li ul
{
	margin-top: 0.6em;  /* Abstand Menuepunkte zur Ueberschrift */
}

footer li li.MitBild
{
	margin: 0.25em 0 0.25em 0;
}

footer li li.MitBild img
{
	position: relative;
	top: 1px;
	margin-left: 2px;
}

footer,
footer a
{
	color: #505050;
	text-decoration: none;
}

.SocialMediaButton
{
	margin: 0.5em 1em 0.5em 0;
}

.SocialMediaButton img
{
	position: relative;
	top: 4px;
	margin: 0 0.3em 0 0;
}



/* Small Devices Only: */
@media (max-width: 770px)
{
	#inhaltsverzeichnis a:visited,
	#ads                a:visited,
	#mission            a:visited,
	footer              a:visited
	{
		color: #551A8B;
		border-bottom: 1px solid #551A8B;
		text-decoration: none;
	}


     #header
     {
          -webkit-box-shadow: 0px 3px 14px -3px rgba(0,0,0,0.42);
          -moz-box-shadow: 0px 3px 14px -3px rgba(0,0,0,0.42);
          box-shadow: 0px 3px 14px -3px rgba(0,0,0,0.42);
     }

     #header h1,
     #header h2
     {
          display: none;
     }

     #header,
     body
     {
          margin: 0;
          padding-top: 0;

     }

     #header #toolbar
     {
          border: 0;
     }

	#schaukasten1
	{
		margin: 0;
		-webkit-box-shadow: none;
		   -moz-box-shadow: none;
			   box-shadow: none;
	}

	#schaukasten1 .Folienbild
	{
		padding: 0;
		border: 0 none;
		background-image: none;
		left: 0;
	}

	#schaukasten1 .Folie a:not([href^="tel:"])
	{
		font-size: 9pt;
		padding: 0.5em 0.5em 0.5em 0.5em;
		background-image: none;  /* Too many arrows in close proximity on the slider */
	}

	#schaukasten1 .Folie a[href^="tel:"]
	{
		text-decoration: underline;
		font-weight: bold;
		color: blue;
	}



	#folieRuema1,
	#folieRuema2,
	#folieRuema1 strong,
	#folieRuema2 strong
	{
		color: #222;
		line-height: 1.4em;
	}

	#schaukasten1 .subtext
	{
		display: none;
	}



	#inhaltsverzeichnis,
	footer
	{
		margin: 0;
		width: 100%;
		font-size: 15px;
		padding: 2em 0em 0em 2em;
	}

	#inhaltsverzeichnis .kattitel:after
	{
		content: ":";
	}

	#inhaltsverzeichnis > ul > li
	{
		width: 50%;
	}

	footer > nav > ul > li
	{
		width: 50%;
	}

	#inhaltsverzeichnis > ul > li > ul > li
	{
		margin: 1.8em 0;
	}

	#inhaltsverzeichnis > ul > li > ul a
	{
		border-bottom: 1px solid #204e20;
	}

	#inhaltsverzeichnis > ul > li > ul a:hover,
	footer a:hover
	{
		text-decoration: none;
		border-bottom: 1px solid blue;
	}


	/* Re-order columns: */
	#inhaltsverzeichnis > ul 
	{
		display: -webkit-box;
	     display: -moz-box; 
		display: -ms-flexbox;
		display: -webkit-flex; 
		display: flex;

		-webkit-flex-direction: row;
		-webkit-box-orient: horizontal;
		flex-direction: row !important;

		-webkit-flex-wrap: wrap;
		   -moz-flex-wrap: wrap;
		    -ms-flex-wrap: wrap;
		        flex-wrap: wrap;
	}
	#inhaltsverzeichnis #inhaltFerienwohnungen
	{
		-webkit-box-ordinal-group: -1;
		   -moz-box-ordinal-group: -1;
		-ms-flex-order: -1;
		 -webkit-order: -1;
		         order: -1;
	}





	#mission,
	#ads
	{
		width: 100%;
		box-sizing: border-box;
		padding: 0em 1.75em 0em 1.75em;
		float: left;
		display: inline;
		clear: both;
	}

	#mission
	{
		margin: 2.5em 0 2em 0;
	}

	#ads
	{
		margin: 0 0 2em 0;
	}


	footer li li
	{
		margin: 1.5em 0;
	}


	footer a
	{
		border-bottom: 1px solid #505050;
	}

}


/* Smartphones */
@media (max-width: 390px)
{


	#inhaltsverzeichnis > ul > li
	{
		width: 100%;
	}

	footer > nav > ul > li
	{
		width: 100%;
	}
}

