/* RESET */

html, body, div, span, h1, h2, h3, h4, h5, 
h6, p, blockquote, pre,
a, code, em, font, img, small, strong, center,
dl, dt, dd, ol, ul, li, form{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	font-size: 12px;
 line-height: 15px;
	font-family: arial, helvetica, sans-serif;

}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

a {
	color:#df1271;
	text-decoration:none;
	

}

a:hover { 
	color:#424143;
	
}

p {
	color:#424143; 
	font:9pt "Lucida Grande", Arial, sans-serif; 
}




/* MAIN STYLES */

html {
	background-color:#ffffff;
}

#container {
	position: centre;
	width: 784px;
	margin: 0em auto;
}

#gris {
	background-color:#424143;
	width: 100%;
	height:15px;
}

#nom {
	margin-top:70px;
}

#header {
	background-image:url(img/bg_lignes.png);
	width:774px;
	height:150px;
	margin-top:25px;
	border-bottom: solid 1px #D7D7D7; 
	border-top: solid 1px #D7D7D7; 
}



 h3 {
	font:18pt Arial, sans-serif; 
	letter-spacing:-1px; 
	font-weight: bold;
	color: #12cedf;
	margin-top:10px;
	margin-bottom:10px;

}





			
			
#bienvenue_portfolio {
margin-left:15px;
margin-top:45px;
}

#cv {
margin-top:45px;
}

#linkportfolio {
	margin-top:45px;
	width:774px;
}



#slideshow {
    position:relative;
    height:250px;
	width:774px;
	margin-top:10px;
	border: solid 1px #D7D7D7; 
	
}

#slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
}

#slideshow IMG.active {
    z-index:10;
}

#slideshow IMG.last-active {
    z-index:9;
}


/* BOX HOVER */
	
			#thumb, #colonnes {
				width:784;
			}
			
			.boxgrid h3{ margin: 10px 10px 0 10px; color:#FFF; font:18pt Arial, sans-serif; letter-spacing:-1px; font-weight: bold;  }
			
			.boxgrid{ 
				width: 250px; 
				height: 150px; 
				margin-right:9px; 
				margin-top:15px;
				float:left; 
				background:#424143; 
				border: solid 1px #d7d7d7; 
				overflow: hidden; 
				position: relative; 
			}
				.boxgrid img{ 
					position: absolute; 
					top: 0; 
					left: 0; 
					border: 0; 
				}
				.boxgrid p{ 
					padding: 0 10px; 
					color:#afafaf; 
					font-weight:bold; 
					font:8pt "Lucida Grande", Arial, sans-serif; 
				}
				
				.boxgrid a{ color:#C8DCE5; }
				
			.boxcaption{ 
				float: left; 
				position: absolute; 
				background: #000; 
				height: 100px; 
				width: 100%; 
				opacity: .8; 
				/* For IE 5-7 */
				filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
				/* For IE 8 */
				-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
 			}
 				.captionfull .boxcaption {
 					top: 150;
 					left: 0;
 				}
 				.caption .boxcaption {
 					top: 120;
 					left: 0;
 				}
				
				
				


#col1, #col2, #col3 {
	margin-top:10px;
	float:left;
	border-top: solid 1px #D7D7D7;
	width:248px;

	
}

#col2, #col3 {
margin-left:15px;
height:175px;

}

#col3 {
	padding-left:5px;
	padding-right:5px;
	height:150px;

}

#col2 {
	padding-top:15px;
	margin-bottom:30px;


}




	
.img_moi {
	float:left;
	margin-right:5px;
	border: solid 1px #D7D7D7; 
}
		

#moreportfolio {
	width:775px;
	margin-bottom:20px;
	
}

#moreportfolio h3{
font:18pt Arial, sans-serif; 
	font-weight: bold;
	color: #12cedf;
}

h3{
font:18pt Arial, sans-serif; 
	font-weight: bold;
	color: #12cedf;
	margin-top:10px;
}


#h3{
font:18pt Arial, sans-serif; 

	font-weight: bold;
	color: #12cedf;
}

#testimonials {
	width:300px;
	margin-bottom:20px;
	margin-top:20px;
	padding:10px;
	margin-right:10px;
	background-color:#d7f3f6;	
	
}

