@font-face { font-family: open-dyslexic; src: url('/assets/fonts/OpenDyslexic3-Regular.ttf'); }




div.photo img, 
div.afbeelding img, div#afbeelding img{
padding:5px;
background:#fff;
margin:0px 8px 8px 0px;
border:1px solid #ccc;
}

div.image img {
padding:5px;
background:#fff;
margin:0px 8px 8px 0px;
border:1px solid #ccc;
}


div.afbeelding, div#afbeelding {
}

div.photo {
display:inline;
}

div.photo img, 
div.afbeelding img, div#afbeelding img{
padding:5px;
background:#fff;
margin:0px 8px 8px 0px;
border:1px solid #ccc;
}

div.photo a img:hover,
div.afbeelding a img:hover, div#afbeelding a img:hover{
padding:4px;
border:2px solid #ccc;
}

div.bijschrift, div#bijschrift{
clear:left;
font-style:italic;
}


em.kleur2 {
color: #2B91AF;
font-style: italic;
}


#content #antwoord, #content div.antwoord, div.content div.antwoord {
background: #d4e480;
border: 1px solid #3c5c02;
}


div.kantlijnstap {
background-color: #d4e480;
font-size: 16px;
font-weight: bold;
margin-top: 20px;
padding: 5px;
text-align: left;
}

div.toets_kantlijn{
float: left;
clear: left;
margin: 20px 0px 0px -220px;
position: relative;
width: 210px;
}

#kantlijn, div.kantlijn {
float: right;
clear: right;
margin: 0 -252px 0 0;
position: relative;
width: 205px;
}

div.kantlijn div.stap,
#kantlijn #stap, #kantlijn div.stap{
font-size:16px;
font-weight:bold;
text-align:right;
}

div.kantlijn div.vraag,
#kantlijn #vraag, #kantlijn div.vraag{
font-size:16px;
font-weight:bold;
text-align:right;
margin:0px;
padding:0px;
}

div.kantlijn div.opdracht,
#kantlijn #opdracht, #kantlijn div.opdracht{
font-size:16px;
font-weight:bold;
text-align:right;
}

div.probeer, #probeer {font-weight:bold;}
div.vbtitel, #vbtitel {font-weight:bold;}
div.letop, #letop {font-weight:bold;}
div.intro, #intro {font-weight:bold;}
div.tips, #tips {font-weight:bold;}
div.tip, #tip {font-weight:bold;}

/* tabellen */ 
table.tabel-x1 {
    width:auto;
    background:#e5ecf1;
    color: #f37322;
    border:none;
    font-weight:bold;
}
table.tabel-x1 td {
    padding:5px 10px;
    border:none;
}

table.tabel2 {border-collapse: collapse;}
table.tabel2 td {
    background: none repeat scroll 0 0 #FFFFFF;
    padding: 2px 5px;
}
table.tabel2 th {
	color:#004175;
    padding: 2px 5px;
}
table.tabel2 caption {
    caption-side: bottom;
}
table.tabel3 {
    border-collapse: collapse;
}
table.tabel3 td {
    padding: 2px 5px;
}
table.tabel3 th {
    padding: 2px 5px;
}
table.tabel3 caption {
    caption-side: bottom;
}
table.probeer {
    border-collapse: collapse;
}
table.probeer td {
    padding: 2px 5px;
}
table.probeer td.antwoord, table.probeer td.geluid {
    padding: 2px 5px;
    width: 100px;
}
table.probeer td.antwoord:hover div {
    display: none;
}
table.probeer td.antwoord p {
    display: none;
}
table.probeer td.antwoord:hover p {
    display: inline;
}
table.wintoets {
    border-collapse: collapse;
    width: 420px;
}
table.wintoets th {
}
table.wintoets td {
    padding: 5px;
}
table.wintoets td.toetsen ul {
    margin: 0;
    max-width: 400px;
    padding: 0;
}
table.wintoets td.toetsen ul li {
    display: inline;
    float: left;
    list-style-type: none;
    margin: 0;
    padding: 5px 0;
    width: 30px;
}
table.wintoets td.toetsen ul li:hover {
}
table.wintoets td.toetsen ul li a {
    color: #669d04;
}
table.wintoets td.toetsen ul li a:hover, table.wintoets td.toetsen ul li:hover a {
}

table.tabel2 td {
    border: 1px solid #e5ecf1;
}
table.tabel2 th {
    background: none repeat scroll 0 0 #e5ecf1;
    border: 1px solid #e5ecf1;
}
table.tabel3 td {
    background: none repeat scroll 0 0 #d4e480;
    border: 1px solid #669d04;
}
table.tabel3 th {
    background: none repeat scroll 0 0 #669d04;
    border: 1px solid #154A64;
    color: #FFFFFF;
}
table.probeer td {
    border: 1px solid #B9D2E3;
}
table.probeer td.antwoord, table.probeer td.geluid {
    background: none repeat scroll 0 0 #E0ECF3;
}
table.wintoets th {
    background: none repeat scroll 0 0 #E0ECF3;
    border: 1px solid #d4e480;
}
table.wintoets td {
    border: 1px solid #d4e480;
}
table.wintoets td.toetsen ul li:hover {
    background: none repeat scroll 0 0 #669d04;
    color: #FFFFFF;
}
table.wintoets td.toetsen ul li a {
    color: #669d04;
}
table.wintoets td.toetsen ul li a:hover, table.wintoets td.toetsen ul li:hover a {
    color: white;
}

