/*
base color: #9bd1c2;
base color dark: #79a397
blue dark: #13467a;
Blue dark hover: #133b67
*/


/**************************************************************************************
**
** COMMON
**
***************************************************************************************/


body {
	padding: 0;
	margin: 0 auto; 
}

body, td, input[type=text], textarea {
	font-family:"Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/*.grid-container {
	max-width: 105rem;
}*/

.grid-x {
	max-width: 120rem; /*2560 = 160  1920 = 120*/
	margin-left: auto;
	margin-right: auto;
}

.serviceblock{
	background-color: #9bd1c2;
	color: #FFF;
	font-weight: bold;
	padding: 20px 20px 20px 20px;
}


img {
    max-width: 100%;
 }

h1 {
	font-family:"Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:300;
	color:#13467a;
	display:block;
}

h2 {
	font-family:"Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:300;
	font-size:1.5em;
	color: #13467a;
}

h2.blog {
	font-family:"Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:400;
	color: #13467a;
}

h3 {
	font-family:"Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:300;
	color: #13467a;
	font-size:1.3em;
}

.hetweer {
	font-family:"Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:300;
	color: #9e1d16;
	text-align: center;
}

p, ul, li{
	font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:400;
	line-height:2em;
}

p{
	color: #444444;
}


blockquote {
	margin: 20px 0px 20px 0px;
	padding-left: 1.5em;
	padding-right: 2em; 
	border-left: 2px solid #9bd1c2; 
	font-style: italic; 
	color: #13467a;
}

blockquote p{
	color: #13467a;
	font-size: 120%;
}

ul.Inputfields{
	list-style:none;
	padding:0;
	margin:0px;
}


.greydiv{
	background-color: #F9F9F9;
	padding: 60px 0;
}

.blackbutton{
	background-color:rgba(255, 255, 255, 0.85);
	color:#000000;
	display:inline-block;
	padding:10px 10px 10px 10px;
}

.projectarrow{
	display: block;
	/*border: #E2E2E2 1px solid;*/
	width: 100%;
	height: 100%;
	/*padding:30px 30px 30px 30px;*/
	color:#999;
}

.projectline{
	border-bottom: #e31f18 1px solid;
}

.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background-color:rgba(255, 255, 255, 0.85);
	background: url(../gfx/preloader4.gif) center no-repeat #fff;
}

.facebook-button{
	/*display:inline-block;
	text-align:center;*/
	background-color:#3B5998;
	color:#FFFFFF;
	/*padding:20px 20px 20px 20px;
	width: 100%;*/
}

.facebook-button:hover{
	color:#FFFFFF;
	background-color:#8B9DC3;
}

.instagram-button{
	display:block;
	text-align:center;
	background-color:#bc2a8d;
	width:100%;
	color:#FFFFFF;
	padding:30px 15px 30px 15px;
}

.instagram-button:hover{
	color:#FFFFFF;
	background-color:#cd486b;
}




.directLink{
	border: 0;
    padding: 0;
    display: inline;
    background: none;
    text-decoration: none;
	cursor: pointer;
	text-align: left;
	font-size: 85%;
	color: #666666;
	line-height: 2em;
}

.directLink:hover{
	color: #000000;
}


.widthconstrain{
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
}


.minmax{
	border: 0;
	padding: 0;
	margin: 0;
	font-size: 13px;
	box-shadow: none;
}


.custom-callout{
	color:#FFFFFF;
	background-color:#9e1d16;
}

.custom-callout a{
	color:#FFFFFF;
}

.topbartext{
	background-color: #13467a;
	color: #FFF;
	padding: 10px 0;
	text-align: center;
	font-family:"Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:400;
}


.InputfieldFieldset{
	border: #CCCCCC 1px solid;
	padding: 20px 20px 20px 20px;
	margin-bottom: 30px;
}


.Inputfield > .InputfieldContent > .smallinput{
	width: 50px;
	display: block;
}




/**************************************************************************************
**
** HOME MOVIE
**
***************************************************************************************/

/*#movie-wrapper{
	position: relative;
	width: 100%;
	max-width: 2560px;
	height: 100%;
	max-height: 1706px;
	margin-left: auto;
	margin-right: auto;
	background-color: #F0F0F0;
}

#home-slogan-wrapper{
	position: absolute;
	top: 40%;
	left: 0px;
	width: 100%;
	padding: 0 30px;
	text-align: center;
}

#home-wrapper{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
}*/


/**************************************************************************************
**
** HOME GALLERIA LAYER
**
***************************************************************************************/


.homedatalayer{
	position: absolute;
	top: 40%;
	width: 100%;
	text-align: center;
	line-height: normal;
}

.homedatalayer h2{
	color: #FFFFFF;
	text-shadow: 1px 1px 4px #000;
	font-weight: 600;
}

@media only screen and (min-width: 320px) {
	.homedatalayer h2{
		font-size: 16px;
	}
}

@media only screen and (min-width: 480px) {
	.homedatalayer h2{
		font-size: 18px;
	}
}

@media only screen and (min-width: 600px) {
	.homedatalayer h2{
		font-size: 28px;
	}
}

@media only screen and (min-width: 768px) {
	.homedatalayer h2{
		font-size: 32px;
	}
}

@media only screen and (min-width: 900px) {
	.homedatalayer h2{
		font-size: 48px;
	}
}

@media only screen and (min-width: 1024px) {
	.homedatalayer h2{
		font-size: 56px;
	}
}

@media only screen and (min-width: 1280px) {
	.homedatalayer h2{
		font-size: 64px;
	}
}



/**************************************************************************************
**
** HEAD
**
***************************************************************************************/

/*
base color: #9bd1c2;
base color dark: #79a397
blue dark: #13467a;
Blue dark hover: #133b67
*/


