﻿@charset "utf-8";

/*///////////////////////// GENERAL ///////////////////////////////*/

html {
	background: url("gifs/background-gradient.jpg") repeat-x #FFF;
	-webkit-font-smoothing: antialiased;
	height:100%;
}

body {
	margin: 0px;
	padding: 0px;
	font-family: 'AvantGarde Book', Arial, sans-serif;
	font-size: 16px;
	line-height: 1.6em;
	color: #000;
	/*/background: url("gifs/background-content.jpg") center top  no-repeat; /*/
	position: relative;
	height: 100%;
}

sup {
	font-size: 10px;
}

td {
	font-size: 15px;
}

body.overlay:after{
  	content:'';
  	width:100%;
  	height:100%;
  	top:0px; left:0px;
  	z-index:0;
  	opacity:.8;
	position:fixed; top:0; left:0; bottom:0; right:0;
  	background:#000;
}

body.overlay{ /* Prevents scrolling */
  	overflow:hidden;
  	max-height:100%;
  	max-width:100%;
}

/*///////////////////////// FONTS /////////////////////////////////*/


@font-face {
	font-family:"AvantGarde Bold";
	src:url("/_includes/fonts/AvantGardeBold.eot?#iefix");
	src:url("/_includes/fonts/AvantGardeBold.eot?#iefix")
	format("eot"), url("/_includes/fonts/AvantGardeBold.woff")
	format("woff"), url("/_includes/fonts/AvantGardeBold.ttf")
	format("truetype"), url("/_includes/fonts/AvantGardeBold.svg#AvantGardeBold")
	format("svg");
}
@font-face{
	font-family:"AvantGarde Book";
	src:url("/_includes/fonts/AvantGardeBook.eot?#iefix");
	src:url("/_includes/fonts/AvantGardeBook.eot?#iefix")
	format("eot"), url("/_includes/fonts/AvantGardeBook.woff")
	format("woff"), url("/_includes/fonts/AvantGardeBook.ttf")
	format("truetype"), url("/_includes/fonts/AvantGardeBook.svg#AvantGardeBook")
	format("svg");
}
@font-face{
	font-family:"AvantGarde Demi";
	src:url("/_includes/fonts/AvantGardeDemi.eot?#iefix");
	src:url("/_includes/fonts/AvantGardeDemi.eot?#iefix")
	format("eot"), url("/_includes/fonts/AvantGardeDemi.woff")
	format("woff"), url("/_includes/fonts/AvantGardeDemi.ttf")
	format("truetype"), url("/_includes/fonts/AvantGardeDemi.svg#AvantGardeDemi")
	format("svg");
}
@font-face{
	font-family:"AvantGarde Medium";
	src:url("/_includes/fonts/AvantGardeMedium.eot?#iefix");
	src:url("/_includes/fonts/AvantGardeMedium.eot?#iefix")
	format("eot"), url("/_includes/fonts/AvantGardeMedium.woff")
	format("woff"), url("/_includes/fonts/AvantGardeMedium.ttf")
	format("truetype"), url("/_includes/fonts/AvantGardeMedium.svg#AvantGardeMedium")
	format("svg");
}

@font-face{
	font-family:"FontAwesome";
	src:url("/_includes/fonts/FontAwesome.eot?#iefix");
	src:url("/_includes/fonts/FontAwesome.eot?#iefix")
	format("eot"), url("/_includes/fonts/FontAwesome.woff")
	format("woff"), url("/_includes/fonts/FontAwesome.ttf")
	format("truetype"), url("/_includes/fonts/FontAwesome.svg#AvantGardeMedium")
	format("svg");
}





/*///////////////////////// HEADER ////////////////////////////////*/

#header {
	width: 850px;
	height: 200px;
	margin: auto;
}

#logo {
	width: 160px;
	height: 150px;
	margin-top: 15px;
	float: left;
}


/*/////////////////////////// NAVIGATION //////////////////////////*/

#navigation {
	width: 610px;	/* 680 - 40 - 40 */
	margin-top: 15px;
	padding: 0 30px;
	margin-left: 10px;
	float: left;	
}
/* reset css */
#navigation ul,
#navigation li,
#navigation h2 {
	margin: 0;
	padding: 0;
	list-style: none;
	text-transform: lowercase;
}
/* overall styles */
#navigation a,
#navigation li ul li:hover ul li a {
	text-decoration: none;
	color: #676767;
}
#navigation h2 a,
#navigation a:hover,
#navigation a:active,
#navigation a.active,
#navigation li ul li:hover a,
#navigation li ul li:hover ul li a:hover,
#navigation li ul li:hover ul li a:active,
#navigation li ul li:hover ul li a.active,
#navigation ul.taalswitch li a.active {
	color: #907030;
}
#navigation li ul li,
#navigation ul.taalswitch li {
	padding: 0 4px;
	border-right: 1px solid #DDD6C8;
	float: left;	
}

