@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,600);

/*--- STICKY FOOTER AND RESET ----------------------------------------------------------------------------*/

* {
		margin: 0;
		padding: 0; 
  		}

html, body {	
		background-image: url(../images/bg.jpg);
		background-repeat: no-repeat;
        background-position: top left;
        background-attachment: fixed;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300; 
		}

/*--- MENU ------------------------------------------------------------------------------------------------*/

#huidig{
	background-color: #B7B7B7;
	background-image:url(../images/bgpattern.png);
	background-repeat: repeat;	
	color:#444;	
	text-shadow:none;
	border-top: solid 3px rgba(0,0,0,0.2);
}

nav{
		margin: 5px 0 0 25px;
		padding-top:0px;
		}

nav ul{
		list-style-type: none;
		}

nav a{
		float:left;
		margin-right:10px;
		color: #FFF;
		text-shadow:0px 1px 1px rgba(0,0,0,0.3);
		text-decoration: none;
		padding: 5px 10px 5px 10px;		
		background-color:#999;
		border-top:solid 3px rgba(255,255,255,0.2);
		}

nav a:hover{
		background-color:#B7B7B7;
		background-image:url(../images/bgpattern.png);
		background-repeat: repeat;	
		border-top:solid 3px rgba(0,0,0,0.2);
		color:#444;	
		text-shadow:none;	
		}

/*-----------------------------------------------------------------------------------------------------------------*/

#wrapper {
		position: relative;
		width: 960px;
		background-color: #CCC;
		background-image:url(../images/pattern.png);
		background-repeat:repeat;
		margin: 30px auto 30px auto;
		min-height: 200px;
		border-radius: 6px;
		box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.8);
		-moz-box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.8);
		-webkit-box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.8); 
		}

#logo{
		position: absolute;
		z-index:9; /*hoger dan slideshows*/
		top: -10px;
		left: -50px; 
		border-radius:60px;
  		}

/* Slideshow opmaak --------------------------------------------------------------------------------------*/
div#slideshow{ 
		overflow: scroll; /* Allows the slides to be viewed using scrollbar if Javascript isn't available */ 
	    position: relative; 
		z-index: 5;
		width:900px;
		height:240px;
		margin:30px;
		padding:30px 0px 0px 0px;
		}  
div#slideshow ul#navSlideshow {
	display: none;
	list-style: none;
	/*position: absolute; bottom: 0; z-index: 15;*/
	position:relative;
}	
div#slideshow ul#navSlideshow li#prev {
		position:absolute;
		z-index:14;
		top:92px;
		left:30px;
	}
div#slideshow ul#navSlideshow li#next {
		position: absolute;
		z-index: 14;
		top:92px;
		right:30px;
	}
div#slideshow ul#navSlideshow li a {
		display: block; width: 80px; height: 80px; text-indent: -9999px;
	}
div#slideshow ul#navSlideshow li#prev a {
		background-image:url("../images/prev.png");
		background-repeat: no-repeat;
		width: 66px; height: 66px;
		opacity: 0.5;
		}
div#slideshow ul#navSlideshow li#next a {
		background-image:url("../images/next.png");
		background-repeat: no-repeat;
		width: 66px; height: 66px;
		opacity: 0.5;
		}
div#slideshow ul#slides {
		list-style: none;
	}
div#slideshow ul#slides li {
			margin: 0 0 20px 0;
		}

ul#navSlideshow .circleleft
{
	z-index: 13;
	background-color: rgba(0,0,0,0.5);
	position: absolute;
	top: 90px;
	left:20px;
	border-radius: 30px;
	width:60px;
	height: 60px;
}	

ul#navSlideshow .circleright
{
	z-index: 13;
	background-color: rgba(0,0,0,0.5);
	position: absolute;
	top: 90px;
	right: 20px;
	border-radius: 30px;
	width:60px;
	height: 60px;
}	

/*@-webkit-keyframes imageup
{
		from{background-position:%100% 0%;}
		to{background-position:100% 100%;}	
}		
@-moz-keyframes imageup
{
		from{background-position:100% 0%;}
		to{background-position:100% 100% ;}	
}	*/	
		