.bigtoplogo{padding:15px 0px 20px 0px;}
.smalltoplogo{padding:10px 0px 10px 0px;}

.top-wrapper{
	/*background-color:#FFFFFF;*/
}

/*.topmenu-wrapper{
	position:relative;
	background-color:#e31f18;
	padding: 15px 0px 15px 0px;
}*/

.topmenu{
	padding: 0px 0px 0px 0px;
	margin-top: 20px;
}

.topmenu ul li a{
	display: inline-block;
	color: #666666 !important;
	transition: all 0.6s ease;
	font-size:100%;
	/*font-weight: bold;*/
	padding: 20px 8px 20px 8px;
	border-bottom: #FFFFFF 1px solid;
}

.topmenu ul li a.current{
	color: #000000;
	/*border-bottom: #e31f18 1px solid;*/
}

.topmenu ul li a:hover{
	color: #13467a !important;
	border-bottom: #13467a 1px solid;
}

.submenu{
	z-index: 99999;
}

.hamstack{
	padding: 18px 15px 20px 25px;
	cursor: pointer;
	color: #000000;
	font-size: 32px;
}

.hamstacksmall{
	padding: 10px 15px 10px 0px;
	cursor: pointer;
	color: #000000;
	font-size: 24px;
}

li.subli a{
	/*text-align: left;*/
	line-height: 24px;
	font-weight: 400 !important;
	padding: 0;
	margin: 0;
	display: block !important;
}

li.subli a:hover{
	border: 0;
}

/**************************************************************************************
**
** MENU
**
***************************************************************************************/

/*
base color: #9bd1c2;
base color dark: #79a397
blue dark: #13467a;
Blue dark hover: #133b67
*/

#offcanvasmenu{
	position: fixed;
	width: 200px;
	height: 100%;
	top: 0px;
	left: -201px;
	background-color: #13467a;
	z-index:9999 !important;
	overflow: hidden;
}

.closecanvasmenu{
	cursor: pointer;
	color: #FFFFFF;
	/*font-family:"Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:400;*/
	font-size: 2em;
	/*line-height: 1;
	text-transform: none;*/
	text-align: right;
	padding: 7px 15px 7px 25px;
	/*border-bottom: #FFFFFF 1px solid;*/
}

.canvasmenu{
	color:#333333;
}

.canvasmenu ul{
	padding: 0;
	margin: 0;
	list-style: none;
}

.canvasmenu ul li ul li{
	padding-left: 15px;
}

.canvasmenu a{
	display: block;
	padding: 10px 5px 10px 15px;
	color:#CFCFCF;
	transition: all 0.6s ease;
}

.canvasmenu a:hover{
	color:#79a397;
}

.canvasmenu a.current{
	color:#FFF;
}

.logo{
	padding: 15px 0px 15px 0px;
}

.bullet{
	padding: 15px 0px 10px 0px;
}

.canvaslang{
	color:#F0F0F0;
	border-top: #9bd1c2 1px solid;
}

.canvaslang a{
	display: inline-block;
	padding: 15px 5px 15px 15px;
	color:#CFCFCF;
	font-size: 90%;
}

.canvaslang a:hover{
	color:#79a397;
}

.canvaslang a.current{
	color:#79a397;
}




/*.stickymenu{
	display:none;
	position:fixed;
	top:0px;
	z-index:9998 !important;
	width:100%;
	background-color:rgba(255, 255, 255, 0.87);
}*/




/*#footerparentmenu{
	padding-bottom:30px;
}

#footerparentmenu a{
	display: inline-block;
	padding: 15px 5px 15px 15px;
	color:#777777;
}*/


/**************************************************************************************
**
** TOP SLOGAN
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/


.topslogan{
	color:#9e1d16;
}



/**************************************************************************************
**
** LANGUAGE SELECTOR
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/

.languages {
	list-style: none; 
	margin: 0;
	padding: 0; 
	/*float:right;*/
}

	.languages li {
		list-style: none; 
		display: inline-block;
		margin: 0;
		/*padding: 5px;*/
	}

	.languages a {
		border: none; 
		display: inline;
		color:#FFFFFF;
		padding:5px;
	}
		.languages li.current a {
			font-weight: bold; 
		}
		.languages li:first-child a {
			border: none; 
		}


.smalllanguages {
	list-style: none; 
	margin: 0;
	padding: 0; 
	/*float:right;*/
}

	.smalllanguages li {
		list-style: none; 
		display: inline-block;
		margin: 0;
		/*padding: 5px;*/
	}

	.smalllanguages a {
		border: none; 
		display: inline;
		color:#444444;
		padding-right:5px;
	}
		.smalllanguages li.current a {
			font-weight: bold; 
		}
		.smalllanguages li:first-child a {
			border: none; 
		}



/**************************************************************************************
**
** GRID
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/


.ajax-link{
	position:absolute;
	z-index:30;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
	overflow:hidden;
	transition: background 0.2s ease;
	display: block;
}

.grid-wrapper{
	width:100%;
	overflow:hidden;
	margin-bottom:20px;
	background-color:#FFFFFF;
	box-shadow:#E2E2E2 1px 1px 1px;
}

.grid-content{
	position:relative;
	z-index:10;
	padding: 5px 5px 5px 5px;
	
}

.grid-image-wrapper{
	position:relative;}

.grid-bg{
	z-index:15;
}

.grid-cover{
	position:absolute;
	z-index:20;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
	overflow:hidden;
	/*transition: all 0.3s ease;*/
}

.grid-text{
	position:relative;
	color:#666666;
}

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/

.grid-text-title{
	font-weight:bold;
	color:#9e1d16;
}

.grid-text-text{
	font-size:.85em;
	color:#444444;
}

