/* 
		opmaak.css
		In dit css file worden alle opmaak dingen gedaan.
		
		# Gemaakt door: Gertjan Groteboer
		# Bedrijf:	Miendag
*/

/* 
	#
		# Nu komt de basic
	#
*/
/* We gaan nu de background doen */
html
{
	background:					#000000 url(../image/background.jpg) no-repeat center center fixed;
	-webkit-background-size: 	cover;
	-moz-background-size: 		cover;
	-o-background-size: 		cover;
	background-size: 			cover;
}

/* We gaan nu naar de body */
body
{
	font:						bold 14px Calibri,Arial;
	color:						#FFFFFF;
	text-align:					left;
}
/* h1 voor de titles*/
h1
{
	text-align:					left;
}
/* Voor de kopjes die in de tekst komen */
h2
{
	text-align:					left;
}
/* Voor de tekst zodat het goed weergeven word via p */
p
{
	text-align:					left;
}
/* De basis voor de linken */
	/* Dit is voor lettertype */
	a
	{
		
	}
	/* Zoals de link op scherm staat zonder er ovehreen te gaan ect */
	a:link,a:visited
	{
		font:						bold 14px Calibri,Arial;
		color:						#FFFFFF;	
	}
	/* Als je over de link heen gaat */
	a:hover,a:active
	{
		font:						bold 14px Calibri,Arial;
		color:						#FFFFFF;	
	}
	
/* 
	#
		#	Basis is klaar
	#
*/	
	
/* 
	#
		#	De container
	#
*/	
	#container
	{
		position: 				relative; 
		margin: 				0px auto; 
		width: 					800px; 
	}	
/* 
	#
		#	De container is benoemt
	#
*/		
	
/* 
	#
		#	 Nu komt de Header
	#
*/	
#header
{
	width: 					800px; 
}
	/* Meertallen */
	#meertallen
	{
		position:				absolute;	
		text-align: 			left;	
		padding-top:			15px;
		padding-bottom:			15px;
		padding:				5px;
		top: 					2px;
		right:					0px;					
	}
	.imageheader
	{
		width:					250px;
		height:					150px;
		float:					left;
	}
	.headerslogan
	{
		width:					500px;
		float:					right;
		font:					bold 36px Calibri,Arial;	
		text-align: 			right;	
		margin-top:				85px;
	}
/* 
	#
		#	 Nu is de Header  klaar
	#
*/	
/* 
	#
		#	Nu komt het menu
	#	
*/
#menu
{
	width:					800px;
	height:					75px;
	clear:					both;
}
	/* menu knop niet actief*/
	a.menubutton:link, a.menubutton:visited 
	{
		text-align: 			center; 
		text-decoration: 		none;
		width:					170px;
		color: 					#FFFFFF;
		font-size: 				38px;
		font-weight: 			bold;
		padding-left: 			15px;	
		padding-right: 			15px;	
		float:					left;
	}
	
	a.menubutton:hover
	{ 
		color: 					#FFFFFF; 
		font-size: 				38px;
		border-bottom:			8px #367aba solid;
	}
	/* menu knop wel actief*/
	a.menubuttonyes:link, a.menubuttonyes:visited 
	{

		text-align: 			center; 
		text-decoration: 		none;
		width:					170px;
		color: 					#FFFFFF;
		font-size: 				38px;
		font-weight: 			bold;
		padding-left: 			15px;	
		padding-right: 			15px;	
		float:					left;
		border-bottom:			8px #367aba solid;
	}
	
	a.menubuttonyes:hover
	{ 
		color: 					#FFFFFF; 
		font-size: 				38px;
		border-bottom:			8px #367aba solid;
	}	
	#exitmenufloat
	{
		clear:					both;
	}
/* 
	#
		#	Menu is klaar
	#	
*/
/* 
	#
		#	Nu komt de wrapper
	#	
*/
#wrapper
{
	width: 					800px; 
}
/* Taal */
	/* menu knop niet actief*/
	a.taallink:link, a.taallink:visited 
	{
		text-decoration: 		none;
	}
	
	a.taallink:hover
	{ 
		text-decoration: 		none;
	}

