/*******************************************************
*-----------------------  general -----------------------
********************************************************/
body
{
	margin: 0 0 0px; /* bottom = footer height */
}
.no_screen_mobile{
	display: block;
}
.no_mobile{
	display: none;
}
/*******************************************************
*-----------------------  header -----------------------
********************************************************/
header {
display: block;
padding: 20px 0px 0px 0px;
margin: 0px 0px 0px 0px;
background-color: rgba(255,255,255,1);
color: #232323;
}

header #logo{
	float:none;
	display: block;
	width: 100%;
	overflow:hidden;
	margin: 0px 0px 20px 0px;
	padding:  0px 0px 0px 0px;
	text-align: center;
}
/*******************************************************
*-----------------------  section -----------------------
********************************************************/

/*******************************************************
*-----------------------  footer -----------------------
********************************************************/
footer{
	position: relative;
	height: auto;
}
footer section{
	float:none;
	display: block;
	width: 100%;
	overflow:hidden;
	margin: 0px 0px 20px 0px;
	padding:  0px 0px 0px 0px;
}
footer section h3,
.address_data{
	float:none;
	display: block;
	width: 100%;
	overflow:hidden;
	margin: 0px 0px 0px 0px;
	padding:  0px 0px 0px 0px;
	line-height: 1.8em;
}
.address_data p{
	line-height: 1.8em;
	margin: 0px 0px 0px 0px;
}
footer section.footer_right h3,
.footer_right .address_data{
	float: right;
	text-align: left;}
.address_data{
	margin-right: 0;
	width: 100%;
	color: rgba(255,255,255,0.6);
	}
.footer_right .address_data{
	width: 100%;
}

.toonzaal_title{display: none;}

.toonzaal_title_mb{display: block;}

/*******************************************************
*----------------------- navigatie---------------------
********************************************************/
nav.mainnav{display: none;}
/*******************************************************
*----------------------- main nav ---------------------
********************************************************/

.mainnav{
	display: none;
}
.mobilenav{
	display: block;
}

ul#mobilenav{
	text-align: center;
	display: none;
}

ul#mobilenav li,
ul#nav_mobile li{
	text-align: center;
}
ul#mobilenav li a,
ul#nav_mobile li a,
ul#nav_mobile li#contact_mobile{
   display: block;
	width: 100%;
	margin: 0px 0px 0px 0px;
	padding:  15px 0px 15px 0px;
	font-size: 14px;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: normal;
	background-color: rgba(197, 69, 69, 0.95);
	margin-top: 1px;
	color: white;
	letter-spacing: 0.05em;
}
ul#nav_mobile li#menu_button > a{margin: 0px; background-color: #c54545; color: white;}
ul#nav_mobile li#contact_mobile{
	background-color: #232323;
	line-height: 1.2em;
	font-size: 12px;
	padding:  10px 0px 10px 0px;
	text-transform: none;
	background-image: url(https://www.parketeycken.be/images/interface/phone.png);
	background-position: 15% center;
	background-repeat: no-repeat;
}
ul#mobilenav li a:hover,
ul#nav_mobile li a:hover{
	background-color: rgba(197, 69, 69, 1);
}
ul#nav_mobile li#contact_mobile a{
	padding:  0px 0px 0px 0px;
	background-color: transparent;
	font-size: 12px;
}
/*******************************************************
*-----------------------  content -----------------------
********************************************************/
/******* Home ********/
.home_info{
	display: block;
	width: 100%;
	height: auto;
	overflow:hidden;
	position: relative;
	left: auto;
	top: auto;
	color: white;
	font-size: 18px;
	letter-spacing: 0.05em;
	margin: 30px 0px 50px 0px;
}
.home_generaties{
	background-color: rgba(35, 35, 35, 0.8);
	padding: 20px 10px 40px 10px;
	width: 90%;
	width:    -moz-calc(90% - 20px);
	width: -webkit-calc(90% - 20px);
	width:      -o-calc(90% - 20px);
	width:         calc(90% - 20px);
}
.home_generaties h3{
	font-size: 16px;
}
.home_generaties h1{
	font-size: 18px;
	text-align: center;
		font-weight: 300;
}
.home_occ{
	background-color: #c54545;
	margin: -30px 0px 0px 0px;
	width: 60%;
	width:    -moz-calc(60% - 20px);
	width: -webkit-calc(60% - 20px);
	width:      -o-calc(60% - 20px);
	width:         calc(60% - 20px);
	text-align: center;
	font-weight: 300;
	padding: 20px 10px 20px 10px;
	margin-left: 40%;
}
.home_occ h2{
	font-size: 17px;
	margin-bottom: 15px;
}

.home_occ h3{
	font-weight: 300;
	font-style: italic;
	font-size: 12px;
}

/******* ons-verhaal *********/
.verhaal_left{
	float:none;
	width: 96%;
	margin: 30px 2% 0px 2%;
	padding:  0px 0px 0px 0px;
}
.verhaal_right{
	width: 96%;
	margin: 0px 2% 0px 2%;
}

.verhaal_left h1{
	width:100%;
	width:    -moz-calc(100% - 40px);
	width: -webkit-calc(100% - 40px);
	width:      -o-calc(100% - 40px);
	width:         calc(100% - 40px);
}
.generatie h2{
	margin: 25px 0px 0px 0px;
		font-size: 18px;
}

.oo_verhaal_container{
margin: 0px 0px 0px 0px;
}


.oo_verhaal_tekst{
	font-size: 14px;
	padding:  20px;
	text-align: left;

}


.oo_verhaal_tekst p{
	margin: 0px 0px 20px 0px;
	line-height: 1.4em;
	letter-spacing: 0.05em;
}

.oo_verhaal_pic_info{
	text-align: right;
	font-style: italic;
	font-size: 13px;
	margin: 15px 0px 15px 0px;
}


/******* vakamanschap ******/

div.vakmanschap_item{
	display: block;
	width: 96%;
	margin: 45px 2% 0px 2%;
}


	div.vakmanschap_content.twee,
	div.vakmanschap_content.vier{
		background-color: rgba(197, 69, 69, 0.8);
	}
	div.vakmanschap_content.drie{
	background-color: rgba(35, 35, 35, 0.80);
	}

/********** realisatie detail **********/
.verhaal_right.realisatie{
	margin: 20px 0px 0px 0px;
	width: 100%;
}
.realisatie_info{
	background-color: rgba(197, 69, 69, 0.8);
	font-size: 14px;
	padding:  40px 10% 40px 10%;
	margin: 0px 2% 0px 2%;
	color: white;
	display: block;
}

.contact_container{
	padding: 0px 2%;
}

.contact_left{
	float:none;
	display: block;
	width: 100%;
	overflow:hidden;
	margin: 0px 0px 20px 0px;
	padding:  0px 0px 0px 0px;
}

.contact_left.contact_right{
	width: 100%;
}
.contact_left.contact_right, .contact_info.contact_toonzaal{
	margin: 0;
}
.contact_info.contact_toonzaal .contact_container{
	margin: 0;
}

.contact_info .contact_container{
	margin: 30px 0px 0px 0;
}