:root #navigation li ul li { letter-spacing: -.5px \0/IE9; }  /* IE9 */

#navigation li ul li.first {
	padding-left: 0;	
}
#navigation li ul li.last,
#navigation ul.taalswitch li.last {
	border-right: none;
	*width: 65px;
}
#navigation li ul li ul li.last {
	*width: auto;
}
#navigation h2 {
	margin-top: 55px;
	padding-bottom: 2px;
	margin-bottom: 1px;
	border-bottom: 1px solid #DDD6C8;	
}
#navigation li ul li a,
#navigation ul.taalswitch li a {
	font-family: 'AvantGarde Book', Arial, sans-serif;
	font-size: 14px;
	font-weight: bold;	

	*display: block;
}
#navigation li ul li ul {
	position: absolute;	
}
#navigation li ul li ul li a {
	font-weight: normal;
	padding-bottom: 10px;
	
	*padding-bottom: 0;	
}

#navigation ul.taalswitch {
	top: 52px;
	margin-left: 655px;
	position: absolute;		
}


/* IPAD NAVIGATION FIX */
@media only screen and (device-width: 768px) { 
	#navigation li ul li a { font-size: 10px; }
}


/*///////////////////////// SOCIAL MEDIA //////////////////////////*/

#loginStatus {
	margin-top: 55px;
	margin-right: 45px;
	float: right;	
}

#social {
  text-align: center;
  float: left;
  padding-top: 20px; 
}

.smGlobalBtn{ /* global button class */
    display: inline-block;
    position: relative;
    cursor: pointer;
    width: 26px;
    height: 26px;
    box-shadow: 0 2px 2px #999;
    margin: 0px 4px 0 0;
    text-decoration: none;
    text-align: center;
    color: #676767;
    font-size: 13px;
    font-weight: normal;
    line-height: 2em;
    border-radius: 15px;
    -moz-border-radius:15px;
    -webkit-border-radius:15px;
}

/* facebook button class*/
.facebookBtn{
    background: #fff;
	text-decoration: none;
}

.facebookBtn:before{ /* use :before to add the relevant icons */
    font-family: "FontAwesome";
    content: "\f09a"; /* add facebook icon */
}

.facebookBtn:hover{
    color: #fff;
    background: #000;
	text-decoration: none;
}

/* twitter button class*/
.twitterBtn{
    background: #fff;
	text-decoration: none;
}

.twitterBtn:before{
      font-family: "FontAwesome";
      content: "\f099"; /* add twitter icon */
}

.twitterBtn:hover{
    color: #fff;
    background: #000;
	text-decoration: none;
}

/* linkedin button class*/
.linkedinBtn{
    background: #fff;
	text-decoration: none;
}

.linkedinBtn:before{
      font-family: "FontAwesome";
      content: "\f0e1"; /* add linkedin icon */
}

.linkedinBtn:hover{
    color: #fff;
    background: #000;
	text-decoration: none;
}

/* instagram button class*/
.instagramBtn{
    background: #fff;
	text-decoration: none;
}

.instagramBtn:before{
      font-family: "FontAwesome";
      content: "\f16d"; /* add linkedin icon */
}

.instagramBtn:hover{
    color: #fff;
    background: #000;
	text-decoration: none;
}

/* vimeo button class*/
.vimeoBtn{
    background: #fff;
	text-decoration: none;
}

.vimeoBtn:before{
      font-family: "FontAwesome";
      content: "\f27d"; /* add linkedin icon */
}

.vimeoBtn:hover{
    color: #fff;
    background: #000;
	text-decoration: none;
}


/*/////////////////////////// CONTENT /////////////////////////////*/

#main {
	width: 950px;
	margin: auto;
}

#content {
	width: 690px;
	padding-bottom: 160px;
	float: left;
}

#content .framed {
	margin: 0px 0px 25px;
	padding: 5px;
	background-color: #f7f7f7;
}


#leftcolumn {
	width: 310px;
	margin-right:30px;
	float: left;
}


#rightcolumn {
	width: 300px;
	float: left;	
}

#leftcolumn div,
#rightcolumn div {
	width: 250px;
	padding: 15px;
	margin-top: 30px;
}


