/*
NVM U14 Kiel
*/

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300);

*, *:before, *:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	}

/* default */

/* styles */

html { 
	font-family: 'Open Sans', sans-serif;	
	font-size: 100%; 
	font-weight: 300;
	}

.clearfix:before, .clearfix:after {
	content: " ";
	display: table;
	}
 
.clearfix:after {
	clear: both;
	}
 
.clearfix {
	*zoom: 1;
	}

h1, h2, h3, h4, h5, p {
	padding: 0px;
	margin: 0px;
	}

h1 {
	color: #333333;
	margin-bottom: 1rem;
	}

p {
	color: #333333;
	padding-bottom: 1rem;
	}

/* end of styles */

/* containers */

#contact {
	background: #333333;
	}

.content {
	border-top: 3px solid white;
	}

#footer {
	background: black;
	}

#navigation {
	background: #698696;
	border-bottom: 1px solid white;
	display: block;
	height: 3rem;
	position: fixed;
	text-align: center;
	width: 100%;
	z-index: 1000;
	}

#page {
	background: #f9fcfd;
	}

#visual {
	display: block;
	margin-top: 3rem;
	position: relative;
	}

.wrapper {
	display: block;
	margin: 0px auto;
	width: 100%;
	}

/* end of containers */

/* contact */

#contact a, #contact h1, #contact p {
	color: white;
	}

#contact .googlemaps {
	margin-top: 2rem;
	position: relative;
	padding-bottom: 42%;
	height: 0px;
	overflow: hidden;
	}

#contact .googlemaps iframe {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	}

#contact .item {
	display: block;
	margin-bottom: 2rem;
	width: 100%;
	}

#contact .wrapper {
	border-bottom: 1px solid #666666;
	padding-bottom: 2rem;
	}

#statetime .wrapper {
	border-bottom: none;
	}

/* end of contact */

/* content */

.content .wrapper, #footer .wrapper {
	padding: 2rem;
	}

/* end of content */

/* elements */

.accordion {
	background: white;
	border: 1px solid #698696;
	display: block;
	margin-bottom: 1rem;
	margin-top: 1rem;	
	padding: 2rem;
	}

.accordion div {
	background: #fbfbfb;
	border: 1px solid #f2f2f2;
	display: block;
	margin-bottom: 1rem;
	padding: 1rem;
	}

.accordion h3 {
	cursor: pointer;
	font-size: 120%;
	font-weight: 300;
	}

.accordion h3 span {
	color: #eaeaea;
	}

li.logo {
	margin: 0rem;
	padding-bottom: 2rem;
	padding-left: 0rem;
	padding-right: 0rem;
	padding-top: 1rem;
	text-align: center;
	}

li.logo span {
	background: white;
	border: 2px solid #698696;
	display: block;
	height: 200px;
	margin: 1rem auto;
	width: 250px;
	}

li.logo img {
	position: absolute;
	left: 50%;
	top: 50%;
	}

li.logo img.hsjb {
	margin-left: -50px;
    margin-top: -78px;
	}

li.logo img.skje {
	margin-left: -75px;
    margin-top: -75px;
	width: 150px;
	}

/* end of elements */

/* footer */

#footer a, #footer h1, #footer p {
	color: white;
	}

#footer .wrapper {
	font-size: 70%;
	}

/* end of footer */

/* navigation */

#navigation a {
	color: white;
	cursor: pointer;
	font-weight: 400;	
	text-decoration: none;
	}

#navigation ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
	}

#navigation ul li.big {
	display: block;
	font-size: 192%;
	}

#navigation ul li.left {
	float: left;
	}

#navigation ul li.right {
	float: right;
	}

#navigation ul li.small {
	display: inline-block;
	padding: 0.75rem;
	}

#navigation .wrapper {
	padding-left: 2rem;
	padding-right: 2rem;
	}

ul.sb-menu {
	list-style: none;	
    margin: 0px;
    margin-top: 3rem;
    padding: 0px;	
	}

ul.sb-menu li {
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	border-left: 5px solid transparent;
	color: white;
	display: block;
	font-weight: 400;	
	padding-left: 1rem;
	}

ul.sb-menu li.headline {
	text-align: center;
	padding: 0px;
	padding-bottom: 2rem;
	}

ul.sb-menu li.item:hover {
	background: white;
	border-left: 5px solid #698696;	
	}

ul.sb-menu li.item a {
	color: white;
	display: block;
	padding: 1rem;
	text-decoration: none;
	}

ul.sb-menu li.item a:hover {
	color: #698696;	
	} 

/* end of navigation */

/* visual */

#visual .claim {
	border: 3px solid #698696;
	background: white;
	display: none;
	margin-left: -21rem;
	padding-bottom: 1rem;
	padding-top: 2rem;
	position: absolute;
	text-align: center;
	width: 42rem;
	bottom: 5rem;
	left: 50%;
	}

#visual .claim p {
	font-size: 192%;
	}

#visual .claim p span {
	font-size: 69%;
	}

#visual img {
	height: auto;	
	max-width: 100%;
	}

/* end of visual */

/* small screens */

@media only screen and (min-width: 35rem) { 
	html { 
		font-size: 100%; 
		}
		
	.wrapper {
		width: 35rem;
		}
	
	}

/* end of small screens */

/* medium screens */

@media only screen and (min-width: 48rem) { 
	html { 
		font-size: 100%; 
		}

	#contact .item {
		float: left;
		margin-bottom: 2rem;
		width: 50%;
		}

	#visual .claim {
		display: block;
		}
		
	.wrapper {
		width: 48rem;
		}
	
	}

/* end of medium screens */

/* large screens */

@media only screen and (min-width: 64rem) { 
	html { 
		font-size: 100%; 
		}

	#contact .item {
		float: left;
		margin-bottom: 0rem;
		width: 33%;
		}

	#visual .claim {
		bottom: 7rem;
		}
		
	.wrapper {
		width: 64rem;
		}
	
	}

/* end of large screens */

/* extra large screens */

@media only screen and (min-width: 75rem) { 
	html { 
		font-size: 100%; 
		}

	#visual .claim {
		bottom: 9rem;
		}
		
	.wrapper {
		width: 75rem;
		}
	
	}

/* end of extra large screens */