@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@400;500;700&display=swap');
@import url("https://use.typekit.net/xvh8jfw.css");

/*
Filson Pro Bold
font-family: filson-pro, sans-serif;
font-weight: 700;
font-style: normal;

Filson Pro Bold Italic
font-family: filson-pro, sans-serif;
font-weight: 700;
font-style: italic;

Filson Pro Book
font-family: filson-pro, sans-serif;
font-weight: 300;
font-style: normal;

Filson Pro Book Italic
font-family: filson-pro, sans-serif;
font-weight: 300;
font-style: italic;

Filson Pro Regular
font-family: filson-pro, sans-serif;
font-weight: 400;
font-style: normal;

Filson Pro Regular Italic
font-family: filson-pro, sans-serif;
font-weight: 400;
font-style: italic;
*/

.st0{fill:#C4DCB7;stroke: #fff; stroke-width: 5px; transition: 0.1s; }
	.st1{fill:#4A7C62;stroke: #fff; stroke-width: 5px; transition: 0.1s; }
	.st2{fill:#61B089;stroke: #fff; stroke-width: 5px; transition: 0.1s; }
	.st3{fill:#84C6A5;stroke: #fff; stroke-width: 5px; transition: 0.1s; }
	.st4{fill:#D18785;stroke: #fff; stroke-width: 5px; transition: 0.1s; }
	.st5{fill:#F1F7EE; transition: 0.1s; }
	.st6{fill:#233D5A; transition: 0.1s; }
	.st7{fill:#82CAC9; transition: 0.1s; }

	.Plaatsnamen a:hover .st6 { fill: #4A7C62; }
	.Plaatsnamen a:hover .st7 { fill: #C4DCB7; }

  	.st0:hover, .st1:hover, .st2:hover, .st3:hover, .st4:hover { cursor: pointer; fill: #a6cc92; }
  /*.gemeente-hidden {pointer-events:none;}*/
  /*.gemeente-visible {pointer-events:none;}*/
  .gemeente-visible .st6 { fill: #4A7C62 }
  .gemeente-visible .st7 { fill: #C4DCB7 }
  .Limburg .gemeente-visible { fill: #a6cc92; }

body{ font-family: 'Roboto Slab', serif; font-size: 18px; font-weight: 400; color: #173955; line-height: 32px; background: #EDF9F7; }
h1{ font-family: filson-pro, sans-serif; font-size: 50px; font-weight: 700; line-height: 64px; }
h2{ font-family: filson-pro, sans-serif; font-size: 32px; font-weight: 400; color: #007B9B; margin: 30px 0 20px 0; }
h3{ font-family: filson-pro, sans-serif; font-size: 22px; font-weight: 400; line-height: 32px; color: #007B9B; margin: 5px 0; }
h4{}
a{ color: #70D3CB; }
a:hover{ color: #173955; }

.btn{ background-color: transparent; border: none; border-radius: 0; width: 225px; height: 40px; text-align: right; padding: 10px 30px 0 0; margin-top: 15px; text-decoration: none !important; }
.btn.btn-primary{ background: url(/media/2020-12/button-medium.svg); }
.btn.btn-primary:hover{ background: url(/media/2020-12/button-dark.svg); }
.btn.btn-secondary{ background: url(/media/2020-12/button-dark.svg); }
.btn.btn-secondary:hover{ background: url(/media/2020-12/button-medium.svg); }
.btn.btn-success{}
.btn.btn-success:hover{}
.btn.btn-warning{}
.btn.btn-warning:hover{}
.btn.btn-info{ background: url(/media/2020-12/button-light.svg); }
.btn.btn-info:hover{ background: url(/media/2020-12/button-medium.svg); }
.btn.btn-default{ background: url(/media/2020-12/button-medium.svg); color: #ffffff; }
.btn.btn-default:hover{ background: url(/media/2020-12/button-dark.svg); color: #ffffff; }

/* ============================================
		TOP
=============================================*/
.container-fluid.top{ position: fixed; top: 0; z-index: 999999; padding-top: 5px; }
.container-fluid.top .block.content.topmenu ul{ padding-left: 0; }
.container-fluid.top .block.content.topmenu ul li{ list-style: none; display: inline; }
.container-fluid.top .block.content.topmenu ul li:after{ content: " | "; color: #70D3CB; margin: 0 5px; }
.container-fluid.top .block.content.topmenu ul li:last-child:after{ content: ""; }
.container-fluid.top .block.content.topmenu ul li a{ font-family: filson-pro, sans-serif; font-size: 14px; font-weight: 300; color: #173955; }

.container-fluid.top .search_balk{ text-align: right; }
.container-fluid.top .search_balk input{ border: 1px solid #B7E8E3; border-radius: 5px; padding: 1px 10px; font-family: filson-pro, sans-serif; font-size: 14px; color: #70D3CB; }

.container-fluid.top.sticky{ background: #ffffff; }

/* ============================================
		NAVIGATIE
=============================================*/
.container-fluid.navigatie{ position: fixed; top: 55px; z-index: 999999; }
.container-fluid.navigatie .navbar{ padding: 8px 0; }
.container-fluid.navigatie .navbar-brand{ margin-top: -50px; padding: 0; max-width: 255px; transition: all 0.5s ease-in-out; }
.container-fluid.navigatie .navbar-brand img{ width: 100%; transition: all 0.5s ease-in-out; }
.container-fluid.navigatie .navbar-nav{}
.container-fluid.navigatie .navbar-nav .nav-item{}
.container-fluid.navigatie .navbar-nav .nav-item .nav-link{ font-family: filson-pro, sans-serif; font-size: 20px; font-weight: 400; color: #173955; padding: 8px 20px; position: relative; }

.container-fluid.navigatie .navbar-nav .nav-item:hover .nav-link:after{ content: ""; display: block; background: url(/media/2020-12/onderlijn.png); width: 78px; height: 7px; position: absolute; left: calc(50% - 39px); }
.container-fluid.navigatie .navbar-nav .active.nav-item .nav-link{ color: #007B9B; }
.container-fluid.navigatie .navbar-nav .active.nav-item .nav-link:after{ content: ""; display: block; background: url(/media/2020-12/onderlijn.png); width: 78px; height: 7px; position: absolute; left: calc(50% - 39px); }

.container-fluid.navigatie.sticky{ background: #ffffff; }
.container-fluid.navigatie.sticky .navbar-brand{ max-width: 200px; }

/* ============================================
		SLIDER
=============================================*/
.container-fluid.slider{ background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #B7E8E3 50%, rgba(255,255,255,0) 50%);
    background: -webkit-linear-gradient(top, #ffffff 0%,#B7E8E3 50%, rgba(255,255,255,0) 50%);
    background: linear-gradient(to bottom, #ffffff 0%, #B7E8E3 50%, rgba(255,255,255,0) 50%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f4f4f4',GradientType=1 ); color: #ffffff; }
.container-fluid.slider .col-md-12{ padding: 0; }
.container-fluid.slider img{ width: 100%; margin-top: 50px; }

/* ============================================
		CONTENT
=============================================*/
.container-fluid.content{ margin-top: -400px; }
.container-fluid.content .block.content.center{ text-align: center; }
.container-fluid.content img{ width: 100%; max-width: 100%; }

.block.html.blueblock{ background: #173955; padding: 40px 50px 40px 50px; color: #ffffff; position: relative; margin: 0 0 50px 0; }
.block.html.blueblock h1{ margin: 0; }
.block.html.blueblock h2{ color: #B7E8E3; margin-top: 15px; margin-bottom: 0; }
.block.html.blueblock p{ margin-bottom: 0; }
.block.html.blueblock .btn{ position: absolute; right: 0; bottom: -60px; width: 260px; background-size: 100%; padding: 10px 25px 0 0; }

.block.list.input{ padding: 25px 0; }
.block.list.input .item{ background: #B7E8E3; padding: 20px; }
.block.list.input .item h5{ color: #103955; margin: 0; }

.block.list.news{ margin: 30px -15px 100px -15px; }
.block.list.news .item{ background: rgba(255,255,255,0); height: 100%; position: relative; padding-bottom: 30px; transition: all 0.2s ease-in-out; }
.block.list.news .item .image{}
.block.list.news .item .image img{}
.block.list.news .item .content{ padding: 10px 15px; }
.block.list.news .item .content .date{ font-family: filson-pro, sans-serif; font-size: 14px; font-weight: 700; color: #173955; }
.block.list.news .item .content h3{  }
.block.list.news .item .content .text{ font-size: 16px; color: #173955; line-height: 30px; }
.block.list.news .item .btn{ position: absolute; bottom: -20px; right: 15px; }
.block.list.news a{ text-decoration: none; }
.block.list.news a:hover{ text-decoration: none; }
.block.list.news a:hover .item{ background: rgba(255,255,255,1); box-shadow: 2px 2px 10px rgba(0,0,0,0.1); }

.row.blue{ background: #70D3CB; padding: 100px 0; position: relative; }
.row.blue h2{ color: #173955; margin-top: 0; }
.row.blue .btn{ position: absolute; bottom: -130px; }
.row.blue .col-md-6:nth-child(2){ display: flex; align-items: center; }
.row.blue i{ margin-left: 15px; }
.row.blue .limburg_map{ position: absolute; width: 100%; z-index: 9999; }

.row.white{ height: 350px; }
/* ============================================
		FOOTER
=============================================*/
.container-fluid.footer{ background: #173955; font-size: 14px; color: #B7E8E3; line-height: 26px; padding: 35px 0 35px 0; }
.container-fluid.footer p{ margin-bottom: 0; }
.container-fluid.footer ul{ margin-bottom: 0; padding-left: 0; }
.container-fluid.footer ul li{ list-style: none; width: 50%; float: left; }
.container-fluid.footer a{ color: #B7E8E3; text-decoration: underline; }
.container-fluid.footer .block.html.image{ position: absolute; bottom: -60px; }
.container-fluid.footer .block.html.image img{ width: 100%; }
.container-fluid.footer .col-md-5 .block.menuitem li{ width: 45% }
.container-fluid.footer .col-md-2{ text-align: right; }


/* ============================================
		ENDPAGE
=============================================*/
.container-fluid.endpage{ background: #ffffff; font-size: 14px; color: #173955; padding: 5px 0; }
.container-fluid.endpage .col-md-4:nth-child(1){}
.container-fluid.endpage .col-md-4:nth-child(2){ text-align: center; }
.container-fluid.endpage .col-md-4:nth-child(3){ text-align: right; }
.container-fluid.endpage .col-md-4:nth-child(3) img{ max-width: 30px; }
.container-fluid.endpage ul{ margin-bottom: 0; padding-left: 0; }
.container-fluid.endpage ul li{ list-style: none; display: inline; }
.container-fluid.endpage ul li:after{ content: "|"; margin: 0 5px; }
.container-fluid.endpage ul li:last-child:after{ content: ""; margin: 0; }
.container-fluid.endpage a{ color: #909090; }

/* #Tablet (Landscape)
================================================== */
@media only screen and (min-width: 959px) and (max-width: 1220px){
	.container-fluid.navigatie .navbar-brand{ max-width: 150px; }
	.container-fluid.navigatie .navbar-nav .nav-item .nav-link{ padding: 8px 15px; }
	.container-fluid.navigatie.sticky .navbar-brand{ max-width: 150px; }
	.container-fluid.slider{ padding-top: 30px; }
	.container-fluid.content{ margin-top: -200px; }
	.row.white{ height: 200px; }
}

/* ================================================== */
@media only screen and (min-width: 959px) and (max-width: 991px){
	.container-fluid.navigatie .navbar-brand{ margin-top: -20px; }
	.container-fluid.navigatie.sticky .navbar-brand{ margin-top: -20px; }
	.container-fluid.navigatie .navbar-nav .active.nav-item .nav-link:after{ left: 15px; }
	.navbar-nav{ background: #ffffff; margin-top: 10px; }
	.container-fluid.footer ul{ padding-left: 0; margin-bottom: 40px; }
	.container-fluid.footer ul li{  width: 100%; float: none; }
}

/* Tablet (Portrait)
================================================== */
@media only screen and (min-width: 768px) and (max-width: 959px) {
	.container-fluid.top .block.content.topmenu{ display: none; }
	.container-fluid.navigatie{ top: 42px; }
	.container-fluid.navigatie .navbar-brand{ max-width: 150px; }
	.container-fluid.navigatie .navbar-nav .nav-item .nav-link{ padding: 8px 15px; }
	.container-fluid.navigatie.sticky .navbar-brand{ max-width: 150px; }
	.container-fluid.navigatie .navbar-nav .active.nav-item .nav-link:after{ left: 15px; }
	.navbar-nav{ background: #ffffff; margin-top: 10px; }
	/* SLIDER */
	.container-fluid.slider{ padding-top: 30px; }
	/* content */
	.container-fluid.content{ margin-top: -200px; }
	.block.list.news .item .content{ padding: 10px 0; }
	.block.list.news .item .btn{ right: 0; background-size: 100%; width: 210px; height: 38px; }
	.row.blue .limburg_map{ position: relative; }
	.row.white{ height: 0; }
	/* FOOTER */
	.container-fluid.footer ul{ padding-left: 0; margin-bottom: 40px; }
	.container-fluid.footer ul li{  width: 100%; float: none; }
}

/* #Mobile (Landscape)
================================================== */
@media only screen and (min-width: 480px) and (max-width: 767px) {

}

/* Mobiel (Portrait)
================================================== */
@media only screen and (max-width: 479px) {
	h1{ font-size: 40px; line-height: 50px; }
	h2{ font-size: 32px; }
	h3{ font-size: 22px; }
	.container-fluid.top{ padding-bottom: 5px; }
	.container-fluid.top .container{ padding: 0; }
	.container-fluid.top .block.content.topmenu{ display: none; }
	.container-fluid.top .search_balk input{ width: 100%; }
	.container-fluid.top.sticky{ display: none; }
	.container-fluid.navigatie{ top: 48px; }
	.container-fluid.navigatie .container{ padding: 0; }
	.container-fluid.navigatie .navbar-brand{ max-width: 150px; margin-top: 0; }
	.container-fluid.navigatie .navbar-nav .nav-item .nav-link{ padding: 8px 15px; }
	.container-fluid.navigatie .navbar-nav .active.nav-item .nav-link:after{ left: 15px; }
	.container-fluid.navigatie.sticky{ top: 0; }
	.container-fluid.navigatie.sticky .navbar-brand{ max-width: 150px; }

	.navbar-nav{ background: #ffffff; margin-top: 10px; }
	/* SLIDER */
	.container-fluid.slider{ padding-top: 30px; }
	/* content */
	.container-fluid.content{ margin-top: 0; }
	.block.html.blueblock{ padding: 20px 20px 40px 20px; }
	.block.html.blueblock h2{ margin: 10px 0; }
	.block.html.blueblock .btn{ right: 20px; }
	.block.list.news{ margin: 30px -15px 50px -15px; }
	.block.list.news .col-md-4{ margin-bottom: 50px; }
	.block.list.news .item .content{ padding: 10px 0; }
	.block.list.news .item .btn{ right: 0; background-size: 100%; width: 210px; height: 38px; }
	.row.blue{ padding: 50px 0; }
	.row.blue .limburg_map{ position: relative; margin-top: 30px; }
	.row.white{ height: 0; }
	/* FOOTER */
	.container-fluid.footer .block.html.image{ display: none; }
	.container-fluid.footer ul{ padding-left: 0; margin-bottom: 40px; }
	.container-fluid.footer ul li{  width: 100%; float: none; }
	.container-fluid.endpage .col-md-4:nth-child(1){ text-align: center; }
	.container-fluid.endpage .col-md-4:nth-child(3){ text-align: center; }
}
