/*
 * Since EU-DSGVO 2018 deactivated:
 * @import url('https://fonts.googleapis.com/css?family=Playfair+Display|Raleway');
 */


@import url("rm-reset.css");
@import url("rm-grid.css");


/* 
	Abschnitte in dieser Datei:
		1. lose Deklarationen
		2. header
		3. nav
		4. main


*/

html
{
	font-size: 14px;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	-webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}

body
{
	font-family: 'Raleway', Verdana, Arial, Helvetica, sans-serif;
	background-color: #fff;
	color: #408Ac8;
	font-size: 10.25pt;
}

q
{
	quotes: "\201E" "\201D" "\00AB" "\00BB";
}

.rm-nowrap
{
	white-space: nowrap;
}

#rm-backtop-btn
{
	display: block;
	width: 50px;
	height: 50px;
	border-radius: 5px;
	
	position: fixed;
	bottom: 10px;
	right: 15px;

	box-sizing: border-box;
	text-decoration: none;
	text-align: center;
	font-weight: 100;
	font-size:   50px;
	line-height: 50px;
	padding-top: 10px;

	background-color: rgba(78, 186, 175, 1.0);
	color: #fff;
	z-index: 10000;
}



#rm-page-wrapper
{
	max-width: calc( 900px + 2em );
	margin-left: auto;
	margin-right: auto;
	margin-top: 2em;
}



/* ------------------------------ <header> ---------------------------- */

header svg #curve2, #rect1
{
	fill: #EFFCFE;
}

header svg #curve1
{
	fill: #fff;
}

header svg #curve1, #curve2
{
	stroke-width: 1;
	stroke: #B5E6FD;
	stroke-linecap: round;
}

header svg line.border
{
	stroke: #B5E6FD;
	stroke-width: 1;
}

header svg #textpath
{
	stroke: none;
	fill: none;
}

header svg #caption
{
	stroke: none;
	fill: #307Ab8;
	font-size: 4.5em;
	font-family: serif;
	font-weight: normal;
}

header
{
	position: relative;

}

header img#moewe
{
	position: absolute;
	z-index: 100;
	right: 5%;
	top: 0px;
	width: 13%;
}

header svg
{
	vertical-align: top;  /* https://stackoverflow.com/questions/22337292/spurious-margin-on-svg-element */
}




/* ------------------------------- <nav> ------------------------------ */


#rm-head-nav
{
	background-color: #EFFCFE;
	display: table;
	border-left:  1px solid #B5E6FD;
	border-right: 1px solid #B5E6FD;
	box-sizing: border-box;
}


#rm-head-nav ul 
{
	display: table-row;
}

#rm-head-nav ul li
{
	display: table-cell;
	text-align: center;
}

#rm-head-nav a
{
	color: #444;
	font-size: 1.2em;
	width: 100%;
	box-sizing: border-box;
	background-color: #effcfe;
	color: #666;
	display: block;
	padding: 0.5em 0;
	border: 1px dotted #509ad8;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	border-bottom: 1px solid #509AD8;
}


#rm-head-nav.rm-fixed
{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
}

#rm-page-index   #rm-head-nav-item-index   a,
.rm-umfeldseite  #rm-head-nav-item-umfeld  a,
.rm-fewoseite    #rm-head-nav-item-fewo    a,
.rm-kontaktseite #rm-head-nav-item-kontakt a
{
	color: #509AD8;
	border-top:   1px solid #509AD8;
	border-left:  1px solid #509AD8;
	border-right: 1px solid #509AD8;
	text-decoration: none;
	background-color: #EFFCFE;
	font-style: italic;
	border-bottom: 0 none;
	position: relative;
	top: 1px;
}




/* -------------------------------- <main> ------------------------------ */


main
{
	background-color: #EFFCFE;
	border-left: 1px solid #B5E6FD;
	border-right: 1px solid #B5E6FD;
	padding: 0;
}


main p
{
	font-size: inherit;
	line-height: 1.8em;
	margin: 1em 0 1em 0;
	-webkit-hyphens: auto;
	    -ms-hyphens: auto;
	        hyphens: auto;
}

main p a
{
	-webkit-hyphens: none;
	    -ms-hyphens: none;
	        hyphens: none;
}

main h2
{
	font-size: 1.7525em;
	line-height: 1.50em;
	margin: 1em 0 0.5em 0;
}

main h3
{
	font-size: 1.45em;
	line-height: 1.45em;
	margin: 1em 0 0.5em 0;
}

main h3 a
{
	color: #408Ac8;
}



main h3:after,
main h4:after
{
	content: ":";
}

main h4
{
	font-weight: bold;
	margin: 1.75em 0 0.5em 0;
	font-size: 1.1em;
	line-height: 1.45em;
}


main ul, ol
{
	margin: 1rem 0 1rem 1.4rem;
}

main ul li,
main ol li
{
	margin: 1.25rem 0 1.25rem 0;
	line-height: 1.6em;
}

main li.rm-warn
{
	color: #BB6666;
}

main a
{
	color: #444;
}

main a:visited
{
}

main a[href^="#"]            /* Anchor-links */
{
}

main .rm-inpage-nav
{
	list-style: none;
	padding: 0;
	margin: 0;
}

