/* @override 
	http://catscradle.dk/templates/cc/css/cc.css
	http://catscradle.dk/templates/cc/css/reset.css */

body {
	font: 90%/160% Helvetica,Arial,Geneva,Swiss,SunSans-Regular;
	text-align: justify;
	background-image: url("billeder/jbpbg.jpg");
	background-repeat: repeat;
	color: #303030;
}

a {
	color: #505050;
}

a:hover {
	color: #000000;
}

i, em {
	font-style: italic;
}

b, strong {
	font-weight: bold;
}

h2 {
	font-weight: bold;
	font-size: 1.4em;
	line-height: 1.4em;
	color: #000000;
}

h4 {
	font-weight: bold;
	font-size: 1 em;
	line-height: 1em;
	color: #b04c1a;
}

.streg {
	height: 2px;
	background-color: #50bbbb;
	width: 100%;
	display: block;
}

#page {
	width: 90%;
	margin: auto;
}

#header {
	display: block;
	width: 100%;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.hoved {
	width: 100%;
	display: block;
}

.menu {
	display: block;
	width: 96%;
	margin-bottom: 1em;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 4%;
	float: left;
	background-image: url("billeder/jbpbg_mork2.jpg");
}

.celle {
	padding-right: 3em;
	float: left;
}

.cellevalgt {
	font-weight: bold;
	color: #b04c1a;
	padding-right: 3em;
	float: left;
}

.celle a {
	font-weight: bold;
	color: #000000;
	text-decoration: none;
}

.celle a:hover {
	color: #b04c1a;
}

.billedstart {
	clear: left;
	display: block;
	width: 100%;
	height: auto;
}

.listebilledestart {
	width: 225px;
	height: 225px;
	position: relative;
	display: block;
	float: left;
}

.listebillede {
	width: 75%;
	position: relative;
}

.listebilledestop {
	width: 225px;
	height: 225px;
	position: relative;
	display: block;
	float: left;
}

.galleristop {
	width: 225px;
	height: 1px;
	position: relative;
	display: block;
	clear: left;
}

.billede {
	width: 100%;
	display: block;
}

.photocredit {
	text-align: right;
	background-color: #000000;
	color: #ffffff;
	padding: 0.1em 1em;
	font-style: italic;
	font-size: 0.5em;
	float: right;
}

.arkivelement {
	width: 25%;
	float: left;
	margin-bottom: 5.5%;
}

.arkivelement a {
	font-weight: bold;
	color: black;
	text-decoration: none;
	float: left;
	text-align: left;
}

.arkivelement a:hover {
	color: #b04c1a;
}

.arkivtext {
	clear: left;
	font-size: .8em;
}

.billedsize {
	
}

.billedtitel {
	font-weight: bold;
	line-height: 1.5em;
	color: #000000;
	font-size: 1em;
	margin-left: 4.5%;
	text-align: center;
	width: 99%;
}

#indhold {
	display: block;
	width: 96%;
	margin: auto;
	min-height: 400px;
}

#gallerindhold {
	display: block;
	width: 100%;
	margin: auto;
	min-height: 400px;
}

#footer {
	display: block;
	width: 99%;
	margin-bottom: 1em;
	padding-top: 2px;
	padding-bottom: 2px;
	background-image: url("billeder/jbpbg_mork2.jpg");
	text-align: center;
	color: #505050;
}

#footer a {
	color: #b04c1a;
}

#logo {
	overflow: auto;
	position: relative;
	width: 407px;
	height: 305px;
	top: 200px;
}

.thm {
	float: left;
	margin-right: 1em;
	width: 35%;
}

.billednavigator {
	display: block;
	padding-top: 2.5em;
	padding-bottom: 0.5em;
}

.sidetitel {
	font-weight: bold;
	line-height: 1.7em;
	color: #b04c1a;
	font-size: 1.4em;
	margin-left: 4.5%;
	text-align: center;
	width: 91%;
}

.hovedbillede {
	width: 100%;
}

.navleft {
	display: block;
	width: 3%;
	opacity: 1;
	position: absolute;
}

.navleft:hover {
	opacity: 0;
	visibility: hidden;
}

.navlefthover {
	position: absolute;
	display: block;
	width: 3%;
	opacity: 0;
	z-index: 1;
}

.navlefthover:hover {
	opacity: 1;
	z-index: 1;
}

.navright {
	display: inline-block;
	width: 3%;
	opacity: 1;
	position: absolute;
	right: 9%;
}

.navright:hover {
	opacity: 0;
	visibility: hidden;
}

.navrighthover {
	position: absolute;
	display: block;
	width: 3%;
	opacity: 0;
	z-index: 1;
	right: 9.5%;
}

.navrighthover:hover {
	opacity: 1;
	z-index: 1;
}

.indholdsfortegnelse {
	width: 60%;
	margin: auto;
}

.side1 {
	width: 45%;
	padding-top: 1em;
	float: left;
	position: relative;
	padding-bottom: 2%;
}

.side2 {
	width: 45%;
	padding-top: 1em;
	float: left;
	position: relative;
	right: -10%;
	padding-bottom: 2em;
}

