/*
Theme Name: Festival Wereld van Witte de With
Version: 1.0
Author: Florian Schroiff
Author URI: http://fernstrg.com/
*/

/*
RESET
-----------------------------------*/
html,body,div,span,object,h1,h2,h3,h4,h5,h6,p,a,img,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,hr{margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
ol,ul{list-style:none;}
blockquote:before,blockquote:after,q:before,q:after{content:"";}

/*
CSS 16 COLUMN GRID
-----------------------------------*/
.container_16{margin-left:auto;margin-right:auto;width:960px}
.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;position:relative;margin-left:10px;margin-right:10px}
.alpha{margin-left:0}
.omega{margin-right:0}
.container_16 .grid_1{width:40px}
.container_16 .grid_2{width:100px}
.container_16 .grid_3{width:160px}
.container_16 .grid_4{width:220px}
.container_16 .grid_5{width:280px}
.container_16 .grid_6{width:340px}
.container_16 .grid_7{width:400px}
.container_16 .grid_8{width:460px}
.container_16 .grid_9{width:520px}
.container_16 .grid_10{width:580px}
.container_16 .grid_11{width:640px}
.container_16 .grid_12{width:700px}
.container_16 .grid_13{width:760px}
.container_16 .grid_14{width:820px}
.container_16 .grid_15{width:880px}
.container_16 .grid_16{width:940px}
.container_16 .prefix_1{padding-left:60px}
.container_16 .prefix_2{padding-left:120px}
.container_16 .prefix_3{padding-left:180px}
.container_16 .prefix_4{padding-left:240px}
.container_16 .prefix_5{padding-left:300px}
.container_16 .prefix_6{padding-left:360px}
.container_16 .prefix_7{padding-left:420px}
.container_16 .prefix_8{padding-left:480px}
.container_16 .prefix_9{padding-left:540px}
.container_16 .prefix_10{padding-left:600px}
.container_16 .prefix_11{padding-left:660px}
.container_16 .prefix_12{padding-left:720px}
.container_16 .prefix_13{padding-left:780px}
.container_16 .prefix_14{padding-left:840px}
.container_16 .prefix_15{padding-left:900px}
.container_16 .suffix_1{padding-right:60px}
.container_16 .suffix_2{padding-right:120px}
.container_16 .suffix_3{padding-right:180px}
.container_16 .suffix_4{padding-right:240px}
.container_16 .suffix_5{padding-right:300px}
.container_16 .suffix_6{padding-right:360px}
.container_16 .suffix_7{padding-right:420px}
.container_16 .suffix_8{padding-right:480px}
.container_16 .suffix_9{padding-right:540px}
.container_16 .suffix_10{padding-right:600px}
.container_16 .suffix_11{padding-right:660px}
.container_16 .suffix_12{padding-right:720px}
.container_16 .suffix_13{padding-right:780px}
.container_16 .suffix_14{padding-right:840px}
.container_16 .suffix_15{padding-right:900px}
.container_16 .push_1{left:60px}
.container_16 .push_2{left:120px}
.container_16 .push_3{left:180px}
.container_16 .push_4{left:240px}
.container_16 .push_5{left:300px}
.container_16 .push_6{left:360px}
.container_16 .push_7{left:420px}
.container_16 .push_8{left:480px}
.container_16 .push_9{left:540px}
.container_16 .push_10{left:600px}
.container_16 .push_11{left:660px}
.container_16 .push_12{left:720px}
.container_16 .push_13{left:780px}
.container_16 .push_14{left:840px}
.container_16 .push_15{left:900px}
.container_16 .pull_1{left:-60px}
.container_16 .pull_2{left:-120px}
.container_16 .pull_3{left:-180px}
.container_16 .pull_4{left:-240px}
.container_16 .pull_5{left:-300px}
.container_16 .pull_6{left:-360px}
.container_16 .pull_7{left:-420px}
.container_16 .pull_8{left:-480px}
.container_16 .pull_9{left:-540px}
.container_16 .pull_10{left:-600px}
.container_16 .pull_11{left:-660px}
.container_16 .pull_12{left:-720px}
.container_16 .pull_13{left:-780px}
.container_16 .pull_14{left:-840px}
.container_16 .pull_15{left:-900px}
.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}
.clearfix:after{clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}
.clearfix{display:block}
* html .clearfix{height:1%}

