/*
 * CSS for Réformés.ch (septembre 2017)
 * [v4] septembre 2018
 * [SPN] 2022
 * [Déformés] 2022
 * [/beju] 2023
 * yves.bresson@mediaspro.com
 * www.ybresson.com
 *
 * couleur #1  : #00ADD3   turquoise "colombe"
 * couleur #2  : #95989a   gris des bordures et textes gris
 * couleur #3  : #e4e0d7   beige du fond texturé et fond encadrés
 *
 * fonts       : Playfair Display   : regular 400, bold 700
 *             : Raleway            : light 300, regular 400, medium 500, semibold 600, bold 700
 *             : Fira Sans          : regular 400, medium 500, semibold 600, bold 700
 *
 * base font (sur html) = railway regular 20px => 1rem = 20px
 *
 * font-family: 'Raleway', sans-serif;
 * font-family: 'Playfair Display', serif;
 * font-family: 'Fira Sans', sans-serif;
 * 
 * font-family: 'Amaranth', sans-serif;
 * font-family: 'Poppins', sans-serif;
 * 
 * font-family: 'Lato', sans-serif;
 * font-family: 'Montserrat', sans-serif;
 */

/* attention à bien utiliser la véritable version italique de Playfair Display, sinon Nicolas Friedli est choqué et ne parvient plus à lire ;-) */
@import url('https://fonts.googleapis.com/css?family=Fira+Sans:400,500,600,700|Playfair+Display:400,700,700i|Raleway:300,400,500,600,700&display=swap');
/* deformes */
/* @import url('https://fonts.googleapis.com/css2?family=Amaranth&family=Poppins:ital,wght@0,300;0,500;1,500&display=swap');*/
/* SPN (église numérique) */
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700;900&family=Montserrat:wght@600&display=swap');

/***************************************************/
/*
 *
 * global stuff
 *
 */

html, body {
   color: black;
   font-family: 'Raleway', sans-serif;
   font-size: 20px;
   font-weight: 400;
   /*
   line-height: 20px;
   */
}

html {
   background-color: #707070; /* same as footer */
}

body {
   margin-top: 0;
   background: #f4f4f4 url("../images/background-bar.png") repeat-x fixed;
}
body.path-frontpage {
   background: white;
}
body.page-node-type-article-video,
body.page-node-type-gallery {
   background: #f4f4f4 url("../images/background-black.png") no-repeat fixed 0 0 / 100% 800px;
   /* background-size: 100% 800px; */
}
body.page-node-type-article-audio {
}
body.page-node-type-story {
   background: #f4f4f4;
}
.no-webp body.page-node-type-dossier {
   background: #f4f4f4 url("../images/background-tile.png") fixed;
}
.webp body.page-node-type-dossier {
   background: #f4f4f4 url("../images/background-tile.webp") fixed;
}

body.page-node-type-notanode,
body.path-popover,
body.page-node-type-author {
   background: white;
}

.no-webp body.path-type {
   background: #f4f4f4 url("../images/background-tile.png") fixed;
}
.webp body.path-type {
   background: #f4f4f4 url("../images/background-tile.webp") fixed;
}

body.path-webform {
   background: #f4f4f4 url("../images/background-bar.png") repeat-x fixed;
}

/* blogs */
body.path-user,
body.page-node-type-post {
   background: #f4f4f4 url("../images/background-bar.png") repeat-x fixed;
}

body.path-alias-actu,
body.path-alias-eglises, body.path-alias-communiques,
/*body.path-alias-blogs,*/
body.path-alias-tag-bernejurasoleure,
/*body.path-alias-deformes,*/
body.path-rootalias-eglisenumerique,
body.path-alias-user-login,
body.path-alias-user-password {
   background: white;
}

/*.main-container, */
.container-fluid {
   max-width: 1400px;
}

h1 {
   font-family: 'Playfair Display', serif;
   font-size: 2.75rem;
   font-weight: 700;
}
h1.page-title {
   margin-top: 0;
   border-bottom: 0 none;
}
h2 {
   font-size: 1.25rem;
   font-weight: 700;
} /* autres h2 spécifiques selon régions */

h3 {
   font-size: 1.15rem;
   font-weight: 500;
}
p {

}
ul {

}
ol {

}
a, a:visited {
   color: #337ab7;
   /* [transition-property] [transition-duration] [transition-timing-function] [transition-delay] */
   transition: all 0.2s ease-in-out 0s;
}
a:hover, a:focus {
   color: #00ADD3;
   text-decoration: underline;
}

.image-container {

}

.relative-container {
   position: relative;
}


/***************************************************/
/*
 *
 * layout (topbar)
 *
 */

#topbar {
   color: #d0d0d0;
   background-color: white;
   box-shadow: 0px 5px 10px black;
   padding-top: 15px;
   padding-bottom: 15px;
   margin-bottom: 2em;
   height: 50px;
   font-size: 0.75rem;
   font-weight: 700;
}
.path-frontpage #topbar,
.path-alias-actu #topbar,
.path-alias-communiques #topbar,
/*.path-alias-blogs #topbar,*/
.path-alias-tag-bernejurasoleure #topbar
/*.path-alias-deformes #topbar*/ {
   margin-bottom: 15px;
   box-shadow: none;
}

#topbar a {
   color: #a0a0a0;
}
#topbar a:hover {
   color: #404040;
   text-decoration: none;
}

.topbar-left {
}

.topbar-center {
   text-align: center;
   margin: -5px 0;
}
.topbar-center .logo {
   max-height: 30px;
   display: block;
   margin: 0 auto;
}
.topbar-center .logo-actu, .topbar-center .logo-communiques, .topbar-center .logo-blogs, .topbar-center .logo-beju,
.topbar-center .go-home-deformes, .topbar-center .logo-deformes {
   display: none;
}
.path-alias-actu .topbar-center .logo,
.path-alias-communiques .topbar-center .logo,
/*.path-alias-blogs .topbar-center .logo,*/
.path-alias-tag-bernejurasoleure .topbar-center .logo
/*body[class*=" path-alias-deformes"] .topbar-center .logo,
body[class*=" path-alias-deformes"] .topbar-center .go-home,
.path-rootalias-deformes .topbar-center .logo,
.path-rootalias-deformes .topbar-center .go-home*/ {
   display: none;
}
.path-alias-actu .topbar-center .logo-actu,
.path-alias-communiques .topbar-center .logo-communiques,
/*.path-alias-blogs .topbar-center .logo-blogs,*/ 
.path-alias-tag-bernejurasoleure .topbar-center .logo-beju {
   display: block;
   max-height: 55px; /* 52px + 5 parce que padding-bottom */
   padding: 0 10px 5px 10px;
   background: white;
   /*object-fit: cover;*/ /* conserve proportion image malgré resize déformant en faisant "déborder" l'image hors de sa zone visible */
}
/*body[class*=" path-alias-deformes"] .topbar-center .go-home-deformes {
   display: block;
}
body[class*=" path-alias-deformes"] .topbar-center .logo-deformes {
   display: block;
   max-height: 33px;
}*/

.topbar-right {
   text-align: right;
}
.topbar-right .block {
   float: right;
}


/***************************************************/
/*
 *
 * layout (menu)
 *
 */

/* boutons */

.menu-toggle, .menu-toggle span {
   cursor: hand;
}

#menu-toggle-open {
}

.menu-toggle-close {
   display: block;
   text-align: right;
   padding: 5px;
}

body.menu-open {
   overflow-y: hidden;
}

/* overlay */

#menu-overlay {
   display: none;
   width: 100%;
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: rgba(75,75,75,0.7);
   overflow-x: hidden;
   z-index: 600;
}
body.toolbar-fixed #menu-overlay {
   top: 39px;  /* +39 pour laisser la toolbar visible */
}
body.toolbar-fixed.toolbar-horizontal.toolbar-tray-open #menu-overlay {
   top: 79px;  /* +79 pour laisser la toolbar visible */
}

/* menu container */

.menu-container {
   position: relative;
   width: 270px;
   min-height: 100vh;
   background-color: #e0e0e0; /* devait être transparent, mais donne moche */
   border-right: solid 2px grey;
}
body.toolbar-fixed .menu-container {
   /*margin-bottom: -89px;*/
   /*? padding-bottom: 89px;*/
}
body.toolbar-fixed.toolbar-horizontal.toolbar-tray-open .menu-container {
   /*margin-bottom: -129px;*/
   /*? padding-bottom: 129px;*/
}

/* menus (.menu-container .region-menu-zone-1-4 nav ul.menu.nav, .region-menu-block-1) */

.menu-container /*.region-menu-block-1*/ .field--name-field-blink-title,
.menu-container /*.region-menu-zone-1-4*/ .dropdown-menu-nav {
   display: none;
}

.menu-container /*.region-menu-zone-1-4*/ .nav > li {
   border-top: solid 10px #00ADD3;
}
.menu-container /*.region-menu-zone-1-4*/ .nav > li > a {
   font-weight: 600;
   text-transform: uppercase;
   background-color: #808080cc;  /* transparence */
   border: solid 1px grey;
   color: white;
   padding: 15px;
}
.menu-container /*.region-menu-zone-1-4*/ .nav > li > a:hover,
.menu-container /*.region-menu-zone-1-4*/ .nav > li > a:focus {
   text-decoration: underline;
}

/* variantes de couleurs des cases du menu */

.menu-container .region-menu-zone-1 .nav > li {
   border-top: solid 10px #d0b400;
}
.menu-container .region-menu-zone-1 .nav > li > a {
   background-color: #d0b400cc;  /* transparence */
}

.menu-container .region-menu-zone-2 .nav > li {
   border-top: solid 10px #00ADD3;
}
.menu-container .region-menu-zone-2 .nav > li > a {
   background-color: #00ADD3cc;  /* transparence */
}

.menu-container .region-menu-zone-3 .nav > li {
   border-top: solid 10px #816f3d;
}
.menu-container .region-menu-zone-3 .nav > li > a {
   background-color: #816f3dcc;  /* transparence */
}

/* variantes sous-menus */

.menu-container /*.region-menu-zone-1-4*/ .dropdown-menu-nav {
   margin-left: 30px;
   border: solid 1px grey;
}
.menu-container /*.region-menu-zone-1-4*/ .dropdown-menu-nav > li {
   border-top: 0 none;
}
.menu-container /*.region-menu-zone-1-4*/ .dropdown-menu-nav > li > a {
   background-color: #d6d2c9cc;  /* transparence */
   border: 0 none;
   padding: 5px 5px 5px 15px;
}


/***************************************************/
/*
 *
 * layout (main page)
 *
 */

.region-header {
}
.region-header .page-title {
   display: none; /* default to not displaying title */
}
.page-node-type-notanode .region-header .page-title {
   display: block;
}
.path-frontpage .region-header .page-title,
.path-popover .region-header .page-title,
.path-webform .region-header .page-title,
.path-user .region-header .page-title {
   display: none;
}

.path-alias-user-login .region-header .page-title,
.path-alias-user-password .region-header .page-title {
   display: block;
}

/* content */

.region-content {
   line-height: 1.5;
}

.region-content article.full {
   background-color: white;
   padding: 10px;
   margin-bottom: 2em;
}
.region-content .user.full {
   background-color: white;
   padding: 10px;
   margin-bottom: 2em;
}
.region-content .post.full {
   /*margin-bottom: 0;*/
}

/* subcontent_1 */

.region-subcontent-1 {
   background-color: white;
   padding: 10px;
   margin-bottom: 2em;
}

.region-subcontent-1 .title-wrapper,
.region-subcontent-audiovideo .title-wrapper {
   display: table;
}

.region-subcontent-1 h2.block-title,
.region-subcontent-audiovideo h2.block-title,
.page-all-dossiers h2.block-title {
   font-family: 'Playfair Display', serif;
   font-size: 1.5rem;
   font-weight: 700;
   display: table-cell;
   padding-right: 10px;
   white-space: nowrap;
}

.region-subcontent-1 .filets,
.region-subcontent-audiovideo .filets,
.page-all-dossiers .filets {
   display: table-cell;
   width: 100%;
   vertical-align: bottom;
}

/* subcontent-audiovideo */

.region-subcontent-audiovideo {
   background-color: white;
   padding: 10px;
   margin-bottom: 2em;
}

.region-subcontent-audio .block-views-blockderniers-articles-block-4,
.region-subcontent-video .block-views-blockderniers-articles-block-5 {
   display: none;
}


.region-subcontent-audiovideo > section {
   margin-left: 3em;
   margin-right: 15px;
}

/* sidebar */

aside {
   font-weight: 600;
}

aside .block {
   margin-bottom: 0.5em;
}

aside h2.block-title {
   text-align: center;
   position: relative;
   margin-top: 10px;
   margin-bottom: 15px;
   padding-bottom: 15px;
}
aside h2.block-title:before {
   content : "";
   position: absolute;
   left    : 45%;
   bottom  : 0;
   height  : 2px;
   width   : 10%;
   border-bottom: 2px solid black;
}

aside .region {
   background-color: white;
   padding: 10px 15px;
   margin-bottom: 2em;
}

aside ol, aside ul {
   list-style-position: inside;
   padding-left: 0;
}
aside li > div {
   display: inline;
}

aside li {
   padding: 0.75em 0;
   border-bottom: solid 1px #95989a;
}

aside a, aside a:visited,
aside a:hover, aside a:focus {
   color: black;
   text-decoration: none;
}

aside .block-basic a, aside .block-basic a:visited {
   color: #337ab7;
}
aside .block-basic a:hover, .block-basic aside a:focus {
   color: #00ADD3;
   text-decoration: underline;
}


/***************************************************/
/*
 *
 * layout (footer)
 *
 */

#footer, #bottombar {
   background-color: #303030;
   padding: 1em 0 6em 0;

   font-size: 0.65rem;
   font-weight: 500;
   color: white;
   text-transform: uppercase;
}
#bottombar {
   margin-top: 0;
   padding: 0;

   color: #d0d0d0;
   text-transform: none;
   text-align: right;
   padding-right: 20px;
}

#footer h2, #bottombar h2 {
   font-size: 1.1rem;
   font-weight: 700;
}

#footer h3, #bottombar h3 {
   font-size: 1rem;
}

#footer .field--name-body a, #bottombar .field--name-body a {
   color: white;
}

#footer .region-footer-title-1 h2,
#footer .region-footer-title-2 h2,
#footer .region-footer-title-3 h2 {
   font-size: 0.8rem;
   font-weight: normal;
   text-align: center;
   margin-bottom: 0;
   background-color: #606060;
   
   display: none; /* c'est moche dixit S.*/
}


/***************************************************/
/*
 *
 * layout (print)
 *
 */

.print-header {
   display: none;
   text-align: center;
   width: 100%;
   margin-bottom: 10px;
}
.print-header img {
   max-height: 40px;
}


/***************************************************/
/*
 *
 * layout (homepage) (/)
 *
 */

.home-wrapper .w-title {
   font-size: 2rem;
   font-weight: 500;
   color: grey;
}

/* topmenu */

.no-webp #home-topmenu-wrapper {
   background: #e4e0d7 url("../images/background-tile.png") fixed;    /* full-width bg */
}
.webp #home-topmenu-wrapper {
   background: #e4e0d7 url("../images/background-tile.webp") fixed;    /* full-width bg */
}

#home-topmenu-wrapper .data-container {
   /*background: #e4e0d7;*/   /* content-width bg */
}

.region-topmenu {
}

#block-topmenu {
}

#block-topmenu .nav {
}

#block-topmenu .nav li {
   width: 20%;
   padding: 10px 20px 10px 20px;
   float: left;
}
#block-topmenu .nav li a {
   padding: 5px;
   /*font-variant: small-caps;*/
   text-transform: uppercase; /*capitalize;*/
   color: #00ADD3;
   font-weight: 600;
   white-space: nowrap;
}
#block-topmenu .nav li a:hover {
   color: #337ab7;
   background-color: transparent;
}
#block-topmenu .nav li a::first-letter {
   border-bottom: solid 1px #00ADD3;
}

/* banner */

#home-banner-wrapper {
   background: #f0f0f0;
}

#home-banner-wrapper .data-container {
   max-width: 1600px;
}

