/* ==========================================================================
   HTML5 Boilerplate styles - h5bp.com (adapted)
   ========================================================================== */

html { font-size: 62.5%; }

html,
button,
input,
select,
textarea {
    color: #000;
}

body {
    font-family: Verdana, Helvetica, sans-serif;
    /*
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.4;
    */
}

/* chrome fix --------- */
body>div {
	font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.4;
}

::-moz-selection {
    background: #ffc;
    text-shadow: none;
}

::selection {
    background: #ffc;
    text-shadow: none;
}

a { text-decoration: none; }

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

img {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}


/* ==========================================================================
   Author's styles
   ========================================================================== */
/* @group typography ******************************************************** */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700;
}
h1 {
  margin-bottom: 0.75em;
  font-size: 24px;
  font-size: 2.4rem;
  line-height: 1.2;
}
h2 {
  margin-bottom: 0.75em;
  font-size: 21px;
  font-size: 2.1rem;
  line-height: 1.2;
}
h3 {
  margin-bottom: 1em;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.3;
}
h4 {
  margin-bottom: 1em;
  font-size: 15px;
  font-size: 1.5rem;
  line-height: 1.25;
}
h5 {
  margin-bottom: 1.5em;
  font-size: 13px;
  font-size: 1.3rem;
}
h6 {
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.2em;
  margin-bottom: 6px;
  margin-bottom: 0.6rem;
}
p {
  hyphens: none;
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 1.4em;
}
dl { float: left; padding: 0 0 12px; margin: 0; width: 440px; }
dt { float: left; clear: both; width: 80px; padding: 0 10px 0 0; margin: 0; }
dd { float: right; padding: 0; margin: 0; width: 350px; }
article li::before {
    content: "\002D \0020";
}
article li {
    line-height: 1.5em;
}
article p {
    margin-top: 4px;
    margin-top: 0.4rem;
}
section[id="main"] article p:last-child { margin-bottom: 70px; }
section#main article h4 { font-size: 12px; font-size: 1.2rem; margin-top: 2.33em; margin-bottom: 0.6rem; line-height: 1.2em; }
section#main article table { margin: 10px 0; }
section#main article th { text-align: left; font-size: 11px; font-style: italic; }
section#main article ul { list-style: none outside; margin: 0; padding: 0 0 0 1em; text-indent: -0.83em; }
section#paginaMenu h4 { color: #417DD6; margin: 40px 0 0.875em; }
section#paginaMenu h4#lemminkainen { color: #000; font-size: 14px; margin: 0 0 0.875em; }
section#actueel h5 { color: #D9253F; margin: 40px 0 0.875em; text-transform: uppercase; }
/* @end typography   ******************************************************** */

/* @group layout structure ************************************************** */
div#container { 
    position: relative; 
    margin: 0 auto 70px; 
    padding: 0 0 45px;
    width: 930px;  
}

