@charset "utf-8";

	/**************************************************************************
	 ®Copyright 2001-2012		Inque
	 
	 Author: 	Vincent Rijnbeek
	 Email: 	vincent@inque.nl
	 Web:		inque.nl
	 Date: 		04 / 20 / 2011	 
	 Update:	10 / 26 / 2012
	 	 
	 **************************************************************************/

	/**************************************************************************
	
		#green #73ba5d



	 **************************************************************************/

	/*************************************************************************
	 RESET CSS - YUI 3.7.3 (build 5687)							//!Reset
	 **************************************************************************/
	
	 	html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}input,textarea,select{*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}	


	/*************************************************************************
	 TOOLS													//!Tools
	 **************************************************************************/
		
		.fl 		{ float: left; }
		.fr 		{ float: right; }
		.cl 		{ clear:both;font-size: 0px;line-height: 0px;height: 0px; }
		.hide	 	{ display: none; }
		.center 	{ margin: 0 auto; }


	/*************************************************************************
	 BASICS														//!Basics
	 **************************************************************************/
	
		* {margin: 0; padding: 0; -webkit-appearance: none; -webkit-text-size-adjust: none;} 
		
		*:focus {outline: none;}
		
		html, body 	{
			background: #F9F9F9 url("../_image/") repeat-y center;
			color: #666;
			text-align: left;
			font-family: "proxima-nova","Helvetica Neue",Helvetica,Arial,sans-serif;
			font-size: 14px;
			font-weight: 300;
			height: 100%;
			line-height:22px;
			
			;
		}
	
		textarea {
		   resize: none;
		}	
	
		a { 
			color: #000000;
			text-decoration:none;
			outline:none;
		}
			
		a:hover { 
			color: #73ba5d;
			text-decoration: none; 
			outline:none;
			
		}	
		
		p {
			clear: both;			
			
		}
			
	/*************************************************************************
	 HEADERS												//!Header
	 **************************************************************************/
	
		h1 {
			font-family: "adelle-sans",sans-serif;
			font-size: 32px;
			line-height: 32px;
			padding: 0;
			margin: 0;
			padding: 16px;
			font-weight: 100;
			color: #FFF;
			
		}
		
		h2 {
			font-family: "adelle-sans",sans-serif;
			font-size: 32px;
			line-height: 32px;
			padding: 0;
			margin: 0;
			padding: 16px;
			font-weight: 100;

		}
		
		h3 {
		
		
		}

	/*************************************************************************
	 CONTAINER													//!wrapper
	 **************************************************************************/
		
		#container {
			
			padding: 80px 0 0;
			
		}
		
		
	/*************************************************************************
	 HEADER														//!Header
	 **************************************************************************/
		
		.retina {
			/*-webkit-mask-box-image: url(../_image/highres/logo.png); 
			-webkit-mask: url(../_image/logo.svg) no-repeat;
			mask: url(../_image/logo.svg);
			-webkit-mask-size: 190px;*/
			display: block;
			width: 190px;
			height: 79px;
			background: #000 url(../_image/logo-cutout-shadow-alt.svg) no-repeat top left;
			background-size: 190px 79px;
			-webkit-svg-shadow: 0 0 7px #53BE12;
		}
		
		header {
			background: #fff;
			height: 79px;
			width: 100%;
			-webkit-box-shadow: 0 0 3px rgba(0,0,0,.15);
			-moz-box-shadow: 0 0 3px rgba(0,0,0,.15);
			box-shadow: 0 0 3px rgba(0,0,0,.15);
			border-bottom: 1px solid #ddd;	
			font-family: "adelle-sans";
			font-size: 15px;
			color: #666;
			font-weight: 100;	
			position: fixed;
			top: 0;
			z-index: 999;
			
		}
		
		nav {
			width: 1024px;
			height: inherit;
			margin: 0 auto;
			
		}
		
		nav ul {
			float: left;
			background: #ddd;
			
		}
		
		nav ul#session {
			float: right;
			
		}

		nav li.logo, nav li.logo a {
			width:190px !important;
			
		}

		
		nav li {
			display: inline;
			float: left;		
			height: inherit;
			line-height: 79px;
			text-align: center;
			width: 100px;
	
		}
		
		nav li a {		
			width: 100px;
			height: 79px;
			display: block;	
			text-align: center;
			line-height: 79px;
			transition: -webkit-transform .2s;
			-webkit-transition: -webkit-transform .2s;
			-moz-transition: -webkit-transform .2s;
			-ms-transition: -webkit-transform .2s;
			-webkit-transform-origin: 50% 79px;
			-webkit-transform: perspective(400px) rotateX(0deg);
			-webkit-backface-visibility: hidden;
			background: #FFF;
			color: #666;
			float: left;

		}
	/*	
		nav li a:hover {
			width: 100px;
			height: 79px;	
			display: block;	
			-webkit-transform-origin: 50% 79px;
			-webkit-transform: perspective(400px) rotateX(12deg);
			-webkit-backface-visibility: hidden;
			background: #FFF;
			color: #666;
			line-height: 79px;	

		}
*/
		nav li a > hr {
			width: 90px;
			margin: -3px auto 0;
			border: 0;
			border-top: 1px solid #ddd;
		}
		
	/*************************************************************************
	 NAVIGATION													//!Navigation
	 **************************************************************************/
		
		
		
	/*************************************************************************
	 TIMELINE													//!Timeline
	 **************************************************************************/

	
	
	.message-date {
		font-weight: 300;
		font-size: 10px;
		line-height: 18px;
		float: left;
	}


	.message-time {
		font-weight: 300;
		font-size: 10px;
		line-height: 18px;
		float: right;
	}

	
	.sidebar {
		width: 210px;
		float: left;
		display: block;
		min-height: 120px;
		position: fixed;
		
	}
	
	.timeline {
		width: 638px;
		float: left;
		display: block;
		padding: 0 0 0 210px;
	}
	
	.line {
		border-left: 1px solid #ddd;
		margin: 8px 0 8px 25px;
		padding: 0 0 32px 25px;
	}

	.line[data-icon]:before {
		font-family: 'Pictos Custom';
		content: attr(data-icon);
		margin: 0px 0 0 -34px;
		float: left;
		font-size: 21px;
		color: #ddd;
		background: #F9F9F9;
		height: 24px;
		line-height: 22px;
	}
	
				
	.pictos[data-icon]:before {
		font-family: 'Pictos Custom';
		content: attr(data-icon);
		padding: 0 8px 0 0;
	}
		
	input[data-icon]:before {
		font-family: 'Pictos Custom';
		content: attr(data-icon);
		padding: 0 8px 0 0;
	}	
	
	/*************************************************************************
	 CONTENT													//!Content
	 **************************************************************************/
	
	 	#carousel {
		 	width: 100%;
		 	background-size: cover;	
		 	display: block;	
		 	z-index: 1; 
		 	position: fixed;
		 	top: 80px;	
		 	background-image: linear-gradient(left top, rgb(10,79,74) 25%, rgb(39,107,95) 100%);
			background-image: -o-linear-gradient(left top, rgb(10,79,74) 25%, rgb(39,107,95) 100%);
			background-image: -moz-linear-gradient(left top, rgb(10,79,74) 25%, rgb(39,107,95) 100%);
			background-image: -webkit-linear-gradient(left top, rgb(10,79,74) 25%, rgb(39,107,95) 100%);
			background-image: -ms-linear-gradient(left top, rgb(10,79,74) 25%, rgb(39,107,95) 100%);		
			background-image: -webkit-gradient(
				linear,
				left top,
				right bottom,
				color-stop(0.25, rgb(10,79,74)),
				color-stop(1, rgb(39,107,95))
			);
		 	
		 	
	 	}
	
	 	#carousel .more {
		 	position: fixed;
		 	bottom: 0px;
		 	right: 0px;
		 	width: 120px;
		 	height: 48px;
		 	background: #FFF;
		 	line-height: 48px;
		 	text-align: center;
		 	z-index: 27;
		 	
	 	}

	 	#carousel .left {
	 		float: left;
		 	width: 50%;
		 	height: 100%;
		 	display: block;
		 	background-image: linear-gradient(left top, rgb(10,79,74) 25%, rgb(39,107,95) 100%);
			background-image: -o-linear-gradient(left top, rgb(10,79,74) 25%, rgb(39,107,95) 100%);
			background-image: -moz-linear-gradient(left top, rgb(10,79,74) 25%, rgb(39,107,95) 100%);
			background-image: -webkit-linear-gradient(left top, rgb(10,79,74) 25%, rgb(39,107,95) 100%);
			background-image: -ms-linear-gradient(left top, rgb(10,79,74) 25%, rgb(39,107,95) 100%);		
			background-image: -webkit-gradient(
				linear,
				left top,
				right bottom,
				color-stop(0.25, rgb(10,79,74)),
				color-stop(1, rgb(39,107,95))
			);

	 	}
	 	
	 	#carousel .right {
	 		float: left;
		 	width: 50%;
		 	height: 100%;
		 	display: block;
			background-image: linear-gradient(right top, rgb(10,43,84) 25%, rgb(27,59,98) 100%);
			background-image: -o-linear-gradient(right top, rgb(10,43,84) 25%, rgb(27,59,98) 100%);
			background-image: -moz-linear-gradient(right top, rgb(10,43,84) 25%, rgb(27,59,98) 100%);
			background-image: -webkit-linear-gradient(right top, rgb(10,43,84) 25%, rgb(27,59,98) 100%);
			background-image: -ms-linear-gradient(right top, rgb(10,43,84) 25%, rgb(27,59,98) 100%);
			
			background-image: -webkit-gradient(
				linear,
				right top,
				left bottom,
				color-stop(0.25, rgb(10,43,84)),
				color-stop(1, rgb(27,59,98))
			);

	 	}
		
	 	#content {
		 	z-index: 26;
			width: 100%;
			margin: 0 auto;
			position: relative;
			background: #F9F9F9;
			padding: 16px 0 0 0;		 	
		 	
	 	}
	 	
	 	#canvas {
		 	width: 1024px;
		 	margin: 0 auto;
		 	
	 	}
	 	
	 	p {
		 	text-align: left;
		 	
	 	}
		
		.svg_dropshadow {
			-webkit-filter: drop-shadow(3px 3px 5px rgba(0,0,0,0.5));
			-webkit-filter: blur(10px);
			-webkit-transition: -webkit-filter .2s ease-in-out;
		}

		.svg_dropshadow:hover {
			-webkit-filter: drop-shadow(3px 3px 5px rgba(0,0,0,0.5));
			-webkit-filter: blur(0px);
		}




	/*************************************************************************
	 TEST													//!Test
	 **************************************************************************/
	 
	 
	 	.writer {
		 	width: 1024px;
		 	height: 768px;
		 	display: block;
		 	border: 1px solid #ddd;
		 	background: url(../_image/photo/writer-small.jpg) no-repeat left bottom;
		 	
	 	}

	 	.writer-container {
			width: 1024px;
			height: 256px;
			display: block;
			position: relative;
			top: 512px;
			overflow: hidden;		 	
	 	}

	 	.writer_blur {
			width: 1024px;
			height: 256px;
			display: block;
			background: url(../_image/photo/writer-small.jpg) no-repeat left bottom;
			-webkit-transition: -webkit-filter .2s ease-in-out;
			-webkit-filter: blur(8px);
			position: relative;
			top: 0px;
	 	}
	 	
	 	.writer_frost {
			width: 1024px;
			height: 256px;
			display: block;
			background: #FFF;
			opacity: 0.2;	 	
		 	
	 	}

	 	.writer_blur:hover {
			width: 1024px;
			height: 256px;
			display: block;
			background: url(../_image/photo/writer-small.jpg) no-repeat left bottom;
			-webkit-filter: blur(0px);
			position: relative;
			top: 0px;
	 	}


	 
		.box {
			padding: 0 10px;
			height: 79px;
			display: block;
			-webkit-backface-visibility: hidden;	
			text-align: center;
			line-height: 79px;
			background: #FFF;
			color: #000;
			transition: line-height .2s, height .2s, border-bottom .2s, background .2s, color .2s, -webkit-transform .2s;
			-webkit-transform-origin: 50% 79px;
			-webkit-transform: perspective(400px) rotateX(0deg);
			float: left;
		
		}
		
		.box > hr {
			width: 90px;
			margin: -3px auto 0;
			border: 0;
			border-top: 1px solid #ddd;
		}
		
		.box:hover {
			-webkit-transform-origin: 50% 79px;
			-webkit-transform: perspective(400px) rotateX(12deg);
			-webkit-backface-visibility: hidden;
			background: #FFF;
			color: #000;
			height: 79px;
			line-height: 79px;			
			
		}
		
		.box-background {
			background: #ddd;
			width: auto;
			float: left;
			
		}

	/*************************************************************************
	 FORM														//!Form
	 **************************************************************************/

	 	#signin, #reset, #contact {
		 	width: 332px;
		 	background: #FFF;
		 	margin: 48px auto 0;
		 	border: 1px solid #ddd;
		 	text-align: center;
		 	box-shadow: 0px 6px 15px rgba(0,0,0,.05);
		 	-webkit-border-radius: 1px;
			-moz-border-radius: 1px;
			border-radius: 1px;
			padding: 16px 0 48px 0;
					 	
	 	}
	 	
	 	#message {
		 	width: 638px;
		 	background: #FFF;
		 	margin: 48px auto 0;
		 	border: 1px solid #ddd;
		 	box-shadow: 0px 6px 15px rgba(0,0,0,.05);
		 	-webkit-border-radius: 1px;
			-moz-border-radius: 1px;
			border-radius: 1px;
			padding: 16px 0 48px 0;
		 	
		 	
	 	}
	 	
	 	#contact div {
	 		padding: 16px 0 0 98px;
		 	
		 	
	 	}
	 	
	 	form {
	 		padding: 16px 39px 0 ;

	 	}
	 	
	 	table {
	 		width: 100%;
	 	}

	 	table td {
	 		padding: 0 0 16px;
	 	}
	 	
	 	input[type=text], input[type=password] {
	 	 	-webkit-border-radius: 1px;
			-moz-border-radius: 1px;
			border-radius: 1px;
		 	width: 232px;
		 	height: 14px;
		 	border: 1px solid #ddd;
		 	padding: 10px;
		 	line-height: 17px;
		 		 	
	 	}
	 	
	 	input[type=submit] {
	 	 	-webkit-border-radius: 3px;
			-moz-border-radius: 3px;
			border-radius: 3px;
		 	width: 232px;
		 	height: 36px;
		 	border: 0px solid #ddd;
		 	padding: 10px;
		 	background: #73ba5d;
		 	color: #FFF;
		 	line-height: 14px;
		 	text-shadow: 1px 1px rgba(0,0,0,0.1);
		 	transition: text-shadow .2s, box-shadow .2s, -webkit-transform .2s;
			-webkit-transform-origin: 50% 72px;
			-webkit-transform: perspective(400px) rotateX(0deg);
			box-shadow: inset 0px 1px 1px rgba(0,0,0,0.1);
		 		 	
	 	}
	 	
	 	input[type=date] {
	 	 	-webkit-border-radius: 1px;
			-moz-border-radius: 1px;
			border-radius: 1px;
		 	width: 134px;
		 	height: 14px;
		 	border: 1px solid #ddd;
		 	padding: 10px;
		 	line-height: 17px;
		 		 	
	 	}

	 	input[type=time] {
	 	 	-webkit-border-radius: 1px;
			-moz-border-radius: 1px;
			border-radius: 1px;
		 	width: 76px;
		 	height: 14px;
		 	border: 1px solid #ddd;
		 	padding: 10px;
		 	line-height: 17px;
		 		 	
	 	}	
	
	 	
	 	input[type=checkbox] {  
		 	display: none;  
		 }  


		.checkbox label {
			height: 14px;
			display: inline-block;
			line-height: 14px;
			font-size: 14px;
			
		}
		 
		.checkbox label:after {
			content: "";
			display: inline-block;
			width: 14px;
			height: 14px;
			margin: 0 0 0 8px;
			background-color: #F9F9F9;
			box-shadow: inset 0px 2px 3px 0px rgba(0, 0, 0, .1), 0px 1px 0px 0px rgba(255, 255, 255, .8);
			line-height: 14px;
			font-size: 14px;
		}
		
		input[type=checkbox]:checked + label:after {
			content: "✓";
			display: inline-block;
			width: 14px;
			height: 14px;
			margin: 0 0 0 8px;
			background-color: #F9F9F9;
			box-shadow: inset 0px 2px 3px 0px rgba(0, 0, 0, .1), 0px 1px 0px 0px rgba(255, 255, 255, .8);
			line-height: 14px;
			text-align: center;
			font-size: 14px;
			color: #000;
		}



	 	
	 	select {
	 	 	-webkit-border-radius: 1px;
			-moz-border-radius: 1px;
			border-radius: 1px;
		 	width: 134px;
		 	height: 36px;
		 	border: 1px solid #ddd;
		 	padding: 10px;
		 	line-height: 14px;
		 		 	
	 	} 	
	 	
	 	textarea {
	 	 	-webkit-border-radius: 1px;
			-moz-border-radius: 1px;
			border-radius: 1px;
		 	width: 540px;
		 	height: 180px;
		 	border: 1px solid #ddd;
		 	padding: 10px;
		 	line-height: 17px;
		 	
		 	
	 	}
	/* 	
	 	input[type=submit]:hover {
	 		-webkit-transform-origin: 50% 72px;
			-webkit-transform: perspective(400px) rotateX(12deg);
			-webkit-backface-visibility: hidden;
			box-shadow: inset 0px 18px 14px rgba(0,0,0,0.1);
		 	text-shadow: 1px 18px rgba(0,0,0,0.1);

		 		 	
	 	}	 	
	*/	
	/*************************************************************************
	 FOOTER														//!Footer
	 **************************************************************************/

	 	

	/*************************************************************************
	 REALISATION												//!Realisation
	 **************************************************************************/
		
		#realisation {
			float: right;
			margin-top: -25px;
			padding: 0 10px 10px 0;
			position: relative;
			z-index: 7625;
		}
		
		#realisation a {
			background: url("/realisation.png") no-repeat  right -15px transparent;
			display: block;
			height: 15px;
			width: 20px;	
		}
		
		#realisation a:hover { 
			width: 128px;
			background:url("/realisation.png") right 0px no-repeat;
		}