#testimonials p{
	color:#424143; 
	font:8pt "Lucida Grande", Arial, sans-serif; 
}


#form_left {
	width:380px;
	margin-bottom:20px;
	margin-top:20px;
	padding-top:10px;
	margin-right:10px;
	clear:both;
	float:left;
}

#form_right {
	width:320px;
	margin-bottom:20px;
	margin-top:20px;
	padding-top:10px;
	margin-right:10px;
	float:right;
	
	
}

#twitter {
	width:380px;
	margin-bottom:20px;
	margin-top:20px;
	padding-top:10px;
	clear:both;
	float:left;
}

#twitter ul{
	color:#d7d7d7;
}

#twitter h3{
	color:#12cedf;
}

#twitter a{
	color:#12cedf;
	font-size:9px;
}




			
			
			#form .champs, textearea {
				padding: 5px;
				width: 200px;
				font:9pt "Lucida Grande", Arial, sans-serif;
				letter-spacing:normal;
				line-height: 20px;
				font-size: 9px;
				margin-top:5px;
				border: 1px solid #d7d7d7;
			}
			
			
			#form textarea {
				height: 75px;
				margin-top:5px;
			}
			
			#form textarea:focus, #form input:focus {
			background-color:#d7d7d7;
			}
			
		
		
			
			label {
				float: left;
				margin-right: 15px;
				width: 150px;
				padding-top: 5px;
				color:#df1271;
				font:9pt "Lucida Grande", Arial, sans-serif;
				font-weight:bold;
				letter-spacing:normal;
			}
			
			#form, #formblabla h2 {
				font:18pt Arial, sans-serif; 
				letter-spacing:-1px; 
				font-weight: bold;
				color: #12cedf;
				margin-top:10px;
				margin-bottom:10px;
			
			}
			
		

#footer {
	height:270px;
	clear:both;
	background-color:#333333;
	background-image:url(img/bg_footer.png);
	padding-left:50px;
	
					} 
					
					
					
#footer p {
			color:#ffffff;
			font:7.5pt "Lucida Grande", Arial, sans-serif;
			
			}
			
#col3_footer a {
			font:12pt "Lucida Grande", Arial, sans-serif;
				font-weight: bold;
				color: #ffffff;
		
					}
					
	#col2_footer a {
			font:7.5pt "Lucida Grande", Arial, sans-serif;
				font-weight: bold;
				color: #12cedf;
		
					}
					
#col2_footer {
	padding-top:40px;
	float:left;
	padding-left:20px;
					}
					
					
#col2_footer h3 {
				font:12pt "Lucida Grande", Arial, sans-serif;
				font-weight: bold;
				color: #12cedf;
			
			}
			
#col3_footer {
	width:150px;
	padding-top:40px;
	float:left;
	padding-left:20px;
					}
					
					
#col3_footer h3 {
				font:12pt "Lucida Grande", Arial, sans-serif;
				font-weight: bold;
				color: #12cedf;
			
			}

#mail {
	margin-bottom:100px;
	margin-top:50px;
	width:784px;
	height:300px;
	float:left;
	border-top: solid 1px #D7D7D7;

			
			}
			
#mail p {
	color:#424143; 
	font:9pt "Lucida Grande", Arial, sans-serif;
	margin-left:10px;
}


		
#mail h3 {
			
				font:18pt Arial, sans-serif; 
				font-weight: bold;
				color: #12cedf;
				margin-top:10px;
				margin-bottom:10px;



}


#ti_description1, #ti_description2, #ti_description3 {
	width:240px;
	margin-top:10px;
	margin-bottom:10px;
	height:100px;
	float:left;
	border-bottom: solid 1px #D7D7D7;
	
}


#ti_description2 {
margin-left:21px;
	
}


#ti_description3 {
margin-left:22px;
	
}


#ti_description1 p, #ti_description2 p, #ti_description3 p{
	color:#424143;
	font-family:"Lucida Grande", Arial, sans-serif;
	font-size:9px;
}




#ti_description1, #ti_description2, #ti_description3 h3{
			font:12pt Arial, sans-serif; 
			font-weight: bold;
			color: #12cedf;

}


		#thumbs_portfolio{ 
				width: 250px; 
				height: 150px; 
				margin-right:9px; 
				margin-top:15px;
				float:left; 
				border: solid 1px #d7d7d7; 
			}
			
			
