/* -/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/ */
/* -/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/ */
/* -/-/-/-/-/-/-/-/   RESPONSIVE    /-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/ */
/* -/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/ */
/* -/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/ */

/* -/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/- */
/* -/-/-/-/-/-/-/-/- RESPONSIVE PALIERS -/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/ */
/* -/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/- */

span#fixResponsive{display:none;width:1px;}
#top a#launchMobileMenu{display:none}
#menuMobile{display:none}
.fixMobile,.clearMobile,#menuPrincipal ul li.hideBig{display:none;}
#launchMenuMobile{display:none;}
.clearProjetResol1200{display:block;}

/* menu mobile */

#contentMenuMobile{display:none;position:absolute;z-index:1;width:86%;padding:0 2%;height:2000px;background:#007aba url(../img/mobile/shadow.gif) repeat-y top right;color:#fff}
#encaps{background:#eceded;position:relative;z-index:2}

#contentMenuMobile a#closemm{display:block;font-size:18px;width:auto;float:right;margin:0 5% 5% 0;padding:1% 2% 1% 2%;background:#2b94cd;color:#fff}

#contentMenuMobile h2{padding:5% 5% 3%;color:#fff;font-size:32px;font-family: 'Raleway', sans-serif;font-weight:700}
#contentMenuMobile a{display:block;font-size:22px;margin:2% 4% 2% 2%;background:#68b022;padding:3%;color:#fff;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;text-transform:uppercase}
#contentMenuMobile a#closemm{font-size:16px;width:auto;float:right;margin:0 5% 5% 0;padding:1% 2% 1% 2%;}

div.sepaMenuMob{margin:5% 15% 5% 5%;border-top:1px #ddd solid;height:1px;}

/* sous menu */
#contentMenuMobile a.titreActif{background:#68b022;color:#fff;border-bottom:none;margin-bottom:1%}
#contentMenuMobile .dev{background:#68b022;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;padding:3%;margin:0 4% 2% 2%}
#contentMenuMobile .dev a{margin:0 0 1% 0;font-size:20px;background:#007aba;color:#fff;border:none;}
#contentMenuMobile .dev a:hover,#contentMenuMobile .dev a.actif{background:#0e6c9d;color:#fff}

#contentMenuMobile a#block_contact{margin-top:60px;}
#contentMenuMobile a.a_contact{display:block;background:#8dbb11;font-size:22px;padding:16px 15px 10px 15px;color:#fff;}
a.a_contact span.ico{width:30px;height:30px;margin-right:10px;}
a.a_contact span.ico{background-position:-12px -205px;margin-top:-3px;}
#contentMenuMobile a#block_li span.ico{background-position:-12px -166px}
a.a_contact :hover{background-color:#6b8d0d}

#contentMenuMobile div.infosContact{display:block;font-size:18px;margin:2% 10% 2% 2%;background:#e9e9e9;padding:3%;color:#666;border:1px #ddd solid;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;text-transform:uppercase}

html{overflow-x:auto;}

/* ----------- */


/* premier palier responsive a 1200px */
@media screen and (max-width:1200px) { 

   span#fixResponsive{width:2px}   
   .conteneur{width:980px}
   
   #formContact p.textuel input{padding:2%}
   #menuMobile{display:none}
   
   #baseline{width:70%}
   #pieces{right:50px}  
   
   
   #actu-matieres #table-materiaux div.cell-mat,#menuPrincipal ul li a{font-size:15px;}
   
   
   }

/* Première descente > 800px */
@media screen and (max-width:980px) {
   span#fixResponsive{width:3px}   
   .conteneur{width:800px}  

   #formContact p.textuel input,#formContact textarea,#formContact input.send{padding:3%}   
   #formContact #form_lettre p.textuel input{width:60%}
   
   #menuMobile{display:none}
   
   #baseline{width:90%}
   #pieces,#menuPrincipal a#contactTop span.bulle{display:none;}
   #baselineAccueil{font-size:30px;}
   #menuPrincipal a#contactTop{margin:10px 0;}
   
   #metiers,#actu-matieres{width:100%;float:none}
   #metiers{margin-bottom:40px;}
   #actu-matieres #table-materiaux div.cell-mat{font-size:18px;padding:2%;}
   
}

/* de 800px type mobile - pour petites résol hors mobile */
@media screen and (max-width:800px){

   html{overflow-x:hidden;}
   span#fixResponsive{width:4px}
   .clearMobile{display:block;clear:both}
   
   #menuPrincipal ul li.hideMob,#baseline p{display:none;}
   
   #launchMenuMobile span.gras{font-family:'caviar';padding-left:20px;font-weight:normal}

   .conteneur{width:96%}   
   
   #menuPrincipal ul li.hideBig{display:inline-block;}
   #formContact label.normal{text-align:left;display:block;float:none;margin:0 0 10px;padding:2% 0 1%;width:100%;}
   #formContact p.textuel input,#formContact textarea,#formContact input.send,#formContact #form_lettre p.textuel input{width:94%;margin-left:0}
   #formContact input.send{width:100%;margin-left:0;margin-top:15px;}
   
   #formContact .lettreSend input.send, #recaptcha_widget_div{margin-left:0}
   
   #menuPrincipal a#home{padding:10px 20px;}
   #menuPrincipal ul li a{padding:10px 20px;font-size:20px;font-weight:700}
   
   #menus_contenu,#contenu_GC{width:100%;float:none}
   
   #footer #coord{float:none;width:92%;padding:4%}
   #footer #accroche,#footer #annexesFooter{float:none;width:92%;text-align:left;padding:4%}
   #footer #annexesFooter{border-top:1px #09699c solid;margin-top:4%}
   #metiers .cell-metier-accueil{float:none;width:100%}
   #menuPrincipal a#home{display:none;}
   
   
   

}

/* Ajustements pour mobile smartphone récent */
@media
screen and (max-width:650px){

   span#fixResponsive{width:5px}

   span.hideLittle{display:none}
  
   

}


/* Ajustements pour mobile smartphone récent */
@media
screen and (max-width:500px){

   span#fixResponsive{width:5px}
   

}

/* Ajustements Retina */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5)
{

}

/* mobile encore plus petit - type vieil Iphone */
@media
only screen and (max-width:320px) and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (max-width:320px) and (min-device-pixel-ratio : 1.5){

   span#fixResponsive{width:6px}

   #launchMenuMobile{font-size:20px}
  
   
   
}