/* subbanner (journal, actu, eglises) */

#home-subbanner-wrapper {
   margin: 1em 0;
}

#home-subbanner-wrapper .w-surtitle,
#home2-col-wrapper .w-surtitle {
   font-size: 0.75rem;
   font-weight: 500;
   color: #00ADD3;
   font-variant: small-caps;
   margin-bottom: -10px;
}

#home-subbanner-wrapper .w-title,
#home2-col-wrapper .w-title,
body.path-alias-actu .region-home2-col2 h2.block-title {
   font-size: 1.5rem;
   font-weight: 600;
   font-variant: small-caps;
   color: #00ADD3;
   
   /*border-bottom: solid 13px #00ADD3;*/  /* image hachurée via :after */
   position: relative;
   padding-bottom: 13px;
}
#home-subbanner-wrapper .w-title a, #home-subbanner-wrapper .w-title a:hover,
#home2-col-wrapper .w-title a, #home2-col-wrapper .w-title a:hover {
   color: #00ADD3;
   text-decoration: none;
}
#home-subbanner-wrapper .w-title:after,
#home2-col-wrapper .w-title:after,
body.path-alias-actu .region-home2-col2 h2.block-title:after {
   content: "";
   position: absolute;
   bottom: 0;
   left: 0;
   height: 13px;
   width: 100%;
}
.no-webp #home-subbanner-wrapper .w-title:after,
.no-webp #home2-col-wrapper .w-title:after,
.no-webp body.path-alias-actu .region-home2-col2 h2.block-title:after {
   background: transparent url("../images/background-title-bar.png") repeat-x;
}
.webp #home-subbanner-wrapper .w-title:after,
.webp #home2-col-wrapper .w-title:after,
.webp body.path-alias-actu .region-home2-col2 h2.block-title:after {
   background: transparent url("../images/background-title-bar.webp") repeat-x;
}

#home-subbanner-journal-wrapper {
   border: solid 1px grey;
   padding: 5px 10px 10px 10px;
}

#home-subbanner-actu-wrapper {
   border: solid 1px grey;
   padding: 5px 10px 10px 10px;
}

#home-subbanner-eglises-wrapper {
   background: #e4e0d7;
   padding: 5px 10px 10px 10px;
}

/* publicité en home */

#home-ads-wrapper {
   margin: 1em 0;
}

.region-home-ads .view-content .views-row {
    margin-bottom: 15px;
}
.region-home-ads .view-content .views-row:last-child {
    margin-bottom: 0;
}

/* videos */

#home-video-wrapper {
   background: #303030;
   padding: 2em 0;
}

#home-video-wrapper .w-title {
   color: white;
}

#home-video-wrapper .data-container {
   /*background: #303030;*/   /* content-width bg */
}

#home-video-big-wrapper {
}

#home-video-mini-wrapper {
}

#home-video-wrapper .youtube img {
   display: inline;
   max-width: 100px;
   bottom: 2px;
   position: relative;
}

/* edito/blogs */

#home-edito-wrapper {
   margin: 1em 0;
   /*padding: 1.5em 0 2em 0;*/
}
/*
.no-webp #home-edito-wrapper {
   background: #e4e0d7 url("../images/background-tile.png") fixed;
}
.webp #home-edito-wrapper {
   background: #e4e0d7 url("../images/background-tile.webp") fixed;
}
*/

/* nouvelles plateformes */

#home-plateformes-wrapper {
   padding: 1em 0 2.5em 0;
}
.no-webp #home-plateformes-wrapper {
   background: #e4e0d7 url("../images/background-tile.png") fixed;    /* full-width bg */
}
.webp #home-plateformes-wrapper {
   background: #e4e0d7 url("../images/background-tile.webp") fixed;    /* full-width bg */
}

/* spiritualites */

#home-spiritualites-wrapper {
   /*margin: 1em 0;*/
   padding: 1em 0 2.5em 0;
}
.no-webp #home-spiritualites-wrapper {
   background: #e4e0d7 url("../images/background-tile.png") fixed;    /* full-width bg */
}
.webp #home-spiritualites-wrapper {
   background: #e4e0d7 url("../images/background-tile.webp") fixed;    /* full-width bg */
}

.region-home-more-2 {
   background: #b4aaa8;
   border: solid 1px grey;
   margin-bottom: 15px;
}

.region-home-more-3 {
   background: #00ADD3;
   border: solid 1px grey;
}

/* idée: regrouper les styles des blocs de liens (home-more-1 et évent. menu) sous une section BLOCS DE LIENS : mode/région XX, mode YY */

.block-bloc-lien.home-big {
   overflow: hidden;
}

.block-bloc-lien.home-big .right {
   padding: 0 25px 5px 5px;
   height: 50px; /* bidon, height sera forcé par l'image à gauche */
}

.block-bloc-lien.home-big .field--name-field-blink-title {
   font-family: 'Playfair Display', serif;
   font-size: 1.25rem;
   line-height: 1.1;
   font-weight: 700;
   color: black;
   margin: 0.3em 0 0.3em 0;
}

.block-bloc-lien.home-big  .field--name-field-bsubtitle {
   color: black;
   font-size: 1rem;
   font-weight: 500;
   line-height: 1.4rem;
}

/* vu ailleurs */

#home-more-wrapper {
   padding: 1.5em 0 2em 0;
   background: #707070;
   color: white;
}

#home-more-wrapper .w-title {
   color: white;
}

/* dossier */

#home-dossier-wrapper {
   padding: 1.5em 0;
}
.no-webp #home-dossier-wrapper {
   background: #e4e0d7 url("../images/background-tile.png") fixed;    /* full-width bg */
}
.webp #home-dossier-wrapper {
   background: #e4e0d7 url("../images/background-tile.webp") fixed;    /* full-width bg */
}

#home-dossier-wrapper .data-container {
}

#home-dossier-wrapper .row {
   margin-bottom: 8px;
}

#home-dossier-big-wrapper {
}

#home-dossier-mini-wrapper {
}

/* cats */

#home-cats-wrapper {
   margin: 1em 0 0 0;
}

#home-cats-wrapper .data-container {
}

/* archives */

#home-archives-wrapper {
   background: #707070;
   padding: 1em 0;
   color: white;
}

#home-archives-wrapper .w-title {
   color: white;
}


/***************************************************/
/*
 *
 * layout (home niveau 2)
 *
 */

/* === w-title */
.home2-wrapper .block-title {
   font-size: 2rem;
   font-weight: 500;
   color: grey;
}

#home2-banner-wrapper {
   /*background: #f0f0f0;*/
   padding-top: 35px;
}
.no-webp #home2-banner-wrapper {
   background: #e4e0d7 url("../images/background-tile.png") scroll;    /* full-width bg */
}
.webp #home2-banner-wrapper {
   background: #e4e0d7 url("../images/background-tile.webp") scroll;    /* full-width bg */
}

#home2-banner-wrapper .data-container {
   /*max-width: 1600px;*/
}

/*body.path-alias-blogs #home2-banner-wrapper {
   min-height: 50px;
}*/

#home2-banner1-wrapper {
}

#home2-banner2-wrapper {
}

OFF_body.path-alias-blogs #home2-banner1-wrapper .block-basic img {
   /* normalement 1012 x 580, ici on a des images libres => approximer ça */
   width: 100%;
   max-height: 580px;
   object-fit: cover;   /* conserve proportion image malgré resize déformant en faisant "déborder" l'image hors de sa zone visible */
}
OFF_body.path-alias-blogs #home2-banner2-wrapper .block-basic {
   text-align: justify;
}

/* colonnes */

#home2-col-wrapper {
   margin: 1em 0;
}
 .home2-col-wrapper-single {
 }
 .home2-col-wrapper-multiple {
 }
#home2-col-wrapper .data-container {
   position: relative;
}

/* colonnes sur /eglises (ie /communiques) */

body.path-alias-communiques #home2-col1-wrapper,
body.path-alias-communiques #home2-col2-wrapper, 
body.path-alias-communiques #home2-col3-wrapper {
   border: solid 1px #95989a;
   background-color: white;
   padding: 10px;
}

body.path-alias-communiques #home2-col-wrapper .block-aggregator {
   margin-top: 15px;
   height: 29rem;
   overflow-x: hidden;
   overflow-y: auto;
}
body.path-alias-communiques #home2-col-wrapper .block-aggregator > ul li {
   list-style: none;
   margin: 0 5px 0.75rem -1em;
   padding-bottom: 1.5rem;
   border-bottom: solid 1px grey;
}
body.path-alias-communiques #home2-col-wrapper .block-aggregator > ul li .source {
   color: #00ADD3;
   font-size: 0.9rem;
   font-weight: 700;
   text-transform: uppercase;
}
body.path-alias-communiques #home2-col-wrapper .block-aggregator > ul li a {
   color: black;
   font-family: 'Fira Sans', sans-serif;  /* TODO: Lato 24 */
   font-size: 0.9rem;
}

/* colonne principale lorsque seule sur /actu (#home2-col2-wrapper ou .region-home2-col2 ) */

body.path-alias-actu #home2-col-wrapper {
   margin: 1em 0 2em 0;
}

/*body.path-alias-actu #home2-col2-wrapper .block {
   border: solid 1px grey;
   padding: 5px 10px 10px 10px;
}*/

/* slider colonnes sur /actu */

body.path-alias-actu .region-home2-col2 > div:nth-child(n+4) /* > .actu-slide */ {
  display:none;
}
.arrow {
   position: absolute;
   top: 50%;
   font-size: 2rem;
   cursor: pointer;
}
.arrow-left {
   left: 0rem;
}
.arrow-right {
   right: 0rem;
}
.arrow-disabled {
   opacity: 0.2;
}
.arrow:hover {
   transition: transform 0.5s;   /* define duration for 'transform' property modifications */
   transform: scale(1.2);
}

/* colonne sur /deformes */

/*body.path-alias-deformes #home2-col-wrapper {
   margin: 1em 0 1.5em 0;
}
body.path-alias-deformes #home2-col-wrapper h2.block-title {
   margin-top: 1px;
}*/

/* contenus */

#home2-content1-wrapper {
   margin: 1em 0;
   padding-bottom: 1.5em;
}
.no-webp #home2-content1-wrapper {
   background: #e4e0d7 url("../images/background-tile.png") fixed;    /* full-width bg */
}
.webp #home2-content1-wrapper {
   background: #e4e0d7 url("../images/background-tile.webp") fixed;    /* full-width bg */
}
#home2-content1-wrapper .data-container {
   /*background: #e4e0d7;*/   /* content-width bg */
}

/*body.path-alias-blogs #home2-content1-wrapper {
   min-height: 100px;
}*/

/*body.path-alias-blogs #home2-content1-wrapper .block-basic {
   margin-top: 2em;
   column-count: 2;
}*/

#home2-content2-wrapper {
   margin: 1em 0;
}


/***************************************************/
/*
 * Pages spéciales "Eglise numérique (SPN)" + sous-pages
 * (quasi une sous-home, mais ne défini pas de zones, 
 *  par contre change bcp le look :-( )
 *
 * https://www.reformes.ch/eglisenumerique (la page originale 2022)
 * https://www.reformes.ch/eglisenumerique/concours (le form)
 * https://www.reformes.ch/eglisenumerique/annonce-concours (archive de la page originale)
 * https://www.reformes.ch/eglisenumerique (les résultats 2023)
 */

/* éléments généraux */

body.path-rootalias-eglisenumerique {
   font-family: 'Lato', sans-serif;
   font-weight: 400;
   font-size: 0.9rem;  /* 30 */
}

body.path-rootalias-eglisenumerique .region-content article.page.full {
   padding-top: 0;
}

.spn-row {
   padding: 15px 65px 15px 65px;
   margin-bottom: 25px;
}

body.path-rootalias-eglisenumerique .spn-btn, 
body.path-rootalias-eglisenumerique .spn-picto .spn-label {
   font-family: 'Montserrat', sans-serif;
   font-weight: 600;
   font-size: 1.2rem;
}
body.path-rootalias-eglisenumerique .spn-btn {
   font-size: 1.1rem;
   color: white;
   background-color: #db244c;
   padding: 13px 20px;
   border-radius: 15px;
   box-shadow: 5px 5px 10px #303030;
}

body.path-rootalias-eglisenumerique h1,
body.path-rootalias-eglisenumerique h2 {
   font-family: 'Lato', sans-serif;
   font-weight: 900;
   font-size: 2.75rem;
}
body.path-rootalias-eglisenumerique h2 {
   font-size: 2rem;
}

body.path-rootalias-eglisenumerique aside h2 {
   font-size: 1.5rem;
   color: white;
}

body.path-rootalias-eglisenumerique aside > .region {
   background: rgb(212,20,90);
   background: linear-gradient(90deg, rgba(212,20,90,1) 0%, rgba(241,90,36,1) 100%);
   color: white;
   padding: 10px 35px 20px 35px;
}

body.path-rootalias-eglisenumerique .spn-image {
   max-width: 100%;
   height: auto;
}

body.path-rootalias-eglisenumerique h1.page-title,  
body.path-rootalias-eglisenumerique #footer,
body.path-rootalias-eglisenumerique .image-container:hover .photocredit-wrapper {
   display: none;
}

/* form concours (https://www.reformes.ch/eglisenumerique/concours) */

body.path-alias-eglisenumerique-concours h1.page-title {
    display: block;
}

body.path-alias-eglisenumerique-concours .region-content article.page.full {
   border: solid 12px rgb(212,20,90);
}


/* colonne latérale */

/* ... */


/* éléments spécifiques à la page */

.spn-banner {
   background: rgb(212,20,90);
   background: linear-gradient(90deg, rgba(212,20,90,1) 0%, rgba(241,90,36,1) 100%);
}

.spn-banner .spn-content {
   text-align: center;
}

.spn-banner .spn-title {
   margin: 50px 0 30px 0;
   text-align: left;
   
   white-space: nowrap;
}

.spn-banner .spn-text {
   margin: 30px 0px;
   text-align: left;
   font-size: 1.25rem;
}

.spn-banner .spn-btn {
   margin: 10px 0 30px 0;
   display: inline-block;
   background-color: #94d3dc !important;
}

.spn-banner .spn-image {
}

/* *** */

.spn-subbanner {
   font-weight: 700;
}

.spn-subbanner .spn-text {
}

.spn-subbanner .spn-title {
   font-size: 1.4rem;
   line-height: 1;
   margin-top: 20px;
   
   padding-left: 50px;
}

/*.spn-subbanner*/ .spn-title-alt {
   font-size: 2rem;
   margin-bottom: 30px;
}

.spn-subbanner .spn-image {
   text-align: center;
   
   padding-left: 50px;
}

/* *** FORMAT *** */

.spn-format {
   background-color: #f0f0f0;
   padding-top: 45px;
   padding-bottom: 45px;
   margin-bottom: 0;
}
.spn-format-2 {
   background-color: white;
}

/* *** FORMAT : pictos *** */

.spn-format .spn-pictos {
}

.spn-format .spn-picto {
   position: relative;
   display: inline-block;
}
.spn-format .spn-picto .spn-image {
}
.spn-format .spn-picto .spn-label {
   position: absolute;
   top: 0;
   left: 0;
   padding: 10px 25px;
   color: white;
   min-width: 60%;
   background-color: #e55622;
}
.spn-format .spn-picto .spn-link {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 100px;
}

.spn-format .spn-picto-small {
}
.spn-format .spn-picto-small .spn-label {
   font-size: 0.6rem !important;
   padding: 3px 6px;
   min-width: 75%;
}
.spn-format .spn-picto-small .spn-link {
   width: 50px;
}
.spn-format .spn-picto-2 {
   margin-bottom: 30px;
}

/* *** FORMAT : contenu *** */

.spn-format .spn-content {

   padding-left: 65px;  /* 15 normal de la colonne + 50 */
}

.spn-format .spn-content .row {
   margin-bottom: 20px;
}

.spn-format .spn-content h2.spn-title {
   color: #909090;
   margin-top: 0;
}

.spn-format .spn-content .spn-image {
}
.spn-format .spn-content .spn-name {
   font-size: 1.6rem;
   border-bottom: solid 7px #97d6e0;
   float: left;   /* so that bottom border has just text length */
}