div#container>header { position: relative; height: 175px; width: 930px; background: #fff; }
    section.links { position: absolute; top: 0; height: 23px; z-index: 20; }
        .links ul { list-style: none outside; margin: 5px 0 0 0; padding: 0 0 0 11px; }
        .links ul, .links li { float: left; }
        .links li { margin-right: 23px; }
        .links a { display: block; text-transform: uppercase; color: #4E4E4E; font-size: 10px; font-size: 1rem; }
        .links a:hover { text-decoration: underline; }
        .links ul>li:first-child a { padding-left: 18px; background: url(../img/bg/pijltje.gif) no-repeat 6px 4px; }
        .links ul>li:first-child a:hover { padding-left: 18px; background: url(../img/bg/pijltje.gif) no-repeat 6px -89px; }
    
    form#siteSearch { position: absolute; top: 0; margin: 0; left: 22.5em; z-index: 20; }
    #siteSearch fieldset { margin: 0; padding: 0; border: 0; background-color: transparent; }
    #siteSearch input { 
        float: left;
        font-size: 12px;
        font-size: 1.2rem;      
        -moz-border-radius-bottomleft: 2px;
        -webkit-border-bottom-left-radius: 2px;
        border-bottom-left-radius: 2px;    
        border-top: none;
        border-right: none;
        border-bottom: 1px solid #7E7D7D;
        border-left: 1px solid #7E7D7D;
        background-color: white;
        width: 168px; 
        height: 22px;
        padding: 0 3px;
        margin: 0;
    }
    #siteSearch input::-webkit-input-placeholder { color: #8F8F8F; font-size: 11px; }
    #siteSearch input:-moz-placeholder { color: #8F8F8F; font-size: 11px; }
    
    #siteSearch input[type="submit"] {
        background: #fff url('../img/bg/header/zoek.gif') no-repeat right bottom;
        border: none;
        width: 22px;
        height: 23px;
    }
    h5#kopZoekResultaten { margin: 19px 0 0; }
    ul#zoekresultaten { padding: 0; list-style: none; }
    #zoekresultaten h5 { margin: 20px 0 0; text-decoration: underline;}
    #zoekresultaten h5+p { margin: 3px 0; }
    
    nav[role="navigation"] { 
        position: absolute; 
        left: 0; 
        top: 25px; 
        width: 930px;
        height: 276px;
    }
    nav[role="navigation"]>ul { margin: 42px 0 0; padding: 0; float: left; }
    nav[role="navigation"]>ul>li:nth-child(1) { width: 126px; margin-right: 5px; }
    nav[role="navigation"]>ul>li:nth-child(2) { width: 197px; margin-right: 5px; }
    nav[role="navigation"]>ul>li:nth-child(3) { width: 201px; margin-right: 5px; }
    nav[role="navigation"]>ul>li:nth-child(4) { width: 169px; margin-right: 9px; }
    nav[role="navigation"]>ul>li:nth-child(5) { width: 205px; }    
    
div#content { 
    position: relative; 
    /* top: 175px; */
    width: 890px; 
    margin: 0 20px 0 20px;
    background: url(../img/bg/content_bg.png) repeat-y left top;
}
    section#paginaMenu, section[id="main"], section#actueel { float: left; background-color: white; min-height: 650px; font-size: 12px; font-size: 1.2rem; }
    section#paginaMenu { width: 170px; margin-right: 8px; padding: 0 15px 10px 21px; }
    section#paginaMenu nav {  }
    section#paginaMenu nav ul { margin: 0; padding: 0; }
    section#paginaMenu nav ul>li { margin: 0 0 7px 0; }
    #paginaMenu img#plaatjeKop { position: absolute; top: 7px; left: 0; }
    #paginaMenu img { margin: 35px 0; } /* logo */
    #paginaMenu .vcard { float: none; position: relative; margin: 0px 0px 100px; left: 0; }
    #home section[id="main"], #default section[id="main"] { width: 440px; padding: 0 30px 10px; margin-right: 8px; }
    section[id="main"] { width: 440px; padding: 60px 30px 10px; margin-right: 8px; }
    #searchresults { position: relative; margin-top: 60px; min-height: 511px; }
    section#actueel { width: 126px; padding: 0 21px 10px; }
    