#description_portfolio {
	margin-bottom:30px;
	margin-top:20px;
	width:784px;
	float:left;
	
}

#description_portfolio p {
	color:#424143; 
	font:9pt "Lucida Grande", Arial, sans-serif;
	border-left:solid 3px #D7D7D7;
	padding-left:10px;
}




		
#description_portfolio h3 {
			
				font:18pt "Lucida Grande", Arial, sans-serif;
				font-weight: bold;
				color: #12cedf;
				margin-top:10px;
				margin-bottom:10px;

}

#description_portfolio h2 {
	color:#666666;
	font:7pt "Lucida Grande", Arial, sans-serif;
	margin-bottom:10px;
	border-left:solid 3px #12cedf;
	padding-left:10px;



}




#slideshow2 {
    position:relative;
    height:185px;
	width:784px;
	margin-top:10px;
	border: solid 1px #D7D7D7; 
	
}

#slideshow2 IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
}

#slideshow2 IMG.active {
    z-index:10;
}

#slideshow2 IMG.last-active {
    z-index:9;
}


#simpleligne {
	width:775px;
	margin-bottom:30px;
	margin-top:10px;
	border-top: solid 1px #D7D7D7;
	
}

#simpleligne h3{
font:18pt Arial, sans-serif; 
	font-weight: bold;
	color: #12cedf;
}


#simple {
	width:775px;
	margin-bottom:30px;
	margin-top:10px;
	
	
}

#simple h3{
font:18pt Arial, sans-serif; 
	font-weight: bold;
	color: #12cedf;
}



#autres {
	margin-bottom:10px;
	margin-top:50px;
	width:784px;
	height:300px;
	float:left;
	}




#slideshow3 {
    position:relative;
    height:400px;
	width:600px;
	margin-top:10px;
	border: solid 1px #D7D7D7; 
	
}

#slideshow3 IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
	    height:400px;
	width:600px;
	    opacity:0.0;
}

#slideshow3 IMG.active {
    z-index:10;
	opacity:1.0;
}

#slideshow3 IMG.last-active {
    z-index:9;
}



#div2 {
	margin-top:15px;
	float:left;
	margin-right:10px;
	width:382px;
	margin-bottom:50px;

	
}


#div2 h2 {
			
				font:18pt "Lucida Grande", Arial, sans-serif;
				font-weight: bold;
				color: #12cedf;
				margin-top:10px;
				margin-bottom:10px;

}



				#menu {
				  height:78px;
				  width:774px;
				  margin:20px 0  0  0;
				}
				
				#menu ul {
				display:block;
				float:right;
				width:774px;
				height:78px;
				list-style:none;
			  }
			  
		  #menu ul li {
    display:block;
    float:left;
    height:78px;
    text-indent:-10000px;
  }


			 #info {
				width:194px;
				background:url(img/menu1.jpg) no-repeat;
			  }
			  #portfolio {
				width:193px;
				background:url(img/menu2.jpg) no-repeat;
			  }
			  #services {
				width:193px;
				background:url(img/menu3.jpg) no-repeat;
			  }
			  #contact {
				width:194px;
				background:url(img/menu4.jpg) no-repeat;
			  }
			  
			  #menu ul li a {
				display:block;
				width:100%;
				height:100%;
			  }
  
  
  
			  #info a:hover {
				background:url(img/hover-menu1.jpg) no-repeat;
			  }
			  #portfolio a:hover {
				background:url(img/hover-menu2.jpg) no-repeat;
			  }
			  #services a:hover {
				background:url(img/hover-menu3.jpg) no-repeat;
			  }
			  #contact a:hover {
				background:url(img/hover-menu4.jpg) no-repeat;
			  }



/* SERVICES */


		#intro_cv {
				width:774px;
				height:56px;
				margin-top:15px;
				background-image:url(img/bg-triangle.jpg);
				
			
			}
			
	
			
			#intro_cv a {
				color:#df1271; 
				font-weight:bold; 
				font:14pt "Lucida Grande", Arial, sans-serif; 
				
			}