/* Theme Name: Jeugdtheaterhuis Theme URI: http://www.jeugdtheaterhuis.nl Description: Website van het Jeugdtheaterhuis in Gouda Version: 2 (WP2.6.2) Author: Thijs van Iersel Author URI: http://www.thijsvaniersel.nl Tags: Jeugdtheaterhuis, Thijs van Iersel, Gouda, Theater */ @import "style/css/typography.css"; @import "style/css/layout.css"; @import "style/css/menu.css"; /* RESET */ * {margin:0; padding:0;} html {overflow-y: scroll;} html, body {height:100%;} body {font-size:62,5%; font-family: arial; background: #fff;} ul {list-style: none;} ol {list-style: none;} #categorien a {font-weight: bold; color: #222; background:white; padding:2px; font-size: 26px; margin: 0 0 8px 0; text-decoration:none;} a img {border:0px; text-decoration: none} img {vertical-align:middle; border:none;} table {border-collapse:collapse;} :link img {border: 0px;} a {color: #3366ff;} /* BG image resizable */ img.source-image { position: absolute; top: 0; left: 0; } /* IE6 BOODSCHAP */ #ie-message {background:#C00; text-align:center; border-bottom:1px solid #900; color: #fff; position:absolute; top:0; padding:5px 0px 5px 0px; width:100%; z-index: 1000;} #ie-message a {color: black; background: white;} /* TEKSTEN */ h1 {border:none; padding: 35px 0px 0px 0px; font-size: 24px; margin: 0px;} h2 {font-size: 17px; font-weight: bold; font-family: Arial;line-height: 20px; margin: 20px 0px 0px 0px;} h3 {font-size: 17px; font-weight: bold; font-family: Arial;line-height: 20px; border-bottom: 1px red solid; width: 800px; margin-top: 20px;} h4 {font-size: 24px; font-family: arial; font-weight: bold; color: green; position: relative; top:10px; padding-bottom: 15px;} h5 {margin-top: 20px;} a {text-decoration: none; cursor: pointer;} p {font-family: arial; text-shadow: 0px 0px; font-size: 12px; word-wrap: normal; color: #000000; line-height: 20px;} em {color: black; font-style:italic; font-weight: 100;} .witregel { background: red; margin: 0px; padding: 0px;} .opsomming { display: inline; margin: 0px; padding: 0px; } /* HANDIGE DINGEN */ .floatLeft {float:left;} .floatRight {float:right;} .clear {clear:both;} .clear_right {clear: right;} .button {border: 1px solid black; background: #222; padding: 3px 8 px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #000000;} .button:hover {background:#d9d9d9; color:#222;} /* OPMAAK */ #page-wrap {width:960px; margin: 0px auto -50px; min-height:100%; height: auto !important; height: 100%; padding: 10px;margin-top: 30px; } #description {font-family: Georgia; font-size: 50px; font-style: italic;} .container {width: 960px; margin: 0 auto; text-align: left; overflow:hidden;} #hele_page_content {width: 700px; float: left;} /* HEADER */ #header {width:960px;} #logo {float:right; position: relative; top: 40px; } #jeugdtheaterhuis_tekst {float:right; height:100px; position: relative; } #zoekveld {position: relative; top:38px;} #search {width:200px; min-height: 50px;} #s {border: 1px solid grey; height: 20px; float: left;} #searchsubmit {width:49px; background: url("images/zoek.png")no-repeat; min-height: 50px; border:none; cursor: pointer; float:right; position: relative; top:-1px;} #button_home {float:left; position: relative; top:73px; } #dotted_divider {z-index: 81000;} .error_search {float: left;} /* Color current buttons */ #Lessen .dropdown1 .link { color:#fba927;} #Voorstellingen .dropdown2 .link { color: #f47f45;} #Projecten .dropdown3 .link { color: #9dc53c;} #Jeugdtheaterhuis .dropdown4 .link { color: #1099d4;} #Lessen h1, #Lessen_onder_12 h1, #Lessen_boven_12 h1, #Leslocaties h1, #Randactiviteiten h1, #Bende_van_Jeugdtheaterhuis h1, #Download_rooster h1 {color:#fba927;} #Voorstellingen h1, #Jan_Steenstraat_1 h1 ,#Oma_Fien h1, #Archief h1 { color: #f47f45;} #Projecten h1, #Project_zelf h1, .projecten h1 { color: #9dc53c;} #Jeugdtheaterhuis h1, #Visie_missie h1, #Medewerkers h1, #Vacatures h1, #contact h1, #Routebeschrijving h1, #Te_huur h1, #Techniek h1 { color: #1099d4;} /* Color current state buttons */ #Lessen .dropdown1 dt, #Lessen_onder_12 .dropdown1 dt, #Lessen_boven_12 .dropdown1 dt, #Leslocaties .dropdown1 dt, #Randactiviteiten .dropdown1 dt, #Bende_van_Jeugdtheaterhuis .dropdown1 dt, #Download_rooster .dropdown1 dt {color:#fba927;} #Voorstellingen .dropdown2 dt, #Jan_Steenstraat_1 .dropdown2 dt ,#Oma_Fien .dropdown2 dt, #Archief .dropdown2 dt { color: #f47f45;} #Projecten .dropdown3 dt, #Project_zelf .dropdown3 dt, .projecten .dropdown3 dt { color: #9dc53c;} #Jeugdtheaterhuis .dropdown4 dt, #Visie_missie .dropdown4 dt, #Medewerkers .dropdown4 dt, #Vacatures .dropdown4 dt, #contact .dropdown4 dt, #Routebeschrijving .dropdown4 dt, #Te_huur .dropdown4 dt, #Techniek .dropdown4 dt { color: #1099d4;} /* Algemeen Menu */ ul li a.laatste {padding-bottom: 10px;} ul li a {line-height: 20px;} /* Menu Lessen */ .dropdown1 {padding-right:5px; float:left ;} .dropdown1 dt {padding:8px 8px 8px 40px; font-size:24px; font-weight:bold; cursor:pointer; background:url(images/Button_Lessen.png) no-repeat; height: 38px; position: relative; top:10px; } .dropdown1 dd {position:absolute; overflow:hidden; width:260px; display:none; background:#fba927; z-index:2000; opacity:0; left: 27px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .dropdown1 ul {width:240px; list-style:none; border-top:none; margin: 0 auto; } .dropdown1 li {display:inline; } .dropdown1 a, .dropdown a:active, .dropdown a:visited {display:block; font-weight: bold; padding: 0px 5px 0px 5px; color:#000000; text-decoration:none; margin-top: 10px; font-size: 12px;} .dropdown1 .underline {border-bottom:1px solid #fbc876; padding-bottom: 5px;} /* Menu Voorstellingen */ .dropdown2 {padding-right:5px; float:left ;} .dropdown2 dt {padding:8px 8px 8px 40px; font-size:24px; font-weight:bold; cursor:pointer; background:url(images/Button_Voorstellingen.png) no-repeat; height: 38px; position: relative; top:10px; } .dropdown2 dd {position:absolute; overflow:hidden; width:180px; display:none; background:#f47f45; z-index:2000; opacity:0; left: 163px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .dropdown2 ul {width:160px; list-style:none; border-top:none; margin: 0 auto;} .dropdown2 li {display:inline; } .dropdown2 a, .dropdown a:active, .dropdown a:visited {display:block; font-weight: bold; padding: 0px 5px 0px 5px; color:#000000; text-decoration:none; margin-top: 10px; font-size: 12px;} .dropdown2 .underline {border-bottom:1px solid #fbc876; padding-bottom: 5px;} /* Menu Projecten */ .dropdown3 {padding-right:5px; float:left ;} .dropdown3 dt {padding:8px 8px 8px 40px; font-size:24px; font-weight:bold; cursor:pointer; background:url(images/Button_Projecten.png) no-repeat; height: 38px; position: relative; top:10px; } .dropdown3 dd {position:absolute; overflow:hidden; width:230px; display:none; background:#9dc53c; z-index:2000; opacity:0; left: 385px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .dropdown3 ul {width:210px; list-style:none; border-top:none; margin: 0 auto; } .dropdown3 li {display:inline; } .dropdown3 a, .dropdown a:active, .dropdown a:visited {display:block; font-weight: bold; padding: 0px 5px 0px 5px; color:#000000; text-decoration:none; margin-top: 10px; font-size: 12px;} .dropdown3 .underline {border-bottom:1px solid #cae48b; padding-bottom: 5px;} /* Menu Jeugdtheaterhuis */ .dropdown4 {padding-right:5px; float:left ;} .dropdown4 dt {padding:8px 8px 8px 40px; font-size:24px; font-weight:bold; cursor:pointer; background:url(images/Button_Jeugdtheaterhuis.png) no-repeat; height: 38px; position: relative; top:10px; } .dropdown4 dd {position:absolute; overflow:hidden; width:150px; display:none; background:#1099d4; z-index:2000; opacity:0; left: 555px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .dropdown4 ul {width:140px; list-style:none; border-top:none; margin: 0 auto;} .dropdown4 li {display:inline; } .dropdown4 a, .dropdown a:active, .dropdown a:visited {display:block; font-weight: bold; padding: 0px 5px 0px 5px; color:#000000; text-decoration:none; margin-top: 10px; font-size: 12px;} .dropdown4 .underline {border-bottom:1px solid #8bcbe7; padding-bottom: 5px;} /* INDEX */ #content {float:left; width:800px} #thumb_voorstellingen_links {float:left; margin-top: 10px; width: 400px;} #thumb_voorstellingen_rechts {float:left; margin-top: 10px; width: 400px;} /* ---------- Featured ---------- */ .slideshow { height: 394px; width: 800px; margin: auto } .slideshow img { } /* SIDEBAR */ #sidebar {float:right; width: 154px; } .sidebar_buttons {margin: 10px 0px 0px 8px;} .sidebar_buttons_onder {margin: 10px 0px 0px 8px;} /* PAGINA */ #page { line-height: 20px; } #page a {color: #5781ff;} .pagethumb {float:left; margin-bottom: 10px;} .pagethumb_rechts {float:left;} #content_page_hele_pagina {float:left; width: 800px; margin-bottom: 20px;} .bende {width: 70px; height: 71px; float: right; padding: 0px 0px 0px 30px;} /* PAGINA PROJECTEN TABEL */ #tabel {width: 600px; font-style: normal; font-size: 12px; line-height: 20px; } .tabel_links {width: 100px; float: left; font-style: normal;} .tabel_rechts {width: 500px; float: right;} #rotator { background: url(images/rotator.php) no-repeat center top; width: 700px; height: 150px; } /* AGENDA */ #agenda_page {float: left; width: 800px; padding: 0px;} #agenda_page .datum {font-size: 17px; font-weight: bold; width: 800px; margin-top: 20px;} #agenda_page .plaats {float: left; width: 110px; padding: 3px 0px 3px 0px; font-weight: bold;} #agenda_page .uitleg {float: left; width: 600px; padding: 3px 0px 3px 0px;} #agenda_page .maand {color:#9dc53c; font-size: 24px; font-weight: bold; margin-top: 10px;} /* Aanmelden informatiepakket en algemen styles van de formulieren */ #form {float: left; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#333333; width:800px; text-align: left;} #form label {margin-bottom: 10px; width: 110px; padding-left: 0px; float: left; color: #000000;} #form .text {margin-bottom: 10px; width: 250px; height: 20px; float: left; border: 2px solid black; background: url("images/textarea.gif") repeat-x; font-size: 14px; font-style: italic;} #form .text_klein {margin-bottom: 10px; width: 50px; height: 20px; float: left; border: 2px solid black; background: url("images/textarea.gif") repeat-x; font-size: 14px; font-style: italic;} .text_middel {width:100px; margin-bottom: 10px;height: 20px; float: left; border: 2px solid black; background: url("images/textarea.gif") repeat-x; font-size: 14px; font-style: italic;} #form #message {margin-bottom: 10px; width: 250px; float: left; height: 20px; background: url("images/textarea.gif") repeat-x; border: 2px solid black; font-size: 14px; font-style: italic;} #geboortemaand, #geboortejaar {margin-left: 20px;} #form ol {width: 300px; font-size: 12px; } #form li {width: 600px; margin-bottom: 20px; height: 10px;} #form li .klein {width: 600px;} #submit {background: url("images/verzenden.gif") no-repeat; width: 152px; height: 62px; border: none; cursor: pointer;} #reset {background: url("images/wissen.gif") no-repeat; width: 98px; height: 62px; border: none; cursor: pointer; } #submit_nieuwsbrief {background: url("images/verzenden_nieuwsbrief.gif") no-repeat; width: 152px; height: 62px; border: none; cursor: pointer;} #reset_nieuwsbrief {background: url("images/wissen_nieuwsbrief.gif") no-repeat; width: 98px; height: 62px; border: none; cursor: pointer; } #submit_contact {background: url("images/verzenden_contact.gif") no-repeat; width: 152px; height: 62px; border: none; cursor: pointer;} #reset_contact {background: url("images/wissen_contact.gif") no-repeat; width: 98px; height: 62px; border: none; cursor: pointer; } .loader {width: 20px; height: 20px; padding-right: 20px;} .correct {font-size: 30px; color: black; } /* Aanvullende styles voor nieuwsbrief form */ #nieuwsbrief label {width:110px;} #nieuwsbrief .text_klein {margin-right: 20px;} .radio_buttons {margin-left: 20px;} /* Aanvullende styles voor nieuwsbrief Contactform */ #contact_form label {width:110px;} #contact_form .text_klein {margin-right: 20px;} .text_groot {margin-bottom: 10px; width: 250px; height: 50px; float: left; border: 2px solid black; background: url("images/textarea.gif") repeat-x; font-size: 14px; font-style: italic;} /* POSTS */ .post {float: left; width: 800px; background: transparent url("images/dotted_border_paars.png") no-repeat bottom; padding-bottom: 20px; } #posts {float: left; width: 800px; line-height: 20px;} #post-484 {background: none; padding-bottom: 0px;} .post_thumb {float:left; } .image {float: left; margin-bottom: 20px; padding-top: 10px;} .image_page {float: left; margin-bottom: 20px; padding-top: 10px;} .content_post_tekst {font-size: 12px; font-weight: normal; font-style: normal;} .date_posts {font-weight: bold; font-size: 14px; } .content_post h2 {margin: 5px 0px 0px 0px;} #posts h1 { color: #af68aa;} /* FOOTER */ #footer {width: 960px; margin-top: 10px;} #footer .links {float: left; width: 600px; margin-top: 5px;} #footer .links em {float: left; font-style: normal; font-weight: bold; font-size: 12px;} #footer .footer_links {border-left: 2px solid #b76dc4; margin-left: 20px;} #footer dl {border-right: 2px solid #b76dc4; padding-right: 5px; padding-left:5px; color:grey; font-weight: bold; font-size: 12px; cursor: pointer; float: left; } #footer .rechts {float: right; margin-top: 3px;} #footer .rechts a {margin-left: 10px;} #footer .links_home {float: left; width: 600px; color: white; margin-top: 5px;} #footer .links_home dl {border-right: 2px solid #b76dc4; padding-right: 5px; padding-left:5px; color:white; font-weight: bold; font-size: 12px; cursor: pointer; float: left; } #footer .links_home em {float: left; font-style: normal; font-weight: bold; font-size: 12px; color: white;}