/* --------------------------- */
/* Cecilia-Online.nl v3 Styles */
/* Door: Han Smeets            */
/* --------------------------- */


/* --------------- */
/* RESET STYLES	   */
/* --------------- */

:link,:visited { text-decoration:none; outline: none; }
ul,ol { list-style:none }
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input { margin:0; padding:0 }
a img,:link img,:visited img { border:none }
address { font-style:normal }
hr { display: none;	}


/* --------------- */
/* BODY            */
/* --------------- */

html, body {
	height: 100%;
}

body {
/*#02101d*/
	background: #02101d url(/includes/img/layout/headerlijst.jpg) top no-repeat; 
	
	font-family: "Trebuchet MS", Helvetica, Tahoma, Verdana, Geneva, Arial, sans-serif;

	font-size:100%;
	line-height:1.1875em; /* 16×1.125=18 */
	
	color: #ffffff;
}

p {
	font-size: 0.850em;
}

h1, h2, h3, h4, h5, h6 {
	font-family:'Palatino Linotype',Georgia,Utopia,Palatino,serif;
	/*font-style: italic;*/
	font-weight: bold;	
	padding: 5px 5px;
}


a, a:link, a:visited, a:active {
	color: #ffffff;
}

.blok a, .blok a:link, .blok a:visited, .blok a:active {
    text-decoration: underline;
}

a:hover {
	color: #aaaaaa;
	text-decoration: underline;
}

.hr {
	height: 1px;
	margin: 1.5em 10px;
	border-bottom: 1px dotted white;
}



/* --------------- */
/* HEADINGS        */
/* --------------- */

h1.bg, h2.bg, h3.bg, h4.bg, h5.bg, h6.bg {
	margin-left: 2px;
	background-color: #003366;
	border-top: 2px solid #163f68;
	border-bottom: 2px solid #163f68;
}

h1 { font-size: 1.3em; }
h2 { font-size: 1.3em; }
h3 { font-size: 1.1em; }
h4 { font-size: 1.0em; }

/* --------------- */
/* WRAPPER         */
/* --------------- */

#footerbg {
	margin: 0;
	padding: 0;
	padding-bottom: 50px;
	background: url(/includes/img/layout/footer.jpg) bottom center no-repeat;
}
/* #02101d */
#container {
	background: #02101d url(/includes/img/layout/contentlijst.jpg) repeat-y; 
	background-position:center;	
	margin:0;
	padding: 0;
}

#container2 {
	background: url(/includes/img/layout/contentlijsttop.jpg) top no-repeat;
	width: 100%;
	margin: 0;
	padding: 0;	
}

#content {
	background: #02101d url(/includes/img/layout/content.jpg) repeat-y; 
	width: 860px;
	margin: auto;

}

#content2 {
	background: url(/includes/img/layout/contenttop.jpg) no-repeat;
	width: 100%;
	margin:0;
	padding:6px 0 0 0;
	padding-top: 20px;
	min-height: 330px;
}


/* --------------- */
/* HEADER          */
/* --------------- */


#header {
	background: url(/includes/img/layout/header-110.jpg) #336699 no-repeat;
	width: 860px;
	height: 220px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	display: block;
}
	
/* maakt logo gedeelte van header klikbaar */
#logo {position: absolute; top: 10px; left: 20px; background: transparent;}
#logo a {display: block; height: 120px; width: 300px;}


/* --------------- */
/* LOGIN           */
/* --------------- */

#loginbar-rechts {
	width: 150px;
	position: absolute;
	top: 195px;
	left: 658px;
	font-size: 0.9em;
	text-align: left;
}

#loginbar {
	width: 100%;
	position: absolute;
	top: 195px;
	left: 0px;
	font-size: 0.95em;
	text-align: left;
	padding-left: 17px;
	z-index: 1;
}

#loginbar a:hover {
	color: #cccccc;
}
.loginbox {
	margin: 0 0 20px 2px;
	background-color: #ccddff;
	color: #003366;
	font-size: 0.9em;
}

.loginbox div {
	padding: 5px 5px;
}
.loginbox .flleft {
	width: 250px;
	border-right: 1px solid #003366;
}

.loginbox .flleft2 {
	width: 320px;
}

.loginbox h4 {
	margin: 0;
	font-size: 1.3em;
	color: #ffffff;
}

		
.loginbox input {
	width: 95%;
	padding: 2px;
}	


.loginbox input.knop {
	width: auto;
}

.loginbox li {
	list-style: square;
	margin-left: 15px;
}


span.leden-links, span.leden-links a {
	color: #ffff55;
	font-style: italic;
	font-weight: bold;
}
/* --------------- */
/* KOLOMMEN        */
/* --------------- */

