body {
font: 100.01% Arial, serif;
text-align:center;
color:#FFFF66;
margin:0;
padding:0;
background: #01080b url(../images/bg_content.jpg) center top repeat-y;	
}
#main {
max-width:800px;
min-width:500px;
margin:0 auto 50px auto;
}
#header,
#mainNavi,
#content,
#footer {
width:100%;
text-align: left;
}
#header{
padding:330px 0 0 0;
margin:0 0 25px 0;
width:100%;
background-color: transparent;
-webkit-border-bottom-right-radius:5px;
-webkit-border-bottom-left-radius:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-bottomleft:5px;
border-bottom-right-radius:5px;
border-bottom-left-radius:5px;
}
#footer {
padding:20px 0;
margin:0 0 50px 0;
width:100%;
background-color: transparent;
-webkit-border-bottom-right-radius:5px;
-webkit-border-bottom-left-radius:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-bottomleft:5px;
border-bottom-right-radius:5px;
border-bottom-left-radius:5px;
}
#header img {
width: 90%;
padding: 0 0 0 0;
margin: 0 5% 0 5%;
border: 0;

}
#footer {
padding:25px 0;
margin:50px 0 0 0;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
}
#content {
background-color: #171614;
opacity: 0.7;
margin:0;
padding:0px 0;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
-webkit-border-top-left-radius:0px;
-moz-border-radius-topleft:0px;
border-top-left-radius:0px;
}
#content h1{
margin:0 10px;
padding: 10px 5px;
}
#content h1{
	width: 768px;	margin-right: auto;
	margin-left: auto;
	border: 1px solid #424242;
	background: black url(http://www.midwinter-dg.com/blog_demos/css-text-shadows/images/neon.jpg) 0;
	margin-bottom: 10px;
}
#content h1 {
	color: #fff;	text-shadow: 0 0 10px #fff,
                   0 0 20px #fff,
                   0 0 30px #fff,
                   0 0 40px #ff00de,
                   0 0 70px #ff00de,
                   0 0 80px #ff00de,
                   0 0 100px #ff00de,
                   0 0 150px #ff00de;
	letter-spacing: 5px;
	font: 80px 'MisoRegular';
}

#content h2{
margin:0 10px;
padding: 10px 50px;
}
#text {
float: left;
width: 650px;
margin:0 10px;
padding:10px 50px;
}
#content img {
float:left;
margin:0 10px;
padding: 10px 50px;
}
#content h2 {
font:bold 100px/.825 'Yanone Kaffeesatz', arial, serif;
text-shadow: 0 0 20px #fefcc9, 10px -10px 30px #feec85, -20px -20px 40px #ffae34, 20px -40px 50px #ec760c, -20px -60px 60px #cd4606, 0 -80px 70px #973716, 10px -90px 80px #451b0e;
}
#content h2  span{
color:#FFFF66;
font: 26px 'Yanone Kaffeesatz', arial, serif;
display: block;
padding: 10px 0 0 0;
}
#main p {
font-size: 16px;
line-height:20px;
}
#footer p {
font: normal 16px 'Yanone Kaffeesatz', arial, serif;
text-shadow: 1px 1px 1px #6c6c6c;
margin:0;
padding:0;
text-indent:50px;
}
#navi {
text-align:left;	
}
#navi ul {
width:100%;
padding:0;
margin:0;
list-style:none;
}
#navi li {
display:inline-block;
padding:5px 0 0 0;
margin:0 5px 0 0;
font: 100%/2.125 'Yanone Kaffeesatz', Verdana, sans-serif;
}

