/* ======================================== STRUCTURE.css ======================================== */
/* Structuration des zones du site */
/* Septembre 2025 - IAFACTORY j.muckensturm


/* GENERAL
================================================================================================== */

/* >>	Test
* {outline:1px solid red !important;}
*/

body {margin-top:-1px;font-family:'typoarchia', "Trebuchet MS", Helvetica, sans-serif;overflow-x:hidden;/* Masque la scroll bar horizontale */}


/* >>	Typographie */
@font-face {font-family: 'typoarchia';src: url('../font/archia.ttf') format('truetype'),url('../font/archia.eot'),url('../font/archia.woff') format('woff'),url('../font/archia.svg') format('svg'),url('../font/archia.eot?#iefix') format('embedded-opentype');font-weight: normal;font-style: normal;}
@font-face {font-family: 'typobriquete';src: url('../font/briquete.ttf') format('truetype'),url('../font/briquete.eot'),url('../font/briquete.woff') format('woff'),url('../font/briquete.svg') format('svg'),url('../font/briquete.eot?#iefix') format('embedded-opentype');font-weight: normal;font-style: normal;}
@font-face {font-family: 'typorintix';src: url('../font/rintix.ttf') format('truetype'),url('../font/rintix.eot'),url('../font/rintix.woff') format('woff'),url('../font/rintix.svg') format('svg'),url('../font/rintix.eot?#iefix') format('embedded-opentype');font-weight: normal;font-style: normal;}
@font-face {font-family: 'typoitaliabook';src: url('../font/italiabook.ttf') format('truetype'),url('../font/italiabook.eot'),url('../font/italiabook.woff') format('woff'),url('../font/italiabook.svg') format('svg'),url('../font/italiabook.eot?#iefix') format('embedded-opentype');font-weight: normal;font-style: normal;}

.typo-archia {font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;}
.typo-briquete {font-family: 'typobriquete', "Trebuchet MS", Helvetica, sans-serif;}
.typo-rintix {font-family: 'typorintix', "Trebuchet MS", Helvetica, sans-serif;}
.typo-italiabook {font-family: 'typoitaliabook', "Trebuchet MS", Helvetica, sans-serif;}


/* >>	Balises H1, H2, H3, H4, H5, H6 */
h1, h2, h3, h4, h5, h6 {font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;}

