/*Museo Fonts by Jos Buivenga - http://www.josbuivenga.demon.nl/ */
/* IE */
@font-face{font-family:Museo; src:url(../fonts/Museo700-Regular.eot);}
@font-face{font-family:MuseoSans; src:url(../fonts/MuseoSans-500.eot);}

/* non-IE */
@font-face {
font-family:Museo;
src:url(//:) format("No-IE-404"),
url(../fonts/Museo700-Regular.otf) format("opentype");
}

@font-face {
font-family:MuseoSans;
src:url(//:) format("No-IE-404"),
url(../fonts/MuseoSans-500.otf) format("opentype");
}

/*GLOBAL vertical-rhythm-unit 10px*/
* {margin:0;padding:0;}
body {background:#f0eee5 url(../img/line.gif) center 160px repeat-x; color:#22211e; font:12px/20px "Helvetica Neue", Helvetica, Arial, sans-serif; margin:0;}

/*PLAATSING*/
#wrap {background: #fff; margin-left:10px; width: 960px;}
#head {background: #fff url(../img/logo.png) no-repeat 10px 10px; height: 160px;}
#zoeken {float: right; margin: 30px 10px 0 0;}
#content {background: white; margin-bottom: 10px;}
#foot {background: #cfc9c0 url(../img/foot.png) repeat-x top; color: #3f3930; height: auto; margin-left: 0px; padding: 20px 0 20px 10px; width: 950px; text-shadow: 1px 1px #efe9e0;}

/*KLASSEN*/
.x {left:-9999px;position:absolute;top:-9999px;}
.left {float:left}
.right {float:right}

.post {margin-bottom: 30px;}
.meta {color: #BD681A; font-size: 11px; margin-top: 0px;}
.meta .author {font-weight: bold;}
.more {border-top: 1px dotted #aaa; display: block; font-style: italic; height: 19px; margin-top: 10px; text-align: right;}
.article-list {list-style: none;}
.footnote {color: #777; font-style: italic;}

#beschikbare-workshops span {border-bottom: 1px solid; color: blue; cursor: pointer;}
#beschikbare-workshops ul {height: 330px; overflow-y: scroll;}

#beschikbare-workshops .filedunder, #beschikbare-workshops .category {border-bottom: none; color: #777; font-size: 10px;}

p.workshops {padding: 10px 10px; margin-right: 20px; background: #E6E3E0; margin-bottom: 20px; color: #3f3930; text-shadow: 1px 1px #F8F2E9;}

/*VCARD*/
#foot .vcard .type, #foot .vcard .country-name {display: none;}
.vcard, .vcard ul {list-style: none;}
#foot .vcard a.url {color: #3f3930;}
#foot .vcard a.url:hover {border: none}

/*ELEMENTEN*/
h1 a {background: transparent; height: 140px; left: 20px; position: absolute; top: 10px; width: 200px;}
h2 {color: #005A70; font: italic normal 24px/30px "Museo", Georgia, serif; margin-bottom: 10px;}
h3 {font: normal 18px/20px "MuseoSans", "Helvetica Neue", Helvetica, Arial, sans-serif;}
	.workshop h3 a {color: #BD681A; font: bold 11px/20px "Helvetica Neue", Helvetica, Arial, sans-serif; letter-spacing: 1px; text-transform: uppercase;}

.workshop {display: block; float: left; height: 100px; margin: 0 20px 20px 0; width: 120px;}
.workshop h3 {background: rgba(249,241,241,0.8); position: absolute; width: 120px;}
.workshop h3 a {display: block; margin: 0px 5px;}
.workshop:hover h3 {background: #F9F1F1;}

.post-body p, .entry-summary, #about p, #workshops .post ul, #workshops .post ol {margin-bottom: 20px;}
.post-body ul ul, .post-body ol ol {margin-left: 20px;}

embed {margin: 20px 0;}

#galerij ul {list-style: none; margin-bottom: 20px;}
#galerij img {max-width: 100%;}
.imagelist {margin: 0 0 10px 0;}
.imagelist img {margin: 0 5px 5px 0; border: 3px solid #ccc; width: 60px; height: 50px;}

/*MENU*/
#menu {clear:both; float: right; font-family: "MuseoSans", "Helvetica Neue", Helvetica, Arial, sans-serif; height: 30px; list-style: none; margin-top: 70px;}
#menu li {float: left; height: 30px; margin: 0 10px;}
#menu li a {color: #BD681A; font-size: 18px; line-height: 20px; text-decoration: none;}
#menu li a:hover {color: #909E56;}
#reservaties a {background: white url(../img/reservaties.png); border: none; float: left; height: 30px; margin-top: -5px; outline: none; width: 100px;}
#reservaties a:hover, #reservaties a:focus {background-position: 0px -30px;}
#reservaties a:active {background-position: 0px -60px;}
#steun a {background: transparent url(../img/steun.png); border: none; float: left; height: 60px; outline: none; width: 160px;}
#steun a:hover, #steun a:focus {background-position: 0px -60px;}
#steun a:active {background-position: 0px -120px;}

#second-menu {float: left; font-family: "MuseoSans", "Helvetica Neue", Helvetica, Arial, sans-serif; height: 120px; margin-bottom: 10px; width: 960px;}
#second-menu ul {float: left; list-style: none; width: 960px;}
#second-menu li {float: left;}
#second-menu a {background: #C0D38A; color: #fff; float: left; font-size: 21px; height: 30px; padding: 90px 0 0 10px; text-decoration: underline;}
#second-menu a:hover, #second-menu a:focus {color: #CADD9C;}
	#onderwijs a {background: #C0D38A url(../img/onderwijs.jpg); width:230px;}
	#bedr-ver a {background: #C0D38A url(../img/bedr-ver.jpg);width:360px;}
	#prive a {background: #C0D38A url(../img/prive.jpg);width:340px;}
	
/*CATEGORIEMENU*/
.takken ul {list-style: none;}
.takken a {background: #f0eee5; border: 1px solid #f0eee5; color: #22211e; display: inline-block; margin-bottom: 2px; padding: 3px; text-decoration: none; width: 180px;}
.takken a:hover {background: #22211e; border-color: #22211e; color: #fff; font-weight: bold;}
.takken ul ul {background: #f0eee5; display: none; margin: 0; margin-left: 192px; margin-top: -30px; position: absolute; width: 186px;}
.takken ul li {clear: left;}
.takken ul ul li a {margin-bottom: 0px;}
.takken ul li:hover ul {display: block; z-index: 199;}

/*LINKS*/
a img {border: none;}
p a, .post-body a {border-bottom: 1px solid blue; text-decoration: none;}
p a:visited, .post-body a:visited {border-color: blue; color: blue;}
p a:hover, p a:focus, .post-body a:hover, .post-body a:focus  {border-color: #ccc; color: #777;}
p a:active, .post-body a:active {border-color: red; color: red;}

span.more a, a.comments_invite {border: none; color: #BD681A;}
span.more a:hover {border-bottom: 1px solid black; color: black;}

h2 a, h3 a {border: none; color: #909E56; text-decoration: none;}
h3 a:hover, h2 a:hover {border-bottom: 1px solid #909E56; color: #A1AF69;}
.workshop h3 a {color: #BD681A;}
.workshop h3 a:hover {border: none; color: #22211e;}

#foot a {border:none; color: #3f3930; font-weight: bold; text-decoration: none;}
#foot a:hover {border-bottom: 1px solid #3f3930;}
	#foot #steun a:hover {border: none;}
	
.article-nav a {color: #3f3930; font-weight: bold; padding: 4px 0; text-decoration: none; text-transform: uppercase;}
.article-nav a:hover {color: #8f8980;}

.post-body .footnote a {border-color: #999; color: #333;}
.post-body .footnote a:hover {border-color: #ccc; color: #666;}

/*FORMS*/
fieldset {margin:0; padding:0;}
form {margin: 0 0 20px 0;}
fieldset {border:0}
legend {display: none;}
input.zemText, textarea.zemTextarea, select.zemSelect, .zemSubmit {display:block; font: 12px/20px "Helvetica Neue", Helvetica, Arial, sans-serif; margin-bottom: 10px; padding:3px;}
.zemText, .zemSelect {width: 328px;}
textarea.zemTextarea {height: 140px; width: 328px;}
.zemError {background: #afaaa9; color: #fff; list-style: none; margin: -12px 0 8px 0px; padding: 12px;}
label.zemRequired, label.zemRequirederrorElement {font-weight: bold;}
label.zemRequired:after, label.zemRequirederrorElement:after {content: " *";}
label.zemRequirederrorElement {color: #f1761a;}
.zemCheckbox {vertical-align: middle;}

#contact p {margin-bottom: 20px;}

#zoeken form {margin-top: 0; margin-bottom: 0;}
#zoeken input {display: inline; vertical-align: middle;}
#zoeken input[type=text] {height: 18px; margin-right: 10px; width: 220px;}
#zoeken input[type=submit] {height: 22px; width: 80px;}


/*960 Grid System ~ Core CSS.Learn more ~ http://960.gs/
Licensed under GPL and MIT.
*/
/* `Containers
----------------------------------------------------------------------------------------------------*/
.container_16 {margin-left: auto;margin-right: auto;width: 960px;}

/* `Grid >> Global
----------------------------------------------------------------------------------------------------*/
.grid_1, .grid_2, .grid_3, .grid_4,
.grid_5, .grid_6, .grid_7, .grid_8,
.grid_9, .grid_10, .grid_11, .grid_12,
.grid_13, .grid_14, .grid_15, .grid_16 {display: inline;float: left;margin-left: 10px;margin-right: 10px;}
.container_16 .grid_4 {width: 220px;}
.container_16 .grid_8 {width: 460px;}
.container_16 .grid_12 {width: 700px;}
.container_16 .grid_16 {width: 940px;}

/* `Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/
.alpha {margin-left: 0;}
.omega {margin-right: 0;}

/* `Grid >> 16 Columns
----------------------------------------------------------------------------------------------------*/
.container_16 .grid_1 {width: 40px;}
.container_16 .grid_2 {width: 100px;}
.container_16 .grid_3 {width: 160px;}
.container_16 .grid_5 {width: 280px;}
.container_16 .grid_6 {width: 340px;}
.container_16 .grid_7 {width: 400px;}
.container_16 .grid_9 {width: 520px;}
.container_16 .grid_10 {width: 580px;}
.container_16 .grid_11 {width: 640px;}
.container_16 .grid_13 {width: 760px;}
.container_16 .grid_14 {width: 820px;}
.container_16 .grid_15 {width: 880px;}

/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/
/* http://sonspring.com/journal/clearing-floats */
.clear {clear: both;display: block;height: 0;overflow: hidden;visibility: hidden;width: 0;}

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */
.clearfix:after {clear: both;content: ' . ';display: block;font-size: 0;height: 0;line-height: 0;visibility: hidden;width: 0;}
.clearfix {display: inline-block;}
.clearfix {display: block;}