.spn-format .spn-content .spn-label {
   font-weight: 700;
   margin-bottom: 20px;
   text-transform: uppercase;
}
.spn-format .spn-content .spn-label.spn-first {
   text-transform: none;
}
.spn-format .spn-content .spn-text {
}

/* petits différences entre formats 1 2 3 */

.spn-format-2 .spn-picto .spn-label {
   background-color: #fecd00;
}
.spn-format-3 .spn-picto .spn-label {
   background-color: #db244c;
}

.spn-format-2 .spn-content .spn-name {
   border-color: #fecd00;
}
.spn-format-3 .spn-content .spn-name {
   border-color: #0098b3;
}

/* *** Lauréats *** */

.spn-format .spn-video .spn-name {
   font-size: 1.6rem;
   border-bottom: solid 7px #fecd00;
   float: left;   /* so that bottom border has just text length */
}

.spn-format .spn-gps .spn-name {
   border-color: #0098b3;
}

.spn-format .spn-video .spn-label {
   font-weight: 700;
   clear: both;
}

.spn-center {
   text-align: center;
}

/* *** */

.spn-bottom {
   background-color: #06afbc;
   text-align: center;
}

.spn-bottom .spn-content {
   padding: 5px;
}

.spn-bottom .spn-btn {
   background-color: #db244c !important;
}

/* *** */

.spn-footer {
}

.spn-footer a {
   color: black;
   font-weight: 700;
}

.spn-footer .spn-text {
   font-size: 0.75rem;
}

.spn-footer .spn-title {
   font-weight: 700;
}

/* xs only */
@media (max-width: 767px) {
   .spn-row {
      padding: initial;
   }
   .spn-banner .spn-title {
      margin-top: 15px;
      margin-bottom: 15px;
   }
   .spn-banner .spn-text {
      margin-top: 20px;
      margin-bottom: 20px;
   }
   .spn-banner .spn-image {
      margin-bottom: 15px;
   }
   .spn-subbanner .spn-title,
   .spn-subbanner .spn-image,
   .spn-format .spn-content {
      padding-left: 15px;
   }
   .spn-format .spn-picto {
      margin-top: 15px;
   }
   .spn-bottom .spn-content {
      padding: 23px;
   }
}


/***************************************************/
/*
 *
 * articles
 *
 */

/***************************************************/
/* display-mode : full => .full
 */

.article.full .image-container {
}
.article.full .video-container .field--name-field-image {
   display: none;
}
.article.full .field--name-field-image img {
   width: 100%;
}
.article.full .field--name-field-videoembed {
   background-color: #505050;
}

.article.full .field--name-field-category {
   font-weight: 700;
   position: absolute;
   bottom: 0;
   left: 3em;
   text-transform: uppercase;
   background-color: #00ADD3;
   padding: 5px 15px;
}
.article.full .field--name-field-category a {
   color: white;
}
.article.full .video-container .field--name-field-category {
   position: unset;
   display: inline-block;
   margin-left: 3em;
}

.article.full > .content {
   margin: 0 15px 0 3em;
}

.article.full .field--name-field-soundembed {
   width: 100%;
   bottom: 0;
   position: absolute;
   background-color: #f5f5f5;
}

.article.full .field--name-field-subtitle {
   font-family: 'Playfair Display', serif;
   font-size: 1.5rem;
   text-align: right;
   margin-bottom: 20px;
   margin-top: -10px;
}

.article.full .source-date {
   margin: 1em 0;
   display: table;
   text-transform: uppercase;
   font-size: 0.75rem;
   font-weight: 600;
}
.article.full .source-date > div {
   padding: 0 0.5em;
   border-left: solid 1px #95989a;
   display: table-cell;
   vertical-align: middle;
}
.article.full .source-date > div:first-child {
   border-left: none;
   padding-left: 0;
}
.article.full .source-date .field--name-field-ref-source {
   font-weight: 700;
}
.article.full .source-date .field--name-field-ref-author a {
   color: black;
}
.article.full .source-date .date {
}

.article.full .keyword-chapeau {
   margin: 1.5em 0.5em 1.5em 0;
   font-weight: 600;
   font-size: 1.25rem;
}
.article.full .field--name-field-keyword {
   float: left;
   margin-right: 5px;
   text-transform: uppercase;
   font-weight: 700;
}

.article.full .field--name-field-paragraphs {
}
.article.full .field--name-field-paragraphs::after {
   clear: both;
   content: "";
   display: table;
}

.article.full .field--name-field-tags {
   margin: 2em 0 0.5em 0;
}

/***************************************************/
/* display-mode : listing => .listing
 * (aussi pour story, dossier, gallery, comm)
 */

.node.listing {
}

.node.listing .image-container {
}
.node.listing .image-container .fa {
   /* defaults */
}
.node.listing .field--name-field-image img {
   width: 100%;
}
.node.listing .paragraph {
   margin-bottom: 0;
}

.node.listing .field--name-field-category,
.node.comm.listing .field--name-field-subtitle {
   color: white;
   font-weight: 700;
   position: absolute;
   bottom: 0;
   left: 2em;
   text-transform: uppercase;
   color: white;
   background-color: #00ADD3;
   padding: 5px 15px;
}
.node.listing .field--name-field-category a {
   color: white;
}

.node.listing .title {
   font-family: 'Playfair Display', serif;
   font-size: 1.5rem;
   font-weight: 700;
   color: black;
}

.node.listing .source-date {
   font-size: 0.75rem;
   font-weight: 600;
   margin: 0.5em 0;
   display: table;
   text-transform: uppercase;
}
.node.listing .source-date > div {
   padding: 0 0.5em;
   border-left: solid 1px #95989a;
   display: table-cell;
   vertical-align: middle;
}
.node.listing .source-date > div:first-child {
   border-left: none;
   padding-left: 0;
}
.node.listing .source-date .field--name-field-ref-source a,
.node.listing .source-date .field--name-field-photographer a,
.node.listing .source-date .field--name-field-ref-author a {
   color: black;
}
.node.listing .source-date .date {
}

.node.listing .keyword-accroche {
   margin: 1.5em 0.5em 1.5em 0;
   color: black;
}
.node.listing .field--name-field-keyword {
   float: left;
   margin-right: 5px;
   text-transform: uppercase;
}

/***************************************************/
/* display-mode : listing_alt => .listing-alt
 * (ÿss 畈翴ur story et post, mais pas dossier)
 */

.node.listing-alt {
   margin-top: 1em;
   /*margin-bottom: 1em;*/
}

.node.listing-alt .image-container .fa {
   left: 20px;
   font-size: 1.5rem;
}

.node.listing-alt .title {
   font-family: 'Playfair Display', serif;
   font-weight: 700;
   font-size: 1.25rem;
   line-height: 1.4;
   color: black;
   left: -15px;
   position: relative;
   display: block;
}

.node.listing-alt .keyword-accroche {
   margin: 1em 0;
}

.node.listing-alt .accroche {
   color: black;
   text-decoration: none;
}

.node.listing-alt .field--name-field-category,
.node.listing-alt .field--name-field-keyword {
   display: inline;
   font-weight: 700;
   text-transform: uppercase;
}
.node.listing-alt .field--name-field-category a,
.node.listing-alt .field--name-field-keyword a {
   color: #00ADD3;
}

.node.listing-alt .accroche,
.node.listing-alt .accroche > div { /* field inconnu: accroche ou chapeau */
   display: inline;
}

/***************************************************/
/* display-mode : sidebar => .sidebar
 * (aussi pour dossiers)
 */

.sidebar {
   position: relative;
}

.sidebar .cornered {
   height: 0;
   border-bottom: 30px solid #e4e0d7;
   border-right: 30px solid transparent;
}

.sidebar .content {
   background-color: #e4e0d7;
   padding: 15px 30px 20px 15px;
}

.dossier.sidebar {
   margin-bottom: 15px;
}
.view-content .views-row:last-child .dossier.sidebar {
   margin-bottom: 0;
}

.publicite.sidebar .content {
   padding: 0;
}

.sidebar .field--name-field-keyword {
   font-weight: 700;
   text-transform: uppercase;
   position: absolute;
   top: 15px;  /* remonte dans le cornered */
}

.sidebar .title {
   font-family: 'Fira Sans', sans-serif;
   font-size: 1.7rem;
   font-weight: 700;
   line-height: 1.1;
   position: absolute;
   left: 5px;
   right: 5px;
   top: 15%;
   bottom: 5px;
   overflow: hidden;
   text-align: right;
   color: white;
   text-shadow: 2px 2px 5px black;
}

.sidebar .img-responsive {
   width: 100%;
}

.page-node-type-story .sidebar {
   /* quelques spécificités lorsque affiché sur story, mais que en LG  */
}

/***************************************************/
/* display-mode : sidebar_listing => .sidebar-listing
 * (aussi pour story et dossier)
 */

.sidebar-listing {
}

.sidebar-listing .title {
   font-size: 0.9rem;
   font-weight: 600;
   line-height: 1;
   display: block;
}

.sidebar-listing .source-date {
   font-size: 0.6rem;
   /*position: relative;
   top: -5px;*/
   text-transform: uppercase;
}
.sidebar-listing .source-date .par {
   color: #95989a;
   margin-right: 5px;
}
.sidebar-listing .source-date .field--name-field-ref-source {
   display: inline;
}
.sidebar-listing .source-date .field--name-field-ref-source a {
   color: black;
}

.view-articles-similaires.view-display-id-block_1 .view-content .views-row {
   border-bottom: solid 1px #95989a;
   margin-top: 1em;
   margin-bottom: 1em;
   padding-bottom: 10px;
}
.view-articles-similaires.view-display-id-block_1 .view-content .views-row:first-child {
   margin-top: 2em;
}
.view-articles-similaires.view-display-id-block_1 .view-content .views-row:last-child {
   border-bottom: 0 none;
   margin-bottom: 0;
}

/***************************************************/
/* display-mode : indossier_listing => .indossier-listing
 * (aussi pour story)
 */

.indossier-listing {
   border-top: solid 2px #00ADD3;
   padding-top: 15px;
   /*margin-top: 1em;*/
   /*border-bottom: solid 2px #00ADD3;*/
   /*margin-bottom: 1em;*/
   position: relative;
}

.indossier-listing:hover {
   background-color: rgba(255, 255, 255, 0.2);
}

.indossier-listing .field--name-field-image {
   border-bottom: solid 10px #00ADD3;
}

.indossier-listing .image-container .fa {
   left: 20px;
   font-size: 1.5rem;
}

.indossier-listing .title {
   font-family: 'Playfair Display', serif;
   font-size: 1.25rem;
   font-weight: 700;
   color: black;
   display: block;
   line-height: 1.3;
}

.indossier-listing .keyword-accroche {
   margin: 1em 0;
}

.indossier-listing .number {
   display: inline;
   font-weight: 700;
   text-transform: uppercase;
   color: #00ADD3;
}

.indossier-listing .accroche,
.indossier-listing .accroche > div { /* field inconnu: accroche ou chapeau */
   display: inline;
   color: black;
   text-decoration: none;
}


/***************************************************/
/* display-mode : home_banner => .home-banner (ou aussi via .region-home-banner)
 * display-mode : home2-banner => .home2-banner
 */

.home-banner .field--name-field-image,
.home-banner .field--name-field-banner,
.home2-banner .field--name-field-image,
.home2-subbanner .field--name-field-image {
   overflow: hidden;
}

.home-banner .field--name-field-image a:hover img,
.home-banner .field--name-field-banner a:hover img,
.home-banner a:hover .field--name-field-image img,
.home-banner a:hover .field--name-field-pphoto img,
.home-banner a:hover .field--name-field-banner img,
.home2-banner .field--name-field-image a:hover img {
   transform: scale(1.04);
   transition: transform 0.5s;
}

.home-banner .title-subtitle,
.home2-banner .title-subtitle,
.home2-subbanner .title-subtitle {
   position: absolute;
   /*top: 60%;*/
   bottom: 15%;
   max-height: 85%;
   left: 0;
   color: white;
   background-color: rgba(0,173,211,0.4);
   padding: 2em 3em 1.5em 1.5em;
   text-transform: uppercase;
}
.home-banner .colombe,
.home2-banner .colombe {
   position: absolute;
   right: -30px;
   top: -60px;
   width: 110px;
}
.home2-banner .colombe-rouge {
    display: none;
}
.home-banner .title-subtitle a,
.home2-banner .title-subtitle a,
.home2-subbanner .title-subtitle a {
   color: white;
   text-decoration: none;
}
.home-banner .title,
.home2-banner .title,
.home2-subbanner .title {
   font-family: 'Playfair Display', serif;
   font-size: 3.2rem;
   font-weight: 700;
   line-height: 1.1;
}
.home-banner .field--name-field-subtitle,
.home2-banner  .field--name-field-subtitle {
   font-size: 2rem;
}

/***************************************************/
/* display-mode : home_subbanner => .home-subbanner (ou aussi via .region-home-subbanner[-journal/-eglises])
 * (aussi pour comm et shortcomm)
 */

.region-home-subbanner > div,
.region-home-subbanner-journal > div,
.path-alias-actu .region-home2-col2 .views-row {
   border-top: solid 1px #95989a;
   margin: 10px 0;
   padding-top: 10px;
}
.region-home-subbanner > div:first-child,
.region-home-subbanner-journal > div:first-child,
.path-alias-actu .region-home2-col2 .views-row:first-child {
   border-top: 0 none;
   margin-top: 0;
   padding-top: 0;
}

.home-subbanner {
   /*border-top: solid 5px #00ADD3;*/
}

.home-subbanner .image-container {
   margin-bottom: 15px;
}

.home-subbanner .field--name-field-category {
   font-size: 0.75rem;
   font-weight: 500;
   text-transform: uppercase;
}
.home-subbanner .field--name-field-category a {
   color: black;
}

.home-subbanner .title a {
   font-family: 'Playfair Display', serif;
   font-size: 1.3rem;
   font-weight: 700;
   line-height: 1;
   color: black;
   text-decoration: none;
   display: block;
   margin-bottom: 5px;
}
.home-subbanner .title a .field {
   display: inline;
}

.home-subbanner .keyword-accroche {
   color: black;
   text-decoration: none;
   font-size: 0.75rem;
   font-weight: 500;
}

.home-subbanner .field--name-field-keyword {
   float: left;
   margin-right: 5px;
   font-weight: 700;
   text-transform: uppercase;
}

.home-subbanner .source-date {
   text-transform: uppercase;
   font-size: 0.65rem;
   font-weight: 600;
   /*margin-top: 5px;*/
   float: right;
}
.home-subbanner .source-date-2 {
   margin-top: 10px;
}
.home-subbanner .source-date .par {
   color: #95989a;
   margin-right: 5px;
}
.home-subbanner .source-date .field--name-field-ref-author,
.home-subbanner .source-date .field--name-field-ref-author .field--item,
.home-subbanner .source-date .field--name-field-author-alt {
   display: inline;
}
.home-subbanner .source-date .field--name-field-ref-author .field--item:before {
   content: ', ';
}
.home-subbanner .source-date .field--name-field-ref-author .field--item:first-child:before {
   content: '';
}
.home-subbanner .source-date .field--name-field-ref-author a {
   color: black;
}
.home-subbanner .source-date .date {
   float: right;
}

/* variations entre 1er et suivants (home: colonnes journal et actu, /actu: colonnes par tag) */
/* suivants masquent certains elements */
.region-home-subbanner > div .image-container,
.region-home-subbanner-journal > div .image-container,
.path-alias-actu .region-home2-col2 .views-row .image-container,

.region-home-subbanner > div .field--name-field-category,
.region-home-subbanner-journal > div .field--name-field-category,
.path-alias-actu .region-home2-col2 .views-row .field--name-field-category,

.region-home-subbanner > div .source-date-1 .date,
.region-home-subbanner-journal > div .source-date-1 .date,
.path-alias-actu .region-home2-col2 .views-row .source-date-1 .date,

.region-home-subbanner > div .source-date-1 .par,
.region-home-subbanner-journal > div .source-date-1 .par,
.path-alias-actu .region-home2-col2 .views-row .source-date-1 .par,

