/* Header and Navigation 
   Hiermit kommt in der header das Logo (HL-Gastro) 3px von der oberste Rand*/
header a.logo { margin-top: 3px}

/* in den header gibt es ein dic mit class=header*/
div.header { 
	background: #FFF;
/*	background: #B40404;                                                /* Gesamte Hintergrund, wenn erneut definiert, wird der ursprungswert einfach überschrieben */
	width: 100%; 														/* hiermti wird der gesamte breite des Fenstes benutzt                                      */
	box-shadow: 0px 1px 5px rgba(0,0,0,0.2); 
	position: relative; 
	display: block; 
	z-index: 99; }

div.header:after {
	content: '';
	height: 0;
	visibility: hidden;
	clear: both; }

/* in den div mit class=header gibt es class is inside*/
div.header div.inside {
	margin: 0 auto; 
	max-width: 1200px; 
	height: 45px;
	line-height: 45px;
}
div.header ul { float:right;}
div.header ul:after { clear:both; content: " "; display: block; font-size: 0; height: 0; visibility: hidden;}
div.header ul li { list-style: none; float: left; margin-right: 10px; cursor: pointer; font-family: Oswald; font-weight: 300; font-size: 14px; color: #000;}
div.header ul li:last-child { padding-right: 0px;}
div.header ul li:hover > ul { visibility: visible;}
/* lvl2 */
div.header ul li ul { 
	visibility: hidden; 
	position: absolute; 
	border-width: 0px 1px 1px 1px; 
	border-style: solid; 
	border-color: rgba(0,0,0,0.2); 
	background-color: white;
}
div.header ul li ul li { 
	clear: both; 
	#width: 110px; 
}
div.header ul li a { padding: 0 10px; font-family: Oswald; font-size: 14px; display: block;}

div.header a.logo { background: url(../../images/HLGastrohdr.jpg) no-repeat 0px 0px; float:left; width: 400px; height: 40px; }
/* EOS */

/* Subnavigation */
div.subnav { }
	div.subnav ul { float: right; }
	div.subnav ul:after { clear: both; content: ''; display: block; visibility: hidden; }
	div.subnav ul li { list-style: none; float:left; margin-left: 15px; cursor: pointer; line-height: 22px;}

/* User-Navigation */
nav.user {
	background: #FFF;
	position: fixed;
	top: 44px;
	left: 50%;
	height: 35px;
	line-height: 35px;
	width: 1200px;
	display: block;
	margin-left: -600px;
	box-shadow: 0px 1px 5px rgba(0,0,0,0.2);
	z-index: 90;
}
nav.user:after {
	clear:both;
}

/* LVL1 */
nav.user ul { padding-left: 10px; float: left;}
nav.user ul:after { clear: both; content: " "; display: block; font-size: 0; height: 0; visibility: hidden;}
nav.user ul li { list-style: none; float: left; margin-right: 15px; cursor: pointer; font-family: Oswald; font-weight: 300; font-size: 14px; color: #000;}
nav.user ul li:last-child { padding-right: 0px;}
nav.user ul li:hover > ul { visibility: visible;}
/* LVL2 */
nav.user ul li ul { visibility: hidden; position: absolute; border-width: 0px 1px 1px 1px; border-style: solid; border-color: rgba(0,0,0,0.2); background-color: #FFF;}
nav.user ul li ul li { clear: both; width: auto;}
nav.user ul li a { padding: 0 10px; font-family: Oswald; font-size: 14px; display: block;}

/* Content weiter nach unten verschieben wenn Angemeldet */
div#content.user {
	margin-top: 80px;
}
/* END Admin-Navigation */

/* SECTIONS */
section {
	border: 1px solid rgba(0,0,0,0.2);
	padding: 10px;
	margin-bottom: 30px; 
	width: 1178px;
	background-color: rgba(255,255,255,1);
	box-shadow: 0px 1px 5px rgba(0,0,0,0.2); }
	section:first-child {
		margin-top: 80px;
		margin-bottom: 10px;
	}
	section:last-child {
		margin-bottom: 10;
	}
	section:after {
		content: '.';
		visibility: hidden;
		display: block;
		clear: both;
		height: 0;
	}
	section.title {
		border: 0px;
		background: transparent;
		box-shadow: none;
		width: 1180px;
		padding: 10px 10px 0px 10px;
	}
	section.title h2 {
		padding-bottom: 0;
	}
	section.title a.action {
		line-height: 40px;
		margin-left: 10px;
	}
	section.title div.title-nav {
		margin-top: 3px;
		width: auto;
	}
	section.title div.title-nav a {
		line-height: 12px;
	}
/*                                                                               Hiermit wird der Section in zwei geteilt   */
	section.grid2 {
		width: 550px;
		margin: 0 10px;
		float: left;
	}
/*                                                                                Hiermit kommt das erste Teil links bundig */
	section.grid2:first-child {
		margin: 0;
	}

/*                                                                                Hier wird geteilt in 1/3-tel und 2/3-tel */
	section.dritlinks {
		border-width: 15px 1px 1px 1px;
		border-top-color: #FF8C00;
		width: 30%;
		margin: 0 10px;
		float: left;
		margin-bottom: 30px;
		margin-top: 80px; 
	}

	section.dritrechts {
		border-width: 15px 1px 1px 1px;
		border-top-color: #FF8C00;
		width: 60%;
		margin: 0 10px;
		float: right;
		margin-bottom: 30px; 
		margin-top: 80px; 
	}
	section.dritrechts h4 { color: blue; }

/*                                                                                In das Menu wird diese Einteillung benutzt*/
	section.menu {
		border-width: 15px 1px 1px 1px;
		border-top-color: #FF8C00;
		width: 21%;
		margin: 0 10px;
		float: left;
		margin-bottom: 10px; 
	}
	section.menu:first-child {
		margin: 0;
	}

/*  Section kann ausgeschaltet werden

	section.menu h1 { color: blue; }
	section.menu h2 { color: blue; }
	section.menu h3 { color: blue; }
	section.menu h4 { color: blue; }
*/



/* ERRORMESSAGES */
section.errormessage {
	border: 1px solid #FF3334;
	border-radius: 5px;
	background-color: #FFB3B3;
	padding: 10px;
	width: auto;
}



/* Loginseite */
section#login {
	width: 600px;
	height: 325px;
	position: relative;
	left: 50%;
	top: 50%;
	margin-left: -250px;
	border-width: 1px;
	border-style: solid;
	border-color: #000080;
	border-radius: 5px;
	box-shadow: 0px 1px 15px rgba(0,0,0,0.2);
	background-color: #EEEEEF; }
	section#login div.grid {
		margin: 10px; }
	section#login form#login h1 { 
		margin-top: 50px; 
		margin-bottom: 50px;}
	section#login a.login {
		line-height: 21px;
		font-size: 12px;
		position: absolute;
		bottom: 10px; }

