
body {
	margin:  0;
	padding: 0;
}




img{
	border: none;
}
img.right {
	float: right;
	margin: 0;
}

.color-1 { color: #E53328; }
.color-2 { color: #000000; }
.color-3 { color: #6BB7C9; }
.color-4 { color: #F39030; }
.color-5 { color: #FAC61B; }

.bg-color-1,
.BG_Ontzorgt,
.BG_Webshops  {
	background-color: #E53328;
}

.bg-color-2,
.BG_Design {
	background-color: #000000;
}

.bg-color-3,
.BG_ICT {
	background-color: #6BB7C9;
}

.bg-color-4,
.BG_Webdesign {
	background-color: #F39030;
}

.bg-color-5,
.BG_Hosting {
	background-color: #FAC61B;
}

.bg-color-6,
.BG_SEO {
	background-color: #8E949A;
}

.bg-color-7,
.BG_Drukwerk {
	background-color: #D4DE7C;
}

.bg-color-8,
.BG_Portfolio {
	background-color: #F5F5F5;
}

.bg-color-9 {
	background-color: #FFF;
}

.bg-color-joppe {
	background-color: #8FC7E8;
}

.bg-color-10,
.BG_Domeinnamen {
	background-color: #B5E8F5;
}

#MijnInfoBlok {
	background-color: #FAC61B;
	background-color: #F5F5F5;
}


.Ontzorgt,
.Design,
.ICT,
.Webdesign,
.SEO,
.Drukwerk,
.Webshops,
.Hosting {
	text-align: center;
	padding-bottom: 2.5%;
}

.Ontzorgt h2, .Design h2, .ICT h2, .Webdesign h2 {
	color: #FFF;
}

.ShowNextOnClick{
	cursor: pointer;
}
.ShowNextOnClick+*{
	display: none;
}

.PageWidth {
	margin: 0 auto;
}

.Relative{ position: relative; } /* niet aanpassen */

.h1:before{
	content: "";
	display: block;
	padding-top: 100%; /* initial ratio of 1:1*/
	float:left;
}

.fa-send {
	margin-right: 0.5em;
}


/* @group Header and content */
#Wrapper {}

#MainHeader{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background: #FFF;
	z-index: 1100;
	border-bottom: 1px solid #DDD;
}

#MainHeader >div{
	position: relative;
	height: 80px;
}
#Logo{
	display: block;
	background: url('/images/logo-lab35-aalsmeernu-width.svg') no-repeat left center;
	background-size: contain;
	box-sizing: border-box;
	border: 1px solid #FFF;
	border-width: 10px; /* Padding simulatie */
	height: 80px;
	max-height: 100%;
	width: 75%;
	max-width: 300px;
}
	
nav {
	text-align: right;
}

#Head_MultilineWrap{
	margin-bottom: 0;
}

#Head_Contactline, #Head_SearchLanguage, #Head_Navwrap{
	line-height: 40px;
	text-align: right;
	margin-bottom: 0px;
	width: 100%;
}

#Head_Navwrap{
	margin-top: 10px;
}

#mainnav .Highlight >a{
	color: #E53328;
}


/* @end */
/* ----------------------------------------------------------------------------- */
/* @group Homepage */
#USPs{
	margin-bottom: 100px;
	padding-top: 100px;
}
.USP_One{
	display: inline-block;
	text-align: center;
/* 	height: 100%; */
	width:  100%;
	text-decoration: none;
	transform:  scale(0);
	transition: all 1.5s;
}
.doc_ready .USP_One{
	transform: scale(1);
}
#USPs >div:nth-child(1) .USP_One{  transition-delay: 0.1s;}
#USPs >div:nth-child(2) .USP_One{  transition-delay: 0.3s;}
#USPs >div:nth-child(3) .USP_One{  transition-delay: 0.5s;}
#USPs >div:nth-child(4) .USP_One{  transition-delay: 0.7s;}

