/* ------------------------------------------------- */ /* COMMON STYLES /* ------------------------------------------------- */ body { font:75%/100% Helvetica, Arial, sans-serif; color:#111; background:#FFF; } h1 { font:2em/1em Helvetica, Arial, sans-serif; font-weight:bold; color:#FFF; } h2 { font:2em/1em Helvetica, Arial, sans-serif; font-weight:bold; color:#111; margin-bottom:5px; } /* h3 { font:1.15em/1.2em Helvetica, Arial, sans-serif; font-weight:bold; color:#64AA37; } h4 { font:1.15em/1.5em Helvetica, Arial, sans-serif; font-weight:normal; color:#111; } */ h5 { font:1.1em/1.4em Helvetica, Arial, sans-serif; font-weight:bold; color:#64AA37; } p { margin:0 0 0.8em 0; padding:0 0 0 0; line-height:1.4em; text-align:justify; } p.border-bottom { border-bottom:1px dotted #111; padding-bottom:18px; margin-bottom:18px; } a { color:#111; text-decoration:underline; } a:hover { color:#64AA37; text-decoration:none; } h2.green { color:#64AA37; } .gig { color:#64AA37; font-weight:bold; } p.place { font-size:0.8em !important; color:#4d5050; } div.org { font-size: 0.9em; } p.start-tickets { font-size:0.9em !important; line-height:1.3em; margin-bottom:15px; } a.order { color:#4d5050; font-size:0.9em; } label.error { float: right; position: relative; top: 4px; left: -90px; color: #64AA37; } /* ------------------------------------------------- */ /* LAY-OUT RULES /* ------------------------------------------------- */ #wrapper { position:relative; width:950px; margin:0 auto; } #header { float:left; position:relative; width:950px; height:160px; } #content-wrapper { float:left; position:relative; width:770px; padding-left:180px; overflow:hidden; } #content-wrapper #content { float:left; position:relative; width:520px; margin-right:20px; } #content-wrapper #sidebar { float:left; position:relative; width:230px; } #footer { float:left; position:relative; width:770px; margin-left:180px; margin-top: 20px; } /* ------------------------------------------------- */ /* HEADER & MENU & SUB-MENU RULES /* ------------------------------------------------- */ #header img#logo { float:left; display:block; margin-top:62px; margin-right:20px; border:none; } #header #menu { float:left; list-style:none; margin:0; padding:0; width:770px; height:90px; background:url(../img/bg-nav.gif) repeat-x top center; } #header #menu li { float:left; display:block; width:90px; height:89px; list-style:none; margin:0; padding:0; } #header #menu li a { float:left; font:1.25em/1em "ff-meta-web-pro-1","ff-meta-web-pro-2", Helvetica, Arial, sans-serif; font-weight:normal; display:block; width:90px; padding-top:62px; text-align:center; height:28px; background:#FFF url(../img/bg-nav.gif) no-repeat top center; text-decoration:none; } #header #menu li a:hover, #header #menu li.current a { background:#64AA37 url(../img/bg-nav.gif) no-repeat bottom center; color:#FFF; } #header #menu { float:left; list-style:none; margin:0; padding:0; width:770px; height:90px; background:url(../img/bg-nav.gif) repeat-x top center; } #header #sub-menu { float:left; list-style:none; margin:0; padding:0; width:770px; height:50px; } #header #sub-menu li { display:inline; list-style:none; margin:0; padding:0; } #header #sub-menu li a { font:1.15em/4em "ff-meta-web-pro-1","ff-meta-web-pro-2", Helvetica, Arial, sans-serif; padding:0 10px 14px 10px; text-decoration:none; color:#4d5050; } #header #sub-menu li a:hover, #header #sub-menu li.current a { color:#111; background:url(../img/bg-sub-menu.gif) no-repeat bottom center; } /* ------------------------------------------------- */ /* CONTENT STYLES /* ------------------------------------------------- */ #content #content-header { float:left; position:relative; width:520px; height:210px; overflow:hidden; padding-bottom:30px; border-bottom:1px dotted #111; } #content #content-header h1 { position:absolute; top:0; left:0; padding:15px 20px 15px 15px; min-width:150px; max-width:260px; height:180px; background:url(../img/bg-h1-green.gif) no-repeat center right; z-index:100; font-weight:normal; } #content #content-header h1 #caption { position:absolute; left:15px; bottom:15px; font-size:0.5em; line-height:1.4em; font-weight:normal; padding-right: 10px; } #content #content-header h1 #caption strong { color:#111; } #content #content-header div.header { float:left; width:520px; height:210px; } #content #content-header div.slideshow a { position:absolute; display:block; width:520px; height:210px; } /* News & Agenda items ------------------------- */ div.item { float:left; width:520px; overflow:hidden; border-bottom:1px solid #d3d3d3; padding-bottom:20px; padding-top:16px; } div.open { background:#f2f2f3; } div.gratis { background-image:url(../img/gratis.png) !important; background-repeat:no-repeat !important; background-position:top right !important; } div.open div.item-extended div.tabs-content ul.item-sub-menu li a:hover { background:url(../img/bg-nav-hover.gif) repeat-x center -153px; } div.open div.item-extended div.tabs-content ul.item-sub-menu li.current a { background:url(../img/bg-nav-hover.gif) repeat-x center -153px; } div.last { border-bottom:none; } div.item p { font-size:1.1em; } div.item h3 { font-size:1.4em; line-height:1.4em; font-weight:bold; } div.item h5.date { margin-bottom:8px; } div.item-intro { float:left; position:relative; width:520px; } div.item-intro p { font-size:1em; color:#333; padding-right:10px; } a.read-more { font-size:0.9em; } div.item-extended { float:left; position:relative; width:520px; } div.item-extended p { font-size:1em; color:#333; padding-right:10px; } div.item-extended div.tabs-content { float:left; display:block; width:520px; } div.item-extended div.tabs-content div.fotos { float:left; position:relative; display:block; width:520px; height:340px; } div.item-extended div.tabs-content div.fotos a.nav { position:absolute; display:block; z-index:11; width:20px; height:20px; cursor:pointer; top:50%; margin-top:-10px; background:url(../img/scrollable.gif) no-repeat; } div.item-extended div.tabs-content div.fotos a.nav span { display:none; } div.item-extended div.tabs-content div.fotos a.prev { left:0px; background-position:0 0; } div.item-extended div.tabs-content div.fotos a.next { right:0px; background-position:-20px 0; } div.item-extended div.tabs-content div.fotos a.disabled { display:none; } div.item-extended div.tabs-content div.video { float:left; position:relative; display:block; width:520px; height:340px; } div.item-extended div.tabs-content ul.item-sub-menu { float:left; width:520px; list-style:none; margin:10px 0 10px 0; padding:0; background:url(../img/bg-nav.gif) repeat-x center -63px; } div.item-extended div.tabs-content ul.item-sub-menu li { float:left; list-style:none; margin:0; padding:0; display:inline; } div.item-extended div.tabs-content ul.item-sub-menu li a { float:left; display:block; text-decoration:none; padding:0px 10px 15px 10px; color:#4d5050; } div.item-extended div.tabs-content ul.item-sub-menu li a:hover { background:url(../img/bg-nav.gif) repeat-x center -153px; color:#111; } div.item-extended div.tabs-content ul.item-sub-menu li.current a { background:url(../img/bg-nav.gif) repeat-x center -153px; color:#111; font-weight:bold; } div.scrollable { float:left; position:relative; width:520px; height:340px; overflow:hidden; z-index:10; } div.scrollable div.items { position:absolute; width:20000em; height:340px; top:0; left:0; } div.scrollable div.items .item { float:left; width:520px; height:340px; } /* Agenda specific rules ------------------------ */ #month-header { padding-top:10px; float:left; position:relative; width:520px; z-index:100; } #month-header #select-months { position:absolute; top:8px; right:0; z-index:500; } #month-header #select-months li.selector { display:block; line-height:35px; color:#4d5050; text-align:right; cursor:pointer; } #month-header #select-months li.selector span { padding:0 20px; } #month-header #select-months li.selector:hover { background:#f2f2f3; color:#111; margin-bottom:1px; border-bottom:1px dotted #d3d3d3; } #month-header #select-months li.selector:hover ul { display:block; } #month-header #select-months ul { background:#f2f2f3; list-style:none; margin:0; padding:0; display:none; } #month-header #select-months ul li { list-style:none; margin:0; padding:0; } #month-header #select-months ul li.last a { border-bottom:none; } #month-header #select-months ul li a { display:block; padding:0 20px; text-align:right; text-decoration:none; border-bottom:1px dotted #d3d3d3; } #month-header #select-months ul li a span { font-size:0.8em; color:#333; padding:0 !important; } #month-header #select-months ul li a:hover { background:#64AA37; color:#FFF; } div.item div.left { float:left; width:105px; } div.item div.left h5.date { color:#111; } div.item div.left img { display:block; border:1px solid #4d5050; } div.item div.right { float:right; width:415px; } div.item div.right h3 { font-size:1.1em; line-height:1.4em; font-weight:normal; } div.item div.right p.start { margin-top:2.7em; } div.agenda div.item.hover { background:#f2f2f3; cursor:pointer; } div.agenda div.item.hover div.item-extended div.tabs-content ul.item-sub-menu li a:hover { background:url(../img/bg-nav-hover.gif) repeat-x center -153px; } div.agenda div.item.hover div.item-extended div.tabs-content ul.item-sub-menu li.current a { background:url(../img/bg-nav-hover.gif) repeat-x center -153px; } div.agenda div.item div.right div.item-extended { width:415px; } div.agenda div.item div.right div.item-extended div.tabs-content { width:415px; } div.agenda div.item div.right div.item-extended div.tabs-content div.fotos { width:415px; height:270px; } div.agenda div.item div.right div.item-extended div.tabs-content div.video { width:415px; height:270px; } div.agenda div.item div.right div.item-extended div.tabs-content ul.item-sub-menu { width:415px; } div.agenda div.item div.right div.scrollable { width:415px; height:270px; } div.agenda div.item div.right div.scrollable div.items { height:270px; } div.agenda div.item div.right div.scrollable div.items .item { width:415px; height:270px; } div.concept div.introductie { float:left; width:520px; padding:16px 0; border-bottom:1px dotted #111; } div.concept div.item div.right p.place { margin-bottom:0; } div.concept div.item { padding-bottom:16px; } div.concept div.item h3 a { color:#64AA37; text-decoration:none; } div.faciliteiten div.text { float:left; width:520px; padding:16px 0; } /* ------------------------------------------------- */ /* SIDE BAR STYLES /* ------------------------------------------------- */ #sidebar h3 { float:left; width:155px; background:#64AA37; height:30px; font:1.2em/2em "ff-meta-web-pro-1","ff-meta-web-pro-2", Helvetica, Arial, sans-serif; color:#FFF; padding-left:75px; margin-bottom:15px; } #sidebar div.left { width:75px; float:left; } #sidebar div.left h5 { color:#111; } #sidebar div.right { width:155px; float:right; } #sidebar div.right h4 a { text-decoration:none; } #sidebar ul.list { float:left; width:230px; list-style:none; margin-bottom:30px; } #sidebar ul.list li { float:left; width:230px; list-style:none; border-bottom:1px solid #bfbfbf; padding-bottom:5px; margin-bottom:10px; } #sidebar ul.list li.last { border-bottom:none; } #sidebar ul.list li.last a { color:#4d5050; } #sidebar ul.list div.right h4 { line-height:18px; } /* ------------------------------------------------- */ /* FOOTER STYLES /* ------------------------------------------------- */ #footer a { text-decoration: none; } #footer p { border-top:1px solid #111; border-bottom:1px solid #111; line-height:30px; } #footer ul { list-style:none; margin:0; padding:0; margin-top:23px; padding-bottom:60px; } #footer ul li { list-style:none; margin:0; padding:0; display:inline; float:left; padding-right:30px; } /* CLEAR FIX by Jeff Starr */ .clearfix:after { visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0; } * html .clearfix { zoom: 1; } /* IE6 */ *:first-child+html .clearfix { zoom: 1; } /* IE7 */