.kolom-links { width: 610px; float: left; }			
.kolom-rechts { width: 200px; margin-left: 25px; float: left;  padding-bottom: 50px;} 
/* border-left: 1px solid #426590; */
		
/* --------------- */
/* BLOK            */
/* --------------- */

.blok {
	padding: 10px 7px 10px 7px;
	margin: 0 0 10px 0;
}

.blok p {
	text-align: justify;
}

.blok p.versieinfo {
	color: #888888;
	font-size: 0.7em;
	font-style: italic;
	width: 100%;
	text-align: right;
}	

/* --------------- */
/* FOTOMENU        */
/* --------------- */

.fotomenu a, .fotomenu a img {
	border: 0;
	margin: 0;
}

.fotomenu a {
	display: block;
	width: 600px;
	height: 120px;
}

.fotomenu a img, h1 img {
	border: 1px solid #073461;
}

.fotomenu a:hover img {
	border: 1px solid #ffffff;
}

.fotomenu a#harmonieorkest { background: url(/includes/img/geledingen_harmonieorkest.jpg) no-repeat top; }
.fotomenu a#harmonieorkest:hover { background: url(/includes/img/geledingen_harmonieorkest_over.jpg) no-repeat top; }

.fotomenu a#drumband { background: url(/includes/img/geledingen_drumband.jpg) no-repeat; }
.fotomenu a#drumband:hover { background: url(/includes/img/geledingen_drumband_over.jpg) no-repeat; }

.fotomenu a#kme { background: url(/includes/img/geledingen_kme.jpg) no-repeat; }
.fotomenu a#kme:hover { background: url(/includes/img/geledingen_kme_over.jpg) no-repeat; }

.fotomenu a#jec { background: url(/includes/img/geledingen_jec.jpg) no-repeat; }
.fotomenu a#jec:hover { background: url(/includes/img/geledingen_jec_over.jpg) no-repeat; }

.fotomenu a#speelgroep { background: url(/includes/img/geledingen_speelgroep.jpg) no-repeat; }
.fotomenu a#speelgroep:hover { background: url(/includes/img/geledingen_speelgroep_over.jpg) no-repeat; }

.fotomenu a#jac { background: url(/includes/img/geledingen_jac.jpg) no-repeat; }
.fotomenu a#jac:hover { background: url(/includes/img/geledingen_jac_over.jpg) no-repeat; }

.fotomenu a#damescomite { background: url(/includes/img/geledingen_damescomite.jpg) no-repeat; }
.fotomenu a#damescomite:hover { background: url(/includes/img/geledingen_damescomite_over.jpg) no-repeat; }

/* --------------- */
/* VANALLES        */
/* --------------- */

.banners a img {
	border: 1px solid #073461;
}

.banners a:hover img {
	border: 1px solid #ffffff;
}

.foto {
	margin: 0 0 10px 0;
	text-align: center;
}

.foto img {
	border-left: 1px solid #6699CC;
	border-bottom: 1px solid #6699CC;
	border-right: 1px solid #6699CC;
	border-top: 1px solid #6699CC;
}

.foto p {
font-size: 0.725em;
}

.thumbnail{
	padding: 3px 3px 8px 3px;
	background-color: #ffffff;
	border: 1px solid #2a2a2a;
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}


.successen td {
	border-bottom: 1px solid #6699CC;
	font-size: 0.8em;
}

.submenu li {
	list-style: square;
	margin-left: 15px;

	font-size: 1.2em;
	
}

.submenu li ul li {
    font-size: 0.8em;
}

.submenu li ul {
    margin-top: 5px;
    margin-bottom: 10px;
}
.submenu a, .submenu a:visited, .submenu a:link {
    text-decoration: none;
}

.submenu a:hover {
    text-decoration: underline;
}

.submenu li strong a, .submenu li strong a:visited {
    color: #ffff00;
}

.submenu li.active {
	 font-weight: bold;
	 font-style: italic;
	 list-style: disc;
}
			
.uitklap-1, .uitklap-2, .uitklap-3, .uitklap-4 {
	display: none;
}

p.erepenning {
	font-size: 0.7em;
}


.form {
    background-color: #114477;
	border: 1px solid #163f68;
}

label:hover {
    cursor: pointer;
}


.shop-progress td {
    width: 100px;
    vertical-align: top;
    font-size: 0.8em;
    color: #aaaaaa;
}

.shop-progress td.arrow {
    width: 25px;
    vertical-align: middle;
    font-size: 1.8em;
}

.shop-progress td strong {
    font-size: 1.2em;
}

.shop-progress td.active {
    color: #ffffff;
}

