@font-face {
    font-family: 'Faune';
    src:    url('../font/faune/eot/Faune-Display_Black.eot');
    src:    url('../font/faune/eot/Faune-Display_Black.eot?#iefix') format('embedded-opentype'),
            url('../font/faune/woff/Faune-Display_Black.woff') format('woff'),
            url('../font/faune/woff2/Faune-Display_Black.woff2') format('woff2'),
            url('../font/faune/ttf/Faune-Display_Black.ttf') format('truetype'),
            url('../font/faune/svg/Faune-Display_Black.svg#svgFontName') format('svg');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Faune';
    src:    url('../font/faune/eot/Faune-Display_Bold_Italic.eot');
    src:    url('../font/faune/eot/Faune-Display_Bold_Italic.eot?#iefix') format('embedded-opentype'),
            url('../font/faune/woff/Faune-Display_Bold_Italic.woff') format('woff'),
            url('../font/faune/woff2/Faune-Display_Bold_Italic.woff2') format('woff2'),
            url('../font/faune/ttf/Faune-Display_Bold_Italic.ttf') format('truetype'),
            url('../font/faune/svg/Faune-Display_Bold_Italic.svg#svgFontName') format('svg');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Faune';
    src:    url('../font/faune/eot/Faune-Display_Thin.eot');
    src:    url('../font/faune/eot/Faune-Display_Thin.eot?#iefix') format('embedded-opentype'),
            url('../font/faune/woff/Faune-Display_Thin.woff') format('woff'),
            url('../font/faune/woff2/Faune-Display_Thin.woff2') format('woff2'),
            url('../font/faune/ttf/Faune-Display_Thin.ttf') format('truetype'),
            url('../font/faune/svg/Faune-Display_Thin.svg#svgFontName') format('svg');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Faune';
    src:    url('../font/faune/eot/Faune-Text_Bold.eot');
    src:    url('../font/faune/eot/Faune-Text_Bold.eot?#iefix') format('embedded-opentype'),
            url('../font/faune/woff/Faune-Text_Bold.woff') format('woff'),
            url('../font/faune/woff2/Faune-Text_Bold.woff2') format('woff2'),
            url('../font/faune/ttf/Faune-Text_Bold.ttf') format('truetype'),
            url('../font/faune/svg/Faune-Text_Bold.svg#svgFontName') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Faune';
    src:    url('../font/faune/eot/Faune-Text_Italic.eot');
    src:    url('../font/faune/eot/Faune-Text_Italic.eot?#iefix') format('embedded-opentype'),
            url('../font/faune/woff/Faune-Text_Italic.woff') format('woff'),
            url('../font/faune/woff2/Faune-Text_Italic.woff2') format('woff2'),
            url('../font/faune/ttf/Faune-Text_Italic.ttf') format('truetype'),
            url('../font/faune/svg/Faune-Text_Italic.svg#svgFontName') format('svg');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Faune';
    src:    url('../font/faune/eot/Faune-Text_Regular.eot');
    src:    url('../font/faune/eot/Faune-Text_Regular.eot?#iefix') format('embedded-opentype'),
            url('../font/faune/woff/Faune-Text_Regular.woff') format('woff'),
            url('../font/faune/woff2/Faune-Text_Regular.woff2') format('woff2'),
            url('../font/faune/ttf/Faune-Text_Regular.ttf') format('truetype'),
            url('../font/faune/svg/Faune-Text_Regular.svg#svgFontName') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face{ font-family:'infini_safari'; src:url('../font/infini-gras-safari.woff2') format('woff2'), url('../font/infini-gras-safari.woff') format('woff'); font-weight:bold; font-style:normal; }
@font-face{ font-family:'infini'; src:url('../font/infini-gras.woff2') format('woff2'), url('../font/infini-gras.woff') format('woff'); font-weight:bold; font-style:normal; }
@font-face{ font-family:'infini_safari'; src:url('../font/infini-italique-safari.woff2') format('woff2'), url('../font/infini-italique-safari.woff') format('woff'); font-weight:normal; font-style:italic; }
@font-face{ font-family:'infini'; src:url('../font/infini-italique.woff2') format('woff2'), url('../font/infini-italique.woff') format('woff'); font-weight:normal; font-style:italic; }
@font-face{ font-family:'infini_picto'; src:url('../font/infini-picto.woff2') format('woff2'), url('../font/infini-picto.woff') format('woff'); font-weight:normal; font-style:normal; }
@font-face{ font-family:'infini_safari'; src:url('../font/infini-romain-safari.woff2') format('woff2'), url('../font/infini-romain-safari.woff') format('woff'); font-weight:normal; font-style:normal; }
@font-face{ font-family:'infini'; src:url('../font/infini-romain.woff2') format('woff2'), url('../font/infini-romain.woff') format('woff'); font-weight:normal; font-style:normal; }
@font-face{ font-family:'print_clearly'; src:url('printbold-webfont.woff2') format('woff2'), url('printbold-webfont.woff') format('woff'); font-weight:bold; font-style:normal; }
@font-face{ font-family:'print_clearly'; src:url('printclearly-webfont.woff2') format('woff2'), url('printclearly-webfont.woff') format('woff'); font-weight:normal; font-style:normal; }
@font-face{ font-family:'print_clearly'; src:url('printdashed-webfont.woff2') format('woff2'), url('printdashed-webfont.woff') format('woff'); font-weight:normal; font-style:italic; }

@font-face{font-family:'menlo';src:url('../font/menlo-bold-webfont.woff2') format('woff2'), url('../font/menlo-bold-webfont.woff') format('woff');font-weight:bold;font-style:normal;}
@font-face{font-family:'menlo';src:url('../font/menlo-bolditalic-webfont.woff2') format('woff2'), url('../font/menlo-bolditalic-webfont.woff') format('woff');font-weight:bold;font-style:italic;}
@font-face{font-family:'menlo';src:url('../font/menlo-italic-webfont.woff2') format('woff2'), url('../font/menlo-italic-webfont.woff') format('woff');font-weight:normal;font-style:italic;}
@font-face{font-family:'menlo';src:url('../font/menlo-regular-webfont.woff2') format('woff2'), url('../font/menlo-regular-webfont.woff') format('woff');font-weight:normal;font-style:normal;}

*, *::before, *::after { margin:0; padding:0; border:0; background-repeat:no-repeat; box-sizing:border-box; }
*:lang(fr), *:lang(fr) * { quotes:"« " " »" "‘" "’"  }
*:lang(en), *:lang(en) * { quotes:"“" "”" "‘" "’" }

html { font-size:0.58vw; }
body { font-family:Verdana,Helvetica,sans-serif; font-size:1.3rem; color:#333; }

html, body, div#ALL, canvas { width:100%; height:100%; overflow:hidden;  }
video, img, audio { width:100%; height:auto;}
p img { width:100%; height:auto;}
a{ background-color:#fff; line-height:1%;}

div#ALL{  }

article { position:relative;}

a{ color:#ccc; background-color:transparent; }
a:hover{ color:#fff; }
.capital { text-transform:uppercase; font-size:4rem; }
.zone-lien {color:#ccc ;text-decoration:none; background-color:transparent;font-weight:normal; }

a.lien-externe {color:#ccc ;text-decoration:none; font-weight:normal; }
a.lien-externe:hover {color:#EF604D; text-decoration:underline; font-weight:normal; }

p.boutoncentre{text-align:center;}
a.bouton-interne:hover {color:#111; font-style:normal; text-decoration:none; background-color:#fff; }
a.bouton-interne{display:inline-block; background-color:#EF604D;  color: #000;  text-decoration:none;   font-size:2rem; font-family:"faune", sans-serif;  font-weight: bold;
    font-style: normal; margin-top:20px; text-transform:uppercase; text-align:center; padding: 15px 10px 12px 10px;}


span.maj { text-transform:uppercase; font-style:normal; background-color:#000; color:#EF604D;padding:5px 7px; font-family:"Verdana", Helvetica,sans-serif; }
span.colore, a.lien-externe span.colore {color:#EF604D;}
span.maj { text-transform:uppercase; font-style:normal; background-color:#000; color:#EF604D;padding:5px 7px; font-family:"Verdana", Helvetica,sans-serif; }
span.cible { font-size:3rem; text-transform:uppercase; font-style:normal; background-color:#000; color:#fff; padding:5px 7px; font-family:"Verdana", Helvetica,sans-serif; }
span.cible:before{content:' \0025C9';}

div#GLOBAL {  }
div#GLOBAL p{ font-family:"menlo","infini",sans-serif; margin:10px 20px; color:#fff; font-size:1.6rem; }
div#GLOBAL p.gris { color:#ccc;}

div#GLOBAL h1 { font-size:2rem; color:#fff; font-family:"menlo",Helvetica,sans-serif;  }
div#GLOBAL h2, div#GLOBAL  h3 { font-size:1.3rem; color:#fff; font-family:"menlo",Helvetica,sans-serif; color:#eee;  }
div#GLOBAL h4{ font-size:3rem; font-family:"menlo",Helvetica,sans-serif; }
h4.capital { text-transform:uppercase; color:#fff;  font-size:5rem; font-style:normal; font-style:normal; font-family:"menlo", Helvetica,sans-serif;}
div#GLOBAL h5, div#GLOBAL h6{ font-size:1.4rem; margin:0.5rem 0; color:#ccc; font-weight:normal; font-family:"menlo", Helvetica,sans-serif;}


/*CARTEL*/
div.cartel{ position:fixed; top:0; left:0; width:100%; height:100%; z-index:1000; display:none; }
div.cartel div.overlay{ position:absolute; top:0; left:0; width:100%; height:100%; background-color:#000; opacity:0.8; }
div.cartel > section{  position:absolute; top:50%; left:50%; min-width:150px; max-width:90%; transform:translateX(-50%) translateY(-50%);  }
/*div.cartel.on ~ canvas{ filter:blur(30px); }*/

div.cartel section h2,
div.cartel section h3,
div.cartel section h4,
div.cartel section h5 { text-align:center; font-family:"faune",sans-serif; font-size:2rem;  font-weight:normal; color:#ccc; font-style:normal; }
div.cartel p {text-align:center; }
div#bloc3 h1 {text-align:left;}
div#bloc3 h1#principal, div#bloc2 h1#principal, div#bloc h1#principal,div.cartel h1#principal { font-family:"faune",sans-serif; font-style:normal; font-size:4rem;}
div#bloc3 h1#principal, div#bloc2 h1 {text-align:left; }
div#bloc3 p, div#bloc2 p, div#bloc p, div.cartel p{ font-family:"faune","menlo",sans-serif; margin:10px 20px; font-style:normal;  font-size:2rem; color:#fff;}
div#bloc3 p.gris, div#bloc2 p.gris, div#bloc p.gris, div.cartel p.gris { color:#666; font-weight:normal;}
div#bloc3 p.gris a,div#bloc2 p.gris a, div#bloc p.gris a, div.cartel p.gris a{ color:#666; font-weight:10;  
    font-style: normal; }

div.cartel h2, div.cartel h3, div.cartel h4
{ 
	margin:0 20px; font-size:1.3rem; color:#fff; font-family:Verdana,Helvetica,sans-serif; font-size:2rem; color:#333;  
}
div.cartel p.bouton { text-align:center;  margin:20px 0;  }
div.cartel p.bouton button{ display:inline-block; font-family:"menlo",sans-serif; font-size:1.8rem; color:#EF604D; background-color:#fff;  font-weight:bold; font-style:normal;  text-transform:uppercase; text-align:center; padding:10px 30px; cursor:pointer;}
div.cartel p.bouton button:hover {color:#111; background-color:#EF604D; }


*[class*="voile-"]{ color:#fff; }
*[class*="voile-"] > * { position:relative; color:#fff; }
*[class*="voile-"]::before{ position:absolute; content:''; top:0; bottom:0; left:0; right:0; background-color:rgba(255,255,255,0.6); }
*.voile-noir::before  { background-color:rgba( 0, 0, 0, 0.6); --wip-tag:'section div'; }