/*  ┌───────────────────────────────────────────────────────────────────────┐ *\
    │                    CSS-doosmodel ▼ CSS Box model                      │
    └───────────────────────────────────────────────────────────────────────┘

>   margin : transparante marge tussen rand en aangrenzend element
>>  border : rand
>>> padding: opvulling tussen rand en inhoud
>>> content: inhoud

                                   (top)
              ┌ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ┐
              | margin                                        |
              |                                               |
              |    ╔═════════════════════════════════════╗    |
              |    ║ border                              ║    |
              |    ║                                     ║    |
              |    ║    ┌---------------------------┐    ║    |
              |    ║    ¦ padding                   ¦    ║    |
              |    ║    ¦                           ¦    ║    |
              |    ║    ¦    ┌─────────────────┐    ¦    ║    |
              |    ║    ¦    │                 │    ¦    ║    |
       (left) |    ║    ¦    │     content     │    ¦    ║    | (right)
              |    ║    ¦    │                 │    ¦    ║    |
              |    ║    ¦    └─────────────────┘    ¦    ║    |
              |    ║    ¦                           ¦    ║    |
              |    ║    ¦                           ¦    ║    |
              |    ║    └---------------------------┘    ║    |
              |    ║                                     ║    |
              |    ║                                     ║    |
              |    ╚═════════════════════════════════════╝    |
              |                                               |
              |                                               |
              └ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ┘
                                   (bottom)

    ┌───────────────────────────────────────────────────────────────────────┐
    │                        Doosmodel ▲ Box model                          │
\*  └───────────────────────────────────────────────────────────────────────┘ */


/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                       Lettertype ▼ Font                               │
    └───────────────────────────────────────────────────────────────────────┘ */

body
{
	font-family: Verdana, sans-serif;
}

h1,
h2
{
	font-family: Arial, "Liberation Sans", sans-serif;
}

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                       Lettertype ▲ Font                               │
    └───────────────────────────────────────────────────────────────────────┘ */

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                    Lettergrootte ▼ Font size                          │
    └───────────────────────────────────────────────────────────────────────┘ */

body,
h3,
h4,
h5,
.invisible th,
.invisible td
{
	font-size: 14px; /* 100% */
}

h1
{
	font-size: 19.6px; /* 140% */
}

h2
{
	font-size: 16.8px; /* 120% */
}

td,
th,
#menu,
.button,
.key,
.option
.accordion,
.spoiler
{
	font-size: 13px; /* 0,93% */

}

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                    Lettergrootte ▲ Font size                          │
    └───────────────────────────────────────────────────────────────────────┘ */

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                           Inhoud ▼ Content                            │
    └───────────────────────────────────────────────────────────────────────┘ */

body
{
	background: #fff;
	color: #2c3c4a;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	line-height: 170%;
	margin: 0px 0px 15px 288px; /* boven rechts onder links */
	text-align: left;
}

body.contents
{	/* voor gebruik in inhoudsopgave */
	margin: 0px;
}

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                           Inhoud ▲ Content                            │
    └───────────────────────────────────────────────────────────────────────┘ */

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                    Zwevend kader ▼ Inline frame                       │
    └───────────────────────────────────────────────────────────────────────┘ */

iframe
{
	border-right: 1px solid #a9b4c2;
	bottom: 0px;
	height: 100%;
	left: 0px;
	position: fixed;
	top: 0px;
	width: 288px;
}

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                    Zwevend kader ▲ Inline frame                       │
    └───────────────────────────────────────────────────────────────────────┘ */

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                      Koppelingen ▼ Hyperlinks                         │
    └───────────────────────────────────────────────────────────────────────┘ */

a
{	/* koppeling */
	color: #2f6292;
	text-decoration: none;
}

a:visited
{	/* bezochte koppeling */
	color: #308f00;
}

a:hover
{	/* koppeling onder muisaanwijzer */
	text-decoration: underline;
}

