@CHARSET 'utf-8';
/*
02.01.2017
Design by No.2
*/


/* Begin Grundgerüst */
html
{
	lang:		de;
	min-width:	300px;
	position:	relative;
	min-height:	100%;
}
body {
	margin: 		0 auto 50px auto;		/*die Höhe 50px bestimmt sich aus der Höhe des footers und des Grusses*/
	padding: 		0;
	background: 	url(../images/img1.jpg);
	/*background: #311C00;	Bild ist besser, da körnig; entspricht Farbe #311C00*/
	text-align: 	left;
	font-family: 	"Georgia", "Times New Roman", "Times", "serif";
	font-size: 		11pt;
	color: 			#9B8767;
}
h1, h2, h3, h4, h5, h6 {
	margin: 		0;
	padding: 		0.5em 0;
	font-family: 	"Arial", "Helvetica", "Trebuchet MS", "sans-serif";
	color: 			#E8D6B4;
}
a:focus {
	outline:		solid thin #b7b700;
}
figcaption {
	margin-top:		10px;
}
/* End Grundgerüst */

/* Begin Header */
header {
	margin:					0;
	padding:				0;
	background: 			url(../images/img2.jpg) repeat-x;
	background-attachment: 	fixed;
	height: 				250px;
	text-transform: 		none;
	color: 					#FFFFFF;
}
header h1 {
	float: 			left;
	padding: 		0 0 0 0;
	margin:			0 auto 0 0.4em;
	letter-spacing: -2px;
	font-size: 		25pt;
	font-family: 	"Georgia", "Times New Roman", "Times", "serif";
	text-transform: none;
	color: 			#FFFFFF;
    //border: 		solid thin black;
}
header p {
	color: 			#FFFFFF;
	font-size: 		11pt;
	max-width:		170px;
    margin: 		15px 15px 0 15px;
    padding: 		0.2em 0.2em 0.2em 0.2em;
    float:			left;
    //border: 		solid thin black;
}
header a {
	//border: 			solid thin black;
	text-decoration: 	none;
	margin:				0 0 0 10px;
	padding:			0;
	position:			relative;
	bottom:				25px;
}
div.header
{
	//border: 		solid thin black;
	max-width:		700px;
	margin:			0 auto;
	padding:		45px 15px 0 15px;
	min-height:		165px;
}
a.header img {
	max-width: 		40%;
}
@media (max-width:	700px)
{
a.header {display:none;}
}
/* End Header */

/* Begin Footer */
footer {
	//border: 		solid thin black;
	clear: 			both;
	margin: 		20px 1em 10px 1em;
	padding: 		5px;
	padding-top:	0;
	background: 	url(../images/img4.gif) repeat-x;
	text-align:		center;
	font-family:	"Arial", "Helvetica", "Trebuchet MS", "sans-serif";
	position:		absolute;
	bottom:			0;
	height:			20px;
	width:			95%;
}
footer p {
	//border: 		solid thin black;
	margin-bottom:	0;
	text-transform: none;
	text-align: 	center;
	font-size: 		8pt;
}
/* End Footer */


/* Begin Gruss-Footer */
p.gruss{
	//border: 		solid thin white;
	background: 	url(../images/img3.gif) repeat-x left top;
	margin:			30px 0 5px 0;
	padding:		0.4em 0 0 0;
	font-family:	"Arial", "Helvetica", "Trebuchet MS", "sans-serif";
	font-size: 		12pt;
	font-weight:	bold;
	color: 			#9B8767;
	position:		relative;
	bottom:			-50px;
	height:			30px;
	max-width:		800px;
	clear:			both;
}
p.gruss a {
	//border: 		solid thin white;
 	margin:			0;
	color: 			#9B8767;
	text-decoration:	none;
}
p.gruss a:hover {
	color: 			#E8D6B4;
}
/* End Gruss-Footer */

/* Begin Content */
article {
	//border: 		solid thin white;
	max-width:		800px;
	margin: 		0 auto 80px auto;
}
article > h1
{
	background: url(../images/img3.gif) repeat-x left bottom;
	margin:		0 0 10px 0;
	font-size:	15pt;
}
section {
	//border: 			solid thin white;
	clear:				both;
	margin-bottom:		15px;
}
article section:last-of-type {
	margin-bottom:	80px;
}
section.center {
	padding-top:	30px;
	text-align:		center;
}

