/**
 * Ce fichier contient les styles CSS qui s'appliquent au site public, version customisée par Soja pour Café
 */
 

/* CSS RESET */

:root {
    --bg-color: #fff;
    --cafe-color: #D95995;
    --next-cafe-color: #b99477;
    --text-white: #fff;
    --text-black: black;
    --text-grey: #3d3d3d;
    --text-red: #e30613;
    --green-futurs: #49a751;
    --yellow-silence: #f1b727;
    --blue-naufrage: #2f4a9b;
    --grey-double: #b2b2b2;
    --purple-oubli: #7e5dae;
    --orange-feu: #f07f3c;
    --pink-resistances: #D95995;
    
}


body, form, p, div, hr, fieldset, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6 {
    margin: 0;
    padding: 0;
    font-family: 'Noto Sans';
}


h1 {
    font-family: 'Noto Sans'; /* noto sans bold */
    font-weight: bold;
    font-size: 0.9375 rem; /* 15pt is approximately 0.9375rem (15/16) */
}

h2  {
    /* noto sans condensed bold */
    font-size: 1 rem;  /* 12pt */      
    }

h3  { 
    /* noto serif semi condensed semi bold */
    font-size:  0.917 rem;  /*11pt*/
    }
    
    
h4  {     
    /* noto serif semi condensed semi bold */
    font-size: 0.625 rem; /*7,5pt*/
    }
    
p {    
    /* noto serif regular */
    color: #3d3d3d;

    font-size: 0.667 rem; /*8pt*/

}
    
h5  { font-size: 0.9em; }
h6  { font-size: 0.8em; }
ul, ol { list-style-type: none; }
aside, figure, footer, header, hgroup, menu, nav{ display: block; }

hr {
    display: block;
    border: 0;
    border-top: 0.1rem solid white;
    padding: 0;
}

/* DISPOSITION GÉNÉRALE DE LA PAGE */
    main {
        max-width: 100%;
        display: block;
    }
    
        
/* CORPS */

* {
  font-family: 'Noto Sans';
}

body {
    font-size: 100.00%;
    font-family: 'Noto Sans';
    background: #fff;  
    min-height: 100%;
    color: #000;
    --bg-color: #fff;
    --cafe-color: #D95995;
    --text-grey: #3d3d3d;
    --bg-grey:  #f3f5f7;
    --text-red: #e30613;
    --green-futurs: #49a751; 
    height: 100%;
   }

.page-wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100vh; /* Ensure the wrapper takes at least the full height of the viewport */
}

main {
    flex: 1; /* This makes the main area flexible and take available space */
}



a {
    color: var(--cafe-color);
    text-decoration: none;
}

a:hover {
    color: var(--cafe-color);
    text-decoration: underline;
}

/* COMMON */

.cafe-issue-title {
    font-weight: bold;
    font-size: 1.5rem;
    font-family: 'Noto Sans';  
}


/* HEADER */ 

   .layout-1col header{
       display: flex;
       justify-content: center;
        background-color: var(--bg-color);
        margin: 2rem 0rem;

    }

    .layout-1col header h1 a img {
        width: 100%;     
        height: auto;
    }   
        
     .layout-1col header-test{
         display: flex;
        position: relative;
        background-color: var(--bg-color);
        height: 225px;
        margin: 2rem 15rem;
        align-items: flex-end;
        justify-content: flex-end;
    }   
    

    
/* MENU */
    .menu-top {
        display: flex;
        gap: 1rem; 
        font-weight: bold;
        }

    .menu-top li a {
        color:black;
        text-decoration: none;
    }
    
    .menu-top li a:hover {
        color: var(--cafe-color);
        cursor: pointer;
    }

     .header-logo {
        position: absolute;
        top: 50%;
        left: 50%;    
        transform: translate(-50%, -50%);   
        }
            
    .layout-1col nav.main {
        padding-top: 1rem;
        margin: 0rem 15rem;
        background: none;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        background-color: var(--cafe-color)  ; 
    }

    .layout-1col nav.main .subcategories {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
        gap: .5 rem;
    }

    .layout-1col nav.main .subcategories li a {
        border: none;
        font-family: 'Noto Sans';
        font-weight: bold;
        font-size: 0.9375rem; /* 15pt is approximately 0.9375rem (15/16) */
        color: white;
    }
    
    
    .layout-1col nav.main .subcategories li a.current {
        text-decoration: underline;
        color: var(--second-color);
    }
    
    .layout-1col nav.main .subcategories li a:hover {
        color: var(--hover-link-color);
        background: inherit;
    }
    