/*
GENERAL
-----------------------------------*/
body{
font:1em/1.5em "Droid Serif", Georgia, serif;
-webkit-text-size-adjust: none;
}
.band{
clear: both;
width:940px;
padding: 0 10px;
}
.widened_right{
margin-right: -10px;
padding-right: 10px;
}
.widened_left{
margin-left: -10px;
padding-left: 10px;
}
a:link#skip_link, a:visited#skip_link{
display: block;
position: absolute;
top:-9000em;
left: 0;
}
a:focus#skip_link{
top:0;
left:0;
}
/*
TYPOGRAPHY
-----------------------------------*/
h2, h3, strong, #main_nav, #footer{
color: #414141;
font:700 1em/1.5em "Helvetica Neue", "Arial", sans-serif;
text-transform: uppercase;
}
.pagination.article strong{
color: #222;
font:700 1em/1.5em "Droid Serif", Georgia, serif;
}
h2{
border-bottom: 1px solid #000;
border-top: 1px solid #000;
clear: both;
line-height: 1.625em;
margin-bottom: 12px;
text-align: center;
}
#news .article h2{
border: 0;
}
#page_title{
line-height: 1.875em;
}
h3{
background: url(../fw/black_bar.png) no-repeat center bottom transparent;
line-height: 1.25em;
margin-bottom: .4375em;
padding-bottom: .4375em;
}
#slideshow h3{
background: url(../fw/white_bar.png) no-repeat center bottom transparent;
}
h4{
font-size: .8125em;
font-style: normal;
line-height:1.5em;
text-transform: uppercase;
}
.overlay h4{margin:2px 0 10px 0;}
h5{
font-weight: 400;
line-height:1.5em;
text-align: center;
margin: .5em 0;
}
#contact h5{
color: #414141;
font-size: .8125em;
font-weight: 700;
margin: 20px 0;
}
a:link, a:visited{
text-decoration: none;
}
a:hover, a:active, a:focus{
text-decoration: underline;
}
a.selected{
cursor: default;
text-decoration: underline;
}
#main_nav a, #super_nav a, .article a, #footer a, h2 a, h5 a, a strong, #tweet a{
color: #000;
}
#tweet_meta {
font-size: .625em;
font-weight: 400;
line-height:1.5em;
}
#tweet_meta a{
color: #414141;
}
#super_nav a{
font-size: .75em;
font-weight: 400;
}
.article{
text-align: center;
}
.article.long .content {
text-align: left;
}
.article p, .article blockquote, .article ul, .article ol{
color: #414141;
font-size: .8125em;
line-height: 1.5em;
margin-bottom: 19px;
}
.article .header{
margin-bottom: .5em;
}
.article.short header{
margin-bottom: .75em;
}
.article .content a:link, .article .content a:visited, .further_reading a:link, .further_reading a:visited {
border-bottom: 1px dotted #414141;
font-weight: 400;
text-decoration: none;
}
.article .content a:hover, .article .content a:active, .article .content a:focus,
.further_reading a:hover, .further_reading a:active, .further_reading a:focus {
border-bottom: 1px solid #414141;
font-weight: 400;
text-decoration: none;
}
.article .content .permalink{
text-align: center;
}
.article .content .permalink a, .article.long .content .permalink a{
background: url(../fw/permalink_arrow.png) no-repeat center right transparent;
display: inline-block;
font-weight: 700;
padding-right: 10px;
}
#slideshow .overlay p{
font-size: .8125em;
line-height:1.5em;
}
#slideshow .overlay a:link, #slideshow .overlay a:visited{
color: #f5f5f5;
font-weight: 700;
}
#slideshow .overlay a:hover, #slideshow .overlay a:active, #slideshow .overlay a:focus{
color: #f5f5f5;
font-weight: 700;
text-decoration: underline;
}
#slide_nav a:link, #slide_nav a:visited{
background: url(../fw/slideshow_link.png) no-repeat center bottom transparent;
border: 0;
display: inline-block;
height: 9px;
overflow: hidden;
padding-left: 6px;
text-decoration: none;
text-indent: -9000em;
width: 9px;
}
#slide_nav a:hover, #slide_nav a:active, #slide_nav a:focus, #slide_nav a.activeSlide{
background: url(../fw/slideshow_link.png) no-repeat center top transparent;
border: 0;
display: inline-block;
height: 9px;
text-decoration: none;
width: 9px;
}
a.youtube {
display: block;
height: 170px;
margin-bottom: 1em;
position: relative;
width: 220px;
overflow: hidden;
}
a.youtube:link span, a.youtube:visited span{
background: url(../fw/video_play.png) no-repeat center center transparent;
color: #f5f5f5;
display: block;
height: 170px;
overflow: hidden;
position: absolute;
top:-9000em;
text-indent: -9000em;
width: 220px;
}
a.youtube:hover span, a.youtube:active span, a.youtube:focus span{
top:0;
left:0;
}
.article_meta strong{
font-size: 16px;
}
.page_nav a:link, .page_nav a:visited{
color: #414141;
font-size: .875em;
margin: 0 .25em;
text-decoration: none;
}
.page_nav a:hover, .page_nav a:active, .page_nav a:focus{
border-bottom: 1px solid #000;
text-decoration: none;
}
.page_nav .selected a{
border-bottom: 1px dotted #000;
cursor: default;
}
.article a.related:link, .article a.related:visited, .related img, .related span{
display:block;
border-bottom: none;
font-size: .875em;
line-height: 1.25em;
}
.article a.related:hover, .article a.related:active{
border-bottom: none;
text-decoration: underline;
}
/*
MASTHEAD
-----------------------------------*/
#masthead{
position: relative;
overflow: hidden;
}
#masthead h1{margin-bottom: 20px;}
#main_nav{
border-top: 1px solid #000;
text-align: justify;
}
#main_nav * {display: inline;}
#main_nav span {display: inline-block; position: relative; width: 940px; height: 0; margin: 0;padding: 0;line-height: 0;}
#main_nav li {font-size:16px; line-height:28px; height:28px;}
#main_nav li a {display: inline-block;  white-space: nowrap;}
#main_nav li.selected{
border-bottom: 3px solid #000;
}
#super_nav{
position: absolute;
top:5px;
right: -10px;
}
#super_nav li{
float:left;
padding: 0 10px 0 0;
}
#searchform input{
background:#e9e9e9;
border: 0;
color: #000;
font:12px/18px "Droid Serif", Georgia, serif;
height: 20px;
margin: 0;
padding: 0 0 0 5px;
width: 85px;
}
#searchform button{
background: url(../fw/search_arrow.png) no-repeat center center #e9e9e9;
border: 0;
cursor: pointer;
height:20px;
margin: 0;
overflow: hidden;
padding: 0;
text-indent: -9000em;
width: 20px;
}
/*
CONTENT
-----------------------------------*/
#main{
border-top: 1px solid #000;
margin: -26px 0 0 0;
position: relative;
}
#archive p a:link, #archive p a:visited{
display: block;
overflow: hidden;
position: relative;
text-decoration: none;
}
#archive.small p a:link, #archive.small p a:visited{
float: left;
font-size: .625em;
height: 100px;
margin: 0 14px 1em 0;
width: 145px;
}
#archive.big p a:link, #archive.big p a:visited{
font-size: .8125em;
height: 130px;
width: 220px;
margin-bottom: 20px;
}
#archive p a:link span, #archive p a:visited span{
color: #fff;
}
#archive p a:hover span, #archive p a:active span, #archive p a:focus span{
background: rgba(0,0,0,.7) ;
color: #f5f5f5;
display: block;
font-weight: 400;
line-height: 1.25em;
padding: 300px 5px 5px 5px;
position: absolute;
bottom:0;
left:0;
text-align: center;
text-decoration: none;
text-transform: uppercase;
}
#archive.small p a:hover span, #archive.small p a:active span, #archive.small p a:focus span{
width: 135px;
}
#archive.big p a:hover span, #archive.big p a:active span, #archive.big p a:focus span{
width: 210px;
}
#archive p a:hover span em, #archive p a:active span em, #archive p a:focus span em{
display: block;
font-family: "Helvetica Neue", "Arial", sans-serif;
font-style: normal;
font-weight: 700;
line-height: 1.25em;
padding-bottom: .25em;
}
#archive p a:link.omega, #archive p a:visited.omega{
margin: 0;
}
#thank_yous p{
text-align: center;
}
#news .article{
padding-top: 2em;
margin-bottom: 0;
}
#news .article .permalink, .article .further_reading, .article .item_informatie{
background: url(../fw/black_bar_short_thick.png) no-repeat center top transparent;
padding-top: .5em;
text-align: center;
}
.article .item_informatie{
padding-top: 1em;
text-transform: uppercase;
}
#news .article h2, .article_meta p, .article .date, .article_meta .categories{
background: url(../fw/black_bar_short.png) no-repeat center bottom transparent;
margin-bottom: 9px;
padding-bottom: 8px;
}
.article_meta .categories a{
display: block;
line-height: 1.5em;
}
#motto{
margin-bottom: 20px;
margin-top: 20px;
}
#page_title, #program_detail #page_title{
clear: both;
margin-top: 20px;
}
#program_detail #page_title{
margin-bottom: 20px; 
}
.image_caption {
padding-bottom: 1em;
}
.image_caption p{
font-size: .6875em;
margin-bottom: .25em;
text-align: left;
}
.linkblocks{
text-align: center;
text-transform: uppercase;
}
.linkblocks h3{
background: transparent;
}
.related{
margin-bottom: 2em;
}
.related.alpha{
clear: left;
}

