/* parametres generaux */
@font-face {
	font-family:'MyriadPro';
	src:url('font/MyriadPro-Regular.otf');
	font-weight: normal;
    font-style: normal;
}
@font-face {
	font-family:'MyriadPro';
	src:url('font/MyriadPro-It.otf');
	font-weight: normal;
	font-style: italic;
}
@font-face {
	font-family:'MyriadPro';
	src:url('font/MyriadPro-Bold.otf');
	font-weight: bold;
	font-style: normal;
}
@font-face {
	font-family:'MyriadPro';
	src:url('font/MyriadPro-BoldIt.otf');
	font-weight: bold;
	font-style: italic;
}
@font-face {
	font-family:'Eurosti';
	src:url('font/Eurosti.ttf');
	font-weight: normal;
    font-style: normal;
}
* {
    margin: 0;
    padding: 0;
    border: 0;
	list-style:none;
}

body { 
	font-family: 'MyriadPro', Arial, sans-serif;
	font-size: 13px;
	text-align: center;
	text-decoration: none;
	text-align: left;
	background:#6cb0a9;
	position:relative;
}
.clear {
	clear:both;
}
/* BLOC */
#bloc.accueil {
	position: absolute;
	width: 343px;
	height:173px;
	left: 850px;
	top: 150px;
	background:url("img/structure/bloc.png") no-repeat;
}
#bloc.youtube {
	position: absolute;
	width: 343px;
	height:173px;
	left: 50px;
	top: 150px;
	background:url("img/structure/bloc.png") no-repeat;
}
#bloc.qui_sommes_nous {
	position: absolute;
	width: 343px;
	height:173px;
	left: 50px;
	top: 600px;
	background:url("img/structure/bloc.png") no-repeat;
}
#bloc.realisations, #bloc.technique {
	position: absolute;
	width: 343px;
	height:173px;
	left: 880px;
	top: 490px;
	background:url("img/structure/bloc.png") no-repeat;
}
#bloc.contact {
	position: absolute;
	width: 343px;
	height:173px;
	left: 20px;
	top: 580px;
	background:url("img/structure/bloc.png") no-repeat;
}
/* conteneur */
#conteneur {
  padding-bottom: 10px;
}
#conteneur.accueil, #conteneur.youtube { 
  background:#6cb0a9 url("img/structure/fond_accueil.jpg") no-repeat center fixed; 
  -webkit-background-size: cover; /* pour Chrome et Safari */
  -moz-background-size: cover; /* pour Firefox */
  -o-background-size: cover; /* pour Opera */
  background-size: cover; /* version standardisée */
}
#conteneur.qui_sommes_nous { 
  background:#6cb0a9 url("img/structure/fond_qui_sommes_nous.jpg") no-repeat center fixed; 
  -webkit-background-size: cover; /* pour Chrome et Safari */
  -moz-background-size: cover; /* pour Firefox */
  -o-background-size: cover; /* pour Opera */
  background-size: cover; /* version standardisée */
}
#conteneur.realisations { 
  background:#6cb0a9 url("img/structure/fond_realisations.jpg") no-repeat center fixed; 
  -webkit-background-size: cover; /* pour Chrome et Safari */
  -moz-background-size: cover; /* pour Firefox */
  -o-background-size: cover; /* pour Opera */
  background-size: cover; /* version standardisée */
}
#conteneur.technique { 
  background:#6cb0a9 url("img/structure/fond_technique.jpg") no-repeat center fixed; 
  -webkit-background-size: cover; /* pour Chrome et Safari */
  -moz-background-size: cover; /* pour Firefox */
  -o-background-size: cover; /* pour Opera */
  background-size: cover; /* version standardisée */
}
#conteneur.contact { 
  background:#6cb0a9 url("img/structure/fond_contact.jpg") no-repeat center fixed; 
  -webkit-background-size: cover; /* pour Chrome et Safari */
  -moz-background-size: cover; /* pour Firefox */
  -o-background-size: cover; /* pour Opera */
  background-size: cover; /* version standardisée */
}

