/* ----- CSS ----- */

*{
margin:0;
padding:0;
}

html{
height: 101%;
}

body{
color: #fff;
background:#fff;
}

.greybg{
background:#D7D4D0;
}



/* ----- ueberschriften ----- */

h1, h3{
padding-left: 3px;
font-family:georgia, serif;
font-size: 30px;
font-weight: normal;
line-height: 51px;
}

h2{
margin-top: 20px;
padding-left: 3px;
font-family:verdana, sans-serif;
font-size: 11px;
font-weight: normal;
line-height: 20px;
}

p{
margin-bottom: 8px;
font-size:11px;
line-height: 20px;
font-family:verdana, sans-serif;
font-weight:normal;
text-align:left;
letter-spacing: 0px;
}

/* ----- ueberschrift projekte ----- */

.headlineprojects{
margin-bottom: 8px;
padding-left: 3px;
font-family:georgia, serif;
font-size: 30px;
font-weight: normal;
line-height: 50px;
}

.headlinereferences{
margin-bottom: 0px;
padding-left: 3px;
font-family:georgia, serif;
font-size: 30px;
font-weight: normal;
line-height: 50px;
}

/* ----- bilder allgemein ----- */

img{
border: none;
}

/* ----- INHALTSBEREICH----- */

/* ----- formatierung fuer das logo ----- */

.logo{
color:#E03540;
font-size: 35px;
line-height: 20px;
}


/* ----- grosser kasten fuer gesamten inhalt ----- */

#content{
position:relative;
width:933px;
margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:12px;
padding-top:12px;
padding-right:24px;
padding-bottom: 24px;
padding-left: 24px;
color:#352616;
letter-spacing: 1px;
text-align:left;
}

/* ----- weisser/grauer inhalts-kasten fuer startnavi ----- */

.whitecontent{
background-color:#fff;
}

.greycontent{
background-color:#D7D4D0;
}

.blogcontent{
background-color:#fff;
background-image: url(/images/14.gif);
background-repeat: no-repeat;
}


/* ----- KOPFBEREICH----- */

#header {
}



/* ----- STARTSEITE NAVIGATION----- */

/* ----- kasten fuer farbige navigation im inhalt auf der startseite----- */
#mainnavi{
width: 933px
}

/* ----- blaue und gruene links auf der startseite ----- */

.bluelink80,.bluelink60,.bluelink100,.greenlink90,.greenlink75,.greenlink60,.brownlink85,.brownlink70,.brownlink55 {
position:relative;
display:inline;
color:#fff;
font-size:30px;
font-family:georgia, serif;
font-weight:normal;
line-height: 51px;
}

/* ----- neu-bild fuer projekte ----- */

.neu {
position:absolute;
top:-9px;
left:0;
width:30px;
height:11px;
}

/* ----- PROJEKTE----- */

/* ----- kasten fuer farbige navigation im inhalt auf der startseite----- */
#projects{
position:relative;
padding-top: 0px;
width:691px;
color:#352616;
background-color:#fff;
padding-bottom: 30px;
}

#projects img{
margin-top: 24px;
margin-left: 12px;
}

/* ----- schrift projektbeschreibungen unter den bildern ----- */

.textprojects{
width: 600px;
padding-top:12px;
padding-bottom: 12px;
padding-left:12px;
}


/* ----- kasten fuer projektdaten ----- */

#projectdata{
position: absolute;
width: 227px;
margin-top: 0px;
margin-left: 706px;
}


/* ----- weiter-navigation in den projektbildern ----- */

.next{
position: absolute;
width: 679px;
font-size: 30px;
text-align: right;
}

.nexttop{
top: 12px;
}

.nextbottom{
float: left;
bottom: 12px;
}

/* ----- tags (auch fuer ueberschriften in den projektlisten) ----- */

.similar {
text-transform: capitalize;
}

/* ----- nach oben ----- */

.pageup{
position: absolute;
left: 703px;
width: 227px;
font-family: verdana, sans-serif;
font-size: 11px;
letter-spacing: 0;
}


/* ----- IMPRESSUM ----- */

