/***************** imports fonts *****************/

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,700);


@font-face {
	  font-family: 'FontAwesome';
	  src: url('../fonts/fontawesome-webfont.eot');
	  src: url('../fonts/fontawesome-webfont.eot') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff') format('woff'), url('../fonts/fontawesome-webfont.ttf') format('truetype'), url('../fonts/fontawesome-webfont.svg#fontawesomeregular') format('svg');
	  font-weight: normal;
	  font-style: normal;
}

/***************** STYLE GLOBAUX *****************/


a img{
	border:none;
}
a:active, a:focus{
	outline:none;
}

.clearer{
clear:both;
}

.invisible{
	display:none;
}

h1{
	font:18px 'Open Sans', Arial, sans-serif;
	margin:0 0 20px 0;
	font-weight:400;
	padding:3px 0 3px 10px;
	background:#F66606;
	color:#FFF;
}

h1 .petit-titre{
	font-size:15px;
}

h1.special{
	font:16px 'Open Sans', Arial, sans-serif;
	text-align:justify;
	color:#6a6a6a;
	margin:0;
	font-weight:400;
	padding:3px 0 3px 0px;
	background:#FFF;
}

h2{
	font:17px 'Open Sans' ,Arial, sans-serif;
	color:#F66606;
	margin:5px 0 15px 0;
	font-weight:400;
}

h2.titre-fin{
	font-size:26px;
	font-weight:300;
}

h3{
	font:bold 13px  'Open Sans', Arial, sans-serif;
	color:#464646;
	margin:12px 0 3px 0;
}

h4{
	font:bold 14px  'Open Sans', Arial, sans-serif;
	color:#CCC;
	margin:5px 0 7px 0;
	padding-left:20px
}

h5{
	padding:6px;
	color:#555;
	font-size:12px;
	font-weight:300;
}

p{
	font:13px 'Open Sans', Arial, sans-serif;
	text-align:justify;
	color:#464646;
	margin:4px 0 8px 0;
	font-weight:300;
	padding:0;
}

.accueil p, .accueil h1{
	font-size:16px;
	background:#FFF;
	color:#464646;
	margin:4px 0 10px 0;
	padding:0;
	font-weight:300;
}

strong{
	font-family:'Open Sans', Arial, sans-serif;
	font-weight:700;
}

strong.couleur{
	color:#F86E1C;
}

.nota{
	font-size:10px;
}

ul{
	margin:0;
	padding:0 0 0 15px;
}

li{
	font:13px 'Open Sans', Arial, sans-serif;
	color:#6a6a6a;
	padding:0 0 3px 0;
	list-style:square;
	margin:0;
	font-weight:300;
}

a:link, a:visited{
	font:1.1em 'Open Sans', Arial, sans-serif;
	text-decoration:none;
	color:#F66606;
	-webkit-transition-property: color;
	-webkit-transition-duration: 0.3s;
	-webkit-transition-timing-function: ease-out;
	/* When being supported by FF */
	-moz-transition-property: color;
	-moz-transition-duration: 0.3s;
	-moz-transition-timing-function: ease-out;
	/* … and if it's standardised one day (#optimism) */
	transition-property: color;
	transition-duration: 0.3s;
	transition-timing-function: ease-out;
}

a:hover, a:active{
	color:#555;
	text-decoration:none;
}

.centrer{
	text-align:center;
}

.aligne-droite{
	text-align:right;
}

.font-icone{
	font-family:'FontAwesome';
	cursor:default;
}

a .font-icone{
	cursor:pointer;
}

.couleur{
	color:#F66606;
}

/***************** STYLES Structure *****************/

body{
	width:100%;
	height:100%;
	padding:92px 0 0 0;
	margin:0;
	font:10px 'Open Sans', Arial, sans-serif;
	background:#f5f5f5;
	overflow-x:hidden;	
}

#container{
	margin:20px auto 0 auto;
	width:1000px;
	min-height:600px;
}

#container.accueil{
	margin:-35px auto 0 auto;
}

.conteneur{
	margin:0 auto 0 auto;
	width:1000px;
	position:relative;
}

