
@font-face {
		font-family: 'Fonts/talking_to_the_moonregular';
		src: url('Fonts/talkingtothemoon-webfont.eot');
		src: url('Fonts/talkingtothemoon-webfont.eot?#iefix') format('embedded-opentype'),
				 url('Fonts/talkingtothemoon-webfont.woff2') format('woff2'),
				 url('Fonts/talkingtothemoon-webfont.woff') format('woff'),
				 url('Fonts/talkingtothemoon-webfont.ttf') format('truetype'),
				 url('Fonts/talkingtothemoon-webfont.svg#talking_to_the_moonregular') format('svg');
		font-weight: normal;
		font-style: normal;

}


body{
	background-color: #FFF;
	font-family:sans-serif;
	font-weight: lighter;
	width: 100%;
	background-position: left bottom;
	background-repeat:no-repeat;
	color:#404041;
	line-height: 1.5;
	margin:0;
	padding:0;
}


h1 {
	font-family:sans-serif;
	font-weight: bold;
	font-weight:200;
	font-size: 40px;
	margin: 10px 0 -10px 0 ;
	color:#404041;
	line-height: 1;

}


	#philips1 {background-image:url(afbeeldingen/Portfolio/Interactief/Interact1.png);}
	#philips2 {background-image:url(afbeeldingen/Portfolio/Interactief/Interact2.png);}
	#philips3 {background-image:url(afbeeldingen/Portfolio/Interactief/Philips3.png);}

	#signify1 {background-image:url(afbeeldingen/Portfolio/Interactief/Signify2.png);}
	#signify2 {background-image:url(afbeeldingen/Portfolio/Interactief/Signify3.png);}


	#ikea	{background-image:url(afbeeldingen/Portfolio/Interactief/ikea_process.png);}
	#ikea2{background-image:url(afbeeldingen/Portfolio/Interactief/ikea_5.png);}



#container {
	width:800px;
	height:100%;
	margin-left:auto;
	margin-right:auto;
	padding:20px;
	background-color:white;
	overflow-x: hidden;



}

#back {
	position: absolute;
	left: 0px;
	top: 0px;
	height:50px;
	width: 100px;
	opacity: 0.;
	cursor: pointer;
	text-align: center;
	line-height: 50px;
	color:black;
	font-family: sans-serif;
	font-weight: lighter;
}


#arrow {
	position: absolute;
	float: left;
	margin-top: 450px;
	margin-left: 5%;
	cursor: pointer;
	font-family: sans-serif;
	font-weight: lighter;

}

#arrow1 {
	position: absolute;
	right:0;
	margin-top: 430px;
	margin-right: 5%;
	cursor: pointer;
	font-family: sans-serif;
	font-weight: lighter;


}


#slides {
  position: relative;
  width:800px;
  height:400px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px;
}

.slides_container{
	overflow-x: hidden;
	width:800px;


}
.slide {
    width:800px;
    height:400px;
    display:inline;

  }

.noslide {
    	width:800px;
	    height:400px;
	    display:inline;


	  }

#tekst {
  position:relative;
  width: 480px;
	height:100%;
	color:black;
	float:left;
	padding-bottom:20px;
	font-size:11pt;
}

#tekst h1{
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: solid 1px;
}

#logos {
	width: 150px;
	height:150px;
	margin-left:70px;
	margin-top:140px;
	float:left;
	background-image:url(afbeeldingen/Portfolio/Process.png);
	background-repeat:no-repeat;
}

#leeg {
	width: 250px;
	height:150px;
	margin-left:70px;
	margin-top:140px;
	float:left;

}

#proces {
width:850px;
height:100%;
background-color:white;
clear:left;
}

.procesfoto {

	width: 250px;
	height: 250px;
	margin-right:24px;
	margin-bottom:24px;
	float:left;
	background-size:cover;

}


.procesfoto2 {

	width: 250px;
	height: 330px;
	margin-right:24px;
	margin-bottom:20px;
	float:left;
	background-size:cover;

}

.procesfoto3 {

	width: 390px;
	height: 250px;
	margin-right:20px;
	margin-bottom:20px;
	float:left;
	background-size:cover;

}

.procesfoto4 {

	width: 800px;
	height: 300px;
	margin-right:90px;
	margin-bottom:20px;
	margin-top:0px;
	float:left;
	background-size:contain;
	background-repeat: no-repeat;

}

.procesfoto5 {

	width:	780px;
	height: 450px;

	margin-bottom:20px;
	margin-top:-50px;
	float:left;
	background-size:cover;

}


iframe{
	width: 800px;
	height: 450px;
}