/* EOS */

/* Logout-Seite */
section#logout {
	width: 240px;
	position: relative;
	left: 50%;
	top: 50%;
	margin-left: -120px;
	margin-right: auto;
	text-align: center;
	display: block;
}
/* END Loginseite */


.block { float: left;}
.left { float: left;}
.right { float: right;}
.clearfix { clear:both;}

/* Reisewarnungen */
section.travelwarning {
	}
	section.travelwarning div.item {
		width: 580px;
		float: left;
		margin-right: 15px;
	}
	section.travelwarning div.item:last-child { 
		margin-right: 0px; }
	section.travelwarning div[class*="severity"] {
		display: block;
		width: 100%;
		margin-bottom: 5px;
	}
	section.travelwarning div[class*="severity"] div.header {

	}
	section.travelwarning div[class*="severity"] div.header span.icon { 
		height: 20px;
		width: 20px;
		margin-right: 5px;
		display:block;
		float: left;
	}
	section.travelwarning div[class*="severity"] div.header p.header { 
		line-height: 20px;
		height: 20px;
		width: auto;
		display:block;
	}
	section.travelwarning div[class*="severity"] div.header p.header:after {
		content: '';
		display: none;
		clear: both;
	}
	section.travelwarning div.severity1 {
		background-color: transparent;
	}
	section.travelwarning div.severity2 {
		background-color: #FFF3E2;
		border: 1px solid #F5D19B;
	}
	section.travelwarning div.severity3 {
		background-color: #FFCBC9;
		border: 1px solid #F7A29E;
	}
	section.travelwarning div.severity1 span.icon { background-image: url(/images/icons/severity1.jpg);}
	section.travelwarning div.severity2 span.icon { background-image: url(/images/icons/severity2.jpg);}
	section.travelwarning div.severity3 span.icon { background-image: url(/images/icons/severity3.jpg);}