/*  De box voor social media */
#socialmedia
{
	position:				fixed;	
	text-align: 			right;	
	width:					125px;
	padding-top:			15px;
	padding-bottom:			15px;

	/* Ronde hoeken */
	border-top-left-radius: 25px 25px;
	-webkit-border-top-left-radius: 25px 25px;
	-moz-border-radius-topleft: 25px 25px;
	border-bottom-left-radius: 25px 25px;
	-webkit-border-bottom-left-radius: 25px 25px;
	-moz-border-radius-bottomleft: 25px 25px;	
	
	behavior: url(border-radius.htc); /* IE FIX */
	/* Einde ronde hoeken */
	padding:				5px;
	background:				#FFFFFF;
	color:					#000000;
	top: 					250px;
	right:					0px;	
}
	/* De tweets en facebook dingen naast elkaar*/
	#boxtweet
	{
		float:					left;
		width:					350px;
	}
	#boxfacebook
	{
		float:					right;
		width:					400px;
		
	}
	#socialexitfloat
	{
		clear:					both;
		margin-top:				50px;
	}
/* Nu gaan we de opmaak van de portfolio regelen */
.portfolioboxen
{
	float:					left;
	width:					375px;
	height:					335px;
}
	/* Voor de title */
	.portfoliotitle
	{
		text-align: 			left; 
		float:					left;		
	}
	/* Voor de afbeelding */
	.portfolioafb
	{
		width:					350px;
		max-height:				325px;		
		float:					left;
	}
	.portfolioafbimg
	{
		width:					350px;
		height:					225px;
		float:					left;
	}

	a.linkportfolio:link, a.linkportfolio:visited 
	{
		color: 					#FFFFFF;
	}
	
	a.linkportfolio:hover
	{ 
		color: 					#FFFFFF; 
	}	
	
	/* Float afsluiten */	
	#exitportfolio
	{
		clear:					both;
		margin-top:				50px;
	}
/* Nu de contact pagina opmaak */	
/* Hierin word het contact formulier aan linkerzijde getoont en aan rechter zijde bedrijfs info */
/* Links */
#contactbox1
{
	width: 					400px; 
	float:					left;		
}
	/* Input velden */
	.contactinput
	{
		float:					right;
		margin-right:			50px;
		width:					175px;
		height:					20px;			
		border:					3px solid #367aba;
	}
	.contactinputsmall
	{
		float:					right;	
		margin-right:			50px;
		width:					100px;	
		height:					20px;
		border:					3px solid #367aba;			
	}
	.contactinputtext
	{
		float:					right;
		margin-right:			50px;
		width:					250px;
		height:					150px;			
		border:					3px solid #367aba;
	}		
	.submitinput
	{
		float:					left;	
		margin-top:				25px;
		margin-right:			50px;
		width:					150px;
		height:					30px;				
	}
	.textboxc
	{
		font-size:					16px;
		margin-top:					15px;
	}
	/*  De error teksten voor het niet invoeren ! */
	input.error { border: 2px solid red;  font-style:italic; }
	label.error 
	{   
		left:					355px;  
		position:				absolute;  
		
		padding-top:			2px;
		padding-left: 			5px;
		padding-right: 			5px;
		background:				#FFFFFF;
		color:					#000000;
	}
	textarea.error { border: 2px solid red;  font-style:italic; }
	select.error { border: 2px solid red;  font-style:italic; }
	
	
/* Rechts */
#contactbox2
{
	width: 					400px;
	float:					right;	
	text-align:				left;
}	
	/* Text vergroot in de contact box2*/
	.textboxp2
	{
		font-size:				16px;
		text-align:				left;
	}
	
/* Float afsluiten */	
#exitcontact
{
	clear:					both;
	margin-top:				50px;
}
	
	
	
/* 
	#
		#	 Nu is de wrapper  klaar
	#
*/	

/* 
	#
		#	Nu komt de footer
	#	
*/
#footer
{
	margin-top:				25px;
	height:					75px;
	width: 					800px; 
	font-size:				16px;		
}
/* 
	#
		#	 Nu is de footer klaar
	#
*/