@import url(reset.css);

/* Reset the Reset */
strong {font-weight: bold}
em {font-style: italic}

body {background: #F3F2F0}
body, html {height:101%}
/* Home */
body.home {text-align: center}
.home #page {text-align: left; width:760px; margin: 10px auto; overflow: hidden}
#qubeWrapper {width: 100%; height: 600px; overflow: hidden}
#qubeWrapper #altContent a {display: block; text-indent: -3000px; width: 100%; height: 600px; overflow: hidden; background: transparent url(i/qube_flashalternative.png) 50% 0 no-repeat}

#homeMenu {border-top: 1px solid #979694; border-bottom: 1px solid #979694; width: 100%; display: inline-block; float: left; clear: both; padding: 10px 0}
#homeMenu li {display: inline; float: left}
#home_nav01, #home_nav02, #home_nav03 {width: 240px; text-align: center; overflow: hidden}
a#home_nav01a, a#home_nav02a {height: 46px; display: block; text-indent: -2000px; overflow: hidden}
a#home_nav01a {width: 200px; background: transparent url(i/Q2010_home_02.png) 0 0 no-repeat; border-right: 1px solid #979694}
a#home_nav02a {width: 239px; background: transparent url(i/Q2010_home_01.png) 0 50% no-repeat; border-right: 1px solid #979694}

#home_nav03 {padding-left: 33px}
#home_nav03 a {text-align: left; display: block; width: 210px; padding: 5px 0 2px 22px; overflow: hidden; color: #000; text-decoration: none; font-size: 15px}
a#home_nav03a {background: transparent url(i/facebook_16.png) 0 50% no-repeat}
a#home_nav03b {background: transparent url(i/twitter_16.png) 0 50% no-repeat}

/*a#home_nav03a:hover, a#home_nav03a.hover {width: 206px; background: transparent url(i/Q2010_home_03.png) left bottom no-repeat}*/

ul#home_sitemap {overflow:hidden;width: 100%;clear: both; display: block; padding: 10px 0 10px 0}
ul#home_sitemap a {color: #333; text-decoration: none}
ul.level2 {margin-right: 10px}

ul#home_sitemap li#nav1 {width: 145px}
ul#home_sitemap li#nav2 {width: 155px}
ul#home_sitemap li#nav3 {width: 125px}
ul#home_sitemap li#nav4 {width: 165px}
ul#home_sitemap li#nav5 {width: 150px}
ul#home_sitemap li#nav6 {width: 0}

ul#home_sitemap li {color: #fff; display: block; float: left; text-align:left; font-size: 15px; text-decoration:none; letter-spacing: 1px}
ul#home_sitemap li span {display: block; float: left; clear: both; padding: 0 0 5px 0}
ul#home_sitemap li ul li {display: block; clear: both; padding: 3px 0; margin: 0 10px 0 0}
ul#home_sitemap li ul li, ul#home_sitemap li ul li a {color: #8F63C7; text-align:left; font-size: 13px; text-decoration:none; text-transform: none}
ul#home_sitemap li ul li a:hover {color: #000}

/* Startseite Sitemap */
#homeMenu, #qubeWrapper, #page {position:relative}
#home_sitemap_wrapper {width:100%; padding-top:10px; height:auto;overflow:hidden; margin: 0 0 20px 0}

/* /home */
.default #page {width:960px; border-right:2px #ddd solid; border-bottom:2px #ddd solid; padding:10px; margin:10px auto; background:#fff}
#header {height:351px; background:#000000; position:relative}
#header h1 a {position:absolute; top:25px; right:25px}
#header p {position:absolute; width: 280px; height: auto; bottom: 45px; left:660px; color:#fff}
#header p * {display:block}
#header p strong.name {font: bold 14px Arial, Helvetica, sans-serif; margin-bottom: 10px}
#header p span.time, #header p span.project {font: normal 14px "Times New Roman", Times, serif; margin-bottom: 3px}
#header p span.project {/*font: italic normal 11px "Times New Roman", Times, serif*/}
#header p span.copyright {font: normal 9px Arial, Helvetica, sans-serif; color: #999; margin-top: 10px}

#nav {bottom:0; height:30px; left:0; position:absolute; width:100%; border-top:1px solid #fff; font-weight: bold; z-index: 1}
#nav li {float:left; display:block; border-right:1px solid #666; height:100%; line-height:30px; position:relative}
#nav li a {text-align:center; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 14px; text-decoration:none; color:#fff}
#nav li, #nav li ul li a {text-align:center; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 14px; text-decoration:none; color:#fff; padding: 0 21px}

/*#nav li#nav4 {padding-left: 19px}
/*
#nav li#nav1, #nav li#nav2 {width:189px}
#nav li#nav3 {width:219px}
#nav li#nav4, #nav li#nav5 {width:129px}
#nav li#nav6 {width:100px; border:0}
*/
#nav li.active, #nav li.hover {background:#8F63C7 !important}
#nav .level2 {position:absolute; border-top: 1px solid #fff; height:30px; bottom:-31px; left:0; display:none; width: 320px; text-transform: none}
#nav li.hover .level2 {display: block}
#nav li ul li {/* border-left: 1px solid #000;border-bottom: 1px solid #000; border-right: 1px solid #000; */ height: auto; line-height: 100%; background: #000; width: 100%; padding: 6px 10px 6px 0; display: block}
#nav li ul li.last {border-bottom: 15px solid #000;}
#nav li ul li a {display: block; color: #fff; text-align: left; letter-spacing: normal; font-weight: bold; font-size: 12px}
/*

#nav li#nav1 ul li, #nav li#nav2 ul li {padding-left: 20px}
#nav li#nav3 ul li {padding-left: 26px}
#nav li#nav4 ul li {padding-left: 26px}
#nav li#nav5 ul li {padding-left: 26px}
#nav li#nav6 ul li {padding-left: 22px}
*/

#ani, #ani .image {height:320px; width:640px; position:absolute; overflow:hidden;}
#ani .image {right:-640px;}

#main {overflow:hidden; padding:35px 10px}
#content {width:600px; float:left}
#contentcalendar, #contentmap, #contentfull {width: 100%; float:left}

a#map_back {width: 100%; display: block; height: 100px; text-indent: -3000px; overflow: hidden; background: #000 url(i/quad_karte_header.gif) top left no-repeat; margin: 0 0 10px 0}

#main a {color: #8F63C7; text-decoration: none}
#main a:hover {color: #fff; background: #8F63C7}

#sidebar {width:310px; float:right}

#footer {border-top: 1px solid #ddd; height: 100px; clear:both; position: relative; font: 10px Arial, Helvetica, sans-serif; color: #666; padding: 10px 0 0 0}
#footer a#imprint {display: block; position: absolute; right: 10px; top: 130px; height: 60px; width: 140px; text-align: right; color: #666; text-decoration:none}
#sponsors {display: block; width: 580px; height: 90px; position: absolute; left: 384px; top: 10px; background: #fff url(i/Q2010_partner.png) 0 20px no-repeat}
#duesseldorf {position: absolute; left: 10px; top: 10px; width: 400px; height: 60px}
#duesseldorf img {margin: 5px 0 0 0}

#content h2,
#sidebar h2,
#contentcalendar h2,
#contentfull h2 {border-top: 1px solid; border-bottom: 1px solid; font-weight: bold; line-height: 100% !important; margin-bottom: 15px}
	
#content h2, #contentcalendar h2, #contentfull h2  {font: bold 28px Arial, Helvetica, sans-serif !important; padding: 15px 0}
#sidebar h2 {font: bold 17px Arial, Helvetica, sans-serif !important; padding: 22px 0}

#content small {font-family: Arial, Helvetica, sans-serif; font-size: 11px}
#contentcalendar h2 em {display: block}

em.h2_additional {display: block; margin: 15px 0; font-weight: bold; font-family: Arial, Helvetica, sans-serif}

#sidebar h3 {
font: bold 14px Arial, Helvetica, sans-serif; display: block; margin: 5px 0 2px 0}

