/*
Theme Name: Geometry
Description: A theme by Geometry - Brussels - Visit us at http://www.geometry.be
Author: Geometry
Version: 1.0
*/

/* CSS RESET */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,  figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
/* END CSS RESET */

@font-face {
 font-family: SportGrotNormal;
 src: url("fonts/sporting_grotesque_normal.eot")
}
@font-face {
 font-family: SportGrotNormal;
 src: url("fonts/sporting_grotesque_normal.ttf")
}
@font-face {
 font-family: SportGrotGras;
 src: url("fonts/sporting_grotesque_gras.eot")
}
@font-face {
 font-family: SportGrotGras;
 src: url("fonts/sporting_grotesque_gras.ttf")
}

/* TYPO */

h1,
h2,
h3 { 
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	 -o-hyphens: auto;
 	hyphens: auto;
}

h1,
.upper,
#main-menu .box,
.switcher-list { /* Titre et Rubrique */
	font-family: SportGrotGras; 
	font-size: 20px;
	line-height: 1.2em;
	text-transform: uppercase;
}

.upper.small { /* Sous-rubrique */
	font-family: SportGrotGras; 
	font-size: 13px;
	line-height: 1.2em;
	text-transform: uppercase;
}

body,
#mc_embed_signup input { /* Texte courant */
	font-family: SportGrotNormal; 
	font-size: 13px;
	letter-spacing: 0;
	line-height: 1.2em;
}

strong,
p strong { /* Texte courant gras */
	font-family: SportGrotGras; 
	font-size: 14px;
	line-height: 1.2em;
}

h2,
.big p {  /* Chapeau et sous-titres */
	font-family: SportGrotNormal; 
	font-size: 16px;
	line-height: 1.2em;
}

.big p strong { /* Chapeau gras */
	font-family: SportGrotGras; 
	font-size: 18px;
	line-height: 1.2em;
}

.small { /* Texte courant */
	font-family: SportGrotNormal; 
	font-size: 11px;
	letter-spacing: 0;
	line-height: 1.2em;
}

h3 {  /* Mois de l'agenda */
	font-family: SportGrotNormal; 
	font-size: 28px;
	line-height: 1.2em;
}

.distribution,
.equipe {
    margin-bottom: 24px;
}

h1,
h2,
p {
	margin-bottom: 1.2em;
}

h2 {
	margin-top: 1.2em;
}

a {
	text-decoration: underline;
}

p span,
.upper a,
header a div {
	text-decoration: none !important;
}

.upper a:hover,
header a:hover div {
	text-decoration: underline !important;
}

.box ul {
    list-style-type: disc;
    padding-left: 1.2em;
    margin-bottom: 1.2em;
}

.box ul li {
    padding-bottom: 1.2em;
}

.box ul li:last-child {
    padding-bottom: 0;
}
 
/* MENU */

#logo,
#menu {
    cursor: pointer;
}

#logo {
    position: relative;
}

#logo img {
    position: absolute;
    top: 0;
    left: 0;
}

#logo img:last-child {
    position: static;
    opacity: 0;
}
 
#logo-home,
#menu,
.home #logo {
    display: none;
}

#thor-hover {
    opacity: 0;
}

.home #logo-home {
    display: block;
}

#main-menu {
    margin-top: 60px;
    max-height: 0;
    position: relative;
	overflow: hidden;
    transition: 0.4s all ease-out;
}

#sub-menu {
    position: relative;
	overflow: hidden;
}

#sub-menu.line {
    border-top-width: 1px;
    border-style: solid;
    padding-top: 60px;
}

.home #main-menu,
#main-menu.open {
    max-height: 80vw;
    transition: 1s all ease-out;
}
 
.box.creations > div,
#sub-menu .box > div,
#main-menu .box > div {
    width: 100%;
}

header img {
    width: 100%;
    display: block;
}

header nav img {
    width: calc(100% - 30px);
    margin: 20px 15px 10px 15px;
}

.creations img,
header .mini img {
    width: calc(100% - 40px);
    display: block;
	margin: 20px;
}

#sub-menu .no-link,
#sub-menu .box a,
#main-menu .box a {
    z-index: 1;
    display: block;
    position: static;
    width: 100%;
}

#sub-menu .mini,
.mini.creations {
	padding-top: calc((100% / 3 - 16px) / 2);
	position: relative;
}

.space {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
}

.carousel-cell {
	width: 100%;
	margin: 0;
	counter-increment: carousel-cell;
	padding: 0;
}

.flickity-page-dots,
.flickity-button {
	display: none;
}


.symbols .flickity-slider {
    transform: none !important;
}

.symbols .carousel-cell {
    left: 0 !important;
    opacity: 0;
    z-index: -1;
}

.symbols .carousel-cell.is-selected {
    opacity: 1;
    z-index: 0
}

.rubrique {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1000;
}

/* BACKGROUND */

#bg_left,
#bg_right {
    width: 40vw;
}

#bg_left_crop,
#bg_right_crop {
    width: 25vw;
}

#bg_left,
#bg_left_crop {
	float: left;
}

