/*
Theme Name: Le Son du Bois
Description: Theme enfant for Mu festival
Author: DM
Author URI:
Template: eventsia
Version: 1-2025
*/
/*@import "webfont/inter.css";*/
:root {
--pink: #D891BF;
--yellow: #EDE78B;
--darkblue: #3654A2;
--cyan:#6DC7DD;
--lightblue: #45A6DE;
--midblue: #2B74BA;
}
a {
color: var(--pink);
}
#site-content-contain{
background-color: #fff;
}
.top-bar{
display:none;
}
.main-navigation a {
font-size: 16px;
font-weight: 600;
letter-spacing: 0.1em;
line-height: 80px ! important;
padding: 0 10px;
}
.about-box-bg{
padding-top: 60px !important;
}
.word_1 {
color: var(--yellow)
}
.word_0 {
color: var(--darkblue);
}
/*
.speaker-team-box .word_0{
color: var(--cyan);
}
.speaker-team-box .word_1{
color: var(--darkblue);
}*/
.speaker-team-bg{
background-color: var(--pink);
background-blend-mode:soft-light;
}
.design-1 .main-header {
background-color: var(--cyan);
}
.main-navigation a {
font-size: 16px;
font-weight: 600;
letter-spacing: 0.1em;
line-height: 50px;
padding: 0 10px;
}
.entry-content a {
text-decoration: none;
}
.speaker-title-box:before {
background-color: var(--yellow);
content: "";
left: 0;
right: 0;
top: 0;
bottom: 0;
opacity: 0.7;
position: absolute;
border-radius: 50%;
}
.speaker-team .speaker-name a{
color: var(--darkblue);
font-size: 25px;
font-weight: 800;
}
.speaker-team .speaker-designation {
color: black;
}
#secondary .widget {
background-color: #fff;
padding: 10px 30px 10px 30px;
}
.uc-event-bg{
background-color: var(--cyan);
}
.our-sponsors-box {
background-color: #fff
}
#colophon .footer-bg {
background-color: var(--darkblue);
}
.our-sponsors-box .box-title:after {
background-color: #000;
}
.about-title:after{
background-color:var(--pink);
}
.box-title:before {
background-color:var(--pink);
}
.site-info .copyright a {
color: #fff;
}
.site-info .copyright {
color: #fff;
}
.soundwave-container {
height: 125px;
width: auto;
display: flex;
align-items: flex-end;
margin-left: auto;
margin-right: auto;
position: absolute;
bottom: 0;
left:50%;
transform: translate(-50%, 0);
font-size: 18px;
font-weight: 500;
padding: 0px 12px;
}
.bar {
width: 50px;
height: 100%;
background: #fff;
border-radius: 2px;
margin: 0 2px;
animation: equalizer 3s steps(20, end) infinite;
/* background: linear-gradient(0deg, rgba(255,255,255,1) 50%, rgba(105,204,227,0.9) 100%);*/
}/*
.bar:nth-child(1) {
animation-duration: 1.9s;
}
.bar:nth-child(2) {
animation-duration: 2.0s;
}
.bar:nth-child(3) {
animation-duration: 1.7s;
}
.bar:nth-child(4) {
animation-duration: 2.1s;
}
.bar:nth-child(5) {
animation-duration: 1.1s;
}
.bar:nth-child(6) {
animation-duration: 2.3s;
}
.bar:nth-child(7) {
animation-duration: 0,9s;
}
.bar:nth-child(8) {
animation-duration: 2.1s;
}
.bar:nth-child(9) {
animation-duration: 0,7s;
}
.bar:nth-child(10) {
animation-duration: 1.6s;
}
*/
@keyframes equalizer {
0% {
height: 60%;
}
4% {
height: 50%;
}
8% {
height: 40%;
}
12% {
height: 30%;
}
16% {
height: 20%;
}
20% {
height: 30%;
}
24% {
height: 40%;
}
28% {
height: 10%;
}
32% {
height: 40%;
}
36% {
height: 60%;
}
40% {
height: 20%;
}
44% {
height: 40%;
}
48% {
height: 70%;
}
52% {
height: 30%;
}
56% {
height: 10%;
}
60% {
height: 30%;
}
64% {
height: 50%;
}
68% {
height: 60%;
}
72% {
height: 70%;
}
76% {
height: 80%;
}
80% {
height: 70%;
}
84% {
height: 60%;
}
88% {
height: 50%;
}
92% {
height: 60%;
}
96% {
height: 70%;
}
100% {
height: 80%;
}
}
@media only screen and (max-width: 1000px) {
.soundwave-container {
height: 60px;
}
.bar {
width: 30px;
height: 100%;
}
}
#timing{
text-align:center;
}
#timer{
display:block;
margin: auto;
}
div#timer, #hours,#minutes, #seconds, #days {
display: inline-block;
line-height: 1;
padding: 10px 10px 0px 10px ;
font-size: 40px;
}
#days span, #hours span, #minutes span, #seconds span{
display: block;
font-size: 15px;
color: var(--pink);
}
#days {
font-size: 60px;
color: #db4844;
}
#hours {
font-size: 60px;
color: #f07c22;
}
#minutes {
font-size: 60px;
color: #f6da74;
}
#seconds {
font-size: 40px;
color: #2B74BA;
}
@media only screen and (max-width: 750px) {
#days {
font-size: 50px;
font-weight: 500;
}
#hours {
font-size:50px;
font-weight: 500;
}
#minutes {
font-size: 50px;
font-weight: 500;
}
#seconds {
font-size: 20px;
font-weight: 500;
}
}
@media only screen and (max-width: 767px) {
.box-title, .about-title {
font-size: 30px !important;
}
html, body, div, span, applet, object, iframe, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
font-size: 101%;
}
}
@media only screen and (max-width: 600px) {
#days {
font-size: 40px;
font-weight: 500;
}
#hours {
font-size:40px;
font-weight: 500;
}
#minutes {
font-size: 40px;
font-weight: 500;
}
#seconds {
font-size: 20px;
font-weight: 500;
}
}
@media only screen and (max-width: 980px) {
.design-1 .menu-toggle {
float: right;
}
.design-1.header-image .menu.nav-menu {
background-color: var(--cyan)!important;
}
.design-1 .main-navigation > ul > li > a {
/* color: var(--darkblue);*/
padding:4px !important;
}
}
h2, h2 a, h4 a{
color:var(--darkblue);
}
h2.entry-title a {
font-size : 2em;
color:var(--darkblue);
display: flex;
align-items: center;
}
h1.page-title{
font-size : 2em;
color:var(--darkblue)
}
h4::first-letter{
font-weight: bolder;
color:var(--pink) !important;
font-size:150%;
}
h2.entry-title a:before {
display: inline-flex;
content: '';
background-image: url('data:image/svg+xml,');
background-size: 80px 80px;
height: 80px;
width: 80px;
margin-left: 15px;
}
.tips{
color:var(--pink);
font-size:17px;
margin-top:50px;
}
/*
.tips:before {
display: inline-flex;
justify-content: center;
align-items: center;
content: '';
background-image: url('data:image/svg+xml,');
background-size: 40px 40px;
height: 40px;
width: 40px;
}*/
aside#secondary a {
display: flex;
align-items: center;
color:#88421d;
}
aside#secondary a:before {
display: inline-flex;
justify-content: center;
align-items: center;
content: '';
background-image: url('data:image/svg+xml,');
background-size: 30px 30px;
height: 30px;
width: 30px;
}
.uc-img .new-uc-img .event-overlay .uc-img-link:before {
color: #ffffff;
background-image: url('data:image/svg+xml,');
background-repeat: no-repeat;
background-position: center;
content: '' !important ;
}
/* programme*/
.five-column,
.five-column-full-width {
width: 20%;
}
.boxed-layout-small .five-column-full-width:nth-child(4n+5) {
clear: none;
}
.five-column-full-width:nth-child(4n+5),
.boxed-layout-small .four-column-full-width:nth-child(3n+4) {
clear: both;
}
.five-column {
padding: 0 15px 30px;
display: inline-block;
text-align: left;
margin-right: -4px;
vertical-align: top;
}
@media only screen and (max-width: 1300px) {
.five-column-full-width {
width: 33.33%;
}
.five-column-full-width:nth-child(4n+5) {
clear: none;
}
.five-column-full-width:nth-child(3n+4) {
clear: both;
}
}
@media only screen and (max-width: 1023px) {
.five-column {
padding: 0 15px 40px;
}
.five-column,
.five-column-full-width,
.five-column-full-width {
width: 50%;
}
.five-column-full-width:nth-child(3n+4),
.boxed-layout-small .five-column-full-width:nth-child(3n+4),
.column-2:nth-child(2n+3),
.column-3:nth-child(3n+4),
.column-4:nth-child(4n+5) {
clear: none;
}
.five-column-full-width:nth-child(2n+3),
.boxed-layout-small .five-column-full-width:nth-child(2n+3) {
clear: both;
}
}
@media only screen and (max-width: 767px) {
.five-column-full-width,
#primary .five-column-full-width,
#primary .five-column {
margin: 0;
width: 100%;
}
.five-column {
padding: 0 10px 30px;
width: 50%;
}
.wrap, .boxed-layout #page, .boxed-layout-small #page {
max-width: 96% !important;
}
.single-wrap {
background-color: #fff;
margin-bottom: 60px;
padding: 15px;
}
}
@media only screen and (max-width: 480px) {
.five-column-full-width {
margin: 0;
width: 100%;
}
.five-column {
padding: 0 0 30px;
margin-right: 0;
width: 100%;
}
.five-column-post .post-container {
width: 100%;
}
}
.move{
transition: all 0.6s ease;
opacity:1;
@starting-style {
opacity: 0;
translate: 0 -80px;
}
}
}
::selection {
background: var(--pink);
color: #fff;
}
/*Contact Form*/
.cf7resp table {
border-width: 0px 0 0 0px !important;
}
.cf7resp td {
border-color: transparent;
}
.cf7resp td,
th {
text-align: left;
width:50%;
border-color: transparent;
}
/* Empiler tableau mobiles */
@media screen and (max-width: 950px) {
.cf7resp table,
.cf7resp tbody,
.cf7resp tr,
.cf7resp td {
display: block;
width:100%;
}
}
.show-onlymobile{
display: none !important;
}
@media only screen and (max-width: 980px) {
.show-onlymobile {
display: block;
}
}
/*Planning*/
.planning-container {
max-width: 1200px;
margin: 20px auto;
background-color: #fff;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
border-radius: 10px;
overflow: hidden;
}
.planning-table {
width: 100%;
border-collapse: collapse;
table-layout: fixed;
}
.planning-table th,
.planning-table td {
border: 1px solid #dee2e6;
padding: 12px 15px;
text-align: left;
vertical-align: top;
}
.planning-table thead th {
background-color: #3498db;
color: white;
font-weight: bold;
text-align: center;
}
.planning-table tbody tr:nth-child(even) {
background-color: #f8f9fa;
}
.planning-table tbody tr:hover {
background-color: #e9ecef;
}
.time-slot {
font-weight: bold;
color: #555;
width: 140px;
text-align: center;
background-color: #f1f3f5;
}
/* Styles pour différents types d'événements/tâches */
.event {
padding: 10px;
border-radius: 5px;
margin-bottom: 5px;
color: white;
font-size: 0.9em;
}
.event-title {
font-weight: bold;
display: block;
margin-bottom: 3px;
}
.event-details {
font-size: 0.85em;
opacity: 0.9;
}
/* Styles pour les liens dans les événements (cours et scènes ouvertes) */
.event a, /* Cible les liens à l'intérieur d'un événement (comme "Jouer") */
a.event, /* Cible l'élément qui est lui-même un événement (comme les cours) */
.event a:visited,
a.event:visited {
color: white; /* Texte blanc */
text-decoration: none; /* Supprime le soulignement par défaut */
display: block; /* Assure que le lien se comporte comme un bloc pour remplir la cellule */
}
.event a:hover,
a.event:hover {
text-decoration: none; /* Supprime également le soulignement au survol */
font-weight: normal; /* Pas en gras */
margin-top: 5px; /* Espace au-dessus du lien */
display: block; /* Sur une nouvelle ligne */
}
.event-general-ouverture {
background-color: #1abc9c;
border-left: 5px solid #16a085;
}
.event-scene-artiste {
background-color: #C71585;
border-left: 5px solid #A01169;
}
.event-general-pause {
background-color: #D891BF ;
border-left: 5px solid #9b59b6;
}
.event-general-special {
background-color: #9b59b6;
border-left: 5px solid #8e44ad;
}
.event-scene-performance {
background-color: #6DC7DD;
border-left: 5px solid #57A9C1;
}
.event-scene-luthiers {
background-color: #3498db;
border-left: 5px solid #2980b9;
}
.event-cours-blues {
background-color: #e74c3c;
border-left: 5px solid #c0392b;
}
.event-cours-fingerstyle {
background-color: #e67e22;
border-left: 5px solid #d35400;
}
.event-cours-jazzmanouche {
background-color: #16a085;
border-left: 5px solid #1abc9c;
}
.empty-slot {
background-color: #fdfdfd;
}
.day-separator td {
background-color: #7f8c8d;
color: white;
text-align: center;
font-weight: bold;
font-size: 1.1em;
}
/* Styles pour que les événements en rowspan remplissent la cellule */
td[rowspan] {
position: relative;
}
/* Style par défaut pour les événements sur plusieurs créneaux (remplissage complet) */
td[rowspan] > .event,
td[rowspan] > a.event {
box-sizing: border-box;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
height: 100%;
margin: 0;
display: flex;
flex-direction: column;
justify-content: center; /* Centre le contenu verticalement */
padding: 10px;
}
/* Style spécifique pour les scènes ouvertes sur plusieurs créneaux (marge intérieure) */
td[rowspan] > .event-scene-performance,
td[rowspan] > a.event-scene-performance {
justify-content: flex-start; /* Aligne en haut */
top: 12px;
left: 15px;
right: 15px;
bottom: 17px;
height: auto; /* La hauteur est définie par top/bottom */
}
/* Style pour les événements qui doivent remplir une cellule standard (sans rowspan) */
.planning-table td.cell-full-event { /* Sélecteur plus spécifique pour surcharger le padding de base */
padding: 0;
}
.cell-full-event > .event,
.cell-full-event > a.event {
margin: 0;
border-radius: 0;
height: 100%;
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: center;
}
.music-note {
font-size: 1.3em;
margin-right: 2px;
}
.concert-icon {
font-size: 1.1em;
margin-right: 2px;
}
.schedule-note {
text-align: center;
font-size: 0.9em;
color: #7f8c8d;
margin-top: 20px;
padding-top: 10px;
border-top: 1px solid #eee;
}
@media screen and (max-width: 768px) {
.planning-container {
overflow-x: auto;
}
.planning-table {
min-width: 600px;
}
.planning-table th,
.planning-table td {
padding: 8px 10px;
}
.event {
font-size: 0.85em;
}
}
/* nth-last-child(2) */
#primary-menu li:nth-last-child(2) {
/* background-color: #EDE78B;*/
height:33% !important;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAA1JREFUGFdjePu8+z8ACIMDXzgpav8AAAAASUVORK5CYII=) repeat-x;
background-size: 33% auto;
background-position: center;
/* border-left-lenght: 50px;
border-left: 6px dotted #69CCE3;*/
}
#primary-menu li:nth-last-child(2) a {
color:var(--darkblue);
}
#primary-menu li:nth-last-child(2)::before {
content: '';
position: absolute;
height: 33%;
width: 0;
left: 0;
top: 33.5%;
border-left:6px dotted #69CCE3;
}
.scrolled::before{
border-left-color: #666 !important;
}
.os-content-wrap .os-image {
vertical-align: middle;
}