/****** CSS Portefolio // Scripted and Performed by Benoît Dietrich ©******/


/**Bases**/
a{text-decoration: none; color:#fff;}
a img{border: none;}
*{margin: 0;padding: 0;font-family: arial, sans-serif;}
.clear{clear: both;margin-top: -21px;}


/**Le background général**/
body{
    background: url('../img/bkg3.jpg') top left repeat #000;
}


/**Le haut**/
#header{
    width: 955px;
    background: url('../img/left.png') top left repeat-y transparent;	
    margin: 0 auto;
    padding-bottom: 16px;
}

	h1{
		padding-left: 32px;
        padding-top: 16px;
    }


/**Le contenu et les jobs**/
#content{
    position: relative;
	overflow: hidden;
    width: 955px;
    margin: 0 auto;
}

	#coloneLeft{
		position: relative;
		float: left;
   		z-index: 100;
   		width: 210px;
   		background: url('../img/left.png') top left repeat-y transparent;
    }
	
		#navProfil{
			position: relative;
			margin: -16px 20px 8px 0;
		}
		
			#navProfil a{
				display: block;
				float: right;	
			}
		
		.textProfil{
			position: relative;
    		float: left;
    		z-index: 100;
    		width: 145px;
			margin: 8px 0 8px 40px;
    		color: #fff;
    		font-size: 11px;
    		line-height: 15px;
    	}
		
   		
			.textProfil a{
  	 			text-decoration: underline;
  	  		}
			
		#web20{
			margin-left: 37px;	
		}
			
			#web20 a{
				display: block;
				float: left;
				margin: 3px;
			}
				
		form{
			float: left;
			margin: 8px 0 16px 40px;
		}
        	
        	input{
        	    border: 1px solid #000;
        	    height: 20px;
        		width: 130px;
        	}
        	
        	textarea{
        		font-size: 11px;
				border: 1px solid #000;
        	}
        	
        	input[type='submit']{
        		background-color: #fff;
        	}
			
			#download_cv{
				width: 130px;
				height: 16px;
				background-color: #fff;
				margin-bottom: 16px;
				margin-top: -16px;		
				text-align: center;
				border: 1px solid #000;
			}
			
				#download_cv a{
					text-decoration: none;
					color: #000;
				}
				
			#download_me{
				width: 130px;
				height: 16px;
				background-color: #fff;
				margin-bottom: 16px;
				margin-top: -16px;		
				text-align: center;
				border: 1px solid #000;
			}
				#download_me a{
					text-decoration: none;
					color: #000;
				}

		#jobs{
			position: relative;
			float: left;
			width: 722px;
			margin-left: 10px;
		}
		
			#jobPresentation{
				position: relative;
			}

				#titreJob{
					padding-top: 8px;
				}
			
				#jobPresentation h2{
					width: 200px;
					height: 20px;
					margin-left: 8px;
					margin-bottom: -5px;
					background-color: #acd5ee;
					border: 5px solid #acd5ee;
					border-radius: 7px 7px 0 0;
					-moz-border-radius-topright: 7px;
					-moz-border-radius-topleft: 7px;
					-webkit-border-radius-topright: 7px;
					-webkit-border-radius-topleft: 7px;
				}
								
					#imageJob{
						height: 460px;
						width: 690px;
						overflow: hidden;
						background-color: #020202;
						margin-left: 8px;
					}
					
					#labarre{
						position: relative;
						height: 460px;
						width: 7000px;
					}
					
						#labarre div{
							float: left;
							width: 690px;
							height: 460px;
							text-align: center;
						}
						
						#labarre iframe{
								float: left;
							width: 690px;
							height: 460px;
							text-align: center;
						}
				
					#numero{
						position: relative;
						margin-left: 8px;
						width: 500px;

					}
				
						#numero div{
							float: left;
							text-align: center;
							background-color: #33221b; 
							width: 20px;
							height: 15px;
							padding-top: 5px;
							padding-bottom: 5px;
							margin-bottom: 7px;
						}
					
					#descriptionJob{
						position: relative;
						width: 690px;
						margin: 8px 0 32px 8px;
						background: url("../img/job_description_bkg.png");
						padding-bottom: 8px;
						font-size: 12px;
						line-height: 16px;
						text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.1);
					}
					
						#descriptionJob p{
							float: left;
							width: 290px;
							margin: 8px;
						}
						
						#descriptionJob p a{
							color: #000;
							text-decoration: underline;
						}
					
							#date{
								margin: 8px;
								font-style: italic;
							}

			#listeJobs{
				position: relative;
				width: 742px;
			}
		
				.jobsIcone{
					position: relative;
					float: left;
					overflow: hidden;
					width: 124px;
					height: 124px;
					background-color: #fff;
					margin: 8px;
				}
	
				
					.jobDetail{
						position: absolute;
						z-index: 100;
						width: 124px;
						height: 75px;
						background-color: #33221b;
						margin-top: 130px;
						border-top: solid 10px #acd5ee;
						border-radius: 10px 10px 0 0;
						-webkit-border-radius-topleft: 10px;
						-webkit-border-radius-topright: 10px;
						-moz-border-radius-topleft: 10px;
						-moz-border-radius-topright: 10px;
						color: #fff;
					}
					
						h2{
							font-size: 14px;
							margin: 3px;
						}
						
						h3{
							margin: 3px;
							font-size: 11px;
							font-weight: normal;
							font-style: italic;
						}
					
					.jobImage{
						position: absolute;
						z-index: 1;
					}
					
					.new{
						position:absolute;
						z-index: 200;	
					}

	#footer{
		background: url('../img/footer_01.png') repeat-x;
	}
	
		#footerBTN{
			width: 955px;
			height: 200px;
			margin: 0 auto;
			background: url('../img/footer_02.png') top right transparent no-repeat;
		}