#contenu{	
	float:left;
	width:638px;
	min-height:500px;
	position:relative;
	margin-top:20px;
	background:#FFF;
	-webkit-box-shadow: 1px 2px 1px 1px rgba(0,0,0,0.2);
	box-shadow: 1px 2px 1px 1px rgba(0,0,0,0.2);
}

#container.accueil #contenu{
	margin-top:35px;
}

#contenu.contact{
	width:1000px;
}

#colonne-right{
	float:right;
	width:322px;
	min-height:500px;
	margin-top:20px;
}

#colonne-right.accueil{
	margin-top:0px;
}

/**********header*********/

#header{
	position:absolute;
	z-index:1000;
	width:100%;
	top:0;
	height:92px;
	background:url(../images/background-header-repeat.jpg) repeat-y top center;
	-webkit-box-shadow: 0 2px 2px 2px rgba(0,0,0,0.3);
	box-shadow: 0 2px 2px 2px rgba(0,0,0,0.3);
}

#logo{
	display:block;
	position:absolute;
	top:5px;
	left:0;
}

#numero-telephone-mail{
	position:absolute;
	top:0;
	right:0;
	width:155px;
	padding:10px 0 0 5px;
	background:#999A9C;
	height:70px;
}

#numero-telephone-mail h3, #numero-telephone-mail a{
	color:#FFF;
	font-size:14px;
	padding:0;
	margin:0;
	font-weight:400;
}

#numero-telephone-mail a:hover .texte{
	text-decoration:underline;
}

#numero-telephone-mail .font-icone{
	font-size:15px;
	padding-right:10px;
}

.separation{
	display:block;
	width:100%;
	height:0;
	border-bottom:1px solid #FFF;
	margin:5px 0 5px 0;
}

#menu-langue{
	position:absolute;
	top:12px;
	right:187px;
}

#menu-langue a{
	display:block;
	margin-left:10px;
	float:left;
	font-size:15px;
	color:#f86e1c;
}

/*******menu top******/

#menu-top{
	position:absolute;
	top:40px;
	left:248px;
	padding:0;
	margin:0;
}

#menu-top li{
	float:left;
	list-style:none;
	margin:0 0 0 20px;
	padding:0;
	position:relative;
}

#menu-top a{
	display:block;
	height:48px;	
	font-size:14px;
	font-weight:300;
	color:#565757;
}

#menu-top a:hover{
	color:#f86e1c;
}

#menu-top a.actif{
	color:#f86e1c;
	border-bottom:4px solid #f86e1c;
}

#menu-top .sous-menu{
	position:absolute;
	top:100%;
	width:240px;
	background:#FFF;	
	z-index:100000;
	display:none;
	margin-top:4px;
}

#menu-top .survole .sous-menu{
	-webkit-box-shadow: 0 2px 2px 2px rgba(0,0,0,0.3);
	box-shadow: 0 2px 2px 2px rgba(0,0,0,0.3);
}

#menu-top .sous-menu ul, #menu-top .sous-menu ul li{
	margin:0;
	padding:0;
	width:100%;
}

#menu-top .sous-menu a{
	display:block;
	width:100%;
	text-align:left;
	height:30px;
	line-height:30px;
	transition:none;
}

#menu-top .sous-menu a span{
	padding-left:10px;
}

#menu-top .sous-menu a:hover, #menu-top .sous-menu a.actif{
	background:#F86E1C;
	color:#FFF;
	border:none;
}

#menu-top-mobile{
	display:none;
}

/*******slider******/

#conteneur-slider{
	width:100%;
	height:335px;
	overflow-x:hidden;
	position:relative;
}

.jquery-slider-wrapper{
	width:1920px;
	position:absolute;
	top:0;
	left:50%;
	margin-left:-960px;
}

#conteneur-slider .conteneur{
	position:absolute;
	margin:0 0 0 -500px;
	left:50%;
	top:0;
}

.infos-slider{
	position:absolute;
	top:40px;
	left:30px;
	height:265px;
	width:357px;
}

.infos-slider .moyenne{
	position:absolute;
	top:0;
	left:0;
	width:357px;
	height:130px;
}

