@font-face {
  font-family: 'Mathilde';
  src: url('/fonts/mathilde.eot'); /* IE9 Compat Modes */
  src: url('/fonts/mathilde.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/mathilde.woff') format('woff'), /* Modern Browsers */
       url('/fonts/mathilde.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('/fonts/mathilde.svg#589202c858e9ee116eab4a8685515b5e') format('svg'); /* Legacy iOS */
       
  font-style:   normal;
  font-weight:  400;
}
@font-face {
  font-family: 'Lato-regular';
  src: url('/fonts/lato-regular.eot'); /* IE9 Compat Modes */
  src: url('/fonts/lato-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/lato-regular.woff') format('woff'), /* Modern Browsers */
       url('/fonts/lato-regular.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('/fonts/lato-regular.svg#589202c858e9ee116eab4a8685515b5e') format('svg'); /* Legacy iOS */
       
  font-style:   normal;
  font-weight:  400;
}
@font-face {
  font-family: 'Lato-bold';
  src: url('/fonts/lato-bold.eot'); /* IE9 Compat Modes */
  src: url('/fonts/lato-bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/lato-bold.woff') format('woff'), /* Modern Browsers */
       url('/fonts/lato-bold.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('/fonts/lato-bold.svg#589202c858e9ee116eab4a8685515b5e') format('svg'); /* Legacy iOS */
       
  font-style:   normal;
  font-weight:  400;
}
@font-face {
  font-family: 'Lato-thin';
  src: url('/fonts/lato-thin.eot'); /* IE9 Compat Modes */
  src: url('/fonts/lato-thin.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/lato-thin.woff') format('woff'), /* Modern Browsers */
       url('/fonts/lato-thin.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('/fonts/lato-thin.svg#589202c858e9ee116eab4a8685515b5e') format('svg'); /* Legacy iOS */
       
  font-style:   normal;
  font-weight:  400;
}
/* unvisited link */
a:link {
    color: #C01A05;
    text-decoration: none;
}

/* visited link */
a:visited {
    color: #C01A05;
    text-decoration: none;
}

/* mouse over link */
a:hover {
    color: #C01A05;
    text-decoration: none;
}

/* selected link */
a:active {
    color: #C01A05;
    text-decoration: none;
}


html {
	width: 100%;
}
body {
	width: 100%;
	min-width: 320px;
	margin: 0px;
	font-family: Lato-regular; 
	font-size: 14px; 
	/*color: #000000;*/
	color: #393939;
}
.red_line {
	background-color: #C01A05;
	width: 100%;
	height: 1px;
	position: absolute;
	top:0px;
	z-index: 1000;
}
.beton {
	z-index: 1;
	width: 100%;
	height:121px;
	background-image: url(/images/header-back.jpg);
	background-repeat: repeat;
}
.menu {
	font-family: Lato-regular; 
	font-size: 16px; 
	color: #000000;
	text-decoration: none;
	font-weight: normal;
	margin-left: 30px;
}
.menu:link {
	color: #000000;
}
.menu:hover {
	color: #000000;
}
.menu:visited {
	color: #000000;
}

.menu_selected {
	font-family: Lato-regular; 
	font-size: 16px; 
	color: #C01A05;
	text-decoration: none;
	font-weight: bold;
	margin-left: 30px;
}
.menu_selected:link {
	color: #C01A05;
}
.menu_selected:hover {
	color: #C01A05;
}
.menu_selected:visited {
	color: #C01A05;
}
.red_dot {
	color: #C01A05;
}
.title {
	font-family: Lato-regular; 
	font-size: 38px; 
	color: #C01A05;
	text-decoration: none;
	font-weight: bold;
	margin-top: 30px;
	margin-bottom: 30px;	
}
.subtitle {
	font-family: Lato-thin; 
	font-size: 30px; 
	color: #494949;
	text-decoration: none;
	margin-bottom: 10px;
}

.logo_holder {
	width: 377px; 
	height: 121px;  
	display: inline-block;
}
.logo {
	margin-top: 21px; 
	margin-left: 25px;
	display: inline-block; 
	vertical-align: top;
	width: 352px;
}

.topmenu {
	width: 598px; 
	height: 111px;  
	display: inline-block;  
	vertical-align: top; 
	padding-right: 25px;
}
.topmenu_table {
	vertical-align: middle; 
	width: 598px;  
	height: 111px; 
	display: table-cell; 
	text-align: right;
}
.itopmenu {
	margin-top: 10px;
	margin-right: 20px;
	margin-left: 20px;
	height: 111px;  
	display: inline-block;  
	vertical-align: top; 
	display:none;
}
.itopmenu select {
	width:100%;
	height: 40px;
}

.slider {
	vertical-align: middle; 
	width: 628px;  
	height: 111px; 
	display: table-cell; 
	text-align: right;
}

.maintextholder  {
	width: 1000px; 
	display: inline-block; 
	margin-bottom: 25px;
}
.maintext {
	margin-right: 25px;
	margin-left: 25px;
}

.middletextholder  {
	width: 1000px; 
	display: inline-block;
	margin-top: 45px;
}

.middle_texts {
	width: 283px; 
	display: inline-block; 
	margin-left: 25px; 
	margin-right: 25px;
	margin-bottom: 10px;
	float: center;
	vertical-align: top;
}
.middle_texts img{
	border-radius: 10px;
}
.subtitle-sub {
	width: 200px;
	font-family: Lato-thin;
	font-size: 19px;
	margin-bottom: 20px;
}
.justify {
	text-align: justify;
	text-align-last: center; 
	-moz-text-align-last: center;
}

.concurrerend_wrapper {
	width: 100%;
	background-color: #ebebeb;
	padding-top: 30px;
	padding-bottom: 30px;
}
.concurrerend {
	width: 1000px;
	background-color: #ebebeb;
}
.concurrerend_title {
	font-family: 'Lato-regular';
	font-size: 35px;
    color: #C01A05;
    padding-top: 20px;
}
.concurrerend_text {
    margin-right: 25px;
    font-family: 'Lato-regular';
	font-size: 16px;
	color: #5d5c5d;
	text-align: center;
	padding-top: 20px;
}
.concurrerend_from {
	font-family: 'Lato-regular';
	font-size: 16px;
    color: #a1a1a1;
    padding-top: 0px;
}
.button-wrapper {
    width: 450px;
    overflow: hidden; /* will contain if #first is longer than #second */
    margin-top: 16px;
    margin-bottom: 16px;
}
.call-button {
	width: 200px;
	height: 50px;
	line-height: 50px;
	background-color: white;
	border-radius: 8px;
	float:left;
	font-family: 'Lato-bold';
	font-size: 20px;
	text-align: left;
	text-indent: 45px;
    color: black;
    background-image: url(/images/belons.gif);
    background-size: 30px 30px;
    background-repeat: no-repeat;
    background-position: 140px 10px;

}
.mail-button {
	width: 200px;
	height: 50px;
	line-height: 50px;
	background-color: white;
	border-radius: 8px;
	float:right;
	font-family: 'Lato-bold';
	font-size: 20px;
	text-align: left;
	text-indent: 35px;
    color: black;
    background-image: url(/images/mailons.gif);
    background-size: 30px 30px;
    background-repeat: no-repeat;
    background-position: 150px 10px;
}

.overtextholder  {
	width: 667px; 
	display: inline-block; 
	margin-bottom: 25px;
	vertical-align: top;
	text-align: left;
}
.overtext {
	margin-right: 25px;
	margin-left: 25px;
}
.foto-verhuur {
	margin-top: 3px;
	margin-bottom: 60px;
	width:500px;
}
.offerte-aanvragen {
	display: inline-block; 
	position: relative;
	margin-top: 67px;
	margin-right: 25px;
	margin-left: 25px;
	margin-bottom: 20px;
	width:283px;
	height: 200px;
	border-radius: 10px;
	border: 1px #acaead solid;
	
	vertical-align: top;
}
.offerte-aanvragen:after {
			z-index: 1;
            content: '';
            display: block;
            position: absolute;
            width: 120px;
            top: -1px;
            left: 84px;
            border: 1px solid white;
}

.no-deco {
	text-decoration: none;
}
.offerte-aanvragen a:visited{
	text-decoration: none;
}
.offerte-aanvragen-image {	
	top: -55px;
	position: relative;
	z-index: 3;
	width: 38%;
    margin: 0 auto;
    display:block;
}
.offerte-aanvragen-image img{	
    border: 0px solid white;
}
.offerte-aanvragen-titel {	
	position: relative;
	top: -50px;
	width: 100%;
    margin: 0 auto;
	color: #C01A05;
	font-weight: bold;
	font-size: 18px;
	margin-top: 10px;
	margin-bottom: 10px;
}
.offerte-aanvragen-text {	
	position: relative;
	top: -50px;
	width: 80%;
    margin: 0 auto;
	font-size: 14px;
	margin-bottom: 10px;
	color: black;
}
.offerte-aanvragen-link{	
	position: relative;
	top: -50px;
	
    margin: 0 auto;
	color: #C01A05;
	font-size: 18px;
	font-size: 14px;
}

.portfolio_holder  {
	width: 1000px; 
	display: inline-block; 
	margin-top: 25px; 
	margin-bottom: 25px;
}

.portfolio_title {
	width: 1000px; 
	display: inline-block; 
	margin-top: 5px; 
	margin-bottom: 5px;
}
.portfolio_title_sub {
	margin-left: 30px;
	width: 1000px; 
	display: inline-block; 
	margin-top: -5px; 
}
.portfolio {
	font-family: Lato-regular; 
	font-size: 38px; 
	color: #C01A05;
	text-decoration: none;
	margin-left: 25px;
	margin-right: 25px;
}


.portfolio_images {
	width: 333px; 
	display: inline-block;
	position: relative;
	vertical-align: top;
}
.portfolio_images img{
	width:270px; 
	height:203px; 
	margin-bottom: 25px; 
	border: 1px solid #f5f5f5; 
	border-radius: 10px;
}

.portfolio_hover{
    border-radius: 15px;
    z-index: 1;
    opacity: 0;
    position: absolute;
    top: 0px;
    left:31px;
}
.portfolio_hover:hover{
    opacity: 1;
}
.portfoliotextholder  {
	width: 1000px; 
	display: inline-block; 
	margin-top: 25px; 
	margin-bottom: 25px;
	text-align: left;
}
.portfoliotext {
	margin-right: 25px;
	margin-left: 25px;
}


.footer_title {
	width: 1000px;
}
.footer {
	font-family: Lato-regular; 
	font-size: 20px; 
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
	margin: 25px;
}
.linkedin-image {
	border:0;
	align="left"
	margin-left: 8px;
	margin-top: 4px;
	float: left;
}
.linkedin-image img {
	width:30px;
}
.linkedin-text {
	font-family: Lato-regular; 
	font-size: 16px; 
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
	margin-left: 6px;
	margin-top: 17px;
	float: left;
}


.footer_block {
	width: 220px; 
	height: 60px;
	display: inline-block;
	
	color: #ffffff; 
	font-size: 14px;
	vertical-align: top;
	text-decoration: none;
	
	margin-left: 12.5px;
	margin-right: 12.5px;
}


#page-tags {width: 100%; height: auto; background: #EFEFEF; padding: 10px 0; text-align: center; }
.tags
{
	background-color: #dddddd;
	display: inline-block;
	padding: 3px 7px 3px 7px;
	border-radius: 5px;
	font-size: 10px;
	margin: 3px;
	color: #777777;
}
.tags_frontpage
{
	background-color: #dddddd;
	display: inline-block;
	padding: 1px 5px 1px 5px;
	border-radius: 5px;
	font-size: 8px;
	margin: 3px;
	color: #777777;
}


input[type="text"] {
	width: 90%; 
	height: 30px; 
	margin-bottom: 20px;
	padding-left: 6px;
	font-family: Lato-regular; 
	font-size: 16px; 
}
textarea {
	width: 90%;
	padding-left: 6px;
	padding-top: 6px;
	font-family: Lato-regular; 
	font-size: 17px; 
}
input[type="submit"] {
	
	-webkit-appearance: none;
	
	background-color:#C01A05; 
	color:#FFF; border:0; 
	width: 130px; height: 40px; 
	-webkit-border-radius:8px; 
	-moz-border-radius:8px;
	font-size: 16px;
}
.titel-fomulierveld {
	color: #e5e5e5;
}


/* ********************************************************** */

/* IPAD AND TABLETS *** IPAD AND TABLETS *** IPAD AND TABLETS */

/* ********************************************************** */

@media screen and (min-width:520px) and (max-width:1000px){

	body {
		background-color: white;
	}
	.mobile-menu-icon {
		font-size: 36px;
		font-weight: bolder;
		color: #C01A05;
		float: right;
	}
	.mobile-menu-icon a{
		text-decoration: none;
		color: #C01A05;
	}
	
	.mobile-menu {
		clear: both;
		top: -20px;
		border: 1px #ccc solid;
		position: relative;
		z-index: 100;
		background-color: white;
		
		-webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.55);
		-moz-box-shadow:    0px 0px 5px 0px rgba(50, 50, 50, 0.55);
		box-shadow:         0px 0px 5px 0px rgba(50, 50, 50, 0.55);
		
		display: none;
	}
	
	.mobile-menu ul {
    margin: 0; 
    padding: 0;
    width:100%;
    list-style-type: none;
    }
    
    .mobile-menu ul li a {
	-webkit-tap-highlight-color: #C01A05;
	height: 60px;
	line-height: 60px; 
	border-bottom: 1px solid #efefef;
    text-decoration: none;
    color: #8b8b8b; 
    font-weight: bold;
    font-size: 16px;
    padding: 10.5px 11px;
    background-color: white;
    display:block;
    }
    
    
    
    .mobile-menu ul li a:visited {
    color: grey;
    }
    
    .mobile-menu ul li a:hover, .mobile-menu ul li .current {
    color: white;
    background-color: #C01A05;
    }
	.portfolio {
		font-family: Lato-regular; 
		font-size: 32px; 
		color: #C01A05;
		text-decoration: none;
		margin-left: 25px;
		margin-right: 25px;
	}
	.portfolio_title {
		width: 320px;
	}
	.itopmenu {
		height: 80px;
		display: block;
	}	
	.topmenu {
		display: none;
	}
	
	.maintextholder {
		width: 100%;
	}
	.maintext {
		padding-left: 20px;
		padding-right: 20px;
	}

	.middletextholder  {
		width: 100%; 
	}
	.middle_texts {
		width: 40%; 
	}

	.overtextholder  {
		width: 100%; 
	}
	.overtext {
		width: 92%; 
	}


	.portfolio_title {
		width: 100%; 
	}

	.topmenu {
		width: 500px;
		height: 80px;
	}
	.topmenu_table {
		width: 500px;
		height: 80px;
	}
	.slider {
		width: 500px;
	}
	.logo_holder {
		width: 500px;
		height: 90px;
		float: left;
	}
	.logo {
		width: 320px;
		margin-top: 9px;
		/* old width width: 270px; */
		height: auto;
	}
	.beton {
		z-index: 1;
		margin-top: -9px;
		width: 100%;
		height:100px;
		background-image: url(/images/header-back.jpg);
		background-repeat: repeat;
	}
	.footer_title {
		width: 100%;
	}
	.footer_block {
		height: 60px;
	}
	.footer_block_holder {
		width: 520px;
	}


	.portfolio_holder {
		width: 100%;
	}

	.portfoliotextholder {
		width: 100%;
	}
	
	.portfolio_images {
		width: 40%; 
		margin: 20px;
	}
	.portfolio_images img{
		width: 220px;
		height: 165px; 
	}	
	.portfolio_hover{
	    left:0px;
	}
	.concurrerend {
		width: 90%;
	}	
	.foto-verhuur {
		width: 100%;
	}
}

/* ********************************************************** */

/* ***  IPHONES AND GALAXIES *** IPHONES AND GALAXIES   ***   */

/* ********************************************************** */

@media screen and (max-width: 520px) {

	body {
		background-color: white;
	}
	.mobile-menu-icon {
		font-size: 26px;
		font-weight: bolder;
		color: #C01A05;
		float: right;
	}
	.mobile-menu-icon a{
		text-decoration: none;
		color: #C01A05;
	}
	
	.mobile-menu {
		clear: right;
		top: 12px;
		border: 1px #ccc solid;
		position: relative;
		z-index: 100;
		background-color: white;
		
		-webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.55);
		-moz-box-shadow:    0px 0px 5px 0px rgba(50, 50, 50, 0.55);
		box-shadow:         0px 0px 5px 0px rgba(50, 50, 50, 0.55);
		
		display: none;
	}
	
	.mobile-menu ul {
    margin: 0; 
    padding: 0;
    width:100%;
    list-style-type: none;
    }
    
    .mobile-menu ul li a {
	    -webkit-tap-highlight-color: #C01A05;
	height: 60px;
	line-height: 60px; 
	border-bottom: 1px solid #efefef;
    text-decoration: none;
    color: #8b8b8b; 
    font-weight: bold;
    font-size: 16px;
    padding: 10.5px 11px;
    background-color: white;
    display:block;
    }
   
    
    
    .mobile-menu ul li a:visited {
    color: grey;
    }
    
    .mobile-menu ul li a:hover, .mobile-menu ul li .current {
    color: white;
    background-color: #C01A05;
    }
    


	.itopmenu {
		height: 80px;
		display: block;
	}
	.topmenu {
		display: none;
	}
	
	.title {
	font-size: 26px; 
	color: #C01A05;
	text-decoration: none;
	font-weight: bold;
	margin-bottom: 30px;
	}

	.maintextholder {
		width: 320px;
	}
	.middletextholder {
		width: 320px;
	}
	.middle_texts {
		width: 270px; 

	}
	.overtextholder  {
		width: 320px;
	}
	.overtext {
		width: 270px; 
	}
		
	.portfolio_holder {
	 	width: 320px;
	}

	.portfoliotextholder {
		width: 320px;
	}
	.portfolio {
	font-family: Lato-regular; 
		font-size: 28px; 
		color: #C01A05;
		text-decoration: none;
		margin-left: 25px;
		margin-right: 25px;
	}		
	.portfolio_title {
		width: 320px;
	}

	.portfolio_images {
		width: 320px; 
	}
	.portfolio_hover{
	    left:25px;
	}

	.slider {
		width: 320px;
	}
	.logo_holder {
		width: 270px;
		height: 40px;
		float: left
	}
	.logo {
		width: 230px;
		margin-top: 9px;
		/* old width width: 270px; */
		height: auto;
	}
	.beton {
		z-index: 1;
		margin-top: -9px;
		width: 100%;
		height:80px;
		background-image: url(/images/header-back.jpg);
		background-repeat: repeat;
	}
	.footer_title {
		width: 100%;
	}
	.footer_block {
		width: 270px;
		height: 60px;
	}
	
	input[type="text"] {
	width: 100%; 
	}
	textarea {
	width: 100%;
	}
	
	input[type="submit"] {
	width: 100%; 
	height: 40px; 
	font-size: 16px;
	}
	
	.offerte-aanvragen {
		width:265px;
	}
	.concurrerend {
		width: 90%;
	}
	.button-wrapper {
	    width: 320px;
	    overflow: hidden; /* will contain if #first is longer than #second */
	    margin-top: 16px;
	    margin-bottom: 16px;
	    
	}
	.call-button {
		float: none;
		margin-bottom: 20px;
		font-family: 'Lato-bold';
		font-size: 20px;
		text-align: left;
		text-indent: 45px;
		text-decoration: none;
	    color: black;
	    background-image: url(/images/belons.gif);
	    background-size: 30px 30px;
	    background-repeat: no-repeat;
	    background-position: 140px 10px;
	    margin-bottom: 30px;
	}
	.call-button, a:link, a:visited {
    	text-decoration: none;
	}
	
	.mail-button {
		float:none;
		width: 200px;
		height: 50px;
		line-height: 50px;
		background-color: white;
		border-radius: 8px;
		font-family: 'Lato-bold';
		font-size: 20px;
		text-align: left;
		text-indent: 35px;
		text-decoration: none;
	    color: black;
	    background-image: url(/images/mailons.gif);
	    background-size: 30px 30px;
	    background-repeat: no-repeat;
	    background-position: 150px 10px;
	}
	.mail-button, a:link, a:visited {
    	text-decoration: none;
	}
	.foto-verhuur {
		width: 100%;
	}
}