/**
 * @CSS DOCUMENT
*/
@font-face{
font-family:"EurostileNextW01-Light";
src:url("Fonts/10f542b3-9979-490e-bb67-f3e662cedfa9.eot?#iefix");
src:url("Fonts/10f542b3-9979-490e-bb67-f3e662cedfa9.eot?#iefix") format("eot"),url("Fonts/bb76a89c-b59b-4eaa-9b89-732c141aa12c.woff2") format("woff2"),url("Fonts/91cd8b4d-6789-4d4b-9ed3-c6b52e9cb0ae.woff") format("woff"),url("Fonts/83b619ca-db67-4f42-84c9-25dec6351887.ttf") format("truetype"),url("Fonts/fe22b722-9a8d-4645-be39-4bb8f0b048ac.svg#fe22b722-9a8d-4645-be39-4bb8f0b048ac") format("svg");
}
@font-face{
font-family:"EurostileNextW01-SmBd";
src:url("Fonts/b064692f-59f1-4d8b-a899-a82a486028a4.eot?#iefix");
src:url("Fonts/b064692f-59f1-4d8b-a899-a82a486028a4.eot?#iefix") format("eot"),url("Fonts/17017719-0cd8-4d3d-a5af-5288ca49d4f8.woff2") format("woff2"),url("Fonts/f5e1f63d-a59b-4f88-a0c5-55f863443051.woff") format("woff"),url("Fonts/63768ea5-be6a-400b-b964-f7469df9bf0b.ttf") format("truetype"),url("Fonts/6ac4ebbc-7e05-49a5-a85f-ffb747cb05a2.svg#6ac4ebbc-7e05-49a5-a85f-ffb747cb05a2") format("svg");
}