.cleared {
	clear: both;
	width: 100%;
	margin: auto;
	padding-bottom: 4%;
	padding-top: 2%;
}

.billedtekst {
	padding-bottom: 12%;
}

@media screen and (max-width:920px) {
	#page {
		width: 98%;
	}
	
	#indhold {
		width: 94%;
		min-height: 250px;
	}
	
	.arkivelement {
		width: 33.3%;
		float: left;
		margin-bottom: 4%;
	}
	
	.navleft {
		display: block;
		width: 4%;
		opacity: 1;
		position: absolute;
	}
	
	.navleft:hover {
		opacity: 0;
		visibility: hidden;
	}
	
	.navlefthover {
		position: absolute;
		display: block;
		width: 4%;
		opacity: 0;
		z-index: 1;
	}
	
	.navlefthover:hover {
		opacity: 1;
		z-index: 1;
	}
	
	.navright {
		display: block;
		width: 4%;
		opacity: 1;
		position: absolute;
		right: 5%;
	}
	
	.navright:hover {
		opacity: 0;
		visibility: hidden;
	}
	
	.navrighthover {
		position: absolute;
		display: block;
		width: 4%;
		opacity: 0;
		z-index: 1;
		right: 5%;
	}
	
	.navrighthover:hover {
		opacity: 1;
		z-index: 1;
	}
	
	.arkivelement {
		width: 50%;
		float: left;
		margin-bottom: 4.5%;
	}
}

@media screen and (max-width:520px) {
	#page {
		width: 98%;
	}
	
	#indhold {
		width: 94%;
	}
	
	.menu {
		display: block;
		width: 100%;
		padding: 2px;
	}
	
	.celle {
		padding-right: 3em;
		float: none;
		text-align: center;
		padding-left: 3em;
	}
	
	.celle a {
		font-weight: bold;
		color: #000;
		text-decoration: none;
		font-size: 110%;
	}
	
	.celle a:hover {
		color: #b04c1a;
	}
	
	.cellevalgt {
		font-size: 110%;
		font-weight: bold;
		color: #b04c1a;
		padding-left: 3em;
		float: none;
		text-align: center;
	}
	
	#indhold {
		min-height: 200px;
		margin-top: 8.6em;
	}
	
	.listebillede {
		width: 90%;
		height: auto;
		margin-right: 2%;
	}
	
	.listebilledestop {
		width: 48%;
		height: auto;
		margin-right: 2%;
		0
	}
	
	.side1 {
		width: 100%;
		padding-top: 1em;
		float: left;
		position: relative;
		padding-bottom: 2em;
	}
	
	.side2 {
		width: 100%;
		padding-top: 1em;
		float: none;
		position: relative;
		right: 0;
		padding-bottom: 2em;
		clear: none;
	}
	
	.sidetitel {
		font-weight: bold;
		line-height: 1.7em;
		color: #000000;
		font-size: 1.1em;
		margin-left: 8%;
		text-align: center;
		width: 85%;
	}
	
	.navleft {
		display: block;
		width: 5%;
		opacity: 1;
		position: absolute;
	}
	
	.navleft:hover {
		opacity: 0;
		visibility: hidden;
	}
	
	.navlefthover {
		position: absolute;
		display: block;
		width: 5%;
		opacity: 0;
		z-index: 1;
	}
	
	.navlefthover:hover {
		opacity: 1;
		z-index: 1;
	}
	
	.navright {
		display: block;
		width: 5%;
		opacity: 1;
		position: absolute;
		right: 5%;
	}
	
	.navright:hover {
		opacity: 0;
		visibility: hidden;
	}
	
	.navrighthover {
		position: absolute;
		display: block;
		width: 5%;
		opacity: 0;
		z-index: 1;
		right: 5%;
	}
	
	.navrighthover:hover {
		opacity: 1;
		z-index: 1;
	}
}

@media screen and (min-width:1600px) {
	#page {
		width: 70%;
	}
	
	.sidetitel {
		font-weight: bold;
		line-height: 1.7em;
		color: #b04c1a;
		font-size: 1.4em;
		margin-left: 4.5%;
		text-align: center;
		width: 91%;
	}
	
	.navleft {
		display: block;
		width: 2%;
		opacity: 1;
		position: absolute;
	}
	
	.navleft:hover {
		opacity: 0;
		visibility: hidden;
	}
	
	.navlefthover {
		position: absolute;
		display: block;
		width: 2%;
		opacity: 0;
		z-index: 1;
	}
	
	.navlefthover:hover {
		opacity: 1;
		z-index: 1;
	}
	
	.navright {
		display: inline-block;
		width: 2%;
		opacity: 1;
		position: absolute;
		right: 17.5%;
	}
	
	.navright:hover {
		opacity: 0;
		visibility: hidden;
	}
	
	.navrighthover {
		position: absolute;
		display: block;
		width: 2%;
		opacity: 0;
		z-index: 1;
		right: 17.5%;
	}
	
	.navrighthover:hover {
		opacity: 1;
		z-index: 1;
	}
	
	.arkivelement {
		width: 20%;
		float: left;
		margin-bottom: 5.5%;
	}
	
	#footer {
		width: 100%;
	}
}
}

