/*
Theme Name: Divi Enfant par bubulgum.comm'
Site Name: CAP - Centre d'Animation socioculturel Palinzard
Description: Theme enfant du theme Divi, pour le site www.cap-epalinges.ch
Author: bubulgum.comm'
Author URI: http://bubulgum.com/
Template: Divi
Version: 2.0
Date: 22.04.19
Dernière mise à jour: 03.03.26
*/
#wpadminbar {display:block !important; z-index: 9999999999; top: 39.59px;}
/* ----------------------- CONTENU ----------------------- */
/***** 0) réglages généraux *****/
/*** 1) personnalisation du background-color du site ***/
/*** 2) personnalisation des textes (font, color, etc), liens, exposants, listes, etc ***/
/*** 3) personnalisation des boutons (nouvelle procédure inscription aux MERCREDIS 9-11 ANS!) + flèches galeries ***/
/*** 4) réglages des "Sections standard" et des "Lignes" ***/
/*** 5) réglages du HEADER ***/
/*** 6) réglages du FOOTER ***/
/***** 7) réglages de la page HOME *****/
/*** 7.1) réglages du plugin Easy Facebook Like Box – Custom Facebook Feed ***/
/*** 7.2) réglages du lecteur de podcasts ***/
/***** 8) réglages des AUTRES PAGES *****/
/*** 8.0) réglages fête de la musique 2020 ***/
/*** 8.1) réglages de la section "où nous trouver" (page INFOS PRATIQUES) ***/
/*** 8.2) réglages galeries images (page LES ARCHIVES) ***/
/*** 8.3) réglages vidéos intégrées (pages LES ARCHIVES + HOME) ***/
/*** 8.4) réglages des modules Bascule (page LES ARCHIVES) ***/
/*** 8.5) réglages Gazette du CAP (pages LES ARCHIVES) ***/
/*** 8.6) inversion ordre des colonnes "paires" (page LES PROJETS DU CAP) ***/
/*** 8.7) espacement des lignes "row" pour les projets passés (page LES PROJETS DU CAP) ***/
/***** 9) réglages AGENDA (plugin The Events Calendar Shortcode and Templates) *****/
/*** 9.0) contenu fichier "ect-list-view.css" (vu qu'il n'arrive pas à se charger via le plugin) ***/
/*** 9.1) réglages des listes d'events futurs (template="default" style="style-1") ***/
/*** 9.2) réglages des listes d'events archivés (template="default" style="style-3") ***/
/***** 10) Formulaires Formidable : connexion, user registration, inscription - MERCREDIS 9-11 ANS *****/
/*** 10.0) Formulaires Formidable : réglages généraux ***/
/*** 10.1) Formulaires Formidable : réglage des textes ***/
/*** 10.2) Formulaires Formidable : réglages des boutons radio + cases à cocher ***/
/*** 10.3) Formulaires Formidable : réglages bloc "Résumé" sur la dernière page ***/
/*** 10.4) Formulaires Formidable : réglages du bouton Envoyer ***/
/*** 10.5) Formulaires Formidable : réglages messages succès + erreurs ***/
/***** 11) réglages de la page PROFIL UTILISATEUR (générée avec les "views" Formidable) *****/
/*** 11.0) réglages généraux ***/
/*** 11.1) réglages des boutons : Se déconnecter + Modifier le profil + Accéder aux inscriptions ***/
/*** 11.2) réglages de la section "erreur - vous n'êtes pas connectés" ***/
/*** 11.3) réglages des modules "détails du compte / des inscriptions ***/
/***** 12) réglages des intros des pages MERCREDIS 9-11 ANS (connexion / créa compte / inscriptions / lost password) *****/
/***** 13) réglages des pages COMPTA (enregistrer un paiement + récap dû / payé / solde) *****/
/***** 14) réglages de la pages RECAP (Récap inscriptions par date + récap CARTE MEMBRE + infos générales) *****/
/***** 15) réglages du pop-up COOKIEBOT + RGPD *****/
/* ----------------------- CONTENU ----------------------- */
@font-face {
font-family: 'HelveticaNeueRoman';
src: url('webfont/HelveticaNeueRoman.eot');
src: url('webfont/HelveticaNeueRoman.eot') format('embedded-opentype'),
url('webfont/HelveticaNeueRoman.woff2') format('woff2'),
url('webfont/HelveticaNeueRoman.woff') format('woff'),
url('webfont/HelveticaNeueRoman.ttf') format('truetype'),
url('webfont/HelveticaNeueRoman.svg#HelveticaNeueRoman') format('svg');
}
/*** CSS reset ***/
* {
vertical-align: baseline;
font-weight: inherit;
font-family: inherit;
font-style: inherit;
font-size: 100%;
border: 0 none;
outline: 0;
padding: 0;
margin: 0;
}
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/***** ---------------------------------------- 0) réglages généraux ---------------------------------------- *****/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ------------------------------------------------------------ ***/
/*** 1) personnalisation du background-color du site ***/
/*** ------------------------------------------------------------ ***/
.et_pb_section {
background-color: transparent !important; /* pour annuler la valeur par défaut de Divi (qui est #fff) */
}
body {
background-color: #fdfdfd !important; /* gris très clair */
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
}
/*** ------------------------------------------------------------ ***/
/*** 2) personnalisation des textes (font, color, etc), liens, exposants, listes, etc ***/
/*** ------------------------------------------------------------ ***/
html {
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
font-size: 100%; /* équivaut à 1rem = 16px */
}
h1, h2, h3, h4, h5, h6 {
color: #3c3c3b !important; /* anthracite */
font-weight: 500 !important;
line-height: 1em !important;
padding-bottom: 10px !important;
}
h1 {font-size: 1.875rem !important;}
h2 {font-size: 1.625rem !important;}
h3 {font-size: 1.375rem !important;}
h4 {font-size: 1.1875rem !important;}
h5 {font-size: 1rem !important;}
h6 {font-size: 1rem !important;}
p {
color: #3c3c3b !important; /* anthracite */
font-size: 0.875rem !important;
font-weight: 500 !important;
line-height: 1.4em !important;
}
table {line-height: 1.4em !important;}
/** réglages tailles textes pour mobile **/
@media only screen and (max-width: 767px) { /* smartphone */
h1 {font-size: 1.875rem !important;}
h2 {font-size: 1.625rem !important;}
h3 {font-size: 1.375rem !important;}
h4 {font-size: 1.1875rem !important;}
h5 {font-size: 1rem !important;}
h6 {font-size: 1rem !important;}
p {font-size: 0.875rem !important; /* line-height: 1.125em !important; */}
h1, h2 {padding-bottom: 0px !important;}
h3, h4, h5, h6 {padding-bottom: 10px !important;}
}
@media only screen and (max-width: 767px) { /* smartphone */
.et_pb_text {
max-width: 100% !important;
}
}
/** réglages des liens **/
a {color: #ce1414;} /* rouge CAP */
a.liens-hover-souligne,
span.liens-hover-souligne {
color: #3c3c3b !important; /* anthracite */
font-weight: 700 !important;
text-decoration: none !important;
}
a.liens-hover-souligne:hover {
color: #ce1414 !important; /* rouge CAP */
text-decoration: underline !important; /* SOULIGNé */
}
a.liens-hover-gras {
color: #3c3c3b !important; /* anthracite */
font-weight: 500 !important;
text-decoration: none !important;
}
a.liens-hover-gras:hover {
color: #ce1414 !important; /* rouge CAP */
font-weight: 700 !important; /* GRAS */
}
a.inscrivez-vous {
color: #ce1414 !important; /* rouge CAP */
font-size: 1.375rem !important; /* idem h3 */
}
a:hover {
font-weight: 700 !important; /* GRAS */
}
/** réglages des exposants **/
sup, sub {
position: relative;
height: 0;
vertical-align: baseline;
}
sup { /** exposant - genre 1er, 2e, 3e, etc */
bottom: 0.5em; /** la distance entre la baseline et l'exposant */
font-size: 65%; /** la taille du texte = 65% du texte parent */
}
/** réglages étoile (font awesome) dans la page CAP Seniors (activités réservées aux locataires) **/
.fa-star {
color: #60889b; /* bleu-gris clair */
}
/** réglages des listes à puces (ul) / numéros (ol) **/
.et_pb_text .entry-content ul, .et_pb_text .entry-summary ul, .et_pb_text .comment-content ul, /* listes à puces */
.et_pb_text .entry-content ol, .et_pb_text .entry-summary ol, .et_pb_text .comment-content ol { /* listes à numéros */
font-family: inherit !important;
color: #3c3c3b !important; /* anthracite */
font-size: 0.875rem !important;
font-weight: 500 !important;
line-height: 1.4em !important;
}
.et_pb_text .entry-content ul, .et_pb_text .entry-summary ul, .et_pb_text .comment-content ul, .entry-content ul {list-style-position: outside !important; padding-left: 1em !important; line-height: 1.4em !important;}
.entry-content p+ul {padding-top: 0.375em !important;}
.et_pb_text .entry-content ol, .et_pb_text .entry-summary ol, .et_pb_text .comment-content ol, .entry-content ol {list-style-position: inside !important; padding-left: 1em !important; line-height: 1.4em !important; padding-top: 0.375em !important;}
.et_pb_text .entry-content li, /* li = réglages lignes des listes (à puces + à numéros) */
.et_pb_text .entry-summary li,
.et_pb_text .comment-content li,
.entry-content li {
padding-bottom: 0.25em !important;
}
#tribe-events-pg-template .tribe-events-content ul, .tribe-events-after-html ul, .tribe-events-before-html ul {padding-left: 1em !important;}
/*** ------------------------------------------------------------ ***/
/*** 3) personnalisation des boutons (nouvelle procédure inscription aux MERCREDIS 9-11 ANS!) + flèches galeries ***/
/*** ------------------------------------------------------------ ***/
/*** réglage de la couleur de fond du "Bouton retour en haut de page" ***/
.et_pb_scroll_top.et-pb-icon {
background: rgba(206,20,20,0.65); /* rouge CAP à 65% d'opacité */
}
/*** réglage de la couleur des flèches (module Galerie) pour passer d'une image à l'autre ***/
.et-pb-arrow-prev::before,
.et-pb-arrow-next::before {
color: #fdfdfd !important; /* gris très clair */
}
/*** réglages des boutons - page CAP ENFANTS - nouvelle procédure inscription aux MERCREDIS 9-11 ANS ***/
.et_pb_button {
color: #ce1414 !important; /* rouge CAP */
font-size: 1rem !important;
line-height: 1.4em !important;
padding: 0.3em 0.6em;
}
@media only screen and (max-width: 980px) { /* tablette et smartphone */
.et_pb_button {
font-size: 0.875rem !important;
}
}
.et_pb_bg_layout_light.et_pb_button:hover, .et_pb_bg_layout_light .et_pb_button:hover, .et_pb_contact_reset:hover, .et_pb_contact_submit:hover, .et_pb_pricing_table_button:hover {
color: #fdfdfd !important; /* gris très clair */
background-color: #ce1414 !important; /* rouge CAP */
font-weight: 500 !important; /* pour annuler l'effet habituel qu'il y a sur les liens en hover (font-weight à 700) */
}
/* supprimer le picto à droite du texte du bouton */
.et_pb_button::after {
display: none !important;
}
/* et du coup supprimer le padding-right (qui laissait la place pour le picto) */
.et_pb_button:hover, .et_pb_module .et_pb_button:hover {
border: 2px solid transparent;
padding: 0.3em 0.6em; /* mêmes réglages que en "pas hover" */
}
/** largeurs boutons + margin et padding des sections, colonnes, row, modules et textes **/
@media only screen and (min-width: 768px) { /* bureau et tablette */
.et_pb_button_module_wrapper > a {
width: 120px !important;
display: inline-block !important;
}
.et_pb_gutters3 .et_pb_column_1_2 > .et_pb_row_inner > .et_pb_column_1_4.et-last-child {
width: 24.5% !important; /* correspond à la largeur du bouton */
margin-right: 0 !important;
}
.et_pb_gutters3 .et_pb_column_1_2 > .et_pb_row_inner > .et_pb_column_1_4 {
width: 70% !important; /* 100% -5.5% marge -24.5% bouton = 70% */
margin-right: 5.5% !important;
}
#mercredis-9-11-ans.et_pb_section {
padding: 80px 0 0 0 !important;
}
#mercredis-9-11-ans-textes.et_pb_section,
#mercredis-9-11-ans-dates.et_pb_section,
#mercredis-9-11-ans-textes.et_pb_section .et_pb_column,
#mercredis-9-11-ans-textes.et_pb_section .et_pb_column_1_2 .et_pb_row_inner {
padding: 0 !important;
}
#mercredis-9-11-ans-textes.et_pb_section .et_pb_column_1_2 .et_pb_row_inner p {
padding-bottom: 1em !important;
}
#mercredis-9-11-ans-textes.et_pb_section .et_pb_column_1_2 .et_pb_row_inner:last-child p:last-child {
padding-bottom: 0 !important;
}
}
@media only screen and (max-width: 767px) { /* smartphone */
.et_pb_button_module_wrapper > a {
width: 70% !important;
}
#mercredis-9-11-ans.et_pb_section {
padding: 80px 0 0 0 !important;
}
#mercredis-9-11-ans-textes.et_pb_section,
#mercredis-9-11-ans-dates.et_pb_section,
#mercredis-9-11-ans-textes.et_pb_section .et_pb_column,
#mercredis-9-11-ans-textes.et_pb_section .et_pb_column_1_2 .et_pb_row_inner {
padding: 0 !important;
}
#mercredis-9-11-ans-textes.et_pb_section .et_pb_column_1_2 .et_pb_row_inner .et_pb_column_inner {
margin: 0 !important;
}
#mercredis-9-11-ans-textes.et_pb_section .et_pb_column_1_2 .et_pb_row_inner p {
padding-bottom: 1em !important;
}
#mercredis-9-11-ans-textes.et_pb_section .et_pb_column_1_2 .et_pb_row_inner .et_pb_button_module_wrapper {
padding-bottom: 2em !important; /* pour ajouter un peu d'espace entre le bouton et le "bloc" suivant */
}
#mercredis-9-11-ans-textes.et_pb_section .et_pb_column_1_2 .et_pb_row_inner:last-child p:last-child {
padding-bottom: 0 !important;
}
}
/*** réglages du bouton Inscrivez-vous (page Connexion) ***/
#module-inscrivez-vous .et_pb_button {
font-size: 1.375rem !important;
}
#module-inscrivez-vous .et_pb_button_module_wrapper > a {
width: auto !important;
}
#module-inscrivez-vous h3 {
margin: 1.25rem 0 1.25rem 5rem !important;
line-height: 1.4em !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
#module-inscrivez-vous h3 {margin-left: 3rem !important;}
}
/*** ------------------------------------------------------------ ***/
/*** 4) réglages des "Sections standard" et des "Lignes" ***/
/*** ------------------------------------------------------------ ***/
/* j'ai choisi ces réglages (padding-top à 80px et padding-bottom à 0px, au lieu de répartir en haut et en bas), afin que les "ancre" fasse arriver l'internaute au bon endroit (sinon ça arrive au milieu du titre de la Section è_é) */
.et_pb_section {
padding: 80px 0 0 0 !important;
}
@media only screen and (max-width: 980px) { /* tablette et smartphone */
.et_pb_section:first-child {
padding: 20px 0 0 0 !important;
}
}
.et_pb_row {
padding: 10px 0 !important;
}
/** dernière section de la page: 96px (6rem) de margin-bottom, c'est plus harmonieux :) **/
.et_pb_section:last-child {
margin-bottom: 6rem !important;
}
/* les lignes (row) des titres de page (CAP Enfant, etc) sont réglées à max 270px de large... et on touche à rien d'autre (width, margin, etc), comme ça les proportions restent toujours harmonieuses, et le responsive se passe bien ;-) */
#ligne-pages-CAP-enfant-etc {
max-width: 270px !important;
border: 4px solid #ce1414 !important; /* rouge CAP */
padding: 30px 0 20px 0 !important;
}
#ligne-pages-CAP-enfant-etc h1 {
text-align: center !important; /* comme ça pas besoin de centrer le texte manuellement dans le module */
}
#ligne-page-infos-pratiques,
#ligne-page-cap-pour-tous,
#ligne-page-TSP {
max-width: 330px !important;
border: 4px solid #ce1414 !important; /* rouge CAP */
padding: 30px 0 20px 0 !important;
}
#ligne-page-infos-pratiques h1,
#ligne-page-cap-pour-tous h1,
#ligne-page-TSP h1 {
text-align: center !important; /* comme ça pas besoin de centrer le texte manuellement dans le module */
}
@media only screen and (max-width: 767px) { /* smartphone */
#ligne-page-infos-pratiques h1,
#ligne-page-cap-pour-tous h1,
#ligne-page-TSP h1 {
line-height: 1.25em !important;
}
}
/* pour obliger le titre CAP POUR TOUS à se mettre sur 2 lignes sur smartphone */
@media only screen and (max-width: 767px) { /* smartphone */
#ligne-page-cap-pour-tous {
padding-left: 30px !important;
padding-right: 30px !important; }
}
#ligne-page-projets {
max-width: 370px !important;
border: 4px solid #ce1414 !important; /* rouge CAP */
padding: 30px 0 20px 0 !important;
}
#ligne-page-projets h1 {
text-align: center !important; /* comme ça pas besoin de centrer le texte manuellement dans le module */
}
@media only screen and (max-width: 767px) { /* smartphone */
#ligne-page-projets h1 {
line-height: 1.25em !important;
}
}
/*** ------------------------------------------------------------ ***/
/*** 5) réglages du HEADER ***/
/*** ------------------------------------------------------------ ***/
/** ça gérait la ligne gris claire en dessous du header - enlevée par rapport au thème original (voir ligne 1241 fichier style.dev_divi_parent.css) **/
#main-header {
box-shadow: 0 0px 0 rgba(0, 0, 0, 0);
background-color: #fdfdfd !important; /* gris très clair = même couleur que le fond du site */
}
body.admin-bar.et_fixed_nav #main-header {
top: 39.59px !important;
}
/** background-color du header quand on scroll (et qu'il devient plus petit) **/
.et-fixed-header#main-header, .et-fixed-header#main-header .nav li ul, .et-fixed-header .et-search-form {
background-color: #fdfdfd !important; /* gris très clair = même couleur que le fond du site */
}
@media only screen and (min-width: 981px) { /* bureau */
/** réglages du container du header **/
.container.et_menu_container {
width: 100% !important;
margin-top: 10px !important;
margin-bottom: 10px !important;
}
#top-menu, .fullwidth-menu, nav#top-menu-nav, nav.fullwidth-menu-nav, #et-top-navigation {
float: left !important;
width: 100% !important;
}
/** alignement du logo sur le bas du header **/
#logo {
vertical-align: bottom;
}
}
/** réglages du contenant (li) du menu **/
#top-menu li {
display: inline-block !important;
width: auto !important;
margin-right: 10px !important;
padding: 10px 12px !important;
/* padding: 10px 14px !important; */ /* réglage avant CAP CASA */
background-color: #ce1414 !important;
}
/** réglages du texte (liens) du menu **/
#top-menu li a {
font-size: 1rem !important;
line-height: 1.25em !important;
text-align: center;
}
/** réglages du contenant (li) du menu - bloc "agenda" **/
#top-menu li.menu-nav-agenda {
display: inline-block !important;
margin-right: 0 !important;
float: right !important;
}
/** réglages du texte (liens) du menu - bloc "agenda" **/
#top-menu li.menu-nav-agenda a {
font-size: 1.125rem !important;
line-height: 1.25em !important;
text-align: center;
font-weight: 700 !important;
}
/** réglages du contenant (li) du menu - bloc "nom du site" **/
#top-menu li.nom-site-sous-menu {
display: block !important;
margin-right: 0 !important;
padding: 0 !important;
background-color: transparent !important;
width: 50% !important;
position: absolute;
bottom: 0 !important;
}
/** réglages du texte (liens) du menu - bloc "nom du site" **/
#top-menu li.nom-site-sous-menu a {
font-size: 1.125rem !important;
line-height: 1.25em !important;
text-align: left !important;
color: #3c3c3b !important; /* anthracite */
font-weight: 700 !important;
}
/** couleur du texte du menu 1er niveau - affichage ordi **/
#top-menu a {
color: #fdfdfd !important; /* gris très clair */
-webkit-transition: none !important; /* pour annuler les valeurs par défaut de DIVI */
-moz-transition: none !important;
transition: none !important;
}
/** couleur du texte du menu 1er niveau - affichage menu burger **/
.et_mobile_menu li a {
color: #3c3c3b !important; /* anthracite */
-webkit-transition: none !important; /* pour annuler les valeurs par défaut de DIVI */
-moz-transition: none !important;
transition: none !important;
}
#et-top-navigation nav > ul > li > a {
padding: 0 !important; /* pour annuler la valeur par défaut de DIVI */
}
#et-top-navigation nav > ul > li.menu-nav-agenda a {
padding: 30px 5px !important; /* là on met ces padding pour "agrandir" le bloc "agenda" */
}
#top-menu-nav > ul > li > a:hover{
opacity: 1 !important; /* pour annuler la valeur par défaut de DIVI = 0.7 */
}
#top-menu .menu-item-has-children > a:first-child::after {
content: none; /* pour annuler la valeur par défaut de DIVI = "3" (et du coup ça enlève le petit triangle) */
}
/** réglages du sous-menu déroulant – bloc liste "ul" **/
.nav li ul {
visibility: hidden;
z-index: 9999;
width: 100% !important;
width: 300px !important; /* largeur du bloc liste "ul" */
border-top: 3px solid #ce1414 !important; /* rouge CAP */
opacity: 0;
background: #fff; /* blanc */
background-color: rgb(255, 255, 255);
-webkit-box-shadow: 0 2px 5px rgba(0,0,0,.1);
-moz-box-shadow: 0 2px 5px rgba(0,0,0,.1);
box-shadow: 0 2px 5px rgba(0,0,0,.1);
position: absolute;
padding: 20px 0;
top: 65px;
left: 0;
}
/** réglages du sous-menu déroulant – lignes liste "li" **/
#top-menu li ul li {
width: 100% !important;
display: block !important;
padding: 0 !important;
background-color: transparent !important;
}
/** réglages du sous-menu déroulant – liens à l'intérieur de la ligne "li" **/
#top-menu li ul li a {
width: auto !important; /* pour que tout le texte reste sur 1 ligne */
padding: 6px 10px !important;
color: #3c3c3b !important; /* anthracite */
line-height: 1.175em !important;
text-align: left !important;
}
#top-menu li ul li a:hover {
color: #ce1414 !important; /* rouge CAP */
}
/** réglages du menu – pour mobile (menu burger) **/
/** couleur des 3 lignes "menu burger" **/
.mobile_menu_bar::before {
color: #ce1414 !important; /* rouge CAP */
}
/** couleur de la barre en dessous du menu burger "ouvert" **/
ul#mobile_menu.et_mobile_menu {
border-top: 3px solid #ce1414; /* rouge CAP */
}
/* masquer les sous-menus */
#main-header .et_mobile_menu li ul {
display: none !important;
}
/* pour annuler les valeurs par défaut de DIVI */
.et_mobile_menu .menu-item-has-children > a {
background-color: transparent !important;
}
/* annuler le
des titres de menu 1er niveau */
.et_mobile_menu br {
display: none !important;
}
/* remettre le
des titres de menu 2e niveau sur mobile */
#mobile_menu1.et_mobile_menu br {
display: initial !important;
}
/* masquer la ligne "nom du site" */
#main-header .et_mobile_menu li.nom-site-sous-menu {
display: none !important;
}
/* ligne "agenda" : fond rouge + texte gris très clair */
#main-header .et_mobile_menu li.menu-nav-agenda {
background-color: #ce1414 !important; /* rouge CAP */
}
#main-header .et_mobile_menu li.menu-nav-agenda a {
color: #fdfdfd !important; /* gris très clair */
}
.et_mobile_menu li a:hover, .nav ul li a:hover { /* pour annuler les valeurs par défaut de DIVI */
opacity: 1;
background-color: rgba(0,0,0,0);
}
/** réglage des sous-menu (burger) interne aux pages, vu que j'ai désactivé les sous-menu dans le menu principal (sinon ça prenait 3 hauteures d'écran!) **/
#sous-menu-interne-mobile.et_pb_section.et_pb_fullwidth_section.et_section_regular {
padding-top: 0px !important; /* pour annuler la valeur padding-top: 80px de la ligne 231 */
}
#sous-menu-interne-mobile .et_pb_fullwidth_menu .et_mobile_nav_menu {
float: right !important;
}
/** couleur de la barre en dessous du menu burger "ouvert" **/
#sous-menu-interne-mobile .et_mobile_menu {
border-top: 3px solid #ce1414 !important; /* rouge CAP */
padding: 0 !important;
position: absolute;
top: 35px;
left: -35px;
}
/** réglage du logo sur smartphone **/
@media only screen and (max-width: 980px) { /* tablette et smartphone */
#logo {
max-height: 90% !important;
vertical-align: bottom !important;
}
.et_header_style_left #logo, .et_header_style_split #logo {
max-width: initial !important;
}
}
/** réglage du top-header "Un site proposé par la Commune d'Epalinges" **/
#top-header,
#top-header.et-fixed-header {
background-color: #f4f4f4 !important; /* gris très clair +5%noir */
height: auto !important;
box-shadow: 0 0px 0 rgba(0, 0, 0, 0);
font-size: 12.5px; /* pour "annuler" la valeur par défaut de DIVI = 12px... je vois pas le rapport, mais ça créait une ligne de env. 1px entre le top-header et le main-header, et dans cette ligne on voyait l'arrière-plan = contenu du site */
position: fixed !important;
top: 0;
width: 100vw !important;
z-index: 999999999 !important;
}
#top-header .container {
padding-top: 0px; /* pour annuler la valeur par défaut de DIVI = .75em */
}
.bandeau-epalinges {
margin: 0px auto 10px;
text-align: center !important;
}
.bandeau-epalinges-texte,
.bandeau-epalinges-texte a {
color: #3c3c3b !important;
font-size: 0.875rem !important;
font-weight: 500 !important;
line-height: 1.4em !important;
}
.bandeau-epalinges-logo {
height: 25px !important;
width: auto;
margin: 0 2.5px !important;
position: relative;
top: 7.5px;
}
@media only screen and (max-width: 767px) { /* smartphone */
.bandeau-epalinges-texte,
.bandeau-epalinges-texte a {
color: #3c3c3b !important;
font-size: 0.7rem !important;
font-weight: 500 !important;
line-height: 1.4em !important;
}
.bandeau-epalinges-logo {
height: 20px !important;
width: auto;
margin: 0 1.5px !important;
position: relative;
top: 5px;
}
}
@media only screen and (max-width: 980px) { /* tablette et smartphone */
span.tsp-menu-ordi {
display: none !important;
}
}
@media only screen and (min-width: 981px) { /* bureau */
span.tsp-menu-mobile {
display: none !important;
}
}
/*** ------------------------------------------------------------ ***/
/*** 6) réglages du FOOTER ***/
/*** ------------------------------------------------------------ ***/
/** affichage bureau: padding-top = 2% // affichage tablette et smartphone: padding-top = 6% (valeur d'origine) **/
@media only screen and (min-width: 981px) { /* bureau */
#footer-widgets {
padding: 2% 0 0;
}
}
#main-footer {background-color: #ce1414;} /* rouge CAP */
/** réglages des dimensions des widget **/
.et_pb_gutters3.et_pb_footer_columns4 .footer-widget {
width: auto !important;
}
.et_pb_gutters3 .footer-widget {
margin-right: 4.5% !important;
margin-bottom: 2% !important;
}
/** réglages du 4e widget (recherche) **/
.et_pb_gutters3 .footer-widget:last-child {
margin-right: 0 !important;
margin-bottom: 2% !important;
float: right !important;
width: 200px !important;
}
#search-4.fwidget.et_pb_widget.widget_search {
width: 200px !important;
}
#custom_html-5.widget_text.fwidget.et_pb_widget.widget_custom_html {
width: 200px !important;
}
.widget_search input#searchsubmit {
display: none !important; /* masquer la zone du bouton où c'était écrit "Rechercher" */
}
#search-4.fwidget.et_pb_widget.widget_search h4.title {
color: #fdfdfd !important; /* gris très clair */
font-size: 0.875rem !important;
font-weight: 500 !important;
line-height: 1.25em !important;
padding-bottom: 0.5em !important;
}
@media only screen and (max-width: 1340px) { /* réglages pour faire passer le widget Recherche en dessous */
.et_pb_gutters3 .footer-widget:last-child {
display: block !important;
float: left !important;
margin-top: 20px !important;
width: 100% !important;
}
}
@media only screen and (max-width: 980px) { /* tablette et smartphone */
#search-4.fwidget.et_pb_widget.widget_search {
width: 100% !important;
}
}
/** réglages des colonnes dans le 3e widget (navigation facile) **/
#custom_html-4 col1 {
width: auto;
float: left;
margin-right: 20px;
}
#custom_html-4 col2 {
width: auto;
float: left;
margin-right: 0px;
}
/** réglages de la ligne en dessous des "titres" des widget **/
hr.ligne-footer {
color: #fdfdfd !important; /* gris très clair */
width: 100% !important;
margin: 0 0 0.5em 0 !important;
padding: 0 !important;
}
/** réglages des textes et des liens **/
.footer-widget p {
color: #fdfdfd !important; /* gris très clair */
font-size: 0.875rem !important;
font-weight: 500 !important;
line-height: 1.25em !important;
padding-bottom: 0.5em !important;
}
.footer-widget #custom_html-3 p.moins-de-padding {
padding-bottom: 0.25em !important;
}
a.link-footer {
text-decoration: none !important;
color: #fdfdfd !important; /* gris très clair */
font-size: 0.875rem !important;
font-weight: 500 !important;
margin-top: 0rem;
margin-bottom: 0rem;
}
a.link-footer:hover {
text-decoration: underline !important;
font-weight: 700 !important;
}
a.link-footer-souligne {
text-decoration: underline !important;
color: #fdfdfd !important; /* gris très clair */
}
a.link-footer-souligne:hover {
font-weight: 700 !important;
}
/** réglages du texte "plus..." dans le 2e widget (documents utiles) // remarque: les réglages se font sur le "p" (et pas sur le "a") **/
.link-footer-right {
text-align: right !important;
padding-top: 0.25em !important;
}
/** réglages flèche (font awesome) dans le 3e widget (navigation facile) **/
.fa-facebook-square,
.fa-youtube-square {
font-size: 1.25rem !important;
margin-right: 0.5rem !important;
line-height: 0.5em !important;
}
@media only screen and (max-width: 980px) { /* tablette et smartphone */
.et_pb_widget { /* largeur du bloc widget à 100%, ainsi la ligne hr prend bien la valeur width: 100% */
width: 100% !important;
}
a.link-footer { /* on le re-spécifie, sinon ça a tendance à mettre les liens en rouge */
text-decoration: none !important;
color: #fdfdfd !important; /* gris très clair */
}
}
/** réglages de la barre inférieure et de son contenu **/
/* background-color = transparent (pour que ça soit la même couleur que le footer) */
#footer-bottom {
background-color: rgba(0,0,0,0) !important;
}
/* les crédits qui sont dans le footer-bottom */
#footer-info {
float: left !important;
padding-bottom: 1% !important;
color: #fdfdfd !important; /* gris très clair */
text-align: left !important;
}
/* pour annuler les valeurs par défaut de DIVI */
#footer-bottom a {
-webkit-transition: none !important;
-moz-transition: none !important;
transition: none !important;
}
/* réglages du texte contenu dans le footer-info */
span.texte-footer-bottom {
color: #fdfdfd !important; /* gris très clair */
font-size: 0.875rem !important;
font-weight: 500 !important;
line-height: 1.25em !important;
}
/* pour annuler la valeur par défaut de DIVI (opacity: 0.7) */
#footer-info a:hover {
opacity: 1;
}
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/***** ------------------------------------ 7) réglages de la page HOME ------------------------------------ *****/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
#grille-images-home-ligne {
margin: 0 auto !important;
padding: 0 !important;
width: 100% !important;
}
#grille-images-home-colonne {
width: 33.333% !important;
margin-right: 0 !important;
}
#grille-images-home-image {
margin: 0 !important;
padding: 0 !important;
}
@media only screen and (max-width: 980px) { /* tablette et smartphone */
#grille-images-home-ligne {
margin: 0 auto !important;
padding: 0 !important;
width: 100% !important;
}
#grille-images-home-colonne {
width: 50% !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
}
#grille-images-home-image {
margin: 0 !important;
padding: 0 !important;
}
}
/* réglage de l'interlignage */
#home_le-cap-en-details p {
padding-bottom: 0.625em;
}
#image-mini-calendrier-home {
margin-bottom: 4% !important;
margin-top: 7px !important;
max-width: 225px !important;
}
#image-mini-calendrier-home-mobile {
max-width: 250px !important;
margin: 7px 0 4% 0 !important;
}
@media only screen and (max-width: 980px) { /* tablette et smartphone */
#nouveaute-2020.et_pb_module {
margin-top: 40px !important;
}
}
/*** ------------------------------------------------------------ ***/
/*** 7.1) réglages du plugin Easy Facebook Like Box – Custom Facebook Feed ***/
/*** ------------------------------------------------------------ ***/
/** pour enlever les flex etc **/
.efbl-row {
display: block !important;
margin-right: 0;
margin-left: 0;
}
/** réglages de 1 bloc news **/
.efbl-halfwidth-skin {
float: left;
display: block;
padding-bottom: 20px;
border-bottom: 1px solid gray !important;
margin-left: 0px !important;
margin-bottom: 3rem !important;
height: 570px; /** on met une hauteur fixe aux posts... pour un alignement +joli **/
}
@media only screen and (min-width: 981px) { /* bureau */
.efbl-halfwidth-skin {
width: 21.25% !important; /* 4 colonnes */
margin-right: 5% !important;
}
.efbl-halfwidth-skin:nth-of-type(4),
.efbl-halfwidth-skin:nth-of-type(8) {
margin-right: 0px !important; /* annuler la margin-right:5% du dernier bloc de chaque ligne */
}
#row-news-facebook.et_pb_row {
padding-top: 1.5rem !important;
}
}
@media only screen and (max-width: 980px) { /* tablette */
.efbl-halfwidth-skin {
width: 47.5% !important; /* 2 colonnes */
margin-right: 5% !important;
}
.efbl-halfwidth-skin:nth-of-type(even) {
margin-right: 0px !important; /* annuler la margin-right:5% du dernier bloc de chaque ligne */
}
}
@media only screen and (max-width: 767px) { /* smartphone */
.efbl-halfwidth-skin {
width: 100% !important; /* 1 colonne */
margin-right: 0 !important;
min-height: 250px !important; /** pour "supprimer" la hauteur minimum **/
}
}
/** réglages du bloc contenant l'image de la news + bloc sous l'image (contenant l'auteur + date + texte du post) **/
.efbl-col-sm-6,
.efbl-col-sm-12 {
max-width: 100% !important;
width: 100% !important;
padding-left: 0px !important;
padding-right: 0px !important;
margin-bottom: 20px;
border-right: none !important;
}
/** réglages de l'image de la news // width: 100% + height: 230px + object-fit: cover = l'image fait toujours la même dimension, du coup la div en dessous est bien alignée **/
.efbl-thumbnail-col.efbl-col-sm-6 a img, .efbl-thumbnail-col.efbl-col-sm-6 a video,
.efbl-thumbnail-col.efbl-col-sm-12 a img, .efbl-thumbnail-col.efbl-col-sm-12 a video {
margin-bottom: 0px;
margin-top: 0px;
width: 100% !important;
height: 230px !important;
object-fit: cover !important;
box-shadow: 0 2px 5px rgba(0,0,0,.1) !important;
}
/** réglages du mini logo (photo profil de la page FB) **/
.efbl-profile-image {
width: 32px !important;
min-width: 32px !important;
max-width: 32px !important;
overflow: hidden;
box-shadow: none !important; /* virer le contour */
height: 32px !important;
border-radius: 50%;
margin-right: 4px !important;
}
.efbl-profile-image a img {
background: transparent !important; /* virer le contour */
}
/** réglages du texte du "nom de la page FB" **/
.efbl-profile-title h2 {
font-size: 0.85rem !important;
padding-bottom: 0 !important;
padding-top: 0.25em !important;
}
/** réglages de la ligne qui dit quand a été posté la news sur FB **/
.efbl-profile-title span {
font-size: 0.75rem !important;
font-style: normal !important;
color: gray !important;
padding: 0 !important;
}
/** réglages du bloc contenant le texte de la publication FB **/
p.description,
.efbl-halfwidth-skin .efbl-feed-content .description > *,
.efbl-halfwidth-skin .efbl-feed-content .efbl_link_text > * {
font-size: 0.875rem !important;
line-height: 1.25em !important;
}
/** pour masquer la boite meta ( Read full story / Share / etc) **/
.efbl-post-footer {
display: none !important;
}
/** pour mettre les textes des shared story en pleine largeur + virer le border etc **/
.efbl_feed_wraper .shared_story .efbl_link_text {
border: none !important;
background: transparent !important;
padding: 0px !important;
margin-top: 1rem !important;
}
/** + virer le text "partagé" de la news FB (garder que le lien) **/
.shared_story .efbl_link_text p.efbl_link_description {
display: none !important;
}
/** + couleur lien en antracite 75% **/
.shared_story .efbl_link_text p.efbl_title_link a {
color: rgba(60,60,59,0.75) !important; /* antracite à 75% d'opacité */
}
/** + ajouter un picto "+" en before (qu'on comprenne mieux que c'est un lien) **/
.shared_story .efbl_link_text p.efbl_title_link:before {
font-family: ETmodules !important;
color: #3c3c3b !important; /* antracite */
opacity: 50%;
font-size: 0.75em !important;
font-weight: bold !important;
line-height: 1.25rem !important;
content: "P";
position: relative !important;
right: 0;
bottom: 0;
padding-right: 0.35em;
}
/*** 7.2) réglages du lecteur de podcasts ***/
.srp_player_boxed {
background: transparent !important;
position: relative;
padding: 0 !important;
}
.iron-audioplayer[data-playertemplate="skin_boxed_tracklist"]:not(.srp_tracklist_grid) .playlist {
padding: 20px 0 !important;
}
.iron-audioplayer .playlist ul {
padding: 0 !important;
}
.iron-audioplayer[data-playertemplate="skin_boxed_tracklist"] .sr-playlist-item {
padding: 10px 0 !important;
}
.iron-audioplayer .playlist .track-number {
padding-left: 0 !important;
}
/* réglages du bloc "télécharger le morceau" */
.iron-audioplayer .playlist .store-list .song-store-list-menu .song-store-list-container {
position: absolute;
right: -30px !important;
padding-left: 30px !important;
}
.iron-audioplayer .playlist .store-list .song-store-list-menu .song-store-list-container a:hover {
opacity: 0.5 !important;
}
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/***** ------------------------------------ 8) réglages des AUTRES PAGES ------------------------------------ *****/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ------------------------------------------------------------ ***/
/*** 8.0) réglages fête de la musique 2020 ***/
/*** ------------------------------------------------------------ ***/
.fete-de-la-musique-2020 h6 {margin-top:1rem;}
.fete-de-la-musique-2020 h2 {margin-top: 0.25rem; margin-bottom:1.25rem;}
@media only screen and (min-width: 768px) { /* bureau et tablette */
.fete-de-la-musique-2020 h6 br {display: none}
}
#fete-de-la-musique-event.et_pb_section,
#fete-de-la-musique-event.et_pb_section .et_pb_row {
margin: 0 !important;
padding: 0 !important;
}
@media only screen and (max-width: 981px) { /* tablette + smartphone */
#fete-de-la-musique-event.et_pb_section .et_pb_row {
width: 100% !important;
}
}
/*** ------------------------------------------------------------ ***/
/*** 8.0.1) réglages du compte à rebours ***/
/*** ------------------------------------------------------------ ***/
.et_pb_countdown_timer .et_pb_countdown_timer_container {
text-align: left !important;
}
.et_pb_countdown_timer .new-value, .et_pb_countdown_timer .value {
background: #393939 !important; /* Fix for where gradients arent supported */
-webkit-background: linear-gradient(#393939, #181818) !important;
-moz-background: linear-gradient(#393939, #181818) !important;
background: linear-gradient(#393939, #181818) !important;
color: #fff !important;
padding: 10px 15px !important;
border-radius: 8px !important;
font-weight: 600 !important;
letter-spacing: 0 !important;
-moz-box-shadow: inset 0 0 10px #000000 !important;
-webkit-box-shadow: inset 0 0 10px #000000 !important;
box-shadow: inset 0 0 10px #000000 !important;
}
.et_pb_countdown_timer .section p {
text-align: center !important;
display: block;
}
.et_pb_countdown_timer .sep {
display: none !important;
}
.et_pb_countdown_timer .section.values {
width: auto !important;
margin: 0 1rem !important;
}
.et_pb_countdown_timer p.label {
color: #3c3c3b !important; /* anthracite */
margin-top: 0.5rem !important;
font-size: 1.25rem !important;
}
.et_pb_countdown_timer .new-value:first-letter, .et_pb_countdown_timer .value:first-letter {
border-right: 1px solid #4c4c4c !important;
margin-right: 0.125em !important;
padding-right: 0.125em !important;
}
.et_pb_countdown_timer .section p.new-value,
.et_pb_countdown_timer .section p.value {
font-size: 4rem !important;
line-height: 4rem !important;
}
@media only screen and (max-width: 980px) { /* tablette */
.et_pb_countdown_timer .section p.new-value,
.et_pb_countdown_timer .section p.value {
font-size: 3rem !important;
line-height: 3rem !important;
}
.et_pb_countdown_timer p.label {
margin-top: 0.25rem !important;
font-size: 1rem !important;
}
}
@media only screen and (max-width: 767px) { /* smartphone */
.et_pb_countdown_timer .section p.new-value,
.et_pb_countdown_timer .section p.value {
font-size: 2rem !important;
line-height: 2rem !important;
}
.et_pb_countdown_timer .new-value, .et_pb_countdown_timer .value {
padding: 4px 6px !important;
border-radius: 4px !important;
}
.et_pb_countdown_timer .section.values {
width: auto !important;
margin: 0 0.5rem !important;
}
#fete-de-la-musique-event .et_pb_column .et_pb_module {
margin-bottom: 0.5rem !important;
}
.et_pb_countdown_timer .section.values:first-child {
margin-left: 1rem !important;
}
}
body.page-id-857 .et_pb_countdown_timer .section p.new-value,
body.page-id-857 .et_pb_countdown_timer .section p.value {
font-size: 2rem !important;
line-height: 2rem !important;
}
body.page-id-857 .et_pb_countdown_timer .new-value, body.page-id-857 .et_pb_countdown_timer .value {
padding: 4px 6px !important;
border-radius: 4px !important;
}
body.page-id-857 .et_pb_countdown_timer .section.values {
width: auto !important;
margin: 0 0.5rem !important;
}
#fete-de-la-musique-page .et_pb_column .et_pb_module {
margin-bottom: 0.5rem !important;
}
body.page-id-857 .et_pb_countdown_timer .section p.label {
font-size: 12px !important;
line-height: 21px !important;
margin-bottom: 4px !important;
}
/*** ------------------------------------------------------------ ***/
/*** 8.0.2) réglages de la page des vidéos ***/
/*** ------------------------------------------------------------ ***/
body.page-id-235530 article#post-235530,
body.page-id-235530 #integration-video-gallery {
margin-bottom: 3rem !important;
}
body.page-id-235530 h2 {
margin-bottom: 1rem !important;
}
.fluid-width-video-wrapper {
padding-top: 57% !important;
}
/*** padding bloc de la vidéo active ***/
#emdvideos {
padding: 20px 0px !important;
}
/*** padding bloc vidéo active - légende ***/
div.emd-container .video-summary {
padding: 20px 0px !important;
}
/*** réglages blocs vidéos (vidéo active + vidéos footer) ***/
div.emd-container .panel {
margin-bottom: 20px !important;
background-color: transparent !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
-webkit-box-shadow: none !important;
}
/*** réglages vidéo active ***/
div.emd-container .carousel-inner .item.active iframe {
border: none !important;
border-radius: 0 !important;
background-color: transparent !important;
padding: 0 !important;
}
/*** réglages vidéos footer (vignettes) ***/
div.emd-container .thumbnail {
display: block;
background-color: transparent !important;
border: none !important;
border-radius: 0px !important;
transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
}
/*** réglages des légendes (titres vidéos) ***/
div.emd-container,
div.emd-container a,
div.emd-container a.site-web-promo {
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
color: #3c3c3b !important;
font-size: 0.875rem !important;
font-weight: 500 !important;
line-height: 1.4em !important;
background-color: transparent !important;
}
div.emd-container a.site-web-promo:hover {
text-decoration: underline !important;
}
div.emd-container a.site-web-promo {
line-height: 2.4em !important;
}
/* réglages spéciaux légende vidéo active */
div.emd-container a {
font-size: 1.25rem !important;
text-decoration: none !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
div.emd-container a {
font-size: 1.1rem !important;
}
}
/* réglages spéciaux légendes vidéos footer */
div.emd-container .panel-footer {
text-align: left;
overflow: hidden;
padding: 10px 0px !important;
background-color: transparent !important;
border: none !important;
border-bottom-right-radius: 0px !important;
border-bottom-left-radius: 0px !important;
}
/* supprimer le padding-bottom sur le titre de la vidéo active */
#emd-videos p {
padding-bottom: 0 !important;
}
/* mettre une hauteur minimum sur la div contenant les infos de la vidéo active (137px = titre + 3 lignes extrait) */
@media only screen and (min-width: 768px) { /* bureau et tablette */
#emd-videos .video-summary {
min-height: 137px !important;
}
}
/* masquer les flèches nav vidéo précédente/suivante (de toutes façons elles ne fonctionnent pas ^^) */
div.emd-container .carousel-control.left,
div.emd-container .carousel-control.right {
display: none !important;
}
/*** sur natel: on met les éléments sur 1 ligne (au lieu de 2 colonnes) --> vidéo à gauche, légende à droite ***/
@media only screen and (max-width: 767px) { /* smartphone */
div.emd-container .col-xs-6 {
width: 100% !important;
}
.panel.panel-info.item-video {
height: auto !important;
}
div.emd-container .panel-body {
padding: 0;
margin: 0;
width: 45% !important;
}
div.emd-container .panel-footer {
text-align: left;
overflow: hidden;
padding: 6px;
width: auto !important;
display: block !important;
position: absolute;
top: -5px;
left: 50%;
padding: 0 1% 0 0 !important;
line-height: 1.3em !important;
}
}
/*** ------------------------------------------------------------ ***/
/*** 8.1) réglages de la section "où nous trouver" (page INFOS PRATIQUES) ***/
/*** ------------------------------------------------------------ ***/
/** régler la hauteur de la div sur min 200px, pour que les cartes du dessous soient alignées */
@media only screen and (min-width: 1201px) { /* bureau grand */
#ou-nous-trouver-texte {
min-height: 200px !important;
}
}
@media only screen and (max-width: 1200px) and (min-width: 981px) { /* bureau petit */
#ou-nous-trouver-texte {
min-height: 235px !important;
}
}
/*** ------------------------------------------------------------ ***/
/*** 8.2) réglages galeries images (page LES ARCHIVES) ***/
/*** ------------------------------------------------------------ ***/
/* masquer la div contenant le nom de l'image (quand on clic sur une image pour l'agrandir) (inutile et très moche!) */
.mfp-title {
display: none;
}
/* réglages pagination (numéro de la page dans laquelle on se trouve) */
.et_pb_filterable_portfolio .et_pb_portofolio_pagination ul li a.active, .et_pb_gallery .et_pb_gallery_pagination ul li a.active {
color: #ce1414 !important;
font-weight: 700 !important;
}
/*** ------------------------------------------------------------ ***/
/*** 8.3) réglages vidéos intégrées (pages LES ARCHIVES + HOME) ***/
/*** ------------------------------------------------------------ ***/
/** pour le picto "play" des vidéos intégrées: annuler le font-weight 700 qui vient normalement pour les a_hover **/
a.et_pb_video_play:hover {
font-weight: 400 !important;
}
/*** ------------------------------------------------------------ ***/
/*** 8.4) réglages des modules Bascule (page LES ARCHIVES) ***/
/*** ------------------------------------------------------------ ***/
/** réglages de la couleur du texte "descriptif" dans les modules **/
.et_pb_toggle_content p {
color: #3c3c3b !important; /* anthracite */
}
/** réglages du toggle fermé **/
/* couleur du fond */
.et_pb_toggle.et_pb_toggle_close {
background-color: #ce1414 !important; /* rouge CAP */
}
/* réglages box-shadow (idem que lieu des event dans les listes) + padding + border */
.et_pb_toggle {
box-shadow: inset 0px 0px 50px -5px #ad1111 !important;
padding: 30px 20px 20px 20px !important;
border: none !important;
margin-bottom: 2.25% !important;
}
/* réglages du petit picto "+" */
.et_pb_toggle_title::before {
font-size: 20px;
margin-top: -.75em !important;
color: #fdfdfd !important; /* gris très clair */
}
h5.et_pb_toggle_title {
color: #fdfdfd !important; /* gris très clair */
}
.et_pb_toggle > h5:hover {
color: #fdfdfd !important; /* gris très clair */
font-weight: 700 !important;
}
/** réglages du toggle ouvert **/
/* couleur du fond + annuler box-shadow + réglages padding et border */
.et_pb_toggle.et_pb_toggle_open {
background-color: #fdfdfd !important; /* gris très clair */
box-shadow: none !important;
padding: 30px 20px 10px 20px !important;
border: 3px solid #ce1414 !important;}
/* réglages du petit picto "+" */
.et_pb_toggle_open > .et_pb_toggle_title::before {
font-size: 20px;
margin-top: -.75em !important;
color: #ce1414 !important; /* rouge CAP */
}
.et_pb_toggle_open h5.et_pb_toggle_title {
color: #3c3c3b !important; /* anthracite */
}
.et_pb_toggle_open .et_pb_toggle > h5:hover {
color: #3c3c3b !important; /* anthracite */
font-weight: 700 !important;
}
/*** ------------------------------------------------------------ ***/
/*** 8.5) réglages Gazette du CAP (pages LES ARCHIVES) ***/
/*** ------------------------------------------------------------ ***/
@media only screen and (min-width: 981px) { /* bureau */
#archive-gazettes-du-cap .pdfemb-viewer {
width: 95% !important;
margin-left: 2.5% !important;
margin-right: 2.5% !important;
margin-top: 10px;
margin-bottom: 30px;
}
#archive-gazettes-du-cap a {
margin-left: 2.5% !important;
}
.gazette_nouveau_format .pdfemb-pagescontainer.grab-to-pan-grab {
overflow: hidden !important;
width: 359px !important;
height: 253.702px !important;
}
}
@media only screen and (max-width: 981px) { /* tablette + smartphone */
#archive-gazettes-du-cap .pdfemb-viewer {
width: 100% !important;
margin-left: 0px !important;
margin-right: 0px !important;
margin-top: 10px;
margin-bottom: 30px;
}
#archive-gazettes-du-cap a {
margin-left: 0px !important;
}
.gazette_nouveau_format .pdfemb-pagescontainer.grab-to-pan-grab {
max-height: 460px !important;
}
}
@media only screen and (max-width: 767px) { /* smartphone */
.gazette_nouveau_format .pdfemb-pagescontainer.grab-to-pan-grab {
max-height: 215px !important;
}
}
/*** ------------------------------------------------------------ ***/
/*** 8.6) inversion ordre des colonnes "paires" (page LES PROJETS DU CAP) ***/
/*** ------------------------------------------------------------ ***/
/** swap = échanger **/
/** la classe CSS "column-swap" doit être ajoutée dans les Paramétrages de Ligne Module (onglet Avancé) = le bloc qui contient les 2 colonnes! et non dans les Paramétrages de Texte Module ^^ **/
/** la classe CSS "column-swap" doit être ajoutée uniquement dans les colonnes paires (2, 4, 6, etc) ^^ **/
@media only screen and (min-width: 981px) { /* bureau */
.column-swap { display: flex; }
.column-swap .et_pb_column:first-child { order: 2; margin-right: 0 !important; }
.column-swap .et_pb_column:last-child { order: 1; margin-right: 5.5% !important; }
}
/*** ------------------------------------------------------------ ***/
/*** 8.7) espacement des lignes "row" pour les projets passés (page LES PROJETS DU CAP) ***/
/*** ------------------------------------------------------------ ***/
#projet-passe {
padding-top: 27px !important;
}
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/***** -------------- 9) réglages AGENDA (plugin The Events Calendar Shortcode and Templates) --------------- *****/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ----------------------------------------------------------------------------- ***/
/*** 9.0) contenu fichier "ect-list-view.css" (vu qu'il n'arrive pas à se charger via le plugin) ***/
/*** ----------------------------------------------------------------------------- ***/
/*
List Common Styles
*/
#ect-events-list-content a,
#ect-events-list-content a:hover {
text-decoration: none !important;
}
#ect-events-list-content,
.ect-list-wrapper {
display: flex;
flex-direction: column;
width: 100%;
margin: 5px auto;
padding: 0;
max-width: 100%;
}
#ect-events-list-content h2.ect-events-page-title {
margin: 0 auto 20px;
width: 100%;
}
.ect-list-post {
width: 100%;
height: 100%;
min-height: 200px;
box-sizing: border-box;
word-break: break-word;
display: flex;
margin: 15px auto;
border: 1px solid #00000020;
border-radius: 15px;
padding: 5px;
gap: 15px;
}
.ect-list-post-left {
width: 30%;
background-size: cover;
position: relative;
min-height: 200px;
z-index: 9;
}
.ect-list-post-right {
width: 70%;
display: flex;
}
.ect-list-post-left:hover {
-webkit-filter: brightness(95%) hue-rotate(2deg);
filter: brightness(95%) hue-rotate(2deg);
}
.ect-list-img {
height: 100%;
width: 100%;
}
.ect-list-post.style-1 .ect-list-img,
.ect-list-post.style-1 .ect-list-date {
min-height: 200px;
border-radius: 7px;
padding: 5px;
}
.ect-list-post a {
box-shadow: none;
text-decoration: none;
}
.ect-list-post-left .ect-list-date {
-webkit-transition: width linear 0.5s;
/* Safari */
transition: width linear 0.5s;
width: 35%;
min-width: 100px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
background: rgba(224, 232, 243, 0.96);
height: 100%;
color: #fff;
padding: 8px;
box-sizing: border-box;
position: relative;
top: 0;
z-index: 2;
}
.ect-list-post:hover .ect-list-post-left .ect-list-date {
width: 100%;
}
.ect-list-date .ect-date-area {
text-align: center;
line-height: 92%;
font-size: 35px;
font-family: inherit;
padding-top: 14px;
/* padding: 14px 0px; */
}
.ect-list-post.style-2 .ect-list-date .ect-date-area {
text-align: left;
}
.ect-list-date .ect-date-area .ev-day {
font-size: 1em;
clear: both;
display: inline-block;
width: 100%;
}
.ect-list-date .ect-date-area .ev-mo {
font-size: 0.55em;
clear: both;
display: inline-block;
width: 100%;
}
.ect-list-date .ect-date-area .ev-yr {
font-size: 0.5em;
clear: both;
display: inline-block;
width: 100%;
position: relative;
/* top: -14px; */
}
.ect-list-date .ect-date-area .ev-time {
font-size: 0.32em;
clear: both;
display: inline-block;
width: 100%;
line-height: 1.35em;
}
#ect-events-list-content .ect-share-wrapper {
position: absolute;
right: 10px;
top: 10px;
z-index: 11;
}
.ect-list-post .ect-share-wrapper .ect-social-share-list {
width: 45px;
top: 0px;
left: -50px;
border: 1px solid #00000015;
border-radius: 10px;
display: flex;
flex-direction: column;
align-items: center;
box-shadow: 0px 0px 5px -3px #B5B5B5;
}
.ect-list-post.style-3 .ect-list-img {
padding: 5px;
border-radius: 7px;
}
.ect-list-post .ect-style3-desc .ect-event-content p {
margin-bottom: 0px;
}
.ect-list-post .ect-share-wrapper:hover .ect-social-share-list {
top: 0px;
}
.ect-list-post .ect-share-wrapper .ect-social-share-list:before {
display: none;
}
.ect-list-post .ect-share-wrapper .ect-social-share-list a {
line-height: 35px;
}
#ect-events-list-content .ect-list-post .ect-share-wrapper i.ect-icon-share:before {
background-color: #00000000;
}
/*right side*/
.ect-list-post-right-table {
display: flex;
height: 100%;
width: 100%;
}
.ect-list-post-right .ect-list-description {
width: 70%;
height: 100%;
display: flex;
flex-direction: column;
padding: 10px;
box-sizing: border-box;
position: relative;
justify-content: center;
gap: 8px;
}
.ect-list-post a.ect-events-read-more {
display: inline-block;
}
.ect-list-wrapper .ect-list-post-right .ect-list-venue {
height: 100%;
display: flex;
}
.ect-list-wrapper .style-3 .ect-list-post-right .ect-list-venue .ect-icon {
width: auto;
}
.ect-list-wrapper .style-1 .ect-list-post-right .ect-list-venue {
width: 30%;
height: 100%;
flex-direction: column;
justify-content: center;
padding: 10px;
border-radius: 7px;
background-color: #00000015;
}
.ect-list-wrapper .style-2 .ect-list-post-right .ect-list-venue {
width: 100%;
flex-direction: column;
margin-top: 10px;
}
.ect-list-post h2.ect-list-title {
font-size: 18px;
font-family: inherit;
margin: 0px;
padding: 0;
}
.ect-list-post h2.ect-list-title a {
text-decoration: none;
box-shadow: none;
}
.ect-list-post h2.ect-list-title a:hover {
filter: opacity(0.75);
-webkit-filter: opacity(0.75);
}
.ect-list-post .ect-event-content,
.ect-list-post .ect-events-read-more,
.ect-list-post .ect-rate-area {
font-size: 13px;
font-family: inherit;
padding: 0;
margin: 0;
display: flex;
width: 100%;
line-height: 1.6em;
flex-direction: column;
}
.ect-list-description .ect-event-content p {
padding: 0;
margin: 0;
display: inline-block;
width: 100%;
line-height: 23px;
}
a.ect-event-read-more {
text-decoration: none;
margin-top: 10px;
display: inline-block;
}
#ect-events-list-content .ect-list-cost {
position: relative;
}
#ect-events-list-content .ect-rate-area {
display: inline-block;
}
.ect-venue-details {
font-size: 13px;
line-height: inherit;
text-decoration: none;
display: inline-block;
}
.ect-list-venue .ect-venue-details .tribe-address {
width: 100%;
display: inline-block;
}
.ect-venue-details .tribe-address span {
display: inline-block;
}
.ect-venue-details .tribe-address .tribe-delimiter {
margin-right: 3px;
}
.ect-venue-details .tribe-address .tribe-postal-code {
margin: 0 3px;
}
.ect-list-venue .ect-google {
display: inline-block;
width: 100%;
margin-bottom: 5px;
}
.ect-list-venue .ect-google a {
font-size: 12px;
color: rgba(0, 0, 0, 0.5);
box-shadow: 0 1px 0 0 currentColor;
}
.ect-list-post .ect-list-venue .ect-rate-area {
display: inline-block;
width: 100%;
background: rgba(0, 0, 0, 0.15);
font-size: 22px;
}
.ect-list-post .ect-icon::before {
margin-left: 0px;
}
/* Style-2 / Modern List*/
.modern-list-right-side {
width: 30%;
height: 100%;
display: flex;
padding: 10px 15px;
align-items: center;
box-sizing: border-box;
flex-direction: column;
justify-content: center;
}
.modern-list-right-side .ect-list-date,
.modern-list-right-side .ect-list-date .ect-date-area {
display: inline-block;
width: 100%;
}
.ect-list-post.style-2 {
overflow: hidden;
margin-bottom: 20px;
border: 1px solid #00000020;
padding: 10px;
border-radius: 10px;
}
#ect-events-list-content .style-2 .ect-rate-area {
width: 100%;
margin: 0px;
display: inline-block;
}
.ect-list-post.style-2 .modern-list-right-side {
border-radius: 0px 10px 10px 0px;
}
.ect-list-post.style-2 .ect-list-img {
border-radius: 10px 0px 0px 10px;
}
.ect-modern-time {
text-align: center;
font-size: 0.65em !Important;
line-height: 1.25em;
}
/*** CSS for Classic List Style ***/
.style-3 .ect-list-post-right .ect-list-description {
width: 100%;
}
.style-3 i.ect-icon-location {
vertical-align: top;
font-size: 13px;
}
.ect-list-post.style-3 {
min-height: auto;
overflow: hidden;
margin-bottom: 20px;
padding: 10px;
}
.ect-list-post.style-3 .ect-list-post-left {
overflow: hidden;
}
.ect-list-post.style-3 .ect-list-post-left .ect-list-date {
width: 100%;
opacity: 0.95;
border-radius: 7px;
}
.ect-list-post.style-3 .ect-list-post-left:hover {
border-radius: 7px;
}
#ect-events-list-content .style-3 .ect-rate-area {
margin-top: 0px;
}
.ect-list-post.style-3 .ect-list-post-left .ect-list-date .ect-date-area {
width: calc(100% - 50px);
min-height: calc(100% - 50px);
border: 1px solid;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 5px;
border-radius: 7px;
padding: 14px 0px;
}
.ect-list-post.style-3 .ect-clslist-event-details {
box-shadow: unset;
background: #ffffff00;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
gap: 5px;
position: relative;
width: 180px;
}
.ect-list-post.style-3 .ect-list-post-right {
background: #f4fcff00;
}
.ect-list-post.style-3 .ect-list-post-left .ect-list-date:hover {
background: #ff000000 !important;
}
.ect-list-post.style-3 .ect-list-post-left .ect-list-date:hover .ect-date-area {
display: none;
}
.ect-list-post.style-3 .ect-list-post-left .ect-list-img:hover {
transition-duration: 1s;
transform: scale(1.5);
}
/* Media Query */
@media only screen and (max-width: 790px) {
.ect-list-post {
margin-bottom: 35px;
flex-direction: column;
}
.ect-list-wrapper .style-1 .ect-list-post-right .ect-list-venue {
width: 100%;
}
.ect-list-post a.ect-events-read-more,
.ect-list-post .ect-list-title,
.ect-list-post .ect-clslist-time,
.ect-list-post .ect-style3-desc .ect-event-content p,
.ect-list-date .ect-date-area {
text-align: center;
}
.ect-list-post-left .ect-list-date {
width: 100%;
top: inherit;
bottom: 0;
}
.ect-list-date .ect-date-area .ev-day,
.ect-list-date .ect-date-area .ev-mo,
.ect-list-date .ect-date-area .ev-yr {
clear: none;
width: auto;
height: auto;
float: left;
top: 0;
margin-left: 5px;
}
.ect-list-post.style-2 .ect-list-date .ect-date-area .ev-day {
font-size: 0.55em;
}
.ect-list-date .ect-date-area .ev-time {
margin-left: 5px;
}
.ect-list-post.style-1 .ect-list-date .ect-date-area,
.ect-list-post.style-1 .ect-list-date .ev-time {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.ect-list-post.style-2 .ect-list-date .ect-date-area .ev-time {
text-align: center;
}
.modern-list-right-side .ect-list-date,
.modern-list-right-side .ect-list-date .ect-date-area {
display: flex;
justify-content: center;
padding-top: 0px;
flex-wrap: wrap;
}
.ect-event-category ul.tribe_events_cat {
justify-content: center;
}
#ect-events-list-content .ect-share-wrapper .ect-social-share-list:before {
left: inherit;
right: 6px;
}
.ect-list-post .ect-list-post-right .ect-list-description {
border-right: 0;
}
.ect-list-img {
min-height: 210px;
}
.ect-list-post-left,
.ect-list-post-right,
.ect-list-post-right-table,
.ect-list-venue {
display: block;
width: 100%;
overflow: hidden;
height: auto;
text-align: center;
}
/* .ect-list-post.style-3 .ect-list-venue {
text-align: left;
} */
.ect-list-post.style-3 .ect-list-post-right-table,
.ect-list-post.style-3 .ect-list-description,
.ect-list-post.style-3 a.ect-events-read-more,
.ect-list-post.style-3 .ect-list-venue {
text-align: left;
align-items: self-start;
}
.ect-list-post-right .ect-list-venue {
width: 100%;
overflow: hidden;
height: auto;
}
.ect-list-post {
padding: 30px auto;
}
.ect-list-post-right .ect-list-description,
.modern-list-right-side {
align-items: center;
width: 100%;
}
.ect-list-description .ect-event-content {
align-items: center;
}
.ect-modern-time {
display: inline-block;
}
.ect-clslist-event-date,
.ect-clslist-event-info,
.ect-clslist-event-details,
.ect-clslist-event-details a.tribe-events-read-more {
display: inline-block;
width: 100%;
position: relative;
padding: 10px;
}
.ect-list-post.style-3 .ect-clslist-event-details {
position: absolute;
right: 10px;
top: 10px;
}
#ect-events-list-content .style-1 .ect-rate-area {
float: left;
margin-top: 0;
}
/* #ect-events-list-content .style-3 .ect-rate-area {
margin-top: 10px;
text-align: center;
} */
.ect-list-post.style-3 .ect-list-post-left .ect-list-date {
min-height: 210px;
}
.ect-list-post.style-3 {
position: relative;
}
}
.ect-list-post-left span.ect-custom-schedule {
display: flex;
text-align: center;
line-height: 92%;
font-size: 38px;
font-family: inherit;
padding-top: 14px;
align-items: center;
}
.ect-list-post.style-2 .ect-list-img,
.ect-list-post.style-2 .modern-list-right-side {
border-radius: 10px;
}
.ect-list-post.style-2 .ect-list-description {
border-bottom: none;
gap: 8px;
}
/*** style 4*/
.style-4 .ect-list-schedule {
background: white;
border: 1px solid #C5C5C5;
padding: 2px;
position: absolute;
width: 100px;
right: 0;
left: auto;
bottom: 0;
}
.ect-list-schedule-wrap {
align-items: center;
border: 1px solid #C5C5C5;
display: flex;
flex-direction: column;
justify-content: center;
}
.ect-list-schedule .ev-mo {
color: #FA5A41;
font-size: 0.625rem;
letter-spacing: 0.15em;
line-height: 0.9;
}
.ect-list-schedule .ev-day {
font-size: 1.5rem;
line-height: 1;
}
.ect-grid-image-style4 {
width: 100%;
position: relative;
}
.ect-list-schedule span {
display: block;
text-align: center;
}
#ect-events-list-content .ect-share-style-4 .ect-share-wrapper {
right: unset;
left: 11px;
}
#ect-events-list-content .style-4 .ect-rate-area {
float: none;
}
.ect-list-post .ect-icon-clock:before,
.ect-list-post .ect-icon-location:before,
.ect-list-post .ect-icon-ticket:before {
margin-left: 0px !important;
}
/*** ----------------------------------------------------------------------------- ***/
/*** 9.1) réglages des listes d'events futurs (template="default" style="style-1") ***/
/*** ----------------------------------------------------------------------------- ***/
/** réglages du titre H2 "LES ACTIVITÉS RÉGULIÈRES" + "LES PROCHAINES ACTIVITÉS" en dessous de la grille d'agenda **/
.tribe-events-after-html h2 {
font-size: 1.625rem !important;
margin: 20px 0 0 !important;
}
@media only screen and (max-width: 819px) { /* smartphone et mini tablettes */
.tribe-events-after-html h2 {margin: 0 !important;}
}
/** réglages du titre H4 "les prochaines dates :", avant les listes d'events intégrées aux pages **/
h4.prochaines-dates-dans-pages {
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
font-size: 1.25rem !important;
color: #3c3c3b !important; /* anthracite */
font-weight: 500 !important;
line-height: 1em !important;
margin-top: 20px !important;
}
/** réglages de toute la ligne **/
.ect-list-post {
max-width: 1080px !important;
margin: 0px auto 20px auto !important; /* valeurs originales: 20px auto */
border: 2px solid #ce1414 !important; /* rouge CAP */ /* ce que j'ai rajouté */
height: auto !important;
border-radius: 0 !important;
padding: 0 !important;
}
/** réglages du bloc gauche (date + image) **/
body:not(.page-id-236258) .style-1 .ect-list-post-left {width: 20% !important;}
#ect-events-list-content .style-1 .ect-list-post-left .ect-list-date,
#ect-events-list-content .style-1.ect-featured-event .ect-list-post-left .ect-list-date {
background: rgba(206, 20, 20, .9) !important; /* rouge CAP à 90% */
box-shadow: none !important;
}
.ect-list-post-left .ect-list-date {
min-width: 125px !important; /* pour que tout rentre (même les mois longs) */
text-shadow: 1px 0px 2px rgba(0, 0, 0, 0.35);
}
body.page-id-236258 .ect-list-post-left .ect-list-date {min-width: 50px !important;}
.style-1 .ect-list-date .ect-date-area .ev-day {font-size: 1em;}
.style-1 .ect-list-date .ect-date-area .ev-mo {font-size: 0.5em;}
.style-1 .ect-list-date .ect-date-area .ev-yr {font-size: 0.7em;}
.ect-list-post.style-1 .ect-list-date, .ect-list-post.style-1 .ect-list-img {border-radius: 0 !important; padding: 0 !important;}
/* annuler le font-weight: 700 du hover (défini à la ligne 154) */
.ect-list-post-left a:hover {
font-weight: 500 !important;
}
/** réglages du bloc droite (résumé + lieu) **/
body:not(.page-id-236258) .style-1 .ect-list-post-right {width: 80% !important;}
/** réglages du bloc central (titre + description + "voir les détails") **/
body:not(.page-id-236258) .style-1 .ect-list-post-right .ect-list-description {
width: 70% !important;
}
#ect-events-list-content .ect-list-post-right .ect-list-description {
border-color: transparent !important;
box-shadow: none !important;
}
/* réglages du titre de l'event (lien) dans les listes d'events futurs */
#ect-events-list-content h2.ect-list-title a.ect-event-url {
font-family: "Open Sans";
color: #ce1414 !important; /* rouge CAP */
font-size: 18px;
font-weight: 600 !important;
font-style: normal;
line-height: 1.4em;
}
/* réglages du lien ("Voir les détails>>") de l'event dans les listes d'events futurs */
#ect-events-list-content .ect-list-description .ect-event-content a {
color: #ce1414 !important; /* rouge CAP */
}
#ect-events-list-content a.ect-events-read-more {
font-weight: 600 !important;
}
/* réglages de la div contenant le prix - dans les listes d'event - pour pas que ça se chevauche avec le lien "Voir les détails>>" */
@media only screen and (max-width: 767px) { /* smartphone */
#ect-events-list-content .style-1 .ect-rate-area {
margin-right: -60px !important;
}
}
/** réglages du bloc droite (lieu) **/
.style-1 .ect-list-post-right .ect-list-venue {width: 30% !important; border-radius: 0 !important; padding: 20px;}
body.page-id-236258 .ect-list-post-right .ect-list-venue {width: initial !important;}
.ect-list-post .ect-list-post-right .ect-list-venue,
.cool-timeline.white-timeline .timeline-post.timeline-evt .timeline-meta {background: #ce1414 !important;} /* rouge CAP */
#ect-events-list-content .ect-list-venue .ect-venue-details,
#ect-events-list-content .ect-list-venue .ect-venue-details a {color: #fdfdfd !important;}
#ect-events-list-content .ect-list-venue .ect-venue-details {
margin: 10px auto !important;
}
.ect-list-venue .ect-venue-details .tribe-address {
margin: 5px auto 10px auto !important;
}
.ect-list-venue .ect-google {
margin-bottom: 0px !important;
}
.ect-list-venue .ect-google a {box-shadow: none;}
/*** réglages POUR TABLETTE ***/
@media only screen and (max-width: 820px) { /* tablette */
/** réglages des bloc gauche (date) **/
.style-1 .ect-list-post-left .ect-list-date {min-width: 90px !important;}
}
/*** réglages POUR SMARTPHONE et mini tablettes ***/
@media only screen and (max-width: 819px) { /* smartphone et mini tablettes */
/** réglages des bloc gauche (date) + bloc central (titre + description + "voir les détails") : largeur à 100% - pour styles 1 et 3 **/
body:not(.page-id-236258) .style-1 .ect-list-post-left, body:not(.page-id-236258) .style-1 .ect-list-post-right, body:not(.page-id-236258) .style-1 .ect-list-post-right-table, body:not(.page-id-236258) .style-1 .ect-list-post-right .ect-list-description,
body:not(.page-id-236258) .style-3 .ect-list-post-left, body:not(.page-id-236258) .style-3 .ect-list-post-right, body:not(.page-id-236258) .style-3 .ect-list-post-right-table, body:not(.page-id-236258) .style-3 .ect-list-post-right .ect-list-description{
display: block !important;
width: 100% !important;
overflow: hidden !important;
height: auto !important;
}
.ect-list-post.style-1 .ect-list-img, .ect-list-post.style-1 .ect-list-date {min-height: 120px;}
#ect-events-list-content .style-1 .ect-list-post-left .ect-list-date, #ect-events-list-content .style-1.ect-featured-event .ect-list-post-left .ect-list-date {background: rgba(206, 20, 20, 0.75) !important;}
.ect-list-post {padding: 30px auto !important;}
.ect-rate-area, a.ect-events-read-more {display: none !important;}
/** réglages du bloc droite (lieu) = masqué **/
.ect-list-post-right .ect-list-venue {display: none !important;}
}
/*** réglages spéciaux pour la page "inscriptions me 9-11" (page-id-236258) (template="default" style="style-1") ***/
body.page-id-236258 #ect-events-list-content .style-1 .ect-rate-area,
body.page-id-236258 a.ect-events-read-more {
display: none !important;
}
body.page-id-236258 #ect-events-list-content .style-1 h2.ect-list-title,
body.page-id-236258 #ect-events-list-content .style-1 h2.ect-list-title a.ect-event-url {
font-size: 1rem !important;
line-height: 1.4em !important;
padding: 0 !important;
margin: 0 !important;
}
@media only screen and (min-width: 768px) and (max-width: 980px) { /* tablette entre 768 et 980 */
body.page-id-236258 #ect-events-list-content .style-1 .ect-list-post-right .ect-list-description .ect-event-content p {font-size: 0.825rem !important;}
}
/*** ------------------------------------------------------------------------------- ***/
/*** 9.2) réglages des listes d'events archivés (template="default" style="style-3") ***/
/*** ------------------------------------------------------------------------------- ***/
/** masquer l'image pour les events passés **/
.tribe-events-notices~.type-tribe_events .tribe-events-event-image {display: none !important;}
/** réglages du bloc gauche (date) **/
/* changer la largeur de la div qui contient la date de l'event "archivé", pour que tout rentre (même les mois longs) */
.style-3 .ect-list-post-left, #ect-events-list-content .style-3 .ect-list-date {min-width: 200px !important;}
/* + régler l'ombre comme pour les lieux des events futurs */
#ect-events-list-content .style-3 .ect-list-date {box-shadow: inset 0px 0px 400px 15px #ad1111 !important;}
.ect-list-post-left {min-height: initial !important;}
/* forcer les 3 font-size (day, mo, yr) à être de la même taille = 100% = 18px, pour que tout rentre en hauteur et en largeur */
.style-3 .ect-list-date .ect-date-area.default-schedule span.ev-day,
.style-3 .ect-list-date .ect-date-area.default-schedule span.ev-mo,
.style-3 .ect-list-date .ect-date-area.default-schedule span.ev-yr {
font-size: 100% !important;
font-size: 18px !important; /* au lieu de 42px*/
}
/* forcer la date (originalement en "block") à passer en "inline", pour réduire la hauteur de la ligne */
.style-3 .ect-list-date .ect-date-area.default-schedule span {
display: inline !important;
}
/* annuler la valeur d'origine de la position (position: relative; top: -14px;) */
.style-3 .ect-list-date .ect-date-area .ev-yr {
position: static !important;
}
/* annuler la valeur d'origine de display (table-cell;) + annuler la valeur d'origine de padding-top (14px;) */
.style-3 .ect-list-date .ect-date-area {
display: initial !important;
padding: 0px !important;
width: 100% !important;
min-height: initial;
border: none !important;
border-radius: 0 !important;
}
.ect-list-post.style-3 .ect-list-post-left:hover {border-radius: 0 !important;}
.ect-list-post.style-3 .ect-list-post-left .ect-list-img:hover {transform: none !important;}
/** réglages du bloc central (titre + horaire) **/
.ect-list-post.style-3 .ect-list-post-right .ect-list-description {width: 100% !important;}
/* réglages de la div qui contient le titre et l'heure de l'event archivé */
.ect-clslist-event-info {
background: transparent !important;
box-shadow: none !important;
}
/* annuler les margin et padding du contenu de cette div (titre et heure event) */
#ect-events-list-content .ect-list-post.style-3 h2.ect-list-title {
margin: 0 !important;
padding: 0 !important;
}
/* réglages du titre de l'event (lien) dans les listes d'events archivés */
#ect-events-list-content h2.ect-list-title a.ect-event-url {
font-family: "Open Sans";
color: #ce1414 !important; /* rouge CAP */
font-size: 18px;
font-weight: 600 !important;
font-style: normal;
line-height: 1.4em;
margin-bottom: 10px !important;
}
/* réglages de l'heure de l'event dans les listes d'events archivés */
.ev-smalltime,
#ect-events-list-content .ect-featured-event.style-3 .ev-smalltime {
margin: 0 !important;
color: #3c3c3b !important; /* anthracite */
}
/* masquer la div qui contenait le prix */
#ect-events-list-content .style-3 .ect-rate-area {display: none !important;}
/* masquer la div qui contenait le texte de l'event */
.ect-list-post.style-3 .ect-event-content {display: none !important;}
/* masquer la div qui contenait "find out more" */
#ect-events-list-content .ect-list-post.style-3 a.ect-events-read-more {display: none !important;}
#ect-events-list-content .ect-list-post.style-3 .ect-list-img {background: none !important;}
.ect-list-post.style-3 .ect-list-post-left .ect-list-date, .ect-list-post.style-3 .ect-list-img {border-radius: 0 !important; padding: 0 !important; opacity: 1 !important;}
/*** réglages POUR SMARTPHONE et mini tablettes ***/
@media only screen and (max-width: 819px) { /* smartphone et mini tablettes */
.ect-list-post.style-3 {gap: 0px;}
.ect-list-post.style-3 .ect-list-post-left .ect-list-date {min-height: initial;}
.style-3 .ect-list-date .ect-date-area {width: auto !important;}
.style-3 .ect-list-img {min-height: initial;}
.ect-list-post.style-3 .ect-list-post-right-table, .ect-list-post.style-3 .ect-list-description, .ect-list-post.style-3 a.ect-events-read-more, .ect-list-post.style-3 .ect-list-venue {text-align: center;}
}
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/***** ----- 10) Formulaires Formidable : connexion, user registration, inscription - MERCREDIS 9-11 ANS ----- *****/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ------------------------------------------------------------------------------- ***/
/*** 10.0) Formulaires Formidable : réglages généraux ***/
/*** ------------------------------------------------------------------------------- ***/
/*** padding gauche et droite sur les titres de la rootline, pour les forcer à se mettre sur 2 lignes sur l'ordi (plus joli) ***/
@media only screen and (min-width: 981px) { /* bureau */
form#form_capinscription ul.frm_page_bar li {
padding-left: 15px !important;
padding-right: 15px !important;
}
form#form_user-registration ul.frm_page_bar li {
padding-left: 35px !important;
padding-right: 35px !important;
}
}
/*** pour annuler les valeur par défaut de Formidable (focus faisait un border plus clair) ***/
.with_frm_style .form-field input:not([type="file"]):focus,
.with_frm_style textarea:focus {
border-color: #282828 !important; /* anthracite+foncé */
box-shadow: none !important;
}
/*** border-top au dessus des "Sections" ***/
.with_frm_style .frm-show-form .frm_section_heading h3,
.with_frm_style .frm-show-form .frm_section_heading.section-sans-border-top h3 {
border-top: none !important;
}
.with_frm_style .frm-show-form .frm_section_heading.section-avec-border-top {
padding-top: 1rem !important;
border-top: 1.25px solid #008ec2 !important; /* bleu Formidable */
}
/*** pour mettre plus d'espace entre chaque champ / ligne de champs ***/
.with_frm_style .form-field {
margin-bottom: 2rem !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
.with_frm_style .form-field {
margin-bottom: 1.25rem !important;
}
}
/*** annuler cette margin-bottom pour la section "Inscription avec choix des dates" (sinon les fois où il y a 5 mercredis, ça fait un espace "en trop")
* + rappel mois des activités (sur la page récap) ***/
.with_frm_style .form-field.sans-margin-bottom,
.with_frm_style .form-field.recap-mois-annee {
margin-bottom: 0 !important;
}
/* annuler cette margin-bottom pour la div contenant "Mot de passe oublié ?" (login form) */
.frm_form_field.frm_html_container.form-field.login_lost_pw.frm_half {
margin-bottom: 0 !important;
}
/* réduire cette margin-bottom pour la div contenant "Se souvenir de moi" (login form) */
.frm_form_field.form-field.frm_none_container.login-remember.frm_first.frm_half {
margin-bottom: 1rem !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
.with_frm_style .login-remember.frm_first.frm_half {text-align: left !important;}
.with_frm_style.frm_login_form .login_lost_pw.frm_half {text-align: right !important;}
}
/*** champs date de naissance, téléphones, nom d'utilisateur: forcer manuellement la largeur en frm_half ***/
@media only screen and (min-width: 768px) { /* bureau et tablette */
.frm_form_field.frm_half_manuel {
width: 49%;
}
}
/*** page Enregistrement: réglage du champs contenant "Bonjour , vous pouvez modifier votre profil ci-dessous" qui apparait quand l'user est connecté, et qu'il vient là pour modifier son profil ***/
.with_frm_style .message-modifier-profil input[type="text"] {
color: #fdfdfd !important;
background-color: #008ec2 !important; /* bleu Formidable */
border: 1.25px solid #008ec2 !important; /* bleu Formidable */
}
/*** pour éventuellement masquer le 5e mercredi ***/
.with_frm_style .frm_section_heading.form-field.mercredi5-cacher {
display: none !important;
}
/*** pour éventuellement masquer d'autres mercredis ***/
.with_frm_style .frm_form_field.form-field.choix-date.cacher-autres-mercredis,
.cacher-autres-mercredis {
display: none !important;
}
/*** ------------------------------------------------------------------------------- ***/
/*** 10.1) Formulaires Formidable : réglage des textes ***/
/*** ------------------------------------------------------------------------------- ***/
/** réglages des libellés + textes html et remarques + textes descriptions (sous certains champs) + textes boutons **/
.with_frm_style .frm_primary_label, /* libellés */
.with_frm_style .frm_html_container p, /* textes html */
.with_frm_style .frm_html_container p.formulaire-remarque, /* textes html - remarques */
.with_frm_style div.frm_description, /* textes descriptions */
.with_frm_style .frm_submit button, /* boutons Envoyer, Précédent, Suivant */
.with_frm_style input[type="submit"], /* bouton Se connecter */
a.frm_logout_link { /* "faux bouton" Se déconnecter */
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
color: #3c3c3b !important; /* anthracite */
font-size: 1rem !important;
line-height: 1rem !important;
font-weight: 500 !important;
}
/** réglages spéciaux libellés **/
.with_frm_style .frm_primary_label {
padding-bottom: 0.5em !important;
}
/** réglages spéciaux "formulaire-remarque" + descriptions **/
.with_frm_style .frm_html_container p.formulaire-remarque,
.with_frm_style div.frm_description {
opacity: 0.65 !important;
font-size: 0.875rem !important;
}
.with_frm_style div.frm_description {
margin-top: 0.5em !important;
}
/** réglages spéciaux texte sour Confirmation de l'inscription **/
.with_frm_style .frm_html_container.texte-confirmation-inscription p {
font-size: 0.875rem !important;
line-height: 1.4em !important;
}
/** réglages spéciaux texte boutons **/
.with_frm_style .frm_submit button,
.with_frm_style input[type="submit"],
a.frm_logout_link {
font-weight: 600 !important;
}
/** réglages des champs de saisie: textes (saisis par l'utilisateur) et blocs **/
.with_frm_style input[type="text"],
.with_frm_style input[type="email"],
.with_frm_style input[type="tel"],
.with_frm_style textarea, /* champs Paragraphe */
.with_frm_style select { /* champs Liste déroulante (choix enfant à inscrire) */
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
color: #3c3c3b !important; /* anthracite */
font-size: 1rem !important;
line-height: 1rem !important;
font-weight: 500 !important;
background-color: transparent !important;
border: 1.25px solid #282828 !important; /* anthracite+foncé */
-moz-border-radius: 0 !important;
-webkit-border-radius: 0 !important;
border-radius: 0 !important;
padding: 6px 10px !important;
-webkit-box-sizing: border-box !important;
-moz-box-sizing: border-box !important;
box-sizing: border-box !important;
outline: none !important;
box-shadow: none !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
/* libellés + html p */
.with_frm_style .frm_primary_label,
.with_frm_style .frm_html_container p,
/* 3 sortes de boutons */
.with_frm_style .frm_submit button,
.with_frm_style input[type="submit"],
a.frm_logout_link,
/* textes dans les champs de saisie */
.with_frm_style input[type="text"],
.with_frm_style input[type="email"],
.with_frm_style input[type="tel"],
.with_frm_style textarea,
.with_frm_style select {
font-size: 0.875rem !important;
}
/* html p "remarques" + descriptions */
.with_frm_style .frm_html_container p.formulaire-remarque,
.with_frm_style div.frm_description {
font-size: 0.75rem !important;
}
}
/*** réglages des titres dans les formulaires ***/
.with_frm_style .frm_section_heading > h3.frm_pos_top,
.frm-summary-page-wrapper table.frm-line-table tr td > h3 {
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
}
.with_frm_style .form-field.inscription-mois-annee input, /* mois des activités - mise en forme idem H1 */
.with_frm_style .form-field.recap-mois-annee input { /* mois des activités - rappel sur page récap */
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
color: #3c3c3b !important;
font-size: 1.875rem !important;
font-weight: 500 !important;
line-height: 1em !important;
text-transform: uppercase !important;
border: none !important;
padding: 0 !important;
}
.with_frm_style .form-field.recap-mois-annee input { /* mois des activités - rappel sur page récap : on annule la font-size "H1" + les majuscules */
font-size: 1rem !important;
text-transform: initial !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
.with_frm_style .frm_section_heading > h3.frm_pos_top,
.frm-summary-page-wrapper table.frm-line-table tr td > h3 {font-size: 1.175rem !important;}
.with_frm_style .form-field.inscription-mois-annee input {font-size: 1.5rem !important;}
.with_frm_style .form-field.recap-mois-annee input { font-size: 0.875rem !important;}
}
/*** forcer tous les autres textes à être en HelveticaNeueRoman ***/
table.frm-line-table tr td,
p.frm_total_formatted,
.with_frm_style .frm-summary-page-wrapper .frm-edit-page-btn,
span.frm_rootline_title {
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
}
span.vendredi-chauve-souris {font-size:80%;}
/*** ------------------------------------------------------------------------------- ***/
/*** 10.2) Formulaires Formidable : réglages des boutons radio + cases à cocher ***/
/*** ------------------------------------------------------------------------------- ***/
/*** "transformer" le rond des boutons radio en carrés ***/
.with_frm_style .frm_radio input[type="radio"] {
-webkit-appearance: checkbox !important;
border-radius: 0 !important;
}
/*** réglages des textes: libellés et choix ***/
.with_frm_style .choix-ecole .frm_primary_label, /* form User Registration - libellé "Ecole fréquentée" */
.with_frm_style .choix-ecole .frm_radio label, /* form User Registration - 3 choix sous "Ecole fréquentée" */
.with_frm_style .inscription-radio .frm_primary_label, /* form Inscription Activités - liste à choix "taille normal + petit" - libellé */
.with_frm_style .inscription-radio label, /* form Inscription Activités - liste à choix "taille normal + petit" - choix */
.with_frm_style .choix-date .frm_checkbox label, /* form Inscription Activités - lignes des "dates à choisir" */
.with_frm_style .options .frm_primary_label, /* form Inscription Activités - libellés "inscription pour" + "au retour" */
.with_frm_style .options.inscription .frm_radio label, /* form Inscription Activités - 3 choix sous "inscription pour" */
.with_frm_style .options.retour .frm_radio label { /* form Inscription Activités - 2 choix sous "au retour" */
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
color: #3c3c3b !important; /* anthracite */
font-size: 1rem !important;
line-height: 1rem !important;
font-weight: 500 !important;
padding-bottom: 0 !important;
}
/** réglages spéciaux pour les textes "taille petit" - choix **/
.with_frm_style .inscription-radio.petit label, /* form Inscription Activités - liste à choix "taille normal + petit" - choix */
.with_frm_style .options .frm_primary_label, /* form Inscription Activités - libellés "inscription pour" + "au retour" */
.with_frm_style .options.inscription .frm_radio label, /* form Inscription Activités - 3 choix sous "inscription pour" */
.with_frm_style .options.retour .frm_radio label { /* form Inscription Activités - 2 choix sous "au retour" */
font-size: 0.875rem !important;
line-height: 1.4em !important;
}
/** réglages spéciaux pour les options à choisir (sous les dates) : opacité 75%, pour bien les différencier du reste **/
.with_frm_style .options .frm_primary_label, /* form Inscription Activités - libellés "inscription pour" + "au retour" */
.with_frm_style .options .frm_radio label { /* form Inscription Activités - 3 choix sous "inscription pour" + 2 choix sous "au retour" */
opacity: 0.65 !important;
}
.with_frm_style .choix-ecole .frm_primary_label, /* form User Registration - "Ecole fréquentée" */
.with_frm_style .inscription-radio .frm_primary_label { /* form Inscription Activités - liste à choix "taille normal + petit" - libellé */
padding-bottom: 0.5em !important;
}
.with_frm_style .options .frm_primary_label { /* form Inscription Activités - libellés "inscription pour" + "au retour" */
padding-bottom: 0.125em !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
.with_frm_style .choix-ecole .frm_primary_label,
.with_frm_style .choix-ecole .frm_radio label,
.with_frm_style .inscription-radio .frm_primary_label,
.with_frm_style .inscription-radio label,
.with_frm_style .choix-date .frm_checkbox label,
.with_frm_style .options .frm_primary_label,
.with_frm_style .options .frm_radio label {
font-size: 0.875rem !important;
line-height: 0.875rem !important;
}
.with_frm_style .inscription-radio.petit label,
.with_frm_style .options .frm_primary_label,
.with_frm_style .options.inscription .frm_radio label,
.with_frm_style .options.retour .frm_radio label {
font-size: 0.75rem !important;
}
}
/* réglages des margin-bottom sous les blocs des "dates à choisir" + bloc "inscription pour" + bloc "au retour" */
.with_frm_style .form-field.choix-date,
.with_frm_style .form-field.options.inscription,
.with_frm_style .form-field.options.retour {
margin-bottom: 0.5em !important;
}
.with_frm_style .form-field.choix-date:not(:first-child) {
margin-top: 1.5em !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
.with_frm_style .form-field.choix-date:not(:first-child) {
margin-top: 1em !important;
}
}
/*** réglages spécifiques aux boutons radio "oui/non" (en majuscule / inline) ***/
.with_frm_style .radio-button-CAP.majuscule .frm_radio label {
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
color: #3c3c3b !important; /* anthracite */
font-size: 0.875rem !important;
line-height: 1rem !important;
font-weight: 500 !important;
text-transform: uppercase !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
.with_frm_style .radio-button-CAP.majuscule .frm_radio label {
font-size: 0.75rem !important;
}
}
/** par défaut c'était sur 2 lignes --> on les met en display inline-block **/
.with_frm_style .radio-button-CAP.majuscule .frm_radio {
display: inline-block !important;
margin-right: 5px !important;
}
/** par défaut c'était en display flex --> on les met en display block **/
.with_frm_style .consentement .frm_checkbox label {
display: block !important;
}
.frm_form_field.frm_inline_container .frm_opt_container {
padding-top: 0px !important;
}
/*** ------------------------------------------------------------------------------- ***/
/*** 10.3) Formulaires Formidable : réglages bloc "Résumé" sur la dernière page ***/
/*** ------------------------------------------------------------------------------- ***/
/*** on masque tous les border ***/
.entry-content table:not(.variations) {
border: none !important;
margin: 0 !important;
}
.frm-summary-page-wrapper .frm-line-table tr {
border-bottom: none !important;
}
.frm-summary-page-wrapper tr td {
border-top: none !important;
padding: 0 !important;
}
/*** réduire les margin / padding du bloc Résumé ***/
.with_frm_style .frm-summary-page-wrapper {
padding: 1rem 1rem 2rem 2rem !important;
margin: 10px 0 25px !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
.with_frm_style .frm-summary-page-wrapper {padding-left: 1rem !important;}
}
/*** masquer le titre du bloc Résumé (on ne garde que le titre de la section) ***/
#frm_field_59_container h3.frm_pos_.frm_primary_label {
display: none !important;
}
/** on masque tous les th (libellés) **/
.frm-summary-page-wrapper th {
display: none !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
.with_frm_style .frm-summary-page-wrapper .frm-edit-page-btn {
margin-bottom: 1.25rem !important;
}
}
/** ajouter un padding-top aux titres à l'intérieur du bloc Résumé, excepté pour le premier (en gros: ça ajoute un padding-top uniquement sur la ligne "Total") **/
.frm-summary-page-wrapper table.frm-line-table tr td h3 {
padding-top: 2rem !important;
padding-bottom: 0.5rem !important;
}
.frm-summary-page-wrapper table.frm-line-table tr:first-child td h3 {
padding-top: 0 !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
.frm-summary-page-wrapper table.frm-line-table tr td h3 {padding-top: 1.25rem !important;}
}
/*** pour chaque 3e ligne (tr) à partir de la 5e, on met un padding-top de 1.25rem, pour espacer les "blocs" (1 bloc = date choisie + options) entre eux ***/
.with_frm_style .frm-summary-page-wrapper tr:nth-child(3n+5) td {
padding-top: 1.25rem !important;
}
/*** padding-top de 0.5rem sur la 2e et la dernière ligne (tr) ***/
.with_frm_style .frm-summary-page-wrapper tr:nth-child(2) td,
.with_frm_style .frm-summary-page-wrapper tr:last-child td {
padding-top: 0.5rem !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
.with_frm_style .frm-summary-page-wrapper tr:nth-child(3n+5) td {padding-top: 1rem !important;}
}
/*** ------------------------------------------------------------------------------- ***/
/*** 10.4) Formulaires Formidable : réglages des boutons: Envoyer, Précédent, Suivant, Se connecter, Se déconnecter ***/
/*** ------------------------------------------------------------------------------- ***/
.with_frm_style .frm_submit button, /* boutons Envoyer, Précédent, Suivant */
.with_frm_style input[type="submit"], /* bouton Se connecter */
a.frm_logout_link { /* "faux bouton" Se déconnecter */
background-color: transparent !important;
border: 1.25px solid #008ec2 !important; /* bleu Formidable */
-moz-border-radius: 0 !important;
-webkit-border-radius: 0 !important;
border-radius: 0 !important;
padding: 8px 12px !important;
}
/** effet hover sur les boutons: fond bleu / texte gris très clair **/
.with_frm_style .frm_submit button:hover,
.with_frm_style input[type="submit"]:hover,
a.frm_logout_link:hover {
background-color: #008ec2 !important; /* bleu Formidable */
color: #fdfdfd !important; /* gris très clair */
font-weight: 600 !important; /* idem qu'en "pas hover" */
}
/** pour annuler les valeur par défaut de Formidable **/
.with_frm_style .frm_submit button:hover,
.with_frm_style input[type="submit"]:hover {
background: #008ec2 !important;
border-color: #008ec2 !important;
}
/*** réglage des boutons Envoyer + Suivant (alignés à droite) ***/
.with_frm_style .frm_button_submit.frm_final_submit,
.with_frm_style .frm_button_submit {
float: right !important;
}
/*** ------------------------------------------------------------------------------- ***/
/*** 10.5) Formulaires Formidable : réglages messages succès + erreurs ***/
/*** ------------------------------------------------------------------------------- ***/
/*** réglages du message de succès d'envoi du formulaire ***/
.with_frm_style .frm_message,
.frm_success_style {
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
color: #fdfdfd !important; /* gris très clair */
font-weight: 600 !important;
background-color: #008ec2 !important; /* bleu Formidable */
border: 1px solid #008ec2; /* bleu Formidable */
border-radius: 0 !important;
-moz-border-radius: 0 !important;
-webkit-border-radius: 0 !important;
margin-top: 1.5rem !important;
}
.with_frm_style .frm_error_style,
.with_frm_style .frm_message,
.frm_success_style {
padding: 1rem !important;
}
.with_frm_style .frm_message p {
padding-bottom: 1em !important;
margin-bottom: 0 !important;
color: #fdfdfd !important; /* gris très clair */
}
a.liens-hover-souligne.blanc {
color: #fdfdfd !important; /* gris très clair */
}
a.liens-hover-souligne.blanc:hover {
color: #fdfdfd !important; /* gris très clair */
text-decoration: underline !important; /* SOULIGNé */
}
/*** réglages du message d'erreur (qui vient en haut de l'écran) ***/
.with_frm_style .frm_error {
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
font-weight: 600 !important;
color: #e74319 !important; /* orange sanguine */
font-size: 0.875rem !important;
line-height: 1rem !important;
margin-top: 0.5rem !important;
}
/*** réglages des petits messages d'erreur (en dessous des champs concernés) ***/
.with_frm_style .frm_error_style {
font-family: HelveticaNeueRoman, Arial, sans-serif !important;
color: #fdfdfd !important; /* gris très clair */
font-weight: 600 !important;
background-color: #e74319 !important; /* orange sanguine */
border: 1px solid #e74319; /* orange sanguine */
border-radius: 0 !important;
-moz-border-radius: 0 !important;
-webkit-border-radius: 0 !important;
font-size: 0.875rem !important;
line-height: 1rem !important;
margin: 0;
margin-bottom: 20px;
}
/** réglage du champ de saisie qui comprennent une erreur (border = orange sanguine!) **/
.with_frm_style .frm_blank_field input[type="text"], .with_frm_style .frm_blank_field input[type="password"], .with_frm_style .frm_blank_field input[type="url"], .with_frm_style .frm_blank_field input[type="tel"], .with_frm_style .frm_blank_field input[type="number"], .with_frm_style .frm_blank_field input[type="email"], .with_frm_style .frm_blank_field textarea, .with_frm_style .frm_blank_field .mce-edit-area iframe, .with_frm_style .frm_blank_field select, .frm_form_fields_error_style, .with_frm_style .frm_blank_field .frm-g-recaptcha iframe, .with_frm_style .frm_blank_field .g-recaptcha iframe, .with_frm_style .frm_blank_field .frm-card-element.StripeElement, .with_frm_style .frm_blank_field .chosen-container-multi .chosen-choices, .with_frm_style .frm_blank_field .chosen-container-single .chosen-single, .with_frm_style .frm_form_field :invalid {
color: #3c3c3b !important;
background-color: transparent !important;
border-color: #e74319 !important; /* orange sanguine */
border-width: 1px !important;
border-style: solid !important;
}
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/***** ---------- 11) réglages de la page PROFIL UTILISATEUR (générée avec les "views" Formidable) ---------- *****/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ------------------------------------------------------------------------------- ***/
/*** 11.0) réglages généraux ***/
/*** ------------------------------------------------------------------------------- ***/
p.texte-gris,
span.texte-gris {
opacity: 0.5 !important;
font-size: 92.5% !important;
}
#section-compte .et_pb_module:first-child {
margin-bottom: 0 !important;
}
/*** ------------------------------------------------------------------------------- ***/
/*** 11.1) réglages des boutons : Se déconnecter + Modifier le profil + Accéder aux inscriptions ***/
/*** ------------------------------------------------------------------------------- ***/
/*** réglages des boutons : fond rouge + texte gris très clair (l'inverse des autres boutons dans le reste du site) ***/
#boutons-user-profil .et_pb_button {
color: #fdfdfd !important; /* gris très clair */
background-color: #ce1414 !important; /* rouge CAP */
border: 2px solid #ce1414 !important; /* rouge CAP */
font-size: 1rem !important;
line-height: 1.4em !important;
padding: 0.3em 0.6em;
}
@media only screen and (max-width: 980px) { /* tablette et smartphone */
#boutons-user-profil .et_pb_button {
font-size: 0.875rem !important;
}
}
#boutons-user-profil .et_pb_bg_layout_light.et_pb_button:hover,
#boutons-user-profil.et_pb_bg_layout_light .et_pb_button:hover {
color: #ce1414 !important; /* rouge CAP */
background-color: transparent !important;
font-weight: 500 !important; /* pour annuler l'effet habituel qu'il y a sur les liens en hover (font-weight à 700) */
}
/* supprimer le picto à droite du texte du bouton */
#boutons-user-profil .et_pb_button::after {
display: none !important;
}
/* et du coup supprimer le padding-right (qui laissait la place pour le picto) */
#boutons-user-profil .et_pb_button:hover, #boutons-user-profil.et_pb_module .et_pb_button:hover {
border: 2px solid #ce1414 !important; /* rouge CAP */
padding: 0.3em 0.6em; /* mêmes réglages que en "pas hover" */
}
/* largeur des boutons (75% de la largeur du module les contenant) + on les aligne à droite */
#boutons-user-profil .et_pb_button_module_wrapper > a {
width: 240px !important;
max-width: 75% !important;
text-align: center !important; /* texte centré dans le bouton */
}
#boutons-user-profil .et_pb_button_module_wrapper.et_pb_button_alignment_right {
text-align: right;
}
/*** sur tablette: forcer l'affichage des colonnes 1+2 à gauche / colonne 3 (avec boutons) à droite ***/
@media only screen and (min-width: 768px) and (max-width: 980px) { /* tablette entre 768 et 980 */
#row-avec-boutons .et_pb_column:nth-child(1),
#row-avec-boutons .et_pb_column:nth-child(2) {
width: 50% !important;
margin-right: 5.5% !important;
}
#row-avec-boutons .et_pb_column:nth-child(3) {
width: 44.5% !important;
position: absolute !important;
top: 20px !important;
right: 0 !important;
}
}
/*** sur smartphone: les colonnes font 100% de largeur (passent les unes en dessous des autres - fonctionnement natif de Divi) ***/
@media only screen and (max-width: 767px) { /* smartphone */
#boutons-user-profil .et_pb_button_module_wrapper.et_pb_button_alignment_right {
text-align: left !important; /* aligner les boutons à gauche */
}
#boutons-user-profil:first-child {
margin-top: 2rem !important; /* margin-top sur le 1er bouton, pour l'espacer du bloc "Infos de contact" */
}
}
/*** réglages des boutons dans les pages Mercredis 9-11 ans, dans les textes d'intro
* "Consulter mon profil" + "Modifier mon profil" + "S'inscrire aux activités" + "Se déconnecter" ***/
@media only screen and (min-width: 981px) { /* bureau */
#row-avec-boutons-logged-in .et_pb_column:nth-child(2) {
position: absolute !important;
top: 0px !important;
right: 0 !important;
}
#row-avec-boutons-logged-in .et_pb_column:nth-child(2) .et_pb_module {
margin-bottom: 10px !important;
}
}
@media only screen and (max-width: 980px) { /* tablette et smartphone */
#row-avec-boutons-logged-in-mobile .et_pb_module {
margin-bottom: 10px !important;
}
#row-avec-boutons-logged-in-mobile #boutons-user-profil .et_pb_button_module_wrapper > a {
width: 300px !important;
max-width: 100% !important;
}
#row-avec-boutons-logged-in-mobile #boutons-user-profil .et_pb_button_module_wrapper.et_pb_button_alignment_right {
text-align: left !important;
}
}
/*** ------------------------------------------------------------------------------- ***/
/*** 11.2) réglages de la section "erreur - vous n'êtes pas connectés" ***/
/*** ------------------------------------------------------------------------------- ***/
/*** la section "utilisateur non connectés" n'est visible que si l'utilisateur n'est pas connecté (élémentaire ^^)
* mais si l'utilisateur est connecté, bien que la section ne soit pas affichée, elle prend quand-même de l'espace, à cause du padding-top 80px qu'il y a sur les sections...
* du coup: on met une padding-top à 0 sur cette section, comme ça quand elle est masquée (si user connecté), il n'y a pas cet espace en trop...
* et on ajoute une ligne (en dessus de celle qui contient les modules erreur / login form / s'inscrire), avec un module code, et celui-ci contient
* [frm-condition source=is_logged_in equals=0][/frm-condition]
* du coup ça impose une hauteur de div (vide) de 80px, pour compenser le padding-top à 0px de cette section.
* ainsi, quand cette section est affichée (si user non connecté), on a un "espace vide" de 80px de hauteur, et ça fait comme si on avait le padding-top de la section ^_^v
* PS: on fait ça que pour l'affichage bureau / sur tablette et mobile c'est ok car le padding-top de la première section est à seulement 20px ***/
@media only screen and (min-width: 981px) { /* bureau */
#section-utilisateurs-non-connectes.et_pb_section {
padding-top: 0 !important;
}
/* ah et on met les padding des row à 0 (au lieu de 10px 0), pour que la "section masquée" ait vraiment une hauteur quasi nulle */
#section-utilisateurs-non-connectes.et_pb_section .et_pb_row {
padding: 0 !important;
}
}
/*** réglages de l'image + des colonnes etc ***/
@media only screen and (min-width: 981px) { /* bureau */
#section-utilisateurs-non-connectes .et_pb_module img {
float: left !important;
max-width: 150px !important;
height: auto !important;
margin: 1rem 1.5rem 1rem 0 !important;
}
}
/*** sur tablette: forcer l'affichage des colonnes 1+2 sur 1 ligne / colonne 3 (Pas encore de compte?) en pleine largeur, en dessous ***/
@media only screen and (min-width: 768px) and (max-width: 980px) { /* tablette entre 768 et 980 */
#section-utilisateurs-non-connectes .et_pb_column:nth-child(1) {
width: 34.5% !important;
margin-right: 15.5% !important;
}
#section-utilisateurs-non-connectes .et_pb_column:nth-child(2) {
width: 50% !important;
margin-right: 0 !important;
float: left !important;
}
#section-utilisateurs-non-connectes .et_pb_column:nth-child(3) {
width: 100% !important;
margin-right: 0 !important;
}
#section-utilisateurs-non-connectes .et_pb_module img {
margin: 0.5rem 0 1.5rem 0 !important;
}
p.pas-connecte br {
display: none !important;
}
}
@media only screen and (max-width: 767px) { /* smartphone */
#section-utilisateurs-non-connectes .et_pb_module img {
width: 70% !important;
height: auto !important;
margin-right: 30% !important;
margin-bottom: 1rem !important;
}
}
/*** ------------------------------------------------------------------------------- ***/
/*** 11.3) réglages des modules "détails du compte / des inscriptions ***/
/*** ------------------------------------------------------------------------------- ***/
/*** réglages des modules bascule ***/
#bascule_details_utilisateur.et_pb_toggle {
box-shadow: none !important;
border: none !important;
padding: 0 !important;
margin-top: 1rem !important;
margin-bottom: 0 !important;
}
#bascule_details_utilisateur.et_pb_toggle.et_pb_toggle_close {
background-color: transparent !important;
}
#bascule_details_utilisateur.et_pb_toggle.et_pb_toggle_open {
background-color: transparent !important;
box-shadow: none !important;
padding: 0 !important;
border: none !important;
}
/** réglages des titres des modules bascule **/
#bascule_details_utilisateur h5.et_pb_toggle_title {
color: #3c3c3b !important; /* anthracite */
}
#bascule_details_utilisateur h5.et_pb_toggle_title:hover {
font-weight: 500 !important;
}
/** réglages des petits triangles après les titres **/
#bascule_details_utilisateur.et_pb_toggle_close > .et_pb_toggle_title::before,
#bascule_details_utilisateur.et_pb_toggle_open > .et_pb_toggle_title::before {
display: none !important;
}
#bascule_details_utilisateur.et_pb_toggle_close > .et_pb_toggle_title::after,
#bascule_details_utilisateur.et_pb_toggle_open > .et_pb_toggle_title::after {
font-family: ETmodules !important;
position: relative !important;
top: 30% !important;
left: 0.25em !important;
margin-top: -.5em !important;
color: #3c3c3b !important;
font-size: 1em !important;
content: "\33" !important; /* triangle vers le bas */
}
#bascule_details_utilisateur.et_pb_toggle_open > .et_pb_toggle_title::after {
content: "\32" !important; /* triangle vers le haut */
}
@media only screen and (max-width: 767px) { /* smartphone */
#bascule_details_utilisateur.et_pb_toggle > .et_pb_toggle_title {
padding-right: 0 !important; /* enlever le padding-right à 50px (valeur par défaut de DIVI) */
}
}
/** réglages des toggle content **/
#bascule_details_utilisateur .et_pb_toggle_content {
padding-top: 0 !important;
}
#bascule_details_utilisateur.detail_compte .et_pb_toggle_content {
margin-bottom: 3rem !important;
}
/*** réglages des contenus dans les toggle content (views) ***/
/** réglages du tableau "récap compte utilisateur" */
.entry-content thead tr.utilisateur-recap-compte th,
.entry-content tr.utilisateur-recap-compte th,
.entry-content tr.utilisateur-recap-compte td {
border-bottom: 1.25px solid #008ec2; /* bleu Formidable */
padding: 0.5em 0.75em !important;
}
/** réglages de la div contenant chaque entrée */
.vue-user-recap-inscriptions {
padding: 1em !important;
border: 1.25px solid #008ec2; /* bleu Formidable */
border-radius: 3px !important;
margin: 0.75rem 0px 1.5rem 0px !important;
}
.vue-user-recap-inscriptions:last-child {
margin-bottom: 0 !important;
}
@media only screen and (max-width: 767px) { /* smartphone */
.entry-content thead tr.utilisateur-recap-compte th,
.entry-content tr.utilisateur-recap-compte th,
.entry-content tr.utilisateur-recap-compte td,
.vue-user-recap-inscriptions p {
font-size: 0.75rem !important;
}
}
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/***** 12) réglages des intros des pages MERCREDIS 9-11 ANS (connexion / créa compte / inscriptions / lost password) *****/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
#intro-pages-mercredis h2 {
font-size: 1.425rem !important;
padding-bottom: 0px !important;
}
@media only screen and (max-width: 980px) { /* tablette */
#intro-pages-mercredis h2 {
font-size: 1.35rem !important;
}
#intro-pages-mercredis .et_pb_column {
margin-bottom: 0.75rem !important;
}
}
@media only screen and (max-width: 767px) { /* smartphone */
#intro-pages-mercredis h2 {
font-size: 1.25rem !important;
}
#intro-pages-mercredis .et_pb_column {
margin-bottom: 0.25rem !important;
}
}
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/***** ---------- 13) réglages des pages COMPTA (enregistrer un paiement + récap dû / payé / solde) ---------- *****/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** réglages des boutons d'accès aux pages Compta (admin) ***/
#bouton-acces-compta .et_pb_button {
font-size: 1.375rem !important;
color: #fdfdfd !important; /* gris très clair */
background-color: #008ec2 !important; /* bleu Formidable */
border: 2px solid #008ec2 !important; /* bleu Formidable */
}
#bouton-acces-compta .et_pb_button_module_wrapper > a {
width: auto !important;
}
#bouton-acces-compta .et_pb_bg_layout_light.et_pb_button:hover,
#bouton-acces-compta.et_pb_bg_layout_light .et_pb_button:hover {
color: #008ec2 !important; /* bleu Formidable */
background-color: transparent !important;
font-weight: 500 !important; /* pour annuler l'effet habituel qu'il y a sur les liens en hover (font-weight à 700) */
}
#boutons_nav_page_compta #bouton-acces-compta .et_pb_button {font-size: 0.95rem !important;}
#boutons_nav_page_compta {
position: fixed;
bottom: 0;
left: 50%;
transform: translatex(-50%);
z-index: 999999999;
background-color: #fdfdfd !important;
}
#boutons_nav_page_compta,
#boutons_nav_page_compta .et_pb_row {
width: 100% !important;
max-width: 100% !important;
margin: 0 !important;
padding: 5px !important;
}
@media only screen and (max-width: 980px) { /* tablette et smartphone */
#boutons_nav_page_compta .et_pb_column {width: 31.333% !important; margin: 0 1% !important; margin-bottom: 0;}
#boutons_nav_page_compta #bouton-acces-compta .et_pb_button {font-size: 0.9rem !important;}
}
@media only screen and (min-width: 981px) { /* bureau */
#bouton-acces-compta.et_pb_module {
position: absolute !important;
right: 0;
top: 0;
}
}
/* tableau "Paiements reçus" : gestion largeur colonnes */
.entry-content #tableau-pmt-recus thead tr.utilisateur-recap-compte th,
.entry-content #tableau-pmt-recus tr.utilisateur-recap-compte th,
.entry-content #tableau-pmt-recus tr.utilisateur-recap-compte td {
width: auto !important;
max-width: 200px !important;
}
body.page-id-236633 .tableau_compta .et_pb_text_inner {
overflow-y: auto;
height: 660px;
}
body.page-id-236633 .exp_link .et_pb_text_inner {height: initial;}
body.page-id-236633 thead tr th {
position: sticky;
top: 0;
background-color: #008ec2 !important; /* bleu Formidable */
color: #fdfdfd !important; /* gris très clair */
}
body.page-id-236633 table {
border-collapse: collapse;
width: 100%;
}
@media only screen and (max-width: 980px) { /* tablette et smartphone */
body.page-id-236633 table {min-width: 200% !important;}
}
@media only screen and (max-width: 767px) { /* smartphone */
body.page-id-236633 table {min-width: 300% !important;}
body.page-id-236633 #user_total_du table {min-width: 400% !important;}
}
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/***** 14) réglages de la pages RECAP (Récap inscriptions par date + récap CARTE MEMBRE + infos générales) *****/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** rendre un tableau scrollable
* source: https://nosmoking.developpez.com/demos/css/table-scrollable.php ***/
.table-scrollable tbody td:first-child,
.table-scrollable tbody td:nth-child(2) {
z-index: 1;
position: sticky;
left: 0;
}
.table-scrollable thead tr:first-child th {
z-index: 2;
position: sticky;
top: 0;
}
.table-scrollable thead tr:first-child th:first-child,
.table-scrollable thead tr:first-child th:nth-child(2) {
z-index: 3;
position: sticky;
top: 0;
left: 0;
}
.table-scrollable tbody td:nth-child(2),
.table-scrollable thead tr:first-child th:nth-child(2) {
left: 22.3px !important;
}
.table-conteneur {
/* width: 60em; /* on laisse faire */
height: auto;
margin: auto;
border: 1px solid #888;
overflow: auto;
}
.table-scrollable {
border: 0;
border-collapse: separate;
border-spacing: 0;
background-color: #EFEFEF;
}
.table-scrollable th, .table-scrollable td {
padding: 0.5em !important;
border-right: 1px solid #888;
word-break: normal;
}
.table-scrollable th + th, .table-scrollable td +td {
border-left: 1px solid #FFF;
}
.table-scrollable thead th {
border-top: 1px solid #FFF;
text-shadow: 1px 1px 0 #FFF;
white-space: nowrap;
background: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.2) )repeat scroll 0% 0% #EEE;
}
.table-scrollable tbody {
border: 1px solid #888;
border-width: 1px 0;
background-color: #FFF;
}
.table-scrollable tbody td:first-child,
.table-scrollable tbody td:nth-child(2) {
background: #FFF;
}
.table-scrollable tbody td {
border-top: 1px solid #CCC;
white-space: nowrap;
}
.table-scrollable tbody tr:hover td {
background-color: #EFEFFF;
}
.colonne-cachee {
display: none !important;
}
.table-scrollable tbody th.recap-sante,
.table-scrollable tbody td.recap-sante {
width: 300px !important;
white-space: initial !important;
}
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/***** ---------------------------------- 15) réglages du pop-up COOKIEBOT ---------------------------------- *****/
/*** ---------------------------------------------------------------------------------------------------------- ***/
/*** ---------------------------------------------------------------------------------------------------------- ***/
@media only screen and (min-width: 981px) { /* bureau */
#CybotCookiebotDialogBody { /* largeur du pop-up */
max-width: 60% !important;
}
}
#CybotCookiebotDialog { /* background-color du pop-up */
background: rgba(255, 255, 255, 0.85) !important;
}
#CybotCookiebotDialogBodyContentText { /* font-size du texte cookies bla bla */
font-size: 12px !important;
text-align: justify !important;
}
#CybotCookiebotDialogDetail { /* background-color de "Afficher les détails" */
background-color: rgba(255, 255, 255, 0) !important; /* opacité 0%, sinon ça se superpose */
padding-top: 20px !important;
}
@media only screen and (min-width: 981px) { /* bureau */
#CybotCookiebotDialogDetailBody { /* largeur de "Afficher les détails" */
max-width: 60% !important;
}
}
#CybotCookiebotDialogBodyButtonDecline { /* couleur du bouton "Utiliser uniquement les cookies nécessaires" */
background-color: #666666 !important;
border: 1px solid #666666 !important;
}
#CybotCookiebotDialogBodyButtonAccept { /* couleur du bouton "Autoriser tous les cookies" */
background-color: #8eb521 !important;
border: 1px solid #8eb521 !important;
}
@media only screen and (max-width: 981px) { /* tablette + smartphone */
#CybotCookiebotDialogPoweredbyLink { /* largeur du logo */
width: 20px !important;
}
#CybotCookiebotDialogBodyContent { /* pour réduire l'espace entre le logo et le texte (valeur originale du padding-left = 80px) */
padding: 12px 0 8px 40px !important;
}
#CybotCookiebotDialog, #CybotCookiebotDialogDetail { /* background-color du pop-up */
background: rgba(255, 255, 255, 0.92) !important;
}
#CybotCookiebotDialogBodyButtons {
padding-left: 22px !important;
}
}
/** réglages des liens + h3 dans les pages Politique de confidentialité (id-236962) + Cookies (id-XXX) + Mentions légales (id-236965) **/
/** PAGE ID à MODIFIER !!!! **/
.page-id-236962 p,
.page-id-236965 p {
font-size: 1rem !important;
}
.page-id-236962 h3,
.page-id-236965 h3 {
margin-top: 30px !important;
}
#CookieDeclarationUserStatusPanel a,
a.modifier-consentement {
color: #ce1414 !important; /* rouge CAP */
font-weight: bold !important;
font-size: 1rem !important;
line-height: 3em !important;
}
a.cookies-links {
color: #ce1414 !important; /* rouge CAP */
font-weight: bold !important;
}
/* réglages ligne hr insérée en bas des pages Politique de confidentialité + Mentions légales */
hr.ligne-pdc-ml {
border: 0.25px solid rgba(135, 135, 135, 0.34) !important;
margin-bottom: 0.25rem;
}