body,
html{
    margin: 0;
    padding: 0;
	height: 100%;
}

.menubar{
	
	position: absolute;
	top: 100%;
	left: 0px;
	width: 100%;
	height: 70px;
	background-color: #fff;
	box-shadow: 0px 3px 8px 1px #ddd;
	overflow: hidden;
	
}

.menu{
	
	position: absolute;
	width: 130px;
	height: 43px;
	top: 0px;
	color: #444;
	text-align: center;
	padding-top: 27px;
	text-transform: uppercase;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 13px;
	letter-spacing: .25em;
	cursor: pointer;
	
}

.menu-home{
	
	left: calc(50% - 455px);
	
}

.menu-portfolio{
	
	left: calc(50% - 325px);
	
}

.menu-diensten{
	
	left: calc(50% - 195px);
	
}

.menu-overMEI{
	
	left: calc(50% - 65px);
	
}

.menu-klanten{
	
	left: calc(50% + 65px);
	
}

.menu-blog{
	
	left: calc(50% + 195px);
	
}

.menu-contact{
	
	left: calc(50% + 325px);
	
}

.nc:hover{
	
	background-color: #ebebeb;
	
}

.current{
	
	background-color: #ddd;
	
}

.header{
	
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	overflow: hidden;
	
}

.header1{
	
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: url(img/header/Header_1.jpg) no-repeat center top fixed; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	transition: left 1s;
	animation-name: header1;
	animation-duration: 20s;
	animation-iteration-count:infinite;
	
}
.header2{
	
	position: absolute;
	top: 0px;
	left: 100%;
	width: 100%;
	height: 100%;
	background: url(img/header/Header_2.jpg) no-repeat center top fixed; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	transition: left 1s;
	animation-name: header2;
	animation-duration: 20s;
	animation-iteration-count:infinite;
	
}

.header3{
	
	position: absolute;
	top: 0px;
	left: 200%;
	width: 100%;
	height: 100%;
	background: url(img/header/Header_3.jpg) no-repeat center top fixed; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	transition: left 1s;
	animation-name: header3;
	animation-duration: 20s;
	animation-iteration-count:infinite;
	
}

.down{
	
	position: fixed;
	bottom: 10px;
	left: calc(50% - 40px);
	width: 80px;
	height: 80px;
	animation-name: updown;
    animation-duration: 4s;
	animation-iteration-count: infinite;
	transition: 1s;
	
}

.down:hover{
	
	opacity: 0.8;
	width: 100px;
	height: 100px;
	left: calc(50% - 50px);
}

.portfolio{
	
	position: absolute;
	top: 100%;
	left: 0px;
	width: 100%;
	height: 2270px;
	background-color: #eee;
	overflow: hidden;
	
}

.portfolio-title{
	
	position: absolute;
	top: 100px;
	left: 0px;
	width: 100%;
	height: 60px;
	color: #555;
	text-align: center;
	padding-top: 40px;
	text-transform: uppercase;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 20px;
	letter-spacing: .25em;
	
}

.portfolio-holder{
	
	position: absolute;
	left: calc(50% - 537px);
	top: 240px;
	width: 1073px;
	height: 1960px;
	overflow: hidden;

}

.portfolio-item{
	
	position: absolute;
	width: 310px;
	height: 220px;
	border: 1px solid #fff;
	opacity: 1;
	transition: opacity 0.5s, top 0.5s;
	
}

.portfolio-item:hover{
	
	opacity: 0.7;
	
}