.region-home-subbanner > div .source-date-1 .field--name-field-ref-author,
.region-home-subbanner-journal > div .source-date-1 .field--name-field-ref-author,
.path-alias-actu .region-home2-col2 .views-row .source-date-1 .field--name-field-ref-author,
.region-home-subbanner > div .source-date-1 .field--name-field-author-alt,
.region-home-subbanner-journal > div .source-date-1 .field--name-field-author-alt,
.path-alias-actu .region-home2-col2 .views-row .source-date-1 .field--name-field-author-alt,

.region-home-subbanner > div .keyword-accroche,
.region-home-subbanner-journal > div .keyword-accroche,
.path-alias-actu .region-home2-col2 .views-row .keyword-accroche,

.region-home-subbanner > div .source-date-2 .par,
.region-home-subbanner-journal > div .source-date-2 .par,
.path-alias-actu .region-home2-col2 .views-row .source-date-2 .par,

.region-home-subbanner > div .source-date-2 .field--name-field-ref-author,
.region-home-subbanner-journal > div .source-date-2 .field--name-field-ref-author,
.path-alias-actu .region-home2-col2 .views-row .source-date-2 .field--name-field-ref-author,
.region-home-subbanner > div .source-date-2 .field--name-field-author-alt,
.region-home-subbanner-journal > div .source-date-2 .field--name-field-author-alt,
.path-alias-actu .region-home2-col2 .views-row .source-date-2 .field--name-field-author-alt
{
   display: none;
}
/* 1er re-affiche et masque certains elements */
.region-home-subbanner > div:first-child .image-container,
.region-home-subbanner-journal > div:first-child .image-container,
.path-alias-actu .region-home2-col2 .views-row:first-child .image-container,

.region-home-subbanner > div:first-child .field--name-field-category,
.region-home-subbanner-journal > div:first-child .field--name-field-category,
.path-alias-actu .region-home2-col2 .views-row:first-child .field--name-field-category,

.region-home-subbanner > div:first-child .keyword-accroche,
.region-home-subbanner-journal > div:first-child .keyword-accroche,
.path-alias-actu .region-home2-col2 .views-row:first-child .keyword-accroche
{
   display: block;
}
.region-home-subbanner > div:first-child .source-date-1 .date,
.region-home-subbanner-journal > div:first-child .source-date-1 .date,
.path-alias-actu .region-home2-col2 .views-row:first-child .source-date-1 .date,

.region-home-subbanner > div:first-child .source-date-2 .par,
.region-home-subbanner-journal > div:first-child .source-date-2 .par,
.path-alias-actu .region-home2-col2 .views-row:first-child .source-date-2 .par,

.region-home-subbanner > div:first-child .source-date-2 .field--name-field-ref-author,
.region-home-subbanner-journal > div:first-child .source-date-2 .field--name-field-ref-author,
.path-alias-actu .region-home2-col2 .views-row:first-child .source-date-2 .field--name-field-ref-author,
.region-home-subbanner > div:first-child .source-date-2 .field--name-field-author-alt,
.region-home-subbanner-journal > div:first-child .source-date-2 .field--name-field-author-alt,
.path-alias-actu .region-home2-col2 .views-row:first-child .source-date-2 .field--name-field-author-alt
{
   display: inline;
}
.region-home-subbanner > div:first-child .source-date-2 .date,
.region-home-subbanner-journal > div:first-child .source-date-2 .date,
.path-alias-actu .region-home2-col2 .views-row:first-child .source-date-2 .date
{
   display: none;
}

/* spécificités pour les 'comm' */

.region-home-subbanner-eglises > div:first-child {
   /*padding-top: 10px;*/
}

.comm.home-subbanner {
   /*margin: 10px 0 0 0;*/
}

.comm.home-subbanner .image-container {
   margin-bottom: 10px;
}

.comm.home-subbanner .img-responsive {
   width: 100%;
}

.comm.home-subbanner .field--name-field-subtitle {
   color: #00ADD3;
   font-weight: 700;
   /* calibré pour que "Pain pour le prochain" passe juste... */
   white-space: nowrap;
   overflow: hidden;
   font-size: 0.97rem;
}

.comm.home-subbanner .title a,
.shortcomm.home-subbanner .title a {
   font-family: 'Fira Sans', sans-serif;
   font-size: 1.3rem;
   font-weight: 500;
}

/* shortcomm */

.shortcomm.home-subbanner {
   border-top: solid 1px #95989a;
   margin: 0 0 10px 0;
   padding-top: 10px;
}
.region-home-subbanner-eglises > div:nth-child(3) .shortcomm.home-subbanner {
   /*border-top: 0 none;
   margin-top: 0;
   padding-top: 0;*/
}

.shortcomm.home-subbanner .keyword-accroche {
   display: block;
}

.shortcomm.home-subbanner .field--name-field-subtitle { /* subtitle = catégorie sur [short]comm */
   font-weight: 700;
   float: left;
   margin-right: 5px;
   text-transform: uppercase;
   padding-right: 5px;
   border-right: solid 1px black;
}

/* variations entre 1-2 et suivants (eglises) */
/* en fait non, sont des comm versus des shortcomm */

/* "hack" pour .article.home-subbanner qui serait mis dans la colonne region-home-subbanner-eglises */
/* ne devrait PAS arriver, mais à de rares occasions on l'a fait (par ex YouTUBE live Crêt-Bérard) */

.region-home-subbanner-eglises .article.home-subbanner {
   margin-top: -8px;
}
.region-home-subbanner-eglises .article.home-subbanner .keyword-accroche,
.region-home-subbanner-eglises .article.home-subbanner .field--name-field-ref-author,
.region-home-subbanner-eglises .article.home-subbanner .par {
   display: none;
}
.region-home-subbanner-eglises .article.home-subbanner .source-date-2 {
   visibility: hidden;
}

/* check pour éviter de se tromper et de mettre autre chose que comm, comm, shortcomm, shortcomm dans la colonne églises/réseaux */

.region-home-subbanner-eglises > div:nth-child(1) article.shortcomm,
.region-home-subbanner-eglises > div:nth-child(2) article.shortcomm,
.region-home-subbanner-eglises > div:nth-child(3) article.comm,
.region-home-subbanner-eglises > div:nth-child(4) article.comm {
    border: solid 2px red;
}
.region-home-subbanner-eglises > div:nth-child(1) article.shortcomm::before,
.region-home-subbanner-eglises > div:nth-child(2) article.shortcomm::before,
.region-home-subbanner-eglises > div:nth-child(3) article.comm::before,
.region-home-subbanner-eglises > div:nth-child(4) article.comm::before {
    content: "ERREUR: type de contenu invalide";
    background: red;
    color: white;
}


/***************************************************/
/* display-mode : home_video => .home-video (ou aussi via .region-home-video[-mini])
 */

/*.article*/.home-video {
   margin-bottom: 17px;
}

.home-video .field--name-field-image {
   overflow: hidden;
}
.home-video .field--name-field-image .img-responsive {
  width: 100%; /* image format juste trop petit en LG => expand */
}
.home-video-alt .field--name-field-image .img-responsive {
   max-height: 183.4px;                                                         /* FIXED SIZE */
   object-fit: cover;   /* conserve proportion image malgré resize déformant en faisant "déborder" l'image hors de sa zone visible */
}
.home-video .field--name-field-image a:hover img {
   transform: scale(1.02);
   transition: transform 0.5s;
}

.home-video .title-subtitle {
   position: absolute;
   /*top: 60%;*/
   bottom: 0;
   left: 0;
   right: 0;
   color: white;
   background-color: rgba(0,173,211,0.4);
   padding: 0.5em 0.5em 2em 0.5em;
   text-transform: uppercase;
}

.home-video .title-subtitle a {
   color: white;
   text-decoration: none;
   font-weight: 700;
}
.home-video .title {
   font-size: 2rem;
   margin-top: -0.25em;
   /* fake text-stroke/border avec 4 shadow sans blur */
   text-shadow: -1px -1px 0 #707070,  
    1px -1px 0 #707070,
    -1px 1px 0 #707070,
     1px 1px 0 #707070;
}
.home-video .field--name-field-subtitle {
   font-size: 2.5rem;
   color: #ebe7de;
   /* fake text-stroke/border avec 4 shadow sans blur */
   text-shadow: -1px -1px 0 #707070,  
    1px -1px 0 #707070,
    -1px 1px 0 #707070,
     1px 1px 0 #707070;
}

/* variations -mini */

.region-home-video-mini .home-video .title-subtitle {
  padding-bottom: 0.2em;
}
.region-home-video-mini .home-video .title {
   font-size: 0.8rem;
   text-shadow: none;
}
.region-home-video-mini .home-video .field--name-field-subtitle {
   font-size: 1.1rem;
}

/***************************************************/
/* display-mode : home_cats => .home-cats 
 * (ou aussi via .region-home-cats ou .region-home-archives)
 */

.home-cats {
   margin-bottom: 35px;
}

/*.article .story .comm*/.home-cats .title {
   font-family: 'Fira Sans', sans-serif;
   font-size: 1.3rem;
   font-weight: 600;
   line-height: 1.2;
   position: absolute;
   overflow: hidden;
   margin-right: 1em;
   color: white;
   text-shadow: 1px 1px 5px black;
   top: 42%;
   left: 20%;
   max-height: 58%;
}
.home-cats .image-container:hover img {
   filter: brightness(60%);
}
.region-home-archives .home-cats .image-container img {  /* archives override */
   filter: grayscale(100%);
}
.region-home-archives .home-cats .image-container:hover img {  /* archives override */
   filter: grayscale(0%);
}
/* si besoin pour faire de la place et positionner picto .fa au centre
.home-cats.has-video .title,
.home-cats.has-audio .title {
   top: 60%;
   left: 10px;
} */
.home-cats .image-container .fa {
   /* defaults */
}
.home-cats .paragraph--type--photo {
   margin-bottom: 0;
}

.home-cats .category-or-subtitle {
   font-size: 0.9rem;
   font-weight: 500;
   text-transform: uppercase;
   margin: 0.7em 0;
}
.home-cats .category-or-subtitle a {
   color: black;
}
.region-home-archives .home-cats .category-or-subtitle a {  /* archives override */
   color: white;
}
.home-cats .category-or-subtitle a:hover {
   text-decoration: none;
}
.home-cats .field--name-field-category,
/*.comm*/.home-cats .field--name-field-subtitle,
.post.home-cats .source {
   display: inline;
   border-bottom: solid 3px #00ADD3;
   padding-bottom: 2px;
}

.home-cats .keyword-accroche {
   color: black;
   text-decoration: none;
   font-size: 0.8rem;
   
   max-height: 210px;
   overflow: hidden;
   display: block;
}
.region-home-archives .home-cats .keyword-accroche {  /* archives override */
   color: white;
}

.home-cats .field--name-field-keyword {
   float: left;
   margin-right: 5px;
   /*font-weight: 700;*/
   text-transform: uppercase;
}


/***************************************************/
/*
 *
 * cloitres
 *
 */

/***************************************************/
/* display-mode : full => .full
 */

.cloitres.full {
}

.cloitres.full .field--name-field-category {
   display: inline;
}


/***************************************************/
/* display-mode : listing => .listing
 * partage pas mal de trucs avec .cloitres.home-subbanner
 */

.cloitres.listing {
   background-color: #e4e0d7;
   margin-bottom: 1.5em;
   
   min-height: unset !important; /* car les articles de manière générale ont une hauteur min qui interfère ici */
}

.cloitres.listing .image-container .fa,
.cloitres.home-subbanner .image-container .fa {
   left: 50%;
   top: 50%;
   margin-top: -25px;
   margin-left: -30px;
   padding: 10px 20px;
   font-size: 1rem;
   border-radius: 30%;
   background-color: rgba(0,0,0,0.7);
}
.cloitres.listing .image-container .fa:hover,
.cloitres.home-subbanner .image-container .fa:hover {
   background-color: rgba(230,230,230,0.7);
}

.cloitres.listing .field--name-field-videoembed,
.cloitres.home-subbanner .field--name-field-videoembed {
   display: none;
}

.cloitres.listing .field--name-field-category {
   left: 0;
   right: 0;
   top: 0;
   bottom: unset;
   text-align: center;
   text-transform: unset;
   background-color: rgba(0, 0, 0, 0.75); /* default : black */
}
.cloitres.listing .field--name-field-category.serie-nouvelles-du-front {
   background-color: rgba(150, 0, 100, 0.75); /* violet : au front */
}
.cloitres.listing .field--name-field-category.serie-bol-dair {
   background-color: rgba(80, 140, 200, 0.75); /* bleu : le bol d'air */
}
.cloitres.listing .field--name-field-category.serie-derrière-linfo {
   background-color: rgba(150, 100, 0, 0.75); /* brun : derriere l'info */
}
.cloitres.listing .field--name-field-category.serie-air-libre {
   background-color: rgba(70, 150, 0, 0.75); /* vert : air l'ibre? */
}

.cloitres.listing .details {
   padding: 0.5em;
   font-weight: 600;
}

.cloitres.listing .title {
   font-family: unset;
   font-size: unset;
   font-weight: unset;
   
   white-space: nowrap;
   overflow: hidden;
   
   margin-bottom: 0.25em;
}

.cloitres.listing .field--name-field-chapeau {
   height: 2em;
   line-height: 1em;
   overflow: hidden;
   
   margin-bottom: 0.25em;
}

.cloitres.listing .date {
}

.cloitres.listing.is-unpublished {
   border: unset;
   opacity: 0.5;
}


/***************************************************/
/* display-mode : sous-bannière => .home-subbanner
 */

.view-cloitres.view-display-id-block_1 {
   position: relative;
}

.cloitres.home-subbanner {
   margin: 10px 0 0 0;
   line-height: 1;
}

.cloitres.home-subbanner .image-container {
   margin-bottom: 10px;
}

.cloitres.home-subbanner .details {
}

.cloitres.home-subbanner h2 {
   font-size: 1rem;
   font-weight: 700;
   text-transform: uppercase;
   color: #00ADD3;
   margin-top: 0;
}

.cloitres.home-subbanner .intro {
   font-size: 0.7rem;
   margin-bottom: 1.5em;
   font-weight: 500;
}

.cloitres.home-subbanner .title {
   text-transform: uppercase;
}

.cloitres.home-subbanner .title,
.cloitres.home-subbanner .field--name-field-chapeau {
   font-size: 0.75rem;
   font-weight: 700;
   margin-bottom: 0.5em;
}

.cloitres.home-subbanner .field--name-field-chapeau {
   margin-bottom: 1em;
}

.view-cloitres .more-link {
   position: absolute;
   right: 0;
   bottom: 10px;
   padding: 2px 10px;
   background-color: #00ADD3;
   max-width: 150px;
   line-height: 1;
}
.view-cloitres .more-link a {
   color: white;
   font-weight: 700;
   text-transform: uppercase;
   font-size: 0.7rem;
}


/***************************************************/
/*
 *
 * articles de comm église
 *
 */

/***************************************************/
/* display-mode : full => .full
 */

.comm.full .image-container {
}
.comm.full .field--name-field-image img {
   width: 100%;
}
.comm.full .field--name-field-subtitle {
   font-weight: 700;
   color: white;
   position: absolute;
   bottom: 0;
   left: 3em;
   text-transform: uppercase;
   background-color: #00ADD3;
   padding: 5px 15px;
}

.comm.full > .content {
   margin: 0 15px 1em 3em;
}

.comm.full .source-date {
   margin: 1em 0;
   display: table;
   text-transform: uppercase;
   font-size: 0.75rem;
   font-weight: 600;
}
.comm.full .source-date > div {
   padding: 0 0.5em;
   border-left: solid 1px #95989a;
   display: table-cell;
   vertical-align: middle;
}
.comm.full .source-date > div:first-child {
   border-left: none;
   padding-left: 0;
}
.comm.full .source-date .source .par {
   color: #95989a;
}
.comm.full .source-date .date {
}
.comm.full .source-date .date:before {
   content: 'communiqué du ';
}

.comm.full .keyword-chapeau {
   margin: 1.5em 0.5em 1.5em 0;
   font-weight: 600;
   font-size: 1.25rem;
}
.comm.full .field--name-field-keyword {
   float: left;
   margin-right: 5px;
   text-transform: uppercase;
   font-weight: 700;
}