.infos-slider .petite{
	position:absolute;
	bottom:0;
	left:0;
	width:180px;
	height:130px;
}

.infos-slider .orange{
	position:absolute;
	bottom:0;
	right:0;
	width:170px;
	height:130px;
	background:#f86e1c;
}

.infos-slider h2{
	color:#FFF;
	text-transform:uppercase;
	font-size:15px;
	margin:10px 0 0 10px;
	line-height:23px;
	font-weight:400;
}

.infos-slider a.voir-plus{
	display:block;
	position:absolute;
	bottom:10px;
	right:10px;
	width:62px;
	height:21px;
	background-color:#FFF;
	color:#f86e1c;
	text-align:center;
	line-height:21px;
}

.infos-slider .bout-de-cable, .infos-slider .bout-de-cable-2{
	position:absolute;
	top:-50px;
	left:10px;
	z-index:1000;
}

.infos-slider .bout-de-cable-2{
	left:320px;
}

/**********footer*********/

#footer{
	position:relative;
	height:152px;
	background:url(../images/background-footer.jpg) no-repeat bottom center;
	margin-top:40px;
	padding-top:33px;
	position:relative;
}

#footer h2{
	background:#999a9c;
	height:33px;
	text-align:center;
	text-transform:uppercase;
	font-size:18px;
	line-height:33px;
	font-weight:300;
	color:#FFF;
	margin:0;
	padding:0;
	position:absolute;
	top:0;
	left:0;
	width:100%;
}

#footer h2 span{
	display:block;
	text-align:center;
	width:1000px;
	position:absolute;
	left:50%;
	top:0;
	margin-left:-500px;
}

.contenu-footer{
	position:absolute;
	width:380px;
	top:50px;
	left:50%;
	margin-left:125px;
	height:120px;
}

.contenu-footer p{
	color:#FFF;
	font-size:13px;
	width:200px;
	float:left;
}

.contenu-footer ul{
	float:right;
	width:150px;
	margin:5px 0 0 0;
	padding:0;
}

.contenu-footer ul li{
	list-style:none;
	margin:0;
	padding:0;
}

.contenu-footer ul li a{
	color:#FFF;
}

.contenu-footer ul li a:hover{
	text-decoration:underline;
}

.bt-arkanite{
	display:block;
	width:100px;
	height:25px;
	position:absolute;
	bottom:8px;
	right:10px;
	background:url(../images/arkanite-logo.png) no-repeat top left;
}

.bt-arkanite span{
	display:none;
}

.bt-arkanite:hover{
	background-position:bottom left;
}

/**********colonne right *********/

.encart{
	background:#FFF;
	padding-top:35px;
	position:relative;
	margin-bottom:30px;
	-webkit-box-shadow: 1px 2px 1px 1px rgba(0,0,0,0.2);
	box-shadow: 1px 2px 1px 1px rgba(0,0,0,0.2);
	min-height:100px;
}

.encart h2{
	background-color:#999a9c;
	color:#FFF;
	margin:0;
	padding:0;
	font-size:16px;
	font-weight:300;
	height:35px;
	line-height:35px;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	text-align:center;
	z-index:10;
}

.encart h2 .font-icone{
	padding-right:10px;
}

.encart .wrapper-actu{
	padding:10px;
}

.encart .wrapper-actu img{
	float:left;
	max-width:115px;
	max-height:88px;
	padding:0 10px 10px 0;
}

.encart .wrapper-actu h3, .encart .wrapper-actu p{	
	font-size:12px;
	color:#464646;
	font-weight:300;
	text-align:left;
	margin:0;
	padding:0;
}

.encart .wrapper-actu h3{
	font-weight:700;
	text-transform:uppercase;
}

.encart .encart .separation{
	height:0;
	width:150px;
	margin:10px auto;
	border-bottom:1px solid #e2e2e2;
}

.encart .wrapper-actu h3{
	padding:0;
	margin:0;
}