#navi li a {
display: block;
color:#FFFF66;
text-decoration: none;
padding:0 0 0 5px;
background:#161123;
/* alte webkit-basierte Browser (Safari, Chrome, etc.) */
background: -webkit-gradient(linear, left top, left bottom, from(#848487), to(#3c3c3c));
/* neue webkit-basierte Browser(Safari, Chrome, etc.) */
background: -webkit-linear-gradient(top, #848487, #3c3c3c);
/* Mozilla/Gecko (Firefox, Flock, etc) */
background: -moz-linear-gradient(top, #848487, #3c3c3c);
/* Für Presto (Opera ab Version 11.1) */
background: -o-linear-gradient(top, #848487, #3c3c3c);
/* IE10 Pre-Beta */
background: -ms-linear-gradient(top, #848487, #3c3c3c);
/* aktueller W3C working draft */
background: linear-gradient(top, #848487, #3c3c3c);
}
#navi li#active span,
#navi li a {
-webkit-border-top-right-radius:5px;
-webkit-border-top-left-radius:5px;
-moz-border-radius-topright:5px;
-moz-border-radius-topleft:5px;
border-top-right-radius:5px;
border-top-left-radius:5px;
}
#navi li a:hover,
#navi li a:active,
#navi li a:focus {
outline: none;
text-decoration: underline;
}
#navi li a span {
display:block;
margin:0;
padding:0 15px 0 10px;
}

#navi li#active {
margin:0 5px 0 0;
padding:0;
}
#navi li#active span {
display:block;
margin:0;
padding:7px 15px 0 15px;
color:#2c2c2c;
background:#FFF;
opacity: 0.8;
}

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
/* IE-Patch für IE 7*/
*:first-child+html .clearfix { min-height: 0; }
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


@media only screen and (max-width: 750px) {
#main {
margin:0 auto;
max-width:700px;
min-width:400px;
width:90%;
}
#header,
#footer {
margin:25px auto;
width:100%;
height:auto;
}
#header {
margin-top:0;
}
#content {
padding:10px 0;
}
#content h2,
#content p {
margin:0;
padding:10px 20px;
}
#header h1,
#footer p {
text-indent:20px;
}
#main h1,
#main h2 {
font-size:30px;
line-height: 1.25;
}
#content h1 span {
font-size:18px;
}
}

@media only screen and (max-width: 400px) {
#main {
margin:0 auto;
max-width:400px;
min-width:150px;
width:90%;
}
#navi ul {
float:none;
width:100%;
padding:0;
}
#navi li,
#navi li#active span,
#navi li a,
#navi li a span {
float:none;
width:100%;
}
#navi ul li {
padding:0;
}
#content h2,
#content p {
margin:0;
padding:10px;
}
#header,
#footer {
padding:5px 0;
}
#header h1,
#footer p {
text-indent:10px;
}
#header h1 {
line-height:.66;
}
#navi li a,
#navi li#active {
height:27px;
text-align: left;
margin:0;
padding:0;
text-indent:10px;
-webkit-border-radius:0px;
-moz-border-radius:0px;
border-radius:0px;
}
	#navi li a,
	#navi li a span,
	#navi li#active span {
		padding:0;
	}
	#content,
	#navi li#active span,
	#navi li a {
		-webkit-border-top-right-radius:0px;
		-webkit-border-top-left-radius:0px;
		-moz-border-radius-topright:0px;
		-moz-border-radius-topleft:0px;
		border-top-right-radius:0px;
		border-top-left-radius:0px;
	}
	#navi li:first-child a,
	#navi li#active:first-child span {
		-webkit-border-top-right-radius:5px;
		-webkit-border-top-left-radius:5px;
		-moz-border-radius-topright:5px;
		-moz-border-radius-topleft:5px;
		border-top-right-radius:5px;
		border-top-left-radius:5px;
	}
}


#galerie li
{
list-style-type: none;
float: left;
margin: 0 10px 10px 0;
text-align: center;
font-weight: bold;
position: relative;
}

#galerie img
{
width: 150px;
height: 100px;
display: block;
padding: 3px;
border: 1px solid #FFFF66;
} 

#galerie a .gross
{
display: none;
}

#galerie a:hover .gross
{
width: 450px;
height: 300px;
display: block;
position: absolute;
top: -100px;
left: -150px;
z-index: 1;
background: #161123;
}

.stitched {
padding: 20px;
margin: 10px;
background: #171614;
opacity: 0.7;
color: #FDD017;
font-size: 21px;
font-weight: bold;
line-height: 1.3em;
border: 2px dashed #FFF;
border-radius: 10px;
box-shadow: 0 0 0 4px #4169e1, 2px 1px 6px 4px rgba(10, 10, 0, 0.5);
font-weight: normal;
}