.grid-bar{
	color:#444444;
	font-size:.85em;
}

.grid-bar-item{
	padding: 5px 5px 5px 5px;
}

.label-wrapper{
	position:absolute;
	z-index:25;
	top:15px;
	left:0px;
	height: 100%;
	width: 100%;
}

.label-virtual{
	position: absolute;
	top: calc(50% - 65px);
	left: calc(50% - 50px);
	background-image: url(../gfx/label-virtual.png);
	background-position: center center;
	background-repeat: no-repeat;
	cursor: pointer;
	background-size: cover;
	width: 100px;
		height: 100px;
}

.extraclose{
	z-index: 999; position: absolute; top: 0px; left: 20px; font-size: 40px; cursor: pointer; text-shadow: 0px 0px 4px #FFFFFF;
}

.minilabel{
	background-color:#F3DC0A;}

.project-property-sold{
	background-color:#CCCCCC;
	color:#000000;
	/*padding:5px 10px 5px 10px;*/
	
	display: inline-block;
	  text-align: center;
	  line-height: 1;
	  cursor: pointer;
	  -webkit-appearance: none;
	  transition: background-color 0.25s ease-out, color 0.25s ease-out;
	  vertical-align: middle;
	  border: 1px solid transparent;
	  border-radius: 0;
	  padding: 0.85em 1em;
	  margin: 0 0 1rem 0;
	  font-size: 0.9rem;
}


.project-availability{
	font-weight:bold;
}

.rasterref{
	font-weight:normal;
	color:#999999;
}

.label-wrapper{
	position:absolute;
	z-index:25;
	top:15px;
	left:0px;
}


.grid-label-new{
	background-color:#9e1d16;
	color:#FFFFFF;
	padding:5px 10px 5px 10px;
	box-shadow:#333333 1px 1px 1px;
	font-family: 'Open Sans', sans-serif;
	font-weight:600;
}


.grid-label-sold{
	background-color:#e31f18;
	color:#000000;
	padding:5px 10px 5px 10px;
	box-shadow:#333333 1px 1px 1px;
	font-size:1.5em;
	font-family: 'Open Sans', sans-serif;
	font-weight:600;
}

.grid-label-rented{
	background-color:#e31f18;
	color:#000000;
	padding:5px 10px 5px 10px;
	box-shadow:#333333 1px 1px 1px;
	font-size:1.5em;
	font-family: 'Open Sans', sans-serif;
	font-weight:600;
}




/**************************************************************************************
**
** BLOCK GRID EXTENSION
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/

.searchbar{
	border: #CCC 1px solid;
	padding: 15px 15px 15px 15px;
	background-color: #FFFFFF;
	z-index: 99 !important;
}


/**************************************************************************************
**
** BLOCK GRID EXTENSION
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/

.blockgrid-anchor{
	display:block;
	position:relative;
	
}

.blockgrid-anchor img{
	display:block;
	position:relative;
	object-fit: cover;
    overflow: hidden;
	border: #CCCCCC 1px solid;
	transition: all 0.6s ease;
}

.blockgrid-anchor:hover img{
	/*border: #e31f18 1px solid;*/
	box-shadow: 0px 0px 5px 1px #ABABAB;
}


.blockgrid-textlabel{
	position:absolute;
	top:30px;
	left:-5px;
	background-color:#FFF;
	padding:10px 15px 10px 15px;
	color:#444444;
	font-size:115%;
	border-bottom:#BBB 1px solid;
	border-left:#E2E2E2 1px solid;
}

.column-block{
	margin-bottom:30px;
}



/**************************************************************************************
**
** PROJECT GRID
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/

#projects {
  /* Prevent vertical gaps */
  line-height: 0;
  -webkit-column-gap:   20px;
  -moz-column-gap:      20px;
  column-gap:           20px;  
}

#projects img {
  /* Just in case there are inline attributes */
  width: 100% !important;
  height: auto !important;
}

#projects .picontainer{
	margin-bottom: 20px;
	display: block;
	position: relative;
}

#projects .textcontent{
	position: absolute;
	z-index: 69;
	color: #FFFFFF;
	font-weight: bold;
	text-shadow: 1px 1px 0px #9e1d16;
}

.statecity{
	display: inline-block;
	font-weight: normal;
}



@media only screen {
	#projects {
  -moz-column-count:    1;
  -webkit-column-count: 1;
  column-count:         1;
  }
	#projects .textcontent{
		font-size: 16px;
		line-height: 20px;
		padding: 10px;
	}
	
	.statecity{
		font-size: 16px;
		line-height: 16px;
	}
}

@media only screen and (min-width: 320px) {
	#projects {
  -moz-column-count:    1;
  -webkit-column-count: 1;
  column-count:         1;
  }
	#projects .textcontent{
		font-size: 16px;
		line-height: 24px;
		padding: 10px;
	}
	
	.statecity{
		font-size: 16px;
		line-height: 16px;
	}
}
@media only screen and (min-width: 480px) {
	#projects {
  -moz-column-count:    1;
  -webkit-column-count: 1;
  column-count:         1;
  }
	#projects .textcontent{
		font-size: 20px;
		line-height: 24px;
		padding: 10px;
	}
	
	.statecity{
		font-size: 18px;
		line-height: 18px;
	}
}

@media only screen and (min-width: 600px) {
	#projects {
  -moz-column-count:    1;
  -webkit-column-count: 1;
  column-count:         1;
  }
	#projects .textcontent{
		font-size: 24px;
		line-height: 28px;
		padding: 10px;
	}
	
	.statecity{
		font-size: 18px;
		line-height: 18px;
	}
}

