
/*Resets*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, 
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 
img, ins, q, small, strong, sub, sup, dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, 
article, aside, figure, figcaption, hgroup, footer, header, nav, section {
margin: 0;
padding: 0;
border: 0;
}

article, aside, figure, figure img, figcaption, hgroup,
footer, header, nav, section {
display: block;
}

ul { list-style:none; }

ol { list-style-type: decimal; }

a img {border: 0;}

input, select { vertical-align:middle; }

body { font:13px/1.231 sans-serif; *font-size:small; }

figure {position: relative;}

figure img, object, embed {
max-width: 100%;
}

a
{
text-decoration: none;
color:#000;
}

a:hover, #filter a:focus
{
text-decoration:underline;
}

a:focus
{
outline: none;
}

:focus
{
outline: none;
}

::-moz-focus-inner
{
border: 0
}

::selection 	 {background: rgb(188,255,0); color:#000; text-shadow: none;}

::-moz-selection {background: rgb(188,255,0); color:#000; text-shadow: none;}

select, input, textarea, button { font:99% sans-serif; }

pre, code, kbd, samp { font-family: monospace, sans-serif; }

body, select, input, textarea { 
color: #444; 
font-family: Arial, sans-serif;
}

nav ul, nav li { margin: 0; } 

textarea { overflow: auto; }

input[type="radio"] { vertical-align: text-bottom; }

input[type="checkbox"] { vertical-align: bottom; }

label, input[type=button], input[type=submit], button { cursor: pointer; }

button, input, select, textarea { margin: 0; }


/*	Typography presets*/
.small {
font-size: 9px;
} 

.normal, body {
font-size: 12px;
line-height:1.62;
}	

.big, h3 {
font-size: 18px;
line-height:1.38;
}

.large, h2 {
font-size: 26px;
line-height:1.14;
}

.huge, h1 {
font-size: 36px;
line-height:1.05;
}


@font-face
{
font-family: 'Journal Regular';
src: url('journal.eot#') format('embedded-opentype'), 
		url('journal.woff') format('woff'), 
		url('journal.ttf') format('truetype'), 
		url('journal.svg#webfont3lGqYzYA') format('svg');
font-weight: normal;
font-style: normal;
font-variant: normal;
}

@font-face {
font-family: 'Sansumi Regular';
src: url('Sansumi-Bold.eot#') format('embedded-opentype'), 
		url('Sansumi-Bold.woff') format('woff'), 
		url('Sansumi-Bold.ttf') format('truetype'), 
		url('Sansumi-Bold.svg#webfont6izVs1DN') format('svg');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'Sansumi Bold';
src: url('Sansumi-ExtraBold.eot#') format('embedded-opentype'), 
		url('Sansumi-ExtraBold.woff') format('woff'), 
		url('Sansumi-ExtraBold.ttf') format('truetype'), 
		url('Sansumi-ExtraBold.svg#webfonthd9o1C15') format('svg');
font-weight: normal;
font-style: normal;
}

.col1, .col2,.col3, p {
margin-top: 1.62em;
margin-bottom: 1.62em 
}

.margin{
margin-top: 40px;
}

.sansumi
{
font-family:'Sansumi Regular';
}

.bold
{
font-family:'Sansumi Bold';
letter-spacing:1px;
cursor:default;
}

.bold, h1.large, .italic
{
    cursor:default;}


.italic
{
margin: -15px 0 0 108px;
color:#616161;
font: 24px Arial, sans-serif;
font-style: italic;
}

.inline
{
display:inline;
}

.inline:link
{
color:#f00;
}


/*	Default 13-column layout*/

body {
background: url('../images/bg.png') repeat #ffffff;	

height:100%;
width: 1068px;
margin: 0 auto;
position: relative;
text-shadow: rgba(0,0,0,.01) 0 0 1px;
overflow-x:hidden;
-webkit-tap-highlight-color: rgb(188,255,0);
}

.line
{
position:absolute;

height:20px;
background:url('../images/Linie2-neu.png') no-repeat;
width:1068px;
border-bottom:1px solid #333;
border-right:1px solid #333;
margin: auto;
z-index:7;
}



/* Header */
header
{
position:relative;
float:left;
width:250px;
height:360px;
margin-right:24px;
z-index:6;
}

.logo, .mainnav, .html5
{
position:fixed;
}

.logo
{
width:250px;
top:42px;
}

.mainnav
{
top:200px;
}