/* ARTICLES MENU */

.subcategories-in-articles {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    align-items: center;
    justify-content: center;
    margin-top: 1rem;
    margin-bottom: 3rem;
}

.subcategories-in-articles ul li {
    display: flex;
    align-items:center;
    background-color: var(--bg-grey);
    width: 14rem;
    padding: 0.5rem 4rem;
    color: var(--cafe-color);


}


    
/* PAGE FEUILLETER */

.feuilleter {
    margin: 0rem 20rem;
    padding-bottom: 4rem;
}

.feuilleter .intro {
    padding: 2rem 0rem;
}

.intertitle {
    color: var(--cafe-color);
    font-weight: bold;
    border-bottom: 0.5rem solid;
    margin-top: 2rem;
}

.issue-container {
    display: flex;
    flex-direction: column; 
    margin-top: 1rem;
    gap: 1rem;
}

.issue-row {
    display: flex;     
    gap: 1rem;
}

.issue-row img {
    width: 15rem;
    height: 20rem;
    object-fit: cover;
}

.issue-bg {
    background-color: var(--bg-grey);
    height: auto;
    width: calc(33%);
    padding-bottom: 1rem; 
    padding: 1rem;  
    display: flex;
    flex-direction: column;
    align-items: center;
    color: var(--cafe-color);
}

.one-issue {
    width: calc(28%);
}

.issue-bg:hover {
    filter: brightness(0.9);
    color: var(--cafe-color);
}
.issue-subtitle {
    margin-top: 1rem;     
    display: flex;
    align-items: center;
    justify-content: center;
}

.issue-bg a{
    text-decoration: none;
}


/* PAGE LIBRAIRIES */ 

.librairies {
    margin: 0rem 20rem;
    padding-bottom: 4rem;

}

.intro-librairies {
    margin-bottom: 2rem;
}