section.center h1 {
	margin-left:	0;
}
section.reisearchiv_suedamerika,
section.reisearchiv_suedamerika * {
	color:			#b7b700;
	padding-top:	5px;
	//border: 		solid thin white;
}
section.Bild_links,
section.Bild_rechts {
	overflow: 		hidden;
	//border: 		solid thin white;
}
section h1
{
	//border: 	solid thin white;
	margin:		20px 0 0 5px;
	font-size:	12pt;
}
section.reisearchiv_suedamerika h1
{
	margin-bottom:	-10px;
}
section h2
{
	margin:		10px 0 0 5px;
	font-size:	11pt;
	//border: 	solid thin white;
}
p
{
	margin:		0 0 0 5px;
	padding:	10px 10px 0 10px;
	//border: 	solid thin white;
	min-width:	90px;
}
p.center {
	text-align:		center;
}
a h1:hover {
	color: 				#9B8767;
	text-decoration:	none;
}
a {
	text-decoration:none;
}
p a, section a {
	color: 			#E8D6B4;
}
p a:hover, section a:hover {
	color: 			#9B8767;
}
p.strophe {
	text-align:		center;
}
section.Bild_links_suedamerika img {
	float:		left;
	width:		314px;
	height:		371px;
	margin:		30px 25px 0 35px;
	//border: 	solid thin white;
}
section.Bild_links_suedamerika blockquote {
	margin:			0;
	height:			300px;
	padding-top: 	120px;
	//border: 	solid thin white;
}
blockquote p {
	margin-bottom:		15px;
}
section.Bild_rechts img, section.Bild_links img {
	//max-width:		340px;
	//max-height:		255px;
	max-width:		272px;
	max-height:		204px;
	width:			60%;
	//height:		50%;
	margin:			15px 70px 10px 70px;
	//border: 		solid thin white;
}
section.Bild_rechts img {
	float:		right;
}
section.Bild_links img {
	float:		left;
}
section.Bild_rechts p {
	margin-right:			50px;
	margin-left:			50px;
}
section.Bild_links p{
	margin-right:			50px;
	margin-left:			50px;
}
@media screen and (max-width: 400px) {
	section.Bild_rechts img,
	section.Bild_links img {
		display:	none;
	}
}
div.table_layout {
	width: 		100%;
	margin:		10px auto;
	//border:	solid thin white;
	display:	table;
}
div.table_layout > * {
	//border:		solid thin white;
	display:		table-cell;
	text-align:		center;
	//vertical-align:	center;
}
div.table_layout img {
	width:		90%;
	height:		90%;
}
input.button_style {
	background:		#351f00;
	color:			#E8D6B4;
	border-color:	#b7b700;
}
input.button_style:disabled {
	//background:		#281700;
	//color:			#cfa963;
	//border-color:	#202000;
	background:		transparent;
	color:			transparent;
	border-color:	transparent;
}
input.button_style:focus {
	background:		#281700;
	border-color:	#f7f700;
}
/* beim letzten Bild mit Text mehr Platz nach unten geben, da sonst Kollision mit dem Gruss-Footer */
articel section.Bild_rechts:last-of-type img:last-of-type,
article section.Bild_links:last-of-type img:last-of-type {
	//margin-bottom:	140px;
}
table.wanderdaten {
	margin-bottom:	5px;
	margin-top:		0;
	font-size: 		11pt;
}
table.wanderdaten td {
	width:			7em;
}

/* Kontaktformular */
form.kontakt {
	//border:	solid thin white;
	width:		70%;
	margin:		20px 0 0 20px;
}
form.kontakt label {
	//border:			solid thin white;
	display:			inline-block;
	width:				8em;
	vertical-align:		top;
}
form.kontakt div {
	//border:			solid thin white;
	margin-bottom:		10px;
}
form.kontakt div.col_two{
	//border:			solid thin white;
	width:				auto;
	margin:				10px 0 0 8em;
	display:			inline-block;
}
form.kontakt label.checkbox {
	width:			18em;
	margin-left:	10px;
}
div.button_zurueck{
	width:				auto;
	margin:				10px 0 0 10px;
}

/* Gästebuch */
fieldset.gaestebuch {
	border:		none;
	margin:		15px auto;
	max-width:	50%;
	min-width:	200px;
}
fieldset.gaestebuch legend {
	color:			#b7b700;	//dunkelgelb
}
fieldset.gaestebuch p{
	/*background: #311C00;	Bild ist besser, da körnig; entspricht Farbe #311C00*/
	max-width:			75%;
	padding-top:		10px;
	padding-bottom:		10px;
	background:			#351f00;
}
form.gaestebuch {
	margin:			10px 0 10px 20px;
}