.gray {
	background: #f3f3f3;
}

#home-blocks {
	margin-bottom: 253px;
}

#home-blocks ul.overview {
	width: 706px;
	margin-left: -40px;
}

#home-blocks ul.overview li {
	width: 335px;
	height: 265px;
	list-style: none;
	float: left;
	position: relative;
	border: 0px;
	margin: 0px 18px 15px 0px;
}

#home-blocks ul.overview li :hover {
	color: #ffffff;
}

#home-blocks ul.overview li img {
	width: 335px;
	height: 265px;
	position: absolute;
}

#home-blocks ul.overview li h4 {
	width: 295px;
	padding: 5px 20px;
	bottom: -2px;
	font-family: 'AvantGarde Book', Arial, sans-serif;
	text-align: left;
	position: absolute;
	background: url("/gifs/transparent-overlay.png");
}

/*/////////////////////////// SIDEBAR /////////////////////////////*/

#sidebar {
	width: 200px;
	margin-right: 50px;
	float: left;
}

#sidebar h1 {
	font-size: 18px;
	line-height: 16px;
	margin: 0px;
	padding: 0px;
	text-transform: lowercase;
	text-align: right;
	font-family: 'AvantGarde Demi', Arial, sans-serif;
}

#sidebar h2 {
	font-size: 14px;
	line-height: 14px;
	margin: 0px 0px 3px 0px;
	padding-top: 0px;
	color: #676767;
	text-transform: lowercase;
	font-family: 'AvantGarde Demi', Arial, sans-serif;
}

#sidebar .banner {
	background-color: #e1e1e1;
}

#sidebar .banner,
#sidebar .banner-rollover {
	margin-top: 40px;
	padding: 10px;
	padding-bottom: 2px;
	cursor: pointer;
	color: #000402;
}

#sidebar .banner a,
#sidebar .banner-rollover a {
	font-weight: bold;
	text-decoration: none;
}

#sidebar .banner a:hover,
#sidebar .banner-rollover a {
	font-weight: bold;
	text-decoration: underline;
}

#sidebar #sponsors {
    position: relative;	
	top: 250px;
    left: 2px;
}


#sidebar #sponsors h2 {
	padding: 0;
	margin: 0;
	text-align: center;
	font-size: 15px;
	color: #C3C3C3;
	font-family: 'AvantGarde Demi', Arial, sans-serif;
}
#sidebar #sponsors a {
	position: absolute;	
}
#sidebar #sponsors a img {
	border: 0;
}

/*///////////////////////// SLIDER HOMEPAGE ////////////////////////////////*/
	
#slider {
	margin-top: 8px;
	padding-top: 8px;
	width: 690px;
	height: 300px;
	float: left;
}

#slider .item {
	width: 690px;
	height: 300px;
	position: absolute;
}

#slider .controller {
	margin-left: 50%;
	float: left;
	padding-top: 6px;
	/* als er maar 1 splash screen is */
	/* display: none; */
}

#slider .controllers {
	width: 8px;
	height: 8px;
	margin: 6px 3px 5px 0px;
	cursor: pointer;
	float: left;			
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #cccccc;
}

#slider .controllers.active {
	background: #c4a66e;
}

/*///////////////////////// FOOTER ////////////////////////////////*/

footer {
	width: 100%;
	height: 85px;
	background-color: #000402; 
  	right: 0px;
  	bottom: 0px;
  	left: 0px;
	text-align: center;
	position: fixed;
}

footer .container {
	width: 850px;
	color: #ffffff;
	margin: auto;
	padding-top: 0px;
}

footer .container #navigationBottom {
	margin: 0px 0px 14px 216px;
	padding: 0px;
	list-style: none;
	text-transform: lowercase;
	background-color: #ddffcc;
}
/* reset css */
footer .container #navigationBottom ul,
footer .container #navigationBottom li,
footer .container #navigationBottom h2 {
	margin: 0;
	padding: 0;
	list-style: none;
	text-transform: lowercase;
	float: left;
	font-family: 'AvantGarde Book', Arial, sans-serif;
	font-size: 14px;
	font-weight: bold;	

}
/* overall styles */
footer .container #navigationBottom a,
footer .container #navigationBottom li:hover {
	text-decoration: none;
	color: #ffffff;
}
footer .container #navigationBottom h2 a,
footer .container #navigationBottom a:hover,
footer .container #navigationBottom a:active,
footer .container #navigationBottom a.active,
footer .container #navigationBottom li ul li:hover a,
footer .container #navigationBottom li ul li:hover ul li a:hover,
footer .container #navigationBottom li ul li:hover ul li a:active,
footer .container #navigationBottom li ul li:hover ul li a.active {
	color: #ffffff;
	text-decoration: none;
}
footer .container #navigationBottom li {
	padding: 0 4px;
	text-decoration: none;
	border-right: 1px solid #ffffff;
	float: left;	
}

