html {
    margin: 0;
    padding: 0;
    overflow-y: scroll;
}

body {
    background-color: #22736F;
    margin: 0;
    padding: 0;
    font-family: 'Verdana', sans-serif;
    font-size: 18px;
}

p, li { line-height: 180%; }
img { border: 0 }

.headertitel {
    width: 1160px;
    margin: 0 auto;
    padding: 16px 20px;
    color: white;
}

.hoofdtitel {
    margin: 0; padding: 0 0 0 10px;
    font-size: 1.5rem;
    font-weight: bold;
}

#loginheader {
    float: right;
    color: white;
}

#loginheader a {
    color: white;
    text-decoration: none;
}

#loginheader a:hover {
    color: #CDD83F;
    text-decoration: underline;
}

.contentwrapper {
    width: 100%;
    background-color: white;
}

.content {
    width: 1160px;
    margin: 0 auto;
    padding: 24px 20px;
    background-color: white;
}

h1 {
    color: #22736F;
    font-size: 2rem;
    margin: 0 0 1em 0;
}

h2 {
    color: #222;
    font-size: 1.5rem;
    margin: 1.5em 0 0.7em 0;
    padding: .8rem 1rem;
    background-color: #E5EA98;
    border-left: solid 4px #CDD83F;
}

h3 {
    color: #222;
    font-size: 1.5rem;
    margin: 1em 0 0.7em 0;
}

div.footer {
    width: 100%;
    padding: 16px 0;
    margin: 0;
    color: white;
}

div.footer p {
    width: 1160px;
    text-align: right;
    margin: 0 auto;
}

a { color: blue; text-decoration: none; }
a:hover { color: #22736F; text-decoration: underline; }

div.footer a { color: white; text-decoration: underline; }
div.footer a:hover { color: #9F9FFF; }

div.knoppen_midden { text-align: center; margin: 2rem 0; position: relative; }
div.knoppen_rechts { text-align: right; margin: 2rem 0; position: relative; }
div.knoppen_floatlinks { float: left; }
div.knoppen_floatrechts { float: right; }
div.knoppen_midden a, div.knoppen_rechts a, div.knoppen_floatlinks a, div.knoppen_floatrechts a {
    display: inline-block;
    font-weight: bold;
    background-color: #22736F;
    color: white;
    text-decoration: none;
    transition-duration: .1s;
    margin: 0 0 0 1em;
    padding: .5rem 1rem;
}

div.knoppen_midden a:hover, div.knoppen_rechts a:hover, div.knoppen_floatlinks a:hover, div.knoppen_floatrechts a:hover {
    background-color: #CDD83F;
    color: #22736F;
}

div.icons_rechts {
    float: right;
    padding: 0 0 .5rem 1rem;
}

table {
    border-spacing: 0;
    border-collapse: collapse;
    border: 0;
}

table.main {
    width: 100%;
    background-color: white;
    border-top: solid white 16px;
    border-bottom: solid white 16px;
}

td.linkerkolom {
    width: 180px;
    padding: 0 12px 0 0;
    border-right: solid 2px #22736F;
    text-align: left;
}

td.rechterkolom {
    padding: 0 0 0 20px;
    text-align: left;
}

ul.menu {
    list-style-type: none;
    margin: 0 0 200px 0;
    padding: 0;
}

ul.menu li {
    margin: 0;
    padding: 0;
}

ul.menu li a {
    padding: 8px 0 8px 8px;
    color: #22736F;
    display: block;
    font-weight: bold;
}

ul.menu li a:hover {
    background-color: #CDD83F;
    text-decoration: none;
}

table.gegtabel { width: 100%; clear: both; }
table.gegtabel td, table.gegtabel th { padding: 6px 8px; text-align: left; }
table.gegtabel tbody tr:nth-child(odd) { background-color: #EEEEEE; }
table.gegtabel tbody tr:nth-child(even) { background-color: white; }
table.gegtabel tbody tr { border-bottom: solid #DDDDDD 1px; }
table.gegtabel thead tr { border-bottom: solid #DDDDDD 2px; }

table.gegtabel thead tr .header {
	background-image: url('sort_both.gif');
	background-repeat: no-repeat;
	background-position: center left;
	cursor: pointer;
    padding-left: 20px;
}

table.gegtabel thead tr .headerSortUp {
	background-image: url('sort_asc.gif');
}

table.gegtabel thead tr .headerSortDown {
	background-image: url('sort_desc.gif');
}

table.bewerktabel, table.zoektabel {
    margin: 1em auto;
    width: 100%;
}

table.bewerktabel td, table.bewerktabel th {
    padding: 12px 12px;
    vertical-align: middle;
    text-align: left;
    font-weight: normal;
}

table.zoektabel td, table.zoektabel th {
    padding: 12px 8px;
    vertical-align: middle;
}

input[type=text], input[type=password], input[type=number], input[type=email], textarea {
    padding: 5px 8px;
}

input[type=text], input[type=password], input[type=number], input[type=email], textarea, select {
    width: 600px;
    font-family: monospace;
    font-size: 18px;
}

input[type=text].ui-spinner-input {
    width: 60px !important;
    outline: none;
}

table.bewerktabel tr:first-child { border-top: solid #DDDDDD 1px; }
table.bewerktabel tr { border-bottom: solid #DDDDDD 1px; }

ul.errorlist {
    color: red;
    margin: 0;
}

p.highlight {
	background: #faa91a url('info-icon.png') 24px center no-repeat;
	color: black;
    padding: 16px 8px 16px 72px;
    margin: 0 0 24px 0;
}