.USP_One h2{
	color: #FFF;
	font-size: 2.6em;	
}
.USP_One img{
	max-width: 80% !important; /* Overwrite die van responsive grid */
	transition: transform 0.5s;
}
.USP_One:hover img{
	transform: scaleX(-1);
}

#HomepageIntro {
	vertical-align: top;	
	padding: 120px 0 60px;
}

/* @end */

#PortfolioHome {
	background-color: #F6F6F6;
	vertical-align: top;	
	padding: 50px 0;
}

.PFH_Header {
	width: 94%;
	height: 120px;
	max-height: 120px;
	margin: -5% 0 0;
	padding: 2% 2% 2% 4%;
	background-color: #3B3B3B;
	vertical-align: top;
	position: relative;
	z-index: 10;
}

.PFH_Header h2 {
	color: #FFF;
    font-family: 'klinic_slablight';
	font-size: 2em;
	text-transform: uppercase;
	line-height: 1.5em;
	text-decoration: none;
	margin: 0;
	padding: 0;
}

.PFH_Header p {
	color: #FFF;
    font-family: 'klinic_slablight';
	font-size: 1.8em;
	line-height: 1.1em;
	margin: 0;
	padding: 0;
}

.PFH_Bekijk {
	color: #999 !important;
	text-transform: uppercase;
  	font-family: "proxima-nova", sans-serif !important;
	font-size:1.2em !important;
	line-height: normal;
	text-decoration: none;
	font-weight: 400;
	font-style: normal !important;
	margin-top: 10% !important;
}

.PFH {
	text-decoration: none;
	transition: all 0.5s;
}

.PFH_Bubbels {
	display: block;
	max-width: 100%;
}


#PFH_Wrap{
	margin-bottom: 44px;
}
#PFH_Wrap:hover .PFH{
	opacity: 0.6;
	transform: scale(0.9);
}
#PFH_Wrap:hover .PFH:hover{
	opacity: 1;
	transform: scale(1.05);
	box-shadow: 1px 1px 8px 3px #BBB;
}

.PFH a {
	text-decoration: none;
}


.PFH_MoreWork {
	vertical-align: top;
	display: inline-block;
	width: 150px;
	height: 150px;
	margin: 7.5% 0 0;
	padding: 0;
    border-radius: 75px;
    background-color: #DDD;
    font-family: 'klinic_slablight';
	font-size: 15em;
	line-height: 0.80em;
	text-align: center;
    color: #666;
    text-decoration: none;
}

.PFH_MoreWork:hover {
    background-color: transparent;
    color: #333;
}

/* @group SponsoringHome */

#SponsoringHome {
	vertical-align: top;	
	padding: 60px 0;

	text-align: center !important;
}

#SponsoringHome >a{
	transition: all 0.5s;
}
#SponsoringHome >a:hover{
	transform: scale(1.5);
}

/* @end */





/* @group StoringHome */

#StoringHome {
	vertical-align: top;	
	padding: 20px 0;
	margin-bottom: 0;
	text-align: center !important;
	background-color: #E53328;
	margin-top: 50px;
}

#StoringHome h2 {
	font-size: 30px !important;
	color: #FFF !important;
}

#StoringHome p {
	font-size: 18px !important;
	color: #FFF !important;
}

/* @end */

/* ----------------------------------------------------------------------------- */
/* @group DienstenPagina */

#Dienstenwrap, #DW_List{
	position: relative;
}

#DienstenWrapHeader {
	height: auto;
	padding-top: 2.5%;
	padding-bottom: 2.5%;
	font-size: 150%;
	text-align: center;
	margin: 0 0 5%;
	background: url(/images/lab35-bubbles-line-devider.svg) no-repeat center bottom;
	background-size: 60px 30px;
}