.related img{
padding-bottom: .5em;
}

#intro{
font-size: 1.25em;
line-height: 1.25em;
padding: 1em 1.5em;
text-align: center;
}
.page_nav{
text-align: center;
}
.page_nav.bottom{
border-top:1px solid #000;
clear: both;
}
.page_nav ul{
margin: 20px auto 0 auto;
}
.page_nav.bottom ul{
margin: 20px auto;
}
.page_nav li{
display: inline-block;
}
#contact .article{
margin-bottom: 3em;
}
#category_nav{
margin-bottom: -5px;
margin-top: 15px;
font-size: .6875em;
}
#category_nav h3{
background: transparent;
border-bottom: 1px solid #999;
color: #414141;
line-height: 1.5em;
}
#category_nav li{
line-height: 1.75em;

}
#category_nav a:link, #category_nav a:visited{
color: #414141;
}
#category_nav a:hover, #category_nav a:active, #category_nav a:focus{
border-bottom: 1px solid #414141;
text-decoration: none;
}
#category_nav .selected a{
border-bottom: 1px dotted #414141;
cursor: default;
}
#articles .permalink{
background: url(../fw/black_bar.png) no-repeat center top transparent;
padding-top: .5em;
text-align: center;
}
.article .permalink{
margin-top: -1em;
}
.article .permalink.padded{
margin-top: 1em;
}
#program #articles .article{
padding-bottom: 1em;
}
#program #articles .article.first{
clear: left;
}
.article.long.alignright .content {
text-align: right;
}
/*
MEDIA - HOME
-----------------------------------*/
#latest_tweet{
background: url(../fw/tweet.png) no-repeat bottom center #fff;
text-align: center;
margin-bottom: -4px;
}
#tweet{
background: #fff;
font-size: 1.0625em;
margin-bottom: -0.5em;
padding-top: .25em;
}
#tweet_meta{
padding: 15px 0 23px 0;
}
.mediablock{
border-bottom: 1px solid #000;
padding-bottom: 1em;
}
.smallblock p{
font-size: .875em;
line-height: 1.5em;
margin-bottom: 1em;
}
#block_newsletter{
text-align: center;
}
#block_newsletter input, #block_newsletter button{
border: 0;
color: #414141;
display: block;
font-family: "Droid Serif", Georgia, serif;
font-size: .8125em;
margin: 0;
padding: 0;
text-align: center;
}