/***************************************************/
/* display-mode : home2_banner => .home2-banner
 */

/*.comm*/.home2-banner .title {
   font-size: 2.6rem;
}

.home2-banner .title-subtitle {
   padding: 1em 3em 0.5em 1.5em;
}

.home2-banner .field--name-field-subtitle {
   font-size: 1.75rem;
}


/***************************************************/
/* display-mode : home2_subbanner => .home2-subbanner (ou aussi via .region-home2-subbanner)
 */

/*.article/.comm*/.home2-subbanner {
}
.region-home2-subbanner > div:first-child {
   margin-bottom: 30px;
}

.home2-subbanner .field--name-field-image img {
   width: 100%;
   max-height: 243.5px;   /* sera override par JS onresize */
   object-fit: cover;   /* conserve proportion image malgré resize déformant en faisant "déborder" l'image hors de sa zone visible */
}

.home2-subbanner .title-subtitle {
   right: 0;
   left: unset;
   bottom: 5%;
   padding: 0.5em 1.5em 0.5em 0.5em;
   text-transform: none;
}

.home2-subbanner .title {
   font-family: 'Raleway', sans-serif;
   font-size: 1.1rem;
   font-weight: 700;
   text-align: right;
}

.home2-subbanner .category-or-subtitle {
   position: absolute;
   top: 0;
   right: 0;
   padding: 2px 15px;
   min-width: 5em;
   text-align: center;
   color: white;
   background-color: #ccb42f; /*rgba(204, 180, 47, 1.0);*/
   font-weight: 700;
   text-transform: uppercase;
}
.home2-subbanner .category-or-subtitle a {
   color: white;
}


/***************************************************/
/*
 *
 * brèves (short) et brèves de comm église (shortcomm)
 *
 */

/***************************************************/
/* display-mode : home2_subbanner => .home2-subbanner (ou aussi via .region-home2-subbanner)
 */

.short.home2-subbanner,
.shortcomm.home2-subbanner {
   padding: 10px 15px;
   border: solid 1px #95989a;
   background-color: white;
   margin-bottom: 15px;
}

.short.home2-subbanner a,
.shortcomm.home2-subbanner a {
   color: black;
}

.short.home2-subbanner .image-title,
.shortcomm.home2-subbanner .image-title {
   margin-bottom: 0.5em;
}

.short.home2-subbanner .field--name-field-image,
.shortcomm.home2-subbanner .field--name-field-image {
   float: left;
   margin-right: 0.5em;
}

.short.home2-subbanner .title,
.shortcomm.home2-subbanner .title {
   font-family: 'Playfair Display', serif;
   font-size: 1.35rem;
   font-weight: 700;
   margin: 0.1em 0 0.3em 0;
   display: block;
   text-align: initial;
}

.short.home2-subbanner .keyword-body,
.shortcomm.home2-subbanner .keyword-body {
   display: block;
   column-count: 2;
   font-size: 0.75rem;
}

.shortcomm.home2-subbanner .field--name-field-subtitle {
   font-weight: 700;
   float: left;
   margin-right: 5px;
   text-transform: uppercase;
   padding-right: 5px;
   border-right: solid 1px black;
}

.short.home2-subbanner .field--name-field-keyword,
.shortcomm.home2-subbanner .field--name-field-keyword {
   font-weight: 700;
   float: left;
   margin-right: 5px;
   text-transform: uppercase;
}

.short.home2-subbanner .field--name-field-body-shortcomm,
.shortcomm.home2-subbanner .field--name-field-body-shortcomm {
}

/***************************************************/
/* display-mode : listing => .listing
 */

.short.listing,
.shortcomm.listing {
}

.short.listing .keyword-accroche,
.shortcomm.listing .keyword-accroche {
   display: block;
   margin-top: 0;
}

.short.listing .title,
.shortcomm.listing .title {
   line-height: 1.1em;
   margin-bottom: 10px;
}

.shortcomm.listing .field--name-field-subtitle {
   font-weight: 700;
   float: left;
   margin-right: 5px;
   text-transform: uppercase;
   padding-right: 5px;
   border-right: solid 1px black;
}

.short.listing .field--name-field-keyword,
.shortcomm.listing .field--name-field-keyword {
   font-weight: 700;
   float: left;
   margin-right: 5px;
   text-transform: uppercase;
}

.short.listing .field--name-field-body-shortcomm,
.shortcomm.listing .field--name-field-body-shortcomm {
}

.short.listing .source-date,
.shortcomm.listing .source-date {
   display: block;
   border-bottom: solid 1px #95989a;
}
.short.listing .source-date .date,
.shortcomm.listing .source-date .date {
}


/***************************************************/
/*
 *
 * blog posts
 *
 */

/***************************************************/
/* display-mode : full => .full
 */

.post.full .image-container {
}
.post.full .field--name-field-image img {
   width: 100%;
}

.post.full > .content {
   margin: 0 15px 1em 15px;
}

.post.full .source-date {
   margin: 1em 0;
   display: table;
   text-transform: uppercase;
   font-size: 0.75rem;
   font-weight: 600;
}
.post.full .source-date > div {
   padding: 0 0.5em;
   border-left: solid 1px #95989a;
   display: table-cell;
   vertical-align: middle;
}
.post.full .source-date > div:first-child {
   border-left: none;
   padding-left: 0;
}
.post.full .source-date .source .par {
   color: #95989a;
}
.post.full .source-date .date {
}
.post.full .source-date .date:before {
   content: 'billet du ';
}

/***************************************************/
/* display-mode : listing_alt => .listing-alt
 */
 
.post.listing-alt .accroche:after {
   content: '[...]';
}

/***************************************************/
/* display-mode : home_cats => .home-cats
 */
 
.post.home-cats .keyword-accroche:after {
   content: '[...]';
}

.post.home-cats .source-date {
   text-transform: uppercase;
}

.post.home-cats .source {
   float: left;
   margin-right: 0.5em;
}

.post.home-cats .par {
   display: none;
}

.post.home-cats .date {
}


/***************************************************/
/* display-mode : home_edito => .home-edito (ou aussi via .region-home-editor)
 */

/*.post*/.home-edito {
   line-height: 1.1;
   margin-bottom: 15px;
}
.home-edito a {
   color: black;
}

.home-edito > .content {
   position: relative;
}

.home-edito .left {
   /*width: 50%;
   padding-right: 15px;*/
}

.home-edito .right {
   overflow: hidden;
}

.home-edito .field--name-field-keyword {
   font-family: 'Playfair Display', serif;
   font-size: 1.35rem;
   font-weight: 700;
   margin: 0.1em 0 0.3em 0;
}

.home-edito .title {
   font-size: 1.15rem;
   font-weight: 500;
}
.home-edito .title:before {
   content: "«";
}
.home-edito .title:after {
   content: "»";
}

.home-edito .source {
   font-size: 0.65rem;
   text-transform: uppercase;
}
.home-edito .par {
   color: #95989a;
}
.home-edito .field--name-field-ref-author,
.home-edito .field--name-field-author-alt {
   display: inline;
}


/***************************************************/
/*
 *
 * Déformés [deformes]
 *
 */

/* retiré septembre 2024 (dispo dans BKP CSS séparé dédié) */

.home2-banner .serpent,
.serpent {
   display: none;
}


/***************************************************/
/*
 *
 * Sous-home BEJU
 *
 */

/***************************************************/
/* look différents d'éléments généraux (polics, blocs, ...)
 * sur la sous-home BEJU
 */
/* body[class*=" path-alias-deformes"] pur CSS qui fonctionne, mais on peut aussi utiliser 
/* body.path-rootalias-deformes qui est injecté par le thème */

body.path-alias-tag-bernejurasoleure {
}

body.path-alias-tag-bernejurasoleure h1.page-title {
    display: none !important;
}

body.path-alias-tag-bernejurasoleure #home2-col-wrapper .data-container {
    margin-bottom: 15px;
}

/* bloc promo réseaux, youtube, ... */

body.path-alias-tag-bernejurasoleure .region-home2-col2 {
  background: #505050;
  color: white;
  padding: 1em;
}
body.path-alias-tag-bernejurasoleure .region-home2-col2 a {
  color: white;
}
body.path-alias-tag-bernejurasoleure .region-home2-col2 a .image-container {
    display: inline;
    bottom: 2px;
    position: relative;
}

body.path-alias-tag-bernejurasoleure .region-home2-col2 .photocredit-wrapper {
    display: none;
}

body.path-alias-tag-bernejurasoleure .region-home2-col2 h2 {
    margin-top: 0;
}

/* adaptations article en une/banner */

body.path-alias-tag-bernejurasoleure .home2-banner .title-subtitle .colombe {
   display: none;
}
body.path-alias-tag-bernejurasoleure .home2-banner .title-subtitle .colombe-rouge {
   display: block;
}

/* adaptations articles en banner secondaire (2 articles sur le côté de la banner) */

body.path-alias-tag-bernejurasoleure .home2-subbanner .category-or-subtitle {
    background-color: #e30613;
}

/* bandeau des blogs BEJU */

/*body.path-alias-tag-bernejurasoleure .region-home2-content2 {
}*/


/***************************************************/
/*
 *
 * questiondieu
 *
 */

.qdquestion {
}


/***************************************************/
/* display-mode : home_edito => .home-edito (OLD)
 */

.questiondieu.home-edito {
   margin-bottom: 0;

   background-size: 100% 100%;
   background-position: center top;
   background-repeat: no-repeat;
}
.no-webp .questiondieu.home-edito {
   background-image: url('../images/questiondieu/bulle.jpg');
}
.webp .questiondieu.home-edito {
   background-image: url('../images/questiondieu/bulle.webp');
}

.questiondieu.home-edito .content {
   position: relative;
   /*height:set by placeholder image*/

   background-size: auto 75%;
   background-position: left bottom;
   background-repeat: no-repeat;
}
.no-webp .questiondieu.home-edito .content {
   background-image: url('../images/questiondieu/perso-1.png');
}
.webp .questiondieu.home-edito .content {
   background-image: url('../images/questiondieu/perso-1.webp');
}

.no-webp .questiondieu.home-edito .content.perso2 {
   background-image: url('../images/questiondieu/perso-2.png');
}
.no-webp .questiondieu.home-edito .content.perso3 {
   background-image: url('../images/questiondieu/perso-3.png');
}
.no-webp .questiondieu.home-edito .content.perso4 {
   background-image: url('../images/questiondieu/perso-4.png');
}
.webp .questiondieu.home-edito .content.perso2 {
   background-image: url('../images/questiondieu/perso-2.webp');
}
.webp .questiondieu.home-edito .content.perso3 {
   background-image: url('../images/questiondieu/perso-3.webp');
}
.webp .questiondieu.home-edito .content.perso4 {
   background-image: url('../images/questiondieu/perso-4.webp');
}

.questiondieu.home-edito .question {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   
   text-align: center;
   font-size: 1.1rem;
   font-weight: 500;
   margin: 0 15% 0 20%;
   padding-top: 3px;
}
.questiondieu.home-edito .question a {
   color: white;
}

.questiondieu.home-edito .link {
   position: absolute;
   bottom: 2px;
   right: 5px;
   width: 45%;
}


/***************************************************/
/*
 *
 * story
 *
 */

/***************************************************/
/* display-mode : full => .full
 */

/* banner */
body.page-node-type-story #banner-wrapper .data-container {
   max-width: 100%;
}
body.page-node-type-story #banner-wrapper .field--name-field-image img {
   margin: 0 auto;
   width: 100%;
   max-width: 3000px;
   max-height: 700px;
   max-height: 60vh;
   object-fit: cover;
}

/* socials */
.page-node-type-story .social-tools {
   margin-top: 7em;
}
.page-node-type-story .social-tools a,
.page-node-type-story .social-tools a img {
   display: inline;
}
.page-node-type-story .social-tools a img {
   padding: 0 15px 0 0;
   margin-bottom: 30px;
   max-width: 60px;
}

/* <article> */
.story.full {
   padding-top: 0 !important;
}

.story.full > .content {
   margin: 0 10px 0 10px;
}

.story.full .field--name-field-category {
   font-weight: 700;
   position: relative;
   height: 2.3em;
   top: -2.3em;
   left: -20px;
   text-transform: uppercase;
   background-color: #00ADD3;
   padding: 5px 30px;
   display: inline-block;
}
.story.full .field--name-field-category a {
   color: white;
}

.story.full .source-date {
   margin: 0;
   display: table;
   text-transform: uppercase;
   font-size: 0.75rem;
   font-weight: 600;
}
.story.full .source-date > div {
   padding: 0 0.5em;
   border-left: solid 1px #95989a;
   display: table-cell;
   vertical-align: middle;
}
.story.full .source-date > div:first-child {
   border-left: none;
   padding-left: 0;
}
.story.full .source-date .field--name-field-ref-source {
   font-weight: 700;
}
.story.full .source-date .field--name-field-ref-author a {
   color: black;
}
.story.full .source-date .date {
}

.story.full .keyword-chapeau {
   margin: 1.5em 0.5em 1.5em 0;
   font-weight: 600;
   font-size: 1.25rem;
}
.story.full .field--name-field-keyword {
   float: left;
   margin-right: 5px;
   text-transform: uppercase;
   font-weight: 700;
}

.story.full .field--name-field-paragraphs {
}

.story.full .field--name-field-tags {
   margin: 2em 0 0.5em 0;
}

/* sidebar */

.page-node-type-story .sidebar {

}


/***************************************************/
/*
 *
 * dossier
 *
 */

/***************************************************/
/* display-mode : full => .full
 */

.page-node-type-dossier .main-wrapper .main-container .region-content,
.page-node-type-dossier .main-wrapper .main-container .region-content article {
   min-height: 10px;
}
.page-node-type-dossier .region-content article.full {
   margin-bottom: 1em;
}
.page-node-type-dossier .region-subcontent-1 {
   background-color: transparent;
   padding: 0;
}

/* banner */
.page-node-type-dossier #banner-wrapper .data-container {
   max-width: 100%;
}
.page-node-type-dossier #banner-wrapper .field--name-field-image img {
   margin: 0 auto;
   width: 100%;
   max-width: 3000px;
   max-height: 700px;
   max-height: 55vh;
   object-fit: cover;
}

/* banner wrapper/overlay */
.page-node-type-dossier .overlay {
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.45);
}
.page-node-type-dossier .banner-data-wrapper {
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
}

.page-node-type-dossier .banner-data-wrapper .title-subtitle {
   position: absolute;
   bottom: 0;
   right: 0;
   color: white;
   background-color: rgba(0,173,211,0.4);
   padding: 0.2em 135px 0.5em 30px;
   text-transform: uppercase;
   max-width: 75%;
}
.page-node-type-dossier .banner-data-wrapper .surtitle {
   position: absolute;
   right: 145px;
   top: -1.2em;
   color: #00ADD3;
   font-size: 2.2rem;
   font-weight: 600;
}
.page-node-type-dossier #banner-wrapper .field--name-field-category {
   font-weight: 700;
   color: white;
   position: absolute;
   bottom: 0;
   left: 15px;
   text-transform: uppercase;
   background-color: #00ADD3;
   padding: 5px 15px;
}
.page-node-type-dossier .banner-data-wrapper .colombe {
   position: absolute;
   right: 50px;
   top: -75px;
   width: 110px;
}
.page-node-type-dossier .banner-data-wrapper .title-subtitle a {
   color: white;
}
.page-node-type-dossier .banner-data-wrapper .title,
.dossier.full h1 {
   font-family: 'Playfair Display', serif;
   font-size: 2.75rem;
   font-weight: 700;
   line-height: 1.1;
}
.dossier.full h1 {
   margin-top: 0;
}
.page-node-type-dossier .banner-data-wrapper .field--name-field-subtitle,
.dossier.full .field--name-field-subtitle {
   font-size: 1.5rem;
}

.page-node-type-dossier .banner-data-wrapper .keyword-chapeau,
.dossier.full .keyword-chapeau {
   margin: 1em 0;
   font-size: 1.2rem;
   font-weight: 600;
   line-height: 1.3;
}