.encart .wrapper-actu a.lire-plus{
	display:block;
	height:21px;
	width:67px;
	line-height:21px;
	font-size:12px;
	font-weight:400;
	text-align:center;
	color:#FFF;
	background-color:#F86E1C;
	float:right;
}

.encart .wrapper-actu a:hover.lire-plus{
	background:#e65601;
}

.conteneur-plaquette{
	padding:15px;
}

.conteneur-plaquette .front{
	float:left;
	padding:0 10px 10px 0;
}

#conteneur-flag-plaquette{
	float:left;
	width:100px;
	margin-left:20px;
}

#conteneur-flag-plaquette div{
	margin-left:20px;
}

#conteneur-flag-plaquette a{
	display:block;
	width:21px;
	height:21px;
	float:left;
	margin:7px;
	border:2px solid #FFF;
}

#conteneur-flag-plaquette a:hover{
	border:2px solid #F86E1C;
}

/**********pages générales*********/

#contenu-texte{
	padding:20px 10px 20px 30px;
}

.colgauche{
	width:47%;
	float:left;
}

.coldroite{
	width:47%;
	float:right;
}

#conteneur-titrepage{
	background:#74ca28;
	height:55px;
	width:100%;
	position:relative;
}

/**********page accueil*********/


#menu-accueil a:hover{
	color:#666;
}

img#logo-accueil{
	margin:10px 0 10px 40px;
}


/**********page contact*********/

.coldroite-contact{
	float:right;
	width:400px;
	margin:20px;
}

#cadre-googlemap{
	height:257px;
	width:400px;
	margin-bottom:30px;
}

.liste-contact{
	padding:0;
}

.liste-contact li{
	list-style:none;
	font-size:16px;
	margin-bottom:10px;
}

.liste-contact li .font-icone{
	display:block;
	width:50px;
	text-align:center;
	float:left;
	padding-top:3px;
}

#colonne-formulaire{
	margin:20px;
	width:510px;
	float:left;
}

#colonne-formulaire label {
	font:15px 'Open Sans', Arial, sans-serif;
	color:#777777;
	font-weight:300;
	line-height:28px;
	width:100%;
	display:block;
	margin-bottom:10px;
}

#colonne-formulaire input[type=text], #colonne-formulaire textarea{
	width:350px;
	border:1px solid #c7cbce;
	height:28px;
	line-height:22px;
	float:right;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	padding:0 4px 0 4px;
	font-size:13px;
	font-weight:300;
	margin-right:12px;
}

#colonne-formulaire input[type=text]:hover, #colonne-formulaire textarea:hover{
	border:1px solid #F88640;
	background-color:#F5F5F5;
}

#colonne-formulaire textarea {
	height:60px;
}

#colonne-formulaire textarea.commentaire {
	height:90px;
}

.capcha{
	float:right;
}


#bouton-envoi{
	float:right;
	margin:10px 0 10px 0;
	width:340px;
	clear:both;
}

.bouton_envoyer{
	width:122px;
	height:28px;
	background-color:#F88640;
	border:1px solid #F88640;
	color:#FFF;
	font-weight:bold;
	text-align:center;
	line-height:28px;
	border-radius:3px;
	-webkit-transition-property: background-color color;
	-webkit-transition-duration: 0.3s;
	-webkit-transition-timing-function: ease-out;
	/* When being supported by FF */
	-moz-transition-property: background-color color;
	-moz-transition-duration: 0.3s;
	-moz-transition-timing-function: ease-out;
	/* … and if it's standardised one day (#optimism) */
	transition-property: background-color color;
	transition-duration: 0.3s;
	transition-timing-function: ease-out;
	float:right;
	cursor:pointer;
}

.bouton_envoyer:hover{
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
	background:#ED3902;
}

.asterix{
	color:#F88640;
}

/********** fin STYLE contact ***********/



/********** STYLE Préstations ***********/

#presentation-prestation{
	margin-top:20px;
	background:#FFF;
	-webkit-box-shadow: 1px 2px 1px 1px rgba(0,0,0,0.2);
	box-shadow: 1px 2px 1px 1px rgba(0,0,0,0.2);
	width:100%;
}

#contenu.prestations{
	float:right;
	width:710px
}

