/* Common elements 
-------------------------------------------------------------------------*/
*{
	padding: 0;
	margin: 0;
 }
HTML{
	font-size: 100%;
   }

body{
	margin: 0;
	padding: 0;
	background: #302125;
	font: 0.95em Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFEF;
	}

h1 {
	margin: 1em 0 1em 0;
	padding: 0;
	font-size: 150%;
	font-weight: normal;
	line-height: 110%;
	color: #302125;
	}

h2 {
	margin: 1.2em 0 0.3em 0;
	padding: 0;
	font-size: 120%;
	font-weight: normal;
	color: #302125;
	}

h3 {
	margin: 1.5em 0 0.5em 0;
	font-size: 100%;
	font-weight: bold;
	color: #302125;
	}

img{
	border: none;
	}

fieldset{
	border: solid 0 transparent;
   }	
	
ul{
	margin: 1em 8%;
	padding: 0;
	}

	ul li{
		margin: 0.4em 0;
		list-style: none;
		}

	ul li ul{
		margin: 0.5em 0 1em 1em;
		}

form{
	margin: 1em 5%;
	}

a, a:visited {
	color: #b39279;
	}

	a:hover {
		color: #ff9228;
		}
		
/*----------- small decoration elements -----------------*/
.column1 li{
	list-style: disc;
   }
ul.data li.title{
	list-style: none;
	margin: 1em 0 0 0;
	 } 	
	
ul.data li{
	list-style: circle;
	margin: 0 0 0 1em;
   } 


.highlighted{
    margin: 0 80px 0 30px;
	padding: 0.7em;
	background: #FFFFEF;
	border: 1px solid #D0C0AA;
	}

img.teaser{
	padding: 5px;
	margin: 0.5em 1em 0.1em 1em;
	background: #FFFFFF;
	border: 1px solid #F7F4EA;
	}

a:hover img.teaser{
	border: 1px solid #CCCCAA;
	}

/* Layout blocks 
-------------------------------------------------------------------------*/
.wrapper{
	width: 100%;
	position: relative;
	overflow: hidden;
	}

.content{
   width: 85%;
	margin: auto;
	line-height: 140%;
	max-width: 60em;
	}

/* Header
-------------------------------------------------------------------------*/
#header .content{
	height: 127px;
	background: url(img/top_eye.jpg) no-repeat;
		}

	#header h1{
		margin: 0;
		}

	#header .content{
		position: relative;
		}

div.top_left{
	width: 218px;
	height: 126px;
	position: absolute;
	left: -218px;
	background: url(img/top_left_gradient.jpg) no-repeat;
	}

ul.languages{
	position: absolute;
	z-index:4;
	top: 0;
	right: 0;
	margin: 0.5em 0.2em;
	}

	ul.languages li {
		float: left;
		padding: 0;
		margin: 0;
		color: #FFF;
		}

/* Navigation 
-------------------------------------------------------------------------*/
div.menu{
	height: 29px; /*clear:both;*/
	background: url(img/menu_eye.jpg) #9e533d no-repeat;
	}
		
	div.menu div#menu_z_index{
		position: relative;
		z-index: 3;
		}

	#menu_left_bg{
		width: 235px;
		height: 29px;
		position: absolute;
		left: -235px;
		background: #964C36;
		}
		
.menu ul{
	width: 66.67%;
	height: 2em;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 10;
	padding: 0;
	margin: 0;
	font-size: 100%;
	}

	.menu li {
		width: 24.94%;
		float: left;
		padding: 0;
		margin: 0;
		}

	.menu li a {
		display: block;
		padding:4px 0;
		margin-right: 1px;
		background: url(/menu_grad.gif) repeat-x;
		text-decoration: none;
		text-align: center;
		color: #FFFFFF;
		}

		.menu li.current a{
			background:  #FF9000 repeat-x;
			}

		.menu li.parent a{
			background:  #FF9000 repeat-x;
			}

		.menu li a:visited {
			color: #FFFFFF;
			}

		.menu li a:hover {
			background: #FF9000 repeat-x;
			color: #FFFFFF;
		}

/* Visual
-------------------------------------------------------------------------*/
.visual{
	height: 218px;
	position: relative;
	z-index: 2;
	background: url(img/bg_orange_right.jpg) #F07332 96px;
	}

.visual div#eye{
	width: 100%;
	height: 218px;
	background: url(img/eye.jpg) no-repeat;
	}

   .visual #eye_left{
		width: 258px;
		height: 263px;
		position: absolute;
		left: -258px;
		background: url(img/eye_left.jpg) right top no-repeat;
		}

.visual div#tagline{
	padding: 2em 100px 0 300px;
	color: #302125;
	}

	#tagline h2{
		margin: 0;
		font-size: 170%;
		text-align: center;
		line-height: 115%;
		}

	#tagline p{
		margin: 0.5em 0 0 0;
		font-weight: bold;
		text-align: center;
		}
		
