@font-face {
    font-family: 'open_sansregular';
    src: url('fonts/opensans-regular-webfont.eot');
    src: url('fonts/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/opensans-regular-webfont.woff2') format('woff2'), url('fonts/opensans-regular-webfont.woff') format('woff'), url('fonts/opensans-regular-webfont.ttf') format('truetype'), url('fonts/opensans-regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'open_sansbold';
    src: url('fonts/opensans-bold-webfont.eot');
    src: url('fonts/opensans-bold-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/opensans-bold-webfont.woff2') format('woff2'), url('fonts/opensans-bold-webfont.woff') format('woff'), url('fonts/opensans-bold-webfont.ttf') format('truetype'), url('fonts/opensans-bold-webfont.svg#open_sansbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
body {
    font-family: 'open_sansregular';
    font-size: 13px;
    color: #008CC8;
}
h1, h2, .ItemTitel {font-family: 'open_sansbold';}
h1 {font-size: 24px;}
h2, .ItemTitel {font-size: 16px;}
ul, ol {padding-left: 15px;}

    ul li {
        list-style: disc;
    }

    ol li {
        list-style: decimal;
    }

table td {
    display: table-cell;
    vertical-align: top;
}

input[type=text],
input[type=password] {
    background-color: #cce8f4;
    height: 21px;
    padding: 0 0;
}

.form-control {
    background-color: #cce8f4;
    border: 0;
    color: #008cc8;
    text-transform: lowercase;
    text-align: right;
    height: 21px;
    padding: 0 10px;
    border-radius: 10px;
}

.form-control:-ms-input-placeholder,
.form-control::-moz-placeholder {
	color: rgb(0, 140, 200);
}


#content .headline {
    font-family: 'open_sansregular';
}

#content .item_head {
    text-align: right;
}

    #content .item_head ul {
        padding-left: 0;
        text-align: right;
        float: right;
    }

        #content .item_head ul li {
            list-style: none;
            float: left;
            margin-left: 3px;
        }

        #content .item_head ul .item_head_print span {
            background-image: url(../gfx/imageMap.png);
            background-position: -258px -7px;
            width: 22px;
            height: 22px;
        }

        #content .item_head ul .item_head_email span {
            background-image: url(../gfx/imageMap.png);
            background-position: -186px -7px;
            width: 22px;
            height: 22px;
        }

#content .path {
    margin-bottom: 15px;
}

    #content .path a {
        margin-right: 0px;
        padding-right: 0px;
    }

    #content .path .pathSeparator {
        background-image: url(../gfx/imageMap.png);
        width: 9px;
        height: 12px;
        background-position: -305px -13px;
        display: inline-block;
        margin-left: 5px;
        margin-right: 5px;
    }


div.lijst .item {
    margin-bottom: 15px;
}

div.lijst .url > a {
	font-family: 'open_sansbold';
	font-size: 14px;
}

div.lijst .item .url > a {
	display: block;
	margin-bottom: 3px;
}

div.lijst .item .sourcepub {margin-top: 3px;}
div.lijst .item .sourcepub .source {color: #008a35;}
.lijst .source {font-style: italic;}
.lijst .sourcepub .pubdate {font-style: italic;}

div.agendalijst .eventdate,
div.lijst td.pubdate {
    padding-right: 10px;
	white-space: nowrap;
}

div.lijst tr.head_even td,
div.lijst tr.head_odd td {
    padding-bottom: 5px;
}

.float {
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    display: inline-block;
    transform: translateZ(0px);
    transition-duration: 0.3s;
    transition-property: transform;
}

    .float:hover, .float:focus, .float:active {
        transform: translateY(-5px);
    }

a {
    color: #008A35;
    font-size: 13px;
    cursor: pointer;
}

    a:focus,
    a:hover {
        color: #008A35;
        text-decoration: underline;
    }

.nopadding {
    padding: 0px;
}

#servicemenu {
    font-family: 'open_sansbold';
    height: 37px;
    padding-top: 8px;
    text-align: right;
}

    #servicemenu > div {
        float: right;
    }

        #servicemenu > div.searchbox {
            width: 120px;
            margin-left: 10px;
        }

    #servicemenu a {
        color: #008cc8;
        font-size: 14px;
    }

    #servicemenu ul li {
        display: inline;
        margin-left: 10px;
    }

    #servicemenu input {
        width: 120px;
        font-size: 11px;
    }

    #servicemenu li.searchbox {
        width: 120px;
        float: right;
    }