@media only screen and (min-width: 800px) {
	#projects {
  -moz-column-count:    2;
  -webkit-column-count: 2;
  column-count:         2;
  }
	#projects .textcontent{
		font-size: 28px;
		line-height: 32px;
		padding: 10px;
	}
	
	.statecity{
		font-size: 20px;
		line-height: 20px;
	}
}

@media only screen and (min-width: 1024px) {
	#projects {
  -moz-column-count:    2;
  -webkit-column-count: 2;
  column-count:         2;
  }
	#projects .textcontent{
		font-size: 28px;
		line-height: 32px;
		padding: 10px;
	}
	
	.statecity{
		font-size: 20px;
		line-height: 20px;
	}
}

@media only screen and (min-width: 1440px) {
	#projects {
  -moz-column-count:    2;
  -webkit-column-count: 2;
  column-count:         2;
  }
	#projects .textcontent{
		font-size: 32px;
		line-height: 36px;
		padding: 10px;
	}
	
	.statecity{
		font-size: 22px;
		line-height: 22px;
	}
}

@media only screen and (min-width: 1680px) {
	#projects {
  -moz-column-count:    3;
  -webkit-column-count: 3;
  column-count:         3;
  }
	#projects .textcontent{
		font-size: 32px;
		line-height: 36px;
		padding: 10px;
	}
	
	.statecity{
		font-size: 24px;
		line-height: 24px;
	}
}

@media only screen and (min-width: 1920px) {
	#projects {
  -moz-column-count:    3;
  -webkit-column-count: 3;
  column-count:         3;
  }
	
	#projects .textcontent{
		font-size: 32px;
		line-height: 36px;
		padding: 10px;
	}
	
	.statecity{
		font-size: 24px;
		line-height: 24px;
	}

}




/**************************************************************************************
**
** PAGINATOR
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/

.MarkupPagerNav {
	/*clear: both;*/
	margin: 1em 0;
	font-family: 'Lato',Arial, sans-serif;
	font-weight:400;
}
.MarkupPagerNav li {
	display: inline-block;
	list-style: none;
	margin: 0;
}

.MarkupPagerNav li a,
.MarkupPagerNav li.MarkupPagerNavSeparator {
	display: block;
	float: left;
	padding: 2px 9px;
	color: #000000;
	background: #FFFFFF;
	margin-right: 3px;
	/*font-size: 10px;*/
	text-transform: uppercase;
	border: #CCC 1px solid;
}

.MarkupPagerNav li.MarkupPagerNavOn a,
.MarkupPagerNav li a:hover {
	color: #FFFFFF;
	background: #e31f18;
	text-decoration: none;
}

.MarkupPagerNav li.MarkupPagerNavSeparator {
	display: inline;
	color: #777;
	background: #d2e4ea;
	padding-left: 3px;
	padding-right: 3px;
}

/**************************************************************************************
**
** PAGINATOR
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/

.paginatornumbers{
	font-family: 'Roboto Condensed', sans-serif;
	font-size:1.3em;
	color:#9e1d16;
}

.paginatorbutton{
	display:inline-block;
	padding:15px 20px 15px 20px;
	margin-right:20px;
	margin-top:15px;
	border:#ccc 1px solid;
}

.paginatorbutton.active{
	border:#ccc 1px solid;
	background-color:#9e1d16;
	color:#FFFFFF;
}

.paginatorbutton:hover{
	border:#ccc 1px solid;
	background-color:#8c7c51;
}

.paginatorbuttonmobileL{
	display:inline-block;
	padding:10px 20px 10px 20px;
	margin-right:20px;
	/*border:#ccc 1px solid;*/
	background-color:#9e1d16;
	color:#FFFFFF;
	border-radius: 6px;
	font-weight: bold;
	font-size: 24px;
}

.paginatorbuttonmobileL:hover{
	/*border:#ccc 1px solid;*/
	background-color:#8c7c51;
	color:#FFFFFF;
}

.paginatorbuttonmobileR{
	display:inline-block;
	padding:10px 20px 10px 20px;
	margin-left:20px;
	/*border:#ccc 1px solid;*/
	background-color:#9e1d16;
	color:#FFFFFF;
	border-radius: 6px;
	font-weight: bold;
	font-size: 24px;
}

.paginatorbuttonmobileR:hover{
	/*border:#ccc 1px solid;*/
	background-color:#8c7c51;
	color:#FFFFFF;
}


/**************************************************************************************
**
** PROPERTY DETAIL
**
***************************************************************************************/


/*
base color: #9e1d16;
base color dark: #7c1c16;
*/

.property-price-tag-callout{
	color:#FFFFFF;
	background-color:#9e1d16;
}

.property-price-tag-amount{
	font-size:2em;
	text-align:right;
	font-family: 'Lato', sans-serif;
}

.property-title{
	font-family: 'Roboto Condensed', sans-serif;
}

.backtolist{
	background-color:#000000;
	color:#FFFFFF;
}

.verdieping{
	background-color:#FFFFFF;
	color:#333333;
	font-weight:bold;
	border-bottom:#999999 1px solid;
}


/* EPC */


