<!--

	/* Hintergrundfarbe */
	body { background-color:darkred; }
	
	/* generelle Festlegungen (pos:rel - Test fuer iPad: overflow:hidden Bug?)*/
	html, body {
		position:relative; height:100%; width:100%;
		margin:0px; padding:0px; border:none; 
		user-select:none; -webkit-user-select: none; /* Safari */
	}
	iframe { display:block; }
	a:focus { outline:none; }
	td { padding:0px; }

	/* Foto-Ubersichtsseiten*/
	.overview-body, .overview-site { min-width:850px; }

	/* Haupttabelle */
	.outer-block {
		table-layout:fixed; vertical-align:top;
		height:100%; width:100%;
		border:7px solid dimgrey; border-spacing:10px;
	}
	.outer-menu { text-align:center; vertical-align:top; height:155px; }
	.outer-content { text-align:center; vertical-align:top; }
	.outer-title { text-align:center; vertical-align:middle; }
	.menu-block  { height:155px;width:100%;border:none;border-spacing:0px;margin:0px; }
	.menu-middle { width:100%; }

	#pic-title { vertical-align:middle;border:0;width:600px;height:400px; }
	#pic-subtitle { vertical-align:middle;border:20px solid white;width:600px;height:400px; }
	#pic-subtitle-2 { vertical-align:middle;border:20px solid white;width:700px;height:394px; }

	/* Unterer iframe mit Copyright-Informationen */
	.bottom-body {
		text-align:center; font:12px arial; color:darkgrey;
		margin:0; border:none; overflow:hidden;
	}
	.bottom-link { text-decoration:none; color:darkgrey; }

	/* iframes */
	#iframe-top-left   { align-content:center; border:0; width:20px;  height:155px; overflow:hidden; }
	#iframe-top-middle { align-content:center; border:0; width:100%;  height:155px; overflow:hidden; }
	#iframe-top-right  { align-content:center; border:0; width:150px; height:155px; overflow:hidden; }
	#iframe-sub        { align-content:center; border:0; margin-top:4px; width:650px; height:50px; overflow:hidden; margin-left:auto; margin-right:auto; }
	#iframe-bottom     { align-content:center; border:0; width:100%; height:15px; overflow:hidden; }

	/* Reisebericht und Textbloecke */
	.textblock, .reisebericht {
		width:800px;border:0px; margin-left:auto; margin-right:auto; text-align:justify;
		color:white; font-family:"Cambria",sans-serif; font-size:13pt; line-height:150%;
	}
	.textblock table, .reisebericht table {
		font-family:"Arial",sans-serif; font-size:11pt; line-height: 120%;
	}
	.textblock a, .reisebericht a { color:#CCCC00; text-decoration:none; }
	.textblock a:hover, .reisebericht a:hover { text-decoration:underline; }

	/* Gipfelbuecher und Streckenuebersicht */
	.table-striped a { color: #CCCC00; text-decoration:none; }
	.table-striped a:hover { text-decoration:underline; }
	.table-striped { border:1px solid rgba(128,128,128,0.5); border-collapse: collapse; width:800px; text-align:center; }
	.table-striped thead th { padding:5px; height:26pt; color:white; font-weight:bold; background-color: rgba(255,255,255,0.3); }
	.table-striped tfoot td { height:0px; padding:0px; font-weight:bold; background-color: rgba(255,255,255,0.3); }
	.table-striped td { padding:5px; border:0px; color:whitesmoke !important; }
	.table-striped tr:nth-child(odd) { background-color: rgba(0,0,0,0.1); }
	.table-striped tr:nth-child(even) { background-color: rgba(255,255,255,0.2); }
	.table-striped .odd { background-color: rgba(0,0,0,0.1) !important; }
	.table-striped .even { background-color: rgba(255,255,255,0.2) !important; }
	.table-striped tr { transition:background-color 0.4s ease; }
	.table-striped .link { cursor:pointer; }
	.table-striped .link:hover { background-color:grey !important; transition:background-color 0.4s ease; }

	.filter-div { float:right; vertical-align:middle; }
	.filter-input { 
		height:20px; line-height:20px;
		padding-left:15px; padding-right:15px; padding-top:3px; padding-bottom:3px;
		margin-bottom:12px; border:1px solid transparent; border-radius:20px;
	}
	.filter-input:focus, .filter-input:hover { border:1px solid orange; outline:none; }

	/* Bilder im Reisebeicht */
	.illustration-box-right    { float:right; margin:10px 0px 10px 12px; border:0; padding-left:10px; }
	.illustration-box-right td { text-align:center; }
	.illustration-box-left     { float:left; margin:10px 12px 10px 0px; border:0; padding-right:10px; }
	.illustration-box-left td  { text-align:center; }
	.illustration-hor          { width:300px; border:1px solid white; margin:1px 1px; }
	.illustration-ver          { height:300px; border:1px solid white; margin:1px 1px; }

	/* Vorschaubilder */
	.thumb { 
		border:1px solid white; border-radius:2px; margin:2px 2px; 
		transition: opacity 1s ease;
	}
	.thumb:hover { border:2px solid lightgrey; border-radius:2px; margin:1px 1px; }
	/* Vorschaubilder animiert nach Klick waehrend des Ladens */
	.thumb-anim1 { 
		border:2px solid orange; border-radius:2px; margin:1px 1px; opacity:0;
		transition: border-color 1s ease, opacity 1s ease; 
	}
	.thumb-anim2 { 
		border:2px solid lightgrey; border-radius:2px; margin:1px 1px; 
		transition: border-color 1s ease, opacity 1s ease; 
	}

	/* Foto-Seiten ohne Javascript 
	.pic-site { text-align:center;color:#C0C0C0;}
	.pic { max-width:80vw; max-height:80vh; object-fit:contain; border:10px solid lightgrey; }
	.pic-text { color:lightgrey; }*/
	.pic-site { background-color: dimgrey; }
	.pic-div { 
		position:fixed; overflow:hidden; width:auto; height:auto;
		top:50%; left:50%; transform:translate(-50%, -50%);
	}
	.pic {
		display:block; position:relative; pointer-events:none;
		max-width:80vw; max-height:80vh; object-fit:contain; 
		border:2px solid lightgrey; border-radius:5px;
	}
	.pic-text {
		position:absolute; overflow:hidden; left:2px; bottom:2px; right:2px; text-align:center;
		color:white; background-color: rgba(100, 100, 100, 0.5);
		height:6vh; line-height:6vh; font-size:2.5vh; font-family: "Times New Roman", Times, serif;
		border-top: 0.5px solid grey;
	}
	.pic-overlay { position:absolute; width:100%; height:100%; opacity:0; }

	/* Textbox */
	#textarea {position:absolute; overflow:hidden; z-index:1098;}
	.corner   { position:absolute;width:16px;height:16px; }
	#corner1  { border-top:5px solid orange; border-left:5px solid orange;top:0px;left:0px; }
	#corner2  { border-top:5px solid orange; border-right:5px solid orange;top:0px;right:0px; }
	#corner3  { border-bottom:5px solid orange; border-left:5px solid orange;bottom:0px;left:0px; }
	#corner4  { border-bottom:5px solid orange; border-right:5px solid orange;bottom:0px;right:0px; }
	.fade         { position:absolute; }
	#fade_top     { background-color:black; border-top-left-radius:20px; border-top-right-radius:20px;}
	#fade_bottom  { background-color:black; border-bottom-left-radius:20px; border-bottom-right-radius:20px;}
	#frame_text   { position:absolute; overflow:hidden; }
	#move_text    { position:relative;color:lightgrey; text-align:justify; }
	#blankdiv {
		position:absolute; z-index:1099; background-color:white;
		opacity:0; /* filter:alpha(opacity=0); */ 
		top:0px; left:0px; width:100%; height:100%;
	}

-->