header {
    min-height: 186px;
    background-color: #B4E0F5;
    position: relative;
    text-align: center;
	overflow:hidden;
}

header .slider {
	height: 33px;
	bottom: 0;
	left:0px;
	background-image: url(../gfx/imageMap.png);
	background-repeat: repeat-x;
	background-position: 0 -394px;
	position: absolute;
	width: 100%;
}

        header .slider .sliderIcon {
            width: 24px;
            height: 24px;
            margin-left: 50%;
            margin-right: 50%;
            background-image: url(../gfx/imageMap.png);
            background-repeat: no-repeat;
            background-position: -42px -6px;
            margin-top: -13px;
            cursor: pointer;
        }

.logo a {
    position: absolute;
    margin-top: 5px;
    background-image: url(../gfx/imageMap.png);
    background-repeat: no-repeat;
    background-position: -15px -207px;
	z-index: 100;
    display: block;
}

.logo .container a {
    margin-left: 0;
    position: absolute;
}

.logo span > img {
    width: 143px;
    height: 141px;
}

#kaart {height: 186px;overflow: hidden;}
#kaart .kaartImage {min-height: 186px;margin-top: -421px;}

    #kaart.closing .close,
    #kaart .close {
        -webkit-transition: margin-top 1s; /* For Safari 3.1 to 6.0 */
        transition: margin-top 1s;
        margin-top: -20px;
    }

    #kaart.opening .close,
    #kaart.open .close {
        display: block;
        margin-top: 0;
    }

#topmenu {
    margin-bottom: 20px;
}

    #topmenu a {
        font-size: 14px;
        color: #fff;
    }

    #topmenu div > ul {
        margin-top: -14px;
        padding-left: 0;
    }

    #topmenu li {
        background-color: #008CC8;
        padding: 8px 12px;
        margin-right: 3px;
        display: block;
        float: left;
        max-height: 36px;
        text-align: center;
        position: relative;
    }

        #topmenu li:hover {background-color: #0B71B7;}
        #topmenu li:hover a {text-decoration: none;}
        #topmenu li.menuselect {background-color: #0b71b7;}
        #topmenu li.menuselect .overlayimage {
                display: block;
                background-image: url(../gfx/imageMap.png);
                background-repeat: no-repeat;
                background-position: -127px -11px;
                height: 11px;
                left: 0;
                margin-left: auto;
                margin-right: auto;
                position: absolute;
                right: 0;
                top: 36px;
                width: 22px;
            }

		#hotspots li a {text-transform: lowercase;}
          