div.melding_fout, div.melding_goed, div.melding {
    line-height: 1.5em;
}
div.melding p {
}
div.melding input, div.melding_goed input, div.melding_fout input {
    font-size: 12px;
}
div.kop, h1 {
    font-size: 16px;
    font-weight: bold;
	color:#3c5c02;
	margin:30px 0px 0px 0px;
}
h1.pag {
    font-size: 18px;
}
div.subkop, div.kop2, h2 {
    font-size: 14px;
    font-weight: bold;
}

.vet, em {
    font-style: normal;
    font-weight: bold;
    color: #f37322;
}
a:link, a:visited {
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
#voetnoot, div.voetnoot {
    font-size: 11px;
    line-height: 1.3em;
}
div.vraag input, #vraag input {
    font-size: 11px;
}
#stap, div.stap, div.content div.stap {
    font-weight: bold;
}
div.bijschrift, div#bijschrift {
    font-style: italic;
}
table.tabel2 th {
    text-align: left;
}
table.tabel2 caption {
    font-style: italic;
    text-align: left;
}
table.tabel3 th {
    text-align: left;
}
table.tabel3 caption {
    font-style: italic;
    text-align: left;
}
table.probeer td {
    vertical-align: top;
}
table.probeer td.antwoord, table.probeer td.geluid {
    text-align: center;
}
table.wintoets td.toetsen ul li {
    font-weight: bold;
    text-align: center;
}
div.kantlijn div.stap, #kantlijn #stap, #kantlijn div.stap {
    font-size: 16px;
    font-weight: bold;
    text-align: right;
}

div.kantlijn div.vraag, #kantlijn #vraag, #kantlijn div.vraag {
    font-size: 16px;
    font-weight: bold;
    margin: 0;
    padding: 0;
    text-align: right;
}
div.kantlijn div.opdracht, #kantlijn #opdracht, #kantlijn div.opdracht {
    font-size: 16px;
    font-weight: bold;
    text-align: right;
}
div.kantlijn div.probeer, #kantlijn #probeer, #kantlijn div.probeer {
    font-weight: bold;
    text-align: right;
}
td.cel4 {
    font-size: 16px;
    font-weight: bold;
}
p.opdrachtnummer {
    font-size: 16px;
    font-weight: bold;
}

pre.vbnet, pre.php {
border: 1px solid #D7D7D7;
background: #F3F3F3;
padding: 10px;
margin: 1em 0px;
}

.vbnet .red, .php .red, tt .red {color: #A31515;}

#content #vraag, #content div.vraag, div.content div.vraag {padding: 5px 10px;margin-bottom: 10px;}
#vraag,div.vraag,div.content div.vraag {background:#d4e480;border:1px solid #d4e480;}
div.vraag input, #vraag input{color:#fff;border:1px solid #154A64;background:#669d04;}
div.antwoordkader{background:#F0F5F9;border:1px solid #d4e480;}
#antwoord, div.antwoord,background:#d4e480;border:1px solid #DFEECF;}
#vraag,div.vraag,div.content div.vraag {padding:5px 10px;margin-bottom:10px;}
#vraag p,div.vraag p,div.content div.vraag p{margin:0px;}
div.vraag textarea, #vraag textarea{width:470px;display:block;}
div.vraag ul textarea{width:380px;}
#stap,div.stap,div.content div.stap {padding-bottom:15px;}
#stap p,div.stap p,div.content div.stap p{margin:0px;}
#antwoord,div.antwoord,div.content div.antwoord {padding:5px 10px; margin:10px 0px 10px 20px; }
#antwoord p,div.antwoord p,div.content div.antwoord p{margin:0px;}
div.antwoordkader{padding:5px 10px;margin:10px 0px;}
#content textarea{width:400px;display:block;}
div.vraag div.antwoordkader,div#vraag div.antwoordkader {padding:0px;margin:0px;border:0px;background:none;}

div#kader, div.kader {background: #d4e480;border: 1px solid #669d04;width: auto;padding: 10px; }



/* content-nav */

#content-nav ul li.home span{background:url(images/groen/nav_home.png) center center no-repeat;}
#content-nav ul li.next span{background:url(images/groen/next.png) center center no-repeat;}
#content-nav ul li.prev span{background:url(images/groen/prev.png) center center no-repeat;}
#content-nav ul li a:visited, #content-nav ul li a:link {color:#669d04;}
/* content-nav HOVER AND ACTIVE */
#content-nav ul li:hover span,#content-nav ul li.active span{background:#669d04;color:#fff;}
#content-nav ul li.prev span:hover {background:url(images/groen/prev_over.png) center center no-repeat #669d04;}
#content-nav ul li.next span:hover {background:url(images/groen/next_over.png) center center no-repeat #669d04;}
#content-nav ul li.home span:hover,#content-nav ul li.home-active span{background:url(images/home_wit.png) center center no-repeat #669d04;}


/* VB.net, PHP en Apps programmeercode */
pre.vbnet, pre.php, pre.apps{border: 1px solid #d7d7d7;background: #f3f3f3;padding:10px;}
.vbnet .grey, .php .gray, tt .grey, .apps .grey{color:#999999;}
.vbnet .purple, .php .purple, tt .purple, .apps .purple{color:#600058;}
.vbnet .blue, .php .blue, tt .blue, .apps .blue{color:#0000ff;}
.vbnet .aqua, .php .aqua, tt .aqua, .apps .aqua{color:#2b91af;}
.vbnet .red, .php .red, tt .red, .apps .red{color:#a31515;}
.vbnet .green, .php .green, tt .green, .apps .green{color:green;}
em.kleur2{color:#2b91af;font-style:italic;}

.show-blip{display:flex}
.show-blip:after{content:'';display:block;position:absolute;top:.25rem;right:0;width:.5rem;height:.5rem;background:#084524;border-radius:100%}

.green_circle {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    font-size: 8px;
    background: #084524;
}