.epc-gradient{

background: #2ea517; /* Old browsers */

background: -moz-linear-gradient(left,  #2ea517 0%, #ddef64 25%, #eded04 50%, #f7ad25 75%, #ff2121 100%); /* FF3.6+ */

background: -webkit-gradient(linear, left top, right top, color-stop(0%,#2ea517), color-stop(25%,#ddef64), color-stop(50%,#eded04), color-stop(75%,#f7ad25), color-stop(100%,#ff2121)); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(left,  #2ea517 0%,#ddef64 25%,#eded04 50%,#f7ad25 75%,#ff2121 100%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(left,  #2ea517 0%,#ddef64 25%,#eded04 50%,#f7ad25 75%,#ff2121 100%); /* Opera 11.10+ */

background: -ms-linear-gradient(left,  #2ea517 0%,#ddef64 25%,#eded04 50%,#f7ad25 75%,#ff2121 100%); /* IE10+ */

background: linear-gradient(to right,  #2ea517 0%,#ddef64 25%,#eded04 50%,#f7ad25 75%,#ff2121 100%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2ea517', endColorstr='#ff2121',GradientType=1 ); /* IE6-9 */

}


/**************************************************************************************
**
** SIDE BAR CATEGORIES
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/









/**************************************************************************************
**
** FOOTER
**
***************************************************************************************/

/*
base color: #9bd1c2;
base color dark: #79a397
blue dark: #13467a;
Blue dark hover: #133b67
*/

footer{
	background-color: #F0F0F0;
}

.footernav{
	background-color:#e31f18;
	color: #FFFFFF;
	padding: 40px 0px 40px 0px;
}

.footmenu{
	margin-bottom: 30px;
}

.footmenu ul{
	padding: 0;
	margin: 0;
	list-style: none;
}

.footmenu ul li ul li{
	padding-left: 15px;
}

.footmenu a{
	display: block;
	color: #13467a;
	font-weight: bold;
	/*font-size: 24px;
	line-height: 2em;*/
	transition: all 0.6s ease;
}

.footmenu a:hover{
	color: #133b67;
}

@media only screen {
	.footmenu{ text-align: center; }
}

@media only screen and (min-width: 768px) {
	.footmenu{ text-align: center; }
}

@media only screen and (min-width: 1024px) {
	.footmenu{ text-align: left; }
}

.extrafootmenu{
	margin-bottom: 30px;
}

.extrafootmenu a{
	display: block;
	font-size: 85%;
	color: #666666;
	line-height: 2em;
	/*transition: all 0.6s ease;*/
}

.extrafootmenu a:hover{
	color: #000000;
}

.footscrubber-wrapper{
	padding: 10px 0px 10px 0px;
	background-color: #13467a;
	color: #CCCCCC;
}

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/

.footscrubberstyle{
	color: #CCCCCC;
	text-align: center;
}

.footscrubberstyle p{
	color: #CCCCCC;
	text-decoration: none;
	transition: all 0.6s ease;
	font-size: 90%;
}

.footscrubberstyle a{
	color: #CCCCCC;
	text-decoration: none;
	transition: all 0.4s ease;
	font-size: 90%;
}

.footscrubberstyle a:hover{
	color: #9bd1c2;
	text-decoration: underline;
}

.foot-orange-wrapper{
	background-color: #9e1d16;
	padding: 20px 0px 20px 0px;
}

.foot-orange strong{
	color: #FFFFFF;
}

.foot-orange a{
	color: #FFFFFF;
	transition: all 0.6s ease;
}

.foot-orange a:hover{
	color: #FFFFFF;
	text-decoration: underline;
}

.goldfinger{
	background-color: #9e1d16;
	height: 4px;
}


/**************************************************************************************
**
** WOW
**
***************************************************************************************/

/* make keyframes that tell the start state and the end state of our object */
 
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
 
.fade-in {
	opacity:0;  /* make things invisible upon start */
	-webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
	-moz-animation:fadeIn ease-in 1;
	animation:fadeIn ease-in 1;
 
	-webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	-moz-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
 
	-webkit-animation-duration:1s;
	-moz-animation-duration:1s;
	animation-duration:1s;
}

.fade-in.f1 {
	-webkit-animation-delay: 0.2s;
	-moz-animation-delay: 0.2s;
	animation-delay: 0.2s;
}
.fade-in.f2 {
	-webkit-animation-delay: 0.3s;
	-moz-animation-delay: 0.3s;
	animation-delay: 0.3s;
}
.fade-in.f3 {
	-webkit-animation-delay: 0.4s;
	-moz-animation-delay: 0.4s;
	animation-delay: 0.4s;
}
.fade-in.f4 {
	-webkit-animation-delay: 0.5s;
	-moz-animation-delay: 0.5s;
	animation-delay: 0.5s;
}
.fade-in.f5 {
	-webkit-animation-delay: 0.6s;
	-moz-animation-delay: 0.6s;
	animation-delay: 0.6s;
}
.fade-in.f6 {
	-webkit-animation-delay: 0.7s;
	-moz-animation-delay: 0.7s;
	animation-delay: 0.7s;
}
.fade-in.f7 {
	-webkit-animation-delay: 0.8s;
	-moz-animation-delay: 0.8s;
	animation-delay: 0.8s;
}
.fade-in.f8 {
	-webkit-animation-delay: 0.9s;
	-moz-animation-delay: 0.9s;
	animation-delay: 0.9s;
}
.fade-in.f9 {
	-webkit-animation-delay: 1.0s;
	-moz-animation-delay: 1.0s;
	animation-delay: 1.0s;
}
.fade-in.f10 {
	-webkit-animation-delay: 1.1s;
	-moz-animation-delay: 1.1s;
	animation-delay: 1.1s;
}
.fade-in.f11 {
	-webkit-animation-delay: 1.2s;
	-moz-animation-delay: 1.2s;
	animation-delay: 1.2s;
}
.fade-in.f12 {
	-webkit-animation-delay: 1.3s;
	-moz-animation-delay: 1.3s;
	animation-delay: 1.3s;
}
.fade-in.f13 {
	-webkit-animation-delay: 1.4s;
	-moz-animation-delay: 1.4s;
	animation-delay: 1.4s;
}
.fade-in.f14 {
	-webkit-animation-delay: 1.5s;
	-moz-animation-delay: 1.5s;
	animation-delay: 1.5s;
}
.fade-in.f15 {
	-webkit-animation-delay: 1.6s;
	-moz-animation-delay: 1.6s;
	animation-delay: 1.6s;
}

/**************************************************************************************
**
** GOOGLE MAPS
**
***************************************************************************************/

#map_canvas {
	width: 100%;
	background-color: #CCC;
}

@media only screen and (min-width: 320px) {
	#map_canvas{ height:320px; }
}

@media only screen and (min-width: 480px) {
	#map_canvas{ height:360px; }
}

@media only screen and (min-width: 600px) {
	#map_canvas{ height:540px; }
}

@media only screen and (min-width: 768px) {
	#map_canvas{ height:680px; }
}

@media only screen and (min-width: 1024px) {
	#map_canvas{ height:800px; }
}

#map-canvas {
	width: 100%;
	background-color: #CCC;
}

@media only screen and (min-width: 320px) {
	#map-canvas{ height:320px; }
}

@media only screen and (min-width: 480px) {
	#map-canvas{ height:360px; }
}

@media only screen and (min-width: 600px) {
	#map-canvas{ height:540px; }
}

@media only screen and (min-width: 768px) {
	#map-canvas{ height:680px; }
}

@media only screen and (min-width: 1024px) {
	#map-canvas{ height:800px; }
}



/**************************************************************************************
**
** GALLERIA
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/

/*@media all and (orientation:portrait) {
	#galleria{
		height:50%;
	}
}*/

.galleria-wrapper{
	position: relative;
}

.projectgalleria{
	max-width: 140rem;
	margin-left: auto;
	margin-right: auto;
}

.propertygalleria{
	max-width: 140rem;
	margin-left: auto;
	margin-right: auto;

}

.galleria-thumbnails-container{
	display: none;
}

#homeslogan{
	position: absolute;
	top: 45%;
	width: 100%;
	text-align: center;
	line-height: normal;
	color: #FFFFFF;
	text-shadow: 1px 1px 4px #000;
	font-weight: 600;
	z-index: 999;
}

#homeslogan p{
	position: absolute;
	top: 45%;
	width: 100%;
	text-align: center;
	line-height: normal;
	color: #FFFFFF;
	text-shadow: 1px 1px 4px #000;
	font-weight: 600;
	z-index: 999;
}

@media only screen {
	#galleria{
		height:240px;
	}
	#homeslogan{
		font-size: 18px;
	}
	#homeslogan p{
		font-size: 18px;
	}
}