main .rm-inpage-nav li:before
{
	content: "\2193\0020";
	color: #444;
	font-size: 1.2em;
}

main .photo
{
	background-color: #fff;
	box-sizing: border-box;
	padding: 0.5em;
	border: 1px solid #B5E6FD;
	margin: 0 0 1em 0;
}

main form input[type=text]
{
	padding: 0.5em;
}

main form input[type=submit]
{
	padding: 0.5em;
}

section
{
	width: 100%;
	box-sizing: border-box;
	padding: 0.5em 1em 1.5em 1em;
	margin: 0 0 0 0;
}

section + section + section                     { background-color: #fcfeef; }
section + section + section + section           { background-color: #effef1; }
section + section + section + section + section { background-color: #fef9ef; }



/*  Schaukasten:  */

.Schaukasten
{
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	box-shadow: none !important;
	margin: 1em 0 1em 0 !important;
}

.Folienbild
{
	padding: 0 !important;
	left: 0 !important;
}

.Folienvorschau
{
	border: 0 none !important;
	margin: 0 !important;
}

.Folienvorschau img
{
	width:  82px !important;
	height: 72px !important;
	padding: 0 !important;
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	box-shadow: none !important;
}



/* ------------------------------- <footer> ----------------------------- */

footer
{
	background-color: #eee;
	padding: 0.5em 0.5em 7em 0.5em;
	border-left:   1px solid #B5E6FD;
	border-right:  1px solid #B5E6FD;
	border-bottom: 1px solid #B5E6FD;
}

footer h3
{
	color: #888;
	font-size: 1.3em;
	margin: 1em 0 0.75em 0;
}

footer nav
{
	background-color: inherit;
}

footer nav ul
{
	list-style: none;

}

footer nav li
{
	margin: 0 0 5px 0;
	background-color: #ffffff;
}

footer nav a
{
	color: #000;
	width: 100%;
	padding: 1.25em 1em;
	display: block;
}

footer nav a:visited,
footer nav a:visited:before
{
	color: #aaa;
}



/* -------------------------------------------------------------------- */







/* ==================== PAGE SPECIFIC STYLE SHEETS ==================== */


#rm-preise .rm-saisonpreise
{
	border: 1px solid #509AD8;
	margin: 0 0.5em 0.75em 0;
	padding: 0.75em;
	line-height: 1.45em;
	box-sizing: border-box;
}

#rm-ferienhaus-intro,
#rm-wohnort-intro
{
	padding-bottom: 0;  /* sonst zuviel Luft zw. Schaukasten und naechster Ueberschrift */
}

#rm-routenplaner .row div
{
	padding-bottom: 0.5em;
}

#rm-routenplaner #saddr,
#rm-routenplaner input[type=submit]
{
	width: 100%;
	box-sizing: border-box;
}

#rm-gmap-anreise
{
	margin-bottom: 1em;
}




/* ===================== DESKTOP SPECIFIC STYLES ====================== */

@media only screen and (min-width: 45em) /* 720px+ */
{
	header svg #caption
	{
		font-size: 2.7em;
	}

	section
	{
		background-color: #EFFCFE !important;
		padding: 0.5em 2.5em 1.5em 2.5em;
	}

	main h2
	{
		margin: 1.75em 0 0.5em 0;	
	}

	#rm-head-nav ul li
	{
		width: 25%;
	}

	footer
	{
		border-bottom-left-radius:  17px;
		border-bottom-right-radius: 17px;
		padding: 1em 2.5em 2.5em 2.5em;
		margin: 0 0 5em 0;
	}

	footer h3
	{
		margin: 1em 0 1.5em 0em;
	}

	footer nav
	{
		display: table;
	}

	footer nav ul
	{
		display: table-row;
	}

	footer nav a
	{
		padding: 0;
	}

	footer nav li
	{
		display: table-cell;
		text-align: left;
		background-color: inherit;
	}

	footer nav li+li
	{
		text-align: center;
	}

	footer nav li:last-child
	{
		text-align: right;
	}


	.Folienvorschau
	{
		margin: 0 0 1em 0 !important;
	}


	/* Index: */

	#rm-intro-index .rm-col-padr { padding-right: 1em; }
	#rm-intro-index .rm-col-padl { padding-left : 1em; }


	/* Fewoseite: */

	#rm-merkmale ul
	{
		margin-top: 1.5em;
		margin-bottom: 0;
		-webkit-column-count: 2;
		   -moz-column-count: 2;
			   column-count: 2;
		-webkit-column-gap: 20px;
		   -moz-column-gap: 20px;
			   column-gap: 20px;
	}

	#rm-merkmale li
	{
		margin: 0 0 1em 0;
		-webkit-column-break-inside: avoid;
		page-break-inside: avoid;
		break-inside: avoid;
	}

	#rm-preise .rm-saisonpreise
	{
		width: calc( 33.33% - 1em );
		display: inline-block;
	}

	.kab-avail-v2,
	.kab-accom-bar
	{
		background-color: #EFFCFE !important;
	}



	/* Kontaktseite: */

	#rm-routenplaner #saddr
	{
		width: 95%;
	}


}