/* END Reisewarnungen */

/* Questionaire */
section.qn_index ul { list-style-type: none;}
section.qn_index ul.lvl0 { margin-left: 0px; line-height: 20px; font-weight: bold;}
section.qn_index ul.lvl1 { margin-left: 20px; line-height: 15px; font-weight: normal;}
section.qn_index ul.lvl2 { margin-left: 0px;}
section.qn_index ul.lvl3 { margin-left: 0px;}
section.qn_index ul.lvl4 { margin-left: 0px;}
section.qn_index ul.lvl5 { margin-left: 0px;}

ul.questionaire { list-style: none; }
ul.questionaire li { margin-bottom: 5px; }

ul.questionaire li ul { list-style: none; }
ul.questionaire li p.capitalnr { font-weight: bold; width: 80px; float: left;}
ul.questionaire li p.capitalheader { font-weight: bold; }
div > p.capitalcomment { margin-top: 10px; margin-bottom: 10px; font-size: 12px;}
ul.questionaire li ul li p.subcapitalnr { width: 70px; float:left; padding-left: 10px; }


section.qn_content div.capital 	{ margin-top: 30px; font-size: 20px;}
	section.qn_content div.capital span 	{ width:30px; line-height: 22px; font-size: 20px; float:left; font-family: Helvetica; font-weight: 300;}
	section.qn_content div.capital h2 		{ font-size: 20px; }
	section.qn_content div.capital h2:after { content: ''; clear:both;}
	section.qn_content div.capital p 		{ font-size: 12px; margin-bottom: 10px; }
	/* section.qn_content div[class*='subcapital'] h2,h3,h4,h5,h6 { font-family: Oswald; font-weight: 300; } */
	section.qn_content div[class*='subcapital'] span { font-family: Oswald; float: left; }
	section.qn_content div[class*='subcapital'] p { font-family: Tahoma; font-size: 12px; }
	section.qn_content div.subcapital1 		{ font-size: 14px; margin-bottom: 10px;}
	section.qn_content div.subcapital1 span 	{ width:30px; font-size: 18px;}
	section.qn_content div.subcapital1 h2 		{ font-size: 18px; }
	section.qn_content div.subcapital1 h2:after { content: ''; clear:both;}
	section.qn_content div.subcapital2 		{ font-size: 14px; margin-bottom: 10px;}
	section.qn_content div.subcapital2 span 	{ width:40px; font-size: 18px;}
	section.qn_content div.subcapital2 h3 		{ font-size: 18px; }
	section.qn_content div.subcapital3 		{ font-size: 14px; margin-bottom: 10px;}
	section.qn_content div.subcapital3 span 	{ width:50px; font-size: 18px; }
	section.qn_content div.subcapital3 h4 		{ font-size: 18px; }
	section.qn_content div.subcapital4 		{ font-size: 14px; margin-bottom: 10px;}
	section.qn_content div.subcapital4 span 	{ width:60px; font-size: 18px; }
	section.qn_content div.subcapital4 h5 		{ font-size: 18px; }
	section.qn_content div.subcapital5 		{ font-size: 14px; margin-bottom: 10px;}
	section.qn_content div.subcapital5 span 	{ width:70px; font-size: 18px; }
	section.qn_content div.subcapital5 h6 		{ font-size: 18px; }

