@charset "UTF-8";
/* ********************
initial author: petra skirk
last editor: p.skirk.marketing services.on.demand
first version: 18.03.2011
last update: 22.08.2011 ********** */

/* ********** basic and reset styles********** */

html  {
    margin: 0;
    padding: 0;
   }

body {
    margin: 0 auto;
    padding: 0;
	font: normal 1em/1em Arial, Verdana, sans-serif;
    height: 100%;
    background-color: #242424;
                   }

div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin: 0;
	padding: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}
fieldset,img {
	border: 0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style: normal;
	font-weight: normal;
}
ol,ul {
	list-style: none;
    margin: 0;
	}

caption,th {
	text-align: left;
}
h1,h2,h3,h4,h5,h6 {
	font-size: 100%;
	font-weight: normal;
}

abbr,acronym {
border: 0;
}

:lang(de)    { quotes:"\201E" "\201C" "\201A" "\2018"; }
:lang(de-DE) { quotes:"\00BB" "\00AB" "\203A" "\2039"; }

q:before { content:open-quote; }
q:after { content:close-quote; }
q q:before { content:open-quote;  }
q q:after { content:close-quote; }


/* ********** pseudo and img styles ********** */

a, a:link, a:visited, a:hover, a:active {
text-decoration: none;
border: 0;
}

/* ********** classes (mainly for navigation background) ********** */

.bg1 {
    background: transparent url(../images/home_bg1.jpg) 0 60px no-repeat;
    }

.bg2 {
    background: transparent url(../images/vita_bg1.jpg) 0 60px no-repeat;
}

.bg3 {
    background: transparent url(../images/gall_bg.png) 0 60px no-repeat;
}

.bg4 {
    background: transparent url(../images/gall_bg1.jpg) 0 60px no-repeat;
}

.bg5 {
    background: transparent url(../images/kurse_bg1.jpg) 0 60px no-repeat;
}

.bg6 {
    background: transparent url(../images/ausstell_bg1.jpg) 0 60px no-repeat;
}

.bg7 {
    background: transparent url(../images/aktuell_bg1.jpg) 0 60px no-repeat;
}

.bg8 {
    background: transparent url(../images/kontakt_bg1.jpg) 0 60px no-repeat;
}

.bg9 {
    background: transparent url(../images/links_bg1.jpg) 0 60px no-repeat;
}

.bg10 {
    background: transparent url(../images/presse_bg2.jpg) 0 60px no-repeat;
}

.english, em {
    color: #f79346;
}


/* ********** wrapper and head ********** */

#wrapper {
    margin: 0 auto;
    width: 1080px;
    background-color: #2c2c2c;
    }

.wrap1 {
    background: #2c2c2c url(../images/wrapper_bg1.jpg) 160px 125px no-repeat;
}

.wrap2 {
    background: #2c2c2c url(../images/wrapper_bg2.jpg) 210px 20px no-repeat;
}

/* ********** main navigation ********** */

#topnavi {
    float: left;
    width:300px;
    padding-top: 50px;
    height: 445px;
    position: relative;
    }

#topnavi h1{
    font-size: 1.75em;
    color: #fff;
    text-align: center;
}

ul.menu1 {								
    position: absolute;
    bottom: 5px;
    width: 180px;
}

ul.menu1 li a {
    color: #ccc;
    display: block;
    text-align: right;
    line-height: 1.5em;
        }

ul.menu1 li a.curr, ul.kontakt li a.curr {
    color: #fff;
    font-weight: bold;
        }

ul.menu2 {							/* (.menu2) small navigation for galleries - citylines, begrenzungen, parallel and Insideout.html */
    position: absolute;
    bottom: 25px;
    width: 180px;
}

ul.menu2 li:first-child {
    background: transparent url(../images/menu2_bg.png) 70px 50% no-repeat;
}

ul.menu2 li.quad a {
    background: transparent url(../images/menu2_bg1.png) 70px 50% no-repeat;
    padding-left: 35px;
    display: block;
    text-align: right;
}

ul.menu2 li.quad1 a {
    background: transparent url(../images/menu2_bg2.png) 70px 50% no-repeat;
    display: block;
    text-align: right;
    padding-left: 35px;
}

ul.menu2 li a {
    color: #ccc;
    display: block;
    text-align: right;
    line-height: 1.5em;
    font-size: 0.9em;
        }

/* ********** right pane mainly containing images ********** */

#infobox {
    float: right;
    width: 400px;
    padding-top: 180px;
    overflow: hidden;
}

#infobox img {
    margin-bottom: 35px;
}


/* ********** main content ********** */

#cont1 {									
    margin-left: 250px;
    margin-right: 400px;
    padding-top: 500px;
    color: #fff;
    position: relative;
        }