.mainnav a
{
display:block;
font-family: sans-serif;
height:25px;
width:120px;
font-size: 12px;
font-weight: bold;
font-family: futura !important, sans-serif;
line-height:25px;
padding-left:7px;
padding-bottom: 5px;
margin-bottom:9px;
background: #E9E9E9;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 0 2px 4px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.5);
box-shadow: 0 2px 4px rgba(0,0,0,0.5);
behavior: url(PIE.htc);
}

.mainnav a:hover, .mainnav a:focus
{
color: #FF9900;
text-decoration:none;
}

.current
{
background:#0D0D0D!important;
color: #FF9900;
}

.current:hover, .current:focus
{
color: #FF9900!important;
cursor:default;
}

.html5
{
bottom:36px;
}

/* Content */


#main
{
position:relative;
float:left;
width:74.26%;
bottom:0;
top:0;
} 

.text-img
{
display:none;
}

#wir, #work, #work2, #contact, #contact2
{
visibility: hidden;
clear:both;
display:block;
height: 95px;
}


.start
{
height:300px;
}

.wir
{
height:900px;
}

.work
{
height:100px;
}

.work2
{
height:1000px;
}


.contact
{
height:200px;
}

.contact2
{
height:100px;
}

h1.large
{
text-shadow:0 1px 0 #FFFFFF;
}

.hr
{
clear:both;
display:block;
border:0;
background:url('../images/Linie1-neu.png')  repeat-x;
border-bottom:1px solid #fff;
border-right:1px solid #fff;
height:21px;
margin-top: 400px;
margin-bottom: 200px;
padding:0px 0;
}

.hr-L
{
clear:both;
display:block;
border:0;
background:url('../images/Linie1-neu.png')  repeat-x;
border-bottom:1px solid #fff;
border-right:1px solid #fff;
height:21px;
margin-top: 50px;
margin-bottom: 200px;
padding:0px 0;
}

.hr-K
{
clear:both;
display:block;
border:0;
background:url('../images/Linie1-neu.png')  repeat-x;
border-bottom:1px solid #fff;
border-right:1px solid #fff;
height:21px;
margin-top: 100px;
margin-bottom: 200px;
padding:0px 0;
}

.hr-I
{
clear:both;
display:block;
border:0;
background:url('../images/Linie1-neu.png')  repeat-x;
border-bottom:1px solid #fff;
border-right:1px solid #fff;
height:21px;
margin-top: 100px;
margin-bottom: 300px;
padding:0px 0;
}


.col1
{
width:350px;
margin-top: 0px;
margin-left: 0px;
margin-right:50px;
margin-bottom: 20px;
float:left;
}

.col11
{
width:350px;
margin-top: 0px;
margin-left: 0px;
margin-right:6px;
margin-bottom: 20px;
float:left;
}


.col2, .col2 p
{
width:350px;
margin-top: 0px;
margin-left: 0px;
margin-right:50px;
margin-bottom: 0px;
float:left;
}

.col22 
{
width:350px;
margin-top: -20px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 20px;
float:left;
}

.col3
{
width:350px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}


.slide
{
margin-top:105px;
}

.slide img
{
border:1px solid #777;
border-top-color:#f7f7f7;
-moz-box-shadow:0 0 5px 0px rgba(35,35,35,0.8);
-webkit-box-shadow: 0 0 5px  0px rgba(35,35,35,0.8);
box-shadow: 0 0 5px 0px rgba(35,35,35,0.8);
behavior: url(PIE.htc);
}

.default:hover
{
cursor:default;
}


/*Wir*/

.uns 
{
margin-top: -25px;
margin-left: 15px;
font-size: 18px !important;
font-weight: bold;
}



.quad
{
margin-top:50px;
}

.quad2
{
margin-top:10px;
}

/*Leistungen*/

.Leistung{
font-size: 18px !important;
font-weight: bold;
color: #444;
}


.col-L1
{
width:550px;
margin-top: 20px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}

.col-L2, .col-L3, .col-L4, .col-L5
{
width: 550px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}


#filter
{
margin:1.62em;
font-size:11px;
margin-top:20px;
margin-left:0;
height:21px;
clear:both;
}

#filter li {
margin-top: 10px;
float:none;
}

#filter a {
padding: 1px 10px 2px 0;
color: #444;
}

#filter2
{
margin:1.62em;
font-size:11px;
margin-top:20px;
margin-left:0;
height:21px;
clear:both;
}