body {
padding: 10px;
}
/* Reset */
html, body, div, span, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, a, font, img, ul, li {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}body {
	line-height: 1;
}
ul {
	list-style-type:none;
}
body {
	background:url(bg.jpg) repeat scroll 0 0;
}#container {
	width:520px;
	margin:0 auto;
	padding-top:30px;

}
.paper {
	position:relative;
	width:400px;
	height:380px;
	background-color:#faf8e5;
	border:1px solid #e3e3e3;
}
.red-line {
	height:380px;
	width:1px;
	background-color:#ef8b8b;
	float:left;
	margin-left:4px;
}
.first {
	margin-left:40px;
}
ul#lines {
	margin-top:40px;
}
ul#lines li {
	height:28px;
	line-height:28px;
	color:#4d84c8;
	font-family:Georgia;
	font-style:italic;
	font-size:16px;
	width:225px;
	border-top:1px solid #f2f0df;
	padding-left:75px;
}
.tape{
	position:absolute;
	top:-15px; right:80px;
	width: 130px;
	height: 35px;
	background-color:#fff;
	opacity:0.6;
	border-left: 1px dashed rgba(0, 0, 0, 0.1);
	border-right: 1px dashed rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 0px 0px 1px 0px #cccccc;
	-moz-box-shadow: 0px 0px 1px 0px #cccccc;
	box-shadow: 0px 0px 1px 0px #cccccc;
	-webkit-transform: rotate(-2deg) skew(0,0) translate(0%,-5px);
	-moz-transform: rotate(-2deg) skew(0,0) translate(0%,-5px);
	-o-transform: rotate(-2deg) skew(0,0) translate(0%,-5px);
	transform: rotate(-2deg) skew(0,0) translate(0%,-5px);
}
.left-shadow{
	width: 140px;
	height: 140px;
	bottom:-5px; left:-12px;
	position:absolute;
	z-index:-6;
	display: inline-block;
	-webkit-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.4);
	box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.4);
	-moz-transform: scale(1) rotate(274deg) translate(20px, 25px) skew(9deg, 0deg);
	-webkit-transform: scale(1) rotate(274deg) translate(20px, 25px) skew(9deg, 0deg);
	-o-transform: scale(1) rotate(274deg) translate(20px, 25px) skew(9deg, 0deg);
	-ms-transform: scale(1) rotate(274deg) translate(20px, 25px) skew(9deg, 0deg);
	transform: scale(1) rotate(274deg) translate(20px, 25px) skew(9deg, 0deg);
}
.right-shadow{
	width: 140px;
	height: 140px;
	bottom:-13px; right:-4px;
	position:absolute;
	z-index:-6;
	display: inline-block;
	-webkit-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.4);
	box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.4);
	-moz-transform: scale(1) rotate(184deg) translate(20px, 25px) skew(9deg, 0deg);
	-webkit-transform: scale(1) rotate(184deg) translate(20px, 25px) skew(9deg, 0deg);
	-o-transform: scale(1) rotate(184deg) translate(20px, 25px) skew(9deg, 0deg);
	-ms-transform: scale(1) rotate(184deg) translate(20px, 25px) skew(9deg, 0deg);
	transform: scale(1) rotate(184deg) translate(20px, 25px) skew(9deg, 0deg);
}

a.email {
  background-image: url(email.gif);
  padding-right: 20px;
  background-repeat: no-repeat;
  background-position: right;
}

.smart-green {
    margin-left:auto;
    margin-right:auto;

    max-width: 500px;
    background: #F8F8F8;
    padding: 30px 30px 20px 30px;
    font: 12px Arial, Helvetica, sans-serif;
    color: #666;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
.smart-green h1 {
    font: 24px "Trebuchet MS", Arial, Helvetica, sans-serif;
    padding: 20px 0px 20px 40px;
    display: block;
    margin: -30px -30px 10px -30px;
    color: #FFF;
    background: #9DC45F;
    text-shadow: 1px 1px 1px #949494;
    border-radius: 5px 5px 0px 0px;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    border-bottom:1px solid #89AF4C;

}
.smart-green h1>span {
    display: block;
    font-size: 11px;
    color: #FFF;
}

.smart-green label {
    display: block;
    margin: 0px 0px 5px;
}
.smart-green label>span {
    float: left;
    margin-top: 10px;
    color: #5E5E5E;
}
.smart-green input[type="text"], .smart-green input[type="email"], .smart-green textarea, .smart-green select {
    color: #555;
    height: 30px;
    line-height:15px;
    width: 100%;
    padding: 0px 0px 0px 10px;
    margin-top: 2px;
    border: 1px solid #E5E5E5;
    background: #FBFBFB;
    outline: 0;
    -webkit-box-shadow: inset 1px 1px 2px rgba(238, 238, 238, 0.2);
    box-shadow: inset 1px 1px 2px rgba(238, 238, 238, 0.2);
    font: normal 14px/14px Arial, Helvetica, sans-serif;
}
.smart-green textarea{
    height:100px;
    padding-top: 10px;
}
.smart-green select {
    background: url('down-arrow.png') no-repeat right, -moz-linear-gradient(top, #FBFBFB 0%, #E9E9E9 100%);
    background: url('down-arrow.png') no-repeat right, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FBFBFB), color-stop(100%,#E9E9E9));
   appearance:none;
    -webkit-appearance:none;
   -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    width:100%;
    height:30px;
}
.smart-green .button {
    background-color: #9DC45F;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-border-radius: 5px;
    border: none;
    padding: 10px 25px 10px 25px;
    color: #FFF;
    text-shadow: 1px 1px 1px #949494;
}
.smart-green .button:hover {
    background-color:#80A24A;
}