a.noline:link,
a.noline:visited,
a.noline:hover,
a.noline:active
{	/* koppeling zonder onderstreping */
	color: #2d71b2;
	text-decoration: none;
}

a.ext
{	/* externe koppeling */
	background-image: url(./Images/inner/arrow.png);
	background-position: right;
	background-repeat: no-repeat;
	padding: 0px 13px 0px 0px; /* boven rechts onder links */
}

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                      Koppelingen ▼ Hyperlinks                         │
    └───────────────────────────────────────────────────────────────────────┘ */

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                        Paragraaf ▼ Paragraph                          │
    └───────────────────────────────────────────────────────────────────────┘ */

p
{
	margin: 10px 10px 0px 10px; /* boven rechts onder links */
}

p.log .plus,
p.log .equal,
p.log .minus
{	/* beschrijving "+", "-" en "-"-teken in wijzigingslogbestanden */
	padding: 1px 40px 0px 20px; /* boven rechts onder links */
}

p.switch
{	/* pijltjesschakelaar in inhoudsopgave */
	float: right;
	margin-right: 10px;
	margin-top: 2px;
}

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                        Paragraaf ▲ Paragraph                          │
    └───────────────────────────────────────────────────────────────────────┘ */

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │  Lijstelementen in inhoudsopgave ▼ List elements in table of contents │
    └───────────────────────────────────────────────────────────────────────┘ */

#menu,
#menu a
{
	color: #2f6292;
	display: block;
}

#menu ul
{
	line-height: 125%;
	list-style-type: none;
	margin: 0px;
	padding: 0px 0px 0px 20px; /* boven rechts onder links */
}

#menu ul li
{
	font-weight: bold;
}

#menu ul li ul li
{
	font-weight: normal;
	left: 16px; /* tekstpositie verplaatsen */
	position: relative;
}

#menu ul li ul li a
{
	color: #2f6292;
	text-decoration: none;
}

#menu ul li ul li:hover,
#menu ul li ul li:hover a
{
	background: #2f6292;
	color: #fff;
}

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │  Lijstelementen in inhoudsopgave ▲ List elements in table of contents │
    └───────────────────────────────────────────────────────────────────────┘ */

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │          Overige lijstelementen  ▼ Other list elements                │
    └───────────────────────────────────────────────────────────────────────┘ */
ol
{	/* genummerde lijst */
	margin: 0px 10px 10px 7px; /* boven rechts onder links */
}

ol.log
{	/* genummerde lijst */
	margin: 0px 10px 0px 4px; /* boven rechts onder links */
}

ul
{	/* ongeordende lijst */
	margin: 0px 10px 10px 0px; /* boven rechts onder links */
}

li
{	/* lijstitem */
	margin: 0px 10px 0px -14px; /* boven rechts onder links */
}

ul.text-indent
{
	/* lijstitemtekst naar rechts verplaatsen */
	text-indent: 6px; /* afstand van kader tot tekst */
}

ul.added,
ul.modified,
ul.deleted
{
	list-style-type: none;
	margin: 0px 4px 0px -14px; /* boven rechts onder links */
}

ul.added > li,
ul.modified > li,
ul.deleted > li
{	/* voor lijstitems in ongeordende lijst met added-class */
	background-position: left top;
	background-repeat: no-repeat;
	padding: 0px 4px 0px 20px; /* boven rechts onder links */
}

ul.added > li
{	/* voor lijstitems in ongeordende lijst met added-class */
	background-image: url(./Images/inner/plus.png);
}

ul.modified > li
{	/* voor lijstitems in ongeordende lijst met modified-class */
	background-image: url(./Images/inner/equal.png);
}

ul.deleted > li
{	/* voor lijstitems in ongeordende lijst met deleted-class */
	background-image: url(./Images/inner/minus.png);
}

ul > li > ul > li
{	/* voor lijstitems op 2e niveau van ongeordende lijst */
	position:relative; left:-10px; /* tekstpositie verplaatsen naar links */
}