#filter2 li {
margin-top: 10px;
float:none;
}

#filter2 a {
padding: 1px 10px 2px 0;
color: #444;
}

/*Mason*/

#Leistung
{
margin-top: 230px;
}

#Kompetenz
{
margin-top: 30px;
}


.img-container
{
display:none;
margin-bottom:13px;
margin-right: 10px;
background: #E9E9E9;
float: left;
width: 330px;
position:absolute;   
-moz-box-shadow:0 4px 6px -2px rgba(0,0,0,0.8);
-webkit-box-shadow: 0 4px 6px -2px rgba(0,0,0,0.8);
box-shadow: 0 4px 6px -2px rgba(0,0,0,0.8);
behavior: url(PIE.htc);
}

.img-container2
{
display:none;
margin-bottom:13px;
background: #E9E9E9;
float:left;

position:absolute;   
-moz-box-shadow:0 4px 6px -2px rgba(0,0,0,0.8);
-webkit-box-shadow: 0 4px 6px -2px rgba(0,0,0,0.8);
box-shadow: 0 4px 6px -2px rgba(0,0,0,0.8);
behavior: url(PIE.htc);
}


.img-container:hover
{
-moz-box-shadow:0 6px 8px -2px rgba(35,35,35,0.8);
-webkit-box-shadow: 0 6px 8px -2px rgba(35,35,35,0.8);
box-shadow: 0 6px 8px -2px rgba(35,35,35,0.8);
behavior: url(PIE.htc);
}

.box
{
position:relative;
overflow: hidden;
display: block;
width: 330px;
text-indent: -9999px;
border-top: solid 1px #fff;
}

.picTitle
{
background: url('../images/btn.png');

display: block;
float: left;
font-size: 14px;
font-weight: bold;

text-decoration: none;
color: #FFF;
top: 2.5px;
left: 0.5px;
position: absolute;
z-index: 1;
padding: 3px 8px;
max-width: 327px !important;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
behavior: url(PIE.htc);
}

.leist 
{
margin-top: 55px;
margin-left: 10px;
font-size: 16px !important;
font-weight: bold;
}

.leist2 
{
margin-top: -20px;
margin-left: 10px;
font-size: 12px !important;
font-weight: normal;
}

.leist3 
{
margin-top: 5px;
margin-left: 10px;
font-size: 16px !important;
font-weight: bold;
}


.quad-L1
{
margin-top: -140px;
margin-left: 10px;
}

.quad-L2
{
margin-top:10px;
}



/*File Types*/

.a3
{
height: 300px
}

.postal
{
height: 133px
}

.cd
{
height:187px;
border:none;
}


.photo
{
height: 225px
}

.hor
{
height: 150px
}


.video
{
height: 113px
}

.wall
{
height: 125px
}

.square
{
height: 200px
}

.poster
{
height: 283px
}

.stock
{
height: 301px
}

.pro
{
height: 150px
}

/*Kompetenzen*/



#komp{
margin-top: 50px;
}

#komp2{
margin-top: 70px;
}


.komp 
{
margin-top: -30px;
margin-left: 25px;
padding-top: 0px;
font-size: 14px !important;
}



.quad-K1
{

margin-left: 10px;
padding-bottom: 8px;
}

ol
{
font-weight: bold;
margin-left: 50px;
width:400px;
}

ol li
{
margin-bottom: 13px;
}

ol span
{
font-weight: normal;
}




/*Contact*/

.contact-head1
{
width:350px;
font-family: futura, sans-serif;
font-size: 14px;
font-weight: bold;
color: #616161;
margin-top: 20px;
margin-left: 0px;
margin-right:50px;
margin-bottom: 80px;
float:left;
}

.contact-head2
{

font-family: futura, sans-serif;
font-size: 20px;
font-weight: bold;
color: #616161;
}

.contact-head3
{
margin-left: 10px;
letter-spacing: 1px;
}
.contact-head4
{
margin-left: 30px;
letter-spacing: 1px;
}
.contact-head5
{
margin-left: 20px;
letter-spacing: 1px;
}


/*Contact Form1*/

#contact-area {

	width: 300px;
        margin-top: 30px;
	float: right;
}

#contact-area input, #contact-area textarea {
	padding: 3px;
	width: 300px;
	font-family: Helvetica, sans-serif;
	font-size: 1em;
	margin: 0px 0px 5px 0px;
	border: 1px solid #ccc;
}