#homecontent .ball {
    border-radius: 50%;
    cursor: default;
    height: 100%;
    position: relative;
    -moz-transition: all 0.4s ease-in-out 0s;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -o-transition: all 0.4s ease-in-out 0s;
    transition: all 0.4s ease-in-out 0s;
    display: inline-block;
    height: 239px;
    margin: 0;
    width: 239px;
    background-image: url("../gfx/imageMap.png");
    text-align: center;
    margin-bottom: 30px;
}

    #homecontent .ball h2 {
        font-family: 'open_sansbold';
        font-size: 24px;
    }

    #homecontent .ball > h2 {
        top: 50%;
        position: absolute;
        margin-top: -13px;
        color: #ffffff;
        text-align: center;
        width: 239px;
    }

    #homecontent .ball.ball-oogst {
        background-position: -5px -455px;
    }

    #homecontent .ball.ball-specialissues {
        background-position: -285px -460px;
    }

    #homecontent .ball.ball-governance {
	background-position: -550px -456px;
	}
	
    #homecontent .ball.ball-superdijken {
	background-position: -5px -740px;
    }

    #homecontent .ball.ball-waterbuffer {
	background-position: -285px -740px;
	}
    #homecontent .ball.ball-groenindestad {
        background-position: -550px -740px;
    }

    #homecontent .ball .ball-info {
        background: none repeat scroll 0 0 #fff;
        border: 1px solid #59B4DB;
        border-radius: 50%;
        height: inherit;
        opacity: 0;
        position: absolute;
        transform: scale(0);
        transition: all 0.4s ease-in-out 0s;
        width: inherit;
        padding-top: 40px;
        display: block;
        text-align: center;
    }

    #homecontent .ball:before {
        content: "";
        display: table;
    }

    #homecontent .ball:hover {
        box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1) inset, 0 1px 2px rgba(0, 0, 0, 0.1);
    }

        #homecontent .ball:hover .ball-info {
            opacity: 1;
            display: block;
            transform: scale(1);
        }

            #homecontent .ball:hover .ball-info p {
                _opacity: 1;
            }

#content,
#GeneriekItem {
    overflow: hidden;
}

#topmenu .navbar-header {
    margin-top: 0px;
}

#topmenu .collapsing,
#topmenu .navbar-default {
    border: 0;
    box-shadow: none;
    background: none;
    border-radius: 0;
}

#topmenu .navbar {
    margin-bottom: 0;
    border: none;
}

    #topmenu .navbar li {
        width: 100%;
        border-top: 1px solid #fff;
    }

        #topmenu .navbar li:hover {
            background-color: #0b71b7;
        }

    #topmenu .navbar div > ul {
        margin-top: 0;
    }



#topmenu .navbar-collapse {
    padding: 0;
}

#sidemenu ul li {
    list-style: none;
    margin-bottom: 5px;
    border-top: 1px solid #B0EBFF;
    padding-top: 5px;
}

    #sidemenu ul li a {
        font-family: 'open_sansbold';
        font-size: 14px;
        color: #008CC8;
    }

        #sidemenu ul li a:hover {
            text-decoration: none;
        }

    #sidemenu ul li li a {
        font-family: 'open_sansregular';
    }

    #sidemenu ul li ul {
        display: none;
    }

    #sidemenu ul li.menuactive > a,
    #sidemenu ul li.menuselect > a {
        color: #008A35;
    }

    #sidemenu ul li.menuactive ul,
    #sidemenu ul li.menuselect ul {
        display: block;
    }

        #sidemenu ul li.menuactive ul li,
        #sidemenu ul li.menuselect ul li {
            padding-left: 15px;
        }

#sidemenu a:hover {
    color: #0B71B7;
}

.lijst li {
    clear: both;
}

    .lijst li a {
        color: #BF0418;
    }

        .lijst li a:hover {
            color: #A00017;
        }

.lijst .icon {
    width: 47px;
    height: 64px;
    margin-right: 10px;
    float: left;
    margin-bottom: 20px;
    background-image: url(../gfx/imageMap.png);
    background-position: -41px -113px;
    padding-bottom: 10px;
}

footer {
    background-color: #b0ebff;
    height: 75px;
    margin-top: 50px;
    position: relative;
    width: 100%;
    bottom: 0;
}

    footer .icons {
        margin-top: -20px;
        right: 0;
        position: absolute;
    }

    footer .icon {
        width: 45px;
        height: 45px;
        background-image: url(../gfx/imageMap.png);
        background-position: -44px -51px;
        display: block;
        float: left;
        margin-left: 11px;
    }

        footer .icon.iconYoutube {
            background-position: -101px -51px;
        }

        footer .icon.iconLinkedin {
            background-position: -157px -51px;
        }

.col-md-3 {
    float: left;
}