/* main-wrapper */
.page-node-type-dossier .main-wrapper {
   /*background-color: rgba(0, 0, 0, 0.45);*/
}

/* <article> */
.dossier.full {
   margin-top: 1em;
}
.region-content article.dossier.full {
   background: transparent;
   padding: 10px 0;
}

.dossier.full > .content {
}

.dossier.full .field--name-body {
}

.dossier.full .field--name-body .field--label {
   font-size: 1.5rem;
   margin: 15px 0;
}

/* intercontent_1 */
.page-node-type-dossier .region-intercontent-1 {
   margin-bottom: 1em;
   margin-top: -69px;
   margin-left: -12px;
}

/* subcontent_1 */
.page-node-type-dossier .region-subcontent-1 {
}

.page-node-type-dossier .region-subcontent-1 .block-title {
   /*display: none;*/
}

/***************************************************/
/* display-mode : listing_alt => .listing-alt
 */

.dossier.listing-alt {
   margin-top: 1.5em;
   margin-bottom: 3.5em;
   border-bottom: solid 12px #00ADD3;
}

.dossier.listing-alt .field--name-field-image img {
   width: 100%;
   max-height: 300px;
   object-fit: cover;
   filter: brightness(60%);
}

/*.dossier.listing-alt a:hover img {
   transform: scale(1.4);
   transition: transform 5s;
}*/

.dossier.listing-alt .title {
   color: white;
   display: block;
   text-align: center;
   left: 50% !important; /* override .node.listing-alt .title */
   top: 50%;
   width: 95%;
   position: absolute;
   transform: translate(-50%, -50%);
}
.dossier.listing-alt .title span {
   font-size: 2.5rem;
   line-height: 1;
}

.dossier.listing-alt .title .field--name-field-accroche {
   font-family: 'Raleway', sans-serif;
   font-size: 1rem;
   margin-top: 1em;
}

/***************************************************/
/* page de listing des dossiers
 */

.page-all-dossiers {
}

.page-all-dossiers #banner-wrapper {
   margin: 0 auto 2em auto;

   width: 100%;
   max-width: 3000px;

   height: 600px;
   max-height: 35vh;

   background-image: url('../images/banner-dossiers-2.jpg');
   background-size: cover;
   background-position: center center;
}
.page-all-dossiers .overlay {
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.45);
}
.page-all-dossiers .banner-data-wrapper {
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
}
.page-all-dossiers .banner-data-wrapper .title {
   font-family: 'Raleway', sans-serif;
   font-size: 3rem;
   font-weight: 600; /* semi-bold */
   line-height: 1;
   color: #00ADD3;
   background-color: rgba(0,173,211,0.4);
   padding: 0.1em 1.5em 0.1em 0.7em;
   text-transform: uppercase;

   position: absolute;
   bottom: 0;
   left: 0;
}
.page-all-dossiers .banner-data-wrapper .colombe {
   position: absolute;
   right: 0px;
   top: -35px;
   width: 60px;
}
.page-all-dossiers .banner-data-wrapper .keyword-chapeau {
   color: white;
   margin: 1em 0 4em 0;
   font-size: 1.2rem;
   font-weight: 600;
   line-height: 1.3;
}

.page-all-dossiers .dossier.listing-alt {
   margin-top: 1em;
   margin-bottom: 1em;
}
.page-all-dossiers h1.page-title {
   display: none !important;
}


/***************************************************/
/* display-mode : home_dossier => .home-dossier (ou aussi via .region-home-dossier[-mini])
 */

/*.dossier*/.home-dossier {
}

.home-dossier .title {
   color: white;
   display: block;
   text-align: center;
   left: 50% !important; /* override .node.listing-alt .title */
   top: 43%;
   width: 90%;
   position: absolute;
   transform: translate(-50%, -50%);
}
.home-dossier .title span {
   font-family: 'Playfair Display', serif;
   font-weight: 700;
   font-size: 1.75rem;
   line-height: 1;
}

.home-dossier .field--name-field-keyword {
   /*font-variant: small-caps;*/
   font-size: 1.1rem;
   font-weight: 500;
   color: white;
   background-color: #00ADD3;
   padding: 2px 15px;
   text-transform: uppercase;
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
}

/* variantions home-dossier[-mini] */

.region-home-dossier .home-dossier .title span {
   text-shadow: 1px 3px 5px black;
}
.region-home-dossier-mini .home-dossier .field--name-field-image img {
   width: 100%;
   max-height: 196.3px; /* sera override par JS onresize */
   object-fit: cover;   /* conserve proportion image malgré resize déformant en faisant "déborder" l'image hors de sa zone visible */
   filter: brightness(60%);
}


/***************************************************/
/*
 *
 * chiffre
 *
 */

/***************************************************/
/* display-mode : full => .full
 */

.chiffre.full {
}

.chiffre.full .field--name-field-images .field--item:first-child {
   float: left;
}


/***************************************************/
/* display-mode : listing => .listing
 */

.chiffre.listing {
   background-color: white;
   margin-bottom: 1em;
}

.chiffre.listing .field--name-field-images {
   display: flex;
}
.chiffre.listing .field--name-field-images .field--item {
   flex-grow: 1; /* en XS il y a trop de place => grow */
}
.chiffre.listing .img-responsive {
   width: 100%;
}

.chiffre.listing .date {
    padding: 10px 15px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
}


/***************************************************/
/*
 *
 * Réactif
 *
 */

/***************************************************/
/* display-mode : full => .full
 */

.reactif.full {
}


/***************************************************/
/* display-mode : listing => .listing
 */

.reactif.listing {
   background-color: white;
   margin-bottom: 1em;
}

.reactif.listing .field--name-field-videoembed {
   display: none;
}

.reactif.listing .image-container {
   float: left;
   padding-right: 15px;
}

.reactif.listing .details {
   font-weight: 600;
   padding: 10px 15px;
}
.reactif.listing .date {
   font-size: 0.75rem;
   font-weight: 600;
   text-transform: uppercase;
   padding-bottom: 1em;
}
.reactif.listing .title {
   font-family: unset;
   font-size: unset;
   font-weight: unset;
}


/***************************************************/
/*
 *
 * Subjectif
 *
 */

/***************************************************/
/* display-mode : full => .full
 */

.subjectif.full {
}

/***************************************************/
/* display-mode : listing => .listing
 */

.subjectif.listing {
   background-color: white;
   margin-bottom: 1em;
}

.subjectif.listing .field--name-field-videoembed {
   display: none;
}

.subjectif.listing .image-container {
   float: left;
   padding-right: 15px;
}

.subjectif.listing .details {
   font-weight: 600;
   padding: 10px 15px;
}
.subjectif.listing .date {
   font-size: 0.75rem;
   font-weight: 600;
   text-transform: uppercase;
   padding-bottom: 1em;
}
.subjectif.listing .title {
   font-family: unset;
   font-size: unset;
   font-weight: unset;
}


/***************************************************/
/*
 *
 * Télégramme
 *
 */

/***************************************************/
/* display-mode : full => .full
 */

.telegramme.full {
}


/***************************************************/
/* display-mode : listing => .listing
 */

.telegramme.listing {
   background-color: white;
   margin-bottom: 1em;
}

.telegramme.listing .field--name-field-videoembed {
   display: none;
}

.telegramme.listing .image-container {
}

.telegramme.listing .details {
   font-weight: 600;
   padding: 10px 15px;
}
.telegramme.listing .date {
   float: right;
   font-size: 0.75rem;
   font-weight: 600;
   text-transform: uppercase;
   position: relative;
   left: 5px;
}
.telegramme.listing .title {
   font-family: unset;
   font-size: unset;
   font-weight: unset;
   min-height: 3rem;
   max-height: 3rem;
   overflow: hidden;
}


/***************************************************/
/*
 *
 * repérages
 *
 */

/***************************************************/
/* display-mode : listing_alt => .listing-alt
 */

.reperage.listing-alt {
   position: relative;
}

.reperage.listing-alt a:hover img {
   filter: brightness(60%);
}

.reperage.listing-alt .title {
   font-size: 1.1rem;
   position: absolute;
   top: 10px;
   left: 10px;
   margin-right: 10px;
   color: white;
   text-shadow: 1px 1px 5px black;
}

.reperage.listing-alt .field--name-field-subtitle {
   font-size: 0.8rem;
   position: absolute;
   bottom: 10px;
   left: 10px;
   margin-right: 10px;
   color: white;
}


/***************************************************/
/*
 *
 * Galerie
 *
 */

/***************************************************/
/* display-mode : .full
 */

.gallery.full {
}

.gallery.full .image-container {
}
.gallery.full .image-container .fa {
   font-size: 4rem;
}
.gallery.full .image-container .call-to-action {
  color: white;
  background-color: grey;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 5px 10px;
  border-radius: 10px;
  opacity: 75%;
}

.gallery.full .field--name-field-paragraphs {
}
.gallery.full .field--name-field-paragraphs .field--item {
   display: none;
}
.gallery.full .field--name-field-paragraphs .field--item:first-child {
   display: block;
}

.gallery.full .field--name-field-category {
   font-weight: 700;
   position: absolute;
   bottom: 0;
   left: 3em;
   text-transform: uppercase;
   background-color: #00ADD3;
   padding: 5px 15px;
}
.gallery.full .field--name-field-category a {
   color: white;
}

.gallery.full > .content {
   margin: 0 15px 0 3em;
}

.gallery.full .source-date {
   margin: 1em 0;
   display: table;
   text-transform: uppercase;
   font-size: 0.75rem;
   font-weight: 600;
}
.gallery.full .source-date > div {
   padding: 0 0.5em;
   border-left: solid 1px #95989a;
   display: table-cell;
   vertical-align: middle;
}
.gallery.full .source-date > div:first-child {
   border-left: none;
   padding-left: 0;
}
.gallery.full .source-date .field--name-field-photographer a {
   color: black;
}
.gallery.full .source-date .date {
}

.gallery.full .keyword-chapeau {
   margin: 1.5em 0.5em 1.5em 0;
   font-weight: 600;
   font-size: 1.25rem;
}


/***************************************************/
/* display-mode : .listing
 */

.gallery.listing .field--name-field-paragraphs .field--item {
   display: none;
}
.gallery.listing .field--name-field-paragraphs .field--item:first-child {
   display: block;
}

.gallery.listing a.keyword-accroche,
.gallery.listing a.title {
   text-decoration: none;
   cursor: default;
}


/***************************************************/
/* display-mode : .asparagraph
 */

.gallery.asparagraph {
}

.gallery.asparagraph h2 {
   color: white;
   margin: 0;
}

.gallery.asparagraph h2 .gallery-link {
   color: white;
   font-size: smaller;
}

.gallery.asparagraph .source {
   margin-bottom: 1em;
}
.gallery.asparagraph .source .par {
   color: #95989a;
}
.gallery.asparagraph .field--name-field-photographer {
   display: inline;
}
.gallery.asparagraph .field--name-field-photographer a {
   color: white;
}

.gallery.asparagraph .field--name-field-paragraphs {
   overflow-x: scroll;
   white-space: nowrap;
}
.gallery.asparagraph .field--name-field-paragraphs .field--item {
   display: inline-block;
}
.gallery.asparagraph .field--name-field-paragraphs .field--item img {
   max-width: 30vw;
}


/***************************************************/
/*
 *
 * Author
 *
 */

/***************************************************/
/* display-mode : .full + .popover-content
 */

.author.full,
.author.popover-content {
}

.author h2.title,
.author h3.title-pre {
   text-transform: uppercase;
   margin-bottom: 20px;
}
.author h2.title .lastname {
   color: #00ADD3;
}

.author h3.title-pre {
   font-size: 0.7rem;
   font-weight: 500;
}

.author h2.title {
   font-size: 1.2rem;
   font-weight: 600;
}

.author h2.title .colombe {
   position: absolute;
   top: 10px;
   width: 90px;
   padding-left: 10px;
}

.author .field--name-field-image {
   box-shadow: 15px -15px 0 #00ADD3;
   margin: 15px 15px 0 0 ;
}
/* mask box-shadow :-) */
.author .field--name-field-image:before{
   content: "";
   background: white;
   position: absolute;
   width: 15px;
   height: 87%;
   top: 13%;
   right: 15px;
}
.author .field--name-field-image {
   background-color: #e0e0e0;
}
.author .field--name-field-image img {
   width: 100%;
}

.author .field--name-field-position {
   /*text-transform: capitalize;*/
   font-size: 1.2rem;
   font-weight: 600;
   /*border-bottom: solid 15px #00ADD3;*/
   padding-bottom: 1.5em;
   margin-top: 1.5em;
   margin-bottom: 1em;
   color: #95989a;
   position: relative;
}
.author .field--name-field-position:after {
   content: "";
   position: absolute;
   bottom: 0;
   left: 0;
   height: 20px;
   width: 100%;
   background: #00ADD3 url("../images/background-author-bar.png") repeat-x;
}

.author .field--name-field-presentation {
   /*font-size: 0.6rem;*/
}


.author .region-subcontent-1 {
   padding: 0;
   margin-top: 2em;
}
.author .region-subcontent-1 .title-wrapper .filets {
   display: none;
}
.author .region-subcontent-1 h2.block-title {
   font-family: 'Raleway', sans-serif;
   font-size: 1.1rem;
   font-weight: 600;
   color: #00ADD3;
   /*text-decoration: underline;*/
   padding-bottom: 10px;
   padding-right: 0;
   border-bottom: solid 2px #00ADD3;
}
.author .region-subcontent-1 .title-wrapper {
   margin-bottom: 15px
}
.author .region-subcontent-1 .view-content a {
   font-family: 'Playfair Display', serif;
   font-size: 1rem;
   font-weight: 700;
   color: #95989a;
}
/* ajout .view-content sinon perturbe nav pager */


/***************************************************/
/*
 *
 * User (ex-blogueur)
 *
 */

/***************************************************/
/* display-mode : .full
 */

.user.full {
}

.user h2.title,
.user h3.title-pre {
   text-transform: uppercase;
   margin-bottom: 20px;
}
.user h2.title .lastname {
   color: #00ADD3;
}

.user h3.title-pre {
   font-size: 0.7rem;
   font-weight: 500;
}

.user h2.title {
   font-size: 1.2rem;
   font-weight: 600;
}

/* pour éviter que colombe recouvre ligne du dessus */
.user h2.title span {
   min-width: 130px;
   display: inline-block;
}

.user h2.title .colombe {
   position: absolute;
   top: 10px;
   width: 90px;
   padding-left: 10px;
}

.user .field--name-user-picture {
   box-shadow: 14px -15px 0 #00ADD3;
   margin: 15px 15px 0 0 ;
}
/* mask box-shadow :-) */
.user .field--name-user-picture:before {
   content: "";
   background: white;
   position: absolute;
   width: 15px;
   height: 87%;
   top: 13%;
   right: 15px;
}
.user .field--name-user-picture {
   background-color: #e0e0e0;
}
.user .field--name-user-picture img {
   width: 100%;
}

.user .field--name-field-user-position {
   /*text-transform: capitalize;*/
   font-size: 1.2rem;
   font-weight: 600;
   /*border-bottom: solid 15px #00ADD3;*/
   padding-bottom: 1.5em;
   margin-top: 1.5em;
   margin-bottom: 1em;
   color: #95989a;
   position: relative;
}
.user .field--name-field-user-position:after {
   content: "";
   position: absolute;
   bottom: 0;
   left: 0;
   height: 20px;
   width: 100%;
   background: #00ADD3 url("../images/background-author-bar.png") repeat-x;
}

.user .field--name-field-presentation {
   /*font-size: 0.6rem;*/
}

/***************************************************/
/* display-mode : listing => .listing
 */

.user.listing {
   padding: 10px;
}

.user.listing .title {
   font-size: 0.9rem;
   font-weight: 500;
   text-transform: uppercase;
   border-left: solid 1px #95989a;
   padding-left: 5px;
}

.user.listing .field--name-user-picture:before {
   right: 0;
}

/***************************************************/
/*
 *
 * Source
 *
 */

/***************************************************/
/* display-mode : link => .link
 */

.source.link {
   text-transform: uppercase;
}