#contact-area textarea {
	height: 70px;

}

#contact-area textarea:focus, #contact-area input:focus {
	border: 1px solid #000;
}

#contact-area input.submit-button {
	width: 70px;
	float: right;
}

label {
	float: left;
	text-align: left;
	margin-bottom: 5px;
	width: 100px;
	padding-top: 5px;
	font-size: 1em;
}

/*Contact-Pics*/

.con-img
{width:250px;
margin-top:70px;
margin-left: 0px;
}

.con-img2
{width:250px;
margin-top:70px;
margin-left: 270px;
}

.con-img3
{width:250px;
margin-top:70px;
margin-left: 540px;
}

.con-box
{
position:relative;
overflow: hidden;
display: block;
width: 250px;
height: 170px;
text-indent: -9999px;
border-top: solid 1px #fff;
}


/*Contact Form*/

.conForm
{ 
position:relative;
margin-top: 30px;
float: right;
width:312px;}

#form
{	
float:right;
padding-top:18px;
padding-right:60px;
cursor: default;
font-size:10px;
}

#form div
{
clear: both;
position: relative;
margin: 0 0 10px;

}

.slider label
{
color: #333;
position: absolute;
top: 3px;
left: 10px;
z-index: 99;    
cursor: pointer;
font-family:'Sansumi Regular';
}


input[type="text"], textarea
{
background-color: #fff;
width: 266px;
height:21px;
font-size:11px;
border: 1px solid #aaa;
padding: 1px 5px 0;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;    
border-radius: 2px;
-moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.2) inset;
-webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.2) inset;
box-shadow: 0px 2px 2px rgba(0,0,0,0.2) inset;
behavior: url(PIE.htc);
}

textarea
{
padding-top:5px;
height: 84px;
resize: none;
overflow:auto;
}

input[type="text"]:focus, textarea:focus
{
border-color: #777
}


.border-bottom
{
background:#fff;
background-color: rgba(255,255,255,0.8);
filter: alpha(opacity = 80);
display: block;
height: 1px;
position: relative;
width: inherit;
}

.minus
{
margin-top:-2px;
}


/*Submit button*/

#btn
{
color: #FFF;
padding: 5px 7px 4px;
border: none;
border-bottom: 1px solid #164475;
position: relative;
cursor: pointer;    
float: right;
text-transform:uppercase;
background: #3A9CEE; /* old browsers */
background: -moz-linear-gradient(top, #3A9CEE 2%, #1C8DE9 35%, #005FA6 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(2%,#3A9CEE), color-stop(35%,#1C8DE9), color-stop(100%,#005FA6)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3A9CEE', endColorstr='#005FA6',GradientType=0 ); /* ie */
text-shadow: 0 -1px 0 #17589b;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.5);
-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.5);
box-shadow: 0px 1px 2px rgba(0,0,0,0.5);
behavior: url(PIE.htc);
}