/* header */ 
#header {
	width:1200px;
	height:158px;
	background:url("img/structure/header.png") left top no-repeat;
}

#navigation {
	padding: 105px 0 0 320px;
}
#navigagtion ul {
	width:620px;
	height:30px;
}

#navigation ul li {
	float:left;
	background:url("img/structure/fond_blanc.png") left top repeat;
	text-align: center;
	display:block;
	height:30px;
	-moz-box-shadow: 4px 4px 10px #000;
	-webkit-box-shadow: 4px 4px 10px #000;
	-o-box-shadow: 4px 4px 10px #000;
	box-shadow: 4px 4px 10px #000;
}
#navigation  ul li:nth-child(1) {
	border-right: 2px solid #fff;
	width: 90px;
	-webkit-border-radius: 20px 0 0 20px;
	-moz-border-radius:  20px 0 0 20px; 
	-o-border-radius:  20px 0 0 20px;
	border-radius:  20px 0 0 20px;
}
#navigation  ul li:nth-child(2) {
	border-right: 2px solid #fff;
	width: 190px;
}
#navigation  ul li:nth-child(3) {
	border-right: 2px solid #fff;
	width: 140px;
}
#navigation  ul li:nth-child(4) {
	border-right: 2px solid #fff;
	width: 110px;
}
#navigation  ul li:nth-child(5) {
	width: 90px;
	-webkit-border-radius: 0 20px 20px 0;
	-moz-border-radius:  0 20px 20px 0;
	-o-border-radius:  0 20px 20px 0;
	border-radius:  0 20px 20px 0;
}
#navigation ul li a {
	line-height:30px;
	font-size: 17px;	
	/* color:#fff; en blanc*/
	/* color:#6cb0a9; vert clair */
	color:#6f459b; /* violet*/
	text-decoration: none;
	display:block;
}
#navigation ul li a:hover {
	line-height:26px;
}

