@charset "utf-8";

.gm-style .place-card-large {
  display: none !important;
}
/** VARS ***********************************************************************
_______________________________________________________________________________*/
/*
.shades() {
	&:before, &:after {
		content: "";
		display: block; width: 50%; height: 12px;
		position: absolute; top: 100%;
	}
	&:before {
		background: url("/assets/images/layout/shade-left.png") no-repeat left top;
		left: 0;
	}
	&:after {
		background: url("/assets/images/layout/shade-right.png") no-repeat right top;
		right: 0;
	}
}
*/
/** NORMALIZE OVERWRITE + CLASSES **********************************************
_______________________________________________________________________________*/
html {
  box-sizing: border-box;
}
*,
*:before,
*:after {
  box-sizing: inherit;
}
*,
p,
h1,
ul,
ol {
  margin: 0;
  padding: 0;
}
h1,
h2,
h3 {
  font-family: 'Abel', sans-serif;
  font-weight: normal;
  line-height: 100%;
}
a,
a:hover,
a:active {
  color: inherit;
  outline: none !important;
  text-decoration: none;
}
td {
  vertical-align: top;
}
td[valign='middle'] {
  vertical-align: middle;
}
td[valign='bottom'] {
  vertical-align: bottom;
}
ul {
  list-style: none none outside;
}
input,
textarea,
select,
label,
button {
  vertical-align: middle;
  outline: none;
}
input,
textarea,
select,
button {
  width: 100%;
  padding: 6px 10px;
  border: none;
  background-color: #fff;
  color: #999999;
  line-height: 19px;
  height: 31px;
  outline: none;
}
input[type='checkbox'],
textarea[type='checkbox'],
select[type='checkbox'],
button[type='checkbox'],
input[type='radio'],
textarea[type='radio'],
select[type='radio'],
button[type='radio'] {
  width: auto;
  height: auto;
  border: none;
  background: none;
  margin-right: 5px;
}
textarea {
  height: auto;
  resize: none;
  outline: none;
}

input.error,
textarea.error,
select.errof {
  background-color: #ffe5e5;
}
/** ROOT ***********************************************************************
_______________________________________________________________________________*/
html,
body {
  font: normal 14px/1.7 Arial, Sans-serif;
  color: #999999;
  background-color: #ececec;
  height: 100%;
}
#top > div,
#banner > div,
nav > div,
footer > div,
#content-2 > div,
#content-3 > div {
  width: 960px;
  margin: 0 auto;
  position: relative;
  height: 100%;
  /*padding: 0 10px; overflow: hidden;*/
}

.slick-banner {
  display: none;
}
.slick-banner.slick-initialized {
  display: block !important;
}

#content,
#content-end {
  width: 960px;
  margin: 0 auto;
  position: relative;
  padding-top: 45px;
  padding-bottom: 45px;
  /*padding: 0 10px; overflow: hidden;*/
  overflow: auto;
}

.responsive {
  display: block;
  max-width: 100%;
  height: auto;
}

