/* Reset */
body, div, ul, p, h1, h2 { padding: 0; margin: 0; }
.cleared:after { content: "."; display: block; height: 0; clear: both; visibility: hidden }
.cleared { display: block }
* html .cleared { height:1% }

/* Allgemeines */
body { font: normal 62.5%/140% "GravurCondensed-Light", gravur, arial, sans-serif; color: #000; }


/* Struktur */
#wrapper { position: relative; min-width: 807px; width: 90%; max-width: 1241px; margin-left: 50px; }
#logo { position: absolute; top: 30px; left: 74%; }
#nav { padding-top: 80px; }
#content { margin-top: 33px; }
body.index #content { margin-bottom: 105px; }


/* Typo und Inhalt */
h2, p, dt, dd { color: #444; margin-bottom: 1em; font-size: 1.4em; line-height: 130%; }
h2 { margin-bottom: 0; font-weight: normal; }
a, a:link, a:visited { text-decoration: none; }
a:hover, a:active { text-decoration: underline; }
a img { border: none; }
#content a:link, #content a:visited { color: inherit; text-decoration: none; }
#content a:hover, #content a:focus, #content a:active { text-decoration: underline; }
abbr { text-decoration: none; border: none; }
dl { width: 450px; }
dt, dd { float: left; width: 100%; margin: 0; }
dt { margin-top: 1.2em; }


/* vcard */
.country-name, .url { display: none; }
.vcard { text-transform: uppercase; }
.vcard p { font-size: 1.3em; }


/* Navi */
#nav { width: 100%; }
#nav li { float: left; list-style: none; }
#nav li a { float: left; height: 0; padding-top: 14px; overflow: hidden;  text-transform: uppercase; font-size: 100%; color: #000; background: transparent url(img/navigation.bg.sprite.png) no-repeat 0 0; }
#nav li a:focus { outline: none; }
#nav li a.produkt { width: 72px; background-position: 0 -2px; }
#nav li.active a.produkt, #nav li a.produkt:hover, #nav li a.produkt:focus { background-position: 0 -28px; }
#nav li a.architektur { width: 100px; background-position: -72px -2px; }
#nav li.active a.architektur, #nav li a.architektur:hover, #nav li a.architektur:focus { background-position: -72px -28px; }
#nav li a.landschaft { width: 98px; background-position: -173px -2px; }
#nav li.active a.landschaft, #nav li a.landschaft:hover, #nav li a.landschaft:focus  { background-position: -173px -28px; }
#nav li a.konzept { width: 72px; background-position: -271px -2px; }
#nav li.active a.konzept, #nav li a.konzept:hover, #nav li a.konzept:focus { background-position: -271px -28px; }
#nav li a.kontakt { width: 68px; background-position: -342px -2px; }
#nav li.active a.kontakt, #nav li a.kontakt:hover, #nav li a.kontakt:focus { background-position: -342px -28px; }
#nav li a:hover { text-decoration: underline; }


/* Foto-Bereich */
#content { min-width: 600px; width: 74%; max-width: 1050px; }
#content ul.index { min-width: 600px; max-width: 1050px; }
#content ul.index li { min-width: 142px; width: 23.714%; max-width: 249px; }

#content ul.index li { list-style: none; }
#content ul.index li { float: left; margin: 0 1.6% 1.7% 0; }
#content ul.index li.last_in_row { margin-right: 0; }
#content ul.index li.last_row { margin-bottom: 0; }
#content ul.index a { float: left; }
#content img { float: left; width: 100%; }

.subnavi { margin-top: 75px; }
.subnavi li { float: left; list-style: none; }
.subnavi a { float: left; height: 22px; padding: 0 5px; background: url(img/subnavi.bg.sprite.png) no-repeat 0 0; }
.subnavi a:focus { outline: none; }
.subnavi a.zurueck { width: 57px; background-position: 0 0; }
.subnavi a.zurueck:hover, .subnavi a.zurueck:focus { background-position: 0 -20px; }
.subnavi a.vor { width: 18px; background-position: -67px 0; }
.subnavi a.vor:hover, .subnavi a.vor:focus { background-position: -67px -20px; }
.subnavi a.index { width: 30px; margin-left: 2em; background-position: -100px 0; }
.subnavi a.index:hover, .subnavi a.index:focus { background-position: -100px -20px; }
.subnavi a span { position: absolute; top: -9999px; left: -9999px; }