/* ###############################

1. Seitenaufbau
2. Text
3. Navigation
4. Bilder
5. Kontaktformular
6. Handy-Optimierung

############################### */

/* ###############################
1. Seitenaufbau
############################### */

body {
	 background: url(../img/background.jpg) no-repeat center center fixed;
     -webkit-background-size: cover;
     -moz-background-size: cover;
     -o-background-size: cover;
     background-size: cover;
	}
	
header {
	height: 190px;
	}
	
#wrapper {
	background-color: #fff;
	height: 580px;
	
	box-shadow: 3px 3px 5px #333;
	-webkit-box-shadow: 3px 3px 5px #333;
    -moz-box-shadow: 3px 3px 5px #333;
    
	}
	
#left-col {
	background: url(../img/nav_background.jpg);
	height: 580px;
	margin-left: -15px;
	}

#moewen {
	position: fixed;
	top: 30px;
	right: -120px;
	z-index:3;
	}
	
#content {
	height: 580px;
	overflow: auto;
	margin-right: -15px;
	padding-left: -10px;
	}
	
#home_content {
	margin-top: 43px;
	margin-left: -3px;
	}

/* ###############################
2. Text
############################### */

body {
	font-family: Arial, Helvetica, sans-serif;
	color: #333333;
	line-height: 130%;
	}

header hgroup {
	margin-top: 65px;
	margin-left: -15px;
	}

header h1 {
	font-family: Georgia, Times, "Times New Roman", serif;
	color: #fff;
	font-size: 260%;
	font-weight: normal;
	text-shadow: 2px 2px 5px #555;
	}
	
header h1 a {
	color: #fff;
	text-decoration:none;
	}
	
header h1 a:hover {
	color: #F8BC0A;
	}
	
header h2 {
	color: #fff;
	font-size: 140%;
	font-weight: normal;
	text-shadow: 2px 2px 5px #555;
	}

section h1 {
	font-family: Georgia, Times, "Times New Roman", serif;
	color: #7595F9;
	font-weight: normal;
	font-size: 180%;
	margin-top: 35px;
	margin-left: -15px;
	}
	
section h2 {
	margin-left: -15px;
	margin-top: 30px;
	font-size: 130%;
	line-height:120%;
	font-family: Georgia, Times, "Times New Roman", serif;
	font-weight: normal;
	}
	
section p {
	margin-left: -15px;
	}
	
section a {
	color: #7595F9;
	text-decoration:none;
	}
	
a img {
	border:0px;
}
	
section a:hover {
	color: #F8BC0A;
	}
	
#kontakt_right {
	margin-top: -15px;
	}
	
#kontakt_left {
	margin-left: -15px;
	}

/* ###############################
3. Navigation
############################### */

#bottom {
	position: absolute;
	bottom: 0px;
	}

nav ul {
	margin-top: 5px;
	}

nav ul li {
	list-style: none;
	margin-left: -50px;
	margin-right: -7px;
	line-height:45px;
	min-height: 55px;
	background-image: url(../img/line.png);
	}

nav ul li a {
	color: #333;
	text-decoration: none;
	font-size: 115%;
	margin-left: 10px;
	}

nav ul li.last a {
	font-size: 95%;
}

nav ul li a:hover {
	color: #0428A4;
	}

.aktiv {
	color: #0428A4;
	}

/* ###############################
4. Bilder
############################### */

.fancybox img {
	margin-right: 15px;
	margin-bottom: 20px !important;
	}
	
.fancybox {
	border:none;
	}
	
/* ###############################
5. Kontaktformular
############################### */

input, textarea {
	width: 100%;
	margin-bottom: 8px;
	margin-top:5px;
	background-color: #efefef;
	border: 1px solid #CCC;
	}
	
input {
	height: 30px;
	}
	
textarea {
	height: 150px;
	}

input.checkbox {
	height: auto;
	width: auto;
}
	
.button {
	width: 100px;
	}
	
.button:hover {
	background-color: #ccc;
	cursor:pointer;
	}

form {
	margin-top: 15px;
	}

/* ###############################
6. Handy-Optimierung
############################### */	
	
@media only screen and (max-width: 768px) {
	body {
	background: #fff;
	}
	
	header {
	height: auto;
	}
	
	#wrapper {
	height: auto;
	box-shadow: none;
    
	}
	
	#left-col {
	background: #F8BC0A;
	height: auto;
	margin-left: 0px;
	}

	#moewen {
	display: none;
	}
	
	#content {
	height: auto;
	margin:0px;
	margin-bottom: 30px;
	}
	
	header hgroup {
	margin-top: 50px;
	margin-left: 0px;
	margin-bottom:30px;
	}

	header h1 {
	color: #333333;
	font-size: 260%;
	text-shadow: none;
	line-height:110%;
	margin-bottom:0px;
	}
	
	header h1 a {
	color: #333333;
	}
	
	header h1 a:hover {
	color: #F8BC0A;
	}
	
	header h2 {
	color: #333333;
	text-shadow: none;
	}
	
	#bottom {
	position: static;
	}

	.fancybox img {
	height: 85px;
	width: 85px;
	margin-right: 10px;
	margin-bottom: 15px !important;
	}
	
	nav ul li {
	line-height: 50px;
	background-image: none;
	border-bottom: 1px solid #fff;
	}

}