#bg_right,
#bg_right_crop {
    float: right;
}

#background .photo,
#background .photo_crop {
	width: 100%;
    height: 40vw;
    background-size: contain;
	background-repeat: no-repeat;
}

#background .photo_crop {
    background-size: cover;
    background-position: center center;
}

#background #bg_left .photo {
    background-position: left bottom;
}

#background #bg_right .photo {
    background-position: right bottom;
}

.caption {
    filter: brightness(75%);
}

#bg_left .caption {
    margin-top: 1em;
    margin-bottom: 60px;
    margin-left: 1em;
    text-align: left;
}

#bg_right .caption {
    margin-top: 1em;
    margin-bottom: 60px;
    margin-right: 1em;
    text-align: right;
}

#background video {
    width: 100%;
    height: auto;
    display: block;
}

#background .zoom-video {
    height: 40vw;
    overflow: hidden;
    position: relative;
}

#background #bg_left .zoom-video {
    margin-right: 30%;
}

#background #bg_right .zoom-video {
    margin-left: 30%;
}

#background .zoom-video video {
    width: 100vw;
    position: absolute;
	transform: translateX(-30vw);
}

#background.bg_all,
#background.child {
    opacity: 0;
}

.single-performances #background.child,
.single-productions #background.child,
.single-festivals #background.child,
.single-events #background.child,
.page-template-template-archives #background.child,
.page-template-template-agenda #background.child,
.home #background.child,
#background.bg_all.open {
    opacity: 1;
}

/* ALL */

html,
body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
}

#background {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
    z-index: 0;
}

header,
section,
footer {
    width: calc(82% - 200px);
    max-width: calc(1250px - 200px);
    margin: 0 auto 0 auto;
    padding: 0 100px 0 100px;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

header {
    margin-top: 30px;
}

footer {
    margin-top: 14%;
    margin-bottom: 30px;
}

.box {
    width: calc(100% / 3 - 16px);
    margin-right: 24px;
    float: left;
    position: relative;
}

.box.mini {
    width: calc((100% - (100% / 3 - 16px + 24px)) / 4 - 18px);
    margin-right: 24px;
}

#sub-menu > div:nth-child(6n+15),
#sub-menu > div:nth-child(5),
#sub-menu > div:nth-child(9),
footer > div:nth-child(3n+3),
#main-menu > div:nth-child(3n+3),
article > div:nth-child(3n+3) {
    margin-right: 0;
}

.single-performances article,
.page article,
.productions article,
.festivals article {
    display: none;
}

.single-performances article.open,
.page article.open,
.festivals article.open,
.productions article.open {
    display: block;
}

.single-performances #background.festivalbg {
   opacity: 0;
}

.button {
    cursor: pointer;
}

.button .rubrique.underline,
.button:hover .rubrique {
    text-decoration: underline;
}

.distribution h2,
.equipe h2 {
    margin: 0;
}

#sub-menu > div:nth-child(10) {
    clear: both;
}

#sub-menu > div.creations:nth-child(10) {
    clear: none !important;
}

#table-agenda,
#table-agenda tbody {
    display: block;
    width: 100%;
}

#table-agenda tr {
    display: block;
    float: left;
    height: auto;
}

#table-agenda tr:nth-child(1) {
    margin-left: calc(100% / 3 - 16px + 24px);
}

#table-agenda tr:nth-child(3n+2) {
    margin-right: 0;
}

#table-agenda td {
    width: 100%;
    display: block;
}

#table-agenda-a-venir td.date,
#table-agenda-a-venir thead,
#table-agenda-toutes-1 td.date,
#table-agenda-toutes-1 thead,
#table-agenda-toutes-2 td.date,
#table-agenda-toutes-2 thead,
#table-agenda td.date,
#table-agenda thead {
    display: none;
}

.box-agenda {
    height: 0;
}

#table-agenda h3 {
    position: absolute;
    top: 10%;
	width: 100%;
	text-align: center;
	cursor: default;
}

#table-agenda h1 {
    margin-bottom: 0.1em;
    margin-right: 1em;
}

.festivals header #table-agenda a:hover div,
header #table-agenda a:hover div {
	text-decoration: none !important;
}

.festivals #table-agenda a:hover h1,
header #table-agenda a:hover h1 {
	text-decoration: underline;
}

#table-agenda-toutes-1 td.contenu,
#table-agenda-toutes-2 td.contenu {
    width: calc(100% - 24px);
    padding-right: 24px;
}

#table-agenda.festivals img {
    width: calc(100% - 30px);
    margin: 20px 15px 10px 15px;
    display: block;
}

#table-agenda.festivals .dot,
.dot {
    width: 12.6%;
    border-radius: 50%;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); 
    margin: 0;
}

/*
	.festivals #table-agenda tr {
	height: 0;
	opacity: 0;
}
*/

.festivals #table-agenda tr:nth-child(1) {
    margin-left: 0;
    clear: both;
}

.festivals #table-agenda tr:nth-child(1),
.festivals #table-agenda tr:nth-child(2),
.festivals #table-agenda tr:nth-child(3) {
    margin-top: 50px;
}

