/**
 * @CSS DOCUMENT
 * @ 02.2021
*/
@font-face{
    font-family:"Big Caslon FB W01 Regular";
    src:url("Fonts/b13b52d9-4248-467d-92ab-f33f5974f40c.woff2") format("woff2"),url("Fonts/54335674-fce8-44a0-b946-cc3b1ed7c283.woff") format("woff");
}
@font-face{
    font-family:"Helvetica"; /*Helvetica Neue LT W01_55 Roman*/
    src:url("Fonts/cd4d37bc-a3cb-4b93-a343-33976b64e272.woff2") format("woff2"),url("Fonts/854614dd-05d5-4a91-a8fc-119d3e4697f0.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    }
@font-face{
    font-family:"Helvetica"; /*Helvetica Neue LT W05_65 Medium*/
    src:url("Fonts/240c57a0-fdce-440d-9ce3-85e0cb56f470.woff2") format("woff2"),url("Fonts/7802e576-2ffa-4f22-a409-534355fbea79.woff") format("woff");
    font-weight: 500;
    font-style: normal;
}
@font-face{
    font-family:"Helvetica"; /*Helvetica Neue LT W05_75 Bold*/
    src:url("Fonts/800da3b0-675f-465f-892d-d76cecbdd5b1.woff2") format("woff2"),url("Fonts/7b415a05-784a-4a4c-8c94-67e9288312f5.woff") format("woff");
    font-weight: bold;
    font-style: normal;
}
@font-face {
  font-family: 'pictos';
  src: url('Fonts/pictos.eot?77219245');
  src: url('Fonts/pictos.eot?77219245#iefix') format('embedded-opentype'),
       url('Fonts/pictos.woff2?77219245') format('woff2'),
       url('Fonts/pictos.woff?77219245') format('woff'),
       url('Fonts/pictos.ttf?77219245') format('truetype'),
       url('Fonts/pictos.svg?77219245#pictos') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'pictos';
    src: url('../font/pictos.svg?77219245#pictos') format('svg');
  }
}
*/
[class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "pictos";
  font-style: normal;
  font-weight: normal;
  speak: never;
 
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
 
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
.icon-phone:before { content: '\e800'; } /* '' */
.icon-mail:before { content: '\e807'; } /* '' */
.icon-ok:before { content: '\e808'; } /* '' */
.icon-cancel:before { content: '\e809'; } /* '' */
.icon-down:before { content: '\f004'; } /* '' */
.icon-up:before { content: '\f005'; } /* '' */
.icon-right:before { content: '\f006'; } /* '' */
.icon-left:before { content: '\f007'; } /* '' */
.icon-menu:before { content: '\f008'; } /* '' */
.icon-location:before { content: '\f031'; } /* '' */
.icon-facebook:before { content: '\f052'; } /* '' */
.icon-instagram:before { content: '\f05d'; } /* '' */
.icon-car:before { content: '\f1b9'; } /* '' */
.icon-search:before { content: '\f50d'; } /* '' */

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

/* ======================================================
   TRANSITIONS
====================================================== */
a, button, .btn { transition: all ease-in-out 0.2s; }
/*.sub-menu { transition: opacity ease-in-out 0.2s; }*/

/**------------------------------
 * GENERAL CLASSES and SETTINGS
--------------------------------**/
html, body { height: 100%; }
body { font:1em/1.5 "Helvetica",arial,helvetica,sans-serif; color: #231f20; text-align:left; background:#b89d18; }

h1 { margin:.5em auto 0; padding: 1em 0 .8em; max-width: 750px; font:500 1em/1.1 "Helvetica",arial,helvetica,sans-serif; color:#231f20; text-align: center; }
h1::after { display:block; content:''; margin: 1em auto 0; width:100px; height: 3px; line-height: 3px; background-color: #231f20; }
h2 { margin:3em 0 1em; font:500 1em/1.1 "Helvetica",arial,helvetica,sans-serif; color:#b89d18; }
h2::after { display:block; content:''; margin: 1em 0 0; width:50px; height: 3px; line-height: 3px; background-color: #b89d18; }
h3 { margin:1em 0 .5em; font:bold 1.2em/1.2 "Helvetica",arial,helvetica,sans-serif; }
h4 { margin:1em 0 .5em; font:bold 1em/1.2 "Helvetica",arial,helvetica,sans-serif; }
h5 { margin:1em 0 .5em; font:bold 1em/1.2 "Helvetica",arial,helvetica,sans-serif; }
h6 { margin:1em 0 .5em; font:bold 1em/1.2 "Helvetica",arial,helvetica,sans-serif; }

a { color:#b89d18; text-decoration: underline; }
a:hover, a:focus { color: #b89d18; }
a[href^="tel:"], a[href^="fax:"] { color: #231f20; text-decoration: none; }
a[href^="tel:"]:before { font-family: 'pictos'; content: "\e800"; margin-right: 0.5em; }
p { margin:1em 0; }
ul { margin:.5em 1.5em; }
ul li { margin:.5em 0; list-style: disc; }
hr { display:block; margin:1em 0; padding:0; border:none; background-color:#231f20; color:#231f20; font-size:1px; height:1px; line-height:1px; }

/* ======================================================
   CLASSES génériques
====================================================== */
.wrapper { position: relative; margin: 1em auto 0; }
.inner { position: relative; margin: 0 auto; width: 100%; max-width: 1280px; z-index: 12; }
.center { text-align: center; }
.invisible, .hidden { display:none; }
.smaller { font-size:0.8em; }
.caps { text-transform:uppercase; }
.msg, .error-msg, .error { color: #ff5050; }
.success { color: #5bff5b; font-style: italic; }
.transparent { zoom: 1; filter: alpha(opacity=90); opacity: 0.9; }
.clearing { clear:both; }
.clear-float { clear:both; }
.clear-fix::after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clear-fix { zoom:1; } /** IE 5.5/6/7 */
.responsive { position: relative; margin:auto; padding: 0 0 50% 0; height: 0; overflow: hidden; }
.responsive iframe { position: absolute; top: 0; left: 0; width: 100%; height: calc(100vw * 0.5); }
.responsive img { display: block; position: absolute; top: 0; left: 0; width: 100%; height: calc(100vw * 0.5); object-fit: cover; object-position: 50% 50%; }
.button, a.button { display: inline-block; margin: 1em 0; padding: 0.5em 1em; background-color: #fff; font-size: 1em; line-height: 1; color: #b89d18; text-decoration: none; text-align: center; border:1px solid #b89d18; }
.button:hover, a.button:hover, .button:focus, a.button:focus { color: #fff; background-color: #b89d18; }
a.btn-white { color: #007edb; background-color: #fff; border-color: #007edb; }
a.btn-white:hover, a.btn-white:focus { color: #231f20; border-color: #231f20; }

/* Formulaires */
form { margin:1.5em auto; max-width: 480px; text-align: left; }
form legend { margin: 1em 0; font-size: 1em; }
form div.line { clear:both; margin:0.5em 0; padding: 0; max-width: 580px; }
form div.line label { display:block; margin:0 auto; padding:0.2em 0; cursor:pointer; }
form input[type="text"], form input[type="password"], form textarea, form select { 
  padding:0.2em 0.5em; width:100%; font:.9em/1.5 "Helvetica",arial,helvetica,sans-serif; color:#231f20; background-color:#fff; border:2px solid #efefef; }
form input[type="text"]:focus, form input[type="password"]:focus, form textarea:focus, form select:focus { border-color:#b89d18; }
form textarea { height:12em; }
form div.code-image { clear:both; margin:0.5em 0; padding: 0; max-width: 580px; }
form div.code-image label { display:block; float:none; margin-bottom:0.5em; width:100%; }
a.btn-reloadimgcode { display: inline-block; margin: 0 .5em; padding: .1em .5em; font-size: .7em; color: #9c9c9c; text-decoration: none; background-color:#fff; border: 1px solid #9c9c9c; border-radius: .2em; text-align: center; }
a.btn-reloadimgcode:hover, a.btn-reloadimgcode:focus { color:#b89d18; background-color:#fff; border-color: #b89d18; }
form div.code-image img { float:left; margin:0 1em 0 0; padding: 0; width:160px; border:none; border-radius: unset; }
form div.code-image #field-captcha { height:50px; width:140px; text-align:center; letter-spacing:0.2em; text-transform:uppercase; }
form input[type="submit"], button { display: inline-block; margin: 1em 0; padding: 0.5em 1em; background-color: #fff; font-family: arial,helvetica,sans-serif; font-size: 1em; line-height: 1; color: #b89d18; text-decoration: none; border:2px solid #b89d18; cursor: pointer; text-align: center; }
form input[type="submit"]:hover, form input[type="submit"]:focus, button:hover, button:focus { color: #fff; background-color: #b89d18; }

/**--------------
 * HEADER 
--------------**/
.top { position: fixed; top:0; width: 100%; z-index: 100; }
.top .wrapper { position:relative; margin: 0 auto; padding: 0 4%; background-color:#b89d18; z-index: 20; }
#header .wrapper div.inner { display: flex; align-items: center; justify-content: space-between; }
a.logo { display:inline-block; }
a.logo img { height: 50px; width: auto; }

/**********************************
	# MENU
**********************************/
nav { position: relative; z-index: 18; }
#toggle-menu { display:block; padding:1em; font-size:.8em; color:#fff; text-transform: uppercase; text-align: left; cursor:pointer; }
#toggle-menu i { display:inline-block; padding: .5em .5em .6em .5em; font-size:2em; line-height:1; color:#fff; text-decoration:none; vertical-align: middle; }
#toggle-menu:hover, #toggle-menu:focus, #toggle-menu:hover i, #toggle-menu:focus i { color:#fff; }
#blk-menu { display: none; position:absolute; top: 0; left:0; right:0; padding-top:85px; background-color: #b89d18; border-bottom: 2px solid #b89d18; overflow-x: hidden; overflow-y: auto; z-index: 19; }
#blk-menu.active { display: block; }
.menu { position: relative; margin:0; padding:0; }
.menu li { display: block; position: relative; list-style: none; text-align: center; }
.menu>li { margin: .5em 0; }
.menu li a::before { content: ''; display: inline-block; position: absolute; bottom: 0; left: 0; margin:0 auto; width: 100%; height: 1px; background-color: #d94fe6; }
.menu li:last-child a::before { display: none; }
.menu li a { display:block; position: relative; padding:1em 1em 1.5em; font:500 .9rem/1 "Helvetica",arial,helvetica,sans-serif; color:#fff; text-decoration:none; white-space: nowrap; }
.menu li a:hover, .menu li a:focus, li a.active { color:#fff; text-decoration:none; }
.menu li.btn-open>a::after { display: inline-block; margin-left:.5em; font-family: 'pictos'; font-size: .7em; line-height: 1; content: '\f004'; }
.sub-menu { display: none; margin:0; padding:0; background-color: #fff; border-bottom: 1px solid #777; }
.sub-menu li { margin: 0 0 .5em; }
.sub-menu li:last-child { margin: 0; }
.sub-menu li a::before { background-color: #ccc; }

/*************************************
	* Main, content
*************************************/
#main { position: relative; padding: 1px 0 2em; min-height:calc(100vh - 100px); background-color: #fff; z-index: 10; }
.hero { width: 100%; height:80px; background-color: #fff; }
section { padding: 1.5em 4% 0; }
.ctn-flex-grid { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; flex-direction: row; padding:0 0 1px; }
.grid-item { position: relative; display: inline-block; margin: 1em 0; padding: 0; width: 100%; }
.ctn-image img { object-fit: contain; margin: auto; width: 100%; max-width: 360px; max-height: 270px; }
.ctn-center { text-align: center; }

/* Bloc de texte */
.text { margin:1em auto; padding:0 0 1px; max-width: 750px; }
.text img { display: inline-block; margin:1em; padding:1em; }
.text img.artistphoto { display: block; margin:1em auto; padding:0; width: 100%; max-width: 640px; max-height: 320px; object-fit: contain; object-position: 50% 50%; }
.text .ctn-image img { display: block; margin: 0; padding: 0; }
.text div.img-left { text-align: center; }
.text div.img-right { text-align: center; }
.text div.img-left img, .text div.img-right img { margin: 0 auto; padding: 0; width: 100%; }
.text .responsive { max-width: inherit; }
.text .responsive img { display: block; margin: 0; padding: 0; width: 100%; height: auto; }

.gallery { max-width: 750px; margin: 0 auto; }
.gallery img { width: 100%; }
.gallery .grid-item { padding: 0 1em; }

/* Evénements vignettes */
.events { margin:1em 0; }
.flip-container { 
  margin:auto; width:180px; height: 240px; border:2px solid #b89d18; 

  -webkit-perspective: 1000; 
  -moz-perspective: 1000; 
  -ms-perspective: 1000; 
  perspective: 1000; 

  -ms-transform: perspective(1000px); 
  -moz-transform: perspective(1000px); 
    -moz-transform-style: preserve-3d; 
    -ms-transform-style: preserve-3d; 
  /*transform-style: preserve-3d;*/ 
}
/*
.flip-container:hover .flipper, .flip-container.hover .flipper { transform: rotateY(180deg); }
*/
.flip-container:hover .back, .flip-container.hover .back {
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    transform: rotateY(0deg);
}

.flip-container:hover .front, .flip-container.hover .front {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
.flipper { 
  -webkit-transition: 0.6s;
  -webkit-transform-style: preserve-3d;
  -ms-transition: 0.6s;

  -moz-transition: 0.6s;
  -moz-transform: perspective(1000px);
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;

  transition: 0.6s;
  transform-style: preserve-3d;

  position: relative; 
}
.front, .back { 
  -webkit-backface-visibility: hidden; 
  -moz-backface-visibility: hidden; 
  -ms-backface-visibility: hidden; 
  backface-visibility: hidden; 

  -webkit-transition: 0.6s;
  -webkit-transform-style: preserve-3d;
  -webkit-transform: rotateY(0deg);

  -moz-transition: 0.6s;
  -moz-transform-style: preserve-3d;
  -moz-transform: rotateY(0deg);

  -o-transition: 0.6s;
  -o-transform-style: preserve-3d;
  -o-transform: rotateY(0deg);

  -ms-transition: 0.6s;
  -ms-transform-style: preserve-3d;
  -ms-transform: rotateY(0deg);

  transition: 0.6s;
  transform-style: preserve-3d;
  transform: rotateY(0deg); 

/*position:absolute;*/  position: relative; top: 0; left: 0; padding:1em; width:176px; height: 236px; text-align: center; overflow: hidden; 
}
.front { 
  -webkit-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  color: #fff; background-color: #b89d18; z-index: 2; 
}
.back { 
  -webkit-transform: rotateY(-180deg);
  -moz-transform: rotateY(-180deg);
  -o-transform: rotateY(-180deg);
  -ms-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
  font-size: .78em; color: #000; background-color: #fff; z-index: 1; 
}
.front img { width: 100%; }
.event-date { display:flex; flex-flow:column-reverse; height:50%; padding:1.2rem .5em; }
.event-date span { display: block; font:normal .8rem/1.1 "Helvetica",arial,helvetica,sans-serif; }
.event-date span:nth-child(1) {  }
.event-date span:nth-child(2) {  }
.event-date span:nth-child(3) {  }
.event-date span:nth-child(4) { line-height: 2; }
.front h2 { margin:0 1em; padding: 1.2rem 0 0; font-size: .8rem; color: #fff; border-top: 1px solid #fff; }
.front .warning { display: inline-block; margin-top:1em; font-size: .7em; line-height:1; color: #b89d18; }
.back ul { max-height: 100%; }
.back ul li { list-style: none; font-weight: bold; line-height: 1; }
.back span { display: block; margin-top: .2em; font-size: .8em; font-weight: normal; text-transform: uppercase; line-height: 1.2; }
.back::after { display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 100px; background: #fff; background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 80%, rgba(255,255,255,0) 100%); content: ''; z-index: 1; }
.back .button { position: absolute; bottom: 0; left:50%; transform: translateX(-50%); z-index: 2; }

/* Homepage */
.home h2 { margin-top: 1em; font-size: 1.2em; text-align: center; }
.home h2::after { display: none; }
.home .flip-container { width:180px; height: 280px; border:0 solid #231f20; }
.front { margin: auto; width:280px; height: 280px; }
.front { padding: 0; color: #fff; background-color: #231f20; border-color: #231f20; border-radius: 50%; }
.events div.grid-item:nth-child(even) .front { color: #231f20; background-color: #b89d18; border-color: #b89d18; }
.home .back { font-size: 1em; color: #fff; background-color: #b89d18; }
.front h2 { margin:0 2em; font-size: .8rem; color: #b89d18; border-color: #b89d18; }
.events div.grid-item:nth-child(even) .front h2 { color: #231f20; border-color: #231f20; }
.front h2::after { display: none; }
.front a.button { font-size: .8rem; color:#b89d18; background-color: #231f20; border-color:#b89d18; text-transform:uppercase; }
.front a.button:hover, .front a.button:focus { color:#fff; background-color: #b89d18; }
.home .event-date {  }
.events .event-date span:nth-child(1) { margin: .5em auto 0; font-size: 1.3em; line-height: 1; }
.home .back::after { background: #b89d18; background: linear-gradient(0deg, #b89d18 0%, #b89d18 80%, rgba(183,29,197,0) 100%); content: ''; z-index: 1; }
.home .back .button { color: #fff; background-color: #b89d18; border-color: #fff; }
.home .back .button:hover, .home .back .button:focus { color: #b89d18; background-color: #fff; }
.corona { margin: 2em auto 1em; max-width: 750px; text-align: center; font: 500 1em/1.1 "Helvetica",arial,helvetica,sans-serif;
color: #b89d18; }

/* Partenaires */
.ctn-flex-grid.partners .grid-item { width: 50%; text-align: center; }
.ctn-flex-grid.partners img { margin: auto; padding: 0; max-width: 200px; max-height: 80px; }

/* Archives */
.list-editions { margin:.5em 0; justify-content: flex-start; align-items: flex-start; }
.list-editions li { width: 50%; }
.list-editions a { display: block; margin: auto; padding: 50px 10px 0 10px; width: 120px; height: 160px; color: #b89d18; text-decoration: none; text-align: center; background-color: #fff; border:2px solid #b89d18; }
.list-editions a:hover, .list-editions a:focus { color:#fff; background-color: #b89d18; }
.list-artists { margin:.5em 0 3em; justify-content: flex-start; align-items: flex-start; }
.list-artists li { margin:0; list-style: none; line-height: 1; }
.list-artists a { display: block; padding: .5em; color:#231f20; text-decoration: none; border-bottom: 1px solid #efefef; }
.list-artists a:hover, .list-artists a:focus { color: #fff; background-color: #b89d18; }

/* Evénement */
.eventhour { color:#b89d18; text-align: center; }
.linkEdition { display: block; margin:3em auto; max-width: 750px; text-align: center; }

/* Contact */
.btn-tel { display:inline-block; margin: .5em 0;  }
.btn-email { display:inline-block; }


/***************************************
	# Footer
***************************************/
#footer { position: relative; padding:1em 4% 1em; background-color: #b89d18; z-index: 10; }
#footer .inner { max-width: 750px; text-align: center; }
#footer a { color: #fff; }
#footer a:hover, #footer a:focus { color: #fff; border-color:#fff; }
.btn-insta, .btn-fb { display: block; position: relative; margin:.5em; padding: .5em; line-height: 1; text-decoration: none; }
.btn-insta::before { display: inline-block; font-family: 'pictos'; font-size: 2em; line-height: 1; content: '\f05d'; }
.btn-fb::before { display: inline-block; margin:0 .25em; font-family: 'pictos'; font-size: 2em; line-height: 1; content: '\f052'; }
.copyright { display: block; margin:0 auto; padding: .5em 0 0; font:500 .7em/1.5 "Helvetica",arial,helvetica,sans-serif; color:#fff; }
.signature { display: inline-block; margin: 0 auto; padding: .5em 0; font-size: .6em; }
.btn-go-top { display: none; position: relative; left: calc(50% - 15px); margin:2em auto; font-size: 1.2em; text-align: center; }
.btn-news { display: inline-block; position: relative; margin:.5em auto; padding: .5em .5em .5em .5em; line-height: 1; text-decoration: none; border:1px solid #fff; }

/**=====================================================
   Affichage selon ORIENTATION
====================================================== */
@media (orientation:landscape) {
  .grid-item { width: calc(100% / 2); }
  /* Partenaires */
  .ctn-flex-grid.partners .grid-item { width: 50%; }
  .ctn-flex-grid.gallery .grid-item { width: 50%; }
  /* Archives */
  .list-editions li { width: calc(100% / 3); }
  .list-artists li { margin-right: 2%; width: 48%; }
}


/**=====================================================
   ECRANS taille moyenne : tablettes, petits notebooks
====================================================== */
@media (min-width:768px) {
  .grid-item { width: calc(100% / 3); }
  /* homepage */
  .events .grid-item { width: calc(100% / 3); }
  /* Bloc de texte */
	.text div.img-left { float: left; margin: 0 1em 1em 0; width:60%; }
	.text div.img-right { float: right; margin: 0 0 1em 1em; width:60%; }
	.img-left img, .img-right img { margin: 0; padding: 0; }
  /* Galerie photos */
  .text .gallery { flex-direction: row; }
  a.gallery-item { margin: .5em 2%; width: calc(92% / 2); max-width: calc(92% / 2); }
  /* Partenaires */
  .ctn-flex-grid.partners .grid-item { width: calc(100% / 3); }
  .ctn-flex-grid.gallery .grid-item { width: calc(100% / 3); }
  /* Archives */
  .list-editions li { width: calc(100% / 4); }
  .list-artists li { margin-right: 2%; width: 48%; }
  /* Contact */
  #contactSection::before { height: 100%; }
  /* Footer */
  #footer .inner { text-align: left; }
  .btn-insta, .btn-fb, .btn-news { float: right; margin:0 .5em; }
  .copyright { margin:0; }
  .signature { margin: 0; }
}

@media (min-width:1024px) {
	body { font-size: 1.1em; background-image: none; }
  .grid-item { width: calc(100% / 4); }
	.ctn-center { max-width: 750px; }
  .responsive { padding: 0 0 25% 0; }
  .responsive iframe { height: calc(100vw * 0.25); }
  .responsive img { height: calc(100vw * 0.25); }
  .top .wrapper { padding: 1em 4%; z-index: 19; }
  a.logo img { height: 60px; }
	#toggle-menu { display: none; }
	#blk-menu { display: block; top: 50%; transform: translateY(-50%); margin: 0 auto 0 30%; padding-top: 0; min-width: 550px; max-width: 820px; border-bottom: none; background-color: transparent; text-align: right; overflow: inherit; z-index: 20; }
	.menu { position:relative; margin: 0 auto; padding-right: 2em; width:auto; }
	.menu li { display:inline-block; position: relative; margin: 0; padding: 0; }
	.menu li a::before { display: none; }
	.menu li a { padding:.5em; }
	.sub-menu { display: none; position: absolute; left: 0; padding: 0; min-width: 200px; border-top: 1px solid #ccc; }
	.sub-menu li { width: 100%; }
	.sub-menu li a { border-bottom:1px solid #ccc; text-align: left; }
  .sub-menu li:last-child a { border: none; }
  .hero { height:100px; }
  /* homepage */
  .events .grid-item { width: calc(100% / 3); }
  .home .flip-container { width:280px; height: 400px; }
  .home .front, .home .back {  }
  /* Archives */
  .list-editions li { width: calc(100% / 5); }
  .list-artists li { margin-right: 2%; width: calc(94% / 3); }
}



/**=====================================================
   ECRANS + grands
====================================================== */
@media (min-width:1280px) {
	body { font-size: 1.2em; }
  .grid-item { width: calc(100% / 6); }
  #blk-menu { margin-left: 40%; }
	.menu li a { padding:.5em 1em; }
  .list-editions li { width: calc(100% / 7); }
}