#btn:hover, #btn:focus
{
background: #4096ee;
background: -moz-linear-gradient(top, #4096ee 0%, #4096ee 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4096ee), color-stop(100%,#4096ee));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4096ee', endColorstr='#4096ee',GradientType=0 ); 
}

#btn:active
{
top: 1px;
background: #7abcff; 
background: -moz-linear-gradient(top, #7abcff 0%, #60abf8 44%, #4096ee 100%); 
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7abcff), color-stop(44%,#60abf8), color-stop(100%,#4096ee)); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7abcff', endColorstr='#4096ee',GradientType=0 ); 
}

#this
{
display:block;
position:fixed;
bottom:0;
right:5px;
z-index:999;
padding-top:23px;
padding-bottom:4px;
}

#this:hover
{
text-decoration:none;
}

footer
{
width:100%;
text-align: center;
cursor: default;
height:42px;
position:fixed;
left:0;
bottom:0;
z-index:998;
}

#foot
{
position:relative;
top:11px;
font-size: 12px;
color: #fff;
padding: 6px 18px 7px;
background:#0d0d0d;
-webkit-border-radius: 5px;
-moz-border-radius: 2px;
border-radius: 5px;
-moz-box-shadow: 0 4px 4px -2px rgba(0,0,0,0.8);
-webkit-box-shadow: 0 4px 4px -2px rgba(0,0,0,0.8);
box-shadow: 0 4px 4px -2px rgba(0,0,0,0.8);
}

/*Imprint*/

.col-imp1
{
width:230px;
margin-top: 20px;
margin-left: 0px;
margin-right:20px;
margin-bottom: 20px;
float:left;
}

.col-imp2
{
width:230px;
margin-top: 20px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 20px;
float:left;
}

.col-imp3
{
width:200px;
margin-top: 20px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 20px;
float:left;
}


.imprint-head1
{
width:700px;
font-family: futura, sans-serif;
font-size: 12px;
font-weight: normal;
color: #616161;
margin-top: 20px;
margin-left: 0px;
margin-right:50px;
margin-bottom: 20px;
float:left;
}

.imprint-head2
{

font-family: futura, sans-serif;
font-size: 14px;
font-weight: bold;
color: #616161;
}

.imprint-head3
{
margin-left: 10px;
letter-spacing: 1px;
}
.imprint-head4
{
margin-left: 30px;
letter-spacing: 1px;
}
.imprint-head5
{
margin-left: 20px;
letter-spacing: 1px;
}




/*8-column layout*/

@media only screen and (max-width: 1152px) and (min-width:768px){

body {
padding: 0 60px;
width: 648px;
}

.line
{
width:1152px;
margin-left: -240px;
}

header-org
{
width:250px;
margin-right:0;
height: 250px;
}

header
{
width:655px;
margin-left:-27px;
padding-left:27px;
position:fixed;
height:195px;
background:url('../images/bg.png');
}

#main
{
width:75%;
margin-left:25%;
margin-top:-280px;
} 

#wir, #work, #work2, #contact, #contact2
{
visibility: hidden;
clear:both;
display:block;
height: 200px;
}



.start
{
height:100px;
}


.work2
{
height:1500px;
}

.slide
{
margin:0 auto;
margin-top:480px;
}



h1
{
font-size:34px;
}	

.italic
{
margin: -15px 0 0 85px;
}

.col1
{
width:490px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: -15px;
float:left;
}

.col11
{
width:490px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}


.col2, .col2 p
{
width:490px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}

.col22 
{
width:490px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 20px;
float:left;
}

.col3
{
width:490px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}


.start, .start
{
margin-left:0em;
}

.margin, .col3
{
margin-bottom:1.62em;
}

.col3, ol
{
width:300px;
}



.Leistung{

margin-left:10px;
font-size: 16px !important;
font-weight: bold; 
}

.img-container
{
display:none;
margin-bottom:13px;
margin-left:10px;
background: #E9E9E9;
float: left;
width: 450px;
position:absolute;   
-moz-box-shadow:0 4px 6px -2px rgba(0,0,0,0.8);
-webkit-box-shadow: 0 4px 6px -2px rgba(0,0,0,0.8);
box-shadow: 0 4px 6px -2px rgba(0,0,0,0.8);
behavior: url(PIE.htc);
}



#Kompetenz{
    margin-left: 10px;
}

ol li
{
margin-bottom:7px;
}

ul#social
{
margin:0 0 0 30px;
}


.contact
{
height:500px;
}

#contact-area {

	width: 500px;
        float: left;
	margin:-60px auto;
}

#contact-area input, #contact-area textarea {
	padding: 3px;
	width: 470px;
	font-family: Helvetica, sans-serif;
	font-size: 1em;
	margin: 0px 0px 5px 0px;
	border: 1px solid #ccc;
}

#contact-area textarea {
	height: 70px;

}

#contact-area textarea:focus, #contact-area input:focus {
	border: 1px solid #000;
}

#contact-area input.submit-button {
	width: 70px;
	float: left;
}

label {
	float: left;
	text-align: left;
	margin-bottom: 5px;
	width: 100px;
	padding-top: 5px;
	font-size: 1em;
}

/*Contact-Pics*/

.con-img
{width:230px;
margin-top:670px;
margin-left: 0px;
}

.con-img2
{display: none;
width:230px;
margin-top:370px;
margin-left: 270px;
}

.con-img3
{width:230px;
margin-top:670px;
margin-left: 250px;
}

.con-box
{
position:relative;
overflow: hidden;
display: block;
width: 230px;
height: 170px;
text-indent: -9999px;
border-top: solid 1px #fff;
}



.conForm
{
float:none;
margin:0 auto;
}

#form
{
padding-right:80px;
}


/*Imprint*/

.col-imp1
{
width:300px;
margin-top: 20px;
margin-left: 0px;
margin-right:50px;
margin-bottom: 0px;
float:left;
}

.col-imp2
{
width:200px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}

.col-imp3
{
width:200px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}