footer { position: relative; top: 4px; margin: 0 20px; height: 34px; width: 890px; background-color: #fff; color: #000; clear: both; }
footer section.links { top: 6px; }
footer ul:nth-child(2) { margin-left: 215px; }
/* @end layout structure **************************************************** */

/* @group navigation ******************************************************** */    
nav[role="navigation"]>ul>li ul { margin: 0; padding: 15px 0 10px; }
nav[role="navigation"]>ul>li>a { padding-bottom: 0.5em; }
nav[role="navigation"] li { float: left; position: relative; text-align: center; }
nav[role="navigation"] li ul { display: none; position: absolute; background-color: #F6F6EE; color: #417DD6; z-index: 10; }
nav[role="navigation"] li>ul { top: auto; left: auto; }
nav[role="navigation"] li:hover ul { display: block; } 

/* layout */
nav[role="navigation"] li ul { min-width: 100%; }
nav[role="navigation"]>ul>li:nth-child(1)>ul { width: 200px; }
nav[role="navigation"] li ul li { text-align: left; padding-bottom: 10px; clear: left; }
nav[role="navigation"]>ul li>a { display: block; font-weight: 700; color: #000; }
nav[role="navigation"] ul li ul a, #paginaMenu a, #actueel a { 
    display: block; 
    padding-left: 36px;
    color: #417DD6;
    font-size: 12px; 
    font-size: 1.2rem; 
    line-height: 15px; 
    line-height: 1.5rem; 
    font-weight: normal;
    background: url(../img/bg/pijltje.gif) no-repeat 18px 4px;
}
nav[role="navigation"]>ul li ul a:hover { background-position: 18px -89px; text-decoration: underline; color: #024cd6; }
nav[role="navigation"] a#active,
nav[role="navigation"] li.active>a,
nav[role="navigation"] li:hover a { color: #417DD6; }
/* links */
#content a { color: #417DD6; }
#content a:hover { text-decoration: underline; }
#actueel ul { margin: 0; padding: 0; list-style: none outside; }
#actueel li { margin: 0 0 5px 0; }
#paginaMenu a, #actueel a, a#routebeschrijving { padding-left: 17px; background: transparent url(../img/bg/pijltje.gif) no-repeat 0 5px; }	
#paginaMenu a:hover, #actueel a:hover { background-position: 0 -88px; color: #024cd6; }	
#paginaMenu li.active>a,
#actueel li.active>a  { color: #417DD6; font-weight: 700; background-position: 0 -88px; } 
section.links li.active>a { font-weight: 700; }

a#routebeschrijving { font-size: 11px; margin-top: 5px; padding-left: 12px; display: inline-block; background-position: 0 6px; }
a#routebeschrijving:hover { background-position: 0 -87px; color: #024cd6; }
/* @end navigation ********************************************************** */

/* @group backgrounds ******************************************************* */
/* background navigatie */
#default nav[role="navigation"],
#hoekanik nav[role="navigation"],
#home nav[role="navigation"] { background: url('../img/bg/header/hoekanik.jpg') no-repeat left top; }
#activiteiten nav[role="navigation"] { background: url('../img/bg/header/activiteiten.jpg') no-repeat -1px top; }
#patientenkring nav[role="navigation"] { background: url('../img/bg/header/patientenkring.jpg') no-repeat 1px top; }
#aanvullende-zorg nav[role="navigation"] { background: url('../img/bg/header/aanvullendezorg.jpg') no-repeat -1px top; }
#achtergrondenvisie nav[role="navigation"] { background: url('../img/bg/header/achtergrondenvisie.jpg') no-repeat left top; }
/* background pagina's */
#home>div#container, #default>div#container, #hoekanik>div#container { background: url('../img/bg/bg_home.jpg') repeat-y left top white; }
#activiteiten>div#container { background: url('../img/bg/bg_activiteiten.jpg') repeat-y left top white; }
#patientenkring>div#container { background: url('../img/bg/bg_patientenkring.jpg') repeat-y left top white; }
#aanvullende-zorg>div#container { background: url('../img/bg/bg_aanvullende_zorg.jpg') repeat-y left top white; }
#achtergrondenvisie>div#container { background: url('../img/bg/bg_visie.jpg') repeat-y left top white; }
/* @end backgrounds   ******************************************************* */

/* @group main ************************************************************** */
/* home */
section>header { margin-bottom: 28px; }
figure#logo { float: left; position: relative; margin-top: 32px; left: 22px; }
.vcard { float: right; position: relative; margin-top: 40px; left: 10px; }
.vcard span { font-size: 11px; }
.vcard .fn { display: none; }

#paginator { position: relative; margin: 50px 0; width: 410px; }
#paginator-r { float: right; }
/* veelgestelde vragen */
html.js #veelgestelde_vragen p.antwoord {display: none;}
#veelgestelde_vragen p.antwoord {margin: 0.5em 0 1em;}
#veelgestelde_vragen p { margin-bottom: 0.5em; }
/* @end main **************************************************************** */


/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 35em) {

}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
       only screen and (min-resolution: 144dpi) {

}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 100%;
}

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}
/* skip link http://webaim.org/techniques/skipnav/ */
#skiplink a, #skiplink a:link, #skiplink a:visited, #skiplink a:hover { 
    position: absolute; 
    overflow: hidden;
    left: 0; 
    top: -500px; 
    width: 1px; 
    height: 1px; 
 } 