.source.link .content {
   display: flex;
   /*flex-direction: row;*/
   /*justify-content: flex-start;*/
   align-items: center;
}

.source.link .field--name-field-logo {
   display: inline-block;  /* not needed with flex */
}

.source.link .field--name-field-logo img {
   max-width: 30px;
   max-height: 30px;
}

.source.link .par {
   color: #95989a;
   margin: 0 5px 0 10px;
}

.source.link .title {
   display: inline;  /* not needed with flex */
   color: black;
}

/***************************************************/
/* display-mode : full => .full
 */

.region-content article.source.full {
}

body.page-node-type-source .region-subcontent-1 {
}

.source.full .image-container {

}
.source.full .field--name-field-image img {
   width: 100%;
}

.source.full > .content {
}

.source.full .field--name-field-logo {
   display: inline-block;
   float: right;
}
.source.full .field--name-field-logo img {
   max-height: 60px;
   max-width: 260px;
   width: auto;
}

.source.full .field--name-field-image {
}

.source.full .field--name-field-presentation {
   clear: both;
}

body.path-alias-source-reformes-les-hors-serie .source.full .field--name-field-image {
   display: none; /* hack masque image d'en-tête car on a mis un iframe e-paper */
}


/***************************************************/
/*
 *
 * pub
 *
 */

/***************************************************/
/* display-mode : TOUS
 */

.publicite {
}

/* pavé: 300x250, field et style d'image acceptent 600x500 => contraint ici (ce qui permet un rendu @2x/HD) */
.publicite .field--name-field-image-pub3 img {
   width: 300px;
}


/***************************************************/
/*
 *
 * Page
 *
 */

/***************************************************/
/* display-mode : full => .full
 */

.region-content article.page.full {
}

body.page-node-type-page .region-subcontent-1 {
}

.page.full > .content {
}

.page.full .field--name-body {
}

.page.full .image-container {
   overflow: hidden;
}


/***************************************************/
/*
 *
 * Paragraphs
 *
 */

.paragraph {
   margin-bottom: 1em;
}

.paragraph--type--intertitre {
}
.paragraph--type--intertitre h2.field--name-field-psubtitle {
}

.paragraph--type--intertitre-refch {
}
.paragraph--type--intertitre-refch h2.field--name-field-psubtitle {
}

.paragraph--type--intertitre2 {
}
.paragraph--type--intertitre2 h2.field--name-field-psubtitle {
   font-family: "Playfair display";
   font-size: 1.8rem;
}

.paragraph--type--filet {
   border-bottom: solid 1px black;
   margin: 2em 4em;
   clear: both;
}

.paragraph--type--citation {
   margin: 2em 0;
}
.field--name-field-pquote {
   font-family: 'Playfair Display', serif;
   font-style: italic;
   font-size: 1.65rem;
   font-weight: 700;
   margin: 15px 1em;
   text-align: center;
}
.field--name-field-pquote:before {
   content: '«';
}
.field--name-field-pquote:after {
   content: '»';
}
.field--name-field-pauthor {
   text-align: center;
   text-transform: uppercase;
   font-size: 0.85rem;
   font-weight: 500;
}
.field--name-field-pauthor:before {
   content: '—  ';
}

/* paragraph--type--photo peut être utilisé:
 * - directement (view-mode: default)
 * - dans une galerie (view-mode: ingallery)
 * - dans une galerie elle-même embarquée dans un article (view-mode: insubparagraph)
 */
.paragraph--type--photo.paragraph--view-mode--default {
   border-bottom: 1px solid #95989a;
   border-top: 1px solid #95989a;
   padding: 10px 0;
}
.paragraph--type--photo.paragraph--view-mode--default .field--name-field-pphoto img {
   width: 100%;
}

.paragraph--type--photo.paragraph--view-mode--ingallery .field--name-field-pphoto img {
   width: 100%;
}

.paragraph--type--photo.paragraph--view-mode--ingallery-listing .field--name-field-pphoto img {
   width: 100%;
}

.home-banner .paragraph--type--photo,
.home-subbanner .paragraph--type--photo {
   margin-bottom: 0;
}

.paragraph--type--gallery {
   background-color: black;
   padding: 20px;
}

.paragraph--type--video {
   background-color: black;
   padding: 20px;
}

.paragraph--type--sound {
}

/* encadré simple */

.paragraph--type--encadre-simple .cornered {
   height: 0;
   border-bottom: 30px solid #e4e0d7;
   border-right: 30px solid transparent;
}
.paragraph--type--encadre-simple .paragraph-content {
   font-size: 0.85rem;
   background-color: #e4e0d7;
   padding: 0 15px;
   /*float: right;
   max-width: 60%;
   margin: 0 0 10px 10px;*/
   margin: 0 0 10px 0;
   float: none;
   max-width: 100%;
   width: 100%;
}
.paragraph--type--encadre-simple .paragraph-content .field {
   position: relative;
   top: -10px;
}

/* encadré popover */

.paragraph--type--encadre {
   position: relative;
}

.paragraph--type--encadre .encadre-primary {
   position: absolute;
   left: 103%;
   width: 210px;
   padding: 5px;
   margin: 15px 0;
   border: solid 2px transparent;
}
.paragraph--type--encadre .encadre-primary.encadre-has-secondary,
.paragraph--type--encadre .encadre-primary.encadre-has-url {
   cursor: help;
}
.paragraph--type--encadre .encadre-primary.highlighted {
   border: solid 2px #00ADD3;
}

.paragraph--type--encadre .field--name-field-picon {
   float: left;
   max-width: 60px;
   margin: 0 10px 0 0;
}
.paragraph--type--encadre .encadre-has-url .field--name-field-picon img {
   border-radius: 50%;
}
/*.encadre-has-secondary garde son picto normal sans arrondi */

.paragraph--type--encadre .title-text {
   overflow: hidden; /* evite le wrap du texte qui retournerait sous le picto */
}
.paragraph--type--encadre .title-text .field--name-field-ptitle {
   font-size: 0.8rem;
   font-weight: 600;
   line-height: 1.2;
   margin-bottom: 5px;
}
.paragraph--type--encadre .title-text .field--name-field-ptitle:hover {
   text-decoration: underline;
}
.paragraph--type--encadre .title-text .field--name-field-ptext {
   font-size: 0.7rem;
}

.paragraph--type--encadre .encadre-secondary {
   display: none;
}
/* extrait par colorbox : débute à .encadre-secondary */
.encadre-secondary.container {
   max-width: 100%;
}
.encadre-secondary img {
   display: block;
   height: auto;
   max-width: 100%;
}

a.encadre-trigger {
   padding: 5px;
   color: #00ADD3;
   /*border: solid 1px #00ADD3;*/
   cursor: help;
}
a.encadre-trigger:hover {
   color: white;
   padding: 5px;
   background-color: #00ADD3;
   text-decoration: none;
}

/* notes de bas de page */

.paragraph--type--footer-notes {
   font-size: 0.75rem;
   font-style: italic;
}

/* note aux rédactions */

.paragraph--type--note-aux-redactions {
   display: none;
}


/***************************************************/
/*
 *
 * maintenance page
 *
 */

body.maintenance-page {
   /*background: #f4f4f4 url("../images/background-tile.png");*/
   background: #4C8040 url("../images/maintenance-3.jpg");
   background-size: cover;
   background-position: center center;
   background-repeat: no-repeat;
   width: 100%;
   height: 100vh;
   height: 100%;
}

body.maintenance-page main {
   /*display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   height: 100vh;*/
   width: 100%;
   height: 100%;
   height: 100vh;
   margin: 0;
   padding: 0;
   display: block;
}

body.maintenance-page .message {
   padding: 1em 0 0 1em;
   color: white;
   font-size: 2rem;
   font-weight: 700;
}

/***************************************************/
/*
 *
 * specific fields / elements
 *
 */

#admin-toolbar-search-tab {
   display: none;
}

.statistics-counter {
    display: none !important;
}

/* FB comments */

.field--type-facebook-comments {
   margin-top: 1rem;
   border: solid 1px grey;
   padding: 5px 10px;
}

/* forms */

.form-required::after {
   content: "*";
}

.form-group:last-child {
    margin-bottom: 15px;
}

/* Popup Brevo */

/* masque le popup s'il n'a pas été pris en charge par spb-popup */
.region-bottombar > #block-bsreformes-formulairepourpopupbrevo {
  display: none;
}

#spb-block-bsreformes-formulairepourpopupbrevo {
    & .spb-popup-main-wrapper {
        padding: 15px;
        background-color: #2B90E2; /* pour matcher fond form Brevo */
        width: 450px;
        max-width: 80vw;
        height: 510px;
        max-height: 80vh;
        
        & .spb-controls {
            top: -11px;
            right: -10px;
            
            & .spb_close {
                border: solid black 2px;
                font-size: 2em;
                padding: 0 7px 3px 7px;
                line-height: 1;
            }
        }
        
        & h2 {
            margin-top: 0;
        }
        
        & #block-bsreformes-formulairepourpopupbrevo {
            height: 100%;
            overflow: auto;
            & .field--name-body {
                height: 100%;
                & iframe {
                    width: 100%;
                    height: 100%;
                }
                & .sib-form, & #sib-container {
                    padding: 0;
                }
            }
        }
    }
    
    & .spb_bottom_right {
        bottom: 10%;
        right: 10px;
    }
}


/*******/

.btn-reformes,
.home2-wrapper .more-link a {
   font-size: 1rem;
   font-weight: 700;
   border-radius: 0;
   color: white !important;
   border-color: transparent !important;
   background-color: #00ADD3;
}
.btn-reformes:hover,
.home2-wrapper .more-link a:hover {
   background-color: #286090;
   text-decoration: none;
}
#home-video-wrapper .btn-reformes,
#home-archives-wrapper  .btn-reformes,
.path-alias-actu #home2-col-wrapper .btn-reformes,
.path-alias-tag-bernejurasoleure #home2-col-wrapper .btn-reformes {
   /*font-size: 1.3rem;*/
   width: 100%;
}
.btn-reformes-alt {
   border-color: #00ADD3 !important;
   background-color: transparent;
}
.home2-wrapper .more-link a {
   display: inline-block;
   padding: 6px 12px;
   margin-right: 15px;
   float: right;
}
#home2-col-wrapper .more-link a {
   float: none;
}

.photocredit-wrapper {
   position: absolute;
   right: 10px;
   top: 10px;
   font-size: 0.7rem;
}
/*.video-container .photocredit-wrapper {
   right: 55px;
}*/
.photocredit-wrapper .trigger {
   text-align: right;
   font-family: 'Playfair Display', serif;
   font-weight: 700;
}
.photocredit-wrapper .trigger .action {
   color: white;
   background-color: #00ADD3;
   padding: 4px 12px;
   display: inline-block;
   cursor: help;
}
.photocredit {
   display: none;
   background-color: rgba(192,192,192,0.8);
   color: black;
   margin-top: 0.5em;
   padding: 0.5em 1em;
   max-width: 275px;
}
.photocredit .caption {
}
.photocredit .credit {
   color: #00ADD3;
   font-weight: 600;
}

/* in-html images with photocredit */

.field--name-field-phtml.field--type-text-long img,      /* paragraphe de texte mis en forme, paragraphe html, paragraphe encadré */
.field--name-body.field--type-text-with-summary img      /* page content, sidebar block */
{
   /* JS ajoute légende */
   /* force img-responsive */
   /**display: block;**/
   max-width: 100%;
   height: auto;
}
.field--name-field-phtml.field--type-text-long .photocredit-wrapper,
.field--name-body.field--type-text-with-summary .photocredit-wrapper {
   display: none;
}
.image-container:hover .photocredit-wrapper {
   display: block;
}

/* pictos de type (video, audio, etc) */

.image-container .fa {
   position: absolute;
   left: 10px;
   top: 10px;
   font-size: 2rem;
   color: white;
   text-shadow: 3px 3px 5px black;
}
.image-container .picto-group {
   position: absolute;
   /*top: 30%;
   left: 30%;*/
}

/* search */

#search-form #edit-help-link {
   display: none;
}

.path-search nav.tabs {
   display: none;
}

/* tags */

.field--name-field-tags .field--item {
   display: inline-block;
}
.field--name-field-tags .field--item a {
   font-size: 1.2rem;
   font-weight: 600;
   display: block;
   border: solid 1px #95989a;
   padding: 5px 13px;
   color: black;
   margin-right: 1em;
   margin-bottom: 10px;
   /*text-transform: capitalize;*/
}
.field--name-field-tags .field--item a::first-letter {
   /*text-transform: uppercase;*/
}
.field--name-field-tags .field--item a:hover {
   color: white;
   background-color: #00ADD3;
   text-decoration: none;
}

/* flux */

.region-content .feed-icons {
   display: none;
}
.region-topbar .feed-icons {

}

/* filets */

.simple-filet {
   border-top: solid 1px black;
   margin-bottom: 5px;
}

.double-filet {
   border-top: solid 1px black;
   border-bottom: solid 1px black;
   margin-bottom: 5px;
   padding-top: 5px;
}

/* social icons */

/* région "normale" via page->région->bloc */
.region-social-icons {
   background: white;
   padding: 25px;
   margin-bottom: 2em;
}
.region-social-icons img {
   padding: 0 15px 0 0;
   max-width: 60px;
}

/* .social-tools lorsque render spécifique par un content-type */
.article.full .social-tools a, .article.full .social-tools a img,
.comm.full .social-tools a, .comm.full .social-tools a img,
.deformes.full .social-tools .a2a_autodata a, .deformes.full .social-tools .a2a_autodata a img, {
   display: inline;
}
.article.full .social-tools a img,
.comm.full .social-tools a img {
   padding: 0 15px 0 0;
   margin-bottom: 30px;
   max-width: 60px;
}

/* colorbox */

#cboxTitle {
   font-size: 0.75rem;
}

.field--name-field-pphoto {
   overflow: hidden;
}
a.galerie img:hover, div.galerie a img:hover, p.galerie a img:hover {
   transform: scale(1.07);
   transition: transform 0.25s;
}
a.galerie .image-container img {
   width: 100%;
}

#cboxTitle {
   background-color: #e6e5e5;
}

/* webform */

form.webform-submission-form div[role="status"] {
   display: none;
}

/* simple popup blocks */

#block-views-calendrier-avant-2019-block-1 {
   display: none;
}

.block-views-calendrier-avant-2019-block-1-modal .spb_center {
   width: 1000px !important;
   margin-left: -500px;
   margin-top: -310px;
}

.spb_overlay { 
   background-color: rgba(0, 0, 0, 0.7);
}

/* misc */

.view-empty {
   text-align: center;
   margin: 3em 0;
}

.captcha {
   margin-bottom: 15px;
}

.path-taxonomy nav.tabs,
body.path-alias-actu nav.tabs,
body.path-alias-communiques nav.tabs,
/*body.path-alias-blogs nav.tabs,*/
body.path-alias-tag-bernejurasoleure nav.tabs,
/*body.path-alias-deformes nav.tabs*/ {
   display: none;
}

nav.pager-nav {
   clear: both;
}

.bloc-pos-error {
   padding: 2em;
   border: solid 1px #ff0000;
   margin: 2em 1em;
}

.nav-tabs {
   border-bottom: 0 none;
}

li.block-configure a {
   color: #FF9696 !important;
}

.is-unpublished {
   border: dashed 5px #00ADD3;
}
.is-unpublished:before {
   content: "non-publié";
   position: absolute;
   right: -5px;
   top: -5px;
   color: white;
   background-color: #00ADD3;
   padding: 5px 10px;
   border-bottom: 2px solid white;
   border-left: 2px solid white;
   z-index: 100;
}

/* ces types n'existent pas en full, full est une sorte de preview */
article.shortcomm.full,
article.short.full {
   border: dashed 5px #00ADD3;
}
article.shortcomm.full:before,
article.short.full:before {
   content: "prévisualisation";
   position: absolute;
   right: -5px;
   top: -5px;
   color: white;
   background-color: #00ADD3;
   padding: 5px 10px;
   border-bottom: 2px solid white;
   border-left: 2px solid white;
   z-index: 100;
}

.region-content .content > span.a2a_kit {
   display: none;
}