/**----------------- 
 * GLOBAL RESET 
-----------------**/
*, html, body, iframe, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, table, th, td, audio, video { 
	margin:0; padding:0; outline:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; 
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, img { display:block; }
table { border-collapse:collapse; border-spacing:0; }
table td { vertical-align:top; }
iframe, fieldset, img, a img { border:0 none; }
address, caption, cite, code, dfn, th, var { font-style:normal; font-weight:normal; text-align:left; } 
h1, h2, h3, h5, h5, h6 { font-size:100%; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
html>body * a { position:relative; }  /* Gets links displaying over a PNG background */
a { outline:none; } /* Gets rid of Firefox's dotted borders */
textarea, table, td, th, code, pre, samp { word-wrap: break-word; /* passage à la ligne forcé */
   -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; /* césure propre */
}
input, select { vertical-align:middle; }
ol, ul, li { list-style:none; }
strong, b { font-family:"EurostileNextW01-SmBd",Arial,helvetica,sans-serif; }
em, i { font-style:italic; }
img { width: 100%; }
/**------------------------------
 * GENERAL CLASSES and SETTINGS
--------------------------------**/
html, body { height: 100%; }
body { background-color:#eee; font:1em/1.3em "EurostileNextW01-Light",Arial,helvetica,sans-serif; color:#000; text-align:left; }

h1 { padding:0.2em 0; font:normal 1.5em/1.0em "EurostileNextW01-SmBd",Arial,helvetica,sans-serif; color:#009fe3; }
h2 { padding:0.5em 0; font:normal 1.3em/1.0em "EurostileNextW01-SmBd",Arial,helvetica,sans-serif; color:#009fe3; }
h3 { padding:0.5em 0; font:normal 1.0em/1.0em "EurostileNextW01-SmBd",Arial,helvetica,sans-serif; }
h4 { padding:0.5em 0; font:normal 1.0em/1.0em "EurostileNextW01-SmBd"Arial,helvetica,sans-serif; }
h5 { padding:0.5em 0; font:normal 1.0em/1.0em "EurostileNextW01-SmBd"Arial,helvetica,sans-serif; }
h6 { padding:0.5em 0; font:normal 1.0em/1.0em "EurostileNextW01-SmBd",Arial,helvetica,sans-serif; }

a { color:#000; text-decoration:underline }
a:hover, a:focus { color:#009fe3; text-decoration:underline }
a.active { color:#009fe3; font-family:"EurostileNextW01-SmBd",Arial,helvetica,sans-serif; }
p { padding:0 0 1.5em; }

hr { display:block; margin:1em 0; padding:0; border:none; background-color:#000; color:#000; font-size:1px; height:1px; line-height:1px; }

/** Formulaires */
form { margin:1em 0; }
form p { clear:both; margin:0.3em 0; padding: 0; }
form label { display:block; float:left; padding:0.1em 0; width:75%; cursor:pointer; }
form input[type="text"], form input[type="password"], form textarea, form select { 
	padding:0.3em 0.5em; width:100%; font:1.0em/1.2em "EurostileNextW01-Light",Arial,Helvetica,sans-serif; color:#000; background-color:#fff; border-left:1px solid #888; border-bottom:1px solid #888; border-right:1px solid #888; border-top:1px solid #888; border-radius:0.5em; 
}
form select { margin-bottom: 0.1em; padding: 0.2em 0.5em; }
form input[type="text"]:focus, form input[type="password"]:focus, form textarea:focus { border-color:#009fe3; }
form textarea { height:10em; }
form input[type="submit"], form input[type="button"] { 
	margin:1em 0; padding:0.5em 1em; font-family: "EurostileNextW01-Light",Arial,Helvetica,sans-serif; font-size:1.0em; line-height:1em; text-transform:uppercase; border:none; border-radius:0.5em; background-color:#888; color:#fff; text-decoration:none; box-shadow:1px 1px 5px 1px #ccc; cursor:pointer; 
}
form input[type="submit"]:hover, form input[type="submit"]:focus { background-color:#009fe3; -moz-box-shadow:0px 0px 1px 0px #ccc; -webkit-box-shadow:0px 0px 1px 0px #ccc; box-shadow:0px 0px 1px 0px #ccc; }
.code-image { clear:both; margin:1em 0; }
.code-image label { display:block; float:none; margin-bottom:0.5em; width:100%; }
.code-image img { border:medium none; float:left; margin:0 0.5em 0 0; width:150px; border-radius:inherit; }
.code-image .formfield { height:50px; width:140px; text-align:center; letter-spacing:0.4em; text-transform:uppercase; }

.clear-float { clear:both; }
.clear-fix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clear-fix { zoom:1; } /** IE 5.5/6/7 */
.imgToLeft { margin:0 auto 1em; max-width:250px; }
.imgToRight { margin:0 auto 1em; max-width:250px; }

.wrapper { margin: 0 auto; max-width: 1280px; }

/**--------------
 * HEADER 
--------------**/
#header { background-color: #fff; }
#header .wrapper { position: relative; padding-top: 1px !important; }
#header .logo { display:block; margin: 0.5em 0; max-width: 390px; width: 94%; }
#ctn-menu { float: left; width: 100%; }
#slider { position:relative; float:left; margin-top:1.5em; width:100%; min-height:184px; overflow:hidden; }
#slider .slides li { position:absolute; top:0; }
#slider li:nth-child(1) { z-index:10; }
#slider li:nth-child(2) { z-index:9; }
#slider li:nth-child(3) { z-index:8; }
#slider li:nth-child(4) { z-index:7; }
#slider li:nth-child(5) { z-index:6; }
#slider iframe { border:none; display:block; width:100%; height:250px; }
#slider video { width:100%; height:auto; }
/**********************************
	# MENU
**********************************/
#toggle-menu { cursor:pointer; color:#888; font-size:1.5em; line-height:30px; position:absolute; left:5.5%; margin-top:-17px; z-index:11; }
#toggle-menu.active { color:#009fe3; }
#menu { background-color: #fff; box-shadow:0 3px 3px rgba(0, 0, 0, 0.3); margin: 1em 0 0; padding: 0.5em 5.5%; position: absolute; text-align: left; z-index: 11; width: 100%; }
#menu.inactive { display: none; }
#menu li.btn-menu a { color:#888; font-size: 1.5em; line-height: 1.6em; text-decoration:none; white-space: nowrap; }
#menu li.btn-menu a:hover { color: #009fe3; } 
#menu li.current a { color: #009fe3; }

/*************************************
	* Main, content
*************************************/
#main { border-top: 15px solid #009FE3; }
.home #main { border-top: none; }
#ctn-info { background: #009FE3; color: #fff; }
#ctn-info h2, #ctn-info a { color: #fff; }
#ctn-info .ctn-news .text { font-size:1.8em; line-height:1.2em }
#ctn-info .ctn-news img { width:auto; }
#ctn-info .ctn-news, #ctn-info .ctn-contact { float: left; padding:1em 5.5%; width: 100%; }
#ctn-info .ctn-news { background: transparent url('/images/template/bkg-repeat-blue.png') repeat left top; border-top: 1px solid #00b4ea; border-bottom: 1px solid #00b4ea; }
#ctn-info .ctn-contact div { display:inline-block; padding:0; width: 49%; vertical-align: top; }
#ctn-info .ctn-news h2, #ctn-info .ctn-contact h2 { padding:0; }

#content { background: transparent url('/images/template/bkg-repeat.png') repeat-x top left; position: relative; padding: 3em 5.5% 2em; }
.home #content { padding: 1em 1%; }
#content h1 { font-size:1.8em; margin-bottom:1em; }
#content .text { max-width:960px; font-size:1.4em; line-height:1.3em; }
#content .text h2 { font-size:1em; }
#content .service h1 { font-size:1.3em; line-height:1.2em; margin:0; }
#content .service:nth-child(2) h1 { color: #de001a; }
#content .service:nth-child(3) h1 { color: #f7b134; }
#content .service:nth-child(4) h1 { color: #6c1f80; }
#content .service:nth-child(5) h1 { color: #1fa02d; }
#content .service { border: 1px solid transparent; padding: 1em 2%; position: relative; width: 100%; }
#content .service:hover { background-color: #fff; border-color: #ccc; }
#content .service a { position: absolute; top: 0; right: 0; height: 100%; width: 100%; text-indent: -9999px; }
#content .service img { float:left; margin-right:5%; width:40%; }

#content .serviceBlk { position:relative; padding:1em; border-bottom:1px solid #ccc; }
#content .serviceBlk:hover { background-color:#fff; }
#content .serviceBlk a { position: absolute; top: 0; right: 0; height: 100%; width: 100%; text-indent: -9999px; }

#content #form-contact { width: 100%; }

.ctn-photos { clear:both; padding:1em 0; }
.ctn-photos .item { float:left; margin:0.5%; width:49%; }
#content .ctn-photos img { display:block; max-width:none; }

/***************************************
	# Footer
***************************************/
#footer .wrapper { border-top:2px solid #aaa; padding:2em 5.5%; color:#888; text-align:center; }
#footer .copyright { font-size:0.8em; padding-right:40px; }
a.goTop { display:inline-block; float:left; width:40px; height:20px; line-height:20px; background:transparent url('../images/template/fleche.png') top center no-repeat; text-indent:-9999px; }
a.goTop:hover, a.goTop:focus { background-position:bottom center; }

/**=====================================================
   ECRANS smartphones paysage
====================================================== */
@media (min-width:480px) {
	#header .logo { margin-left: 1%; }
	#content .service img { width: 35%; }
}
/**=====================================================
   ECRANS taille moyenne : tablettes, petits notebooks
====================================================== */
@media (min-width:640px) {
	#header .logo { margin-left:2.5%; }
	#slider { min-height:327px; }
	#slider iframe { height:300px; }

	#content .service img { width: 25%; }
	.contact #content .text { float: left; width: 60%; }
	#content #form-contact { float: right; width: 40%; margin:0; }
	.imgToLeft { float:left; margin:0 1em 1em 0; }
	.imgToRight { float:right; margin:0 0 1em 1em; }
}

@media (min-width:950px) {
	#header .logo { margin: 3.5em 0 0.5em; }
	#ctn-menu { width: 31%; }
	#slider { margin:0; width:69%; max-width:880px; min-height:335px; }
	#slider iframe { height:450px }
	#slider video { max-width: 800px; }
	
	#toggle-menu { display: none; }
	#menu { background-color: transparent; border: none; box-shadow: none; margin: 0; position: static; padding: 0 6%; }
	#menu.inactive { display: block; }
	#menu li.btn-menu ul.sub-menu { box-shadow: 0 5px 4px rgba(0,0,0,0.6); display:none; position:absolute; left: 0; padding: 1.2em 0 1em; z-index:10; }

	#ctn-info .ctn-news, #ctn-info .ctn-contact {  padding:1em 2%; min-height:140px; width:50% }
	#ctn-info .ctn-news { border-top:none; border-bottom:none; border-left:1px solid #00b4ea; border-right:1px solid #00b4ea; }
	
	#content { padding: 3em 2% 2em; }
	#content .service { display: inline-block; padding: 1em 1%; vertical-align: top; width: 20%; }
	#content .service img { margin:0; width:100%; }
	
	.ctn-photos .item { margin:0.5%; width:24%; }
	
	#footer .wrapper { padding:2em 2%; }
}

/**=====================================================
   ECRANS + grands
====================================================== */
@media (min-width:1280px) {
	#slider { height:450px; }
}