@media only screen and (min-width: 320px) {
	#galleria{
		height:240px;
	}
	#homeslogan{
		font-size: 16px;
	}
	#homeslogan p{
		font-size: 16px;
	}
}

@media only screen and (min-width: 480px) {
	#galleria{
		height:320px;
	}
	#homeslogan{
		font-size: 18px;
	}
	#homeslogan p{
		font-size: 18px;
	}
}

@media only screen and (min-width: 600px) {
	#galleria{
		height:480px;
	}
	#homeslogan{
		font-size: 20px;
	}
	#homeslogan p{
		font-size: 20px;
	}
}

@media only screen and (min-width: 768px) {
	#galleria{
		height:600px;
	}
	#homeslogan{
		font-size: 24px;
	}
	#homeslogan p{
		font-size: 24px;
	}
}

@media only screen and (min-width: 1024px) {
	#galleria{
		height: 800px;
	}
	#homeslogan{
		font-size: 32px;
	}
	#homeslogan p{
		font-size: 32px;
	}
}

@media only screen and (min-width: 1440px) {
	#galleria{
		height: 900px;
	}
	#homeslogan{
		font-size: 48px;
	}
	#homeslogan p{
		font-size: 48px;
	}
}

@media only screen and (min-width: 1680px) {
	#galleria{
		height: 1000px;
	}
	#homeslogan{
		font-size: 52px;
	}
	#homeslogan p{
		font-size: 52px;
	}
}


/**************************************************************************************
**
** HOME REGIO BLOCK
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/

.hrblock{
	background-color:#F2F2F2;
	max-width:140rem;
	margin-left:auto;
	margin-right:auto;
}

@media only screen {
	.hrblock{
		padding:30px;
	}
}

@media only screen and (min-width: 1024px) {
	.hrblock{
		padding:30px;
	}
}

@media only screen and (min-width: 1440px) {
	.hrblock{
		padding:45px;
	}
}

@media only screen and (min-width: 1920px) {
	.hrblock{
		padding:60px;
	}
}

/**************************************************************************************
**
** BIGSCREEN
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/


/*
#bigscreen{
	position:relative;
	width:100%;
	max-width:140rem;
	overflow:hidden;
	background-color:#F6F6F6;
	margin-left:auto;
	margin-right:auto;
}

.textonvideo{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 999;
	color: #FFFFFF;
	font-size: 48px;
	font-family:"Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-align: center;
}

video#bgvideo { 
	left: 50%;
    position: absolute;
    top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
	width: 100%;
	height: 100%;
}


@media only screen {
	#bigscreen{
		height:240px;
	}
}

@media only screen and (min-width: 320px) {
	#bigscreen{
		height:240px;
	}
}

@media only screen and (min-width: 480px) {
	#bigscreen{
		height:320px;
	}
}

@media only screen and (min-width: 600px) {
	#bigscreen{
		height:460px;
	}
}

@media only screen and (min-width: 768px) {
	#bigscreen{
		height:600px;
	}
}

@media only screen and (min-width: 1024px) {
	#bigscreen{
		height: 768px;
	}
}

@media only screen and (min-width: 1200px) {
	#bigscreen{
		height: 800px;
	}
}

@media only screen and (min-width: 1440px) {
	#bigscreen{
		height: 820px;
	}
}

@media only screen and (min-width: 1680px) {
	#bigscreen{
		height: 840px;
	}
}

@media only screen and (min-width: 1920px) {
	#bigscreen{
		height: 980px;
	}
}
*/


