﻿body {
	margin:0px;
	padding: 0px;
	font-family: "Montserrat", sans-serif;
	font-size:12px;
	color: #093281;
}

input, select, textarea {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	border: 1px solid #59D0F8;
	/*border-radius:5px 5px 5px 5px;*/
	padding: 1px;
}
input[type=file] {
	font-size: 8px;
}

input[type=checkbox],input[type=radio],input[type=image] {
	border: 2px;
}

img {
	border: 0px;
}

h1, h2 { color:#59D0F8; margin:0px; }
h3 { color:#59D0F8;
	display: inline;
	font-size: 14px;
}

.wrapper { width: 100%; overflow-y: scroll; position: absolute; top: 0px; bottom: 30px; }

.header { height:104px; font-size:14px; border-bottom: 2px solid #59D0F8; }
.header .logo { position: absolute; margin-top: 2px; }

.inlogbox {
	width: 400px;
	margin-left: auto;
	margin-right: auto;
	vertical-align: middle;
	margin-top: 200px;
}
	.inlogbox a {
		color: #e1007a;
		text-decoration: none;
	}

.banner a { color: #093281; text-decoration: none; }
.banner a:hover { color: #59D0F8; }
.banner .text { height:25px; margin-top: 70px; font-size: 22px; }
.banner .icon { position:fixed; top:130px; left:20px; width:80px; z-index:1;}
.banner .menu { padding-top: 45px; text-align: center; line-height: 28px; text-align: right; text-decoration: none; }
.banner .menu .item:hover { color: #59D0F8; text-decoration: none; }
.banner .menu .actief a { color: #59D0F8; text-decoration: none; }
.banner .menu .subitem:hover { text-decoration: none; }
.banner .menu .subactief a { color: #59D0F8; }

.headercenterwrapper { width: 1000px; margin-left: auto; margin-right: auto; text-align: left; }
.footercenterwrapper { width: 1000px; margin-left: auto; margin-left: calc(50% - 445px); margin-right: auto; text-align: left; }

.messagebox { background:#5EA91A; color:#FFFFFF; line-height:20px; padding:5px; border:1px solid #2c500c; box-shadow:2px 2px 5px rgba(0,0,0,0.3); }
.messagebox_error { background:#D92626; color:#FFFFFF; line-height:20px; padding:5px; border:1px solid #4e0e0e; box-shadow:2px 2px 5px rgba(0,0,0,0.3); }

.footer { position: absolute; bottom: 0px; width: 100%; height: 30px; background: #59D0F8; font-size:14px; line-height: 30px; }
.footer a { color: #ffffff; text-decoration: none; }
.footer a:hover { text-decoration: underline; }


.klikbox { width: 255px; background: #e1007a; color: #ffffff; line-height:24px; padding:15px; min-height:50px; }
.klikbox input { width:99%; font-size: 12px; border-radius: 0px; padding:1px; }

div#popup { position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 100; display: none; background: url('/img/algemeen/popup_bg.png') repeat-x; overflow: auto; font-size: 12px; }
div#popup table#popup_table { height: 100%; }
div#popup table#popup_table td#popup_content { vertical-align: top; border: 1px solid #59D0F8; background-color: #FFFFFF; height: 400px; width: 600px; padding: 0px; }
div#popup .popuptitel { padding: 5px 10px; background-color: #093281; border-bottom: 1px solid #59D0F8; color: #FFFFFF; }
div#popup .popuptitel { padding:10px; }
div#popup .popup_home { padding:10px; }
div#popup a { color: #59D0F8; text-decoration: none; }
div#popup a:hover { text-decoration: underline; }

table.calendar { border: 1px solid #000000; background-color: #FFFFFF; }
	table.calendar td { width: 20px; cursor: pointer; border: 1px solid white; text-align: center; }
	table.calendar td:hover { color: blue; font-weight: bold; }
	table.calendar td.calendar_currentday { color: #0000C0; font-weight: bold; }
	table.calendar td.calendar_selectedday { color: #59D0F8; font-weight: bold; border: 1px solid #59D0F8; }
	table.calendar tr.calendar_week { background-color: #CCCCCC;	}
	table.calendar tr.calendar_footer th { cursor: pointer; }

img { border: 0px; }
a img{ border: none; }

.schaduwveld { border:1px solid #59D0F8; /*border-radius:5px 5px 5px 5px;*/ box-shadow:2px 2px 5px rgba(0,0,0,0.3); }

.knop { background-color: #055a76; width: 150px; padding:1px; color:#FFFFFF; cursor: pointer; }
.knop:hover { background-color:#59D0F8; }
.knopdisabled { background-color: #093281; width: 150px; padding:1px; color:#FFFFFF; }
.knopgroot { height: 30px; font-size:13px; }
.knoprood { background-color:#880000; border:1px solid #ff0000; }
.knoprood:hover { background-color:#ff0000; }
.knopgroen { background-color:#008800; border:1px solid #00ff00; }
.knopgroen:hover { background-color:#00ff00; }

.knopkleineplus { background: url('/img/algemeen/plus.png') top left no-repeat; background-size:18px; width:18px; height:18px; float:left; cursor: pointer; }
.knopkleinemin { background: url('/img/algemeen/min.png') top left no-repeat; background-size:18px; width:18px; height:18px; float:left; cursor: pointer; }
.knopkleinedelete { background: url('/img/algemeen/close.png') top left no-repeat; background-size:18px; width:18px; height:18px; float:left; cursor: pointer; }

.doorgestreept { text-decoration: line-through; }
.groen { color:#00cc00; }
.rood { color:#cc0000; }
.achtergrond_lichtblauw { background-color:#b4fcfe; }
.achtergrond_lichtgrijs { background-color:#cecece; }
.achtergrond_lichtrood { background-color:#ffa4a4; }

.zichtbaar { display:block; }
.verborgen { display:none; height:100%; }

.klikbaar { cursor:pointer; }
.klikbaar:hover { text-decoration: underline; }

.mooiblauw { color: #59D0F8; }

.klikbaarmooiekleur { cursor: pointer; color: #59D0F8; text-decoration: none; }
.klikbaarmooiekleur:hover { text-decoration: underline; }

.deleted { color: #ff0000; text-decoration: line-through; }
.links { float: left; }
.rechts { float: right; }

table {	font-size: 12px; }

table.sorteertabel { padding-top:5px; padding-bottom:5px; }
table.sorteertabel thead tr.sorteerheader td { background: #093281; color: #ffffff; font-weight:bold; border-top-style:solid; border-top-width:1px; /*padding-top:2px;*/ border-bottom-style:solid; border-bottom-width:1px; /*padding-bottom:2px;*/ border-color:#59D0F8; }
table.sorteertabel thead tr.sorteerheader td.sorteerbaar { cursor: pointer; background: #093281 url('/img/sort.png') no-repeat top right; color: #ffffff; }
table.sorteertabel thead tr.sorteerexport { background: #cdddfc; height:10px; }
table.sorteertabel tbody tr.selecteerbaar:hover { background:#d8d8d8; cursor:pointer; } 
table.sorteertabel td { padding-right: 7px; }
table.sorteertabel td:last-child { padding-right:0px; }
table.sorteertabel tfoot td { font-weight:bold; border-top: 1px solid #59D0F8; padding-top:2px; }

.inputerror { border: 1px solid red; color: #ff0000; }

.opmerking .spraakbox-links { position:relative; /*width:250px;*/ padding:5px; border-radius:5px; display:inline-block; margin-left:15px; }
.opmerking .spraakbox-links:before { content:''; position:absolute; border-style:solid; border-width: 10px 15px 10px 0; border-color: transparent #59D0F8; left: -15px; }
.opmerking .spraakbox-rechts { position:relative; /*width:250px;*/ padding:5px; border-radius:5px; display:inline-block; margin-right:15px; }
.opmerking .spraakbox-rechts:before { content:''; position:absolute; border-style:solid; border-width: 10px 0 10px 15px; border-color: transparent #59D0F8; right: -15px; }
.opmerking .date { font-size:9px; }

.uitklapregel { height:50px; background-color:#eeeeee; border:1px solid #59D0F8; cursor:pointer; }
.uitklapregel h3 { display:inline; line-height:50px; margin-left:10px; color:#093281; }
.uitklapregel .uitklapbox { float:right; margin:5px; background-color:#59D0F8; height:40px; }
.uitklapregel .uitklapbox img { margin: 10px; }
.uitklapregel:hover > .uitklapbox img { transform: rotate(90deg); }
.uitklapcontent { border:1px solid #59D0F8; border-top-width:0px; padding:5px; }

/* ==== Bootstrap forms integratie ==== */
input.form-control,
textarea.form-control,
select.form-select {
    font-family: "Montserrat", sans-serif;
    font-size: 14px;          /* iets groter, beter leesbaar */
    border: 1px solid #ced4da;/* standaard Bootstrap rand */
    padding: .375rem .75rem;  /* standaard Bootstrap padding */
}
/* ==== Layout / header & footer modernisering ==== */

/* Laat de pagina normaal scrollen */
body {
    overflow: auto;
}

/* Wrapper hoeft niet meer absoluut + eigen scroll */
.wrapper {
    position: static;
    top: auto;
    bottom: auto;
    overflow-y: visible;
}

/* Header mag automatisch in hoogte meegroeien */
.header {
    height: auto;
    border-bottom: 2px solid #59D0F8;
}

/* Oude banner/menufloats niet meer nodig */
.banner,
.banner .menu .item,
.banner .menu .subitem {
    float: none;
}

/* Footer: geen vaste hoogte, iets meer padding */
.footer {
    position: fixed;          /* wil je ’m meescrollen, maak dit: position: static; */
    bottom: 0;
    width: 100%;
    height: auto;
    padding: 0 10px;
    background: #59D0F8;
    font-size: 12px;
    line-height: 30px;
}

/* Taalvlaggen en help-links in footer wat netter */
.footer img {
    vertical-align: middle;
}

/* Maak sorteertabellen wat meer Bootstrap-achtig */
table.sorteertabel {
    width: 100%;
    border-collapse: collapse;
}

table.sorteertabel td,
table.sorteertabel th {
    padding: .35rem .5rem;
    border-bottom: 1px solid #dee2e6;
}

table.sorteertabel tbody tr:nth-child(even) {
    background-color: #f8f9fa;
}

table.sorteertabel tbody tr.selecteerbaar:hover {
    background-color: #e9ecef;
    cursor: pointer;
}

.nav-tabs .nav-link {
    color: #093281;
    font-weight: 600;
}

.nav-tabs .nav-link.active {
    background-color: #093281;
    color: #ffffff;
    border-color: #093281 #093281 #ffffff;
}

.headercenterwrapper,
.footercenterwrapper {
    max-width: 1140px;
    margin: 0 auto;
    text-align: left;
    width: 100%;
}
