/* Contao Open Source CMS :: Copyright (C) 2005-2011 Leo Feyer :: LGPL license */
body { margin:0; padding:0; font-size:100.01%; text-align:left; position:relative;}
select, input, textarea { font-size:99%; }
form { margin:0; padding:0; }
img { border:0; }
#left { float:left; }
#right { float:right; }
#main { width:auto; position:relative; }
.inside { position:relative; text-align:left; }
.block { overflow:hidden; }
.clear, #clear { height:0.1px; font-size:0.1px; line-height:0.1px; clear:both; }
.invisible { width:0px; height:0px; left:-1000px; top:-1000px; position:absolute; overflow:hidden; display:inline; }
.custom { display:block; text-align:left; }
.custom:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
*+html #main { position:static; }
header, footer, nav, section, aside, article, figure, figcaption {display:block;}

@charset 'utf-8';

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

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;
	vertical-align: baseline;
}
/* 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;
}


/* 
Useful basic stylings based on Stefan Nitzsche’s work
http://nitzsche.info*/


html {
  overflow-y: scroll;
}

body {
  background-color: #fff;
}

strong, b {
  font-weight: bold;
}

em, i {
  font-style: italic;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

.ie7 address {
  font-style: normal;
}

.hideme {
  position: absolute;
  left: -999em;
  top: -999em;
}

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

q:lang(de) {
  quotes: '„' '“' '‚' '‘';
}

q:lang(en) {
  quotes: '“' '”' "‘" "’";
}

abbr[title] {
  border-bottom: 1px dotted #888 !important;
  cursor: help;
}

a abbr {
  cursor: pointer !important;
}

.clearfix:after {
  clear: both;
  content: ".";
  display: block;
  height: 0;
  visibility: hidden;
}

.clearfix {
  display: inline-block;
}

/* Hides from IE-mac \*/ 
  * html .clearfix { height: 1%; }
  .clearfix { display: block; }
/* End hide from IE-mac */

img { 
  -ms-interpolation-mode: bicubic; 
}



/* Grundelemente
----------------------------------------------------------------*/
html { }
body {font-family: Verdana, sans-serif; font-size:100%; color:#555; background-color:#fff;} /*.01% verhindert anzeigeprobleme im ie*/

h1, h2, h3, p, li, td, .toggler {font-size:0.75em; line-height:1.5em;}

h1 {text-transform:uppercase; font-weight:bold;}
h2 {text-transform:uppercase; font-size:0.75em; font-weight:bold;}
h3 {text-transform:uppercase; letter-spacing:0.05em; font-weight:bold;} /*Galerie Index */

.small {font-size:0.75em !important;}

/* Hauptcontainer
----------------------------------------------------------------*/
#wrapper { } 
#header{ } 
#header .inside{ } 

#topnavi {width:960px; margin:20px 0px 0px 80px;}
#main_navi, #sub_navi_01 {clear:both; margin: 0px 0px 0px 0px; padding:30px 0px 5px 80px; border-bottom:#555 dashed 1px;}
#sub_navi_02 {margin:0px 0px 0px 0px; padding:5px 0px 5px 80px;}
#sub_navi_03 {margin:0px 0px 30px 0px; padding:3px 0px 5px 80px; border-top:#555 dashed 0px;} /* 3. Naviebene bei Imperia */

#container {min-height:290px;}

#footer{ margin:0px 0px 0px 0px; padding:0.5em 0 3em 80px; border-top:#555 dashed 1px; font-size:0.6em;} 



/* Links
----------------------------------------------------------------*/
a {color:#555;}
a:hover, a:focus, a:active {color:#2a95b3; text-decoration:none;}  /* */
a:visited { }


/* Navigation
----------------------------------------------------------------*/

.mod_navigation ul { margin:0; padding:0; text-indent:0;}
.mod_navigation li {float:left; padding:0px 6px 0px 6px; text-transform:uppercase; border-left:#555 solid 1px; list-style: none; line-height:0.9em; letter-spacing:0.05em;}
#sub_navi_03.mod_navigation li {margin-left:4px; padding:0; text-transform:inherit; border-left:#555 solid 0px; line-height:1em; letter-spacing:0em; background:#fff url("../../files/themes/kontrast_standard/line.gif") no-repeat left top; text-indent:14px;}
.mod_navigation li.first {padding-left:0px; border-left:#555 solid 0px;}
#sub_navi_03.mod_navigation li.first {margin-left:0px;  padding:0;  border-left:#555 solid 0px; text-indent:0px; background: none;}

.mod_navigation a:link {text-decoration:none;color:#555;}
.mod_navigation .active, #header .mod_navigation .trail, .mod_navigation a:hover {color:#2a95b3;}


/* Accordion
----------------------------------------------------------------*/
.ce_accordion {width:580px;}
.ce_accordion .toggler {background:#fff url("../../files/themes/kontrast_standard/plus.gif") no-repeat left center; padding:0 0 0 1.5em; margin-bottom:5px; cursor: pointer; text-transform:uppercase; letter-spacing:0.05em; outline: none;}
.ce_accordion .toggler.hover {color:#2a95b3; outline: none;}
.ce_accordion .toggler.active {color:#2a95b3; background:#fff url("../../files/themes/kontrast_standard/minus.gif") no-repeat left center; outline: none;}


/* spezielle Formatierungen Inhaltselemente
----------------------------------------------------------------*/
.bio, .bio_full {border-top:#555 dashed 1px; padding:20px 0px 40px 80px;} /*brauchts damit die dashed-line unter dem Indextext hintergrndig weiss bleibt*/ 
.bio p, .bio li {width:580px;} /*...und der nachfolgende Text trotzdem in Form*/
.bio_full p {width:880px;} /*wenn der Biotext ber die ganze Seite laufen soll*/


.left {width:580px; margin:20px 0px 40px 80px} /*Standardgrsse und Position fr IE links*/
.right {float:right; width:280px;} /*Bildblock rechts bei Leseproben */
iframe.kalender {margin:20px 0px 20px 80px} /*Abstnde fr Google Kalender */
iframe, object {margin:0px 0px 10px 0px} /*Abstnde fr YouTube und .. */


.index_img, .index_text, .map {min-height:290px; border-bottom:dashed #555 0px;} /*Container ft Startbild und Starttext auf Bioseite und Karte auf Kontakt*/
.index_img img, .kontakt img {float:left;} /*klebt die untere Linie ran.*/
.blau {background-color:#2895b3;} /*Hintergrundfarben...*/
.beige {background-color:#a2a785;}
.anthrazit {background-color:#444444;}
.index_text p {width:568px; margin: 10px 0px 5px 392px; font-size:1em; color:#fff;} /*Grosser Text bei Textleuten*/

.index_text.foto img {float:left; margin:5px 10px 10px -5px} /*Grosser Text bei Textleuten*/
.index_text.foto p {width:870px; margin: 15px 0px 5px 80px; font-size:1em; color:#fff;} /*Grosser Text bei Textleuten*/

.map_topspace {margin-top:20px;}

.kontakt {margin:0;} /*positioniert Portraitbild im Kontakt*/
.kontakt p {margin: 15px 0px 0px 390px;} /*positioniert Textblock im Kontakt*/
.leseprobe {width:880px; margin:30px 0px 0px 80px; border-bottom:#555 dashed 1px; padding-bottom:10px;} /*Artikel Leseproben*/
.leseprobe .ce_text {margin:0 0 10px 0; display:block;} /*IE's in Leseproben links ohne Einzug*/
.leseprobe img {margin-bottom:10px;} /* */
.last {border-bottom:none;} /*macht beim letzten IE oder Artikel die Linie weg*/

#kontrast-kontakt .mod_dlh_googlemaps {margin:0; padding:0;} /*setzt Rnder rund um Googlemap auf 0*/

map#figuren, img#transparent { outline: none !important; } /*lsst die ImageMap-Umrisse im IE verschwinden*/

.ce_text.fotospalte {max-width:410px}


/* Gallerien
----------------------------------------------------------------*/

/*Vorschaubilder*/
#wrapper_galerie_index {width:900px; margin:22px 0px 0px 80px;}
#wrapper_galerie_index div {float:left; min-width:280px; margin:0px 12px 25px 0px; overflow:hidden;}
#wrapper_galerie_index div img {border:#444 solid 1px; margin-bottom:2px;}

.ce_galerie {margin-left:80px; margin-top:30px; margin-bottom:30px;}
.leseprobe .ce_galerie {margin-left:0px; margin-top:20px; margin-bottom:20px;} /*kein Einzug links fr Galerien in Artikel Leseprobe*/
.ce_galerie h3 {padding-bottom: 10px;}  
.galleria-image {border:#444 solid 1px;}
.galleria-theme-twelve .galleria-image {border:none;} /*kein Rand fr Galerien in Artikel Leseprobe*/


/*.galleria-container.fullscreen .galleria-stage {background-color:#fff;} 
.galleria-container.fullscreen img { } 
.galleria-info {display:none; visibility:hidden;}*/


.no_fullscreen div.galleria-fullscreen {display: none;}

/* Vereinfachte Navibar bei Galerien, basierend auf dem theme 'twelve' */
.galleria-bar {background:none;} /* blendet grauen Hintergrund aus */
.galleria-info {left:0px; color: #555;} /* stellt den ganzen Bereich linksbndig und frbt den Text ein */
.galleria-info-text, .galleria-info-title {padding-left:0px; color: #555;} /* Setzt den Bildlegendentext (Titel) nach links und frbt Ihn um */
.galleria-s3, .galleria-s2, .galleria-s1, .galleria-s4, .galleria-popout, .galleria-thumblink, .galleria-play {display:none;} /*blendet die Begrenzungslinien nicht bentigten Elemente aus*/
.galleria-counter {background: none;}


/* Listen
----------------------------------------------------------------*/
.ce_text li {background:#fff url("../../files/themes/kontrast_standard/bullet.gif") no-repeat left top; padding:0 0 0 1.1em;}


/* Formulare
----------------------------------------------------------------*/
#tl_login, #tl_logout {margin:20px 0px 0px 80px;}
#tl_login table {width:28.5em;}
#tl_login td.col_first {width:8.5em;}

input.text, textarea.textarea, input.captcha {width:20em; margin-top: .5em; border:#666 solid 1px;} /*Eingabefelder*/
input.submit {width:20.1em; margin-top:.5em; border:#666 solid 1px; color:#555;} /*Login Button */
input.submit:hover {background-color:#52a9c1;}
input:focus, textarea:focus {background-color:#52a9c1;} /*Fokus ber Eingabefeld*/

div.error, p.error {width:19.6em; margin-left:8.5em; background-color:#52a9c1; padding:0 0.2em; color:#fff;} /*Fehlermeldung*/




/*in Kontrast nicht bentigte Formularelemente*/
fieldset {width:550px; line-height:1.8em;}
.checkbox_container label {display:inline; cursor:pointer;} /*setzt Checkboxen und Label nebeneinander und macht das ganze Labelk anklickbar*/
.checkbox_container span {display:block; margin-top:08.em;} /*setzt Checkboxen und Label nebeneinander*/

label.mandatory, label.bemerkungen {float:left; margin-top:.8em; width:7em;} /*Feldbeschreibungen*/
input.captcha {width:1.5em;} /*Eingabefeld Sicherheitsabfrage*/

#tl_unsubscribe input.submit, #tl_subscribe input.submit  {margin-left:.5em; width:6em; margin-top:.5em; border:#444 solid 1px;} /*Versenden Button Newsletter*/
#tl_unsubscribe p.confirm, #tl_subscribe p.confirm, #tl_unsubscribe p.error, #tl_subscribe p.error  {color:#cc0066; margin:0; background-color:#ffffff; width:inherit;} /*Besttigungs- und Error-Meldung Newsletter Abo oder Kndigung*/


/* Belegungsplan
----------------------------------------------------------------*/
div#zibepla_copyright {text-align:left; font-size:0.5em; line-height:2em;}
div#zibepla_copyright a, div#zibepla_copyright a:hover, div#zibepla_copyright a:visited, div#zibepla_copyright a:focus {text-decoration:none; color:#555;}  





/* StyleSheet zu Image Map */


/* Das umschliessende DIV */
#map {
	position: relative;
	width: 960px;
	height: 320px;
	
}

/* Das transparente GIF. Die eigentliche ImageMap. */
#transparent { position: absolute; z-index: 30; width: 960px; height: 320px; border: none;}

/* Die Liste mit den LIs, die vom JavaScript dann eingeblendet werden. */
#map ul {
	list-style: none;
}

/* Die Listenelemente werden hier zuerst auf unsichtbar gesetzt. */
#map li {
	position: absolute;
	z-index: 20;
	text-indent: -1000em;
	display: none;
}

/* Die einzelnen Listenelemente werden über ihre IDs angesprochen und mit einem Hintergrundbild versehen und wie nötig positioniert. */
#zueger {
	background: url("../../files/startanimation/zueger.png") no-repeat;
	width: 290px;
	height: 320px;
	top: 0px;
	left: 20px;
}

#kaenzig {
	background: url("../../files/startanimation/kaenzig.png") no-repeat;
	width: 330px;
	height: 320px;
	top: 0px;
	left: 70px;
}

#hille {
	background: url("../../files/startanimation/hille_15.png") no-repeat;
	width: 350px;
	height: 320px;
	top: 0px;
	left: 110px;
}

#toepfer {
	background: url("../../files/startanimation/toepfer.png") no-repeat;
	width: 290px;
	height: 320px;
	top: 0px;
	left: 160px;
}

#kawara {
	background: url("../../files/startanimation/kawara.png") no-repeat;
	width: 300px;
	height: 320px;
	top: 0px;
	left: 220px;
}

#bobst {
	background: url("../../files/startanimation/bobst.png") no-repeat;
	width: 310px;
	height: 320px;
	top: 0px;
	left: 270px;
}

#schmidt {
	background: url("../../files/startanimation/schmidt.png") no-repeat;
	width: 320px;
	height: 320px;
	top: 0px;
	left: 490px;
}

#elmer {
	background: url("../../files/startanimation/elmer.png") no-repeat;
	width: 320px;
	height: 320px;
	top: 0px;
	left: 390px;
}

#bastic {
	background: url("../../files/startanimation/bastic.png") no-repeat;
	width: 320px;
	height: 320px;
	top: 0px;
	left: 420px;
}

#khakshouri {
	background: url("../../files/startanimation/khakshouri.png") no-repeat;
	width: 390px;
	height: 320px;
	top: 0px;
	left: 480px;
}

#vaitl {
	background: url("../../files/startanimation/vaitl.png") no-repeat;
	width: 300px;
	height: 320px;
	top: 0px;
	left: 540px;
}

#geiser {
	background: url("../../files/startanimation/geiser.png") no-repeat;
	width: 300px;
	height: 320px;
	top: 0px;
	left: 480px;
}

#meyer {
	background: url("../../files/startanimation/meyer.png") no-repeat;
	width: 370px;
	height: 320px;
	top: 0px;
	left: 260px;
}

#olonetzky {
	background: url("../../files/startanimation/olonetzky.png") no-repeat;
	width: 340px;
	height: 320px;
	top: 0px;
	left: 530px;
}

#nordmann {
	background: url("../../files/startanimation/nordmann.png") no-repeat;
	width: 350px;
	height: 320px;
	top: 0px;
	left: 610px;
}

/* Style-Reset */
#topnavi_atelier, #topnavi_member {margin:0; padding:0; text-indent:0;}
    
/* LI bekommen BG-Bild und Groessen */
#topnavi_atelier li {display:block; float:left; height:50px; background:url("../../files/image/topnavi_atelier.png") no-repeat; margin:0 37px 0 0; }
#topnavi_member li {display:block; float:left; height:50px; background:url("../../files/image/topnavi_atelier.png") no-repeat; margin:0 37px 0 0; }
	
/* A bekommen BG-Bild und Groessen */
#topnavi_atelier li a  {display:block; height:50px; background:url("../../files/image/topnavi_atelier.png") no-repeat; }
#topnavi_member li a {display:block; float:left; height:50px; background:url("../../files/image/topnavi_atelier.png") no-repeat; margin:0 37px 0 0; }
	
/* Einfacher Hover-Effekt, der ohne JS funktioniert */
#topnavi_atelier li a:link, #topnavi_atelier li a:visited {opacity:0.00001;}
#topnavi_atelier li a:hover, #topnavi_atelier li a:active {opacity:1;}
    
/* Texte verstecken */
#topnavi_atelier li span, #topnavi_atelier li a span, #topnavi_member li span, #topnavi_member li a span  {display:block; width:0; height:0; overflow:auto;}
    
/* LI-Bilder ausrichten */
#topnavi_atelier #atelier, #topnavi_member #atelier {width:163px;  background-position:0 0; }
#topnavi_atelier #text {width:76px; background-position:-200px 0; }
#topnavi_member #text {width:76px; background-position:-200px -50px; }
#topnavi_atelier #foto  {width:76px; background-position:-313px 0; }
#topnavi_member #foto  {width:76px; background-position:-313px -50px; }
#topnavi_atelier #film {width:105px; background-position:-426px 0; }
#topnavi_member #film_film {width:110px; background-position:-662px -50px; margin:0;} /*spezialnavi fr video & text */
#topnavi_member #film_text {width:107px; background-position:-772px -50px; } /*spezialnavi fr video & text */
#topnavi_atelier #verlag {width:123px; background-position:-539px 0; }
#topnavi_atelier #chronik {width:160px; background-position:0 -1000px; }


/* einzelen Member ohne Link*/
#topnavi_member #bastic {width:400px; background-position:0 -100px;}
#topnavi_member #khakshouri {width:400px; background-position:0 -150px;}
#topnavi_member #elmer {width:400px; background-position:0 -200px;}
#topnavi_member #vaitl {width:400px; background-position:0 -250px;}
#topnavi_member #hille {width:300px; background-position:0 -300px;}
#topnavi_member #geiser {width:400px; background-position:0 -350px;}
#topnavi_member #kawara {width:400px; background-position:0 -400px;}
#topnavi_member #kaenzig {width:400px; background-position:0 -450px;}
#topnavi_member #meyer {width:400px; background-position:0 -500px;}
#topnavi_member #bobst {width:400px; background-position:0 -550px;}
#topnavi_member #nordmann {width:400px; background-position:0 -600px;}
#topnavi_member #olonetzky {width:400px; background-position:0 -650px;}
#topnavi_member #schmidt {width:400px; background-position:0 -700px;}
#topnavi_member #toepfer {width:400px; background-position:0 -750px;}
#topnavi_member #zueger {width:400px; background-position:0 -800px;}
#topnavi_member #porto_maurizio {width:500px; background-position:0 -850px;}
#topnavi_member #brusino {width:550px; background-position:0 -900px;}
#topnavi_member #genova {width:550px; background-position:0 -950px;}
#topnavi_member #budapest {width:550px; background-position:0 -1050px;}

	   
/* A-Bilder ausrichten */
#topnavi_atelier #atelier a, #topnavi_member #atelier a {width:163px; background-position:0 -50px; padding:0px;}
#topnavi_atelier #text a, #topnavi_member #text a {width:76px; background-position:-200px -50px;}
#topnavi_atelier #foto a, #topnavi_member #foto a {width:76px; background-position:-313px -50px; }
#topnavi_atelier #film a, #topnavi_member #film a {width:105px; background-position:-426px -50px; }
#topnavi_member #film_film a {width:110px; background-position:-662px -50px;} /*spezialnavi fr video & text */
#topnavi_member #film_text a {width:107px; background-position:-772px -50px;} /*spezialnavi fr video & text */
#topnavi_atelier #verlag a {width:123px; background-position:-539px -50px; }
#topnavi_atelier #chronik a {width:160px; background-position:0 -1000px; }
	
/* Markierung aktiver Seiten */
.atelier #topnavi_atelier #atelier  {background-position:-0px -50px;}
.text #topnavi_atelier #text  {background-position:-200px -50px;}
.foto #topnavi_atelier #foto  {background-position:-313px -50px;}
.film #topnavi_atelier #film  {background-position:-426px -50px;}
.verlag #topnavi_atelier #verlag  {background-position:-539px -50px;}
