html { margin: 0px; padding: 0px;}
body {background-color: #2f2f2f; color: white; font: 300 16px "Source Sans Pro",Arial,Helvetica,sans-serif;  margin: 0px; padding: 0px; }
a {color: inherit; text-decoration: none;}
a:hover {text-decoration: none;  color:#a2a2a2}
#container {max-width:1500px; margin:auto; padding: 0px; position: relative;}
#nav {font-weight: normal; font-size: 18px; font-style: italic; letter-spacing: 2px; padding-bottom: 4px; height: 22px; padding-top: 10px; float: left }
#subheadline {font-weight: normal; font-size: 18px; font-style: italic; letter-spacing: 2px; display:none; text-transform: uppercase; margin-top:10px; position:absolute; top:30px; left:15px;}
#nav li {float: left; margin-right:29px; margin-left:0px; padding: 0px; list-style-type: none; text-transform: uppercase;}
#nav ul {margin: 0px; padding: 0px;}
#nav a:hover {text-decoration: none; color:#a2a2a2}
#header {height: 80px; margin-top:45px; padding-left: 15px;}
#main { padding-left: 15px; min-height: 500px; clear: both; margin-top:26px;}
h1 {font-size: 40px; margin: 0px; padding: 0px 0px 0px 0px; font-style: italic; font-weight: 500; font-family:inherit; display:inline-block;}
h2 {font-size: 37px; margin: 0px; padding: 0px 0px 0px 0px; font-style: italic; font-weight: 500; font-family:inherit; display:inline-block; line-height: 30px;}
h2 a:hover {text-decoration: none;}
h3 {font: 400 25px "Source Sans Pro",Arial,Helvetica,sans-serif; margin: 0px; padding: 0px 0px 10px 0px; font-weight: normal; font-style: italic;}
h4 {font-size: 20px; margin:0px 0px 0px 0px; padding: 0px 0px 5px 0px; font-weight:normal;  font-family:inherit; text-align:left;font-style: italic;}

#headright {float: right; max-width: 600px; text-transform: uppercase; padding-top:10px; padding-right: 25px; font-size:14px; letter-spacing: 1px; font-style: italic; white-space: nowrap;}
#headleft {width: 300px; margin-bottom:10px; float:left}
#topnav{padding:0px 15px; margin:0px;border-bottom: 1px solid #646464; height: 40px; box-sizing: border-box;}
#navdiv{padding:0px; margin:0px; max-width: 740px; float: left;}

#loginpane { text-align:right; padding-top:8px; height: 24px;}
#rightnav {float: right; width: 300px; padding-right: 11px; text-align: right; margin-top:7px; height: 35px;}

.success {color:#00ab59; font-weight: bold;}
.warning {color:#e90202; font-weight: bold;}
.searchbox {font:  300 16px "Source Sans Pro",Arial,Helvetica,sans-serif; margin-right: 0px; background-image: url("/img/lupe.png"); background-repeat: no-repeat; background-position: 3px center;  height: 20px; padding-left: 20px; border: none; background-color: #a2a2a2; width: inherit;}
.searchfield {background-image: url("/img/lupe.png"); background-repeat: no-repeat; background-position: 3px center;  height: 20px; padding-left: 20px;}
.tags {color:#aeaeae; font-size: 14px;}
.imagemedium {padding:10px 0px 30px 30px}
#nav a {text-decoration: none; color: inherit;}
u {text-decoration: none; color: #2a6496;}

.de {background-image: url("/img/de.png"); background-repeat: no-repeat; background-position: 3px center; padding-left: 35px;}
.en {background-image: url("/img/en.png"); background-repeat: no-repeat; background-position: 3px center; padding-left: 35px;}

#gallery img { box-shadow:  1px 1px 8px 2px #171717; border: 0px solid white; }

#gallery {text-align: center; text-transform: uppercase;}

.picturestack {width:190px; text-align: center; float: left; margin-right: 22px; margin-bottom:20px; text-transform: uppercase;}
.picturestack img { box-shadow:  1px 1px 8px 2px #171717; border: 0px solid black; }

#tagcloud a {color:#FFFFFF;}
.smallbutton {font: 300 12px "Source Sans Pro",Arial,Helvetica,sans-serif; height: 20px; text-transform: uppercase; letter-spacing: 2px; font-style: italic}
.bigbutton {font: 300 16px "Source Sans Pro",Arial,Helvetica,sans-serif; height: 30px; text-transform: uppercase; letter-spacing: 2px; font-style: italic; vertical-align: top;}
.inputfield {font: 300 16px "Source Sans Pro",Arial,Helvetica,sans-serif; height: 30px; text-transform: uppercase; letter-spacing: 2px; font-style: italic; vertical-align: top;}
.item { margin:0px 32px 32px 0px; }
.item img {border: 2px solid white; }

.previewtip {border: 3px solid black; margin: 20px;}

legend {color: #a2a2a2;}

.gal{
    display: block;
    line-height: 1px;
    width:  194px;
	height: 240px;
    border: 1px solid #555;
    padding: 3px;
    float: left;
    margin-left:10px;
    margin-right: 10px;
    margin-bottom: 20px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    white-space: nowrap;
}

.galname {
    font-size: 20px;
    height: 26px;
    margin-bottom:-2px;
}

.galueb {
	font-size: 22px;
	font-weight: bold;
}

.thumbbox {
	margin: 4px;
    padding: 0px;
    text-align: center;
    height: 89px;
    width: 89px;
    float: left;
	
	background: url("/img/tb_back.png") repeat-x scroll 50% 50% rgb(34, 34, 34);
	font-weight: normal;
	color: rgb(238, 238, 238);
	float: left;	
}

.modal-overlay {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
	background: #131313;
	opacity: .95;
	filter: alpha(opacity=95);
	z-index: 101;
}
.modal-window {
	position: fixed;
	top: 50%;
	left: 50%;
	margin: 0;
	padding: 15;
	z-index: 102;
	background: #111;
	border: solid 8px #FFF;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
}
iframe {
	-webkit-overflow-scrolling: touch;
	overflow-y: scroll;
}
.close-window {
	position: absolute;
	width: 47px;
	height: 47px;
	left: -24px;
	top: 0px;
	background: transparent url(../img/close-button.png) no-repeat scroll right top;
	text-indent: -99999px;
	overflow: hidden;
	cursor: pointer;
}

#footer {clear: both; width: 100%; text-align: right; font-size:14px; color: white; border-radius: 0px 0px 7px 7px; }


.menu > li > a{
	display: block;
	padding: 42px 20px;
	text-decoration: none;
	font-weight: normal;
	font-size: 16px;
	line-height: 1;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
	-webkit-transition: all 0.25s linear;
	-moz-transition: all 0.25s linear;
	-o-transition: all 0.25s linear;
	transition: all 0.25s linear;
}

.menu > li > a:hover, .menu > li > a:focus{
	background: #F2F2F2;
	color: black;
	padding: 50px 20px 34px;
}

.togglemenu{ 
	z-index: 2; 
	font:  500 20px "Source Sans Pro",Arial,Helvetica,sans-serif;
	font-style: italic;
	display: none;
}

#togglemenu, .togglemenu { display: none; }


body{ -webkit-animation: bugfix infinite 1s; }
@-webkit-keyframes bugfix { from {padding:0;} to {padding:0;} }

/* Nicolas Gallagher micro clearfix */
.clearfix:before, .clearfix:after { display: table; content: ""; }
.clearfix:after { clear: both; }


/* login pane goes under header */
@media (max-width: 680px) {
	#headright {
		float:none;
		margin-top:5px;
	}
	#headleft {
		position: static;
	}	
	#navdiv {
		margin-top:20px;
	}
	
}



@media only screen and (max-width: 760px){

	.menu { display: none; opacity: 0; width:100%; position: absolute; }
	.menu > li { display: block; width: 100%; margin: 0; }
	.menu > li > a { display: block; width: 100%; text-decoration: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
	.togglemenu { display: block; position: relative; cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
	#togglemenu:checked ~ .menu { display: block; opacity: 1;}
	
	#nav li {
		float:none;
		margin-right: 30px;
		padding: 15px;
	}
	#nav {
		height:auto;
		padding: 0px;
		border: none;
		z-index: 101;

	}	
	#navdiv {overflow: hidden; padding: 0px; margin-top: -10px; width:100%; box-sizing: border-box;}

	label {margin:0px;}
	
	.menu li { background-color: #a2a2a2;}
	
	.menu, .menu > li, .menu > li > a{
		height: auto;
	}
	
	.menu li > a{
		padding: 0px;
	}
	
	.menu li:hover, .menu li:focus{
		background: #F2F2F2;
		color: black;
	}
	
	.menu li >a:hover {color:black!important;}
	
	.togglemenu:after {
		content: 'Main Menu';
		display: block;
		width: 200px;
		margin: 5px 0px 0px 0px;
		padding: 10px 50px;
		background: #f2f2f2;
		-webkit-border-radius: 2px;
		border-radius: 2px;
		text-align: center;

		color: #000;
		-webkit-transition: all 0.5s linear;
		-moz-transition: all 0.5s linear;
		-o-transition: all 0.5s linear;
		transition: all 0.5s linear;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box; 
		width: 100%; 
	}
	
	.togglemenu:hover:after{
		background: #f2f2f2;
		color: black;
	}
	
	#togglemenu:checked + .toggle:after{
		content: 'Close Menu';
	}
	
	.nav, .togglemenu:after{ 
		float: none; 
	}
	.togglemenu:after { 
		text-align: center; 
	}

}