footer .container #navigationBottom h2 {
	padding-top: 0px;
	padding-bottom: 2px;
	margin-bottom: 1px;
	border-bottom: 1px solid #ffffff;	
}

footer .container .copyrights {
	font-size: 11px;
	display: block;
	clear: both;
	margin: 0px 0px 24px 216px;
	padding-top: 0px;
	text-align: left;
}

#footer {
	width: 850px;
	height: 30px;
	line-height: 40px;
	margin-left: 210px;
	margin-bottom: 30px;
	padding: 0px 45px;
	font-size: 9px;
	color: #676767;
	background: #f3f3f3;
	clear: both;
}

#footer .goofi {
	float: right;
	margin-top: -37px;
	*margin-top: -47px;
}


/*///////////////////////// CASES ////////////////////////////////*/

#statusLogin {
	margin-right: 0px;
	font-weight: normal;
}


.cases-logged-in {
	width: 100%;
	font-size: 12px;
	box-sizing: border-box;
	padding-top: 160px;
	text-align: right;
	color: #676767;
}

.case-private {
	display: none;
}

.case-public {
	display: block;
}

.case-form {
	background-color: #FFF;
	padding: 20px;
	border: 1px solid #EEE;
}

.input.invalid {
	border: 1px solid #C00;
}

.cases-activation-form{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height:100%;
	z-index: 999;
	background-image: url("/gifs/curtain.png")
}

.cases-activation-form .close-form{
	text-align: center;
	padding-right: 50px;
	padding-top: 50px;
}

.cases-activation-form .close-form a{
	color: #FFF;
	font-size: 30px;
}

.cases-activation-form .case-form{
	margin: 0 auto;
	margin-top: 10vh;
	width: 600px;
	height: 425px;
	background-color: #FFF;
	-webkit-box-shadow: 0px 10px 60px 0px rgba(0,0,0,0.32);
	-moz-box-shadow: 0px 10px 60px 0px rgba(0,0,0,0.32);
	box-shadow: 0px 10px 60px 0px rgba(0,0,0,0.32);
}


/*///////////////////////// GENERAL ///////////////////////////////*/

h1 {
	font-family: 'AvantGarde Demi', Arial, sans-serif;
	color: #907030;
	font-size: 38px;
	font-weight: normal;
	line-height: 110%;
	margin-top: 0px;
	margin-bottom: 6px;
	margin-bottom: 8px;	
}
 
h2 {
	font-family: 'AvantGarde Demi', Arial, sans-serif;
	font-size: 29px;
	font-weight: normal;
	line-height: 120%;
	margin: 0px;
	padding: 0px;
	margin-bottom: 6px;
	margin-bottom: 8px;	
}

h3 {
	font-family: 'AvantGarde Book', Arial, sans-serif;
	font-size: 27px;
	line-height: 120%;
	font-weight: normal;
	color: #545454;
	margin: 0px;
	padding: 0px;
}


h4 {
	font-family: 'AvantGarde Book', Arial, sans-serif;
	font-size: 21px;
	line-height: 120%;
	color: #907030;
	font-weight: bold;
	margin: 12px 0px 2px 0px;
	padding: 0px;
}

h5 {
	font-size: 12px;
	line-height: 110%;
	margin: 10px 0px 5px 0px;
	padding: 0px;
}

h6 {
	font-family: 'AvantGarde Book', Arial, sans-serif;
	font-size: 11px;
	line-height: 125%;
	color:  #000402;
	font-weight: normal;
	padding: 0px;
	margin: -2px 0px 0px 36px;
}

h6 a:link {
	color: #000402;
	text-decoration: none;
}


p { 
	font-size: 15px;
	line-height: 145%;
	margin-top: 0px;
	padding-top: 0px; 
}

cite { 
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	display: block;
	text-align: center;
	padding: 0px;
	margin: -14px 0 20px 0px;
}

blockquote {
  background: #ffffff;
  border-left: 10px solid #ddc594;
  margin: 1.25em 0px;
  padding: 1.0em 20px;
  quotes: "\201C""\2019";
}



blockquote p {
  display: inline;
}

blockquote a:link {
  display: inline;
}