/**************************************************************************************
**
** SLICK SLIDER
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/


/* http://kenwheeler.github.io/slick/ */
/* https://codepen.io/digistate/pen/MvapbE */
/* https://css-tricks.com/fun-viewport-units/ */

.slick-slide, .slick-slide::before, .caption {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
  }
  
  .slick-slide::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
  }
  
  
  .main-slider {
	position: relative;
	max-width: 140em;
	width: 100%;
	height: 80vh;
	min-height: 200px;
	opacity: 0;
	visibility: hidden;
	transition: all 1.2s ease;
	margin-left: auto;
	margin-right: auto;
	background-color: #F2F2F2;
  }
  .main-slider.slick-initialized {
	opacity: 1;
	visibility: visible;
  }
  
  .slick-slide {
	position: relative;
	height: 80vh;
  }
  /*.slick-slide::before {
	background-color: #000;
	opacity: .3;
	z-index: 1;
  }*/
  .slick-slide video {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	-webkit-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
  }
  .slick-slide iframe {
	position: relative;
	pointer-events: none;
  }
  .slick-slide figure {
	position: relative;
	height: 100%;
  }
  .slick-slide .slide-image {
	opacity: 0;
	height: 100%;
	/*background-size: cover;*/
	background-position: center;
	background-repeat: no-repeat;
	transition: all .8s ease;
  }
  .slick-slide .slide-image.show {
	opacity: 1;
  }
  .slick-slide .image-entity {
	width: 100%;
	opacity: 0;
	visibility: hidden;
  }
  .slick-slide .loading {
	position: absolute;
	top: 44%;
	left: 0;
	width: 100%;
  }
  .slick-slide .slide-media {
	-webkit-animation: slideOut 0.4s cubic-bezier(0.4, 0.29, 0.01, 1);
			animation: slideOut 0.4s cubic-bezier(0.4, 0.29, 0.01, 1);
  }
  .slick-slide.slick-active {
	z-index: 1;
  }
  .slick-slide.slick-active .slide-media {
	-webkit-animation: slideIn 2.4s cubic-bezier(0.4, 0.29, 0.01, 1);
			animation: slideIn 2.4s cubic-bezier(0.4, 0.29, 0.01, 1);
  }
  .slick-slide.slick-active .caption {
	opacity: 1;
	-webkit-transform: translateY(0);
			transform: translateY(0);
	transition: all 0.7s cubic-bezier(0.32, 0.34, 0, 1.62) 0.6s;
  }
  
  .caption {
	position: absolute;
	width: 100%;
	text-align: center;
	top: 0px;
	left: 0px;
	text-align: center;
	line-height: 80vh;
	/*padding: 20px;
	border: 3px solid;*/
	color: #fff;
	margin: 0;
	padding: 0 30px;
	/*font-size: 24px;*/
	font-weight: bold;
	opacity: 0;
	z-index: 1;
	transition: all .3s ease;
	/*-webkit-transform: translateY(100px);
			transform: translateY(100px);*/
  }

  .caption a{
	  color: #FFFFFF;
  }

  .caption a:hover{
	color: #9e1d16;
}
  
/*
base color: #9e1d16;
base color dark: #7c1c16;
*/

	.slick-arrow{
		position: absolute;
		top: calc(50% - 30px);
		padding: 10px;
		background-color: #9e1d16;
		color: #FFF;
		line-height: 40px;
		width: 60px;
		height: 60px;
		z-index: 999;
		text-align: center;
		font-weight: bold;
		font-size: 24px;
		transition: all .3s ease;
	}

	.slick-arrow:hover{
		background-color: #8c7c51;
	}

	.slick-next{
		right: 0px;
		border-radius: 10px 0px 0px 10px;
	}

	.slick-prev{
		left: 0px;
		border-radius: 0px 10px 10px 0px;
	}




  .slick-dots {
	text-align: center;
	padding: 15px 0;
  }
  .slick-dots li {
	display: inline-block;
	vertical-align: top;
	margin: 0 8px;
  }
  .slick-dots li button {
	width: 12px;
	height: 12px;
	border: none;
	cursor: pointer;
	border-radius: 50%;
	/*border: 2px solid #000;
	box-shadow: 0 0 0 0 transparent;*/
	vertical-align: middle;
	color: #9e1d16;
	background-color: #9e1d16;
	transition: all .3s ease;
	opacity: .4;
	font-size: 1px;
  }
  .slick-dots li button:focus {
	outline: none;
  }
  .slick-dots li button:hover {
	opacity: 1;
  }
  .slick-dots li.slick-active button {
	/*border-color: #2d3042;*/
	/*box-shadow: 0 0 0 2px #000;*/
	opacity: 1;
  }


@media only screen {
	.caption{font-size: 16px;}
	.slick-arrow{display: none;}
}

@media only screen and (min-width: 40.063em) {
	.caption{font-size: 18px;}
	.slick-arrow{display: none;}
}

@media only screen and (min-width: 48.063em) {
	.caption{font-size: 20px;}
	.slick-arrow{display: none;}
}

@media only screen and (min-width: 64.063em) {
	.caption{font-size: 22px;}
	.slick-arrow{display: block;}
}

@media only screen and (min-width: 90.063em) {
	.caption{font-size: 24px;}
	.slick-arrow{display: block;}
}

@media only screen and (min-width: 120.063em) {
	.caption{font-size: 32px;}
	.slick-arrow{display: block;}
}

