@charset "UTF-8";
/* ---CSS www.noordseliteratuur.nl -- web responsive design---/*

/* ---Browservoorkeur strippen (Eric Meyer) --- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, center, dl, dt, dd, ol, ul, li, fieldset, form, label, input, button, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {margin: 0;	padding: 0;	border: 0;	font-size: 100%;	font: inherit;	vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;} ol, ul {list-style: none;} blockquote, q {quotes: none;} blockquote:before, blockquote:after,q:before, q:after {	content:'';	content: none;} table {	border-collapse: collapse;	border-spacing: 0;} a:link,a:visited,a:hover {text-decoration:none } a { outline:none }
/* --- einde browserstrippen------------*/


/* volgorde css regels van desktop naar mobile ivm ondersteuning 1e8 (windows xp) */

@-webkit-viewport { width: device-width; }
@-moz-viewport { width: device-width; }
@-ms-viewport { width: device-width; }
@-o-viewport { width: device-width; }
@viewport { width: device-width; }

*, *:before, *:after {
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box
	}
	
.main{border-style:solid; border; border-color:#0F6; border-left-width:2px}
.xwrapper{border-style:solid; border-color:#33F; border-width:5px; }
/* basis layout */
html{height:100%}

body{
	width:100%;
	max-width: 980px; 
	min-width:240px;
	margin-left:auto; margin-right:auto; 
	height:100%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height:1.3em;
	color: #000000;
	background-color: #FFFFF0;
	
	}
	
.wrapper{height:100%; width:100%; display:table;}

nav{position:absolute; width:8.8em ;margin-top:80px;padding-left:0.0em;margin-left:0em; height:0px}

.main{
	margin-left:8.5em;
	width: calc(100% - 9.2em);
padding-left:1.5em; padding-right:1.5em; 
margin-right:1.5em; 
}

header {
height:5em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color:#07409A;}

.homeimg{ width:141px; height:76px}	

header p{padding-top:2em;
margin-left:9em; }

select{
	margin: 0;
	height:2em;
	padding: 2px 2px;
	font-family: Arial, Helvetica, sans-serif;
	font-size:1em;
	color:#666;
	border:1px solid #0076a3;
	border-radius: 15px;	
	}
.selectLinks{
	border-top-left-radius: 0px;
	border-bottom-left-radius:0px;
	}
.selectRechts{
	border-top-right-radius: 0px;
	border-bottom-right-radius:0px;
	}
.selectMidden{
	border-radius: 0px;
	}	
.frechts{float:right; margin-left:0.5em}
.flinks {float:left; margin-right:0.5em}	
		
.filterform{
	display:inline;
	}	
h1.titel{padding: 1.5em 0.5em;text-align: center;}
.klaar{clear:both}
.klaarrechts{clear:right;}

/*opmaak kolommen, (lijstjes auteurs etc)*/	
.kolommen ul,.TabbedPanelsContent ul, .bol{margin-left:20px;
	list-style-type: circle; list-style-position: outside; }
ul.web	{margin-left:20px; list-style-image: url('../images/icon-fox.jpg')}
ul.inhoud {margin-left:20px; list-style-image: url('../images/accordeonright.gif');}

.kolommen{
	clear:right;
	-moz-column-count: 2;
	-webkit-column-count: 2;
	column-count: 2;
	-moz-column-gap: 20px;
    -webkit-column-gap : 20px;
	column-gap : 20px;
	-webkit-column-rule: 1px solid #ccc; 
    -moz-column-rule: 1px solid #ccc; 
    column-rule: 1px solid #ccc;}
	
.main .kolommen a{font-size:95%; font-weight:normal;

}
footer{
	margin-left: 15px;
	font-variant: small-caps;
	vertical-align:bottom;
}

  /* ---- Het hoofdmenu  ------  */

.menu ul li {
	margin-top:0.4em;
	margin-left:0em;
	padding:0.2em;
	line-height:1.1em;
	cursor:pointer;
	border-style:solid;	
	border-width:2px;
	font-size:90%;
	-moz-border-radius:0px 8px 8px 0px;
	-webkit-border-radius:0px 8px 8px 0px;
	border-radius:0px 8px 8px 0px;
	-moz-box-shadow: 0px 3px 5px #000;
	-webkit-box-shadow: 0px 3px 5px #000;
	box-shadow: 0px 3px 5px #000;
	}
.menu ul li:hover{
	position:relative;
	cursor:pointer;
	top:3px;
	box-shadow:none;
	-moz-box-shadow:none;
	-webkit-box-shadow:none;
	}
.menu a {display:block;font-size:1em; font-weight: normal;}

.menu .contact{
	background-position:right;
	background-repeat:no-repeat;
	background-image: url(/images/email.gif);
	background-position-x: 85px;			
	}
.menu .home{
	background-position:right;
	background-repeat:no-repeat;
	background-image: url(/images/homewit.png);
	background-position-x: 95px;	
	}	
.menu .actief
	{border-style:solid;
	border-width:3px;
	border-color:#FFFFFF;
	}


/*algemene opmaakelementen */
p{padding-bottom:1em}

h1{font-size:1.3em; padding:0 0 1em 0;}
.main h1 {margin-top:1em}
h2{font-size:1.2em; padding:0.2em 0 0.7em 0}
h3{font-size:1.1em; padding:0 0 0.6em 0}
h4{font-size:1.1em; padding:0 0 0.4em 0}

hr{ height: 1px; border-top: 1px solid;
    margin: 1em 0; padding: 0; }


.fotorandom {float:right;margin:1.5em 0em 1em 1em;
	border-style: solid;
	border-width:thick;
	border-color: #EBE1CD;
	height:180px;
	width:120px;
	border-style: solid;
	border-width:thick;
	border-color: #EBE1CD;
	height:180px;
	width:120px;}
 .white-popup{
	-moz-border-radius:10px; 
	-webkit-border-radius:10px; 
	border-radius:10px; 
	}
	
.bibliografie img, header img {
	max-width:100%;
  	margin:0px 16px 8px 0px; 
  	float:left; 
	}
img.right	{float:right; margin:0px 0px 0px 16px;}	
 
.smallcaps{font-size:1.2em;font-variant: small-caps;}	
.noshow {display:none;}

.midden {text-align: center;}

hr{clear:both}
.citaat{padding-left: 1em}
.bibliografie{padding-left: 65px}
.covers {margin-left:-60px; width:99px; clear:both}
.covers img {max-width:60px}
.covers png {max-width:60px}
.header h1{padding: 0.5em 0.5em;text-align: center;}
.header h2{text-align: center;}

/* ------ links (nog uitzoeken)--------*/
a[href^="http://"], a[href^="https://"]{
	background-image:url(../images/icon_web.jpg);
	background-repeat: no-repeat; 
	background-position:center left; 
	padding-left:20px;font-size:1.0em; color: #07409A;font-weight: bold;}
	
a[href$=".pdf"]{ }
a[href^="http://"]:hover, a[href^="https://"]:hover, {text-decoration:underline;}

 .main a {font-size:1.0em; font-weight: bold;}
 .mfp-bg a:link,.mfp-bg a:active, .mfp-bg a:visited {}
.main a:hover {text-decoration:underline;} 
.main footer a:hover {text-decoration:none;} 
 

table p{text-align:right; font-size: 0.8em;}

.menu-btn{display:none}
	
@media screen and (max-width: 42em) {
/*----opmaak iphone en devices tot 42em---*/
header p {padding-top:3em}
/* ---- menu mobiel ------  */
nav{position:absolute;right:0%; width:50%;min-width:8em;margin-top:0px; z-index:1000; background-color:#FFFFF0}


.menu-btn{display:block; position:absolute; right:65px; top:15px}

.menu-btn div {
position: absolute;
left: 100%;
top: 64%;
padding-right: 8px;
margin-top: -0.50em;
line-height: 1.2;
font-size: 18px;
font-weight: 200;
vertical-align: middle;
z-index: 99;
}
 
.menu-btn span {
display: block;
width: 25px;
height: 4px;
margin: 4px 0;
background: rgb(0,0,0);
z-index: 99;
text-indent:30px;
font-size:90%;
}
.menu{display:none} 
.expand {
display: block !important;
}
 .menu{
	position:absolute;
  right: 0;
  top:60px;
  z-index:1100;
  width:100%;
  margin:0em;}

.menu ul li {
	margin-top:0em;
	padding:0.2em;
	padding-left:0.4em;
	line-height:1.3em;
	border-style:solid;
	border-width:1px;
	cursor:pointer;
	-moz-border-radius:8px 0px 0px 8px;
	-webkit-border-radius:8px 0px 0px 8px;
	border-radius:8px 0px 0px 8px;
	-moz-box-shadow: 0px 3px 5px #000;
	-webkit-box-shadow: 0px 3px 5px #000;
	box-shadow: 0px 3px 5px #000;
	}	
.menu ul li:hover{
	position:relative;
	cursor:pointer;
	}
.menu a {display:block;font-size:1em; font-weight: normal;}

.menu .contact{
	background-position:right;
	background-repeat:no-repeat;
	background-image: url(/images/email.gif);
	background-position-x: 85px;		
	}
.menu .home{
	background-position:right;
	background-repeat:no-repeat;
	background-image: url(/images/homewit.png);
	background-position-x: 95px;
	}	
	
.menu li:first-child a { border-top: 0.1em }
.menu li:last-child a { border-bottom: 0.1em }




header{clear:both; font-size:0.9em; padding-top:0}  
.main {
 width: 100%;
 max-width:100%;
 margin-left:0px;
 margin-right:0px;
 position: relative;
 top: 0;
 left:0;
 bottom: 0;
   overflow: hidden; 
  -webkit-overflow-scrolling: auto;
  padding: 0 1em 1em;
  min-width:15em;  
}
  
	#contactForm {
	width: 100%;
	height: 30em;
	padding: 1em;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: 0em 0.3em 1em 0.3em;
} 
	

.kolommen{
	-moz-column-count: 1;
	-webkit-column-count: 1;
	column-count: 1;
	-moz-column-gap: 20px;
    -webkit-column-gap : 20px;
	column-gap : 20px;
	-webkit-column-rule: 1px solid #ccc; 
    -moz-column-rule: 1px solid #ccc; 
    column-rule: 1px solid #ccc;	
}
.kolommen li {height:1.7em}

}
@media screen and (max-width: 350px) {
	.TabbedPanelsTab, header {font-size:80%;}
	.homeimg{left:0em;height:50px}
header{height:60px}	
header p{display:none}
.fotorandom	{display:none}
	}	
/* -------bijstellingen magnific popup (glas css als laatste einde ----------	*/ 
 .white-popup {
	background: #FFFFF0;
	width: 80%;
	margin:auto;
	max-width: 780px;
	height:auto;
	margin-top:0.5em;
	padding-top:0em;
	border-color: #666666;
	border-style:solid;
	border-width:2px;
	padding-left:2%;
	padding-right:2%;
}
.white-popup h2{
	color: #60A3A4;
	}/* Magnific Popup CSS */

/* ------ kleurenschema --------*/
/* kleur grijs*/
html{background-color:#999;}

/* kleur geel*/
.main, body, .wrapper{
	background-color: #FFFFF0;
	border-color: #07409A;
}

.menu ul li {background-color:#8A9B87;border-color:#07409A;}


/* ----navigatie: links bij aantal te tonen records ----*/	
.navigatie{
	width: 120px;
	height: 26px;
	background: url(../images/navigatie.gif) no-repeat;
	background-position:0 2px;
	margin: 1px;
	padding: 0;
	position: relative;
}
.navigatie li {
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
}
.navigatie a {width:auto; }/*  herstel van width:100% is nodig in IE5 om links op plaatjes mogelijk te maken binnen div menu*/
.navigatie li, .navigatie a{display: block; height:26px; width: 120px;}	
.navigatie .link1 {left: 0px; height: 26px; width:26px; }
.navigatie .link2 {left: 26px; height: 26px; width:34px; }
.navigatie .link3 {left: 60px; height: 26px; width:34px; }
.navigatie .link4 {left: 94px; height: 26px; width:26px;}
.navigatie li:hover, .navigatie a:hover{display: block; height:35px; width: 120px;}	
.navigatie li:hover, .navigatie a:hover{width:40px;}
	
.navigatie a:hover{background: url(../images/navigatie.gif) no-repeat;}
.navigatie .link1 a:hover{background-position:0 -30px; height: 26px; width:32px; }
.navigatie .link2 a:hover{background-position:-32px -33px; height: 26px; width:40px; }
.navigatie .link3 a:hover{background-position:-72px -33px; height: 26px; width:43px; }
.navigatie .link4 a:hover{background-position:-115px -33px;height: 26px; width:35px; }
/* ------------------- */
	


/* kleur blauw*/
h1, h2, h3, hr, a:link, a:active, a:visited,.mfp-bg a:link,.mfp-bg a:active, .mfp-bg a:visited, select {color: #07409A;}

/* kleur wit*/
.menu a:link, menu a:active, .menu a:visited {color:#FFFFFF}

.rood {color: #CC3300;}
.smallcaps{color:#CC3300;}
.box {border-color: #07409A;}	
	
/* --------einde kleurenschemas -----*/	



/*--- indexpagina zoekbalk-- */

/* schaduwen */

 .ui-datepicker , .ui-dialog , .ui-widget-shadow , .ui-autocomplete{
	box-shadow: 0px 3px 5px #000;;
}

.autoInput {
	margin-bottom: 1em;
	padding: 5px 10px;
	width:40%;
	font-family: Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#666;
	border:1px solid #0076a3;
	border-radius: 5px;	
	background:url(../images/icon-zoom.png) no-repeat right;
	}		


/* opmaak ui widget*/
.ui-widget-content, .ui-widget-header, .ui-tabs-anchor {background:none;background-color:#FFFFF0;}

.ui-state-active, .ui-state-default{outline:none}
	

.ui-dialog-titlebar {background:none}
.ui-dialog-title {color:#07409A}
.ui-autocomplete{padding:0.5em; }

/*--- opmaak tabs; let op de theming css met widget opmaak is verwijderd-- */
.ui-tabs-nav{border-bottom:solid; border-bottom-color:#07409A; border-bottom-width:1px;}
.ui-tabs-anchor {border-style:solid; border-color:#07409A; border-width:1px; border-bottom:none; border-radius:5px 5px 0px 0px;}
.ui-tabs-active .ui-tabs-anchor{border-bottom-style:solid; border-bottom-color:#FFFFF0; border-bottom-width:1px; margin-bottom:-2px }
/*.ui-autocomplete{max-height: 20em; overflow-y: auto; overflow-x: hidden;}
let op de autocomplete lijst is kennelijk een li lijst en reageert op hover*/
.ui-tabs-anchor {font-size:1.0em; font-weight:normal;}



p.ajaxFlaptekst{cursor: pointer;color: #07409A;}
.ajaxSluitFlaptekst{cursor: pointer;color:#07409A;}
.ajaxTekst {color:black}

/*--- opmaak accordion; let op de theming css met widget opmaak is verwijderd-- */
.ui-accordion{border-color:#006AB4;
	border-style: solid; border-width:1px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px}

h3.ui-accordion-header{
	cursor: pointer;
	border:none;
	border-bottom-style:solid;
	border-bottom-width:1px;
	background-image:url(../images/accordeonright.gif);
	background-repeat:no-repeat;
	background-position:left;
	padding-left:2.0em !important;
	
	border-top-color: #FFFFF0;
	border-bottom-color: #FFFFF0;
	color: #000000;
	background-color: #DFF3E1
}

.ui-accordion-header-active {
	background-image:url(../images/accordeondown.gif) !important;
	background-repeat:no-repeat;
	background-position:right;}

.ui-accordion-header:focus{outline:none; border-bottom:dotted #006AB4;border-top:dotted #006AB4}

#ui-id-23, .acLaatsteTab{
	-moz-border-radius: 0px 0px 10px 10px;
	-webkit-border-radius: 0px 0px 10px 10px;
	border-radius: 0px 0px 10px 10px;	
	}
 
hr{clear:both}

ul {margin-bottom:2em;}
.citaat{padding-left: 1em}
.bibliografie{padding-left: 130px}
.covers {margin-left:-130px; width:130px; clear:both}
.covers img {max-width:110px}
.covers png {max-width:110px}
.header h1{padding: 0.5em 0.5em;text-align: center;}
.header h2{text-align: center;}

.fragment {background-color:#FFF; border-style:inset; border-width:1px; padding:1em; margin-top:1em;margin-bottom:1em; line-height:1.3}
.fragment a{vertical-align: super;}