div.question { margin: 10px 0px; font-size: 12px; }
div.question:last-child { margin-bottom: 20px; }
div.question div.questiondata { line-height: 20px; background-color: #F0F0F0; padding: 2px; }
div.question div.questiondata span { line-height: 20px; width: 48px; font-weight: bold; padding-left: 2px; float: left;}
div.question div.questiondata span:before { content: 'Q';}
div.question div.questiondata p.header { line-height: 20px; font-weight: bold; }
div.question div.questiondata p.header:after { content: ''; clear:both; }
div.question div.questiondata p.text { padding-left: 50px; }
div.question div.questiondata p.img { margin-left: 50px; border: 1px dashed #000; background-color: #FAFFE0; border-radius: 3px; padding: 5px; margin-right: 5px; margin-bottom: 5px; margin-top: 5px;}
div.answer textarea { margin-left: 50px; margin-bottom: 10px; width: 940px;}
section.qn-content div.answer p { margin-left: 50px; margin-bottom: 10px; }
p.lvl2 { margin-left: 25px; }
p.lvl3 { margin-left: 35px; }
p.lvl4 { margin-left: 45px; padding-left :5px; background-color: #F0F0F0;}

section.questionniare-fill {
	margin: 0; 
	padding: 0; }
	section.questionniare-fill div.capital {
		padding: 0px;
		margin: 0px;
	}

div.btt {
	width: 30px;
	height: 30px;
	background-color: #F0F0F0;
	background-image: url(../../images/icons/totop.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	position: fixed;
	bottom: 10%;
	right: 50%;
	margin-right: -550px;
	border-radius: 5px;
}

section.qn-edit {
	margin: 0px;
	padding: 0px; }
	section.qn-edit div.capital {
		padding: 2px 5px;
		margin-bottom: 5px;
		line-height: 20px;
		border: 1px solid #E6E6E6;
		border-radius: 2px;
		background-color: #F5F5F5;
	}

/* ERRORS */
div.error-messages {
	display:block;
	width: 300px;
	margin-left: auto;
	margin-right: auto;
	background-color: #FF9B9B;
	box-shadow: 0px 1px 5px rgba(0,0,0,0.2);
	border: 1px solid #C74040;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	padding: 10px;
	font-size: 12px;
	color: #C74040;
}

/* SEARCHBAR */
div.searchbar-small {
	margin-top: 10px;
}
div.searchbar-small input {
	margin: 0;
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
	border-top: 1px;
	border-left: 1px;
	border-bottom: 1px;
	border-right: 0px;
	border-style: solid;
	border-color: #c3c3c3;
	width: 200px;
	height: 18px;
}
div.searchbar-small button {
	display: block;
	height: 20px;
	width: 20px;
	background-image: url(/images/icons/view.png);
	background-repeat: no-repeat;
	background-position: center center;
	font-size: 12px;
	font-weight: normal;
	text-decoration: none;
	padding: 1px 5px;
	border-top-right-radius: 3px;
	border-top-left-radius: 0px; 
	border-bottom-right-radius: 3px;
	border-bottom-left-radius: 0px;
	border-top: 1px;
	border-left: 1px;
	border-bottom: 1px;
	border-right: 1px;
	border-style: solid;
	border-color: #c3c3c3;
	background-color: #F5F5F5;
	margin-left: 0px;
	line-height: 15px;
	cursor: pointer;
}


/*  Menu div einteilung */
.menu_col {
    float: left;
    width: 25%;
}

/* Clear floats after the columns */
.menu_row:after {
    content: "";
    display: table;
    clear: both;
} 




/* mal ausprobieren */
div.split {
	width: 250px;

}


/*********************************************************************************************************************************
 *
 * Hier werden die CCS für das Menu von Sparkästchen definiert
 *
 ********************************************************************************************************************************/

div.spar {
	margin:		5px;
	border:		1px solid #ccc;					/* der Border rundum das Bild und auch den Text 								*/
	width:		500px;							/* maximale breite 																*/
	padding:	15px;							/* Abstand zu die ränder														*/
	text-align:	center;							/* damit kommt der text in die Mitte											*/
	box-shadow:	8px 8px 5px #444;				/* damit es schön aussieht                                                      */
}

