/* declarations for rijkshuisstijl */
body {
	max-width: 1200px;
	font-family: "RO Sans", Calibri, Verdana, sans-serif;
	font-size: 1rem;
	display: inline-block;
}
@font-face {font-family: "RO Sans"; src: url('RO-SansWebText-Regular.eot'); src: url('RO-SansWebText-Regular.eot?#iefix') format('eot'), url('RO-SansWebText-Regular.ttf') format('truetype'), url('RO-SansWebText-Regular.woff') format('woff'); font-weight: normal; font-style: normal;}
@font-face {font-family: "RO Sans"; src: url('RO-SansWebText-Bold.eot');    src: url('RO-SansWebText-Bold.eot?#iefix') format('eot'), url('RO-SansWebText-Bold.ttf') format('truetype'), url('RO-SansWebText-Bold.woff') format('woff'); font-weight: bold; font-style: normal;}
@font-face {font-family: "RO Sans"; src: url('RO-SansWebText-Italic.eot');  src: url('RO-SansWebText-Italic.eot?#iefix') format('eot'), url('RO-SansWebText-Italic.ttf') format('truetype'), url('RO-SansWebText-Italic.woff') format('woff'); font-weight: normal; font-style: italic;}
html, body, div, input, img, button, dl, dt, dd {margin: 0; padding: 0; border: none;}
h2 {font-size: 21px; margin-top: 0; color: #01689b; font-weight: 500;}

/* When not in rivm Iframe */
.logo {max-width: 1185px; margin-bottom: 20px; text-align: center;}
.logo-zonkracht {text-align: left; position: absolute; top: 32px; font-size: 30px; color: black; font-weight: bold; padding-top: 6px;}
@media all and (max-width: 900px) {
	.logo {max-width: 600px;}
    .logo-zonkracht {position: relative; top: initial; margin-top: 8px;}
} 

/* Search address */
.locatiezoeker-adres {display: inline-block; vertical-align: sub; width: 55px;}
.locatiezoeker-zoekbalk {box-shadow: 0 0 1px 1px rgba(204, 204, 204, 0.5); border-radius: 3px; display: inline-block; border: solid 1px #c1c1c1; max-height: 30px; width: calc(50% - 200px); margin-bottom: 8px;}
.locatiezoeker-locatie {padding: 0 0 0 6px; font-family: "RO Sans", Calibri, Verdana, sans-serif; font-size: 16px;background: none; border: none; vertical-align: top; height: 30px; width: calc(100% - 68px);}
.locatiezoeker-zoekbalk input[type=button] {width: 30px; height: 30px; font-size: 0; padding: 0; margin: 0 ; border: none; border-left: solid 1px #c1c1c1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; background-color: white; background-repeat: no-repeat;}
.locatiezoeker-start {background-image: url(zonkracht-zoek.png);}
.locatiezoeker-geolocatie {background-image: url(zonkracht-position2.png);}
.autocomplete-suggestions {background-color: white; border: solid 1px #c1c1c1; box-shadow: 0 0 1px 1px rgba(204, 204, 204, 0.5); border-radius: 3px; width: initial !important; margin-right: 10px;}
.autocomplete-suggestion {padding: 5px 6px; font-family: Verdana; font-size: 14px;}
.autocomplete-suggestion:hover {background-color: #dddddd; cursor: pointer;}

/* Error message */
.error-message {margin: 15px 0; color: red;}

/* Map */
.map {}

.ol-attribution {display: none !important;}
.ol-control button {
	border-radius: 3px !important;
	color: #5b5b5b !important;
	box-shadow: 0 0 1px 1px rgba(204, 204, 204, 0.5) !important;
	background-color: white !important;
    font-weight: normal !important;
    margin: 0 !important;
	cursor: pointer;
}

/* Responsiveness blocks */
.zonkracht-blocks {
	display: flex;
	flex-flow: wrap;
	margin: -20px;
}

.zonkracht-block {
	flex: 0 0 calc(50% - 80px);
    background-color: #f4f4f4;
    margin: 20px;
	padding: 20px;
}
.zonkracht-block p:first-child{
    margin-top: 0;
}
.zonkracht-block-map {
	flex: 0 0 calc(50% - 40px);
	padding: 0 !important;
}

.map-title {
	position: absolute;
	z-index: 1;
    margin: 20px 0 0 60px;
    font-weight: bold;
}

@media (max-width: 900px) {
	.zonkracht-blocks {
		margin: 0;
	}
	.zonkracht-block {
		flex: 0 0 calc(100% - 40px);
		margin: 20px 0;
	}
	.zonkracht-block-map {
		flex: 0 0 100%;
	}
	.locatiezoeker-zoekbalk {width: calc(100% - 70px);}
	.locatiezoeker-locatie {width: calc(100% - 68px);}
}

/* table */
table {border-collapse: collapse;}
/*thead {background-color: #f9e11e;}*/
td, th {text-align: left; padding-top: 8px; padding-left: 40px; margin: 0; border: none;}
td:first-child, th:first-child {padding-left: 0;}

dl {
	margin-bottom: 12px;
}
dl dt, dl dd {
	display: inline-block;
}
dl dt {
	width: 100px;
}
dl dd:nth-child(2) {
	width: 100px;
	vertical-align: top;
}
dl dd:nth-child(3) {
	width: calc(100% - 220px);
	vertical-align: top;
}

/* Zonkracht */
.zonkracht {
	display: inline-block;
	width: 20px;
	height: 16px;
	border: solid 1px black;
	margin-right: 12px;
    vertical-align: top;
}
.zonkracht-1 {background-color: #00FF00;}
.zonkracht-2 {background-color: #FFFF00;}
.zonkracht-3 {background-color: #FFA500;}
.zonkracht-4 {background-color: #FF0000;}

.date-error {background: red; padding: 6px 12px 4px 12px; border-radius: 4px; color: white; display: none;}
.date-error-1 .date-error {z-index: 1; position: absolute; margin-left: 60px; margin-top: 36px;}
.date-error-2 {position: absolute; margin-top: -16px;}

.opacity-control {bottom: .5em; left: .5em;}
.slidecontainer span {vertical-align: bottom; padding: 0 0 2px 12px; display: inline-block;}
.slidecontainer input {margin: 4px 12px 2px 20px; vertical-align: middle;}