.footer {
    width: 100%;
    display: block;
    clear: both;
}



#homecontent > div {
    float: left;
}

    #homecontent .ball .ball-info {
        display: none\8;
        width: 100%;
    }
#hotspotsmobile,
#hotspotsmobile ul,
#hotspotsmobile li{
    margin: 0;
    padding: 0;
    padding-left: 0;
    list-style: none;
}
#hotspotsmobile {
    border-top: 1px solid #45AAD7;
}
#hotspotsmobile a{
     font-family: 'open_sansregular';
    font-size: 14px;
display:block;
min-height:33px;
width:100%;
padding:4px 12px;
font-size: 14px;
    text-align: center;
}
#hotspotsmobile > li a:hover{
background:#0b71b7;
color:#fff;
}
#hotspotsmobile > li > a{
background:#008CC8;
 border-bottom: 1px solid #fff;
color:#fff;
}
#hotspotsmobile > li > ul > li a{
background:#fff;
color:#008CC8;
line-height: 30px;
}
#hotspotsmobile > li > ul > li > a{
background:#fff;
border-bottom:1px solid #B0EBFF;
line-height: 22px;
}

.hotspotsmobileCollapse a {
font-family: 'open_sansbold';
font-size: 14px;
color: #008CC8;
border-top: 1px solid #008cc8;
border-bottom: 1px solid #008cc8;
width: 100%;
border-radius: 0;
display: block;
margin: 0;
text-align: center;
line-height: 30px;
}

.cmsmode #topmenu .hidden-lg {
    display: none;
}

.cmsmode #sidemenu {
    display: block !important;
}