#block_newsletter input.text{
background: #e2e2e2;
line-height: 2em;
margin: 0 0 10px 0;
width: 100%;
}
#block_newsletter button{
background: url(../fw/permalink_arrow.png) no-repeat center right transparent;
border-bottom: 1px dotted #000;
cursor: pointer;
display: inline-block;
text-align:center;
line-height: 1em;
font-weight: 700;
padding-right: 10px;
width:auto;
}
#block_newsletter button:hover{
border-bottom: 1px solid #000;
}
/*
SLIDESHOW
-----------------------------------*/
#slideshow{
height: 350px;
list-style-type: none;
margin: 12px 0 27px 0;
overflow: hidden;
width: 960px;
position: relative;
}
#slide_nav{
position: absolute;
top:363px;
right: 10px;
}
#slideshow li{
background: #fff;
height: 350px;
width: 960px;
}
#slideshow .overlay{
background: #000;
color: #f5f5f5;
padding: 22px;
position: absolute;
text-align: center;
width: 196px;
z-index: -100;
}
#slideshow .top{
top:30px;
}
#slideshow .bottom{
bottom:30px;
}
#slideshow .center-right{
left:480px;
}
#slideshow .center-left{
right:480px;
}
#slideshow .right{
right:0px;
}
#slideshow .left{
left:0px;
}
/* social buttons 
---------------------------------------------- */
.social div{
float: left;
}
#twitter_button{width: 110px;}
#facebook_button{width: 350px;}
/* mobile notice 
---------------------------------------------- */
.mobile_notice{
border-bottom: 2px solid #000;
font-size: 2em;
margin: 0 0 1em 0;
text-align: center;
width: 100%;
}
.mobile_notice a{
color: red;
display: block;
padding: .75em 0;
}

/*
FOOTER
-----------------------------------*/
#footer{
border-top: 1px solid #000;
clear: both;
font-size: .625em;
font-weight: 700;
margin-top: 1em;
padding: .5em 10px 3em 10px;
text-align: center;
text-transform: uppercase;
}
/* BASIC COMMERCIAL
-----------------------------------*/
.wf-basiccommercialw01blk-n4-active h2, 
.wf-basiccommercialw01blk-n4-active #category_nav h3, 
.wf-basiccommercialw01blk-n4-active #slideshow h3,
.wf-basiccommercialw01blk-n4-active #h3,
.wf-basiccommercialw01blk-n4-active strong, 
.wf-basiccommercialw01blk-n4-active #main_nav, 
.wf-basiccommercialw01blk-n4-active #footer,
.wf-basiccommercialw01blk-n4-active #archive p a:hover span em, 
.wf-basiccommercialw01blk-n4-active #archive p a:active span em, 
.wf-basiccommercialw01blk-n4-active #archive p a:focus span em{
font-family:'Basic Commercial W01 Blk';
font-weight: 400;
}