.youtubecontainer {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
  max-width: 850px;
  margin: 0 auto;
}
.youtubecontainer iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
  z-index: 0;
}
/* .hytPlayerWrap{display: inline-block; position: relative;} */
.youtubecontainer.ended::after {
  z-index: 100;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  cursor: pointer;
  background-color: black;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 64px 64px;
  background-image: url(data:image/svg+xml;utf8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjgiIGhlaWdodD0iMTI4IiB2aWV3Qm94PSIwIDAgNTEwIDUxMCI+PHBhdGggZD0iTTI1NSAxMDJWMEwxMjcuNSAxMjcuNSAyNTUgMjU1VjE1M2M4NC4xNSAwIDE1MyA2OC44NSAxNTMgMTUzcy02OC44NSAxNTMtMTUzIDE1My0xNTMtNjguODUtMTUzLTE1M0g1MWMwIDExMi4yIDkxLjggMjA0IDIwNCAyMDRzMjA0LTkxLjggMjA0LTIwNC05MS44LTIwNC0yMDQtMjA0eiIgZmlsbD0iI0ZGRiIvPjwvc3ZnPg==);
}
.youtubecontainer.paused::after {
  z-index: 101;
  content: '';
  position: absolute;
  top: 43px;
  left: 0;
  bottom: 46px;
  right: 0;
  cursor: pointer;
  background-color: black;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 40px 40px;
  background-image: url(data:image/svg+xml;utf8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEiIHdpZHRoPSIxNzA2LjY2NyIgaGVpZ2h0PSIxNzA2LjY2NyIgdmlld0JveD0iMCAwIDEyODAgMTI4MCI+PHBhdGggZD0iTTE1Ny42MzUgMi45ODRMMTI2MC45NzkgNjQwIDE1Ny42MzUgMTI3Ny4wMTZ6IiBmaWxsPSIjZmZmIi8+PC9zdmc+);
}
/*
.tiles { .base(); width: @minWidth + 16; margin: 10px -8px -10px -8px;
	
	& > a,
	& > div,
	& > fieldset { display: inline-block; vertical-align: top;
		border-left: 8px solid #fff; border-right: 8px solid #fff; margin: 10px 0;
	}
}

@media(max-width: @minWidth) {
	.tiles {
		width: 102%; margin-left: -1%; margin-right: -1%; padding: 0;

		& > a,
		& > div,
		& > fieldset { border-left: 1% solid #fff; border-right: 1% solid #fff; }
	}
}

table { width: 100%; table-layout: fixed;
	
	td { padding: 8px;
		
		&:first-child { padding-left: 0; }
		&:last-child { padding-right: 0; }
	}
	
	tr:first-child td { padding-top: 0; }
	tr:last-child td { padding-bottom: 0; }
}
*/
/** GRID ***********************************************************************
_______________________________________________________________________________*/
body > div {
  /*min-height: 100%;*/
}
#wrapper {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  /*margin: 0 auto -135px 0;
  min-height: 100%;*/
  /* height: 100%; */
}
#wrapper footer {
  margin: auto 0 0 0;
}
#wrapper #push {
  /*height: 135px;*/
}
header {
  /*	#banner { height: 400px;

		img { display: block; width: 100%; height: auto; }

		ul { list-style: none none outside; padding: 0; height: 100%; position: relative; }

		li { display: inline-block; height: 100%; width: 100%; vertical-align: middle; }

	//	@media(max-width: @minWidth) { height: auto; }
	}*/
}
header #top {
  height: 48px;
  line-height: 48px;
  background-color: #404040;
}
header #top a {
  display: block;
  height: 100%;
  position: relative;
  cursor: pointer;
}
header #top a#mm-toggle {
  display: none;
}
header #logo {
  float: left;
  height: 100%;
}
header #logo img {
  display: inline-block;
  width: 100%;
  vertical-align: middle;
}
header #logo:before {
  content: '';
  height: 100%;
  vertical-align: middle;
  display: inline-block;
}
header #login,
header #mm-toggle {
  float: right;
  text-transform: uppercase;
  margin-right: 20px;
}
header #login:before,
header #mm-toggle:before,
header #login:after,
header #mm-toggle:after {
  content: '';
  position: absolute;
  top: 0;
  display: block;
  width: 26px;
  height: 100%;
  background: url('/assets/images/layout/bg-login.png') no-repeat left center;
}
header #login:before,
header #mm-toggle:before {
  left: -20px;
}
header #login:after,
header #mm-toggle:after {
  right: -20px;
  transform: scaleX(-1);
}
header #mm-toggle {
}
header #banner {
  height: 400px;
  position: relative;
  overflow: auto;
}
header #banner ul {
  list-style: none none outside;
  height: 100%;
}
header #banner li {
  float: left;
  background-size: cover;
  background-position: center center;
  height: 100%;
}
header #banner li a {
  display: block;
  height: 100%;
}
header #banner li div {
  width: 960px;
  margin: 0 auto;
  position: relative;
  height: 100%;
  padding: 130px 0 0 0;
}

header #banner li h3 {
  font-family: 'Abel', sans-serif;
  font-size: 64px;
  color: #0f676d;
  padding: 0 0 115px 0;
  margin: 0;
  position: relative;
  text-align: center;
  background: url('/assets/images/layout/h3.png') no-repeat center bottom;
}

header #banner li img {
  display: none;
}

header nav.language {
  float: right;
  margin-left: 10px;
}
header nav.language a {
  display: inline-block !important;
  height: auto !important;
  margin-left: 10px;
  line-height: 1;
}
header nav.language a:hover,
header nav.language a.active {
  color: #fff;
}

