@font-face{ 
	font-family: 'Novalana Light';
	src: url('../font/novalana_light-webfont.eot');
	src: url('../font/novalana_light-webfont.eot?#iefix') format('embedded-opentype'),
	     url('../font/novalana_light-webfont.woff') format('woff'),
	     url('../font/novalana_light-webfont.ttf') format('truetype'),
	     url('../font/novalana_light-webfont.svg#webfont') format('svg');
}

:root {
	--nl-blue: #009BDD;
	--nl-blue-light: #E5F5FC;
}

html, body {	
	font-family: "Helvetica Neue Light","Helvetica Neue","Novalana Light",Helvetica,Arial,sans-serif;
	font-weight: 300;
	font-size: 10pt;
	color: #000000;
	margin: 0;
	padding: 0;
}

#public_container_outer {
	max-width: 1049px;
	margin-left: auto;
	margin-right: auto;
}
#public_container {
	margin-top: 10px;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
}

#public_content  {
	width: 100%;
}
/* @media (min-width: var(--bs-breakpoint-md)) geht auf dem Firefox leider nicht (in Safari gehts)*/
@media (min-width: 768px) {
	#public_container {
		margin-top: 74px;
		margin-left: 20px;
		margin-right: 20px;
		margin-bottom: 20px;	
	}
	#public_content  {
		margin-top: 51px;
	}
}

.nova_light_box {
	background-color: var(--nl-blue-light);
	color: var(--nl-blue);
	font-size: 19px;
	padding: 2rem;
	border-radius: 1rem;
}
.nova_light_box h1 {
	font-size: 46px;
	font-weight: 300;
	margin: 0 0 10px 0;
}
.nova_light_box_small {
	background-color: var(--nl-blue-light);
	color: var(--nl-blue);
	font-size: 16px;
	padding: 2rem;
	border-radius: 1rem;
}
.nova_light_box_small h1 {
	font-size: 28px;
	font-weight: 300;
	margin: 0 0 10px 0;
}


#public_content .nova_button {
	cursor: pointer;
	display:inline-block;
	font-size: 19px;
	line-height: 32px;
	color: #FFFFFF;
	background: #229CDB;
	border-radius: 11px;
	padding: 0 6px 0 11px;
}
#public_content .nova_button:after {
	float:right;
	margin-left: 11px;
	border-left: 1px solid #FFFFFF;
	padding: 0 0 0 6px;
	font-size: 19px;
	line-height: 32px;
    content:'\25BA'
}
#public_content a.nova_button {
	text-decoration: none;
}


	/*
	 * navbar	
	 */
	nav.nl_navbar ul {
		font-size: 19px;
		max-width: 200px;
	}
	nav.nl_navbar ul li {
		background-color: var(--nl-blue-light);
	}
	nav.nl_navbar ul li a {
		color: var(--nl-blue);
	}
	nav.nl_navbar ul li a:hover {
		color: var(--nl-blue);
	}
	nav.nl_navbar ul li:not(:last-child) {
		border-bottom: 2px solid white;
	}
	nav.nl_navbar ul li:first-child {
		border-radius: 11px 11px 0 0;
	}
	nav.nl_navbar ul li:last-child {
		border-radius: 0 0 11px 11px;
	}
	nav.nl_navbar ul li.selected_element {
		background-color: var(--nl-blue);
	}
	nav.nl_navbar ul li.selected_element a {
		color: var(--nl-blue-light);
	}
	nav.nl_navbar .navbar-toggler:focus {
		box-shadow: inherit;
	}
	/* @media (min-width: var(--bs-breakpoint-md)) geht auf dem Firefox leider nicht (in Safari gehts)*/
	@media (min-width: 768px) {
		nav.nl_navbar ul {
			max-width: 100%;
		}
		nav.nl_navbar ul li:not(:last-child) {
			border-bottom: 0;
			border-right: 2px solid white;
		}
		nav.nl_navbar ul li:first-child {
			border-radius: 11px 0 0 11px;
		}
		nav.nl_navbar ul li:last-child {
			border-radius: 0 11px 11px 0;
		}
	}

	/* footer */
	#public_footer_container table.openinghours td {
		vertical-align: top;
		padding: 0 20px 0 0;
	}


	/*
	 * Models
	 */
	#model_container .nova_text_box_model {
		background-color: var(--nl-blue-light);
		color: var(--nl-blue);
		font-size: 16px;
		height: 74px;
		box-sizing: border-box;
		padding: 9px 11px 11px 11px;	/* 9px oben, damit die Schrift wirklich ganz oben ist */
		margin-top: 5px;
		border-radius: 1rem;
	}
	#model_container .nova_text_box_model .modelname {
		height: 44px;
		line-height: 1.2;
	}
	#model_container div.difficulty {
		height: 10px;
	}
	div.difficulty div.diffdots {
		display: block;
	}
	div.difficulty div.diffdescription {
		display: none;
	}
	div.difficulty > div.dot {
		background-color: #E5F5FC;
		border:1px solid #229CDB;;    
		float: left;
		margin-right: 5px;
		height:8px;
		width:8px;	
		border-radius:50%;
	}	
	div.difficulty > div.dot_checked {
		background-color: #229CDB;
		color: #229CDB;;    
		float: left;
		margin-right: 5px;
		height:10px;
		width:10px;	
		border-radius:50%;
	}	
	div.difficulty > div.diffdescription {
		float: left;
		margin-right: 5px;
		height:10px;
		font-size: 10pt;
		line-height: 10px;
	}	
	div.difficulty:hover div.diffdots {
		display: none;
	}
	div.difficulty:hover div.diffdescription {
		display: block;
	}