.festivals #table-agenda tr:nth-child(3n+3) {
    margin-right: 0;
}

.box .switcher-list {
    list-style: none;
    margin-bottom: 0;
    padding-left: 0;
}

.box .switcher-list li {
    padding-bottom: 0;
    display: block;
	float: left;
	margin-left: 0.45em;
}

 .box .switcher-list li:first-child {
	margin-left: 0;
}
 
.box .switcher-list li::after {
	content: " /";
	text-indent: 0;
	display: inline;
}

.box .switcher-list li:nth-child(3)::after {
	content: "";
}

.box .switcher-list li::before {
	content: " ";
	text-indent: 0;
	display: inline;
}

.box .switcher-list a {
    text-decoration: none;
}

.box .switcher-list .active span span,
.box .switcher-list a span:hover {
    text-decoration: underline;
}

a:active,
a {
	outline-style: none !important;
}

* {
outline: 0;
}

.partners img {
    height: 55px;
    margin-right: 18px;
}

#table-agenda-toutes-1 td.contenu.mobile {
    display: none;
}

/* Mars 2021 */

.single-performances #logo-part,
.single-festivals #logo-part {
    display: none;
}

.single-performances #logo-part.perf {
    display: block;
}

/* Avril 2021 */

.clearboth {
    clear: both;
}

.single-performances #logo-part.perf {
    display: block;
    margin-top: 2.4em;
}

.single-performances .partners img {
    height: 40px;
    margin-right: 25px;
}

header nav img {
    margin-top: 45px;
}


/* Mai 2021 */

.embed-container { 
    position: relative; 
    padding-bottom: 56.25%;
    overflow: hidden;
    max-width: 100%;
    height: auto;
    margin-bottom: 1em;
    } 

.embed-container iframe,
.embed-container object,
.embed-container embed { 
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.box.double {
    width: calc(100% / 3 * 2 - 8px);
    margin-right: 0;
    float: left;
    position: relative;
}

.double table td {
    padding-bottom: 0.5em;
}

/* Juin 2021 */

#menu-days {
    text-align: center;
    clear: both;
    width: 100%;
    margin-bottom: 50px;
}

#menu-days td.date, 
#menu-days thead {
    display: none;
}

#menu-days .box {
    width: 18%;
    margin-left: 1%;
    margin-right: 1%;
    float: none;
    position: relative;
    display: inline-block;
}

#menu-days .box td.contenu {
	width: 600px;
	cursor: pointer;
}

#menu-days h3 {
    font-size: 16px;
    line-height: 1.2em;
}

#menu-days .dot {
    width: 23%;
}

.single-festivals #productions_1 .box {
    padding-bottom: 48px;
}

.festivals #table-agenda tr:nth-child(1),
.festivals #table-agenda tr:nth-child(2),
.festivals #table-agenda tr:nth-child(3) {
    margin-top: 0;
}

.festivals .artiste-name {
    text-decoration: underline;
}

.festivals #table-agenda h1 {
    margin-bottom: 0;
    margin-top: 0.1em;
}

.festivals .artiste-lieu,
.festivals .artiste-name {
    margin-right: 2.5em;
    display: inline-block;
    line-height: 1.3em;
}

.single-festivals #productions_1 .big p {
    font-size: 12px;
    line-height: 1.2em;
}

.festivals .vignette {
	width: 45%;
	border-radius: 50%;
	display: block;
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%, -30%);
	margin: 0;
}

.festivals #table-agenda.festivals .vignette img {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    width: 100%;
    margin: 0;
    display: block;
    border-radius: 50%;
    filter: grayscale(1);
    opacity: 0.5;
}

.festivals #table-agenda.festivals a:hover .vignette img {
    filter: grayscale(0);
    opacity: 1;
}

.box.days {
    width: 75%;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
}

.single-festivals #productions_1 .switcher-list {
    width: 100%;
    display: inline-block;
}

header .mini img {
    margin: 40px 20px 0 20px;
}

/* Juin 2022 */

header, section, footer {
  z-index: 100 !important;
}

.slide {
  z-index: 0 !important;
}

/* Juillet 2022 */

p.upper.social {
	margin-top: 1.2em;
}

.ticket_button {
	display: inline-block;
	text-transform: uppercase;
	text-decoration: none;
	margin-top: 0.5em;
}

.ticket_button,
#mc_embed_signup input {
	padding: 7px 6px;
	background-color: #000000;
	border-color: white;
	color: white;
	border-width: 1px;
}

.ticket_button,
#mc_embed_signup input.button {
	background-color: white;
	color: #000000;
}

#mce-EMAIL {
	width: 50%;
}

#mc_embed_signup div.mce_inline_error {
	max-width: 80%;
}

#mce-responses {
	margin-top: 1em;
}

/* Decembre 2022 */

.box.archives-creations {
	width: calc(100% / 3 * 1.4 - 16px);
}

.prod_press,
.box.archives-creations div {
	margin-bottom: 0.75em;
}