ul > li > ul > li > ul > li
{	/* voor lijstitems op 3e niveau van ongeordende lijst */
	position:relative; left:-12px; /* tekstpositie verplaatsen naar links */
}

ol.toleft > li
{	/* voor lijstitems in genummerde lijst (faq) */
	position:relative; left:0px; /* tekstpositie verplaatsen naar links */
}

ul.toleft > li
{	/* voor lijstitems in ongeordende lijst (faq) */
	position:relative; left:-6px; /* tekstpositie verplaatsen naar links */
}

li img
{	/* marge voor plaatjes in opsomming */
	margin: 10px 10px 10px -1px; /* boven rechts onder links */
}

li.bottomspace
{	/* marge na lijstitems in genummerde lijst (bij Antwoorden in faq) */
	margin-bottom: 40px;
}


/*  ┌───────────────────────────────────────────────────────────────────────┐
    │          Overige lijstelementen  ▲ Other list elements                │
    └───────────────────────────────────────────────────────────────────────┘ */

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                       Kopteksten ▼ Headers                            │
    └───────────────────────────────────────────────────────────────────────┘ */

h1,
h2
{
	color: #324353;
}

h1
{	/* titel */
	background: #cbcdcb;
	border-bottom: 1px solid #a9b4c2;
	margin: 0px;
	padding: 6px;
	text-align: center;
}

h2
{	/* koptekst met rand */
	background: #f7f4ed;	
	border: 1px solid #a3a2a0;
	border-radius: 4px;
	margin: 20px 8px 8px 8px; /* boven rechts onder links */
	padding: 2px 2px 2px 6px; /* boven rechts onder links */
}

h2.contents
{	/* voor gebruik in inhoudsopgave */
	margin: 7px;
}

h3,
h4,
h5
{
	font-weight: normal;
	padding: 2px;
}

h3,
h4
{
	font-style: italic;
}

h3
{	/* vette koptekst */
	font-weight: bold;
	margin: 20px 8px 12px 8px; /* boven rechts onder links */
}

h4
{	/* cursieve koptekst in opsomming */
	margin: 20px 12px 12px 0px; /* boven rechts onder links */
}

h4.ul1
{	/* eerste cursieve koptekst in opsomming met inspringing naar links en naar boven */
	margin: 8px 0px 0px 0px; /* boven rechts onder links */
	text-indent: -2px;
}

h4.ul2
{	/* tweede cursieve koptekst in opsomming met inspringing naar links en naar boven */
	margin: -2px 0px 0px 0px; /* boven rechts onder links */
	text-indent: -2px;
}

h4.log
{	/* cursieve koptekst in wijzigingslog */
	margin-left: 8px;
}
	
h5
{	/* koptekst met een normaal lettertypegewicht in opsomming */
	margin: 20px 12px 12px 0px; /* boven rechts onder links */
}

h5.blue
{	/* blauwe koptekst */
	color: #2f6292;
}

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                 Horizontale lijn ▼ Horizontal line                    │
    └───────────────────────────────────────────────────────────────────────┘ */

hr
{
	margin: 8px;
}

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                 Horizontale lijn ▼ Horizontal line                    │
    └───────────────────────────────────────────────────────────────────────┘ */

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                         Plaatjes ▼  Images                            │
    └───────────────────────────────────────────────────────────────────────┘ */

img
{
	border: 0px;
}

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                         Plaatjes ▲ Images                             │
    └───────────────────────────────────────────────────────────────────────┘ */

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                         Tabellen ▼ Tables                             │
    └───────────────────────────────────────────────────────────────────────┘ */

table,
td
{
	/* tabelgegevens */
	border: 1px solid #cccccc;
	border-collapse: collapse;
	height: auto;
	margin: 10px;
}

tr
{	/* rijgegevens */
	background: #fbfbfb;
}

td,
th
{
	padding: 4px; /* boven rechts onder links */
	text-align: left;
	vertical-align: top;
}