.Dienst_One{
	text-decoration: none;
	transition: all 1.5s;
	opacity: 0;
	transform-origin: right center; 
}
.Dienst_One:nth-child(2n){
	transform: translateY( 100% );
}
.Dienst_One:nth-child(2n-1){
	transform: translateY( 100% );
}
.doc_ready .Dienst_One{
	transform: translateY(    0% );
	opacity: 1;
}

#DW_List .Dienst_One:nth-child(1){ transition-delay: 0.1s;}
#DW_List .Dienst_One:nth-child(2){ transition-delay: 0.1s;}
#DW_List .Dienst_One:nth-child(3){ transition-delay: 0.3s;}
#DW_List .Dienst_One:nth-child(4){ transition-delay: 0.3s;}
#DW_List .Dienst_One:nth-child(5){ transition-delay: 0.5s;}
#DW_List .Dienst_One:nth-child(6){ transition-delay: 0.5s;}
#DW_List .Dienst_One:nth-child(7){ transition-delay: 0.7s;}
#DW_List .Dienst_One:nth-child(8){ transition-delay: 0.7s;}


/* @end */
/* ----------------------------------------------------------------------------- */
/* @group Footer */

#MainFooter{
	background-color: #000;
}

#footer {
	min-height: 270px;
	margin: 0px;
	padding: 60px 0 30px;
	text-align: center;
	color: #FFF;
}

#footer h3 {
	color: #FFF;
	text-decoration: none;
	margin-bottom: 10px;
}

#footer p,
#footer li {
	color: #FFF;
	text-decoration: none;
}

#footer a,
#footer a:link,
#footer a:visited,
#footer a:active {
	color: #F39030;
	text-decoration: none;	
}

#footer li{
	font-size: 1em;
	list-style: none;
}
#footer li ul{
	display: none;
}

#Quickhelp {
	color: #FFF !important;
}

#Quickhelp a {
	padding: 0 .5%;
	text-decoration: none;
}

#Quickhelp a,
#Quickhelp a:visited {
	color: #FFF;
}

#Quickhelp a:link,
#Quickhelp a:active {
	color: #EEE;
}

#Quickhelp a:hover {
	color: #CCC;
}

#FooterAnchors {
	background-color: #FFF;
	color: #999;
}

#FooterAnchors p {
	font-size: 1.4em;
}

#FooterAnchors a {
	padding: 0 .5%;
	text-decoration: none;
}

#FooterAnchors a,
#FooterAnchors a:visited {
	color: #999;
}

#FooterAnchors a:link,
#FooterAnchors a:active {
	color: #666;
}

#FooterAnchors a:hover {
	color: #F00;
}

#FooterAnchors .SocialMedia {
	text-align: center;
}

.OpeningstijdenDag {
	display: inline-block;
	width: 35%;
}
.OpeningstijdenTijd {
	width: 65%;
}

/* @end */


#Content {
	padding: 80px 0 60px;
	margin-bottom: 0px;
}

.ContentTools {
	padding-top: 40px;
}

#MijnInfoBlok {
	padding: 20px;
	border-radius: 10px;
}


#PageBanner {
	background-color: #EEE;
	height: auto;
	padding-top: 4%;
	padding-bottom: 4%;
	text-align: center;
	margin: 0 0 2.5%;
}

#PageBanner p {
	font-size: 250%;
	max-width: 1000px;
	margin: 0 auto;
}

#ContentPortfolioOverview {
	padding-top: 40px;
}

#PortfolioFooter {
	background-color: #FEFEFE;
	border-top: 1px solid #DDD;
	padding-top: 2.5%;
	padding-bottom: .5%;
	text-align: center;
}

#PortfolioFooter a{
	text-decoration: none;
	color: #000;
}

#PortfolioFooter #Prev a,
#PortfolioFooter #Next a{
	color: #CCC;
	
}

#PortfolioFooter #Prev a:hover,
#PortfolioFooter #Next a:hover{
	color: #BBB;
	
}



#Contact {
	vertical-align: top;	
	padding: 50px 0;
}