#skiplink a:active, #skiplink a:focus { 
    position: static; 
    border: solid #333 2px; color: #fff; background: #555;
    width: auto; 
    height: auto; 
 }

 /* @group formulieren ********************************************************* */
form { margin-bottom: 20px; } 
fieldset { margin: 0 0 20px 0; background-color: transparent; border: 1px solid #A0A0A0; padding: 15px; }
form fieldset:last-of-type { margin-bottom: 10px; }
legend { padding: 3px; background-color: #F6F6EE; font-weight: 700; border: 1px solid #808069; }
ul.zemError { list-style: none outside; padding: 15px 0 15px 15px; border: 1px solid red; }
abbr[title] {border: none;}
label { display: block; } 
label.zemRequired:after { content: "\20 \2A" ; color: red; }

input { padding: 3px 2px 1px 3px; margin-bottom: 10px; border: 1px solid #cecece; height: 1.25em; }
input, textarea { background-color: #F6F6EE; }
input[type="submit"] { 
  background-color: #F6F6EE; 
  height: 2.5em; 
  margin: 10px 10px 10px 0; 
  padding: 1em; 
  border-bottom-color: #808069;
  border-right-color:  #808069;  
}

/* patientenkring */
#patientenkring p { margin-bottom: 15px; }
#patientenkring a#hhrc { display: block; margin-top: 5px; outline: none; } 
#patientenkring .disabled { color: #A8A8A8; font-weight: bold; }
#patientenkring .disabled:hover { text-decoration: none; cursor: default; }
label.afhalen { display: inline; padding-right: 10px; }
#patientenkring input[id^="geneesmiddel_"] { width: 93%; }
/* label[for^='geneesmiddel_'] { font-weight: 700;} */
#patientenkring fieldset div { width: 364px; padding: 10px 0; }
html.js #patientenkring fieldset:nth-of-type(2)>div:nth-of-type(1n+2) { display: none; }
#patientenkring fieldset:nth-of-type(2)>div:nth-of-type(even) { background-color: #EEEED1; padding-left: 0.5em; border-top: 1px solid black; border-bottom: 1px solid black; }
.zemThanks { font-size: 1.2em; font-weight: 700; }

/* errors */
label.zemRequirederrorElement { color: red; }
input.zemRequirederrorElement { border: 2px solid red; }
ul.zemError {
    background-color: red;
    transition: background-color 2s linear;
    -moz-transition: background-color 2s linear;
    -webkit-transition: background-color 2s linear;
    -o-transition:background-color 2s linear;

}
ul.zemError.transition { background-color: white; }
 /* @end formulieren *********************************************************** */

 /* Google map ***************************************************************** */
 #map_canvas { width: 440px; height:600px; }

/* microsoft bugs */
.lt-ie8 div#container header { z-index: 40; } /* IE7 z-index bug on child dropdowns */
.lt-ie8 nav[role="navigation"] > ul > li ul li { width: 100%; } /* or IE7 shrinks it to the longest word and gently wraps the rest */
.lt-ie9 nav[role="navigation"] { margin: 0; padding: 0; height: 150px; left: 0; } /*  left 0 because it likes to take a walk */
.lt-ie9 nav[role="navigation"] li>ul { left: 0; } /* because they also like to take a walk */
/* Thanks again Bill */