#imprint{
position: relative;
}

.textimpressum{
font-family: georgia, serif;
font-size: 30px;
line-height: 51px;
}

#imprint p{
margin-top: 19px;
margin-bottom: 16px;
padding-left: 3px;
}

/* ----- REFERENZEN ----- */

#references{
width: 920px;
}

.columnl{
float: left;
width: 440px;
}

.columnr{
float: right;
width: 440px;
}

#references p{
padding-left: 3px;
}


/* ----- PROJEKTLISTE ----- */

#projectlist{
width: 951px;
margin-top: 20px;
}

.listbox{
float: left;
width: 204px;
height: 312px;
margin-left: 3px;
margin-right: 21px;
margin-top: 20px;
}

.listbox p{
margin-top: 6px;
margin-bottom: 24px;
padding-left: 3px;
}

/* ----- BLOG ----- */

#blog{
position:relative;
padding-top: 12px;
}

.blogdata{
position: absolute;
width: 227px;
margin-top: 0px;
margin-left: 703px;
padding-left: 3px;
padding-right: 3px;
background-color: #fff;
}

.blogtext{
width: 600px;
padding-top:12px;
padding-bottom:6px;
padding-left:6px;
}

#blog img{
margin-bottom:12px;
}


/* ----- FORMATIERUNGEN ----- */

/* ----- schrift fett machen ----- */
.bold{
font-weight: bold;
}

/* ----- schrift rot machen ----- */
.red{
color: #E03540;
}


/* ----- LINKS ----- */

a{
color:#fff;
background-color: #72675C;
text-decoration:none;
padding-right:3px;
padding-bottom: 2px;
padding-left:3px;
}

.next a:link, .next a:visited{
color: #352616;
background-color:#fff;
}

.next a:hover, .next a:active{
color: #E03540;
background-color:#fff;
}

.similar a:link, .similar a:visited, .pageup a:link, .pageup a:visited {
padding-right:3px;
padding-bottom: 2px;
padding-left:3px;color: #352616;
background-color:#AEA8A2;
text-decoration: none;
}

.similar a:hover, .similar a:active, .pageup a:hover, .pageup a:active{
color: #fff;
background-color:#E03540;
}

p a:link, p a:visited {
padding: 0;
color: #352616;
background-color:transparent;
text-decoration: underline;
}


.textimpressum a:link,.textimpressum a:visited {
color: #00A0C6;
text-decoration: none;
}

.bluelink80 a:link,.bluelink80 a:visited {
background-color:#33B3D1;
}

.bluelink60 a:link,.bluelink60 a:visited {
background-color:#66C6DD;
}

.bluelink100 a:link,.bluelink100 a:visited {
background-color:#00A0C6;
}

.greenlink90 a:link,.greenlink90 a:visited {
background-color:#2F8D5A;
}

.greenlink75 a:link,.greenlink75 a:visited {
background-color:#52A076;
}

.greenlink60 a:link,.greenlink60 a:visited {
background-color:#74B391;
}

.brownlink85 a:link,.brownlink85 a:visited {
background-color:#534739;
}

.brownlink70 a:link,.brownlink70 a:visited {
background-color:#72675C;
}

.brownlink55 a:link,.brownlink55 a:visited {
background-color:#90887F;
}

p a:hover, p a:active, .textimpressum a:hover, .textimpressum a:active{
color: #E03540;
text-decoration: none;
}

h1 a{
color:#352616;
background-color:transparent;
padding: 0px;
}

h3 a:hover, a:active, .service a:hover, a:active, .bluelink80 a:active,.bluelink80 a:hover,.bluelink80 a:active,.bluelink60 a:hover,.bluelink60 a:active,.bluelink100 a:hover,.bluelink100 a:active,.greenlink90 a:hover,.greenlink90 a:active,.greenlink75 a:hover,.greenlink75 a:active,.greenlink60 a:hover,.greenlink60 a:active,.brownlink85 a:hover,.brownlink85 a:active,.brownlink70 a:hover,.brownlink70 a:active,.brownlink55 a:hover,.brownlink55 a:active {
background-color:#E03540;
}