#cont1 p {
    font-size: 0.75em;
    padding: 0 60px 15px 0;
    text-align: justify;
    line-height: 1.5em;
}

#cont1 h1, #cont1 h2 {
    font-size: 1.2em;
    margin-top: 25px;
    padding:0 60px 15px 0;
}

#cont1 h1:first-letter, h2:first-letter {
    font-size: 1.8em;
    }

#cont1 tr {
    font-size: 0.75em;
    }

#cont1 tr td {
    vertical-align: top;
    color: #fff;
    padding: 10px 45px 10px 0;
            }

#cont1 tr td.years {
    vertical-align: top;
    padding: 10px 15px 10px 0;
}

 #cont1 a[href] {
    font-size: 0.8em;
    line-height: 2em;
    padding-right: 25px;
    background: transparent url(../images/newwebpage.png) 100% 50% no-repeat;
    color: #afe2f7;
    text-decoration: underline;
    }

.kurse h1, h2, .aktuell h1, h2, .haftung h1, h2 {
    line-height: 1.2em;
}

div.english q {
        color: #f79346;
}

.vita table + h1, .exhibition table + h1 {
    margin-top: 35px;
}

.aktuell ul + h1 {
    margin-top: 25px;
}


/****************** css styles for "gallerien.html" ************ */

#cont3 {
    margin-left: 260px;
    padding-top: 500px;
    color: #fff;
               }

#cont3 .gall {
    height: auto;
    margin-bottom: 50px;
	}

#cont3 .gall p{
    /*color: #e4db6d;*/
    margin: 0 0 25px 0;
}

#cont3 h1, #cont3 h2 {
    padding-bottom: 15px;
    letter-spacing: 2px;
}

#cont3 h1:first-letter {
    font-size: 1.8em;
}

#cont3 p {
    padding: 0 175px 0 365px;
    text-align: justify;
    font-size: 0.75em;
    min-height: 200px;
    line-height: 1.5em;
	       }

#cont3 ul.gallimg {
    font-style: italic;
    font-size: 0.65em;
    float: left;
    margin: 0;
    }


/****************** css styles for galleries cityline-begrenzungen-insideout-parallel.html ************ */

#cont2 {
    margin-left: 280px;
    color: #fff;
    height: auto;
    position: relative;
            }
		
#cont2 h1, #cont2 h2 {
    padding: 500px 0 0 10px;
    letter-spacing: 2px;
}

#cont2 h1:first-letter{
    font-size: 1.8em;
}

#cont2 ul.click {
    padding: 15px 0 200px;
	float: left;
	width: 310px;
}

#cont2 ul.click li {
    display: inline-block;
	border: 0;
             }

#cont2 ul.click a img {
    visibility: hidden;
    position: absolute;
    right: 25px;
    top: 80px;
                }

#cont2 ul.city li a {
    border: 1px solid #ccc;
    width: 135px;
    height: 41px;
    margin: 8px -2px 8px 10px;
    display: inline-block;
}

#cont2 ul.inout li a {
    width: 69px;
    height: 189px;
    display: inline-block;
    border: 1px solid #ccc;
    margin: 10px -4px 0 12px;
}

#cont2 ul.parallel li a {
    width: 68px;
    height: 90px;
    display: inline-block;
    border: 1px solid #ccc;
    margin: 7px -2px 7px 12px;
}

#cont2 ul.begrenz li a {
    width: 68px;
    height: 68px;
    display: inline-block   ;
    border: 1px solid #ccc;
    margin: 8px -4px 8px 12px;
}

#cont2 ul.ganga li a {
    width: 68px;
    height: 68px;
    display: inline-block   ;
    border: 1px solid #ccc;
    margin: 8px -4px 8px 12px;
}

#cont2 ul.paintings li a {
    width: 68px;
    height: 68px;
    display: inline-block   ;
    border: 1px solid #ccc;
    margin: 8px -4px 8px 12px;
}

#cont2 ul.wortundbild li a {
    border: 1px solid #ccc;
    width: 135px;
    height: 41px;
    margin: 8px -2px 8px 10px;
    display: inline-block;
}

#cont2 ul.click a:focus, #cont2 ul.click a:active {
    background-color: #ccc;
    outline: 0;
    }

#cont2 ul.click a:focus img, #cont2 ul.click a:active img {
    visibility: visible;
    outline: 0;
            }

/* ********** footer ********** */

#footer {
    clear: both;
    height: 25px;
    position: relative;
    margin-top: 80px;
    color: #ccc;
    font-size: 0.75em;
    }

ul.kontakt {
    padding-left: 15px;
}

ul.kontakt li {
    display: inline;
    }

ul.kontakt li a {
    color: #ccc;
    padding-right: 15px;
    }

ul.kontakt li.copy {
    position: absolute;
    right: 10px;
}