#menu-left-prestation{
	width:270px;
	float:left;
	margin-top:20px;
}

#menu-left-prestation .bt-revenir{
	display:block;
	width:100%;
	text-align:center;
	font-size:16px;
	line-height:30px;
	background:#999A9C;
	height:40px;
	line-height:40px;
	color:#FFF;
	margin-bottom:20px;
}

#menu-left-prestation .bt-revenir:hover{
	background:#7A7A7A;
}

#menu-left-prestation .conteneur-liste{
	background:#FFF;
	-webkit-box-shadow: 1px 2px 1px 1px rgba(0,0,0,0.2);
	box-shadow: 1px 2px 1px 1px rgba(0,0,0,0.2);
	padding-bottom:5px;
}

#menu-left-prestation .bt-revenir .font-icone{
	padding-right:10px;
}

#menu-left-prestation h2{
	background:#F86F1E;
	padding:6px 0 6px 0;
	color:#FFF;
	text-align:center;
	margin:0 0 10px 0;
}

#menu-left-prestation ul{
	margin:0;
	padding:0;
}

#menu-left-prestation li{
	list-style:none;
	margin-bottom:15px;
	padding-right:10px;
	padding-left:10px;
}

#menu-left-prestation li.actif{
	background:#DDD;
}

.cat-prestation{
	width:490px;
	height:220px;
	float:left;
	margin:20px 16px 0 0;
	background:#FFF;
	-webkit-box-shadow: 1px 2px 1px 1px rgba(0,0,0,0.2);
	box-shadow: 1px 2px 1px 1px rgba(0,0,0,0.2);
	position:relative;
	overflow:hidden;
}

.cat-prestation.special{
	height:220px;
}

.cat-prestation h1{
	font-size:16px;
	padding:6px 0 6px 10px;
	margin:0 0 10px 0;
}

.cat-prestation .texte{
	padding:0 10px 10px 10px;
}

.cat-prestation a{
	display:block;
	width:470px;
	height:164px;
	opacity:0.9;
	filter : alpha(opacity=90);
	-webkit-transition-property: opacity;
	-webkit-transition-duration: 0.3s;
	-webkit-transition-timing-function: ease-out;
	/* When being supported by FF */
	-moz-transition-property: opacity;
	-moz-transition-duration: 0.3s;
	-moz-transition-timing-function: ease-out;
	/* … and if it's standardised one day (#optimism) */
	transition-property: opacity;
	transition-duration: 0.3s;
	transition-timing-function: ease-out;
}

.cat-prestation a:hover{
	opacity:1;
	filter : alpha(opacity=100);
}

.cat-prestation h2{
	position:absolute;
	bottom:0;
	left:0;
	height:51px;
	width:480px;
	line-height:51px;
	background:url(../images/bg-opacite-savoir-faire.png) repeat top left;
	margin:0;
	padding:0 0 0 10px;
	color:#FFF;
	font-size:24px;
	font-weight:700;
}

#menu-left-projet{
	float:left;
	width:286px;
}

#menu-left-projet a{
	display:block;
	font-size:13px;
	color:#777;
	border:1px solid #DDD;
	background-color:#FFF;
	-webkit-box-shadow: 1px 1px 2px 2px #EEE;
	box-shadow: 1px 1px 2px 2px #EEE;
	padding:5px 20px 5px 20px;
	margin-bottom:10px;
	-webkit-transition-property: background-color;
	-webkit-transition-duration: 0.3s;
	-webkit-transition-timing-function: ease-out;
	/* When being supported by FF */
	-moz-transition-property: background-color;
	-moz-transition-duration: 0.3s;
	-moz-transition-timing-function: ease-out;
	/* … and if it's standardised one day (#optimism) */
	transition-property: background-color;
	transition-duration: 0.3s;
	transition-timing-function: ease-out;
}

#menu-left-projet a span.lieu{
	color:#74ca28;
	display:block;
	padding-top:8px;
}

#menu-left-projet a.actif, #menu-left-projet a:hover.actif{
	color:#FFF;
	background-color:#74ca28;
}