ul.voorwaarden {
     list-style-type: square;
}

ul.voorwaarden li {
    font-size: 0.8em;
    margin-bottom: 5px;
    margin-left: 20px;
}

/* --------------- */
/* PAGE-SPECIFIEK  */
/* --------------- */

#page_nieuws .door {
	font-size: 0.7em;
	font-style: italic;
}

#page_nieuws h3 {
	font-size: 1.5em;
}

.nieuwsoverzicht li {
	font-size: 0.8em;
}





#begunstigers td {
    font-weight: bold;
}


/* --------------- */
/* FOOTER          */
/* --------------- */

.footer {
	width: 100%;
	height: 150px;
	
	margin: 0;
	padding: 0;
}

.footerbg {
	background: url(/includes/img/layout/footer.png) no-repeat;
}

#copyright {
	position: relative;
	top: 100px;
	left: 140px;
	width: 350px;
}

#copyright p {
	font-size: 0.725em;
}

.totop {
	width: 100%;
	text-align: center;
}

.totop a {
	font-size: 0.8em;
	font-style: italic;
}




.flleft { float: left; }
.flleft2 { float: left; }
.flright { float: right; }

.rechts { text-align: right; }
.center { text-align: center; }

.nobg { background: none; }






/* --------------- */
/* ERROR-BOXES     */
/* --------------- */


.waarschuwing {
	background: #fff6bf url(/includes/img/layout/silk/error.gif) center no-repeat;
	background-position: 15px center; /* x-pos y-pos */
	text-align: left;
	padding: 5px 20px 5px 45px;
	border-top: 2px solid #ffd324;
	border-bottom: 2px solid #ffd324;
	margin-bottom: 5px;
	color: #003366;
	}

.error {
	background: #fff6bf url(/includes/img/layout/silk/cancel.gif) center no-repeat;
	background-position: 15px 50%; /* x-pos y-pos */
	text-align: left;
	padding: 5px 20px 5px 45px;
	border-top: 2px solid #cc0000;
	border-bottom: 2px solid #cc0000;
	margin-bottom: 5px;
	color: #003366;
	}
	
	

/* --------------- */
/* CALENDAR        */
/* --------------- */

/*
By Shirley E. Kaiser, M.A.
http://brainstormsandraves.com/archives/2007/02/22/csscalendar/
*/

.datetime{
	float:left;
	display:block;
	padding:0;
	margin:2px 2px 2px 2px;
	width:3.1em;
	min-width:48px;
	color:#2f4765;
	background: url(/includes/img/layout/datetime-corner3.gif) no-repeat right bottom;
	text-align:center;
	font-size:x-small;

}

.datetime div.top p{
	background:url(/includes/img/layout/datetime-caltop1b.gif) no-repeat 50% 0;
	margin:-9px auto 0 auto;
	padding-top:11px;
	padding-bottom:0;
	padding-left:1px;
	text-align:center;
	font:bold x-small/100% Georgia, "New Century Schoolbook", "Book Antiqua", "Times New Roman", serif;
	letter-spacing:0.12em;
	text-transform:uppercase;

}
.datetime .top{
	color:#fefefe;
	background-color:#2f4765;
	margin:0 6px 0 0;
	padding:6px 0 1px 0;
	line-height:100%;
	border-top:1px solid #283c56;
	border-bottom:1px solid #316640;
	border-left:1px solid #283c56;

}
.datetime div.btm{
	color:#365174;
	background:transparent;
	border-left:1px solid #a1c6ac;
	margin:0 10px 5px 0;
	padding:0 0 1px 0;

}

.datetime p.day, .datetime p.mon, .datetime p.yr{
	margin:0 3px 0 8px;
	text-align:center;
}

.datetime p.day{
	color:#365174;
	background-color:transparent;
	padding:0 0 1px 0;
	font:bold 1.5em/98% Georgia, "New Century Schoolbook", "Book Antiqua", "Times New Roman", serif;
	letter-spacing:0.13em;
}

.datetime p.mon, .datetime p.yr{
	color:#283d57;
	background-color:transparent;
}

.datetime p.mon{
	padding:0;
	font:x-small/135% Verdana,Geneva,Arial,Helvetica,sans-serif;
	letter-spacing:normal;
	line-height:100%;
}

.datetime p.yr{
	margin-right:14px;
	margin-left:5px;
	padding:0 4px 0 0;
	font:x-small/110% Verdana,Geneva,Arial,Helvetica,sans-serif;
	letter-spacing:0.05em;
}





/* --------------- */
/* PAGINATION      */
/* --------------- */

ul#pagination-digg, #pagination-digg li {
	border:0; margin:0;
	padding: 10px 7px 10px 7px;
}

