/* CSS Document */

/*font*/

@font-face
{
	font-family: Varelo;
	src: url(VarelaRound-Regular.woff);
}


/*main*/
body 
{
	font-family: Varelo, Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #fffdf8;
	background: #3fa7dc;	
	padding: 0px;
	margin: 0px;
	overflow-y: scroll
	
}


.clear
{
	clear: both;
}

img
{
	display: block;
	width: 100%;
	border: none;
}

a img 
{
	border: none;	
}
h2
{
	margin: 0%;	
}

h3
{
	font-size: 1em;
	margin: 0%;
}

p
{
	font-size: 1em;
}

a
{
	color: #fffdf8;
}

/*header*/

.header
{
	width: 100%;
	background: #3fa7dc;	

}

	.headerimage
	{
		width: 100%;
		background: url(images/headerkort.png) no-repeat top left;
		background-size: contain;
		padding-bottom: 20%;
		margin-bottom: 0.5em;
	}

.menu
{
	width: 100%;
	background: #ffba00;

}	

	body.scrolled .menu
	{
		position: fixed;
		top: 0;
		left: 0;
	}
	
	.menu ul
	{
		list-style: none;
		width: 100%;
		padding: 0%;
		margin: 0%;
	
	}
	
		.menu li
		{
			display: inline-block;	
			width: 24%;
			margin: 0% 0%;
			text-align: center;
			border-radius: 10px;
			padding: 1% 0%;
		}
		
		.menu li a
		{
			display: block;
			height: 100%;
			width: 100%;
			text-decoration: none;
			color: #1b170c;
		}

/*content*/

.content
{
	padding: 2% 0% 15%;
	overflow: hidden;
}

body.scrolled .content
	{
		padding-top: 8%;
	}

.wrapper
{
	width: 80%;
	margin: 0% auto;
	text-align: center;

}

.item
{
	width: 80%;
	margin: 4% 10%;
	text-align: center;
}

.portrait img
{
	width: 40%;
	margin: 0% 30% 2%;
	border-radius: 50%;
	
}

/*footer*/

.footer
{
	width: 100%;
	position: fixed;
	left: 0px;
	bottom: 0px;
	background: url(images/footerkort.png) no-repeat top left;
	background-size: contain;
	padding-top: 15%;
}

/*media queries*/

@media screen and (min-width: 740px) {

	.headerimage
	{
		background: url(images/headerlang.png) no-repeat top left;
		background-size: cover;
		padding-bottom: 10%;
	}
	
	.content
	{
		padding: 2% 0% 10%;
	}
	
	.menu ul
	{
		width: 50%;
		margin: 0% 25%;
	}
	
	.menu li
	{	
		width: 20%;
		margin: 0% 2%;
	}
		
	.wrapper
	{
		width: 50%;
	}
	
	.item
	{
		width: 45%;
		margin: 2%;
		display: inline-block;
		vertical-align: top;
	}
	
	.footer
	{
		background: url(images/footerlang.png) no-repeat top left;
		background-size: contain;
		padding-top: 11%;
	}