.linkedin {
    font-family: 'AvantGarde Book', Arial, sans-serif;
    font-size: 11px;
    line-height: 125%;
    color: #000402;
    font-weight: normal;
    padding: 2px 2px 2px 21px;
    background: url("/gifs/jury/icon-linkedin.jpg") no-repeat left;
    margin: -1px 0px 0px 40px;
    text-decoration: none;
}

.linkedin a:link {
	color: #000402;
	text-decoration: none;
}

.linkedin a:visited {
	color: #000402;
	text-decoration: none;
}

li { 
	font-size: 15px;
	line-height: 145%;
}

a { 
	color: #907030;
	text-decoration: underline;
}

a:hover, a:active {
	text-decoration: underline;
}

.small {
	font-size: 10px;
	line-height: 115%;
}

figcaption {
	font-size: 10px;
	line-height: 115%;
	text-align: right;
	margin-bottom: 20px;
}

.smallest {
	font-size: 12px;
	line-height: 110%;
}

.yellow {
	font-weight: bold;
	color: #907030;
}

.white {
	font-weight: bold;
	color: #ffffff;
}

.black {
	color: #333333;
}

.red {
	color: #f72224;
}

.gold {
	color: #907030;	
}

.title_pink { 
	color: #907030;
	font-weight: bold; 
	font-size: 16px;
	line-height: 17px 
}

.pagetitle {
	color: #000402;
	font-weight: bold;
	font-size: 16px;
}

article {
	-webkit-column-width: 200px;
     -moz-column-width: 200px;
     column-width: 200px;
}

section {
	-webkit-column-width: 225px;
     -moz-column-width: 225px;
     column-width: 225px;
}

section p.uren {
	-webkit-column-width: 100px;
     -moz-column-width: 100px;
     column-width: 100px;
}

.pattern-01 {
		background: url("/gifs/pattern-01.png");
		padding: 4px 16px 12px 16px;
		margin: 18px 0px;

}

.pattern-02 {
		background-color: #907030;
		color: #ffffff;
		padding: 12px 16px 4px 16px;
		margin: 24px 0px 18px 0px;
}

.pattern-02 a:link {
		color: #ffffff;
		
}

.pattern-02 a:visited {
		color: #ffffff;
}

.pattern-02 h3 {
		color: #ffffff;
}

.pattern-03 {
		background-color: #f3f3f3;
		padding: 12px 16px 12px 16px;
		margin: 24px 0px 18px 0px;
}

/*///////////////////////// PARTNER ////////////////////////////////*/

.partner-contact {
	float:left; 
	margin: 10px 10px 1px 0px;
}

.partner-logo {
	float:right; 
	margin: 0px 0px 10px 20px;
}

/* FORMS ------------------------------------------------------------------------------ */
input,
select,
textarea {
	font-family: 'AvantGarde Book', Arial, Helvetica, sans-serif;
	font-size: 14px;
	margin: 3px 0;	
}

.input,
.input_medium,
.input_small,
.input_select,
.input_textarea {
	
	background: url("/gifs/pattern-01.png");
	border: 1px #fff solid;
	border-top: 1px #fff solid;	
	color: #000;
	opacity: .7;
}

.input:hover,
.input_medium:hover,
.input_small:hover,
.input_select:hover,
.input_select_opleidingen:hover,
.input_textarea:hover {
	border: 1px #999 solid;
	border-top: 1px #CCC solid;
}
.input {
	width: 350px;
	height: 25px;
}

.input_medium {
	width: 242px;
	height: 25px;	
}
.input_small {
	width: 99px;	/* 91 voor ipad */
	height: 25px;
}
.input_select {
	width: 352px;
	height: 30px;
}

.input_textarea {
	width: 350px;
	height: 58px;
	overflow: auto;
}
.formButton {
	font-family: 'AvantGarde Demi', Tahoma, Arial, Helvetica, sans-serif;
	font-size: 14px;
	padding: 5px 10px 5px 10px;
	border: 0px;
	color: #ffffff;
	background-color: #b1985c;
	margin-top: 10px;	
}

.formError {
	color: #CF091E;
	background: #FFDFDF;
	position: absolute;
	z-index: 1;
	width: 340px;
	
	opacity: .99;
}
.formError p {
	margin: 15px 15px;
}
.formError ul {
	font-size: 13px;
	line-height: 18px;
	margin-left: 30px;
	margin-top: -15px;
	
	color: #CF091E;
	border: 0;
}
.formError p.smaller {
	margin: 0px 15px;
	cursor: pointer;
	text-decoration: underline;
}
.formError p.smaller:hover {
	text-decoration: none;
}