@media only screen and (min-width: 150.063em) {
	.caption{font-size: 40px;}
	.slick-arrow{display: block;}
}

  
  
  @-webkit-keyframes slideIn {
	from {
	  -webkit-filter: blur(15px);
			  filter: blur(15px);
	}
	to {
	  -webkit-filter: blur(0);
			  filter: blur(0);
	}
  }
  
  @keyframes slideIn {
	from {
	  -webkit-filter: blur(15px);
			  filter: blur(15px);
	}
	to {
	  -webkit-filter: blur(0);
			  filter: blur(0);
	}
  }
  @-webkit-keyframes slideOut {
	from {
	  -webkit-filter: blur(0);
			  filter: blur(0);
	}
	to {
	  -webkit-filter: blur(15px);
			  filter: blur(15px);
	}
  }
  @keyframes slideOut {
	from {
	  -webkit-filter: blur(0);
			  filter: blur(0);
	}
	to {
	  -webkit-filter: blur(15px);
			  filter: blur(15px);
	}
  }




/**************************************************************************************
**
** SOCIAL MEDIA
**
***************************************************************************************/

#social{
	margin-top:30px;
	margin-bottom:30px;
	display:block;
}
.MarkupSocialShareButtons{
    list-style-type: none;
    padding: 0;
	margin:0px;
}
.MarkupSocialShareButtons li{
    list-style-type: none;
    float: left;
    margin: 0px 20px 0px 0px;
}
.MarkupSocialShareButtons li a{
    display: inline-block;
    text-decoration: none;
    border: none;
    width: 26px;
    height: 26px;
    opacity: 0.8;
}
.MarkupSocialShareButtons li a:hover{
    opacity: 1;
}

.MarkupSocialShareButtons img{
    width: 100%;
    height: auto;
}


/**************************************************************************************
**
** BACK TO TOP
**
***************************************************************************************/

/* https://codyhouse.co/gem/back-to-top/ */

.cd-top {
  display: inline-block;
  height: 40px;
  width: 40px;
  position: fixed;
  bottom: 40px;
  right: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  /*background: rgba(232, 98, 86, 0.8) url(../gfx/cd-top-arrow.svg) no-repeat center 50%;*/
  background: rgba(19, 70, 122, 1) url(../gfx/cd-top-arrow.svg) no-repeat center 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
  z-index: 999;
}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}
.cd-top.cd-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: .5;
}
.no-touch .cd-top:hover {
  background-color: #e86256;
  opacity: 1;
}
@media only screen and (min-width: 768px) {
  .cd-top {
    right: 20px;
    bottom: 20px;
  }
}
@media only screen and (min-width: 1024px) {
  .cd-top {
    height: 60px;
    width: 60px;
    right: 30px;
    bottom: 30px;
  }
}



/**************************************************************************************
**
** YOUTUBE EMBED
**
***************************************************************************************/



@media only screen {
	.youtube-embed{ height: 270px; }
}

@media only screen and (min-width: 600px) {
	.youtube-embed{ height: 360px; }
}

@media only screen and (min-width: 800px) {
	.youtube-embed{ height: 480px; }
}

@media only screen and (min-width: 1024px) {
	.youtube-embed{ height: 600px; }
}

@media only screen and (min-width: 1440px) {
	.youtube-embed{ height: 720px; }
}

@media only screen and (min-width: 1920px) {
	.youtube-embed{ height: 800px; }
}



/**************************************************************************************
**
** COOKIE CONSENT
**
***************************************************************************************/

/*
base color: #9e1d16;
base color dark: #7c1c16;
*/

.mCCF--dark .mCCF__accept{
	background-color: #9e1d16;
	color: #FFFFFF;
	padding: 20px;
}

.mCCF--dark .mCCF__accept:hover{
	background-color: #8c7c51;
	color: #FFFFFF;
}

.mCCF{
	background-color: #000000;
	font-size: 20px;
}

.mCCF__message{
	background-color: #000000;
	line-height: 30px;
}


/**************************************************************************************
**
** AGAINST SPAMMY ANNOYING LITTLE NERDS
**
***************************************************************************************/

.tegendevervelendeventjes{
	display:none;
}



/**************************************************************************************
**
** Contact Form
**
***************************************************************************************/

#wrap_tegenvervelendeventjes{
	display: none;
}

#wrap_project{
	display: none;
}

p.InputfieldError{
	background-color: #e31f18;
	color: #FFFFFF;
	padding: 5px;
}


/**************************************************************************************
**
** KAART
**
***************************************************************************************/

.kaart{
	position:relative;
	width:100%;
	height:calc(100% - 161px);
	margin-left:auto;
	margin-right:auto;
	background-color:#F2F2F2;
}

@media all and (orientation:portrait) {
    /* Styles for Portrait screen */
	.kaart{
		height:50%;
	}
}
@media all and (orientation:landscape) {
    /* Styles for Landscape screen */
	.kaart{
		height:calc(100% - 161px);
		height: -moz-calc(100% - 161px);
    	height: -webkit-calc(100% - 161px);
	}
}



/**************************************************************************************
**
** Spacers and clear
**
***************************************************************************************/
.width90{width:90px;}

.spacer5{height:5px;}
.spacer10{height:10px;}
.spacer15{height:15px;}
.spacer20{height:20px;}
.spacer25{height:25px;}
.spacer30{height:30px;}
.spacer45{height:45px;}
.spacer60{height:60px;}
.spacer90{height:90px;}
.spacer110{height:110px;}
.spacer115{height:115px;}
.spacer120{height:120px;}
.spacer125{height:125px;}
.spacer130{height:130px;}
.spacer140{height:140px;}
.spacer145{height:145px;}
.spacer150{height:150px;}
.spacer160{height:160px;}
.spacer180{height:180px;}

.clear{clear: both;}