p.text-align-center > div.image-container {
   text-align: center;
}
p.text-align-center > div.image-container > img {
   margin: 0 auto;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
   background-color: #00ADD3;
   border-color: #00ADD3;
}

.block-aggregator .more-link {
   display: none;
}

.block-aggregator > ul li {
   list-style: none;
}
.block-aggregator > ul li .source {
   color: #00ADD3;
}
.block-aggregator > ul li a {
   display: block;
}

/* more blogs */

/*.more-blogs .more-link {
   text-align: center;
   clear: both;
   padding: 30px 0 0 0;
}*/

/*.more-blogs .more-link a {
   padding: 15px;
   border-top: solid 1px #95989a;
   color: #337ab7;
}*/

/* newsletter form fixes */

form.mailchimp-signup-subscribe-form .form-group:last-child {
   margin-bottom: 15px;
}

/***************************************************/
/*
 *
 * editor styles (when shown on page)
 *
 */

.ck-float-left {
}

.ck-float-right {
}

.ck-subtitle {
   font-weight: bold;
   font-size: 130%;
}

.ck-huge {
   font-weight: bold;
}

.ck-two-cols {
   /*md+ : column-count: 2;*/
}
.ck-three-cols {
   /*md+ : column-count: 3;*/
}

.ck-responsive img,
img.ck-responsive,
.ck-fullwidth img,
img.ck-fullwidth,
.ck-float-left img,
.ck-float-right img
{
   display: block;
   max-width: 100%;
   height: auto;
}

img.ck-fullwidth,
.ck-fullwidth img {
   width: 100%;
}

.box-eglise {
   background-color: lightgrey;
   margin-left: -15px;
   margin-bottom: 15px;
}
.box-banner {
   width: 100%;
}
.box {
   padding: 10px;
   position: relative;
}
.box-content {
   width: 75%;
   float: left;
   padding-right: 10px;
}
.box-logo {
   width: 25%;
}


/***************************************************/
/*
 * Bootstrap media queries / responsive overrides
 *  large: 1200+
 *  medium: 992+
 *  small: 768+
 *  xsmall: 767-
 */

/* xs + sm + md */
@media (max-width: 1199px) {
   .home-edito .title,
   .home2-subbanner .title {
      line-height: 1;
   }
   .paragraph--type--encadre .encadre-primary {
      position: relative;
      left: 0;
      float: left;
      /*width: 210px;*/
      width: inherit;
      max-width: 30vw;
      padding: 5px;
      background-color: #e4e0d7;
      border: 1px solid #95989a;
      margin: 0 10px 5px 0;
   }
   .paragraph--type--encadre .encadre-primary > .fa {
      color: #00ADD3;
      background: white;
      border-radius: 50%;
      position: absolute;
      right: -7px;
      top: -7px;
   }
}

/* xs + sm */
@media (max-width: 991px) {
   .article.full > .content {
      margin: 0;
   }
   .region-subcontent-audiovideo > section {
      margin-left: 0;
      margin-right: 0;
   }
   .sidebar-listing .source-date {
      top: 0;
   }
   .node.listing-alt .title {
      left: 0;
   }
   .reperage.listing-alt .title {
      left: 10px;
   }
   
   .cloitres.listing .field--name-field-chapeau {
      height: 3em;
   }
}

/* sm + md */
@media (min-width: 768px) and (max-width: 1199px) {
   .node.listing-alt .title {
      font-size: 1rem;
      line-height: 1.2;
   }
   .dossier.listing-alt .title span {
      font-size: 1.75rem;
   }
}

/* >xs */
@media (min-width: 768px) {
   .main-container .region-content {
      min-height: 400px;
   }
   .main-container .region-content article { /* pour faire joli que le beige soit assez haut */
      min-height: 500px;
   }
   .path-alias-blogs .main-container .region-content,
   .path-alias-blogs .main-container .region-content article {
      min-height: unset;
   }
   .home-banner .title-subtitle,
   .home2-banner .title-subtitle,
   .home2-subbanner .title-subtitle {
      max-width: 90%;
   }
   .home-subbanner .accroche {
      height: 62px;
   }
   .region-home-subbanner-eglises > div:first-child {
      padding-top: 8px;
   }
   .comm.home-subbanner {
      margin: 10px 0 0 0;
   }
   #home-video-wrapper,
   #home-dossier-wrapper,
   #home-archives-wrapper {
      /*diagonal border-cut */
      clip-path: polygon(0% 0%, 100% 40px, 100% 100%, 0 100%);
   }
   #home-video-wrapper {
      padding-top: 3.5em;
   }
   #home-dossier-wrapper {
      padding-top: 2em;
   }
   #home-archives-wrapper {
      padding-top: 2em;
   }
   #home-more-wrapper {
      /* bottom diagonal border-cut, doit correspondre au cut du bloc en-dessous => bricolage padding+margin */
      clip-path: polygon(0% 0%, 100% 0, 100% 100%, 0 calc(100% - 40px));
      /* 3ème point: calc(100% - 50px), un calc et pas -Zpx, car -Zpx donne un point AU-DESSUS du bord supérieur */
      padding-bottom: 4em;
      margin-bottom: -2.5em;
   }
   .home-edito {
      border: solid 1px #95989a;
      background-color: white;
   }
   .home-edito .right {
      position: absolute;
      top: 0;
      left: 50%;
      width: 50%;
      height: 100%;
      padding: 0 5px;
   }
   .home-edito .right .source {
      position: absolute;
      bottom: 5px;
   }
   #home2-content1-wrapper {
      /*diagonal border-cut */
      padding-top: 0.5em;
      clip-path: polygon(0% 0%, 100% 25px, 100% 100%, 0 100%);
      /* 3ème point: calc(100% - Zpx), un calc et pas -Zpx, car -Zpx donne un point AU-DESSUS du bord supérieur */
   }
   .home-dossier .title span {
      font-size: 2.25rem;
   }
   
   .cloitres.home-subbanner .image-container {
      width: 50%;
      float: left;
      margin-right: 10px;
   }
   .cloitres.home-subbanner .image-container img {
      max-height: 292px;
      object-fit: cover;
      object-position: center bottom;
   }
   
   
   .article.full .field--name-field-paragraphs,
   .article.full .field--name-field-tags {
      margin-right: 1em;
   }
   .region-content article.source.full {
      padding: 30px 45px;
   }
   .questiondieu.home-edito .question {
      font-size: 1.2rem;
   }
   body.page-node-type-source .region-subcontent-1 {
      padding: 30px 45px;
   }
   .region-content article.page.full {
      padding: 30px 2em;
   }
   body.page-node-type-page .region-subcontent-1 {
      padding: 30px 2em;
   }
   .page-node-type-dossier #banner-wrapper .field--name-field-image img {
      min-height: 500px;
   }
   .page-node-type-dossier .banner-data-wrapper .keyword-chapeau,
   .dossier.full .keyword-chapeau {
      color: white;
   }
   .author .author-portrait {
      position: relative;
      left: -15px;
   }
   .ck-float-left, .ck-float-right {
      max-width: 75%;
      margin: 10px;
   }
   .ck-float-left {
      float: left;
   }
   .ck-float-right {
      float: right;
   }
   .ck-huge {
      font-family: "Playfair display";
      font-size: 5rem;
      font-weight: normal;
      line-height: 1;
   }
}

/* md + lg */
@media (min-width: 992px) {
   .sidebar-listing .col-md-7 {
      padding-left: 0;
   }
   .page-all-dossiers #banner-wrapper {
      max-height: 55vh;
   }
   .page-all-dossiers .banner-data-wrapper .title {
      font-size: 5.5rem;
   }
   .page-all-dossiers .banner-data-wrapper .colombe {
      top: -75px;
      width: 110px;
   }
   
   .home-subbanner .title a {
      height: 2.8rem;            /* fixed height, arrrrg */
      overflow: hidden;
   }
   .home-subbanner .keyword-accroche {
      height: 7.35rem;           /* fixed height, arrrrg */
      /*overflow: hidden;*/
   }
   .comm.home-subbanner .image-container {
      width: 50%;
      float: left;
      margin-right: 10px;
   }
   .comm.home-subbanner .title a {
      height: 5.23rem;            /* fixed height, arrrrg */
   }
   .shortcomm.home-subbanner .title a {
      height: 2.8rem;             /* fixed height, arrrrg */
   }
   .shortcomm.home-subbanner .keyword-accroche {
      height: 6.37rem;            /* fixed height, arrrrg */
      /*overflow: visible;*/
   }
   .region-home2-content1 .shortcomm.home-subbanner .keyword-accroche {
      height: 8.5rem;            /* fixed height, arrrrg */
   }
   
   #home-dossier-big-wrapper {
      margin-right: -15px;
   }
   #home-dossier-mini-wrapper {
      margin-left: -28px;
   }
   .region-home-dossier-mini .home-dossier .field--name-field-keyword {
      text-align: right;
   }
}

/* lg only */
@media (min-width: 1200px) {
   .home-cats .title {
      top: 50%;
      left: 25%;
      max-height: 45%;
   }
   .home-edito .field--name-field-keyword {
      margin: 0.5em 0 0.3em 0;
   }
   .home-edito .right .source {
      bottom: 10px;
   }
   
   .region-home2-content1 .shortcomm.home-subbanner .keyword-accroche {
      height: 7.5rem;            /* fixed height, arrrrg */
   }
   
   .arrow {
      font-size: 3rem;
   }
   .arrow-left {
      left: -1.5rem;
   }
   .arrow-right {
      right: -1.5rem;
   }
   
   .short.home2-subbanner .title,
   .shortcomm.home2-subbanner .title {
      overflow: hidden;
      max-height: 3rem;
   }
   .short.home2-subbanner .keyword-body,
   .shortcomm.home2-subbanner .keyword-body {
      overflow: hidden;
      height: 4.5rem;            /* fixed height, arrrrg */
   }
   
   .indossier-listing .title {
      left: -15px;
      position: relative;
      height: 5.2em;
      overflow: hidden;
      font-size: 1.1rem;
   }
   .indossier-listing .keyword-accroche {
      /*height: 6em;
      overflow: hidden;*/
   }

   .page-node-type-story .sidebar {
      top: 30px;
   }
   .page-node-type-story .sidebar .cornered {  }
   .page-node-type-story .sidebar .content {
      padding: 10px 20px 14px 10px;
   }
   .page-node-type-story .sidebar .field--name-field-keyword {
      top: 10px;
   }
   .page-node-type-story .sidebar .title {
      font-size: 1.1rem;
   }

   .ck-two-cols {
      column-count: 2;
   }
   .ck-three-cols {
      column-count: 3;
   }
   
   /* gros hack : en LG passe en 14 colonnes au lieu de 12 => on arrive à placer 7 blocs col-lg-2 */
   #footer .col-lg-2 {
      width: 14.2857142857%;
   }
   #footer .col-lg-6 {
      width: 42.8571428571%;
   }
   /* gros hack en dur : les blocks 1, 2 et 7 masquent leur titre en LG :-( */
   /* non car c'est moche dixit S.
   .region-footer #block-cer h2,
   .region-footer #block-cer2 h2,
   .region-footer #block-apropos h2 {
      display: none;
   }
   .region-footer #block-cer .field--name-body,
   .region-footer #block-cer2 .field--name-body,
   .region-footer #block-apropos .field--name-body {
      margin-top: 20px;
   } */
}

/* md only */
@media (min-width: 992px) and (max-width: 1199px) {
   html, body {
      font-size: 18px;
   }
   .menu-container {
      width: 250px;
   }
   .ck-two-cols {
      column-count: 2;
   }
   .ck-three-cols {
      column-count: 2;
   }
}

/* sm only */
@media (min-width: 768px) and (max-width: 991px) {
   html, body {
      font-size: 16px;
   }
   .menu-container {
      width: 220px;
   }
   .home-banner .title {
      font-size: 2.5rem;
   }
   .home-banner .field--name-field-subtitle {
      font-size: 1.5rem;
   }
   .home-dossier .right {
      width: 50%;
      left: 50%;
      padding: 0.5em;
   }
   .home-dossier .right .title {
      width: 95%;
   }
   
   .block-views-calendrier-avant-2019-block-1-modal .spb_center {
      width: 600px !important;
      margin-left: -300px;
      margin-top: -200px;
   }
}

/* xs only */
@media (max-width: 767px) {
   html, body {
      font-size: 14px;
   }
   .path-frontpage img.img-responsive {
      width: 100%;
   }
   .topbar-center img.logo {
      width: auto !important;
   }
   .topbar-center {
      text-align: left;
      margin: 0;
   }
   .topbar-center .logo {
      margin: 0;
   }
   #menu-overlay {
      top: 0 !important;
      height: 100vh;
      width: 100vw;
   }
   .menu-container {
      width: 90vw;
   }
   #toolbar-administration {
      /*display: none;*/
   }
   .menu-container {
      padding-bottom: 0;
   }
   #home-banner-wrapper .container-fluid {
      padding: 0;
   }
   .home-banner .title-subtitle,
   .home2-banner .title-subtitle,
   .home2-subbanner .title-subtitle {
      padding: 1em 1.5em 0.75em 0.75em;
      bottom: 0;
      max-height: 100%;
   }
   .deformes.home2-banner .title-subtitle {
      max-height: 100%;
   }
   .home-banner .title {
      font-size: 2rem;
   }
   .home-banner .field--name-field-subtitle {
      font-size: 1.25rem;
   }
   #home-subbanner-journal-wrapper,
   #home-subbanner-actu-wrapper {
      margin-bottom: 15px;
   }
   .region-home-subbanner-journal > div:nth-child(2), 
   .region-home-subbanner-journal > div:nth-child(3) {
      display: none;
   }
   .region-home-subbanner > div:nth-child(3) {
      display: none;
   }
   .region-home-subbanner-eglises > div:nth-child(2),
   .region-home-subbanner-eglises > div:nth-child(3), 
   .region-home-subbanner-eglises > div:nth-child(4) {
      /*display: none;*/   /* TODO : une fois mag de la quarantaine supprimé, réactiver ce masquage */
   }
   .comm.home-subbanner {
      border-bottom: solid 1px #95989a;
      margin-bottom: 10px;
      padding-bottom: 10px;
   }
   .home-dossier .left {
      width: 100%;
   }
   .home-dossier .right {
      width: 100%;
      position: relative;
      left: 0;
   }
   .home-dossier .right .title {
      position: relative;
      left: 0;
      width: 100%;
      transform: translate(0,0);
   }
   #home-more-wrapper .block {
      margin-bottom: 15px;
   }
   
   .questiondieu.home-edito .content {
      background-image: none;
   }
   .questiondieu.home-edito .question {
      margin: 0 10% 0 15%;
   }
   .questiondieu.home-edito .link {
      width: 80%;
   }
   
   .region-home-more-1 .view-reperages .view-content .views-row:first-child .reperage.listing-alt .title {
      top: 35px;
   }
   
   .article.full .field--name-field-soundembed {
      top: 0;
   }
   .article.full .field--name-field-soundembed:has(.ausha) {    /* :has(x) filtre élément qui a 'x' dans ses enfants */
      position: unset;
   }
   .article.full .audio-container:has(.ausha) .field--name-field-image {
      display: none;
   }
   .article.full .audio-container .field--name-field-soundembed iframe.ausha {
      min-height: 500px !important;
   }
   
   .article.full .field--name-field-category {
      left: 1.5em;
   }
   .page-node-type-story .social-tools {
      margin-top: 0;
   }
   .dossier.listing-alt .title span {
      font-size: 1.5rem;
   }
   .gallery.asparagraph .field--name-field-paragraphs .field--item img {
      max-width: 55vw;
   }
   .paragraph--type--encadre .encadre-primary {
      float: none;
      width: 100%;
      max-width: 100%;
      margin: 5px 0;
   }
   #cboxPrevious, #cboxNext {
      display: none !important;
   }
   
   /* hide le double-titre CER en XS */
   .region-footer .block:nth-child(2) h2 {
      display: none;
   }
   
   .block-views-calendrier-avant-2019-block-1-modal .spb_center {
      width: 90% !important;
      margin-left: 0;
      margin-top: 0;
      top: 5%;
      left: 5%;
   }
}