.city {
    color: var(--cafe-color);
    font-weight: bold;
    border-bottom: 0.5rem solid;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

.librairies-group {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.city-block {
    margin-bottom: 1.5rem; 
}

.librairies-columns {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    margin-top: 2rem;
}

/* APPEL A TEXTES */

.call {
    margin: 2rem 0rem;
    display: flex;
    justify-content: center;
}

.call-img {
    max-width: 100%;
}

/* CUSTOM COLORS CAFE  */

.latest-color {
    color: var(--cafe-color);
}

.cafe-noir {
    font-size: 1.5rem;
    font-family: 'Noto Sans';  
}

.cafe-noir-bg {
    background-color: black;
}

.green-futurs  {
    color: var(--green-futurs);
}

.green-futurs-bg {
    background-color: var(--green-futurs);
}

.yellow-silence  {
    color: var(--yellow-silence);
}

.yellow-silence-bg {
    background-color: var(--yellow-silence);
}

.blue-naufrage {
    color: var(--blue-naufrage);
}

.blue-naufrage-bg {
    background-color: var(--blue-naufrage);
}

.grey-double {
    color: var(--grey-double);
}

.grey-double-bg {
    background-color: var(--grey-double);
}

.purple-oubli {
    color: var(--purple-oubli);
}

.purple-oubli-bg {
    background-color: var(--purple-oubli);
}

.orange-feu {
    color: var(--orange-feu);
}

.orange-feu-bg {
    background-color: var(--orange-feu);
}

.pink-resistances {
    color: var(--pink-resistances);
}

.pink-resistances-bg {
    background-color: var(--pink-resistances);
}

/* PAGES CUSTOM NUMEROS CAFE*/

.custom-article {
    font-size: 0.5rem;
    margin: 2rem 15rem;
    background: none;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    text-align: center;
    justify-content: center;
    font-size: 1rem;
}

.text-list {
    align-items: center; 
}

.custom-header-container {
    background-color: var(--bg-grey);
    margin-top: 2rem;
}

.custom-header {
    display: flex;
    gap: 1.5rem;
    position: relative;
    margin: 2rem 20rem;
    gap: 4rem;
    padding: 2rem 0rem;
}

.custom-header img {
    width: 15rem;
    height: 20rem;
    object-fit: cover;
}

.custom-pres-container {
    margin: 2rem 0rem;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.custom-pres-text {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.custom-article span {
    margin-top: 1rem;
}

.custom-order {
    background-color: white;
    text-decoration: none;
    color: var(--cafe-color);
     padding: 0.5rem 1rem;
    align-self: flex-start;
}

.custom-title {
    font-size: 3rem !important;    
}

.custom-article .custom-presentation {
    margin-top: 1rem;
    text-align: left;
}

.custom-article img {
    padding-top: 1rem;
}

.text-display {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.custom-article .text-title {
    margin-top: 1rem;
    text-align: left;
}


.long-title {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.long-title span {
    margin-top: 0rem;
}
.custom-article .text-title-italic {
    font-weight: bold;
}


.custom-article .text-subtitle{
    text-align: left;    
}

.cafe-map {
    display: flex;
    justify-content: center; 
    padding: 2rem 0rem;   
}

.cafe-map img {
    width: 40rem; 
    height: auto;
    object-fit: cover; 
}

.no-packshot {
    margin-bottom: 4rem;
}

.packshot-container {
    display: flex;
    justify-content: center;
    margin: 2rem 0rem;

}

.packshot {
    width: 70%;
}

.packshot-top {
    width: 100%;
    display: block;
    margin-bottom: 1rem;
}

.packshot-row {
    display: flex;
    justify-content: space-between;
}

.packshot-left {
    width: 66.67%; 
    margin-right: 1rem; 
}

.packshot-left img {
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
}

.packshot-right {
    width: 33.33%;     display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: auto; 
}

.packshot-right img {
    width: 100%; 
    height: 50%; 
    object-fit: cover; 
    margin-bottom: 1rem;
}

.packshot-right img:last-child {
    margin-bottom: 0;
}



.collection-presentation {
    padding-left: 19rem;
    padding-right: 19rem;
    margin-top: 2rem;
    margin-bottom: -4rem;
}

/* PODCAST */
        
.podcast {
    display: flex;
    margin: 0rem 15rem 2rem 15rem;
    flex-direction: column;
}

.podcast-subtitle {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.podcast-credits {
    margin-top: 1rem;
    margin-bottom: 1rem;
}
    

/* LISTE DES CATÉGORIES RACINES */

section.subcategories {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-top: 2rem;
}

section.page .subcategories li {
    font-size: 1.2em;
    margin: .8em 0;
    padding: 0;
}

.subcategories li a {
    margin: 0;
    padding: .2em .5em;
    color: black;
    text-decoration: none;
    background: var(--button-color);
    display: inline-block;
    transition: background-color .2s, color .2s;
}

.subcategories li a:hover {
    color: var(--text-black);
}

nav.main .subcategories {
    margin: 0 -1em 1em -1em;
}

nav.main .subcategories li {
    margin: 0;
}

nav.main .subcategories li a {
    padding: .5em 1em;
    display: block;
    border-radius: 0;
    border-bottom: 2px solid hsl(var(--first-color), 50%, 85%);
    background: none;
}

section.page .subcategories li a {
    background: var(--bg-color);
}

section.page .subcategories li a:hover, nav.main .subcategories li a:hover {
    color: var(--hover-link-color);
    background-color: #eee;
    background-color: hsl(var(--second-color), 50%, 90%);
}

/* PAGE D'ACCUEIL */

.layout-1col .main-image {
    padding-top: 2rem;
    background: none;
    max-width: 100%;
    height: auto;
    margin: 0rem 15rem;
}

.main-image img {
  width: 100%;
  height: auto;
}

.presentation {
    margin: 1rem 20rem;   
}

.presentation-text {
    margin-top: 0.5rem;
    }
    
.latest {
    margin: 3rem 20rem;
    display: flex;
    gap: 1.5rem;
    position: relative;

}

.latest-img {
    flex: 1;
}

.latest-text {
    flex: 3;
}

.latest img {
    height: auto;
    width: 200px;
}    

.latest-title-2 {
    color: var(--cafe-color);
    font-family: 'Noto Sans';
    font-weight: bold;
    font-size: 3rem;
}

.latest-paragraph {
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    position: relative;
    padding-top: 1rem;

}

.latest-paragraph::before {
    content: "";
    position: absolute;
    top: 0;
    left: -35rem; 
    right: -21.5rem;
    bottom: 0;
    background-color: var(--bg-grey);
    z-index: -1; 
    height: 100%; 
    padding: 1rem 0rem;
}



/* PIED DE PAGE */

footer.main {
    color: var(--text-color);
    background-color: var(--cafe-color);
    display: flex;
    flex-direction: column;
}

footer.main .footer-row{
    padding: 0rem 20rem;
    display:flex;
    justify-content: space-between;
    gap: 20%;
    margin: 2rem 0rem;
}


.footer-col{
    display: flex;
    flex-direction: column;
    justify-content: start;
    gap: 0.5rem;
} 

.footer-row li {
    margin-top: 0.5rem;
    cursor: pointer;
}

.footer-row li:hover {
    color: var(--text-grey);
    
}

.social {
    display: flex;
    gap: 1rem;
    align-items: center;

}
.social img {
    width: 1.2rem;
    filter: brightness(0) invert(1);
}

.social img:hover{
    filter: brightness(1) invert(0);
}

.svg-icon:hover {
    fill: var(--text-grey);
  }
  
.right-col {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

footer.main a {
    text-decoration: none;
    color: white;    
}

footer.main a:hover {
    color: var(--text-grey);
}

.footer-bottom {
    text-align: center;
    font-size: 0.9em;
    color: white;
    margin: 1rem 0rem;
}

.footer-admin {
    margin-top: 0.5em;
    justify-content:center;
    gap: 1rem;  
    font-size: 0.8em;  
    display: flex;
    flex-direction: column;
}

.footer-admin img {
    width: 2.5rem;
}

footer.main a#paheko {
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAWBAMAAABTd4N3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAADBQTFRFBUqmR3BMAwl4KZDEBD2dATCVBy+TJU6mC2y1BCWU/v//m7jbUXC3c53NvtPp3ur1QHGW/AAAAAh0Uk5T/gD6+WqzLO5BK691AAABR0lEQVQY02MQhAKRcIbyECDNAOMrMXR0dLTABcSCJnAABTjLYAIOmkB+swUDO1QglXNG8yogWHcgECwgwjCT23jXqvX/V61hY3BJFHPVnFnAd6N/1QOGU+tZGCJncirNPHmu7wfvqscW3avaGTKBApUPTp1e27HqRUfvqgMMohNqzux4W7VnNcevFx28qxoYRCZVnr59ftbn/x2vXnT0r2dgEFSaW8MzV+dAb8erv7d/rWFnEHTS3HOaW/vl645XQIfcYGUQFFVg+LOvau9q41+/d99gYGEQFNNk2LTmVv1i41UvOGfOnAZ0adLMOTdfn3psu+oFw8yZIKeLTZqj9GDX5b5VDzo4ZzqC/JKkpDTztYUV0GEdrRDfBikpXQBa8qJhgiFEQCxy5kyGu3cvW7DCQkwkknMCR7OxsSMiTFNCmY1NEoEMABmgiBzVXBbdAAAAAElFTkSuQmCC") no-repeat left center;
    min-height: 22px;
    display: inline-block;
}



/* CHEMIN VERS L'ARTICLE (BREADCRUMBS), affiche les catégories parentes */
.breadcrumbs {
    margin-bottom: 1em;
    text-align: center;
}

/* BRICOLAGE POUR AFFICHER UNIQUEMET LE DEUXIEME BREADCRUMB*/
.breadcrumbs a {
    display: none;
}

.breadcrumbs a:nth-of-type(2) {
    display: block; 
    text-decoration: none;
}

.breadcrumbs a:nth-of-type(2):hover {
   color: var(--text-grey);
}

/* MESSAGES ALERTE ET ERREUR (par exemple : page non trouvée) */
.error {
    border-bottom: .2em solid #c00;
    border-radius: .5em;
    background: #fcc;
    padding: .5em;
    margin-bottom: 1em;
    font-size: 1.2em;
    color: #900;
}

.alert {
    border-bottom: .2em solid #cc0;
    border-radius: .5em;
    background: #ffc;
    padding: .5em;
    margin-bottom: 1em;
    font-size: 1.2em;
    color: #660;
}

/* AFFICHAGE D'UN ARTICLE */

.category-title{
    display: flex;
    justify-content: center;
}

 article.single {
    margin: 3rem 20rem;
    background: none;

 }
 
 .articles {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;   
    flex-wrap: wrap; 
    margin: 3rem 20rem 0rem 20rem;

  }

.layout-1col section.articles article {
    //padding-bottom: 1em;
   // border-bottom: 2px solid var(--gray-text-color);
   
}

section.articles article h1 {
    margin-bottom: .3em;
    color: #660;
}

section.articles article h3 {
    color: var(--cafe-color);
    border-bottom: 0.5rem solid;
    margin-bottom: 1rem;
    
}

section.articles article::after, article.single::after {
    content: "";
    display: block;
    height: 0px;
    clear: both;
}

section.articles article h1 a {
    color: var(--text-color);
    text-decoration: none;
    font-weight: normal;
}

section.articles article h3 a {
    color: var(--cafe-color);
    font-weight: normal;
}

section.articles article h3 a:hover {
    text-decoration: none;
    color: var(--text-grey)  

}


section.articles article h5 {
    color: #666;
    font-weight: normal;
    font-size: .8em;
    margin-bottom: .3em;
}

section.page > h1 {
    margin-bottom: 1em;
    text-align: center;

}

/* CONTENU DE L'ARTICLE */
article > h4 {
    margin-bottom: 1em;
    color: var(--gray-text-color);
    font-weight: normal;
}

article ul, article ol, article blockquote {
    margin-left: 2em;
}

article ul {
    list-style-type: disc;
}

article ol {
    list-style-type: decimal;
}

article dl dd {
    margin: .5em 0 .5em 2em;
}

article img {
    max-width: 100%;
}

article figure {
    text-align: center;
}

article figcaption {
    font-style: italic;
    color: #666;
    margin-top: 2pt;
    font-size: .8em;
}

article > h1 {
    margin-bottom: 1rem;
}

.article-title {
    display: flex;
    align-items: baseline;
    gap: 1rem;
    color: var(--cafe-color);
    font-weight: bold;
    border-bottom: 0.5rem solid;
    margin-bottom: 1rem;
}

/* GALERIE D'IMAGES EN DESSOUS DE L'ARTICLE */
section.gallery, section.documents {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: 1rem;
    //margin: 1.5rem 0;
}

section.gallery figure, section.documents figure {
    max-width: 12rem;
    margin: 0;
    padding: 0;
}

section.gallery figure a, section.documents figure a {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: column;
    height: 100%;
}

section.gallery figure a img, section.documents figure a img {
    box-shadow: 0 0 5px 1px #999;
    border-radius: .25em;
    max-height: 150px;
    background: #fff;
    //margin: .5rem;
}

section.documents figure a {
    text-decoration: none;
    border-radius: .5em;
    background: hsl(var(--first-color), 50%, 90%);
}

section.documents figure a figcaption {
    background: no-repeat bottom right;
    margin: .5rem;
    border-radius: .5em;
    display: block;
    font-size: 1em;
    font-style: normal;
    color: #666;
    transition: background-color .2s, color .2s, box-shadow .2s;
}

section.documents figure a:hover {
    background-color: #eee;
    color: #333;
    box-shadow: 0px 0px 5px hsl(var(--first-color), 50%, 50%);
}

section.documents aside a:hover figcaption b {
    color: darkred;
}

section.documents figcaption b {
    display: block;
    font-size: 1.1em;
    text-decoration: underline;
    color: darkblue;
}

section.documents figcaption span {
    font-size: .8em;
}

/* FORMULAIRES */
fieldset {
    border: 2px solid var(--gray-text-color);
    border-radius: .5em;
    padding: 1em;
    margin: 1em;
}

fieldset legend {
    padding: 0 1em;
}

fieldset input, fieldset textarea, fieldset select {
    padding: .5rem;
    border: 1px solid #999;
    border-radius: .3rem;
    font-size: 1.2em;
}

fieldset input[type=submit] {
    background: #999;
    color: #fff;
    cursor: pointer;
}

input:focus, textarea:focus, select:focus, button:focus {
    outline: none;
    box-shadow: 0px 0px 5px 2px orange;
}

fieldset dl dd {
    margin: .5em 1em;
}

aside.admin {
    float: right;
    text-align: right;
    position: fixed;
    right: 1rem;
    top: .5rem;
}

aside.admin a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    background: #700;
    color: white;
    border-radius: 1rem;
    padding: .2rem .8rem;
    position: relative;
    border: 2px solid #eee;
}

aside.admin a[data-icon] span {
    font-size: 1rem;
    margin-left: .5rem;
}

aside.admin a[data-icon]::before {
    content: attr(data-icon);
    font-size: 2rem;
    line-height: .5em;
    display: inline-block;
    text-align: center;
}

aside.admin a[data-icon]:hover span {
    text-decoration: underline;
}


/* Modifications du style pour les écrans moyens */
@media handheld, screen and (max-width: 1350px) {
    
    .layout-1col header-test {
       flex-direction: column;
       gap: 1rem;
       margin: 2rem;
       align-items: center;
       justify-content: center;
    }
    
        .header-logo {
        position: static;
        transform: none;
        top: auto;
        left: auto;
    }
}
    
    
/* Modifications du style pour les petits écrans */
@media handheld, screen and (max-width: 980px) {
    
    
    body {
        padding: 0;
    }
    
/* GENERAL */

.s-hidden {
    display: none;
}

/* MAIN */ 
    
    .layout-1col header.main {
        margin-bottom: -7em;
    }
   

    .layout-1col header.main h1 a img {
        width: 100%;     
        height: auto;
    }
    
    
    .layout-1col header-test {
       flex-direction: column;
       gap: 1rem;
       margin: 2rem;
       align-items: center;
       justify-content: center;
    }
    
    .header-logo {
        position: static;
        transform: none;
        top: auto;
        left: auto;
    }


    header.main h1 a, header.main .contacts {
        border-radius: 0;
        margin: .2em 0;
        padding: 0;
    }

        

    header.main .contacts * {
        text-align: center;
        font-size: .8em;
    }

    .search-widget p {
        display: block;
        text-align: center;
    }

    .search-widget input {
        font-size: 1em;
    }


    section.page article {
        border-radius: 0;
    }

    .layout-1col nav.main {
        margin: 0rem 0rem;
        padding-bottom: 1rem;
    }
        

    section.page h1 { font-size: 1.5em; }
    section.page h2 { font-size: 1.3em; }
    section.page h3 { font-size: 1.2em; }
    section.page h4 { font-size: 1em; }
    section.page h5 { font-size: .9em; }
    section.page h6 { font-size: .8em; }
    
/* SUPPRESSION DES MARGES */

 .layout-1col .main-image, nav.main .subcategories, .custom-article, .call-text, .call-box, .call-contact, .librairies, .articles {
            margin: 0rem 0rem;
        }

/* FOOTER */

    footer.main {
        font-size: .8em;
    }
    
    footer.main .footer-row {
        gap: 1rem;
        padding: 0rem 2rem;
        flex-direction: column;
        align-items: center;
    }
/* ACTU */ 

.articles {
    padding: 1rem 1rem;
    margin-top: 3rem;
}

/* PODCAST */

.podcast {
    padding: 1rem 1rem;
    margin: 0rem 0rem 0rem 0rem;

}

/* FEUILLETER */

     .feuilleter {
        margin: 0rem 1rem;
    }

    article.single {
        background: var(--bg-color);
        margin: 1rem 1rem;
    }
    
    .cafe-map {
        padding: 1rem 0rem;
        margin-top: 2rem;
    }
    .cafe-map img {
        width: 90%;
    }
    .issue-row {
        flex-direction: column;
        align-items: center;
    }

    .custom-pres-title {
        display: flex;
        flex-direction: row;
        justify-content: center;
        gap: 0.5rem;
    }
    
    .illustrangeres-title {
        flex-direction: column;
        align-items: center;
    }
    
    .custom-pres-text {
        padding: 0rem 2rem;
    }
    
    .custom-order {
        align-self: center;
        text-decoration: none;
    }
    
    .text-list {
        padding: 0rem 2rem;

    }
    
    .text-display {
        align-items: flex-start;
    }
    
    .text-title {
        display: flex;
        flex-direction: column;
    }
        
    .custom-article span {
        margin-top: 0rem;
    }
    
    .issue-bg {
        width: auto;
    }
    
    .issue-row:last-child .issue-bg {
        width: auto; 
}

.credit {
    font-size: 0.5rem;
}

/* LIBRAIRIES */

 .column {
        margin: 0rem 1rem;
        flex: 1 1 80%; 
    }
    
    .city-block {
    margin-bottom: 0rem; 
    }
        
/* HEADER */ 

    .custom-header {
        margin: 0rem 0rem;
        flex-direction: column;
        align-items: center;
        gap: 0rem;
        padding-top: 2rem;
    }
        
        
/* PAGE D'ACCUEIL */ 
        
    .layout-1col .main-image {
        padding-top: 1rem;        
    }

    .latest {
        flex-direction: column;
        margin: 4rem 0rem;
        text-align: center;
    }
    
    .latest-paragraph::before {
        display: none;
    }        
    
    .latest-paragraph {
        margin-left: 1rem;
        margin-right: 1rem;
    }
    
    .presentation {
        margin: 1rem 1rem;   
    }
    

}