/* nog gebruikt? */

#btnsSlideshow{
		position:relative;
		z-index:11;
		}	  
  
#btnsSlideshow .btn{
		width:10px;
		height:10px;
		float:right;
		margin:235px 0px 0px 0px;
		border: solid 5px #85a432;
		border-radius:10px;
		background:rgba(255,255,255,0.9);
		box-shadow: 0px 0px 9px rgba(0,0,0,1);
		position:absolute;
		z-index:12;
		}

#btnsSlideshow .btn:hover{	
		cursor:pointer;
		}	

#btn1{right:50px;}
#btn2{right:80px;}
#btn3{right:110px;}		

/*--------------------------------------------------------------------*/

#content{
		z-index:10;
		position:relative;
		clear: both;
		background-color: #B7B7B7;
		padding: 30px;
		margin-bottom: 30px; 
		background-image:url(../images/bgpattern.png);
		background-repeat: repeat;	
		border-bottom: solid 1px rgba(0,0,0,0.2);	
		overflow: hidden;
  		}

h1{
		font-style:normal;
  		font-weight:600;
		font-size:1.5em;
		color: #333; 
		color:rgba(0,0,0,0.7);
		clear:both;
		text-shadow:0px 1px 0px #FFF;
		margin-bottom:1em;
		}

h2{
		font-size: 1.2em;
		margin-top:0.5em;
		padding:0.2em 0em 0.2em 0.4em;
		border: dotted 1px #06C;
		border-radius: 2px;
		color:#06C;
		background-color: rgba(0,0,0,0.1);
		}		

p{
		line-height:1.5em;
  		color: #333; 
		}

.melding{font-style:italic; color:#666; font-size:14px; padding:2em 0em 0em 0em; width:80%; line-height:1.75em;}		

.imgleft{float:left; margin:1em 1em 1em 0em; max-width:33%;}
.imgright{float:right; margin: 1em 0em 1em 1em; max-width:33%;}	

.thumbnailContainer{overflow: hidden;
                    clear: both;}

.thumbnailContainer img
{
	float:  left;
	margin: 10px 10px 0 0;
}

.lightbox {
		display: none;
		position: absolute;
		width: 600px;
		height: 400px;
		border: 5px solid #999;
		top: 50%;
		left: 50%;
		margin-left: -300px;
		margin-top: -200px;
		background-color:white;
		background-position: center center;
		background-repeat: no-repeat;
		cursor: pointer;	
	}

/*--- LINKS & PRIJSLIJST TABLE ------------------------------------------------------------------------------------------------*/

table{margin-top:1em;}

.links td{padding:0.5em 1em 0.5em 0em;}	
.links tr{background-color:transparent!important;}
.links{display:inline-block;}
#logowrapper{float:right; display:inline-block; margin-top:50px;}	
#logowrapper img{margin-left:2em;}

#jeugdkampen,#prijslijst{width:100%; border-collapse: collapse;}
th{padding-bottom:0.5em; text-shadow:0px 1px 1px #FFF;}
th, td{text-align: left; padding:0.5em 0em 0.5em 0.3em;}
tr:nth-child(even){background-color:rgba(0,0,0,0.05);}
td li{list-style:none;}
td.iconWord, th.iconWord{max-width: 45px;}

.iconWord a img
{
    display: block;
    border: solid #999 1px;
    border-radius: 4px; 
    margin: auto; 
}

.button{/*inschrijvingen*/
		background: #2f88cd;
		background: -moz-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #36a2f6), color-stop(100%, #2f88cd));
		background: -webkit-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
		background: -o-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
		background: -ms-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
		background: linear-gradient(to bottom, #36a2f6 0%, #2f88cd 100%);
		border: 1px solid #2f88cd;
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
		border-radius: 4px;
		-moz-box-shadow: 0 1px 2px #cccccc, inset 0 1px 1px #7bb8ef;
		-webkit-box-shadow: 0 1px 2px #cccccc, inset 0 1px 1px #7bb8ef;
		box-shadow: 0 1px 2px #cccccc, inset 0 1px 1px #7bb8ef;
		font: normal 500 16px/16px "Open Sans", Arial, sans-serif;
		margin:1px 0px 0px 1px;
		padding: 4px 10px;
		text-decoration: none;
		color: #fff;
		} 

.button:hover{
		background: #359ff2;
		box-shadow: 0 1px 2px #cccccc, inset 0 1px 1px #7bb8ef;
		text-shadow: 0 -1px 1px #2f88cd;
		}		

/*--- SUBMENU ----------------------------------------------------------------------------------------------*/		

#submenu{display:block; height:50px; width:100%;}
#submenu li{list-style:none; float:left; margin:0em 1em 1em 0em;}

.yellowBtn{/*current tab*/
		background: #359ff2;
		font-weight:bold;
		text-shadow:0px 1px 1px rgba(0,0,0,.5);
		}			

/*--- Contact ----------------------------------------------------------------------------------------------*/
#gmapsiframe{
		/*
		border: solid 1px rgba(255,255,255,0.4);
		outline: solid 1px rgba(0,0,0,0.1);
		*/
		border: solid 1px rgba(0,0,0,.15);
		border-radius:3px;
		width:100%; 
		height:425px; 
		}		
/*--- FOOTER -----------------------------------------------------------------------------------------------*/		

#originfooter{position: relative;}

footer{
		position: absolute;
		left: -10px;
		width: 920px;
		padding: 24px 30px 24px 30px;
		background-color: #333;
		background-image:url(../images/footerpattern.png);
		background-repeat:repeat;
		border-top: solid 5px #999;
		border-bottom: solid 5px #999;
		box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.8);
		-moz-box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.8);
		-webkit-box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.8); 
  		}