th
{
	background: #e1e0dc;
	border: 1px solid #bbb;
	font-weight: bold;
}

table.list
{
	/* klasse om tabelgegevens naar links verplaatsen, bij gebruik in tekstvak als in eerste cel een symbool ("•", "-", etc.) wordt gebruikt */
	text-indent: -2px; /* afstand van kader tot tekst */
}

tbody.hover tr:hover
{
	/* rij markeren met muisaanwijzer */
	background: #f7f4ed;
}

tbody.hover2rows tr:hover,
.hover2rows tr:hover + tr
{
	/* rij markeren met muisaanwijzer, bij gebruik van gecombineerde rijen */
	background: #f7f4ed;
}

.center
{
	/* tabelgegevens en tabelkoptekst horizontaal centreren */
	text-align: center;
}

.vcenter
{	/* tabelgegevens en tabelkoptekst verticaal centreren */
	vertical-align: middle
}

.footnotetext1
{	/* voetnoottekstopmaak in tabelgegevens <td></td> */
	padding-left: 0px;
	padding-top: 0px;
}

.footnotetext2
{	/* voetnoottekstopmaak voor paragraaf <p></p> */
	margin: 10px 10px 0px 4px;
}

.invisible,
.invisible tr,
.invisible th,
.invisible td
{	/* tabel zonder zichtbare randen en met normale tekstgrootte */
	background: none;
	border: none;
	border-collapse: collapse;
	font-family: Verdana, Arial, sans-serif;
	line-height: 125%;
}
sup, sub { /* в степени "ПКМ!" */
	color: #FF0000;
}
.nomargin
{	/* voor tabel zonder randen, in genummerde lijst (faq) */
	margin: 0px;
}

.onlyleftmargin
{	/* voor tabel zonder randen, met alleen linkermarge */
	margin: 0px 0px 0px 9px; /* boven rechts onder links */
}

.toleft,
.toleft td
{	/* voor tabel zonder zichtbare randen, zoals gebruik van plaatjes */
	line-height: 170%;
	margin-left: -4px;
}

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                         Tabellen ▲ Tables                             │
    └───────────────────────────────────────────────────────────────────────┘ */

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │     Gecombineerde rijen/kolommen ▼ Combined rows/columns              │
    └───────────────────────────────────────────────────────────────────────┘ */

.row1 td,
.row1 th,
.row2 td,
.row2 th
{
	padding: 0px 4px 0px 4px; /* boven rechts onder links */
}
	
.row1 td,
.row1 th
{	/* geen rand aan onderkant van eerste rij */
	border-bottom: none;
}

.row2 td,
.row2 th
{	/* geen rand aan bovenkant van tweede rij */
	border-top: none;
}

.col1
{	/* geen rand aan rechterkant van eerste gecombineerde kolom */
	border-right: none;
}

.col2
{	/* geen rand aan linkerkant van tweede gecombineerde kolom */
	border-left: none;
}

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │     Gecombineerde rijen/kolommen ▲ Combined rows/columns              │
    └───────────────────────────────────────────────────────────────────────┘ */

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │       Gemeenschappelijke klassen ▼ Common classes                     │
    └───────────────────────────────────────────────────────────────────────┘ */

.button,
.key
{
	border: 1px solid #a0a0a0;
	border-radius: 4px;
	color: #1c252e;
}