.p1{
	
	left: 0px;
	top: 1000px;
	background: url(img/portfolio/Topas/Topas_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p2{
	
	left: 380px;
	top: 1000px;
	background: url(img/portfolio/Action_geurblik/Action_geurblik_4.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p3{
	
	left: 760px;
	top: 1000px;
	background: url(img/portfolio/Showtijd/Showtijd_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p4{
	
	left: 0px;
	top: 1290px; 
	background: url(img/portfolio/Mediata/Mediata_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p5{
	
	left: 380px;
	top: 1290px;
	background: url(img/portfolio/Stell_anlage/Stell_anlage_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p6{
	
	left: 760px;
	top: 1290px;  
	background: url(img/portfolio/Kaemink-Geurlijn1/Kaemingk_geurlijn_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p7{
	
	left: 0px;
	top: 1580px; 
	background: url(img/portfolio/Action-Geurkaarsen/MEI_Action_geurkaarsen_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p8{
	
	left: 380px;
	top: 1580px;
	background: url(img/portfolio/Albrand-DAN/Albrand_Brochure_DAN_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p9{
	
	left: 760px;
	top: 1580px;
	background: url(img/portfolio/Action-Notebooks/MEI_Action_notebooks_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p10{
	
	left: 0px;
	top: 1870px; 
	background: url(img/portfolio/Action-XXL/MEI_Action_XXL_notebooks_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p11{
	
	left: 380px;
	top: 1870px;
	background: url(img/portfolio/Kaemink-Kerstverpakking/MEI_Kaemingk_kerstverpakking_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p12{
	
	left: 760px;
	top: 1870px;
	background: url(img/portfolio/Kaemink-Uitnodiging/Kaemingk_uitnodiging_2.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p13{
	
	left: 0px;
	top: 2160px; 
	background: url(img/portfolio/Albrand-Corporate/MEI_Albrand_corporate_brochure_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p14{
	
	left: 380px;
	top: 2160px;
	background: url(img/portfolio/Stell_magazine/MEI_Stell_Magazine_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p15{
	
	left: 760px;
	top: 2160px;
	background: url(img/portfolio/Pontilex/MEI_PontiLex_logo_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p16{
	
	left: 0px;
	top: 2450px; 
	background: url(img/portfolio/Stell_brochure/MEI_Stell_brochure_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p17{
	
	left: 380px;
	top: 2450px;
	background: url(img/portfolio/Stell_mailing/MEI_Stell_Mailing_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p18{
	
	left: 760px;
	top: 2450px;
	background: url(img/portfolio/Action-Matras/Action_matras_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p19{
	
	left: 0px;
	top: 2740px; 
	background: url(img/portfolio/PPAV/MEI_PPAV_huisstijl_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	
}

.p20{
	
	left: 380px;
	top: 2740px;
	background: url(img/portfolio/Albrand-Beurs/MEI_Albrand_VSK_beurs_1.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
}

.diensten{
	
	position: absolute;
	top: calc(100% + 2270px);
	width: 100%;
	height: 385px;
	background-color: #97B5A9;
	overflow: hidden;
	
}

.diensten-title{
	
	position: absolute;
	top: 20px;
	left: 0px;
	width: 100%;
	height: 60px;
	color: #fff;
	text-align: center;
	padding-top: 40px;
	text-transform: uppercase;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 20px;
	letter-spacing: .25em;
	
}

.diensten-sub-title{
	
	position: absolute;
	top: 100px;
	left: 0px;
	width: 200px;
	height: 23px;
	color: #fff;
	text-align: center;
	padding-top: 27px;
	text-transform: uppercase;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 13px;
	letter-spacing: .25em;
	
}

.diensten-sub-content{
	
	position: absolute;
	top: 135px;
	left: 0px;
	width: 200px;
	height: 23px;
	color: #fff;
	text-align: center;
	padding-top: 27px;
	font-family: 'Lato', sans-serif;
    font-weight: 100;
	font-size: 15px;
	
}

.print{
	
	position: absolute;
	top: 85px;
	left: calc(50% - 400px);
	width: 200px;
	height: 300px;
	
}

.print-icon{
	
	position: absolute;
	top: 60px;
	left: 75px;
	width: 50px;
	height: 50px;
	background: url(img/icons/rsz_print.png) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	
}

.verpakkingen{
	
	position: absolute;
	top: 85px;
	left: calc(50% - 200px);
	width: 200px;
	height: 300px;
	
}

.verpakkingen-icon{
	
	position: absolute;
	top: 60px;
	left: 75px;
	width: 50px;
	height: 50px;
	background: url(img/icons/rsz_verpakking.png) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	
}

.online{
	
	position: absolute;
	top: 85px;
	left: 50%;
	width: 200px;
	height: 300px;
	
}

.online-icon{
	
	position: absolute;
	top: 60px;
	left: 75px;
	width: 50px;
	height: 50px;
	background: url(img/icons/rsz_1online.png) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	
}

.events{
	
	position: absolute;
	top: 85px;
	left: calc(50% + 200px);
	width: 200px;
	height: 300px;
	
}

.events-icon{
	
	position: absolute;
	top: 60px;
	left: 75px;
	width: 50px;
	height: 50px;
	background: url(img/icons/rsz_events2.png) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	
}

.overMEI{
	
	position: absolute;
	top: calc(100% + 2655px);
	left: 0px;
	width: 100%;
	height: 1000px;
	background-color: #eee;
	overflow: hidden;
	
}

.overMEI-title{
	
	position: absolute;
	top: 20px;
	left: 0px;
	width: 100%;
	height: 60px;
	color: #555;
	text-align: center;
	padding-top: 40px;
	text-transform: uppercase;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 20px;
	letter-spacing: .25em;
	
}

.overMEI-content{
	
	position: absolute;
	top: 135px;
	left: calc(50% - 400px);
	width: 800px;
	height: 465px;
	color: #555;
	text-align: left;
	padding-top: 27px;
	font-family: 'Lato', sans-serif;
    font-weight: 100;
	font-size: 15px;
	
}

.handtekening{
	
	position: absolute;
	top: 600px;
	left: calc(50% - 400px);
	width: 400px;
	height: 283px;
	background: url(img/handtekening/sabine_handtekening.png) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	
}

.overMEI-naam{
	
	position: absolute;
	top: 870px;
	left: calc(50% - 400px);
	width: 800px;
	height: 30px;
	color: #555;
	text-align: left;
	padding-top: 27px;
	font-family: 'Lato', sans-serif;
    font-weight: 100;
	font-size: 17px;
	
}

.overMEI-email{
	
	position: absolute;
	top: 890px;
	left: calc(50% - 400px);
	width: 800px;
	height: 30px;
	color: #555;
	text-align: left;
	padding-top: 27px;
	font-family: 'Lato', sans-serif;
    font-weight: 100;
	font-size: 17px;
	
}



.link-mei{
	
	color: #555;
	font-family: 'Lato', sans-serif;
    font-weight: 100;
	font-size: 13px;
	
}

.link-mei:focus{
	
	color: #555;
	
}

.link-mei:active{
	
	color: #555;
	
}

.link-mei:hover{
	
	color: #97B5A9;
	
}

.klanten{
	
	position: absolute;
	top: calc(100% + 3655px);
	width: 100%;
	height: 285px;
	background-color: #97B5A9;
	
}

.klanten-title{
	
	position: absolute;
	top: 20px;
	left: 0px;
	width: 100%;
	height: 60px;
	color: #fff;
	text-align: center;
	padding-top: 40px;
	text-transform: uppercase;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 20px;
	letter-spacing: .25em;
	
}

.klanten-holder{
	
	position: absolute;
	left: calc(50% - 535px);
	top: 130px;
	width: calc(50% + 535px);
	max-width: 1070px;
	height: 100px;
	overflow: hidden;
	
}

.klanten-move{
	
	position: absolute;
	left: 0px;
	top: 0px;
	width: 5350px;
	height: 100px;
	overflow: hidden;
	transition: left 0.5s;
	
}

.klant{
	
	position: absolute;
	top: 0px;
	width: 1070px;
	height: 100px;
	overflow: hidden;
	
}

.k1{
	
	left: 0px;
	background: url(img/klanten/Action-Albrand/Action_Albrand.png) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	
}

.k2{
	
	left: 1070px;
	background: url(img/klanten/ARC-Kaemink/ARC_Kaemingk.png) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	
}

.k3{
	
	left: 2140px;
	background: url(img/klanten/Jadis-Konimpex/Jadis_Konimpex.png) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	
}

.k4{
	
	left: 3210px;
	background: url(img/klanten/Stell-Pontilex/Stell_Pontilex.png) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	
}

.k5{
	
	left: 4280px;
	background: url(img/klanten/PPAV-IJzersterk/PPAV_IJzersterk.png) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	
}

.klanten-links{
	
	position: absolute;
	top: 150px;
	left: 50px;
	width: 50px;
	height: 50px;
	background: url(img/svg/left.svg) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	
}

.klanten-rechts{
	
	position: absolute;
	top: 150px;
	right: 50px;
	width: 50px;
	height: 50px;
	background: url(img/svg/right.svg) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	
}

.blog{
	
	position: absolute;
	top: calc(100% + 3940px);
	left: 0px;
	width: 100%;
	height: 500px;
	background-color: #eee;
	overflow: hidden;
	
	
}

.blog-holder{
	
	position: absolute;
	top: 150px;
	width: 500px;
	height: 100px;
	cursor: pointer;
	
}

.b1{
	
	left: calc(50% - 500px);
	
}

.b2{
	
	left: 50%;
	
}

.blog-title{
	
	position: absolute;
	top: 20px;
	left: 0px;
	width: 100%;
	height: 60px;
	color: #555;
	text-align: center;
	padding-top: 40px;
	text-transform: uppercase;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 20px;
	letter-spacing: .25em;
	
}

.blog-sub-title{
	
	
	position: absolute;
	top: 20px;
	left: 0px;
	width: 100%;
	height: 50px;
	text-align: center;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 25px;
	color: #555;
	
	
}

.blog-holder:hover .blog-sub-title{
	
	color: #97B5A9;
	
}

.blog-date{
	
	
	position: absolute;
	top: 70px;
	left: 0px;
	width: 100%;
	height: 50px;
	text-align: center;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 13px;
	color: #555;
	
	
}

.blog-button{
	
	
	position: absolute;
	top: 320px;
	left: calc(50% - 75px);
	width: 150px;
	height: 37px;
	padding-top: 13px;
	background-color: #fff;
	text-align: center;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 20px;
	color: #555;
	cursor: pointer;
	
	
}

.blog-button:hover{
	
	background-color: #97B5A9;
	color: #fff;
	
}

.contact{
	
	position: absolute;
	top: calc(100% + 4440px);
	left: 0px;
	width: 100%;
	height: 400px;
	background-color: #000;
	overflow: hidden;
	
	
}

.contact-title{
	
	position: absolute;
	top: 20px;
	left: 0px;
	width: 100%;
	height: 60px;
	color: #fff;
	text-align: center;
	padding-top: 40px;
	text-transform: uppercase;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 20px;
	letter-spacing: .25em;
	
}

.bezoek{
	
	position: absolute;
	top: 130px;
	left: calc(50% - 500px);
	height: 150px;
	width: 250px;
	
	
}

.post{
	
	position: absolute;
	top: 130px;
	left: calc(50% - 250px);
	height: 150px;
	width: 250px;
	
	
}

.bedrijf{
	
	position: absolute;
	top: 130px;
	left: 50%;
	height: 150px;
	width: 250px;
	
}

.meer{
	
	position: absolute;
	top: 130px;
	left: calc(50% + 250px);
	height: 150px;
	width: 250px;
	
	
}

.link{
	
	color: #fff;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 13px;
	
}

.link:focus{
	
	color: #fff;
	
}

.link:active{
	
	color: #fff;
	
}

.link:hover{
	
	color: #97B5A9;
	
}

.contact-sub-title{
	
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 20px;
	text-align: center;
	color: #fff;
	text-transform: uppercase;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 15px;
	letter-spacing: .25em;
	
}

.contact-sub-content{
	
	position: absolute;
	top: 50px;
	left: 0px;
	width: 100%;
	height: 100px;
	text-align: center;
	color: #fff;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 13px;
	
}

.copyright{
	
	position: absolute;
	bottom: 10px;
	left: 0px;
	width: 100%;
	height: 60px;
	text-align: center;
	color: #fff;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 13px;
	letter-spacing: .25em;
	text-transform: uppercase;
	
}

.portfolio-big-blocker{
	
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-color: #777;
	opacity: 0.3;
	
}

.portfolio-big{
	
	position: fixed;
	top: calc(50% - 230px);
	left: calc(50% - 450px);
	width: 900px;
	height: 530px;
	box-shadow: 0px 0px 8px 2px #ddd;
	overflow: hidden;
	
}

.portfolio-big-image{
	
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 400px;
	background-color: #eee; 
	
}

.portfolio-big-image-blocker{
	
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 400px;
	background-color: #eee; 
	
}

.portfolio-big-left{
	
	position: absolute;
	top: 150px;
	left: 0px;
	width: 50px;
	height: 100px;
	background: url(img/svg/left.svg) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	background-color: #000;
	opacity: 0.4;
	
}

.portfolio-big-left:hover{
	
	opacity: 0.5;
	
}

.portfolio-big-right{
	
	position: absolute;
	top: 150px;
	left: 850px;
	width: 50px;
	height: 100px;
	background: url(img/svg/right.svg) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	background-color: #000;
	opacity: 0.4;
	
}

.portfolio-big-right:hover{
	
	opacity: 0.5;
	
}

.dots{
	
	position: absolute;
	width: 100%;
	height: 30px;
	top: 370px;
	
}

.dot{
	
	position: absolute;
	width: 10px;
	height: 10px;
	top: 5px;
	border-radius: 20px;
	background-color: #ddd;
	
}

.dots2-dot1{
	
	left: calc(50% - 15px);
	
}

.dots2-dot2{
	
	left: calc(50% + 5px);
	
}

.dots4-dot1{
	
	left: calc(50% - 35px);
	
}

.dots4-dot2{
	
	left: calc(50% - 15px);
	
}

.dots4-dot3{
	
	left: calc(50% + 5px);
	
}

.dots4-dot4{
	
	left: calc(50% + 25px);
	
}


.dots5-dot1{
	
	left: calc(50% - 45px);
	
}

.dots5-dot2{
	
	left: calc(50% - 25px);
	
}

.dots5-dot3{
	
	left: calc(50% - 5px);
	
}

.dots5-dot4{
	
	left: calc(50% + 15px);
	
}

.dots5-dot5{
	
	left: calc(50% + 35px);
	
}
.current-dot{
	
	background-color: #97B5A9;
	
}

.portfolio-big-info{
	
	position: absolute;
	top: 400px;
	left: 0px;
	width: 100%;
	height: 130px;
	background-color: #fff;
	
}

.portfolio-big-prev{
	
	position: absolute;
	top: 0px;
	left: 0px;
	width: 50px;
	height: 130px;
	background: url(img/svg/left-green.svg) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	background-color: #fff;
	
}

.portfolio-big-info-content{
	
	position: absolute;
	top: 0px;
	left: 50px;
	width: 600px;
	height: 130px;
	
}

.portfolio-big-info-project{
	
	position: absolute;
	top: 0px;
	left: 0px;
	width: 400px;
	height: 130px;
	text-align: center;
	color: #555;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 13px;
	-webkit-user-select: none; /* Safari */        
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+/Edge */
	user-select: none; /* Standard */
}

.portfolio-big-info-bedrijf{
	
	position: absolute;
	top: 0px;
	left: 400px;
	width: 400px;
	height: 130px;
	text-align: center;
	color: #555;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 13px;
	-webkit-user-select: none; /* Safari */        
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+/Edge */
	user-select: none; /* Standard */
	
}

.portfolio-big-info-title{
	
	position: absolute;
	top: 20px;
	left: 0px;
	width: 100%;
	height: 30px;
	text-align: center;
	color: #555;
	text-transform: uppercase;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 15px;
	letter-spacing: .25em;
	
}
.portfolio-big-info-sub-content{
	
	position: absolute;
	top: 50px;
	left: 0px;
	width: 100%;
	height: 80px;
	text-align: center;
	color: #555;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 14px;
	
}

.portfolio-big-next{
	
	position: absolute;
	top: 0px;
	left: 850px;
	width: 50px;
	height: 130px;
	background: url(img/svg/right-green.svg) no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	background-color: #fff;
	
}

.portfolio-big-prev:hover{
	
	background-color: #eee;
	
}

.portfolio-big-next:hover{
	
	background-color: #eee;
	
}



@keyframes header1 {
    0% { left: 0px; }
    27% { left: 0px; }
    33% { left: -100%; }
	61% { left: -100%; }
	67% { left: -200%; }
	94% { left: -200%; }
	100% { left: 0px; }
}

@-moz-keyframes header1 {
    0% { left: 0px; }
    27% { left: 0px; }
    33% { left: -100%; }
	61% { left: -100%; }
	67% { left: -200%; }
	94% { left: -200%; }
	100% { left: 0px; }
}

@-webkit-keyframes header1 {
    0% { left: 0px; }
    27% { left: 0px; }
    33% { left: -100%; }
	61% { left: -100%; }
	67% { left: -200%; }
	94% { left: -200%; }
	100% { left: 0px; }
}

@-o-keyframes header1 {
    0% { left: 0px; }
    27% { left: 0px; }
    33% { left: -100%; }
	61% { left: -100%; }
	67% { left: -200%; }
	94% { left: -200%; }
	100% { left: 0px; }
}





@keyframes header2 {
    0% { left: 100%; }
    27% { left: 100%; }
    33% { left: 0px; }
	61% { left: 0px; }
	67% { left: -100%; }
	94% { left: -100%; }
	100% { left: 100%; }
}

@-moz-keyframes header2 {
    0% { left: 100%; }
    27% { left: 100%; }
    33% { left: 0px; }
	61% { left: 0px; }
	67% { left: -100%; }
	94% { left: -100%; }
	100% { left: 100%; }
}

@-webkit-keyframes header2 {
    0% { left: 100%; }
    27% { left: 100%; }
    33% { left: 0px; }
	61% { left: 0px; }
	67% { left: -100%; }
	94% { left: -100%; }
	100% { left: 100%; }
}

@-o-keyframes header2 {
    0% { left: 100%; }
    27% { left: 100%; }
    33% { left: 0px; }
	61% { left: 0px; }
	67% { left: -100%; }
	94% { left: -100%; }
	100% { left: 100%; }
}






@keyframes header3 {
    0% { left: 200%; }
    27% { left: 200%; }
    33% { left: 100%; }
	61% { left: 100%; }
	67% { left: 0px; }
	94% { left: 0px; }
	100% { left: 200%; }
}

@-moz-keyframes header3 {
    0% { left: 200%; }
    27% { left: 200%; }
    33% { left: 100%; }
	61% { left: 100%; }
	67% { left: 0px; }
	94% { left: 0px; }
	100% { left: 200%; }
}

@-webkit-keyframes header3 {
    0% { left: 200%; }
    27% { left: 200%; }
    33% { left: 100%; }
	61% { left: 100%; }
	67% { left: 0px; }
	94% { left: 0px; }
	100% { left: 200%; }
}

@-o-keyframes header3 {
    0% { left: 200%; }
    27% { left: 200%; }
    33% { left: 100%; }
	61% { left: 100%; }
	67% { left: 0px; }
	94% { left: 0px; }
	100% { left: 200%; }
}






@keyframes updown {
    0%   {bottom: 10px;}
    16%  {bottom: 15px;}
    20%  {bottom: 10px;}
    24% {bottom: 12px;}
	28% {bottom: 10px;}
}