header nav.main {
  background-color: #45b2b9;
  height: 73px;
  line-height: 73px;
  text-transform: uppercase;
  font-family: 'Abel', sans-serif;
  font-size: 20px;
}
header nav.main a,
header nav.main span {
  display: block;
  height: 100%;
  color: #88ced3;
  cursor: pointer;
}
header nav.main a:hover,
header nav.main span:hover,
header nav.main a.active,
header nav.main span.active {
  color: #fff;
  background: url('/assets/images/layout/nav.png') no-repeat center bottom;
}
header nav.main ul {
  width: 100%;
  height: 100%;
  text-align: center;
}
header nav.main ul.col-1 li {
  width: 100%;
}
header nav.main ul.col-2 li {
  width: 50%;
}
header nav.main ul.col-3 li {
  width: 33.33%;
}
header nav.main ul.col-4 li {
  width: 25%;
}
header nav.main ul.col-5 li {
  width: 20%;
}
header nav.main ul.col-6 li {
  width: 16.66%;
}
header nav.main li {
  padding: 0 10px 0 10px;
  position: relative;
  display: inline-block;
}
header nav.main li ul {
  display: none;
  position: absolute;
  left: 10%;
  top: 100%;
  z-index: 1000;
  width: 80%;
  white-space: nowrap;
  text-align: left;
  font-size: 14px;
  margin-top: -9px;
  padding-top: 9px;
  background: url('/assets/images/layout/nav-sub.png') no-repeat center top;
}
header nav.main li ul a {
  color: #fff;
  height: auto;
  line-height: normal;
  padding: 5px 10px;
  background-color: #97d7dc;
}
header nav.main li ul a:hover,
header nav.main li ul a.active {
  color: #0f676d;
  background-color: #97d7dc;
  background-image: none;
}
header nav.main li li {
  display: block;
  padding-bottom: 2px;
  width: 100% !important;
}
header nav.main li:hover a {
  color: #fff;
}
header nav.main li:hover ul {
  display: block;
}
#content {
  display: table;
}
#content > section {
  display: table-cell;
  vertical-align: top;
}
#content ul li {
  margin-left: 22px;
  position: relative;
}
#content ul li:before {
  content: '';
  position: absolute;
  left: -22px;
  display: block;
  width: 15px;
  height: 25px;
  background: url('/assets/images/layout/li.png') no-repeat center center;
}
#content a {
  color: #0f676d;
}
#content img {
  max-width: 100%;
  height: auto;
}
#map {
  /*float: right;*/
  padding-left: 20px;
}
#map iframe {
  border: none;
}
footer {
  font-family: 'Abel', sans-serif;
  padding: 40px 0;
  background-color: #45b2b9;
  color: #97d7dc;
  /*height: 135px;*/
  text-transform: uppercase;
}
footer > div {
  display: table;
}
footer > div address,
footer > div nav {
  display: table-cell;
  font-style: normal;
}
footer > div nav {
  text-align: right;
}
footer > div nav a {
  display: block;
}
/** DEFINED ********************************************************************
_______________________________________________________________________________*/
.groen {
  color: #0f676d;
}
h1,
h2,
h3 {
  font-size: 30px;
  font-weight: normal;
  font-family: 'Abel', Sans-serif;
  color: #0f676d;
  text-transform: uppercase;
  padding: 0;
}
h2 {
  font-size: 25px;
}
b,
strong {
  color: #51909e;
}
hr {
  border: solid 1px #999999;
  border-style: none none solid;
}
hr:after {
  font-size: 12px;
}
table {
  table-layout: fixed;
  border-top: solid 2px #9bd9dd;
  position: relative;
  margin: 20px 0;
}
table td {
  border-left: solid 2px #9bd9dd;
  position: relative;
  padding: 25px;
}
table td:before,
table td:after {
  content: '';
  display: block;
  width: 48px;
  height: 4px;
  background-color: #ace2e5;
  left: -2px;
  position: absolute;
  top: -2px;
}
table td:after {
  left: auto;
  right: 0;
}
table td:first-child {
  border-left: none;
}
table td:last-child {
  border-right: none;
}
table td:first-child:before,
table td:last-child:after {
  display: none;
}
/*
.grayscale {
	
	img {
		// Firefox 10+, Firefox on Android
		filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
		// IE 6-9
		filter: gray;
		// Chrome 19+, Safari 6+, Safari 6+ iOS, Opera 15+
		-webkit-filter: grayscale(1);
	}
	
	&:hover img {
		-webkit-filter: grayscale(0);
		filter: none;

		svg { opacity: 0; }
	}
}
*/
/** HOME ***********************************************************************
_______________________________________________________________________________*/
#content-2 {
  padding-top: 45px;
  padding-bottom: 45px;
  text-align: center;
  background: url('/assets/images/layout/ptrn-1.jpg') repeat center top;
}
#content-3 {
  padding-top: 45px;
  padding-bottom: 45px;
  text-align: center;
  color: #fff;
  background-color: #88ced3;
}
/** FORMS **********************************************************************
_______________________________________________________________________________*/
#form {
  width: 63%;
  padding-left: 20px;
}
#form h1 {
  position: relative;
  border: solid 3px #88ced3;
  text-align: center;
}
#form h1:before,
#form h1:after {
  content: '';
  position: absolute;
  left: 0;
  top: -22px;
  background: url('/assets/images/layout/form-top.png') no-repeat center center;
  background-size: cover;
  width: 100%;
  height: 23px;
}
#form h1:after {
  top: auto;
  bottom: -22px;
  background-image: url('/assets/images/layout/form-btm.png');
}
#form form {
  background-color: #88ced3;
}
form {
  overflow: hidden;
  padding: 35px 8px 15px 8px;
}
form fieldset {
  padding: 0 7px;
  margin: 0;
  border: none;
  width: 50%;
  float: left;
}
form p {
  margin-bottom: 0;
  position: relative;
}
form p label.error {
  position: absolute;
  top: 0;
  right: 5px;
  line-height: 25px;
  color: #f00;
}
form p input,
form p textarea {
  font-family: 'Abel', sans-serif;
  margin-top: 2px;
  background-color: #d0e7e9;
  font-size: 16px;
}
form p input[type='submit'],
form p textarea[type='submit'],
form p input[type='reset'],
form p textarea[type='reset'] {
  background-color: #a9dce0;
  color: #0f676d;
  text-align: center;
  text-transform: uppercase;
}
form p textarea {
  height: 130px;
  /*97px;*/
}
form p.checks {
  line-height: 19px;
  padding: 7px 0;
  height: 31px;
  margin-top: 2px;
}
form p.checks input {
  margin: 0 10px;
  vertical-align: middle;
}
form p.button {
  background-color: #a9dce0;
  text-transform: uppercase;
  margin: 35px 0 15px 0;
  position: relative;
}
form p.button:before,
form p.button:after {
  content: '';
  position: absolute;
  left: 0;
  top: -12px;
  background: url('/assets/images/layout/btn-top.png') no-repeat center center;
  background-size: cover;
  width: 100%;
  height: 12px;
}
form p.button:after {
  top: auto;
  bottom: -12px;
  background-image: url('/assets/images/layout/btn-btm.png');
}
form div.checks-multiple {
  overflow: hidden;
  margin-bottom: 10px;
}
form div.checks-multiple label {
  font-weight: bold;
  text-transform: uppercase;
}
form div.checks-multiple ul {
  list-style: none outside none;
  padding: 0;
  overflow: hidden;
}
form div.checks-multiple ul li {
  float: left;
  width: 31%;
  padding: 1%;
}
form div.checks-multiple ul li label {
  font-weight: normal;
  text-transform: none;
}
/** NEWS ITEM ******************************************************************
_______________________________________________________________________________*/
#news {
  color: #fff;
  height: 365px;
  text-align: center;
  /*overflow: hidden;*/
  position: relative;
  background: url('/assets/images/layout/ptrn-2.png') repeat center top;
  /*	i.bg { .base(); position: absolute; left: 50%; top: 0; display: block; width: 100%; height: 200%; background-color: @cBlue;
		transform-origin: 0 0 0; transform: rotate(45deg);
	
		&.ie { transform: none; left: 0; }
	}
*/
}
#news h1 {
  position: absolute;
  width: 100%;
  top: 80px;
  left: 0;
  z-index: 100;
}
#news h2 {
  color: #fff;
  margin: 15px 0;
  padding: 0 0 45px;
  background: url('/assets/images/layout/news.png') no-repeat center bottom;
}
#news .banner {
  height: 365px;
  position: relative;
  overflow: auto;
}
#news .banner ul {
  list-style: none none outside;
  height: 100%;
}
#news .banner li {
  float: left;
  background-size: cover;
  background-position: center center;
  height: 100%;
}
#news .banner article {
  max-width: 730px;
  margin: 0 auto;
  padding-top: 115px;
  height: 100%;
  background: url('/assets/images/layout/news-bg.png') no-repeat center top;
}
/** STOCKAGE ITEM **************************************************************
_______________________________________________________________________________*/
#stockage {
  background: url('/assets/images/layout/ptrn-2.png') repeat center top;
}
#stockage article {
  width: 32%;
  margin: 30px 2% 30px 0;
  float: left;
}
#stockage article > div {
  background-color: #97d7dc;
  padding: 40px 12px 20px 12px;
}
#stockage article:nth-child(3n) {
  margin-right: 0;
}
#stockage h2 {
  background-color: #ececec;
  text-align: center;
  border: solid 3px #97d7dc;
  position: relative;
  padding: 3px;
}
#stockage h2:before,
#stockage h2:after {
  content: '';
  width: 100%;
  height: 23px;
  background: url('/assets/images/layout/h2-top.png') no-repeat center bottom;
  background-size: cover;
  position: absolute;
  left: 0;
  top: -22px;
}
#stockage h2:after {
  background: url('/assets/images/layout/h2-btm.png') no-repeat center top;
  top: auto;
  bottom: -22px;
}