#sidebar strong.de {
font: bold 14px Arial, Helvetica, sans-serif; display: block; margin: 5px 0 2px 0; font-size:14px; font-weight:bold; display:block;}

#content .copy h3, #contentfull .copy h3 {font: bold 17px Arial, Arial, Helvetica, sans-serif; color: #000; line-height: 140%; margin: 0 0 5px 0; display: block; clear: both; overflow: hidden}
h3.q2010 {padding: 2px 0 0 20px; background: transparent url(i/q2010_16x16.png) 0 5px no-repeat}

#content .copy, #contentfull .copy, #sidebar .copy  {font: normal 14px "Times New Roman", Times, serif; line-height: 170%; color: #222}

.teaserrowexhibition {float: left; position: relative; width: 960px; height: 220px; width: 100%; clear: both; display:block; margin: 0 0 15px 0}
.teaserrowexhibition div.teaserrowexhibition_textwrapper {width: 560px; position: absolute; right: 0; top: 0}
.teaserrowexhibition div.teaserrowexhibition_imgwrapper {width: 360px; height: 190px; display: block; position: absolute; left: 0; top: 0; z-index: 0; overflow: hidden}
.teaserrowexhibition div.teaserrowexhibition_imgwrapper img {height: 180px}
.teaserrowexhibition img {display: block; position: absolute; right: 0; top: 0}
.teaserrowexhibition em {display:block; font-style: normal}