/* section */
#centre {
	padding: 80px 0 80px 320px;
	width: 620px;
}
#article {
	background:url("img/structure/fond_blanc.png") left top repeat;
	color:#6cb0a9;
	font-size: 18px;
	text-align: center;
	text-decoration: none;
	font-weight: normal;
	font-style: italic;
	display:block;
	padding: 30px 10px;
	-moz-box-shadow: 4px 4px 10px #000;
	-webkit-box-shadow: 4px 4px 10px #000;
	-o-box-shadow: 4px 4px 10px #000;
	box-shadow: 4px 4px 10px #000;
		-webkit-border-radius: 20px;
	-moz-border-radius:  20px; 
	-o-border-radius:  20px;
	border-radius:  20px;
	
}
#article span {
	color: #6f459b;
}
#article .realisations .titre, #article .technique .titre {
	font-family: 'Eurosti', Arial, sans-serif;
	text-align: center;
	color: #6f459b;
	font-size: 22px;
	padding-bottom: 20px;
	font-weight: normal;
	font-style: normal;
}
 #article .realisations .titre {
	text-align: left;
}
#article .technique , #article .contact {
	float: left;
	width: 50%;
	color: #fff;
}
#article .contact {
	text-align: left;
	font-style: italic;
	color: #6f459b;
	font-size: 13px;
}
#article .contact .titre {
font-family: 'Eurosti', Arial, sans-serif;
	color: #6f459b;
	font-size: 24px;
	font-style: normal;
}
#article .contact .sous_titre {
font-family: 'Eurosti', Arial, sans-serif;
	color: #6f459b;
	font-size: 18px;
	padding: 0;
	font-style: normal;
}
#article .contact .erreur {
	color:#c40000;
	font-size: 10px;
	float:right;
	margin-right: 20px;
}
#article .contact input[type=text] {
	display: block;
	height: 18px;
	width: 280px;
	padding: 4px;
	margin-bottom: 4px;
}
#article .contact textarea {
	display: block;
	height: 100px;
	width: 280px;
	padding: 4px;
	margin-bottom: 20px;
}
#article .contact input[type=submit] {
	margin: 0 auto;
	display: block;
	height: 26px;
	width: 160px;
	padding: 2px;
	-moz-box-shadow: 4px 4px 10px #000;
	-webkit-box-shadow: 4px 4px 10px #000;
	-o-box-shadow: 4px 4px 10px #000;
	box-shadow: 4px 4px 10px #000;
	-webkit-border-radius: 20px;
	-moz-border-radius:  20px; 
	-o-border-radius:  20px;
	border-radius:  20px;
	background: #6f459b;
	color:#6cb0a9;
	cursor: pointer;
	line-height: 24px;
}
#article .contact input[type=submit]:hover {
line-height: 18px;
}
#article .contact a {
	color:#6cb0a9;
	text-decoration: none;
}
#article .contact a:hover {
	color:#6cb0a9;
	text-decoration: underline;
}
#article .technique img {
	border: 4px solid #6cb0a9;
	-moz-box-shadow: 4px 4px 10px #000;
	-webkit-box-shadow: 4px 4px 10px #000;
	-o-box-shadow: 4px 4px 10px #000;
	box-shadow: 4px 4px 10px #000;
		-webkit-border-radius: 10px;
	-moz-border-radius:  10px; 
	-o-border-radius:  10px;
	border-radius:  10px;
}
#article .realisations img {
	border: 4px solid #fff;
	-moz-box-shadow: 4px 4px 10px #000;
	-webkit-box-shadow: 4px 4px 10px #000;
	-o-box-shadow: 4px 4px 10px #000;
	box-shadow: 4px 4px 10px #000;
		-webkit-border-radius: 10px;
	-moz-border-radius:  10px; 
	-o-border-radius:  10px;
	border-radius:  10px;
}
#lien_brochure {
	width: 530px;
	height: 30px;
	text-align: right;
	background:url("img/structure/fond_blanc.png") left top repeat;
	-webkit-border-radius: 0 20px 20px 0;
	-moz-border-radius:  0 20px 20px 0;
	-o-border-radius:  0 20px 20px 0;
	border-radius:  0 20px 20px 0;
	-moz-box-shadow: 4px 4px 10px #000;
	-webkit-box-shadow: 4px 4px 10px #000;
	-o-box-shadow: 4px 4px 10px #000;
	box-shadow: 4px 4px 10px #000;
}
#lien_brochure a {
	height: 30px;
	padding: 0 46px 0 0;
	line-height:30px;
	font-size: 16px;	
	color:#6f459b;
	text-decoration: none;
	background:url("img/icone/pdf01.png") 496px 0px no-repeat;
	display:block;
}
#lien_brochure a:hover {
	line-height:25px;
}
/* réalisation */
.btn_realisation a {
	height: 233px;
	width: 500px;
	display:block;
	margin: 0 auto;
}
.btn_technique a {
	height:279px;
	width:200px;
	display:block;
	margin: 0 auto;
}
.btn_realisation a:hover, .btn_technique a:hover {
	margin-top:-10px;
	margin-bottom:10px;
}
/* footer */
#footer {
	height: 80px;
	padding: 26px 0 0 300px;
	background:#6cb0a9 ;
  -webkit-background-size: cover; /* pour Chrome et Safari */
  -moz-background-size: cover; /* pour Firefox */
  -o-background-size: cover; /* pour Opera */
  background-size: cover; /* version standardisée */
}
#copyright {
	float:left;	
	height: 80px;
	width:670px;
	text-align: center;
	font-size: 11px;	
	color:#fff;
	text-decoration: none;
}
#copyright a {
	color: #6f459b;
	text-decoration: none;
}
#copyright a:hover {
	text-decoration: underline;
}
#liens_sociaux {
	float:left;
	height: 80px;
	width:80px;
	text-align: left;
	padding-left:10px;
	
}
#liens_sociaux a {
	display:block;
	float:left;
	height: 40px;
	width: 40px;
}
#liens_sociaux a:hover {
	margin-top:-10px;
}