#pagination-digg li {
 	border: 0; margin: 0; padding: 0;
	font-size:11px;
	list-style:none;
	margin-right:2px;
	
	float:left;
	display:block;
}

#pagination-digg a, #pagination-digg span {
	border:solid 1px #9aafe5;
	background-color: #ffffff;
}

#pagination-digg .previous-off span, #pagination-digg .next-off span {
	padding-left:6px;
	padding-right:6px;
	color:#888888;
	font-weight:bold;
}

#pagination-digg .next a, #pagination-digg .previous a {
	font-weight:bold;
}

#pagination-digg .active {
	background:#163f68;
	color:#FFFFFF;
	font-weight:bold;
	padding-left:6px;
	padding-right:6px;
}

#pagination-digg a:link, #pagination-digg a:visited {
	color:#0e509e;
	padding-left:6px;
	padding-right:6px;
	text-decoration:none;
}

#pagination-digg a:hover {
	border:solid 1px #0e509e
}

#pagination-digg span.leeg {
	border: 0;
	background: none;
}

/*
.pages {
	padding: 1em;
	margin: 1em 0;
	clear: left;
	font-size: 85%;
}

.pages a, .pages span {
	display: block;
	float: left;
	padding: 0.2em 0.5em;
	margin-right: 0.1em;
	border: 1px solid #fff;
	background: none;
	font-size: 0.80em;
}

.pages span.current {
	border: 1px solid #2E6AB1;
	font-weight: bold;
	background: #2E6AB1;
	color: #fff;
}

.pages a {
	border: 1px solid #9AAFE5;
	text-decoration: none;
}

.pages a:hover {
	border-color: #2E6AB1;
}

.pages a.nextprev {
	font-weight: bold;
}

.pages span.nextprev {
	color: #666;
}

.pages span.nextprev {
	border: 1px solid #ddd;
	color: #999;
}


*/


/* --------------- */
/* VIDEOGALLERY    */
/* --------------- */

#videogallery {
	width:100%;
	zoom:1;
}
#videogallery span{ display:block; }
#videogallery a{
	display:-moz-inline-stack;
	display:inline-block;
	zoom:1;
	*display:inline;
	position:relative;
	vertical-align:top;
	margin:5px;
	width:160px;
	font-family:Trebuchet,Tahoma,Arial,sans-serif;
	font-size:11px;
	font-weight:normal;
	text-decoration:none;
	text-align:center;
	opacity:0.87;
}
#videogallery a img{
	display:block;
	border:none;
	margin:0;
}
#videogallery a:hover{
	opacity:1;
}

#videogallery a#videolb{
    display:none;
}



/* the overlayed element */
div#voverlay {
	
	/* growing background image */
	background-image:url(/includes/img/video_back.png);
	
	/* dimensions after the growing animation finishes  */
	width:640px;
	height:480px;
	
	/* initially overlay is hidden */
	display:none;
	
	/* some padding to layout nested elements nicely  */
	padding:48px;
}

/* default close button positioned on upper right corner */
div#voverlay div.close {
	background-image:url(/includes/img/video_close.png);
	position:absolute;
	right:16px;
	top:12px;
	cursor:pointer;
	height:32px;
	width:32px;
}
div#voverlay div.close:hover{
	background-position:0 100%;
}

div#vcontainer{
	left:0;
	top:0;
	width:100%;
	height:100%;	
	background:url(/includes/img/video_loading.gif) no-repeat 50% 50%;
}

/* --------------- */
/* CLEARING        */
/* --------------- */

/*
From "A CSS Framework" by Mike Stenhouse of Content with Style
http://www.contentwithstyle.co.uk/Articles/17/
*/

/* clearing */

.stretch,
.clear {
	clear:both; 
	height:1px; 
	margin:0; 
	padding:0; 
	font-size: 15px;
	line-height: 1px;
}
.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}

.clearfix {display:inline-block;}
/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */


* html>body .clearfix {
	display: inline-block; 
	width: 100%;
}
	
* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
}
/* end clearing */


/* replace */
.replace {
	display:block;
		
	background-repeat: no-repeat;
	background-position: left top;
	background-color:transparent;
}
	/* tidy these up */
.replace * {
	text-indent: -10000px;
	display:block;
		
	background-repeat: no-repeat;
	background-position: left top;
	background-color:transparent;
}
.replace a {
	text-indent:0;
}
.replace a span {
	text-indent:-10000px;
}
/* end replace */


/* accessibility */
span.accesskey {
 	text-decoration:none;
}
.accessibility {
	position: absolute;
 	top: -999em;
 	left: -999em;
}
/* end accessibility */