#triangleLeft {
		position: absolute;
		top: -10px;
		left: -10px;
		width: 0px;
		height: 0px;
		border-style: solid;
		border-width: 0 0 10px 10px;
		border-color: transparent transparent #000000 transparent; 
		}

#triangleRight {
		position: absolute;
		top: -10px;
		right: -10px;
		width: 0px;
		height: 0px;
		border-style: solid;
		border-width: 10px 0 0 10px;
		border-color: transparent transparent transparent #000000; 
		}

.footerblock{
		float: left;
		width: 230px;
		text-align:center;
		}
				
.footerblock h3{
		display:block;
		font-size:1.2em;
		padding-top:0.5em;
    	color: #FFF; 
		text-shadow:0px 1px 2px rgba(0,0,0,0.9);
		margin-bottom:1em;
		}
		
.footerblock p{
		color:#CCC;
		font-size:0.95em;
		padding:0px 1em 0px 1em;
		line-height:1.5em;
		}	

.footerblockline{margin:auto; width:192px; border:solid 1px orange; }			

.footerblock ul{margin-top:-6px; padding-left:40px; text-align:left;}		

.footerblock li{
		list-style:none;
		line-height:2em;
		color:#CCC;
		}			
		
.footerblock li img{/*flags*/
		vertical-align:middle;
		margin-right:1em;
		border-radius:2px;
		}		