#ContactContent {
	padding-top: 40px;
}

#GoogleMap,
#ShowOffice {
	height: 525px;
	margin: 0;
	padding: 0;
}

#GoogleMap iframe {
	width: 100%;
	height: 525px;
	margin: 0;
	padding: 0;
	border: 0;
}

#ShowOffice {
	background: #3B3B3B url('/images/logo-erkend-leerbedrijf-contact.svg') no-repeat center center;
}

#Koffie,
#Thee,
#Espresso,
#GroeneThee,
#Water {
	margin: 0;
}

#Koffie {
	background: #E53328 url('/images/bedankt/koffie.svg') no-repeat center center;
    background-size: 150px 150px;
}

#Thee {
	background: #6BB7C9 url('/images/bedankt/thee.svg') no-repeat center center;
    background-size: 150px 150px;
}

#Espresso {
	background: #3B3B3B url('/images/bedankt/espresso.svg') no-repeat center center;
    background-size: 150px 150px;
}

#GroeneThee {
	background: #3B3B3B url('/images/bedankt/groene-thee.svg') no-repeat center center;
    background-size: 150px 150px;
}

#Water {
	background: #F39030 url('/images/bedankt/glas-water.svg') no-repeat center center;
    background-size: 150px 150px;
}



/* ----------------------------------------------------------------------------- */
#sitemapTree {
	font-size: 1.5em;
	list-style-type: none !important;
	padding: 0 0 0 10px;
}

#sitemapTree ul,
#sitemapTree ul li,
#sitemapTree ul li ul,
#sitemapTree ul li ul li {
	list-style-type: none !important;
	list-style-position: inside;
	font-size: 100%;
	line-height: inherit;
	font-weight: inherit;
	margin: 0;
	padding: 0 0 0 10px;
}

/* -------------- */
/*	DEVICES       */
/* -------------- */
@media screen and (max-width: 767px){
	table {
		width: 100%; 
	}

	#USPs{
		margin-bottom: 5%;
		padding-top: 5%;
	}
	.USP_One h2{
		font-size: 2em;	
	}
	#PageBanner  {
		padding-top: 8%;
	}
	#PageBanner h1 {
		font-size: 1.8em;
	}
	#PageBanner p {
		font-size: 160%;
	}

	#DienstenWrapHeader {
		font-size: 100%;
	}
	#GoogleMap,
	#ShowOffice {
		height: 360px !important;
	}
	#GoogleMap iframe {
		width: 100%;
		height: 360px;
		overflow: hidden;
	}
	#footer {
		text-align: left;
	}
	#footer .SocialMedia{
		text-align: center !important;
	}
	#FooterAnchors {
		text-align: center;
		padding: 20px;
	}
	#FooterAnchors img {
		padding: 20px 0;
	}
}

@media screen and (min-width: 768px){
	
	#GoogleMap,
	#ShowOffice {
		height: 360px;
		margin: 0;
		padding: 0;
	}
	#GoogleMap iframe {
		width: 100%;
		height: 360px;
		overflow: hidden;
	}
	#Koffie,
	#Thee,
	#Espresso,
	#GroeneThee,
	#Water {
		height: 200px !important;
	}
	#footer {
		text-align: left !important;
	}

	#FooterAnchors {
		padding: 20px 0 0px;
	}

	#FooterAnchors .SocialMedia{
		text-align: right !important;
	}
}
@media screen and (min-width: 1025px){
		table {
		width: 50%; 
	}

	#GoogleMap,
	#ShowOffice {
		height: 525px;
		margin: 0;
		padding: 0;
	}
	
	#GoogleMap iframe {
		width: 100%;
		height: 525px;
		margin: 0;
		padding: 0;
		border: 0;
	}

	#Koffie,
	#Thee,
	#Espresso,
	#GroeneThee,
	#Water {
		height: 330px !important;
		margin: 0;
	}

}