h3.pmcattitle {font: normal 14px Arial, Helvetica, sans-serif; color: #000; border-bottom: 1px solid #8F63C7; margin: 0 0 15px 0; padding: 0 0 3px 0}
h3.margintop {padding-top: 25px !important; float: none; width: 100%; clear: both}
.pmrow {float: left; position: relative; width: 960px; height: 180px; width: 100%; clear: both; display:block; margin: 0 0 25px 0}
.pmrow div.teaserrowexhibition_textwrapper {width: 560px; position: absolute; right: 0; top: 0}
.pmrow div.teaserrowexhibition_imgwrapper {width: 360px; height: 190px; display: block; position: absolute; left: 0; top: 0; z-index: 0; overflow: hidden}
.pmrow div.teaserrowexhibition_imgwrapper img {height: 180px}
.pmrow img {display: block; position: absolute; right: 0; top: 0}
.pmrow em {display:block; font-style: normal}
.pmdownloadbox a img:hover, .pmdownloadbox a img {background: 0 !important; border-bottom: 0}
p.download {display: block; padding: 4px 0 4px 25px; background: #fff url(i/download.png) 0 2px no-repeat; line-height: 100% !important}
small.englishtitle {display: block; font-size: 11px; color: #666; font-weight: normal; padding: 2px 0 0 0; line-height: 14px}

/*a.download:hover {color: #000 !important; background: #fff url(i/download.png) 0 50% no-repeat !important}*/

div.press h2 em {font-size: 13px; font-weight: normal; font-style: normal}

div.seperator {float: left; width: 100%; height: 50px; clear: both; background: #fff url(i/seperator.png) 50% 10px repeat-x}

#content p, #contentfull p {
	margin-bottom: 15px;
}

a.plus_info_trigger {margin: -15px 0 15px 0; display: inline-block}
a.plus_info_trigger_close {display: inline-block; float: left; margin: 0 10px 0 0}
div.plus_info { /* Einblenden via JQ */
display: none;
}

#sidebar p {display:block; margin: 0 0 15px 0}
#sidebar li {/*padding-top:60px; */margin-bottom:30px; background-repeat:no-repeat;	line-height:16px}
#sidebar strong a {color:#000; text-decoration:none}
#sidebar strong.en a {color:#8F63C7}
#sidebar span {display:block}
#sidebar #miniagenda div.row {float: left; width: 100%; clear: both; margin-bottom: 15px}
#sidebar #miniagenda span.alert {float: left; display: inline-block; background: #8F63C7; color: #fff; padding: 0 5px; margin: 0 3px 0 0}

ul#symposion_sidebar li {display: block; clear: both; float: none; width: 100%; overflow: hidden; margin-bottom:10px}
ul#symposion_sidebar li span {line-height: 20px !important}
ul#symposion_sidebar strong {font-size: 13px !important}

.symposion p strong a {color: #000 !important}
.symposion p strong a:hover {color: #fff !important}

/* Agenda / Calendar / Kalender */
div.agendarow {margin: 0 0 3px 0; padding: 10px 0 7px 0}
.pp {background: #EDEDED}
.qq {background: #F5F2DE}
.agendarow h3 {font: normal 18px  Arial, Helvetica, sans-serif; display: inline; background: #fff; padding: 2px 5px 2px 0}
.agendarow h3.q {background: #fff url(i/q2010_19x18.png) 0 4px no-repeat; padding-left: 26px}
.agenda em {background: #fff; color: #666; font: normal 13px "Times New Roman", Times, serif; padding: 1px 3px 0 0}
.agenda a {text-decoration: none; border: 0; color: #666}
.agenda a:hover {color: #333; background: none}

dl.agendamonth dt{display: inline; margin: 0 10px 0 0}

/* datepicker = without input fields selection */
div#datepicker {position: relative; background: #C4C4C4; padding: 0 0 25px 0}
#datepicker {font: normal 18px "Times New Roman", Times, serif}
#datepicker span {background: #fff; padding: 0 5px 0 0}
span#pickerdays {font: normal 14px "Times New Roman", Times, serif}
#datepicker a {padding: 1px; color: #000}

a.dpactive {background: #8F63C7; color: #fff !important}
a.dpactive:hover {background: #8F63C7; color: #fff}
/* for input fields */
div#datepick {padding: 3px 0 7px 0; color: #666; font: normal 10px Arial, Helvetica, sans-serif}

#datepick select, #datepick option  {font: normal 9px Arial, Helvetica, sans-serif; color: #333}
#datepick input, textarea#f_userFeedback  {font: normal 9px Arial, Helvetica, sans-serif; color: #333; background: #F0F0F0; border: 1px outset #ccc}
#datepick .nrw  {width: 40px}
#datepick .wde  {width: 80px }

ol.image_rights li {font: normal 10px Arial, Helvetica, sans-serif; color: #666; margin: 0 0 10px 0}

.nb {border: 0 !important}
.nbg {background: 0 !important}

/* Registration / Form */
#sidebar #form {}
#sidebar label, #symposionregistration label {font: normal 11px Arial, Helvetica, sans-serif; color: #666}
#sidebar .inputfield, #symposionregistration .inputfield {font: normal 12px Arial, Helvetica, sans-serif; color: #000; border: 1px solid #999; background: #F8F8F8; padding: 2px; width: 80%}
#sidebar .inputfield:focus, #symposionregistration .inputfield:focus, #block01 input:focus {border: 1px solid #8F63C7; background: #F5F1FA}
#sidebar dd, #symposionregistration dd {margin: 0 0 5px 0}
#ajaxfeedback{width: 80%; padding: 2px 4px; font: normal 11px Arial, Helvetica, sans-serif; color: #fff; background: #F30}


/* Addons */
a#flyerkk {display: block; height: 160px; width: 100%; padding: 0 0 0 115px; background: #fff url(../upload/Downloads/bilder/kunstkommissare_cover.png) top left no-repeat}
a#flyerkk:hover {color: #000; display: block; height: 160px; width: 100%; padding: 0 0 0 115px; background: #fff url(../upload/Downloads/bilder/kunstkommissare_cover.png) top left no-repeat}
#fblike {float: left; clear: both; overflow: hidden; padding: 20px 0}
small.in_english {display: block; padding: 0 0 0 20px; background: transparent url(i/flag_gb.png) 0 50% no-repeat; font-weight: normal; display: block; font-size: 12px}
small.englishtitle a:hover {background: 0 !important}
.hide {display: none}
.star {color: red; display: inline !important}
.formhinweis {display: block; font: normal 11px Arial, Helvetica, sans-serif; color: #333}
.fll {float: left}
.thumb {margin: 5px 10px 10px 0; vertical-align:baseline}
a.guided_tour {display: block; padding: 0 0 10px 52px; background: #fff url(i/icon_guided_tour.png) left top no-repeat; margin: 0 0 10px 0}
a.guided_tour:hover {background: #fff url(i/icon_guided_tour.png) left top no-repeat !important; color: #000 !important}

form#pressakk {overflow: hidden}
form#pressakk input .fll {float: left !important; margin: 1px 5px 0 0}
form#pressakk small {font-size: 11px; display: block; color: red}

form#pressakk label {font: normal 13px Arial, Helvetica, sans-serif; display: inline-block; width: 200px}
form#pressakk label.left {text-align: left; width: 90px; padding: 0 5px 0 0; }
form#pressakk label.right {width: 500px}
#pressakk div#block00, #pressakk div#block01, #pressakk div#block02 {width: 100%; overflow: hidden; padding: 0 0 20px 0}
#pressakk div#block00, #pressakk div#block02 {padding-left: 0}
#block00 label {float: left; display: inline-block; width: 80% !important}
#pressakk div#block01, #pressakk div#block02 {height: auto}
#pressakk div#block04, #pressakk div#block05, #pressakk div#block06, #pressakk div#block07 {width: 400px; height: 380px; display: inline-block !important;overflow: hidden}
#pressakk div#block04 div, #pressakk div#block05 div, #pressakk div#block06 div, #pressakk div#block07 div {width: 90%; position: relative; display: inline-block !important; overflow: hidden; padding: 5px 0 5px 25px}
#pressakk div#block04 div input, #pressakk div#block05 div input, #pressakk div#block06 div input, #pressakk div#block07 div input {position: absolute; top: 5px; left: 0}

#block01 div {padding: 5px 0}
#block01 input {font: normal 12px Arial, Helvetica, sans-serif; color: #000; border: 1px solid #999; background: #F8F8F8; padding: 2px; width: 300px}
#block00 input, #block02 input {clear: none; margin: 0 5px 0 0}
#block02 label {float: left; display: inline-block; width: 80% !important}
div#block03 {width: 800px !important; padding: 10px 0 20px 0 !important}

h2.check {padding-left: 30px !important; background: #fff url(i/icon_check.png) left 50% no-repeat; text-decoration: blink !important}

span.beschriftung {display: block; padding: 2px 0 2px 20px; background: #fff url(i/symbol_beschriftung.png) 0 50% no-repeat}
span.audioguide {display: block; padding: 2px 0 2px 20px; background: #fff url(i/symbol_audioguide.png) 0 50% no-repeat}
span.rollis {display: block; padding: 2px 0 2px 20px; background: #fff url(i/symbol_rollis.png) 0 50% no-repeat}
span.wc {display: block; padding: 2px 0 2px 20px; background: #fff url(i/symbol_wc.png) 0 50% no-repeat}
span.hund {display: block; padding: 2px 0 2px 20px; background: #fff url(i/symbol_hunde.png) 0 50% no-repeat}
span.cafe {display: block; padding: 2px 0 2px 20px; background: #fff url(i/symbol_cafe.png) 0 50% no-repeat}
span.eingang {display: block; padding: 2px 0 2px 20px; background: #fff url(i/symbol_eingang.png) 0 50% no-repeat}
span.parkplatz {display: block; padding: 2px 0 2px 20px; background: #fff url(i/symbol_parkplatz.png) 0 50% no-repeat}

/* Guided Tours */
table.guidedtours, table.mixedtours {margin-bottom: 15px}
table.guidedtours td, table.mixedtours td {border-bottom: 1px dotted #666; padding: 5px 0}
table.guidedtours td.gt01 {width: 75%}
table.guidedtours td.gt02 {width: 10%}
table.guidedtours td.gt03 {width: 15%; text-align: right}

table.mixedtours td.mt01, table.mixedtours td.mt03 {width: 35%}
table.mixedtours td.mt02 {width: 10%; text-align: center}