@charset "utf-8";

@font-face {
    font-family: 'GillSansStd-Light';
    src: url('interface/fonts/gillsansstdlight.eot');
    src: url('interface/fonts/gillsansstdlightd41d.eot?#iefix') format('embedded-opentype'),
    url('interface/fonts/gillsansstdlight.woff') format('woff'),
    url('interface/fonts/gillsansstdlight.ttf') format('truetype'),
    url('interface/fonts/gillsansstdlight.svg#gillsansstdlight') format('svg');
    font-weight: normal;
    font-style: normal;
} 

@font-face {
    font-family: 'GillSansStd';
    src: url('interface/fonts/gillsansstd.eot');
    src: url('interface/fonts/gillsansstdd41d.eot?#iefix') format('embedded-opentype'),
    url('interface/fonts/gillsansstd.woff') format('woff'),
    url('interface/fonts/gillsansstd.ttf') format('truetype'),
    url('interface/fonts/gillsansstd.svg#gillsansstd') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'GillSansStd-Bold';
    src: url('interface/fonts/gillsansstdbold.eot');
    src: url('interface/fonts/gillsansstdboldd41d.eot?#iefix') format('embedded-opentype'),
    url('interface/fonts/gillsansstdbold.woff') format('woff'),
    url('interface/fonts/gillsansstdbold.ttf') format('truetype'),
    url('interface/fonts/gillsansstdbold.svg#gillsansstdbold') format('svg');
    font-weight: normal;
    font-style: normal;
} 



/* STYLE INDEX */
#index{position:fixed; top:0px; left:0px; width:100%; height:100%; background-color:#aaa; filter:alpha(opacity=80); -moz-opacity:0.9; opacity:0.9; z-index:500;}
#imgindex{position:fixed; top:0px; left:0px; width:100%; height:100%; text-align:center; margin:auto; z-index:500;}
#imgindex a{text-decoration:none; color:#000; font-weight:bold; z-index:500;}
.cells_pub{width:800px; height:100%; vertical-align:middle; text-align:right; z-index:505;}
.close{position:relative; float:right; top:13px; right:-15px; z-index:509;}
/* STYLE INDEX */