.imprint-head1
{
width:450px;
font-family: futura, sans-serif;
font-size: 12px;
font-weight: normal;
color: #616161;
margin-top: 20px;
margin-left: 0px;
margin-right:50px;
margin-bottom: 20px;
float:left;
}


}


/*5-column layout*/

@media only screen and (max-width: 767px) and (min-width: 480px) {

body {
padding: 0 42px;
width: 396px;
-webkit-text-size-adjust: 100%;
}

.line
{
width:767px;
margin-left: -135px;
}

h1
{
font-size:34px;
}	

.large, .italic
{
font-size:21px;
}

.italic
{
margin:-7px 0 0 50px;
}


header, #main, .container
{
width:inherit;
margin:0 auto;
}

header
{
width:454px;
margin-left:-27px;
padding-left:27px;
position:fixed;
height:250px;
background:url('../images/bg.png');
}

.logo, .mainnav
{
position:relative;
margin:0 auto;
}

.logo
{
margin:0 65px;
top:31px;
}

.mainnav
{
top:48px;
}

.mainnav li
{
float:left;
}

.mainnav a
{
width:130px;
padding-left:3px;
padding-right:3px;
margin-right:3px;
left:0px;
}

.start
{
height:100px;
}


.slide
{
margin:0 auto;
margin-top:280px;
}

#main
{
margin-left: 10px;
}

#wir, #work, #work2, #contact, #contact2
{
visibility: hidden;
clear:both;
display:block;
height: 270px;
}

.uns 
{
margin-top: -22px;
margin-left: 15px;
font-size: 14px !important;
font-weight: bold;
}

	

.col1
{
width:390px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: -15px;
float:left;
}

.col11
{
width:390px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}


.col2, .col2 p
{
width:390px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}

.col22 
{
width:390px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 20px;
float:left;
}

.col3
{
width:390px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}


.margin
{
margin-bottom:1.62em;
margin-top:0!important;
}

.col3
{
margin-bottom:10.5px;
}

.col1, .def, #graph ul.stats
{
margin-top:10.5px;
}

p
{
margin-top:10.5px;
margin-bottom:10.5px;
}


.img-container
{
display:none;
margin-bottom:20px;
margin-left:5px;
background: #E9E9E9;
float: left;
width: 390px;
position:absolute;   
-moz-box-shadow:0 4px 6px -2px rgba(0,0,0,0.8);
-webkit-box-shadow: 0 4px 6px -2px rgba(0,0,0,0.8);
box-shadow: 0 4px 6px -2px rgba(0,0,0,0.8);
behavior: url(PIE.htc);
}


.Leistung{
font-size: 15px !important;
font-weight: bold; 
}

.leist 
{
margin-top: 55px;
margin-left: 10px;
font-size: 14px !important;
font-weight: bold;
}

.leist2 
{
margin-top: 10px;
margin-left: 10px;
font-size: 12px !important;
font-weight: normal;
}

.leist3 
{
margin-top: 20px;
margin-left: 10px;
font-size: 14px !important;
font-weight: bold;
}

#filter
{
width:inherit;
margin:10.5px auto;
font-size:11px;
height:21px;
}

.mason
{width:450px;
margin-left:-12px;
}


.work2
{
height:1350px;
}

.col3, ol
{
width:230px;
}

.def
{
font-size:16px;
font-weight:bold;
}

.pron
{
font-size:14px;
font-weight:normal;
}

.me
{
margin-right:-7px;
}

ol li
{
margin-bottom:5px;
}


#tooltip {
margin-top:-15px;
margin-left:-93px;
}


ul#social
{
margin:10.5px 0 0 30px;
}


#contact-area {

	width: 390px;
        float: left;
	margin: auto;
}

#contact-area input, #contact-area textarea {
	padding: 3px;
	width: 390px;
	font-family: Helvetica, sans-serif;
	font-size: 1em;
	margin: 0px 0px 5px 0px;
	border: 1px solid #ccc;
}

#contact-area textarea {
	height: 70px;

}

#contact-area textarea:focus, #contact-area input:focus {
	border: 1px solid #000;
}

#contact-area input.submit-button {
	width: 70px;
	float: left;
}

label {
	float: left;
	text-align: left;
	margin-bottom: 5px;
	width: 100px;
	padding-top: 5px;
	font-size: 1em;
}

/*Contact-Pics*/

.con-img
{width:250px;
margin:670px auto;
}