#menu-left-projet a.actif span.lieu, #menu-left-projet a:hover.actif span.lieu{
	color:#5f5f5f;
}

#menu-left-projet a:hover{
	background-color:#F5F5F5;
}

#conteneur-projet{
	width:623px;
	float:right;
}


#conteneur-projet img #contenu-texte img{
	padding:8px;
}


#conteneur-projet h1{
	font-size:24px;
	color:#74ca28;
	font-weight:300;
}

#conteneur-projet h1 span{
	font-size:13px;
	color:#777777;
	font-weight:700;
}

table.tableau-images{
	width:100%;
	margin-top:20px;
}

table.tableau-images td{
	text-align:center;
	padding-bottom:10px;
	width:33%;
	font-size:13px;
	color:#999;
	vertical-align:top;
}

table.tableau-images.deux td{
	width:50%;
}

#contenu.prestations img{
	cursor:pointer;	
}

#contenu.prestations img:hover{
	opacity:0.8;
	filter:alpha(opacity=80);	
}

/********** STYLE plan du site ***********/

#plan-site{
	margin:20px 0 0 0px;
}

#plan-site li{
	margin:5px 0 5px 20px;
	list-style:none;
}

#plan-site li a{
	font-size:18px;
}

#plan-site li ul li{
	background:none;
	margin:2px 0 2px 10px;
}

#plan-site li ul li a{
	font-size:15px;
}

/***************** STYLES page Moyens *****************/

.visage{
	float:left;
	text-align:center;
	width:20%;
	color:#777777;
	font-size:12px;
}

/**********page actualités *********/

#contenu.actualites{
	float:right;
	width:700px;
}

#menu-actualites{
	float:left;
	width:280px;
	min-height:500px;
	position:relative;
	margin-top:20px;
	background:#FFF;
	-webkit-box-shadow: 1px 2px 1px 1px rgba(0,0,0,0.2);
	box-shadow: 1px 2px 1px 1px rgba(0,0,0,0.2);
}

#menu-actualites h2{
	color:#FFF;
	background:#F66606;
	padding:15px;
	margin:0;
}

#menu-actualites .voir-menu-actu{
	display:none;
	width:100%;
	text-align:center;
	font-size:16px;
	margin:10px 0 10px 0;
}

#menu-actualites ul{
	margin:10px 0 0 0;
	padding:20px;
}

#menu-actualites li{
	list-style:none;
	margin:0 0 10px 0;
}

#menu-actualites li a{
	display:block;
	padding:30px 10px 10px 10px;
	background:#F2F2F2;
	color:#999;
	position:relative;
}

#menu-actualites li a:hover{
	background:#E0E0E0;
}

#menu-actualites li a .date{
	position:absolute;
	top:5px;
	right:5px;
	font-size:11px;
}

#contenu.actualites .date{
	float:right;
	display:block;
	margin-bottom:10px;
	padding:3px 5px 3px 5px;
	background:#999A9C;
	color:#FFF;
	
}

/**********page clients partenaires *********/

#contenu.clients-partenaires{
	width:100%;
}

#image-carte{
	margin-bottom:20px;
}

.colonne-partenaire{
	width:290px;
	float:left;
	margin-left:40px;
	text-align:center;
}

.colonne-partenaire.premier{
	margin-left:0px;
}

.colonne-partenaire h3{
	color:#f66606;
	text-transform:uppercase;
	font-size:27px;
	font-weight:300;
}

.colonne-partenaire p, .colonne-partenaire li span{
	text-transform:uppercase;
	font-weight:300;
	font-size:20px;
	color:#666666;
}

.colonne-partenaire ul{
	margin:0;
	padding:0;
}

.colonne-partenaire li span{
	text-transform:none;
}

.colonne-partenaire li{	
	text-align:left;
	list-style:disc;
	font-size:13px;
	line-height:25px;
	margin:0;
	padding:0;
}

.colonne-partenaire li strong{
	text-transform:uppercase;
	font-weight:300;
}

h2.titre-partenaire{
	text-align:center;
	font-size:30px;
	font-weight:300;
	margin-top:30px;
}