.visual #fire{
	width: 398px;
	height: 493px;
	position: absolute;
	top: -156px;
	right: -290px;
	background: url(img/fire.gif);
	}
	
#visual a{
	text-decoration: none;
	color: #FFF;
	}

	#visual a:visited{
		text-decoration: none;
		color: #FFF;
		}

	#visual a:hover{
		color: #FFF;
		text-decoration: underline;
		}



/* Content Column 1
-------------------------------------------------------------------------*/
.column1{
	width: 66%;
	position: relative;
	float: left;
	padding: 0;
	padding-bottom: 1600px;
	margin-bottom: -1450px;
	background: #F6F2D7 right top repeat-y;
	color: #302125;
	}

	.column1 div#column1_line_bg{
		height: 45px;
		z-index: 3;
		background: url(img/column1_line_bg.jpg) left top repeat-x;
		}
	
	.column1 #column1_left_line{
		width: 109px;
		height: 100%;
		position: absolute;
		left: -109px;
		margin-top: -45px;
		padding-bottom: 1600px;
		margin-bottom: -1600px;
		background: url(img/column1_left_line.jpg) right top repeat-y;
		}
		
   .column1 #right_line1{
		width: 58px;
		height: 100%;
		position: absolute;
		right:-1px;
		top: 15px;
		padding-bottom: 1600px;
		margin-bottom: -1600px;
		background: url(img/column1_right_line.gif) right top repeat-y;
		}
		
	.column1 #right_line2{
		width: 77px;
		height: 100%;
		position: absolute;
		left: 151%;
		top: -18px;
		padding-bottom: 1600px;
		margin-bottom: -1600px;
		background: url(img/column2_right_line.jpg) right top repeat-y;
		}
	
.column1 p{
		margin: 1em 80px 1em 5%;
	}
	
	.column1 h1, .column1 h2, .column1 h3, .column2 h1, .column2 h2, .column2 h3{
		margin-left: 5%;
		margin-right: 5%;
		
		
		}
		
		
	.column1 h1, .column1 h2, .column1 h3{
		color: #6B5849;
	   }
	.column2 h1, .column2 h2, .column2 h3{
		color: #F6F2D7;
	}
		
		
	.column1 a{
		color:#D96C00;
		
		}

		.column1 a:visited {
			color: #9d4f01;
			
			}

		.column1 a:hover {
			color: #ff7e00;
			}

/* Content Column 2
-------------------------------------------------------------------------*/
.column2{
	width: 34%;
	position: relative;
	float: right;
	padding-top:2em;
	padding-bottom: 1600px;
	margin-bottom: -1450px;
	background: #6B5849 left top repeat-y;
	
	}

.column2>*{
	padding-left: 36px;
	}
	
	.column2 p{
		margin: 1em 5%;
		}
	.column2 h2{
		color: #b39279;
		}
   .column2 a{
		color:#e5bc9c;
		} 
		.column2  a:visited {
	      color: #b39279;
	   }
    	.column2 a:hover {
		color: #ff9228;
		}
.brun{
	background: #6B5849;
	}

	

/* Bottom
-------------------------------------------------------------------------*/
.flowers{
	width: 100%;
	height: 150px;
	position: relative;
	margin-top: -150px;
	background: url(img/flowers.png) repeat-x;
	behavior: url(iepngfix.htc);
	}

.flowers_IEalfa{
	background-image: none;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=img/flowers.png, sizingMethod='crop');
	}

.flowers_gif{
	width: 100%;
	height: 150px;
	position: relative;
	margin-top: -150px;
	background: url(img/flowers.gif) repeat-x;
	}


.bottom{
	clear: both;
	padding: 1em;
	font-size: 85%;
	text-align: center;
  	}
	


/* Inner pages
-------------------------------------------------------------------------*/

ul#websites li{
	width: 49.95%;
	float: left;
	text-align: center;
	list-style-type: none;
	}
	
ul#logos li{
	text-align: center;
	}

ul#websites a, ul#logos a{
	text-decoration: none;
	}

/* Portfolio item
-------------------------------------------------------------------------*/
.screenshot, .paper{
	margin-bottom: 25px;
	font-size: smaller;
	font-style: italic;
	text-align: center;
	color: #808080;
	}

.screenshot img{
	margin: 0.5em;
	}

.paper img{
	margin: 15px;
	border: 1px solid #C0C0C0;
	}

.client{
	padding-right: 1em;
	font-size: smaller;
	font-style: italic;
	text-align: right;
	}

/*rates
--------------------------------------------------------------------------*/
#quote{
	position:absolute;
	margin: 10px 0 0 0;
	}