.con-img2
{display: none;
width:250px;
margin-top:370px;
margin-left: 270px;
}

.con-img3
{width:250px;
margin:860px auto;

}

.con-box
{
position:relative;
overflow: hidden;
display: block;
width: 250px;
height: 170px;
text-indent: -9999px;
border-top: solid 1px #fff;
}

.contact
{
height:720px;
}


.conForm
{
float:none;
margin:0 auto;
}

#form
{
padding-right:20px;
}

/*Imprint*/

.col-imp1
{
width:300px;
margin-top: 20px;
margin-left: 0px;
margin-right:50px;
margin-bottom: 0px;
float:left;
}

.col-imp2
{
width:190px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}

.col-imp3
{
width:200px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}


.imprint-head1
{
width:390px;
font-family: futura, sans-serif;
font-size: 12px;
font-weight: normal;
color: #616161;
margin-top: 20px;
margin-left: 0px;
margin-right:50px;
margin-bottom: 20px;
float:left;
}




}


/*3-column layout*/

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

body {
padding: 0 46px;
top:0;
width: 228px;
font-family: 'Helvetica Neue', Helvetica, Arial, Verdana, sans-serif;
-webkit-text-size-adjust: 100%;
}


div, section, nav, p{
clear:both;
display:block;
float:none;
margin:0;
padding:0;
}


.line
{
visibility: hidden;
width:479px;
height:0px;
margin-top: -2px;
margin-left: -135px;
position:relative;
}

h1
{
font-size:21px;
}	

.large
{
font-size:18px;
}

.italic
{
font-size:21px;
}

.italic
{
line-height:21px;
margin:-3px 0 0 40px;
}


header
{
position:fixed;

width:250px;
margin-left:-11px;
height:290px;
background:url('../images/bg.png');
}

.logo, .mainnav
{
position:relative;
margin:10px auto;
}


.logo
{
top:0;
}

.mainnav
{
top:15px;
}

.mainnav ul
{
display:block;
width:228px;
height:60px;
margin:-60px auto;
}

.mainnav li
{
float:left;
width:228px;
}

.mainnav a
{
width:228px;
padding-left:7px;
padding-bottom: 3px;
padding-left:7px;
margin-bottom:3px;
}

#main
{width:100%;
margin-top:30px;
}

.start
{
height:100px;
margin-top:320px;
}


.slide
{
display:none;
}

.text-img
{
display: block;
margin-top:310px;
font-size: 26px !important;
font-weight: bold;
}

#wir 
{
visibility: hidden;
clear:both;
display:block;
height: 320px;
margin-top: -370px;
}


#work, #work2, #contact, #contact2
{
height:320px;
}


.uns 
{
margin-top: -22px;
margin-left: 15px;
font-size: 14px !important;
font-weight: bold;
}

.col1
{
width:230px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: -15px;
float:left;
}

.col11
{
width:230px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}


.col2, .col2 p
{
width:230px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}

.col22 
{
width:230px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 20px;
float:left;
}

.col3
{
width:230px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}


/*Leistungen*/

#Leistung
{
margin-top: 270px;
}

.col-L1
{
width:230px;
margin-top: 20px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}

.col-L2, .col-L3, .col-L4, .col-L5
{
width: 230px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}

.Leistung{
font-size: 15px !important;
font-weight: bold; 
}

.picTitle
{
background: url('../images/btn.png');

display: block;
float: left;
font-size: 10px;
font-weight: bold;

text-decoration: none;
color: #FFF;
top: 2.5px;
left: 0.5px;
position: absolute;
z-index: 1;
padding: 3px 8px;
max-width: 327px !important;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
behavior: url(PIE.htc);
}

.leist 
{
margin-top: 55px;
margin-left: 10px;
font-size: 12px !important;
font-weight: bold;
}

.leist2
{
margin-top: 10px;
margin-left: 10px;
font-size: 12px !important;
font-weight: normal;
}

.leist3 
{
margin-top: 20px;
margin-left: 10px;
font-size: 12px !important;
font-weight: bold;
}

.komp 
{
margin-top: -30px;
margin-left: 25px;
padding-top: 0px;
font-size: 11px !important;
}

.work2{
    height:1470px;
}


#Kompetenz{
margin-left: 10px;
}



.margin
{
margin-bottom:1.62em;
margin-top:0!important;
}

.col3
{
margin-bottom:10.5px;
}

.col1, .def
{
margin-top:10.5px;
}

