@charset "utf-8";
/* CSS Document */

/*RESET*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	font-family: 'Alegreya Sans',sans-serif, Arial, Helvetica, sans-serif;
	vertical-align: baseline;
	color:#333;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

a{
text-decoration:none;
color:black;
}

a:hover{
color:#666;
}
/*RESET*/

body{
	background:url(../images/tweed.png);
}

#wrapper{
width:1080px;
height:100%;
margin:10px auto;
border-top:20px solid #333;
background:white url(../images/ungstein_grau.jpg) right repeat-y;
-webkit-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.50);
-moz-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.50);
box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.50);
}

#spacer{
width:100%;
height:10px;
}

#header{
position:fixed;
top:0;
width:100%;
height:50px;
margin:0;
background:white;
z-index:998;
}

#logo{
position:fixed;
top:10px;
left:2%;
width:300px;
height:150px;
z-index:999;
}

#navi{
width:auto;
height:50px;
float:right;
}

#navi ul{
font-size:85%;
}

#navi ul li{
display:block;
margin:0 10px;
padding-left:12px;
line-height:50px;
background:url(../images/reddot.png) left no-repeat;
float:left;
}

#navi ul li:hover{
margin-top:2px;
}

#navi ul li:last-child a{
	margin-right:20px;
}

/*#navi ul li:last-child a{
background:#CC0000;
color:white;
margin:0 10px;
padding:10px;
}*/

#picture{
width:1080px;
height:100%;
}

#picture img{
width:1080px;
}

#spacer{
width:1080px;
height:100px;
}

#content{
width:1080px;
}

#kontakthead{
width:300px;
height:30px;
margin-bottom:30px;
text-align:center;
color:white;
line-height:30px;
background-color:red;
}

#leftcontent{
width:720px;
padding-bottom:30px;
float:left;
}



#leftcontent p img{
	margin:5px;
	padding:2px;
	width:130px;
	border:1px solid silver;
}

#text{
	width:600px;
	margin:0 auto;
	padding:30px 0;
}

#text li{
	list-style-image:url(../images/reddot.png);
	list-style-position:inside;
}

#contenthead{
background:#333;
height:30px;
width:780px;
}

#rightcontent{
text-align:center;
background:#e1e1e1;
width:300px;
padding-bottom:30px;
float:right;
}

#rightcontent img{
	margin:20px auto;
}

#content ul{
margin:0;
font-size:100%;
line-height:1.5em;
}

.work{
width:250px;
height:175px;
margin:20px;
float:left;
}

.worktop{
height:35px;
width:250px;
background:#ccc;
}

.workbottom{
height:156px;
width:250px;
}

.workbottom img{
	width:250px;
}

#contact{
width:1080px;
background:white;
}

#innercontact{
width:1080px;
margin:0 auto;
padding:50px 0 70px 0;
text-align:center;
}

#innercontact p,#innercontact h1{
color:#999;
}

#footer{
width:1080px;
height:30px;
background:#333;
}

#innerfooter{
width:1080px;
margin:0 auto;
text-align:center;
}

#innerfooter p{
color:silver;
font-size:85%;
line-height:30px;
}

#innerfooter a{
	color:silver;
}

#innerfooter a:hover{
	color:gray;
}
.clear{
clear:both;
}

/*FONTS*/

h1{
font-size:200%;
line-height:2em;
}

h2{
font-size:150%;
margin-left:15px;
margin-top:20px;
line-height:35px;
}

h3{
font-size:130%;
line-height:35px;
margin-top:10px;
}

b{font-weight:bold; line-height:1.6em;}

p{
font-size:100%;
line-height:1.5em;
}

#rightcontent p{
	text-align:center;
	font-size:85%;
	color:#333;
}

/*
@media screen and (max-width : 1010px){
#content{width:850px; text-align:center;}
#leftcontent{display:none; float:none;}
#rightcontent{float:none; margin:0 auto;}
#rightcontent p, ul, #rightcontent h1{text-align:left;}
#innercontact{width:100%;}
#innercontact h1{text-align:center;}
.work{margin:10px;}
#navi{display:none;}
#header{text-align:center;}
#logo{float:none; margin:0 auto;}
}

@media screen and (max-width : 850px){
#content{width:100%; text-align:center;}
#content ul{margin-left:0;}
#innerfooter{width:100%;}
.work{float:none; margin:0 auto;}
h1,p{margin:0;}
}

@media screen and (max-width : 500px){
.work{width:320px;}
.worktop{width:320px;}
.workbottom{width:320px;}
.work img{width:320px;}
#rightcontent{width:95%; padding:0 auto;}
#innerfooter p{font-size:75%;}
p{font-size:100%;}
h1{font-size:150%;}
h2{font-size:150%;}
}
*/