/* >>	Liens */
a {color:#000;border-bottom:1px dotted #000;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;text-decoration:none;-webkit-transition: all 0.1s ease;-moz-transition: all 0.1s ease;-o-transition: all 0.1s ease;transition: all 0.1s ease;}
a:hover {color:#000;border-bottom:1px solid #000;}

/* >>	Couleurs */
.couleur-noir {color:#000;}
.couleur-blanc {color:#FFF;}
.couleur-gris {color:#777777;}
/* 477C3F - vert special formulaire - */


/* COOKIE
================================================================================================== */
/* >>	Fenêtre consentement - voir audience.php */

.light.cc_dialog {padding:25px !important;background-color:#000 !important;opacity:1.0;}
.light.cc_dialog .cc_dialog_headline {color:#DFDFDF !important;font-size:14px;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;}
.light.cc_dialog .cc_dialog_text {color:#DFDFDF !important;font-size:12px;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;}

.light.cc_dialog button.cc_b_ok {color:#000 !important;background-color:#FFF !important;border:1px solid #DFDFDF;font-size:12px;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;}
.light.cc_dialog button.cc_b_cp {margin-left:5px !important;color:#DFDFDF !important;background-color:#000 !important;border:1px dotted #DFDFDF;font-size:12px;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;}

.cc_dialog.simple {max-width:25% !important;right:16px !important;bottom:16px !important;}
.cc_cp_f_save button {background-color:#000 !important;}

@media screen and (min-width:701px) and (max-width:1200px)
{.cc_dialog.simple {max-width:50% !important;}}
@media screen and (min-width:50px) and (max-width:874px)
{.cc_dialog.simple {max-width:100% !important;right:0 !important;bottom:0 !important;}
.light.cc_dialog button.cc_b_ok {color:#000 !important;background-color:#FFF !important;border:1px dotted #DFDFDF;font-size:11px;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;}
.light.cc_dialog button.cc_b_cp {margin-left:5px !important;color:#DFDFDF !important;background-color:#000 !important;border:1px dotted #DFDFDF;font-size:11px;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;}

}


/* GRILLE
================================================================================================== */
/* >>	Conteneur grille 100 % */
.grille-meta {z-index:-30;background-color:#FFF;margin-left: auto;margin-right: auto;background-image:/*permet de gérer l'arrière plan du site avec la répétition des lignes horizontales */
repeating-linear-gradient(to bottom, #E3E3E3 0, #E3E3E3 1px, transparent 1px, transparent 50px),
repeating-linear-gradient(to bottom, #F1F1F1 0, #F1F1F1 1px, transparent 1px, transparent 25px),
repeating-linear-gradient(to bottom, #F5F5F5 0, #F5F5F5 1px, transparent 1px, transparent 5px);}

/* >>	Conteneur grille repères */
.grille-reperes {z-index:-30;width: 1605px;margin: auto;background:/*permet de gérer la répétition des repères */
repeating-linear-gradient(to bottom, #969696 0, #969696 1px, transparent 1px, transparent 50px), repeating-linear-gradient(to bottom, #B4B4B4 0, #B4B4B4 1px, transparent 1px, transparent 10px);}

/* >>	Conteneur conteu 1500PX + PADDING 100PX */
.conteneur-contenu {z-index:-30;height:auto;width: 1501px;padding:0 50px 0 50px;margin: auto;background-color:#FFF;background-image:/* englobe le site dans la limite de 1500 px et permet de gérer la répétition interne de l'arrière plan  */
repeating-linear-gradient(to right, #E3E3E3 0, #E3E3E3 1px, transparent 1px, transparent 50px), repeating-linear-gradient(to bottom, #E3E3E3 0, #E3E3E3 1px, transparent 1px, transparent 50px),/* Lignes de 50px */
repeating-linear-gradient(to right, #F1F1F1 0, #F1F1F1 1px, transparent 1px, transparent 25px), repeating-linear-gradient(to bottom, #F1F1F1 0, #F1F1F1 1px, transparent 1px, transparent 25px),/* Lignes de 25px */
repeating-linear-gradient(to right, #F6F6F6 0, #F6F6F6 1px, transparent 1px, transparent 5px), repeating-linear-gradient(to bottom, #F6F6F6 0, #F6F6F6 1px, transparent 1px, transparent 5px);}/* Lignes de 5px */



/* lOGO
================================================================================================== */
.logo-iafactory {float:right;display:block;z-index:9;position:absolute;top:0;height:176px;width:952px;margin:0 0 0 781px;padding:24px 0 0 19px;border-bottom:none;background:none;font-size:142px;letter-spacing : 13px;font-family: 'typorintix';color:#000;
-webkit-text-stroke: 4px #FFF;text-shadow:-1px -1px 0 #FFF,1px -1px 0 #FFF,-1px  1px 0 #FFF,1px  1px 0 #FFF;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
/* background stris logo */
.logo-iafactory::before {z-index: 10;content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-image: url(../img/bg/bg-logo-iafactory-mediaquery1a.png);background-repeat: no-repeat;background-position:23px 52px;}
.logo-iafactory:hover {margin:0 0 0 762px;padding:24px 0 0 19px;z-index:999;border-bottom:none;background:none;color:#FFF;-webkit-text-stroke: 3px #000;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000}
.logo-iafactory-box {float:right;display:block;z-index:8;position:absolute;top:0;height:173px;width:600px;margin:0 0 0 910px;padding:26px 0 0 0;background:#000;
-webkit-transform:skew(23deg);-moz-transform:skew(23deg);-o-transform:skew(23deg);-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
.logo-iafactory-box-elastic {position:absolute;right:0;height:200px;width:30%;margin:0 0 0 0;padding:0 0 0 0;background:#000;}

.scramble-logo {} /* classe spécifique pour toucher le logo avec effet scramble */
.scramble-logo-noir {} /* classe spécifique pour toucher le logo avec effet scramble dans les fiches noires */
.logo-aos {z-index:9;position:absolute;}/*hack pour faire fonctionner l'animaton aos du logo sans dénaturer l'effet scramble*/


        /* Animation logo IAFACTORY / SVG */
        #logo-iafn1-svg {cursor:pointer;float:right;display:block;z-index:9;position:absolute;top:0;height:176px;width:952px;margin:13px 0 0 804px;padding:24px 0 0 0;border-bottom:none;background:none;font-size:142px;letter-spacing : 13px;font-family: 'typorintix';color:#000;
        background-image: url(../img/bg/bg-logo-iafactory-mediaquery1a.png);background-repeat:no-repeat;background-position:0 37px;
        -webkit-text-stroke: 4px #FFF;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}

        #logo-iafn1-svg:hover {margin:13px 0 0 778px;padding:24px 25px 0 0;z-index:999;border-bottom:none;background:none;color:#FFF;background-image: url(../img/bg/bg-logo-iafactory-mediaquery1a.png);background-repeat:no-repeat;background-position:0 37px;-webkit-text-stroke: 3px #000;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000;}

        .copy-logo-ia {fill:none;stroke: none;stroke-dasharray: 6% 29%;stroke-width: 1.5px/*2px plus fin*/;stroke-dashoffset: 0%;animation: stroke-offset 5.5s infinite linear;}
        .copy-logo-ia:nth-child(1){stroke: #7F7F7F;animation-delay: -1s;}
        .copy-logo-ia:nth-child(2){stroke: #FFF;animation-delay: -2s;}
        .copy-logo-ia:nth-child(3){stroke: #7F7F7F;animation-delay: -3s;}
        .copy-logo-ia:nth-child(4){stroke: #FFF;animation-delay: -4s;}
        .copy-logo-ia:nth-child(5){stroke: #7F7F7F;animation-delay: -5s;}

        @keyframes stroke-offset{
          100% {stroke-dashoffset: -35%;}
        }



/* HEADER
================================================================================================== */
header {clear:both;height:276px;}
nav {}


/* >>	Briefer */
.bouton-briefer {position:absolute;z-index:9;float:left;display:block;margin:50px 0 0 300px;padding:63px 53px 11px 61px;height:75px;width:235px;border:1px solid transparent;
font-size:40px;letter-spacing : 4px;line-height:40px;font-family: 'typobriquete', "Trebuchet MS", Helvetica, sans-serif;color:#000;
background-image:url(../img/bg/bg-bouton-long-bas-gauche-noir.png);background-repeat:no-repeat;background-position:-1px 99px;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
.bouton-briefer:hover {border:1px solid #000;color:#000;background-position:-1px 99px;background-color:rgba(119, 119, 119, 0.050);}
     /* >>	Animation contour */
    .bouton-briefer-animation {position:absolute;margin:50px 0 0 300px;height:151px;width:351px;box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.0);-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
    .bouton-briefer-animation:hover {cursor: pointer;}
    .bouton-briefer-animation::before, .bouton-briefer-animation::after {z-index:9;position: absolute;top: 0;left: 0;right: 0;bottom: 0;
      color:rgba(119, 119, 119, 0.2)/* couleur de l'animation*/;animation: clipMe 10s linear infinite;/* double de Animation Delay*/;content: "";box-shadow: inset 0 0 0 1px;}
    .bouton-briefer-animation::before {animation-delay: -5s;/*moitié de clip Me*/}
    @keyframes clipMe {0%, 100% { clip: rect(0, 351px, 1px, 0); } 25% { clip: rect(0, 351px, 151px, 350px); } 50% { clip: rect(150px, 351px, 151px, 0); } 75% { clip: rect(0, 1px, 151px, 0);}}

/* >>	Baseline */
.baseline-iafactory {position:absolute;float:left;display:block;margin:184px 0 0 749px;padding:0 0 0 0;line-height:25px;text-transform:lowercase;font-size:14px;color:#000;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;}


/* >>	Ariane */
.fil-ariane {clear:both;float:left;height: 25px;margin:40px 0 0 0;padding: 0 0 0 0;text-transform:lowercase;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:12px;letter-spacing : 1px;text-align: left;font-weight:normal;}
.fil-ariane ul {display:block;padding:0 0 0 42px;}
.fil-ariane ul li {display:inline;margin:0 0 0 0;padding:0 21px 0 8px;background-image:url(../img/ico/ico-chevron-ariane.png);background-repeat:no-repeat;background-position:right 4px;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;color:#777;}
.fil-ariane ul li a {font-size:12px;letter-spacing : 1px;text-align: left;font-weight:normal;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;color:#000;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
.fil-ariane ul li a:hover {background:#000;color:#FFF;padding:6px;}

.fil-ariane ul li.arianelast {} /*item visible sur petite résolution*/
.fil-ariane .nochevron {background-image:none;}


/* BACKGROUND OPTION
================================================================================================== */

/* background optionnel - mindmap... */
.background-iafactory-map0 {pointer-events:none;display:none;width:800px;height:600px;left:0;top:-50px;position:absolute;float:left;background-image: url(../img/bg/bg-iaf-top-mindmap0.png);background-repeat:no-repeat;background-position:0 0;opacity:0.5;} /* accueil */
.background-iafactory-map1 {pointer-events:none;display:block;width:800px;height:600px;left:0;top:-50px;position:absolute;float:left;background-image: url(../img/bg/bg-iaf-top-mindmap1.png);background-repeat:no-repeat;background-position:0 0;opacity:0.5;} /* hub méthode */
.background-iafactory-map2 {pointer-events:none;display:block;width:800px;height:600px;left:0;top:-50px;position:absolute;float:left;background-image: url(../img/bg/bg-iaf-top-mindmap2.png);background-repeat:no-repeat;background-position:0 0;opacity:0.5;} /* hub prestation */
.background-iafactory-map3 {pointer-events:none;display:block;width:800px;height:600px;left:0;top:-50px;position:absolute;float:left;background-image: url(../img/bg/bg-iaf-top-mindmap3.png);background-repeat:no-repeat;background-position:0 0;opacity:0.5;} /* hub portfolio */
.background-iafactory-map4 {pointer-events:none;display:block;width:800px;height:600px;left:0;top:-50px;position:absolute;float:left;background-image: url(../img/bg/bg-iaf-top-mindmap4.png);background-repeat:no-repeat;background-position:0 0;opacity:0.5;} /* hub carnet */
.background-iafactory-map5 {pointer-events:none;display:block;width:800px;height:600px;left:0;top:-50px;position:absolute;float:left;background-image: url(../img/bg/bg-iaf-top-mindmap5.png);background-repeat:no-repeat;background-position:0 0;opacity:0.5;} /* hub références */
.background-iafactory-map6 {pointer-events:none;display:block;/*le background fait bugger le bouton back dans la fiche noire studio IAF*/width:800px;height:600px;left:0;top:-50px;position:absolute;float:left;background-image: url(../img/bg/bg-iaf-top-mindmap6-noir.png);background-repeat:no-repeat;background-position:0 0;opacity:0.5;} /* hub IAF */
.background-iafactory-map7 {pointer-events:none;display:block;width:800px;height:600px;left:0;top:-50px;position:absolute;float:left;background-image: url(../img/bg/bg-iaf-top-mindmap7.png);background-repeat:no-repeat;background-position:0 0;opacity:0.5;} /* hub expertises */
.background-iafactory-map8 {pointer-events:none;display:block;width:800px;height:600px;left:0;top:-50px;position:absolute;float:left;background-image: url(../img/bg/bg-iaf-top-mindmap8.png);background-repeat:no-repeat;background-position:0 0;opacity:0.5;} /* hub étude de cas */
.background-iafactory-map9 {pointer-events:none;display:block;width:800px;height:600px;left:0;top:-50px;position:absolute;float:left;background-image: url(../img/bg/bg-iaf-top-mindmap9.png);background-repeat:no-repeat;background-position:0 0;opacity:0.5;} /* hub jm */
.background-iafactory-map10 {pointer-events:none;display:block;width:800px;height:600px;left:0;top:-50px;position:absolute;float:left;background-image: url(../img/bg/bg-iaf-top-mindmap10.png);background-repeat:no-repeat;background-position:0 0;opacity:0.5;} /* 404 - 403 - 500 */
.background-iafactory-map11 {pointer-events:none;display:block;width:800px;height:600px;left:0;top:-50px;position:absolute;float:left;background-image: url(../img/bg/bg-iaf-top-mindmap11.png);background-repeat:no-repeat;background-position:0 0;opacity:0.5;} /* plan du site */
.background-iafactory-map12 {pointer-events:none;display:block;width:800px;height:600px;left:0;top:-50px;position:absolute;float:left;background-image: url(../img/bg/bg-iaf-top-mindmap12.png);background-repeat:no-repeat;background-position:0 0;opacity:0.5;} /* mentions */



/* MENU DE NAVIGATION
================================================================================================== */

/* hamburger */
.nav__toggle {z-index: 100;position: relative;cursor: pointer;margin:50px 0 0 0;float:left;display:block;border: 1px solid transparent;background-color: transparent !important;background-image:url(../img/bg/bg-bouton-court-haut-droite-noir.png);background-repeat:no-repeat;background-position:98px -1px;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
.nav__toggle:hover {border: 1px solid #000;background-color:rgba(119, 119, 119, 0.050) !important;background-position:98px -1px;cursor:pointer;}
.nav__toggle.menu-open {position: fixed;}/* le hamburger est fixe sans scroll avec la page une fois le menu de navigation déployé - couplé à javascript */
.nav__toggle-state--open {display:block;height:75px;width:35px;margin:0 0 0 0;padding:63px 53px 11px 61px;background-image:url(../img/ico/ico-menu-ouvrir-noir.png);background-repeat:no-repeat;background-position:49px 70px}
.nav__toggle-state--close {display:block;height:75px;width:35px;margin:-1px 0 0 -1px;padding:63px 53px 11px 61px;background:none;border:1px solid transparent;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;
  background-image:url(../img/ico/ico-menu-fermer-blanc.png), url(../img/bg/bg-bouton-court-haut-droite-blanc.png);background-repeat:no-repeat, no-repeat;background-position:48px 69px, 99px -1px;}
.nav__toggle:hover .nav__toggle-state--close  {background:none;border:1px solid #FFF;background-image:url(../img/ico/ico-menu-fermer-blanc.png), url(../img/bg/bg-bouton-court-haut-droite-blanc.png);background-repeat:no-repeat, no-repeat;background-position:48px 69px, 99px -1px;}

/* nav head */
.box-entete {display:block;text-align:left;}
      .nav-briefer-noir {position:absolute;z-index:19;display:block;float:left;margin:50px 0 0 300px;padding:63px 53px 11px 61px;height:75px;width:235px;border:1px solid transparent;
        font-size:40px;letter-spacing : 4px;line-height:40px;font-family: 'typobriquete', "Trebuchet MS", Helvetica, sans-serif;color:#FFF;
        background-image:url(../img/bg/bg-bouton-long-bas-gauche-blanc.png);background-repeat:no-repeat;background-position:-1px 99px;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
      .nav-briefer-noir:hover {border:1px solid #FFF;color:#FFF;background-position:-1px 99px;background-color:rgba(119, 119, 119, 0.050);}

      .logo-nav-iafactory-noir {float:right;display:block;z-index:9;position:absolute;top:0;height:176px;width:952px;margin:1px 0 0 748px;padding:24px 0 0 0;border-bottom:none;font-size:142px;letter-spacing : 13px;font-family: 'typorintix';color:#FFF;
          -webkit-text-stroke: 4px #000;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
      /* background stris logo */
      .logo-nav-iafactory-noir::before {z-index: 10;content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-image: url(../img/bg/bg-logo-iafactory-mediaquery1a.png);background-repeat: no-repeat;background-position:0 52px;opacity:0.5;}
      .logo-nav-iafactory-noir:hover {margin:1px 0 0 729px;padding:24px 0 0 0;z-index:999;border-bottom:none;background:none;color:#000;-webkit-text-stroke: 4px #FFF;text-shadow:-1px -1px 0 #FFF,1px -1px 0 #FFF,-1px  1px 0 #FFF,1px  1px 0 #FFF}
      .logo-nav-iafactory-noir-box {float:right;display:block;z-index:8;position:absolute;top:0;height:173px;width:650px;margin:1px 0 0 858px;padding:26px 0 0 0;background:#FFF;
          -webkit-transform:skew(23deg);-moz-transform:skew(23deg);-o-transform:skew(23deg);-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
      .nav-baseline-iafactory-noir {float:left;display:block;margin:184px 0 0 750px;padding:0 0 0 0;text-transform:lowercase;line-height:25px;font-size:14px;color:#FFF;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;}
      .logo-nav-iafactory-noir-box-elastic {position:fixed;right:0;height:200px;width:30%;margin:0 0 0 0;padding:0 0 0 0;background:#FFF;}

/* nav corps */
.menu {position: fixed;top: -1px;left: 0;width: 100%;height:calc(100% + 1px);background-color:#000;display: flex;justify-content: center;align-items: center;overflow: hidden;z-index: 10;transform: translateY(-100%);
  background-image:/*permet de gérer l'arrière plan du site avec la répétition des lignes horizontales */
  repeating-linear-gradient(to bottom, #232323 0, #232323 1px, transparent 1px, transparent 50px),
  repeating-linear-gradient(to bottom, #000 0, #000 1px, transparent 1px, transparent 25px),
  repeating-linear-gradient(to bottom, #000 0, #000 1px, transparent 1px, transparent 5px);}
.menu-open-body {position: fixed;top: 0;left: 0;width: 100%;overflow: hidden;}/* empêche tout scroll et masque la scrollbar quand le menu de navigation est déployé */
.menu__content {background:#000;margin:0 0 0 0;padding:0 0 0 0;height:100%;display: flex;flex-direction: column;align-items: center;text-align: center;}
.menu__bg {width: 1599px;height: 900px;background-size: cover;background-position: center;opacity: 0;pointer-events: none;transition: opacity 0.5s ease;} /* affichage d'une image de background au rollover sur image */
        /* apparition progressive du background avec action spécifique sur certaines classes */
          .menu__content {position:relative;}/* indispensable pour que les bg absolus se superposent */
          .menu__bg {z-index: 0;position: absolute;}
          .menu__bg.bg2 {z-index: 1;}
          .col1-nav {position: relative;z-index: 2;} /* liens au-dessus du background */

.menu__grid {background:#000;height:100%;width: 1501px;padding:0 50px 0 50px;/* structuration du menu en grille de 3 colonnes*/
  background-image:/* englobe le site dans la limite de 1500 px et permet de gérer la répétition interne de l'arrière plan  */
  repeating-linear-gradient(to right, #181818 0, #181818 1px, transparent 1px, transparent 50px), repeating-linear-gradient(to bottom, #181818 0, #181818 1px, transparent 1px, transparent 50px),/* Lignes de 50px */
  repeating-linear-gradient(to right, #111 0, #111 1px, transparent 1px, transparent 25px), repeating-linear-gradient(to bottom, #111 0, #111 1px, transparent 1px, transparent 25px),/* Lignes de 25px */
  repeating-linear-gradient(to right, #111 0, #111 1px, transparent 1px, transparent 5px), repeating-linear-gradient(to bottom, #000 0, #000 1px, transparent 1px, transparent 5px);}/* Lignes de 5px */

.box-item {display:block;text-align:left;width:1500px;margin:50px 0 0 0;}
    .col0-nav-mobile a {display:none;}
    .col1-nav {position:absolute;display:block;float:left;width:500px;margin:282px 0 0 50px;}
        .col1-nav a {color:#FFF;-webkit-text-stroke: 3px #FFF;text-shadow:-1px -1px 0 #FFF,1px -1px 0 #FFF,-1px  1px 0 #FFF,1px  1px 0 #FFF;}
        .col1-nav a:hover {color:#000;-webkit-text-stroke: 1px #FFF;text-shadow:-1px -1px 0 #FFF,1px -1px 0 #FFF,-1px  1px 0 #FFF,1px  1px 0 #FFF;}

        .nav__footer-link {text-transform:uppercase;margin: 0 0 0 0;opacity: 0;overflow: hidden;position: relative;display: inline-block;text-align:left;line-height:96px;letter-spacing:5px;font-family:'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:52px;}/*style des liens du menu*/
            .double-hover {position: relative;overflow: hidden;display: inline-block;}
            .double-hover span {display: block;text-transform:uppercase;}
            .double-hover span:nth-of-type(2) {position: absolute;top: 0;left: 0;text-transform:uppercase;}
    .col2-contact a {/* animation */animation: fadeColor 1s ease-in-out infinite alternate;position:absolute;display:block;float:left;height:150px;width:700px;margin:250px 0 0 752px;padding:50px 0 0 0;letter-spacing:5px;font-family:'typobriquete', "Trebuchet MS", Helvetica, sans-serif;font-size:80px;
    color:#777;background-image:url(../img/bg/bg-bouton-long-haut-droite-noir.png);background-repeat:no-repeat;background-position:622px -1px;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
    .col2-contact a:hover {color:#FFF !important;opacity: 1 !important;animation: none !important;border-bottom:1px dotted #FFF;}
    @keyframes fadeColor {from {color: #777;opacity: 0.5;}to {color: #fff; /* blanc */opacity: 1;  /* opaque */}}

    .col3-item {position:absolute;display:block;float:left;height:250px;width:300px;margin:489px 0 0 750px;padding:0 0 0 0;text-align:left;font-family:'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:14px;color:#777;}
    .col4-item {position:absolute;display:block;float:left;height:250px;width:300px;margin:489px 0 0 1100px;padding:0 0 0 0;text-align:left;font-family:'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:14px;color:#777;}
        .item-titre {margin:0 0 0 0;padding:0 0 0 0;letter-spacing:2px;font-family:'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:14px;color:#FFF;}
        .item-focus {margin:0 0 0 0;padding:25px 0 0 0;letter-spacing:2px;font-family:'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:24px;color:#FFF;}
        .item-complement {margin:0 0 -29px 0;padding:32px 0 0 0;line-height:25px;letter-spacing:1px;font-family:'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:14px;color:#777;}
        .menu__divider {margin:70px 0 0 0;position: relative;width: 0;opacity: 0;height:1px;background-color:#333;transition: none;}/* décoration filet bas de page */
        .item-footer-droit1 {margin:82px 0 0 0;}
        .item-footer-droit1 a {padding:0 0 0 0;line-height:25px;letter-spacing:1px;border-bottom:none;text-decoration: underline;text-decoration-color:#555;text-underline-offset: 5px;font-family:'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:14px;color:#FFF;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
        .item-footer-droit1 a:hover {border-bottom:none;text-decoration: underline;text-decoration-color:#FFF;text-underline-offset: 5px;}
        .item-footer-droit2 {margin:82px 0 0 0;}
        .item-footer-droit2 a {padding:0 0 0 0;line-height:25px;letter-spacing:1px;border-bottom:none;text-decoration: underline;text-decoration-color:#555;text-underline-offset: 5px;font-family:'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:14px;color:#FFF;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
        .item-footer-droit2 a:hover {border-bottom:none;text-decoration: underline;text-decoration-color:#FFF;text-underline-offset: 5px;}

    .col5-item {position:absolute;display:block;float:left;height:250px;width:300px;margin:701px 0 0 50px;padding:0 0 0 0;text-align:left;font-family:'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:14px;color:#777;}
    .col6-item {position:absolute;display:block;float:left;height:250px;width:300px;margin:701px 0 0 370px;padding:0 0 0 0;text-align:left;font-family:'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:14px;color:#777;}
        .item-footer-gauche {margin:82px 0 0 0;}
        .item-footer-gauche a {padding:0 0 0 0;line-height:25px;letter-spacing:1px;border-bottom:none;text-decoration: underline;text-decoration-color:#555;text-underline-offset: 5px;font-family:'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:14px;color:#FFF;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
        .item-footer-gauche a:hover {border-bottom:none;text-decoration: underline;text-decoration-color:#FFF;text-underline-offset: 5px;}


        /* Positionnement menu media query */

        @media screen and (min-height: 700px) and (max-height: 875px) { /* Styles appliqués quand la hauteur de l'écran se situe entre 700px et 850px */
        .col0-nav-mobile a {display:none;}
        .col1-nav {width:450px;margin:183px 0 0 50px;}
            .col1-nav a {-webkit-text-stroke: 1px #FFF;text-shadow:-1px -1px 0 #FFF,1px -1px 0 #FFF,-1px  1px 0 #FFF,1px  1px 0 #FFF;}
            .nav__footer-link {line-height:96px;letter-spacing:5px;font-size:46px;}/*style des liens du menu*/

        .col2-contact a {height:90px;width:500px;margin:250px 0 0 752px;padding:35px 0 0 0;letter-spacing:5px;font-size:50px;background-image:url(../img/bg/bg-bouton-long-haut-droite-noir.png);background-position:422px -1px;}
        .col2-contact a:hover {border-bottom:1px dotted transparent;text-decoration: underline;}

        .col3-item {height:250px;width:250px;margin:389px 0 0 700px !important;padding:0 0 0 0;font-size:14px;}
        .col4-item {height:250px;width:250px;margin:389px 0 0 1000px !important;padding:0 0 0 0;font-size:14px;}
            .item-titre {font-size:14px;}
            .item-focus {margin:0 0 0 0;padding:25px 0 0 0;letter-spacing:2px;font-size:24px;}
            .item-complement {margin:0 0 41px 0;padding:32px 0 0 0;line-height:25px;letter-spacing:1px;font-size:14px;}
            .menu__divider {margin:19px 0 0 0;}/* décoration filet bas de page */
            .item-footer-droit1 {margin:32px 0 0 0;}
            .item-footer-droit2 {margin:32px 0 0 0;}

        .col5-item {height:250px;width:300px;margin:551px 0 0 50px;padding:0 0 0 0;font-size:14px;}
        .col6-item {height:250px;width:300px;margin:551px 0 0 320px;padding:0 0 0 0;font-size:14px;}
            .item-footer-gauche {margin:82px 0 0 0;}
            .item-footer-gauche a {line-height:25px;letter-spacing:1px;text-underline-offset: 5px;font-size:14px;}
        }


        @media screen and (min-height: 300px) and (max-height: 700px) { /* Styles appliqués quand la hauteur de l'écran se situe entre 300px et 700px */
        .col0-nav-mobile a {display:none;}
        .col1-nav {width:425px;margin:211px 0 0 50px;}
            .col1-nav a {-webkit-text-stroke: 1px #FFF;text-shadow:-1px -1px 0 #FFF,1px -1px 0 #FFF,-1px  1px 0 #FFF,1px  1px 0 #FFF;}
            .nav__footer-link {line-height:47px;letter-spacing:8px;font-size:38px;}/*style des liens du menu*/

        .col2-contact a {height:90px;width:500px;margin:250px 0 0 752px;padding:35px 0 0 0;letter-spacing:5px;font-size:50px;background-image:url(../img/bg/bg-bouton-long-haut-droite-noir.png);background-position:422px -1px;}
        .col2-contact a:hover {border-bottom:1px dotted transparent;text-decoration: underline;}

        .col3-item {height:250px;width:250px;margin:389px 0 0 700px !important;padding:0 0 0 0;font-size:14px;}
        .col4-item {height:250px;width:250px;margin:389px 0 0 1000px !important;padding:0 0 0 0;font-size:14px;}
            .item-titre {font-size:14px;}
            .item-focus {margin:0 0 0 0;padding:25px 0 0 0;letter-spacing:2px;font-size:24px;}
            .item-complement {margin:0 0 41px 0;padding:32px 0 0 0;line-height:25px;letter-spacing:1px;font-size:14px;}
            .menu__divider {margin:37px 0 0 0;}/* décoration filet bas de page */
            .item-footer-droit1 {margin:-67px 0 0 -650px;}
            .item-footer-droit2 {margin:-67px 0 0 -700px;}

        .col5-item {height:50px;width:300px;margin:401px 0 0 50px;padding:0 0 0 0;font-size:14px;}
        .col6-item {height:50px;width:300px;margin:401px 0 0 300px;padding:0 0 0 0;font-size:14px;}
            .item-footer-gauche {margin:82px 0 0 0;}
            .item-footer-gauche a {line-height:25px;letter-spacing:1px;text-underline-offset: 5px;font-size:14px;}
        }


        @media (min-width: 1796px) {
          .col3-item {margin-left:750px !important;}
          .col4-item {margin-left:1050px !important;}
        }




/* TITRE
================================================================================================== */
h1 {height:50px;width:100%;margin:30px 0 0 0;padding: 0 0 0 45px;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:52px;letter-spacing : 5px;text-align: left;font-weight:normal;}

/* Bouton d'action - en haut à droite */
.bouton-action-aide {float:left;display:block;margin:-56px 0 0 1100px;padding:0 50px 0 0;height:49px;border:1px solid transparent;width:349px;line-height:51px;text-align:right;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;font-size:14px;letter-spacing:2px;color:#000;
    background-image:url(../img/bg/bg-bouton-court-haut-droite-noir.png);background-repeat:no-repeat;background-position:348px -1px;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}
.bouton-action-aide:hover {border:1px solid #000;color:#000;background-position:348px -2px;}


/* FOOTER
================================================================================================== */
footer {clear:both;margin:-100px 0 0 0;}
.footer-allusion {clear:both;height:100px;margin:38px 0 0 50px;padding:0 0 0 0;font-family: 'typoarchia', "Trebuchet MS", Helvetica, sans-serif;text-align:right;font-size:14px;letter-spacing:1px;color:#000;}

/* >>	Scroll vers le haut - PIEDPAGE */
#scrolltop {z-index: 1000;display: flex;position: fixed;top: 400px;right: 0;width: 51px;height: 51px;background-color: #000;cursor: pointer;opacity: 0;visibility: hidden;transition: opacity 0.5s ease;justify-content: center;align-items: center;color: white;user-select: none;}
#scrolltop.visible {opacity: 1;visibility: visible;}



/* ==================================================================== */
/* °°° 	@MEDIAQUERIES - opti position header, briefing, logo  					*/
/* ==================================================================== */

@media screen and (min-width: 1600px) and (max-width: 1795px) {
  .logo-iafactory {top:0;height:176px;width:952px;margin:0 0 0 750px;padding:34px 0 0 0;font-size:132px;letter-spacing : 13px;-webkit-text-stroke: 4px #FFF;text-shadow:-1px -1px 0 #FFF,1px -1px 0 #FFF,-1px  1px 0 #FFF,1px  1px 0 #FFF;}
  /* background stris logo */
  .logo-iafactory::before {background-image: url(../img/bg/bg-logo-iafactory-mediaquery1b.png);background-repeat: no-repeat;background-position:4px 56px;}
  .logo-iafactory:hover {margin:0 0 0 733px;padding:34px 0 0 0;-webkit-text-stroke: 3px #000;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000;}
  .logo-iafactory-box {top:0;height:173px;width:600px;margin:0 0 0 852px;padding:26px 0 0 0;-webkit-transform:skew(23deg);-moz-transform:skew(23deg);-o-transform:skew(23deg);}
  .logo-iafactory-box-elastic {right:0;height:200px;width:30%;margin:0 0 0 0;padding:0 0 0 0;}
  .bouton-briefer {margin:50px 0 0 250px;padding:63px 53px 11px 61px;height:75px;width:235px;border:1px solid transparent;font-size:40px;letter-spacing : 4px;line-height:40px;}
  .bouton-briefer-animation {margin:50px 0 0 250px;height:151px;width:351px;box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.0);}
  .baseline-iafactory {margin:184px 0 0 699px;padding:0 0 0 0;line-height:25px;font-size:14px;}

  /* nav head */
  .logo-nav-iafactory-noir {top:0;height:176px;width:952px;margin:1px 0 0 698px;padding:34px 0 0 0;font-size:132px;letter-spacing : 13px;-webkit-text-stroke: 4px #000;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000;}
  /* background stris logo */
  .logo-nav-iafactory-noir::before {background-image: url(../img/bg/bg-logo-iafactory-mediaquery1b.png);background-repeat: no-repeat;background-position:4px 56px;}
  .logo-nav-iafactory-noir:hover {margin:1px 0 0 680px;padding:34px 0 0 0;z-index:999;-webkit-text-stroke: 4px #FFF;text-shadow:-1px -1px 0 #FFF,1px -1px 0 #FFF,-1px  1px 0 #FFF,1px  1px 0 #FFF;}
  .logo-nav-iafactory-noir-box {z-index:8;top:0;height:173px;width:650px;margin:1px 0 0 798px;padding:26px 0 0 0;-webkit-transform:skew(23deg);-moz-transform:skew(23deg);-o-transform:skew(23deg);}
  .logo-nav-iafactory-noir-box-elastic {right:0;height:200px;width:30%;margin:0 0 0 0;padding:0 0 0 0;}
  .nav-briefer-noir {margin:50px 0 0 250px;padding:63px 53px 11px 61px;height:75px;width:235px;font-size:40px;letter-spacing : 4px;line-height:40px;background-image:url(../img/bg/bg-bouton-long-bas-gauche-blanc.png);background-position:-1px 99px;}
  .nav-briefer-noir:hover {background-position:-1px 99px;}
  .nav-baseline-iafactory-noir {margin:184px 0 0 700px;padding:0 0 0 0;line-height:25px;font-size:14px;}

  /* alignement item menu nav colonne droite sur logo */
  .col2-contact a {margin:250px 0 0 702px;}
  .col3-item {margin:489px 0 0 700px;}
  .col4-item {margin:489px 0 0 1050px;}

  /* animation logo - alignement */
  #logo-iafn1-svg {top:0;height:176px;width:952px;margin:13px 0 0 754px;padding:24px 0 0 0;font-size:136px;letter-spacing : 10px;-webkit-text-stroke: 4px #FFF;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000;background-image: url(../img/bg/bg-logo-iafactory-mediaquery1b.png);background-repeat:no-repeat;background-position:0 42px;}
  #logo-iafn1-svg:hover {margin:13px 0 0 730px;padding:24px 25px 0 0;-webkit-text-stroke: 3px #000;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000;background-image: url(../img/bg/bg-logo-iafactory-mediaquery1b.png);background-repeat:no-repeat;background-position:0 42px;}
  .copy-logo-ia {stroke-width: 1.5px;}

}



@media screen and (min-width: 1065px) and (max-width: 1600px) {
  .logo-iafactory {top:63px;height:86px;width:952px;margin:0 0 0 496px;padding:24px 0 0 0;font-size:72px;letter-spacing : 10px;-webkit-text-stroke: 2px #FFF;}
  /* background stris logo */
  .logo-iafactory::before {background-image: url(../img/bg/bg-logo-iafactory-mediaquery2a.png);background-repeat: no-repeat;background-position:1px 36px;}
  .logo-iafactory:hover {margin:0 0 0 487px;padding:24px 0 0 0;-webkit-text-stroke: 2px #000;}
  .logo-iafactory-box {top:0;height:173px;width:250px;margin:-50px 0 0 545px;padding:26px 0 0 0;}
  .logo-iafactory-box-elastic {right:0;height:200px;width:30%;margin:0 0 0 0;padding:0 0 0 0;}
  .bouton-briefer {margin:50px 0 0 150px;padding:67px 53px 11px 29px;height:71px;width:167px;font-size:30px;letter-spacing : 4px;line-height:40px;background-image:url(../img/bg/bg-bouton-long-bas-gauche-noir.png);background-position:-1px 99px;border-bottom:1px solid transparent;border-top:1px solid transparent;border-left:1px solid transparent;border-right:1px solid transparent;}
  .bouton-briefer:hover {background-position:-1px 99px;border-bottom:1px solid #000;border-top:1px solid transparent;border-left:1px solid transparent;border-right:1px solid transparent;}

  .bouton-briefer-animation {margin:50px 0 0 150px;height:151px;width:251px;box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.0);}
  .baseline-iafactory {margin:184px 0 0 449px;padding:0 0 0 0;line-height:25px;font-size:12px;}

  /* nav head */
  .logo-nav-iafactory-noir {top:13px;height:86px;width:952px;margin:0 0 0 446px;padding:24px 0 0 0;font-size:72px;letter-spacing : 10px;-webkit-text-stroke: 2px #000;}
  /* background stris logo */
  .logo-nav-iafactory-noir::before {background-image: url(../img/bg/bg-logo-iafactory-mediaquery2a.png);background-repeat: no-repeat;background-position:1px 36px;}
  .logo-nav-iafactory-noir:hover {margin:0 0 0 436px;padding:24px 0 0 0;-webkit-text-stroke: 2px #FFF;}
  .logo-nav-iafactory-noir-box {top:0;height:173px;width:250px;margin:-50px 0 0 495px;padding:26px 0 0 0;}
  .logo-nav-iafactory-noir-box-elastic {right:0;height:149px;width:30%;margin:0 0 0 0;padding:0 0 0 0;}
  .nav-briefer-noir {margin:0 0 0 150px;padding:67px 53px 11px 29px;height:71px;width:167px;font-size:30px;letter-spacing:4px;line-height:40px;background-image:url(../img/bg/bg-bouton-long-bas-gauche-blanc.png);background-position:-1px 99px;}
  .nav-briefer-noir:hover {border-bottom:1px solid #FFF;border-top:1px solid transparent;border-left:1px solid transparent;border-right:1px solid transparent;background-position:-1px 99px;}
  .nav-baseline-iafactory-noir {margin:134px 0 0 449px;padding:0 0 0 0;line-height:25px;font-size:12px;}

  .bouton-action-aide {margin:-56px 0 0 400px;padding:0 50px 0 0;height:51px;width:299px;line-height:88px;font-size:13px;letter-spacing:2px;background-image:url(../img/bg/bg-bouton-court-haut-droite-noir.png);background-position:298px -1px;}
  .bouton-action-aide:hover {text-decoration:underline;border:1px solid transparent;background-position:298px -1px;}
  .aide-mobile-opti {display:none;} /* spécifique mobile : on tronque le texte du bouton : évaluation par où commencer > devient > par où commencer (et "évaluation" = display:none;)

  /* alignement item menu nav colonne droite sur logo */
  .col0-nav-mobile a {display:none;}
  .col2-contact a {height:100px;width:300px;margin:200px 0 0 451px;padding:50px 0 0 0;letter-spacing:5px;font-size:40px;background-image:url(../img/bg/bg-bouton-long-haut-droite-noir.png);background-position:622px -1px;}
  .col2-contact a:hover {text-decoration:underline;border-bottom:1px dotted transparent;}
  @keyframes fadeColor {from {color: #777;opacity: 0.5;}to {color: #fff; /* blanc */opacity: 1;  /* opaque */}}
  .col3-item {height:250px;width:300px;margin:339px 0 0 450px !important;padding:0 0 0 0;text-align:left;font-size:14px;}
  .col4-item {height:250px;width:300px;margin:489px 0 0 450px !important;padding:0 0 0 0;text-align:left;font-size:14px;}
      .item-titre {display:none;}
      .item-focus {margin:-26px 0 0 0;padding:25px 0 0 0;letter-spacing:2px;font-size:14px;}
      .item-complement {margin:0 0 -21px 0;padding:7px 0 0 0;line-height:25px;letter-spacing:1px;font-size:14px;}
      .menu__divider {margin:37px 0 0 0;width: 0;opacity: 0;height:1px;}/* décoration filet bas de page */
      .item-footer-droit1 {margin:82px 0 0 -400px;}
      .item-footer-droit1 a {padding:0 0 0 0;line-height:25px;letter-spacing:1px;text-underline-offset: 5px;font-size:12px;}
      .item-footer-droitfooter-droit1 a:hover {text-underline-offset: 5px;}
      .item-footer-droit2 {position:absolute;margin:-42px 0 0 -400px;}
      .item-footer-droit2 a {padding:0 0 0 0;line-height:25px;letter-spacing:1px;text-underline-offset: 5px;font-size:12px;}
      .item-footer-droitfooter-droit2 a:hover {text-underline-offset: 5px;}

  .col5-item {height:40px;width:250px;margin:476px 0 0 50px;padding:0 0 0 0;font-size:14px;}
  .col6-item {height:40px;width:250px;margin:501px 0 0 50px;padding:0 0 0 0;font-size:14px;}
      .item-footer-gauche {margin:7px 0 0 0;}
      .item-footer-gauche a {padding:0 0 0 0;line-height:25px;letter-spacing:1px;text-underline-offset: 5px;font-size:12px;}
      .item-footer-gauche a:hover {text-decoration: underline;text-underline-offset: 5px;}

  /* animation logo - alignement */
  #logo-iafn1-svg {top:69px;height:86px;width:952px;margin:0 0 0 498px;padding:24px 0 0 0;font-size:72px;letter-spacing : 10px;-webkit-text-stroke: 2px #FFF;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000;background-image: url(../img/bg/bg-logo-iafactory-mediaquery2a.png);background-repeat:no-repeat;background-position:0 27px;}
  #logo-iafn1-svg:hover {margin:0 0 0 484px;padding:24px 0 0 0;-webkit-text-stroke: 3px #000;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000;background-image: url(../img/bg/bg-logo-iafactory-mediaquery2a.png);background-repeat:no-repeat;background-position:0 27px;}
  .copy-logo-ia {stroke-width: 1.5px;}


}

  @media screen
  and (min-width: 875px)
  and (max-width: 1065px)
  and (min-height: 0px)
  and (max-height: 950px) {

  /* >>	Logo */
  .logo-iafactory {top:63px;height:86px;width:952px;margin:0 0 0 450px;padding:35px 0 0 0;font-size:60px;letter-spacing : 10px;-webkit-text-stroke: 2px #FFF;}
  /* background stris logo */
  .logo-iafactory::before {background-image: url(../img/bg/bg-logo-iafactory-mediaquery2b.png);background-repeat: no-repeat;background-position:1px 46px;}
  .logo-iafactory:hover {margin:0 0 0 442px;padding:35px 0 0 0;-webkit-text-stroke: 2px #000;}
  .logo-iafactory-box {top:0;height:173px;width:250px;margin:-50px 0 0 488px;padding:26px 0 0 0;}
  .logo-iafactory-box-elastic {right:0;height:200px;width:30%;margin:0 0 0 0;padding:0 0 0 0;}
  .scramble-logo {} /* classe spécifique pour toucher le logo avec effet scramble */
  .scramble-logo-noir {} /* classe spécifique pour toucher le logo avec effet scramble dans les fiches noires */
  .logo-aos {}/*hack pour faire fonctionner l'animaton aos du logo sans dénaturer l'effet scramble*/

  /* >>	Briefer */
  .bouton-briefer {margin:50px 0 0 150px;padding:67px 43px 11px 29px;height:71px;width:127px;font-size:25px;letter-spacing : 2px;line-height:44px;background-image:url(../img/bg/bg-bouton-long-bas-gauche-noir.png);background-position:-1px 99px;border-bottom:1px solid transparent;border-top:1px solid transparent;border-left:1px solid transparent;border-right:1px solid transparent;}
  .bouton-briefer:hover {background-position:-1px 99px;border-bottom:1px solid #000;border-top:1px solid transparent;border-left:1px solid transparent;border-right:1px solid transparent;}
       /* >>	Animation contour */
      .bouton-briefer-animation {margin:50px 0 0 150px;height:151px;width:201px;box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.0);}
      .bouton-briefer-animation:hover {}
      .bouton-briefer-animation::before, .bouton-briefer-animation::after {top: 0;left: 0;right: 0;bottom: 0;content: "";box-shadow: inset 0 0 0 1px;}
      .bouton-briefer-animation::before {animation-delay: -5s;/*moitié de clip Me*/}
      @keyframes clipMe {0%, 100% { clip: rect(0, 201px, 1px, 0); } 25% { clip: rect(0, 201px, 151px, 200px); } 50% { clip: rect(150px, 201px, 151px, 0); } 75% { clip: rect(0, 1px, 151px, 0);}}

  /* >>	Baseline */
  .baseline-iafactory {margin:184px 0 0 399px;padding:0 0 0 0;line-height:25px;font-size:12px;}

  /* nav head */
  .logo-nav-iafactory-noir {top:23px;height:86px;width:952px;margin:0 0 0 404px;padding:24px 0 0 0;font-size:60px;letter-spacing : 10px;-webkit-text-stroke: 2px #000;}
  /* background stris logo */
  .logo-nav-iafactory-noir::before {background-image: url(../img/bg/bg-logo-iafactory-mediaquery2b.png);background-repeat: no-repeat;background-position:1px 36px;}
  .logo-nav-iafactory-noir:hover {margin:0 0 0 396px;padding:24px 0 0 0;-webkit-text-stroke: 2px #FFF;}
  .logo-nav-iafactory-noir-box {top:0;height:173px;width:300px;margin:-50px 0 0 443px;padding:26px 0 0 0;}
  .logo-nav-iafactory-noir-box-elastic {right:0;height:149px;width:30%;margin:0 0 0 0;padding:0 0 0 0;}
  .nav-briefer-noir {margin:0 0 0 150px;padding:67px 53px 11px 29px;height:71px;width:117px;font-size:25px;letter-spacing:2px;line-height:40px;background-image:url(../img/bg/bg-bouton-long-bas-gauche-blanc.png);background-position:-1px 99px;}
  .nav-briefer-noir:hover {border-bottom:1px solid #FFF;border-top:1px solid transparent;border-left:1px solid transparent;border-right:1px solid transparent;background-position:-1px 99px;}
  .nav-baseline-iafactory-noir {margin:134px 0 0 399px;padding:0 0 0 0;line-height:25px;font-size:12px;}

  .bouton-action-aide {margin:-56px 0 0 400px;padding:0 50px 0 0;height:51px;width:299px;line-height:88px;font-size:13px;letter-spacing:2px;background-image:url(../img/bg/bg-bouton-court-haut-droite-noir.png);background-position:298px -1px;}
  .bouton-action-aide:hover {text-decoration:underline;border:1px solid transparent;background-position:298px -1px;}
  .aide-mobile-opti {display:none;} /* spécifique mobile : on tronque le texte du bouton : évaluation par où commencer > devient > par où commencer (et "évaluation" = display:none;)

  /* alignement item menu nav colonne droite sur logo */
  .col0-nav-mobile a {display:none;}
  .col2-contact a {height:100px;width:300px;margin:200px 0 0 401px;padding:50px 0 0 0;letter-spacing:5px;font-size:40px;background-image:url(../img/bg/bg-bouton-long-haut-droite-noir.png);background-position:622px -1px;}
  .col2-contact a:hover {text-decoration:underline;border-bottom:1px dotted transparent;}
  @keyframes fadeColor {from {color: #777;opacity: 0.5;}to {color: #fff; /* blanc */opacity: 1;  /* opaque */}}
  .col3-item {height:250px;width:300px;margin:339px 0 0 400px !important;padding:0 0 0 0;text-align:left;font-size:14px;}
  .col4-item {height:250px;width:300px;margin:489px 0 0 400px !important;padding:0 0 0 0;text-align:left;font-size:14px;}
      .item-titre {display:none;}
      .item-focus {margin:-26px 0 0 0;padding:25px 0 0 0;letter-spacing:2px;font-size:14px;}
      .item-complement {margin:0 0 -21px 0;padding:7px 0 0 0;line-height:25px;letter-spacing:1px;font-size:14px;}
      .menu__divider {margin:37px 0 0 0;width: 0;opacity: 0;height:1px;}/* décoration filet bas de page */
      .item-footer-droit1 {margin:82px 0 0 -350px;}
      .item-footer-droit1 a {padding:0 0 0 0;line-height:25px;letter-spacing:1px;text-underline-offset: 5px;font-size:12px;}
      .item-footer-droitfooter-droit1 a:hover {text-underline-offset: 5px;}
      .item-footer-droit2 {position:absolute;margin:-42px 0 0 -350px;}
      .item-footer-droit2 a {padding:0 0 0 0;line-height:25px;letter-spacing:1px;text-underline-offset: 5px;font-size:12px;}
      .item-footer-droitfooter-droit2 a:hover {text-underline-offset: 5px;}

  .col5-item {height:40px;width:250px;margin:476px 0 0 50px;padding:0 0 0 0;font-size:14px;}
  .col6-item {height:40px;width:250px;margin:501px 0 0 50px;padding:0 0 0 0;font-size:14px;}
      .item-footer-gauche {margin:7px 0 0 0;}
      .item-footer-gauche a {padding:0 0 0 0;line-height:25px;letter-spacing:1px;text-underline-offset: 5px;font-size:12px;}
      .item-footer-gauche a:hover {text-decoration: underline;text-underline-offset: 5px;}


  /* animation logo - alignement */
  #logo-iafn1-svg {top:69px;height:86px;width:952px;margin:0 0 0 451px;padding:24px 0 0 0;font-size:60px;letter-spacing : 10px;-webkit-text-stroke: 2px #FFF;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000;background-image: url(../img/bg/bg-logo-iafactory-mediaquery2b.png);background-repeat:no-repeat;background-position:0 37px;}
  #logo-iafn1-svg:hover {margin:0 0 0 439px;padding:24px 0 0 0;-webkit-text-stroke: 3px #000;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000;background-image: url(../img/bg/bg-logo-iafactory-mediaquery2b.png);background-repeat:no-repeat;background-position:0 37px;}
  .copy-logo-ia {stroke-width: 1.5px;}


}






/* ==================================================================== */
/* °°° 	@MEDIAQUERIES                         													*/
/* °°°  875px                       																		*/
/* ==================================================================== */

@media screen and (min-width: 875px) and (max-width: 1600px) {


    /* GENERAL
    ================================================================================================== */
    /* >>	Typographie */
    body {margin-top:-51px;overflow-x:hidden;/* Masque la scroll bar horizontale */}


    /* GRILLE
    ================================================================================================== */
    /* >>	Conteneur grille 100 % */
    .grille-meta {}/*permet de gérer l'arrière plan du site avec la répétition des lignes horizontales */

    /* >>	Conteneur grille repères */
    .grille-reperes {width: 850px;}/*permet de gérer la répétition des repères */

    /* >>	Conteneur conteu 750PX + PADDING 100PX */
    .conteneur-contenu {width: 751px;padding:0 50px 0 50px;}/* englobe le site dans la limite de 1500 px et permet de gérer la répétition interne de l'arrière plan  */


    /* lOGO
    ================================================================================================== */
    /* voir alignement mediaqueries spécifique header */

    /* HEADER
    ================================================================================================== */
    header {height:276px;}
    nav {}

    /* >>	Briefer */
    /* voir alignement mediaqueries spécifique header */

    /* >>	Baseline */
    /* voir alignement mediaqueries spécifique header */

    /* >>	Ariane */
    .fil-ariane {height: 25px;margin:40px 0 0 0;padding: 0 0 0 0;font-size:12px;letter-spacing : 1px;}
    .fil-ariane ul {padding:0 0 0 42px;}
    .fil-ariane ul li {margin:0 0 0 0;padding:0 21px 0 8px;background-image:url(../img/ico/ico-chevron-ariane.png);background-position:right 4px;}
    .fil-ariane ul li a {font-size:12px;letter-spacing : 1px;}
    .fil-ariane ul li a:hover {padding:6px;}

    .fil-ariane ul li.arianelast {background-image:none;}
    .fil-ariane .nochevron {background-image:none;display:none;}/*dernier item pas visible sur petite résolution car il y a le titre*/


    /* BACKGROUND OPTION
    ================================================================================================== */

    /* background optionnel - mindmap... */
    .background-iafactory-map0 {width:600px;height:450px;left:0;top:0;} /* accueil */
    .background-iafactory-map1 {width:600px;height:450px;left:0;top:-50px;} /* hub méthode */
    .background-iafactory-map2 {width:600px;height:450px;left:0;top:-50px;} /* hub prestation */
    .background-iafactory-map3 {width:600px;height:450px;left:0;top:-50px;} /* hub portfolio */
    .background-iafactory-map4 {width:600px;height:450px;left:0;top:-50px;} /* hub carnet */
    .background-iafactory-map5 {width:600px;height:450px;left:0;top:-50px;} /* hub références */
    .background-iafactory-map6 {width:600px;height:450px;left:0;top:-50px;} /* hub IAF */
    .background-iafactory-map7 {width:600px;height:450px;left:0;top:-50px;} /* hub expertises */
    .background-iafactory-map8 {width:600px;height:450px;left:0;top:-50px;} /* hub étude de cas */
    .background-iafactory-map9 {width:600px;height:450px;left:0;top:-50px;} /* hub jm */
    .background-iafactory-map10 {width:600px;height:450px;left:0;top:-50px;} /* 404 - 403 - 500 */
    .background-iafactory-map11 {width:600px;height:450px;left:0;top:-50px;} /* plan du site */
    .background-iafactory-map12 {width:600px;height:450px;left:0;top:-50px;} /* mentions */



    /* MENU DE NAVIGATION
    ================================================================================================== */

    /* hamburger */
    .nav__toggle {margin:50px 0 0 0;background-position:48px -1px;}
    .nav__toggle:hover {background-position:48px -26px;cursor:pointer;border-bottom:1px solid #000;border-top:1px solid transparent;border-left:1px solid transparent;border-right:1px solid transparent;}
    .nav__toggle.menu-open {position: fixed;}/* le hamburger est fixe sans scroll avec la page une fois le menu de navigation déployé - couplé à javascript */
    .nav__toggle-state--open {height:49px;width:49px;margin:0 0 0 0;padding:50px 25px 50px 25px;background-image:url(../img/ico/ico-menu-ouvrir-noir-min.png);background-position:24px 70px}
    .nav__toggle-state--close {height:49px;width:49px;margin:-1px 0 0 -1px;padding:50px 25px 50px 25px;background-image:url(../img/ico/ico-menu-fermer-blanc-min.png), url(../img/bg/bg-bouton-court-haut-droite-blanc.png);background-position:24px 74px, 99px -1px;}
    .nav__toggle:hover .nav__toggle-state--close  {border-bottom:1px solid #FFF;border-top:1px solid transparent;border-left:1px solid transparent;border-right:1px solid transparent;background-image:url(../img/ico/ico-menu-fermer-blanc-min.png), url(../img/bg/bg-bouton-court-haut-droite-blanc.png);background-position:24px 74px, 99px -1px;}

    /* nav head */
    .box-entete {}
          /* >>	briefer */
          /* >>	logo */
          /* voir alignement mediaqueries spécifique header */

    /* nav corps */
    .menu {top: -1px;left: 0;width: 100%;height:calc(100% + 1px);}
    .menu-open-body {top: 0;left: 0;width: 100%;overflow: hidden;}
    .menu__content {margin:0 0 0 0;padding:0 0 0 0;height:100%;}
    .menu__bg {margin:150px 0 0 0;width: 847px;height: 477px;} /* affichage d'une image de background au rollover sur image */
              .menu__content {}
              .menu__bg {}
              .menu__bg.bg2 {}
              .col1-nav {}

    .menu__grid {height:100%;width: 751px;padding:0 50px 0 50px;}/* structuration du menu en grille de 3 colonnes*/

    .box-item {width:750px;margin:0 0 0 0;}
        .col0-nav-mobile a {display:none;}
        .col1-nav {width:250px;margin:215px 0 0 50px;}
            .col1-nav a {-webkit-text-stroke: 1px #FFF;text-shadow:0 0 0 #FFF,0 0 0 #FFF,0  0 0 #FFF,0  0 0 #FFF;}
            .col1-nav a:hover {-webkit-text-stroke: 1px #FFF;text-shadow:-1px -1px 0 #FFF,1px -1px 0 #FFF,-1px  1px 0 #FFF,1px  1px 0 #FFF;}

            .nav__footer-link {margin: 0 0 0 0;overflow: hidden;line-height:46px;letter-spacing:5px;font-size:32px;}/*style des liens du menu*/
                .double-hover {}
                .double-hover span {}
                .double-hover span:nth-of-type(2) {top: 0;left: 0;}

        /* >>	col2-3-4 */
        /* voir alignement mediaqueries spécifique header */





    /* TITRE
    ================================================================================================== */
    h1 {height:50px;width:704px;margin:52px 0 -22px 0;padding: 0 0 0 47px;font-size:26px;letter-spacing : 4px;}


    /* Bouton d'action - en haut à droite */
    /* bouton-action-aide - voir alignement mediaqueries spécifique header */



    /* FOOTER
    ================================================================================================== */
    footer {clear:both;margin:-100px 0 0 0;}
    .footer-allusion {height:100px;margin:38px 0 0 50px;padding:0 0 0 0;font-size:14px;letter-spacing:1px;}

    /* >>	Scroll vers le haut - PIEDPAGE */
    #scrolltop {top: 300px;right: 0;width: 51px;height: 51px;}
    #scrolltop.visible {}


}


/* ==================================================================== */
/* °°° 	@MEDIAQUERIES                         													*/
/* °°°  300px - mobile mini          																		*/
/* ==================================================================== */


@media screen and (min-width:50px) and (max-width:874px){

  /* GENERAL
  ================================================================================================== */
  /* >>	Typographie */
  body {margin-top:-51px;overflow-x:hidden;/* Masque la scroll bar horizontale */}


  /* GRILLE
  ================================================================================================== */
  /* >>	Conteneur grille 100 % */
  .grille-meta {}/*permet de gérer l'arrière plan du site avec la répétition des lignes horizontales */

  /* >>	Conteneur grille repères */
  .grille-reperes {width: 300px;}/*permet de gérer la répétition des repères */

  /* >>	Conteneur conteu 300PX + PADDING 0PX */
  .conteneur-contenu {width: 301px;padding:0 0 0 0;}/* englobe le site dans la limite de 300 px et permet de gérer la répétition interne de l'arrière plan  */


  /* lOGO
  ================================================================================================== */
  /* voir alignement mediaqueries spécifique header */

  /* HEADER
  ================================================================================================== */
  header {height:176px;}
  nav {}

  /* >>	Logo */
  .logo-iafactory {top:50px;height:50px;width:235px;margin:0 0 0 65px;padding:6px 0 0 0;font-size:35px;letter-spacing : 5px;-webkit-text-stroke: 1px #FFF;}
  /* background stris logo */
  .logo-iafactory::before {background-image:none;}
  .logo-iafactory:hover {margin:0 0 0 61px;padding:6px 0 0 0;-webkit-text-stroke: 1px #000;}
  .logo-iafactory-box {top:0;height:73px;/*modif*/width:195px;margin:-50px 0 0 84px;padding:26px 0 0 0;}
  .logo-iafactory-box-elastic {right:0;height:72px;width:50%;margin:28px 0 0 0;padding:0 0 0 0;}

  /* >>	Briefer - pas affiché dans le header*/
      .bouton-briefer, .bouton-briefer:hover, .bouton-briefer-animation, .bouton-briefer-animation:hover, .bouton-briefer-animation::before, .bouton-briefer-animation::after, .bouton-briefer-animation::before
      {display:none;}

  /* >>	Baseline - pas affiché dans le header*/
    .baseline-iafactory {display:none;}

  /* >>	Ariane */
  .fil-ariane {height: 25px;margin:39px 0 0 0;padding: 0 0 0 25px;font-size:12px;letter-spacing : 1px;}
  .fil-ariane ul {padding:0 0 0 0;}
  .fil-ariane ul li {margin:0 0 0 0;padding:0 21px 0 0;background-image:url(../img/ico/ico-chevron-ariane.png);background-position:right 4px;display:none;}
  .fil-ariane ul li a {font-size:12px;letter-spacing : 1px;}
  .fil-ariane ul li a:hover {padding:6px;}

  .fil-ariane ul li.arianelast {background-image:url(../img/ico/ico-chevron-ariane.png);background-position:right 4px;display:block;}
  .fil-ariane .nochevron {background-image:none;display:none;}/*dernier item pas visible sur petite résolution car il y a le titre*/


  /* BACKGROUND OPTION
  ================================================================================================== */

  /* background optionnel - mindmap... */
  .background-iafactory-map0 {display:none;} /* accueil */
  .background-iafactory-map1 {display:none;} /* hub méthode */
  .background-iafactory-map2 {display:none;} /* hub prestation */
  .background-iafactory-map3 {display:none;} /* hub portfolio */
  .background-iafactory-map4 {display:none;} /* hub carnet */
  .background-iafactory-map5 {display:none;} /* hub références */
  .background-iafactory-map6 {display:none;} /* hub IAF */
  .background-iafactory-map7 {display:none;} /* hub expertises */
  .background-iafactory-map8 {display:none;} /* hub étude de cas */
  .background-iafactory-map9 {display:none;} /* hub jm */
  .background-iafactory-map10 {display:none;} /* 404 - 403 - 500 */
  .background-iafactory-map11 {display:none;} /* plan du site */
  .background-iafactory-map12 {display:none;} /* mentions */



  /* MENU DE NAVIGATION
  ================================================================================================== */

  /* hamburger */
  .nav__toggle {margin:50px 0 0 0;border-bottom:1px solid transparent;border-top:1px solid transparent;border-left:1px solid transparent;border-right:1px solid transparent;background-image:none;background-color:rgba(119, 119, 119, 0.050) !important}
  .nav__toggle:hover {background-image:none;cursor:pointer;border-bottom:1px solid #000;border-top:1px solid transparent;border-left:1px solid transparent;border-right:1px solid transparent;}
  .nav__toggle.menu-open {position:absolute;}/* le hamburger est fixe sans scroll avec la page une fois le menu de navigation déployé - couplé à javascript */
  .nav__toggle-state--open {height:49px;width:49px;margin:0 0 0 0;padding:0 0 0 0;background-image:url(../img/ico/ico-menu-ouvrir-noir-mobile.png);background-position:0 -1px;}
  .nav__toggle-state--close {z-index:999;/*icone fermer au-dessus du contenu au scroll */height:49px;width:49px;margin:-1px 0 0 -2px;padding:0 0 0 0;background-image:url(../img/ico/ico-menu-fermer-blanc-mobile.png), url(../img/bg/bg-bouton-court-haut-droite-blanc.png);background-position:0 0, 99px -1px;}
  .nav__toggle:hover .nav__toggle-state--close  {border-bottom:1px solid #FFF;border-top:1px solid transparent;border-left:1px solid transparent;border-right:1px solid transparent;background-image:url(../img/ico/ico-menu-fermer-blanc-mobile.png), url(../img/bg/bg-bouton-court-haut-droite-blanc.png);background-position:0 0, 99px -1px;}

  /* nav head */
  .box-entete {}
    /* nav head */
    .logo-nav-iafactory-noir {top:0;height:50px;width:235px;margin:0 0 0 41px;padding:6px 0 0 0;font-size:35px;letter-spacing : 5px;-webkit-text-stroke: 1px #000;}
    .logo-nav-iafactory-noir::before {background-image:none;}
    .logo-nav-iafactory-noir:hover {margin:0 0 0 36px;padding:6px 0 0 0;-webkit-text-stroke: 1px #FFF;}
    .logo-nav-iafactory-noir-box {top:0;height:73px;width:195px;margin:-50px 0 0 59px;padding:26px 0 0 0;}
    .logo-nav-iafactory-noir-box-elastic {right:0;height:49px;width:50%;margin:0 0 0 0;padding:0 0 0 0;}
    .nav-briefer-noir {display:none;}
    .nav-briefer-noir:hover {display:none;}
    .nav-baseline-iafactory-noir {display:none;}

    /* Animation logo IAFACTORY / SVG */
    #logo-iafn1-svg {top:48px;height:50px;width:231px;margin:0 0 0 71px;padding:6px 0 0 0;font-size:30px;letter-spacing:6px;
    background-image:none;-webkit-text-stroke: 1px #FFF;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000;}

    #logo-iafn1-svg:hover {margin:0 0 0 71px;padding:6px 0 0 0;-webkit-text-stroke: 1px #000;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px  1px 0 #000,1px  1px 0 #000;background-image:none;}
    .text-copy {stroke-width: 1.5px;}


  /* nav corps */
  .menu {top: -1px;left: 0;width: 100%;height:calc(100% + 1px);overflow-y:scroll;overflow-x:hidden;}
  .menu-open-body {top: 0;left: 0;width: 100%;overflow:visible;}
  .menu__content {margin:0 0 0 0;padding:0 0 0 0;height:100%;}
  .menu__bg {margin:0 0 0 0;width: 297px;height: 277px;} /* affichage d'une image de background au rollover sur image */
            .menu__content {}
            .menu__bg {} /* background image au rollover des items */
            .menu__bg.bg2 {}
            .col1-nav {}

  .menu__grid {width: 251px;padding:0 25px 0 25px;}/* structuration du menu en grille de 3 colonnes*/

  .box-item {width:300px;margin:0 0 0 0;}
      .col0-nav-mobile a {/* animation */animation: fadeBrief 0s ease-in-out infinite alternate;position:absolute;display:block;float:left;width:105px;height:50px;margin:69px 0 0 -3px;padding:0 0 0 0;border:1px solid transparent;font-size:20px;letter-spacing : 4px;line-height:40px;font-family: 'typobriquete', "Trebuchet MS", Helvetica, sans-serif;color:#FFF;}
      .col0-nav-mobile a:hover {text-decoration:underline;position:absolute;display:block;float:left;width:105px;height:50px;margin:69px 0 0 -3px;padding:0 0 0 0;border:1px solid transparent}
      @keyframes fadeBrief {from {color: #FFF;opacity: 1.0;}to {color: #777; /* blanc */opacity: 1.5;  /* opaque */}}

      .col1-nav {width:250px;margin:150px 0 0 0;}
          .col1-nav a {border:1px solid transparent;margin:0 0 0 0;-webkit-text-stroke: 1px #FFF;text-shadow:0 0 0 #FFF,0 0 0 #FFF,0  0 0 #FFF,0  0 0 #FFF;}
          .col1-nav a:hover {text-shadow:-1px 0 0 #000, 1px 0 0 #000, 0 -1px 0 #000, 0 1px 0 #000;}

          .nav__footer-link {margin: -2px 0 0 -25px !important;padding:0 25px 0 25px;width:250px;overflow: hidden;line-height:50px;letter-spacing:7px;font-size:18px;}/*style des liens du menu*/

              .double-hover {padding:0 25px 0 25px;height:49px;}
              .double-hover span {}
              .double-hover span:nth-of-type(2) {display:none;} /* annule le bug sur menu mobile via lien contact */


      /* >>	col2-3-4 */
      .col2-contact a {position:absolute;/* animation */animation: fadeColor 1.5s ease-in-out infinite alternate;height:50px;width:250px;margin:375px 0 0 2px;padding:0 0 0 0;line-height:50px;letter-spacing:5px;font-size:20px;background-image:none;}
      .col2-contact a:hover {text-decoration:underline;border-bottom:1px dotted transparent;}


      @keyframes fadeColor {from {color: #777;opacity: 0.5;}to {color: #fff; /* blanc */opacity: 1;  /* opaque */}}
      .col3-item {position:absolute;height:150px;width:250px;margin:434px 0 0 0 !important;padding:0 0 0 0;text-align:left;font-size:14px;}
      .col4-item {position:absolute;height:150px;width:250px;margin:534px 0 0 0 !important;padding:0 0 0 0;text-align:left;font-size:14px;}
          .item-titre {display:none;}
          .item-focus {margin:5px 0 0 0;padding:0 0 0 0;letter-spacing:2px;font-size:14px;}
          .item-complement {margin:0 0 -21px 0;padding:8px 0 0 0;line-height:15px;letter-spacing:1px;font-size:12px;}
          .menu__divider {display:none;}/* décoration filet bas de page */
          .item-footer-droit1 {margin:220px 0 0 0;}
          .item-footer-droit1 a {padding:0 0 0 0;line-height:25px;letter-spacing:1px;text-underline-offset: 5px;font-size:12px;}
          .item-footer-droitfooter-droit1 a:hover {text-underline-offset: 5px;}
          .item-footer-droit2 {position:absolute;margin:96px 0 0 0;}
          .item-footer-droit2 a {padding:0 0 0 0;line-height:25px;letter-spacing:1px;text-underline-offset: 5px;font-size:12px;}
          .item-footer-droitfooter-droit2 a:hover {text-underline-offset: 5px;}

      .col5-item {position:absolute;height:40px;width:250px;margin:553px 0 0 0;padding:0 0 0 0;font-size:14px;}
      .col6-item {position:absolute;height:40px;width:250px;margin:579px 0 0 0;padding:0 0 0 0;font-size:14px;}
          .item-footer-gauche {margin:80px 0 0 0;}
          .item-footer-gauche a {padding:0 0 0 0;line-height:25px;letter-spacing:1px;text-underline-offset: 5px;font-size:12px;}
          .item-footer-gauche a:hover {text-decoration: underline;text-underline-offset: 5px;}

  /* TITRE
  ================================================================================================== */
  h1 {height:50px;width:275px;margin:7px 0 -27px 0;padding: 0 0 0 25px;line-height:25px;font-size:15px;letter-spacing : 1px;}


  /* Bouton d'action - en haut à droite */
  .bouton-action-aide {margin:-82px 0 0 125px;padding:0 25px 0 0;border:1px solid transparent;height:50px;width:149px;line-height:41px;font-size:12px;letter-spacing:1px;background-image:url(../img/bg/bg-bouton-court-haut-droite-noir-min.png);background-position:149px 0px;color:#7F7F7F;text-transform:lowercase;}
  .bouton-action-aide:hover {text-decoration:underline;border:1px solid transparent;background-image:url(../img/bg/bg-bouton-court-haut-droite-noir-min-hover.png);background-position:149px 0px;color:#7F7F7F;}
  .aide-mobile-opti {display:none;} /* spécifique mobile : on tronque le texte du bouton : évaluation par où commencer > devient > par où commencer (et "évaluation" = display:none;)



  /* FOOTER
  ================================================================================================== */
  footer {clear:both;margin:-100px 0 0 0;}
  .footer-allusion {height:100px;margin:38px 25px 0 25px;padding:0 0 0 0;font-size:12px;letter-spacing:0;}

  /* >>	Scroll vers le haut - PIEDPAGE */
  #scrolltop {top: 300px;right: 0;width: 51px;height: 51px;}
  #scrolltop.visible {}


}