p
{
font-size:12px;
margin-top:10.5px;
margin-bottom:10.5px;
}

#filter
{
width:inherit;
margin:10.5px auto;
font-size:11px;
height:21px;
}


.mason
{
width:100%;
margin-left:14px;

}

.img-container
{
width:200px;
}

.col3, ol
{
width:230px;
}

.def
{
font-size:13px;
font-weight:bold;
margin-top:3px;
letter-spacing:-1px;
}

.pron
{
margin-left:-6px;
font-size:12px;
font-weight:normal;
}



ol{
margin-left:23px;
margin-bottom:3em;
font-size:12px;
}

ol li
{
margin-bottom:3px;
}


.me
{
width:100%;
}



#tooltip {
margin-top:-15px;
margin-left:-53px;
}


ul#social
{
margin:10.5px 0 0 12px;
}

ul#social li
{

margin-right: 5px;
}

.tooltip:hover:after
{display:none;}

.fm, .vim, .mail img
{display:none;}

.mail:before
{
content:"info(at)drdop.de";
display:block;
position:relative;
top:10px;
display:block;
margin-left:12px;
}

.contact .italic
{
float:right;
margin-top: -8px;
font-size: 12px;

}

.contact-head2
{

font-family: futura, sans-serif;
font-size: 16px;
font-weight: bold;
color: #616161;
}

#contact-area {

	width: 230px;
        float: left;
	margin:-60px auto;
}

#contact-area input, #contact-area textarea {
	padding: 3px;
	width: 230px;
	font-family: Helvetica, sans-serif;
	font-size: 1em;
	margin: 0px 0px 0px 0px;
	border: 1px solid #ccc;
}

#contact-area textarea {
	height: 70px;

}

#contact-area textarea:focus, #contact-area input:focus {
	border: 1px solid #000;
}

#contact-area input.submit-button {
	width: 70px;
	float: left;
}

label {
	float: left;
	text-align: left;
	margin-bottom: 2px;
	width: 100px;
	padding-top: 3px;
	font-size: 1em;
}

/*Contact-Pics*/

.con-img
{width:230px;
margin:70px auto;
}

.con-img2
{display: none;
width:250px;
margin-top:370px;
margin-left: 70px;
}

.con-img3
{width:230px;
margin:270px auto;

}

.con-box
{
position:relative;
overflow: hidden;
display: block;
width: 230px;
height: 170px;
text-indent: -9999px;
border-top: solid 1px #fff;
}

.contact
{
height:770px;
}


.conForm
{
float:none;
margin:0 auto;
}

#form, #form span
{
padding:0;
}

.conForm, #form, #form div, #form span, #btn
{
width:228px;
}

#comment-wrap label
{
display:none!important;
}

.contact
{
height:600px;
}

.copy:after
{
content:"©2012 Dorstewitz + Partner";
position:relative;
top:470px;
text-align:center;
display:block;
}

input[type="text"], textarea
{
width:221px;
padding:0;
padding-left:5px;
}

.minus
{
margin-top:-2px;
}
.hr
{
height:21px;
padding:0px 0 0;
}


/*Imprint*/

.col-imp1
{
width:230px;
margin-top: 20px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}

.col-imp2
{
width:230px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}

.col-imp3
{
width:230px;
margin-top: 0px;
margin-left: 0px;
margin-right:0px;
margin-bottom: 0px;
float:left;
}


.imprint-head1
{
width:230px;
font-family: futura, sans-serif;
font-size: 12px;
font-weight: normal;
color: #616161;
margin-top: 20px;
margin-left: 0px;
margin-right:50px;
margin-bottom: 20px;
float:left;
}





footer
{
display:none;
}

}


/*Webkit Styles*/
@media screen and (-webkit-min-device-pixel-ratio:0)
{ 
.current
{
text-shadow:none;
}

.bold
{
font-family:'Sansumi Regular';
}


#btn,#tooltip{
text-shadow: rgba(0,0,0,.01) 0 0 1px;
font-family:'Sansumi Bold';}

.minus
{
margin-top:-5px;
}

}

@media only screen and (max-width: 479px) and (-webkit-min-device-pixel-ratio:0)
{
.minus
{
margin-top:-4px!important;
}

}


/*Overrides for iPhone 4 and other high device-pixel-ratio devices*/

@media 
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {

body{
font-family: 'Helvetica Neue', Helvetica, Arial, Verdana, sans-serif;
}

}