.button
{	/* voor spelerknoppen */
	background: #fafafa; /* terugvaloptie voor browsers die de gradient-optie niet ondersteunen */
	background: linear-gradient(to top, #eeeeee, #fff);
	margin: 0px 1px 0px 1px; /* boven rechts onder links */
	padding: 0px 6px 1px 6px; /* boven rechts onder links */
}

.key
{	/* voor toetsen en muisknoppen */
	background: #e0e0e0; /* terugvaloptie voor browsers die de gradient-optie niet ondersteunen */
	background: linear-gradient(to top, #d0d0d0, #fff);
	box-shadow: 2px 2px 2px 0px #999999; /* h-schaduw v-schaduw vervaging verspreiding kleur inzet */
	margin: 0px 2px 0px 1px; /* boven rechts onder links */
	white-space: nowrap;
 	padding: 0px 7px 1px 7px; /* boven rechts onder links */
}

.option
{	/* voor opties en functies */
	background-color: #fff;
	border: 1px solid #a0a0a0;
	border-radius: 0px;
	color: #990000;
	margin: 0px 2px 0px 2px; /* boven rechts onder links */
	padding: 0px 4px 1px 4px; /* boven rechts onder links */
}

.path
{	/* voor menu- en zoekpadverwijzigingen */
	color: #990000;
	font-weight: bold;
}

.plus,
.equal,
.minus
{	/* "+", "-" en "-"-teken in wijzigingslogbestanden */
	background-position: left top;
	background-repeat: no-repeat;
	padding: 0px 4px 0px 20px; /* boven rechts onder links */
}

.plus
{	/* "+"-teken in wijzigingslogbestanden */
	background-image: url(./Images/inner/plus2.png);
}

.equal
{	/* "="-teken in wijzigingslogbestanden */
	background-image: url(./Images/inner/equal2.png);
}

.minus
{	/* "-"-teken in wijzigingslogbestanden */
	background-image: url(./Images/inner/minus2.png);
}


/*  ┌───────────────────────────────────────────────────────────────────────┐
    │       Gemeenschappelijke klassen ▲ Common classes                     │
    └───────────────────────────────────────────────────────────────────────┘ */


/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                   Accordeonlabel ▼ Accordion label                    │
    └───────────────────────────────────────────────────────────────────────┘ */

	/* voor tonen/verbergen van versie-informatie in logbestanden */

.accordion input,
.accordion .content
{
	display: none;
}

.accordion label,
.accordion input:checked ~ .content
{
	border: 1px solid #dbdbdb;
	cursor: pointer;
	display: block;
	margin: 0px 10px 0px 10px; /* boven rechts onder links */
}

.accordion label
{
	background-color: #f5f5f5;
	background-image: url(./Images/inner/spoilerplus.png);
	background-position: left;
	background-repeat: no-repeat;
	font-style: italic;
	font-weight: bold;
	padding: 4px 4px 4px 16px; /* boven rechts onder links */
}

.accordion input:checked  ~ label
{
	background-image: url(./Images/inner/spoilerminus.png);
}

.accordion input:checked ~ .content
{
	background: #fafafa;
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
	height: auto;
	padding: 4px;
}

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                   Accordeonlabel ▲ Accordion label                    │
    └───────────────────────────────────────────────────────────────────────┘ */

/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                     Spoilerlabel ▼ Spoiler tag                        │
    └───────────────────────────────────────────────────────────────────────┘ */

	/* voor tonen/verbergen van tekstgedeelten */

.spoiler > input,
.spoiler > .content
{
	display: none;
}

.spoiler > .title,
.spoiler > :checked ~ .content
{
	border: 1px solid #dbdbdb;
	cursor: pointer;
	display: block;
	margin: 0px 10px 0px 10px; /* boven rechts onder links */
}

.spoiler > .title
{
	background-color: #f5f5f5;
	background-image: url(./Images/inner/spoilerplus.png);
	background-position: left;
	background-repeat: no-repeat;
	border: 1px solid #dbdbdb;
	font-style: italic;
	font-weight: bold;
	padding: 4px 4px 4px 16px; /* boven rechts onder links */
}

.spoiler > :checked ~ .title {
	background-image: url(./Images/inner/spoilerminus.png);
}

.spoiler > :checked ~ .content
{
	background: #fafafa;
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
	padding: 4px;
}
/*  ┌───────────────────────────────────────────────────────────────────────┐
    │                     Spoilerlabel ▲ Spoiler tag                        │
    └───────────────────────────────────────────────────────────────────────┘ */