.cmsmode #servicemenu div.searchbox,
.cmsmode #servicemenu div.text-right {
    float: right;
    display: inline;
}
.kaartImage,
.kaartImage img{position:relative;}
.kaartImage a{display:none;}
.kaartImage a{background-image:url(/gfx/hotspot.png);position:absolute;display:block;}
.tooltip-1.tooltip,
.tooltip-2.tooltip,
.tooltip-3.tooltip{margin-left:0}
.tooltip-1 .tooltip-inner{ color:#008cc8;background-color:#fff;opacity:0.8;}
.tooltip-2 .tooltip-inner{ color:#008a35;background-color:#fff;opacity:0.8;}
.tooltip-3 .tooltip-inner{ color:#ee7b60;background-color:#fff;opacity:0.8;}

@media (min-width: 1200px) {
.kaartImage button.close{left: 1100px;position: absolute;top: 1px;width: 12px;}
.kaartImage{width:1140px;}
.kaartImage img{width:1140px;}
a.hotspot{width:19px;height:26px;background-position:0 0;}
a:hover.hotspot{background-position:-20px 0;}
a.project{width:21px;height:21px;background-position:-100px -2px}
a:hover.project{background-position:-124px -1px}
a.oras{width:21px;height:20px;background-position:-50px -2px;}
a:hover.oras{background-position:-73px -2px;}
a.video{width:24px;height:19px;background-position:0px -38px;}
a:hover.video{width:24px;height:19px;background-position:-31px -38px;}
a.tool{width:29px;height:22px;background-position:-75px -35px;}
a:hover.tool{background-position:-109px -36px;}

#proj01{top:662px;left:291px;}
#proj02{top:710px;left:432px;}
#proj03{top:672px;left:398px;}
#proj04{top:905px;left:261px;}
#proj05{top:785px;left:618px;}
#proj06{top:360px;left:493px;}
#proj07{top:542px;left:453px;}
#proj08{top:612px;left:407px;}
#proj09{top:640px;left:316px;}
#proj10{top:715px;left:414px;}
#proj11{top:692px;left:588px;}
#proj12{top:687px;left:383px;}
#proj13{top:699px;left:740px;}
#proj14{top:683px;left:440px;}
#proj15{top:834px;left:752px;}
#proj16{top:386px;left:732px;}
#proj17{top:230px;left:665px;}
#proj18{top:137px;left:834px;}
#proj19{top:525px;left:442px;}
#proj20{top:617px;left:350px;}
#proj21{top:671px;left:369px;}
#proj22a{top:667px;left:646px;}
#proj22b{top:691px;left:555px;}
#proj22c{top:715px;left:616px;}
#proj23{top:819px;left:185px;}
#proj24a{top:263px;left:669px;}
#proj24b{top:568px;left:574px;}
#proj24c{top:489px;left:493px;}
#proj25a{top:510px;left:862px;}
#proj25b{top:771px;left:599px;}
#proj26{top:190px;left:552px;}
#proj27{top:277px;left:654px;}
#proj28{top:798px;left:598px;}
#proj29{top:696px;left:361px;}
#proj30{top:629px;left:334px;}
#proj31{top:827px;left:201px;}
#proj32{top:204px;left:537px;}
#proj33a{top:550px;left:427px;}
#proj33{top:641px;left:365px;}
#proj34{top:515px;left:476px;}
#proj35{top:656px;left:692px;}
#proj36{top:714px;left:679px;}
#proj37{top:801px;left:186px;}
#proj38{top:600px;left:571px;}
#proj39{top:612px;left:525px;}
#proj40{top:996px;left:684px;}
#proj41{top:602px;left:686px;}
#proj42{top:452px;left:480px;}

}

@media (min-width: 992px) and (max-width: 1199px) {
	.kaartImage button.close{left: 920px;position: absolute;top: 1px;width: 12px;}
	.kaartImage img{width:940px;}
	a.hotspot{width:17px;height:26px;background-position:-4px -67px;}
	a:hover.hotspot{background-position:-21px -67px;}
	a.project{width:20px;height:20px;background-position:-94px -68px}
	a:hover.project{background-position:-114px -68px}
	a.oras{width:20px;height:20px;background-position:-52px -68px;}
	a:hover.oras{background-position:-72px -68px;}
	a.video{width:24px;height:22px;background-position:0px -97px;}
	a:hover.video{background-position:-30px -97px;}
	a.tool{width:29px;height:28px;background-position:-64px -95px;}
	a:hover.tool{background-position:-92px -95px;}
#proj01{top:546px;left:240px;}
#proj02{top:585px;left:356px;}
#proj03{top:554px;left:328px;}
#proj04{top:746px;left:215px;}
#proj05{top:647px;left:510px;}
#proj06{top:297px;left:407px;}
#proj07{top:447px;left:374px;}
#proj08{top:505px;left:336px;}
#proj09{top:528px;left:261px;}
#proj10{top:590px;left:341px;}
#proj11{top:571px;left:485px;}
#proj12{top:566px;left:316px;}
#proj13{top:576px;left:610px;}
#proj14{top:563px;left:363px;}
#proj15{top:688px;left:620px;}
#proj16{top:318px;left:604px;}
#proj17{top:190px;left:548px;}
#proj18{top:113px;left:688px;}
#proj19{top:433px;left:364px;}
#proj20{top:509px;left:289px;}
#proj21{top:553px;left:304px;}
#proj22a{top:550px;left:533px;}
#proj22b{top:570px;left:458px;}
#proj22c{top:590px;left:508px;}
#proj23{top:675px;left:153px;}
#proj24a{top:217px;left:552px;}
#proj24b{top:468px;left:473px;}
#proj24c{top:403px;left:407px;}
#proj25a{top:421px;left:711px;}
#proj25b{top:636px;left:494px;}
#proj26{top:157px;left:455px;}
#proj27{top:228px;left:539px;}
#proj28{top:658px;left:493px;}
#proj29{top:574px;left:298px;}
#proj30{top:519px;left:275px;}
#proj31{top:682px;left:166px;}
#proj32{top:168px;left:443px;}
#proj33a{top:454px;left:352px;}
#proj33{top:529px;left:301px;}
#proj34{top:425px;left:392px;}
#proj35{top:541px;left:571px;}
#proj36{top:589px;left:560px;}
#proj37{top:660px;left:153px;}
#proj38{top:495px;left:471px;}
#proj39{top:505px;left:433px;}
#proj40{top:821px;left:564px;}
#proj41{top:496px;left:566px;}
#proj42{top:373px;left:396px;}

}
@media (min-width: 768px) and (max-width: 991px) {
	.kaartImage button.close{left: 700px;position: absolute;top: 1px;width: 12px;}
	.kaartImage img{width:720px;}
	a.hotspot{width:12px;height:18px;background-position:0px -122px;}
	a:hover.hotspot{background-position:-13px -122px;}
	a.project{width:14px;height:19px;background-position:-100px -123px}
	a:hover.project{background-position:-115px -123px}
	a.oras{width:18px;height:18px;background-position:-52px -123px;}
	a:hover.oras{background-position:-73px -123px;}
	a.video{width:19px;height:14px;background-position:0px -146px;}
	a:hover.video{background-position:-19px -146px;}
	a.tool{width:20px;height:18px;background-position:-72px -144px;}
	a:hover.tool{background-position:-93px -144px;}
#proj01{top:418px;left:184px;}
#proj02{top:448px;left:273px;}
#proj03{top:424px;left:251px;}
#proj04{top:572px;left:165px;}
#proj05{top:496px;left:390px;}
#proj06{top:227px;left:311px;}
#proj07{top:342px;left:286px;}
#proj08{top:387px;left:257px;}
#proj09{top:404px;left:200px;}
#proj10{top:452px;left:261px;}
#proj11{top:437px;left:371px;}
#proj12{top:434px;left:242px;}
#proj13{top:441px;left:467px;}
#proj14{top:431px;left:278px;}
#proj15{top:527px;left:475px;}
#proj16{top:244px;left:462px;}
#proj17{top:145px;left:420px;}
#proj18{top:87px;left:527px;}
#proj19{top:332px;left:279px;}
#proj20{top:390px;left:221px;}
#proj21{top:424px;left:233px;}
#proj22a{top:421px;left:408px;}
#proj22b{top:436px;left:351px;}
#proj22c{top:452px;left:389px;}
#proj23{top:517px;left:117px;}
#proj24a{top:166px;left:423px;}
#proj24b{top:359px;left:363px;}
#proj24c{top:309px;left:311px;}
#proj25a{top:322px;left:544px;}
#proj25b{top:487px;left:378px;}
#proj26{top:120px;left:349px;}
#proj27{top:175px;left:413px;}
#proj28{top:504px;left:378px;}
#proj29{top:440px;left:228px;}
#proj30{top:397px;left:211px;}
#proj31{top:522px;left:127px;}
#proj32{top:129px;left:339px;}
#proj33a{top:347px;left:270px;}
#proj33{top:405px;left:231px;}
#proj34{top:325px;left:301px;}
#proj35{top:414px;left:437px;}
#proj36{top:451px;left:429px;}
#proj37{top:506px;left:117px;}
#proj38{top:379px;left:361px;}
#proj39{top:387px;left:332px;}
#proj40{top:629px;left:432px;}
#proj41{top:380px;left:433px;}
#proj42{top:285px;left:303px;}


    #topmenu li {padding: 8px 5px;}
    #topemenu li:last-child{ margin-right: 0;}
}
@media (max-width: 767px) {
	.logo .container a {left: 38%;}
}

td.url {padding-bottom:8px!important;}
span.paging a, span.paging .selectedpage, span.next {padding-left:10px;}
.SearchScreenDiv .header {display:none;}
.SearchScreenSearchAdvanced {margin-top:30px;}
input#SearchScreenSearchAdvancedTextBox {border:1px solid rgb(204, 232, 244);}
input#SearchScreenSearchAdvancedButton {border:0px;}
div.searchScreenParamatersFormSearchAdvancedRadioListDiv {margin-top:10px;}