header nav.main {
  height: auto;
  line-height: 1.6;
}
header nav.main li {
  padding: 5px 10px;
}
header nav.main a,
header nav.main span {
  background-image: none !important;
}
/*
 * MOBILE
 */
@media (max-width: 960px) {
  #top > div,
  #banner > div,
  nav > div,
  footer > div,
  #content-2 > div,
  #content-3 > div {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }
  #banner > div {
    padding: 0;
  }

  #content,
  #content-end {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }

  header #banner li div {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }

  header nav.main {
    height: auto;
    line-height: 1.6;
  }
  header nav.main li {
    padding: 5px 10px;
  }
  header nav.main a,
  header nav.main span {
    background: none !important;
  }

  #content-end img[style='float: right;'],
  #content img[style='float: right;'] {
    max-width: 45%;
    height: auto;
    margin-left: 5%;
  }
}
@media (min-width: 768px) {
  header nav.main {
    display: block !important;
  }
}
@media (max-width: 767px) {
  html,
  body,
  body > div {
    min-height: 1px;
  }

  header #top > div {
    padding: 0 5px;
  }

  header #login,
  footer nav {
    display: none !important;
  }

  header nav.main {
    position: absolute;
    left: 0;
    top: 48px;
    z-index: 99;
    width: 100%;
    padding: 10px 0;
    display: none;
  }
  header nav.main li {
    display: block;
  }
  header nav.main li ul {
    display: block;
    width: 100% !important;
    margin: 0;
    padding: 0px;
    text-align: center;
    background: none;
    position: static;
  }
  header nav.main li li {
    display: inline-block;
    width: auto !important;
    margin: 0 5px;
    padding: 0;
  }
  header nav.main li li a {
    padding: 0;
    color: #88ced3;
  }
  header nav.main li li a:hover,
  header nav.main li li a.active {
    color: #fff;
  }

  header #top a#mm-toggle {
    display: block;
    float: right;
    margin-right: 10px;
    margin-left: 35px;
  }

  header #banner {
    height: auto;
  }
  header #banner li {
    background: none !important;
  }
  header #banner li img {
    display: block;
  }
  header #logo img {
    max-width: 140px;
    height: auto;
  }

  #content {
    display: block;
  }
  #content > section {
    display: block;
    padding: 0;
  }
  #map {
    margin-top: 20px;
  }
  #map iframe {
    width: 100%; /*padding-bottom: 0%;*/
  }

  #content-end img[style='float: right;'],
  #content img[style='float: right;'] {
    max-width: 100%;
    margin-left: 0;
    margin-bottom: 15px;
  }

  #form {
    width: 100%;
    margin-top: 40px;
  }

  footer {
    padding: 20px 0;
  }
  footer > div address {
    display: block;
    width: 100%;
  }
}
/*
@media (max-width: 600px) {
  header {
    padding-top: 48px;
  }
  header #top {
    position: fixed;
    -webkit-backface-visibility: hidden;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
  }
  header #top a#mm-toggle {
    display: block;
  }
  header #banner {
    height: 250px;
  }
  header #banner li div {
    padding-top: 40px;
  }
  header #banner li h3 {
    font-size: 40px;
    padding-bottom: 70px;
  }
  nav {
    display: none !important;
  }
  #logo {
    max-width: 30%;
  }
  #stockage article {
    float: none;
    width: 100%;
    display: block;
    max-width: 307px;
    margin: 30px auto 0 auto !important;
  }
  #stockage article > div {
    height: auto !important;
  }
  #content {
    display: block;
  }
  #content > section {
    display: block;
    padding: 0 0 30px 0;
  }
  #map iframe {
    width: 100%;
  }
  
}
*/