.footerblock li img:hover{box-shadow:0px 0px 9px #000;}		

footer a{color:#CCC; text-decoration:none;}
footer a:hover{color:orange;}

#adres{
		background-image:url(../images/gmaps-icon.png);
		background-repeat: no-repeat;
		background-position: 0% center;
		text-decoration:none;
		text-align:left;
		line-height:1.5em;
		font-size:0.95em;
		margin-left:12px;
		padding-left:37px;
		display: block;
		}

.btnfooter{			
			background: #2f88cd;
			background-position: 10px center, center center;
			background-repeat:no-repeat;
			-moz-border-radius: 4px;
			-webkit-border-radius: 4px;
			border-radius: 4px;
			padding:4px 10px 4px 40px;
			text-decoration:none;
			color:#FFF;
			border:solid 1px rgba(255,255,255,0.2);
			box-shadow:0px 0px 5px rgba(0,0,0,0.6);
			}
.btnfooter:hover{
			color:#FFF;
			background-color: #359ff2;
			box-shadow: 0px 0px 9px rgba(0,0,0,0.6);	
			text-shadow: 0 -1px 1px #2f88cd;
			}			

#btnsendmail,#btnlid,#btnfacebookpage{display:inline-block; margin-bottom:1em;}

#btnsendmail{
			background-image: url(../images/mailicon.png), -moz-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
			background-image: url(../images/mailicon.png), -webkit-gradient(linear, left top, left bottom, color-stop(0%, #36a2f6), color-stop(100%, #2f88cd));
			background-image: url(../images/mailicon.png), -webkit-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
			background-image: url(../images/mailicon.png), -o-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
			background-image: url(../images/mailicon.png), -ms-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
			background-image: url(../images/mailicon.png), linear-gradient(to bottom, #36a2f6 0%, #2f88cd 100%);	
			}
#btnlid{
			background-image: url(../images/lid-icon.png), -moz-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
			background-image: url(../images/lid-icon.png), -webkit-gradient(linear, left top, left bottom, color-stop(0%, #36a2f6), color-stop(100%, #2f88cd));
			background-image: url(../images/lid-icon.png), -webkit-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
			background-image: url(../images/lid-icon.png), -o-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
			background-image: url(../images/lid-icon.png), -ms-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
			background-image: url(../images/lid-icon.png), linear-gradient(to bottom, #36a2f6 0%, #2f88cd 100%);	
			}
#btnfacebookpage{
			background-image: url(../images/fb-icon.png), -moz-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
			background-image: url(../images/fb-icon.png), -webkit-gradient(linear, left top, left bottom, color-stop(0%, #36a2f6), color-stop(100%, #2f88cd));
			background-image: url(../images/fb-icon.png), -webkit-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
			background-image: url(../images/fb-icon.png), -o-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
			background-image: url(../images/fb-icon.png), -ms-linear-gradient(top, #36a2f6 0%, #2f88cd 100%);
			background-image: url(../images/fb-icon.png), linear-gradient(to bottom, #36a2f6 0%, #2f88cd 100%);	
			}

#btnsendmail:hover{background-image:url(../images/mailicon.png);}
#btnlid:hover{background-image:url(../images/lid-icon.png);}
#btnfacebookpage:hover{background-image:url(../images/fb-icon.png);}

.fb-like{
		position:absolute!important;
		bottom:12px;
		left:30px;
		}

#copyright{
		text-align: center;
		color: #888;
		font-weight:bold;
		margin-top: 270px;
		padding-bottom: 10px; 
		text-shadow: 0px 1px 0px #FFF;
		}

#pushtotop{
  		min-height: 1px; 
		}


/**Frontpage only -------------------------------------------**/

#bannerimage
{
	padding:30px 0px 0px 0px;
	margin:30px;
	position: relative; 
}

.frontPageBlock{display:block; clear:both; margin:0px 0px 30px 0px; overflow:hidden;}

#languageblock{padding:25px; border:solid 1px #ddd; border-radius:2px; background:#fff;}
#languageblock li{float:left; width:33.33%; list-style:none; text-align:center;}
#languageblock img{margin:0px 10px 10px 0px;}

#buttonsblock{text-align:center;}
#buttonsblock a{margin-right:30px;}

#contactblock{margin:0;}

.wordlink{display:block; color:orange; text-decoration:none;}
.wordlink:hover{color:#06C; text-decoration:underline;}

.btnlink{width:100px; height:100px; display:inline-block; box-shadow:2px 2px 0px #069; transition:background 0.2s;}
.btnlink:hover{background-color: #51b3ff!important;}

#frp-fb{background:#36a2f6 url(../images/frp_fb.png) no-repeat;}
#frp-mail{background:#36a2f6 url(../images/frp_mail.png) no-repeat;}
#frp-member{background:#36a2f6 url(../images/frp_member.png) no-repeat;}

#frontpage #adres{width:160px; margin:auto; display:block; color:orange;}
#frontpage #adres:hover{color:#06C;}
#frontpage #copyright{margin-top: -18px;}

.centertext{display:block; text-align:center; margin-top:5px;}