BODY{width:100%; height:100%; margin:0 auto; text-align:left; font-size:16px; color:#1C1C1B; background:#dadada; font-family:GillSansStd;}

HTML{width:100%; height:100%;}

TABLE{margin:0 auto;}

IMG{border:0px;}

A, A:visited, A:link {text-decoration:none; color: inherit;}

H1 {text-align:center; font-size:2em; margin:-1em 0 0.5em 0;}

.vcenter{vertical-align:middle;}

#fond_bandeau {position:absolute; float:left; width:100%;  overflow:hidden; height:auto; top:0;}
#fond_bandeau img{position:relative; float:left; width:100%; height:auto;}

#bandeau{position:relative; width:100%; height:100%; margin:0 auto;}

#logo{position:absolute; float:left; top:3em; width:100%; height:auto; text-decoration:none;text-align:center;z-index:490;}
#logo>img {width:20%; height:auto;}

#menu{position:fixed; width:100%; height:auto; top:0; left:0; margin:0; padding:0; font-family:GillSansStd-Light; text-transform: uppercase; text-align:center; z-index:499;}
#menu img {width:18em; opacity:0.7;}
#menu.fixe {position:fixed; top:-15em; height:0; z-index:5000;}
#menu.fixe>img {opacity:1;}

#nav{position:fixed; display:block; width:100%; height:auto; border:none; padding:10px 0; top:0; left:0; font-family:GillSansStd-Light; font-size:1.1em; background:#666666;}

#nav li, #nav span{display:inline-block; height:auto; padding:0 15px; list-style-type:none; text-align:center;}
#nav li a, #nav span a{width:100%; height:100%; color:#ffffff;}
#nav a:hover, #nav a.over {font-weight:bold;}

#menu.fixe>#nav {top:0;}
#menu.fixe>img {-webkit-border-radius: 100%; border-radius: 100%;-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.7); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.7);}
#retour{display:none;}
#news {position:fixed; width:247px; height:auto; right:-5%; bottom:0; z-index:500;}
#news:hover {right:-3%; -webkit-transition: right 0.5s;-moz-transition: right 0.5s;-ms-transition: right 0.5s;-o-transition: right 0.5s;transition: right 0.5s;}
#news_ombre {position: relative; float:right; display:none; width:257px; height:auto; margin-right:-8%; margin-top:0; z-index:5000;}
#news>img,#news_ombre>img {width:100%;}

#book {position:fixed; width:247px; height:auto; left:-5%; bottom:0; z-index:500;}
#book:hover {left:-3%; -webkit-transition: left 0.5s;-moz-transition: left 0.5s;-ms-transition: left 0.5s;-o-transition: left 0.5s;transition: left 0.5s;}
#book_ombre {position: relative; float:right; display:none; width:257px; height:auto; margin-right:-8%; margin-top:0; z-index:5000;}
#book>img,#book_ombre>img {width:100%;}


#conteneur{position:relative; width:70%; height:auto; margin:0 auto;padding-top:3em; }
#conteneur_large{position:relative; width:100%; height:auto; margin:0 auto;padding-top:3em; }

#contenu {position:relative; float:left; width:100%;}
#contenu a:hover {text-decoration:underline;}

#options {position:relative;  width:100%; margin:4em 0 2em 0;}
#options>ul {position:relative;width:50%; margin:0 auto;list-style:none;padding:0;}
#options>ul>li {position:relative; float:left; width:20%; text-align:center;}

#contact_gauche,#contact_droite {position:relative; float:left;}
#contact_gauche {width:28%;margin:1em 2% 0 0;}
#contact_droite {width:70%;}

#secu {position:relative; float:left; height:1.2em; width:auto;margin-top:0.1em;}
#contact_droite>form {margin:0 2% 1em 2%;}
label,input[type=text], input[type=password], textarea {position: relative; float:left; width:95%;}
label {font-weight:bold; font-size:1em; height:2em; line-height:3em; color:#4d4d4d;}
input[type=submit]{float:right; margin-right:5%;} 
textarea {resize:none;}

.chapo,.texte {position: relative; float:left; width:96%; margin:0 2% 0 2%; font-family:GillSansStd-Light;font-size:1.2em; text-align:left;}

.chapo {font-size:2.5em; text-align:center;}
.chapo,.texte p {margin:0 0 1em 0;} 
.chapo p {margin:0;}

h1.chapo {width:100%;}

.subpage {position:relative; float:left; width:100%; text-align:center;}
.orange {background-color:#E84B0F; color:#dadada;}
.picto {width:35%; margin:5em auto 0 auto; text-align:center;}

.savoir {position: relative; width:35%; margin:0 auto 2em auto; font-family:GillSansStd-Light;font-size:1em; text-align:center;}
.chapo_savoir,.texte_savoir,.titre_savoir {position: relative; float:left;  width:100%; margin:0 0 0.2em 0;}
.titre_savoir {/*float:right; width:50%; */font-size:2.5em;/*  margin-top:-4em;*/}
.chapo_savoir {font-size:1.5em; margin-bottom:0.5em;}
.texte_savoir {font-size:1.2em;}
.chapo_savoir p,.texte_savoir p {margin:0;} 

.noire {position:relative; float:left; width: 100%;background:#111111; z-index:100;}
.noire>span.next {position:absolute; width:100%;height:30%; top:0; background: url(interface/bt_suite_off.png) no-repeat top center;}
.noire>span.next:hover {background: url(interface/bt_suite_on.png) no-repeat top center;}
.noire>span.prev {position:absolute; width:50%; height:30%;left:50%; bottom:0; background: url(interface/bt_precedent_off.png) no-repeat 20% bottom;}
.noire>span.prev:hover {background: url(interface/bt_precedent_on.png) no-repeat 20% bottom;}
.noire>span.scroll {position:absolute; width:50%; height:30%; bottom:0; left:0; background: url(interface/bt_precedent_off.png) no-repeat 80% bottom;}
.noire>span.scroll:hover {background: url(interface/bt_precedent_on.png) no-repeat 80% bottom;}
.separation {position:absolute;float:left; width:100%;height:1px; top:75%;}

#nav_savoir {position:relative; width:40%; margin:0 auto 2em auto; list-style:none; padding:0; text-align:center;}
#nav_savoir>span {position:relative; /*float:left;*/ display:inline-block; width:20%; margin:0 0 1em 0; padding:1%; text-align:center; text-transform:uppercase;}
#nav_savoir>span>img{position:relative;float:left;top:0; width:100%; height:auto;}
#nav_savoir>span>img.couleur {display:block;}
#nav_savoir>span>img.nb {display:none;}
#nav_savoir>span>span {position:relative;float:left; width:100%;margin-top:0.5em;font-size:0.8em;}
#nav_savoir>span:hover>img.couleur,#nav_savoir>span.over>img.couleur {display:none;}
#nav_savoir>span:hover>img.nb,#nav_savoir>span.over>img.nb {display:block;}

#nav_savoir_fixe {display:none;position:fixed; width:4em; top:20%; margin:0 0 0 -2em; list-style:none; padding:0; text-align:center;z-index:5000;}
#nav_savoir_fixe.visible {display:block;}
#nav_savoir_fixe>span{margin:0.5em 0;}
#nav_savoir_fixe>span>img {width:4em;-webkit-border-radius: 100%; border-radius: 100%;-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.7); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.7);-webkit-transition: margin 0.2s ease-out;-moz-transition: margin 0.2s ease-out;-ms-transition: margin 0.2s ease-out;-o-transition: margin 0.2s ease-out;transition: margin 0.2s ease-out;}
#nav_savoir_fixe>span>img:hover {margin-left:1.5em;} 

#pied{position:relative; float:right; width:100%; height:0px;font-size:0.9em;}
#menu_bas{position:absolute; right:21.5%; top:-23px; width:100%; height:auto; text-align:right;}
#menu_bas a{color:#666666; font-size:0.9em; padding:0px 1em; border-right:solid 1px #FFF; text-decoration:none;}
#menu_bas a:hover, #menu_bas a.over{color:#000000;}

#copy{position:relative; float:left; width:100%; height:auto; margin:2em 0 10em 0; text-align:center;}
#copy a, #copy a:visited, #copy a:link, #copy span{position:relative;color:#787878; text-decoration:none; font-weight:bold; font-size:0.9em;}
#copy img {position:relative; top:0.35em;}

.spip_logos{border:0px; margin:0px;}
.spip-admin-float{display:none;}


hr.spacer{float:left; width:100%; border:none; height:0.5em;}
.erreur{color:red; font-weight:bold;}
.erreur a{color:red;}
#zone_erreur{position:relative; float:left; width:95%; color:red; font-weight:bold; text-align:left; font-size:0.8em; margin:0px 0px 0.5em 1.5em;}
.clickable {cursor:pointer;}
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
.autobr {display:none;}

/*  realisations et équipe*/

#container {padding:2%; border:1px solid #ffffff; margin: 5em auto 0 auto;}

.fiche {position: relative; float: left; width: 330px; height: 300px; margin: 5px; overflow: hidden; line-height:1.2em;}
.fiche>img {position:absolute; float:left; width:100%; height:auto; top:0; left:0; z-index:100;}
.fiche>.infos {position:absolute; float:left; width:80%; height:125%; top:75%; left:0;padding:5% 10%; z-index:200; background: rgba(0,0,0,0.7); color:#ffffff;-webkit-transition: top 0.5s ease-out;-moz-transition: top 0.5s ease-out;-ms-transition: top 0.5s ease-out;-o-transition: top 0.5s ease-out;transition: top 0.5s ease-out;}
.fiche .infos div {-webkit-transition: opacity 0.5s;-moz-transition: opacity 0.5s;-ms-transition: opacity 0.5s;-o-transition: opacity 0.5s;transition: opacity 0.5s;}
.fiche .infos .plus {opacity:0; font-size:1em; margin-top:20%;}
.fiche .infos .plus p {margin:0 0 0.8em 0;}
.fiche .infos .titre {opacity:1;}

.fiche:hover .infos, .fiche:active .infos {top:-25%;}
.fiche:hover .infos .plus,.fiche:active .infos .plus  {opacity:1;}
.fiche:hover .infos .titre,.fiche:active .infos .titre {opacity:0;}

.enplus {position:absolute; display:block;width:200px;height:194px; top:0; left:0; opacity:0; transition:opacity 0.5s;-webkit-transition:opacity 0.5s; background-color:#000000; color:#FFF; line-height:194px; font-size:50px; text-align:center; z-index:50;}
.vignette:hover span.enplus{opacity:0.8;}
.vignette {position: relative; float: left; width: 200px; height: 194px; margin: 5px; overflow: hidden; cursor: pointer;}
.vignette>img {position:absolute; float:left; top:0; left:0; margin:0; width:100%; height:auto;}
.vignette.large {width:920px;height:806px;}

#container_clients{width:70%; margin: 5em auto 0 auto;}
.vignettes_clients{display:inline-block; width:24%; height:120px; text-align:center; vertical-align:middle;}
.vignettes_clients td, .vignettes_clients table{width:100%; height:100%;vertical-align:middle;}

.details h2, .details h3 {margin:0.5em 0 1em 0; font-family:GillSansStd-Light; font-size:1.2em;}
.details h2>span {font-size:0.8em; color:#7a7a7a;}
.details h3 {font-size:1em;}
.details p {margin:0;}

#url {margin-top:1.2em; font-size:0.8em; color:#7a7a7a;}

.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}



/*******Media queries***/

@media screen and (max-width: 1400px){
  #bandeau, #conteneur{width:90%;}
  BODY{font-size:15px;}
  .savoir {width:60%;}
  .vignette.large {width:680px;height:605px;}
}

@media screen and (max-width: 1268px){
  #logo{text-align:left;}
  #menu img {width:18em;}
  .savoir {width:80%;}
}

@media screen and (max-width: 1024px){
  #bandeau, #conteneur{width:100%;}
  BODY{font-size:15px;}
  #logo{top:5em;}
  #nav_savoir {width:60%;}
  
  #nav li, #nav span{padding:0 10px;}
  
  .titre_savoir {float:right; width:100%;  margin-top:0;}
  #news_ombre {display:block; width:30%;}
  #news {display:none;}
  
  #container_clients{width:100%;}
  .vignettes_clients{display:inline-block; width:24%; height:120px;}
  
}



@media screen and (max-width: 800px){
  #nav li, #nav span{width:100%;}
  #nav{position:absolute;}
  #retour.back{display:block; position:fixed; width:100%; top:0; left:0; font-size:1.3em; font-family:GillSansStd; color:#ffffff;text-align:center; background:#666666;}
  #menu.fixe {top:-12em;}
  #nav li, #nav span{padding:0 5px;}
  #nav_savoir {width:80%;}
  #nav_savoir>span {font-size:1.3em;}
  .vignette.large {width:91%;height:550px;}
  #contact_gauche,#contact_droite {width:96%; margin:0.5em 2%;}
  
  #container_clients{width:100%;}
  .vignettes_clients{display:inline-block; width:31%;}
  
}

@media screen and (max-width: 640px){
  #fond_bandeau img {height:400px; width:auto;}
  
  #nav {position:absolute;}   
  #logo {display:none;}

  #nav_savoir>span {width:30%; font-size:1em;}
  #contenu>.chapo {font-size:1.5em; font-family:GillSansStd;}
  .picto {width:15%; margin: 1em 0 0 0;}
}

@media screen and (max-width: 480px){

  .vignettes_clients{display:inline-block; width:48%; height:100px;}
  .fiche>img {width:70%;}
  .fiche>.infos {width:50%;}
  .fiche .infos .plus {font-size:0.8em;}
}