/* Slideshow */
body.slideshow {
	margin-bottom:	0;
	//border: 		solid thin white;
}
article.slideshow {
	//border: 		solid thin white;
	max-width:		800px;
	margin: 		0 auto 10px auto;
	min-height:		900px;
	font-family: 	"Arial", "Helvetica", "Trebuchet MS", "sans-serif";
	font-size:		11pt;
}
section.slideshow {
	margin:			0;
	padding:		0;
	padding-top:	5px;
}
section.slideshow h1 {
	text-align:		center;
	margin:			0;
}
section.slideshow img {
	max-width:		800px;
	width:			100%;
	height:			auto;
	margin:			auto;
	display:		block;
	//border: 		solid thin white;
}
section.slideshow img.breite_525 {
	max-width:		525px;
	max-height:		700px;
	width:			auto;
	height:			90%;
}
section.slideshow img.breite_700 {
	max-width:		700px;
}
section.slideshow img.breite_800 {
	max-width:		800px;
}
section.slideshow img.breite_1000 {
	max-width:		800px;
}
figure.slideshow {
	margin:			30px 0 0 0;
	clear:			both;
	border-top:		solid 2px #593300;
}
figure.slideshow figcaption {
	margin:				0;
	padding:			5 0 0 0;
	color:				#b7b700;
	font-size:			12pt;
	margin-bottom:		10px;
	width:				100%;
	text-align: center;
}
section.slideshow div.slideshow {
	margin: 		0;
	//border:			solid thin white;
	height:			25px;
	text-align:		center;
	display:		block;
}
section.slideshow div.prev {
	width:			27%;
	min-width:		1em;
	float:			left;
}
section.slideshow div.next {
	width:			25%;
	min-width:		1em;
	float:			right;
}
section.slideshow div.counter {
	padding-top:	3px;
	height:			22px;
	width:			39%;
	min-width:		3em;
	float:			left;
	position:		relative;
	left:			1em;
	color:			#b7b700;
	font-size:		10pt;
}
section.slideshow div.close {
	max-width:		3%;
	min-width:		1.5em;
	float:			right;
}
a.button_schliessen img.button_schliessen {
	width:				20px;
	height:				auto;
	border: 			solid thin;
	border-color:		#202000;
	background-color:	#5b3400;
}
a.button_schliessen img.button_schliessen:hover,
a.button_schliessen img.button_schliessen:focus {
	border: 			solid thin;
	border-color:		#b7b700;
	background-color:	transparent;
}

/* End Content */

/* Begin Navigationsbereich */
nav.hauptmenueleiste
{
	margin:			20px 80px 20px 20px;
	text-align:		left;
	float:			left;
	position:		absolute;
	width:			12em;
	top: 			240px;
}
nav.hauptmenueleiste a
{
	box-sizing:			border-box;
	padding: 			0.3em 1.5em;
	background-color:	transparent; 
	color: 				#D9C09A;
	font-size: 			10pt;
	//border: 			solid thin silver;
	text-decoration: 	none;
	text-align:			left;
	display: 			block;
	width:				11em;
	transition:			background-color 0.35s ease-in;
}
/* nav.hauptmenueleiste a:focus, */
nav.hauptmenueleiste a:hover,
nav.hauptmenueleiste a.nav_aktiv
{
	background-color: 	#4d2c00; 
	text-decoration: 	underline;
	color: 				#b7b700;
	transition:			background-color 0.01s;
}
nav.hauptmenueleiste a.untermenue {
	//margin-left:		20px;
	padding-left:		35px;
	width:				18em;
}

/* für den Pfeil rechts bzw. unten beim Untermenue */
nav.hauptmenueleiste a.parent_untermenue span::before {
	content:			'\25BA'' ';
}
nav.hauptmenueleiste a.nav_aktiv.parent_untermenue span::before,
nav.hauptmenueleiste a.nav_offen.parent_untermenue span::before {
	content:			'\25BC'' ';
}
nav.hauptmenueleiste a.parent_untermenue span {
	position:			relative;
	left:				-1.2em;
}

nav.reisearchiv_suedamerika
{
	margin:			20px 0;
	text-align:		center;
}
nav.reisearchiv_suedamerika a
{
	box-sizing:			border-box;
	padding: 			0.2em 0.5em;
	background-color:	black; 
	color: 				#b7b700;
	font-size: 			12pt;
	border: 			solid thin silver;
	text-decoration: 	none;
	text-align:			center;
	display: 			inline-block;
	width:				20%;
	min-width:			6em;
}
nav.reisearchiv_suedamerika a:nth-child(n+2)
{
	border-left: none;
}
nav.reisearchiv_suedamerika a:hover,
nav.reisearchiv_suedamerika a.nav_aktiv
{
	background-color: 	#402500; 
	text-decoration: 	underline;
	color: 				#b7b700;
}
input#drop-down-menue,
label.drop-down-menue-label {
	display:			none;
}

@media screen and (max-width: 1350px) {
	article.untermenue {
		margin-left:	19em;
	}
}
@media screen and (max-width: 1200px) {
	article {
		margin-left:	14em;
	}
}
@media screen and (max-width: 700px) {
	nav.hauptmenueleiste {
		//display:		none;
		position:		absolute;
		top:			-9999px;
		padding:		10px;
		float:			none;
		width:			100%;
	}

	label.drop-down-menue-label {
		position:		absolute;
		top:			190px;
		left:			10px;
		display:		block;
		padding:		20px;
		background:		transparent;
		cursor:			pointer;
		color:			#FFFFFF;
	}
	label.drop-down-menue-label span {
		margin-right:	10px;
	}
	input#drop-down-menue[type=checkbox]:checked ~ nav.hauptmenueleiste {
		position:		relative;
		top:			0;
	}
	
	article {
		margin-left:	5px;
	}
	article.untermenue {
		margin-left:	5px;
	}
}
/* End Navigationsbereich */
