/** Pour faciliter les calculs de taille de police en rem: on initialise la taille "de base" à 10px = 1rem **/
html {
    font-size: 62.5%;
    scroll-behavior: smooth;
    overflow-x: hidden;
}
/* le menu a un sticky top qui est z-index 1020 dans bootstrap on veut plus dans le module accessibilité*/
.a42-ac-overlay{
    z-index: 2000;
}
/*************************************************************************/
/**                    responsive : MOBILE FIRST                        **/
/*************************************************************************/

/* X-Small devices (portrait phones, less than 576px / 36em)
 No media query for `xs` since this is the default in Bootstrap */

h1, .h1, h3, .h3, .frame-carre h2, legend {
    color: var(--secondary);
    text-transform: uppercase;
    font-family: "Roboto Condensed";
    font-weight: 700;
}

h2, .h2 {
    color: var(--primary);
    text-transform: uppercase;
    margin-top: 1.5rem;
    letter-spacing: -0.8px;
}

h2.point {
    color: var(--secondary);
    font-family: "Roboto Condensed";
    font-weight: 700;
}

h2.point:after {
    content: "\f111";
    font-family: "FontAwesome";
    font-size: 1.5rem;
}

h3, .h3 {
    margin-top: 3rem;
}

a:hover h3,
a:hover .h3,
a:focus h3,
a:focus .h3 {
    color: var(--primary);
}

.btn:focus,
.btn.focus,
.btn-secondary:focus,
.btn-secondary.focus {
    box-shadow: 0 0 .3rem .2rem rgba(0,0,0,0.7);
}
h4, .h4,
caption {
    color: var(--primary);
    font-weight: 600;
    margin: 2.5rem 0 0.5rem 0;
}

img, video {
    max-width: 100%;
    height: auto;
}

iframe {
    border: 0;
}
caption {
    caption-side: top;
}

/* chatbot */
/* La petite Marianne
.ButtonIframe {
    bottom:7rem !important;
}
.ButtonIframe, .ChatboxIframe, .BubbleIframe {
    z-index: 1050 !important;
}
*/
#toolbar-redim {
    margin-bottom: 0;
}
#toolbar-redim li {
    display: inline-block;
}

/*** style des content elements **/
figcaption {
    text-align: center;
    font-family: "Roboto Condensed";
    font-size: 1.5rem;
}
.ce-gallery figcaption.video-caption {
    display: table-cell;
}

.external-link:before, .tel:before, .mail:before, .download:before {
    content: "";
    display: inline-block;
    margin-right: .6rem;
    color: var(--gray);
    width: 2rem;
    height: 1.5rem;
    margin-top: .4rem;
}

.mail span {
    margin-top: .4rem;
}

.external-link:before {
    background: url("../Images/SVG/picto-website-right.svg") no-repeat center center;
}

.tel:before {
    background: url("../Images/SVG/picto-phone-right.svg") no-repeat center center;
}

.mail:before {
    background: url("../Images/SVG/picto-mail-right.svg") no-repeat center center;
}

.download:before {
    background: url("../Images/SVG/picto-download.svg") no-repeat center center;
}

.lead {
    border-left: 1px solid var(--primary);
    padding-left: 2.4rem;
    margin-bottom: 3.5rem;
    line-height: 2.6rem;
    letter-spacing: -0.4px;
}

.lead:before {
    content: "";
    display: block;
    width: 100px;
    height: 1px;
    border-top: 1px solid var(--primary);
    padding-top: 1.2rem;
    margin-left: -2.4rem;
}

.texte-petit {
    font-size: 85%;
    line-height: 1.2;
}

.texte-grand {
    font-size: 115%;
}

.texte-tres-grand {
    font-size: 130%;
}

.justify-content-evenly {
    justify-content: space-evenly !important;
}

.phone:before, .clock:before {
    font-family: "Fontawesome";
    display: block;
    margin-right: .6rem;
    color: var(--dark);
    padding-left: .2rem;
}

.clock:before {
    content: "\f017";
}

.phone:before {
    content: "\f095";
}

.clock, .phone {
    display: flex;
    text-decoration: none !important;
}

.frame-default .external-link, .frame-default .tel, .frame-default .mail, .frame-default .download {
    text-decoration: none;
}

.frame-ruler-after::after {
    border-bottom: 1px solid rgba(0, 0, 0, 0.25);
    margin-bottom: 3rem;
}

.frame-type-textmedia .ce-gallery {
    margin: 3rem 0;
}
.frame-type-textmedia .ce-gallery:first-child {
    margin-top: 0;
}
.frame-carre {
    padding-left: 5.5rem;
}

.frame-carre header {
    display: flex;
    align-items: center;
    margin-left: -1rem;
    margin-top: 3.5rem;
    margin-bottom: 3rem;
}

.frame-carre header * {
    margin: 0 0 0 2rem;
}

.frame-carre header:before {
    content: "";
    display: block;
    width: 3rem;
    height: 3.5rem;
    margin-left: -4.5rem;
    background-color: var(--light);
}

.frame-aplat .ce-textpic {
    background-color: var(--primary);
    display: flex;
    flex-wrap: wrap;
}

.frame-aplat .ce-gallery {
    margin: 0 !important;
    float: none;
}

.frame-aplat .ce-gallery .ce-column {
    padding: 0;
}
.frame-aplat .ce-bodytext {
    padding: 0 5rem 2rem 2rem;
    color: var(--white);
}
.frame-aplat header * {
    color: var(--white);
    font-family: "Roboto Condensed";
    font-weight: 700;
    margin-bottom: 1rem;
}
.frame-type-textmedia p a,
.frame-type-textmedia li a,
.frame-type-text p a,
.frame-type-text li a,
.ce-bodytext a,
form a,.liste-chantier a {
    text-decoration: underline;
    font-weight: 500;
    text-underline-offset: 6px;
}
.frame-aplat .ce-bodytext a {
    color: #fff;;
}

.ce-bodytext a.btn {
    text-decoration: none;
}
header .subheader {
    margin-bottom: 2rem;
}

.ce-bodytext ul, .facet ul {
    padding-left: 1.8rem;
}


/* Fluid Image Tags */
.ce-gallery {
    width: 100%;
}

div.ce-intext .ce-gallery {
    width: auto;
}

.ce-gallery .ce-column {
    margin: 0;
    padding: 0 5px;
    box-sizing: border-box;
}

.ce-gallery .ce-column:first-child {
    padding-left: 0;
}

.ce-gallery .ce-column:last-child {
    margin-right: 0;
}

.ce-gallery img,
.ce-gallery picture {
    width: 100%;
    height: auto;
}

.ce-gallery[data-ce-columns="1"] .ce-column {
    width: 100%;
}

.ce-border img, .ce-border iframe {
        border: 1px solid var(--light);
}

/**** accordion et tabs *****/
.header-accordion {
    border-top: 1px solid var(--gray);
    font-size: 2rem;
    font-weight: 600;
    text-align: left;
}

.header-accordion .fa {
    color: var(--primary);
}

.header-accordion.collapsed .fa-angle-down, .header-accordion .fa-angle-right {
    display: none;
}

.header-accordion.collapsed .fa-angle-right {
    display: block;
}

.nav-item {
    flex: 1 1 100%;
}

.nav-tabs .nav-item {
    flex: unset;
}

.nav-tabs .nav-link {
    border: 1px solid var(--light);
    background-color: transparent;
    transition: all ease-in 500ms;
}

.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus, .nav-tabs .nav-link.active {
    color: var(--white);
    background-color: var(--primary);
    border-color: var(--primary);
}

/*** bloc gascon ***/
:lang(oc) {
    font-style: italic;
}
.frame-type-container-blocgascon {
    display: flex;
    flex-wrap: nowrap;
    margin: -1rem 0 0 2.5rem;
}

.frame-type-container-blocgascon:before {
    content: "";
    width: 80px;
    height: 40px;
    background: url("../Images/SVG/Drapeau-Gascogne.svg") no-repeat top left;
    margin-right: .5rem;
    margin-top: .5rem;
    flex: 1 auto;
}

.frame-type-container-blocgascon header * {
    margin-top: 0;
    margin-bottom: 1rem;
    color: var(--secondary);
}

/* chiffre*/
.chiffre{
    color: var(--primary);
    font-size: 6rem;
    line-height: 123.1%; /* 78.784px */
}
.chiffre::after{
    content:"";
    display: block;
    height: 1px;
    width:100%;
    background: var(--primary);
}

/*** card générique + trombi + uploads + accordion ****/
.card  {
    border: 0 none;
}
.trombi .card, .ce-uploads .card {
    margin-bottom: 2.5rem;
    font-size: smaller;
}
.card-title {
    font-weight: 500;
    margin-top: 0;
}

.card-title:after {
    content: "";
    display: block;
    width: 4rem;
    height: 1rem;
    background: var(--primary);
    margin-top: .5rem;
}

.trombi h4 {
    color: var(--secondary);
    font-size: 1.5rem;
}
/**** ce-uploads ***/
.ce-uploads img {
    float:none;
    padding:0;
}
.ce-uploads span {
    display: inline-block;
}
.ce-uploads a {
    font-weight: 500;
}
.ce-uploads .card {
    max-width: 26rem;
}
.ce-uploads .card.large {
    max-width: 100%;
    border: 1px solid var(--primary);
    padding: 2rem 3rem;
    margin-bottom: 2.5rem;
}
.ce-uploads .card-title {
    min-height: 6rem;
}

.ce-uploads .retour {
    display: flex;
    align-items: center;
    margin: .5rem;
    width: min-content;
}
.ce-uploads .retour:hover svg g,
.ce-uploads .retour:focus svg g {
    fill: var(--white);
}
/*** liens actifs des menus ****/
a.active, .active>a, a.current, .current>a {
    color: var(--primary);
}

/*** menu hub ***/
.hub a, .news-list-view a {
    min-height: 27rem;
}

.hub a {
    font-weight: 600;
}

.frame-type-menu_subpages a, .frame-type-menu_pages a {
    text-decoration: none !important;
}

.hub-img, .news-img {
    height: 20rem;
    overflow:hidden;
}

.news-hub {
    display: flex;
    min-height: 6.5rem;
    position: relative;
    margin-top: -8rem;
    flex-direction: column;
    justify-content: space-between;
    z-index: 3;
}

.news-hub h3,
.news-hub h2.h3 {
    min-height: 5rem;
}

/* Cas particulier page */
#p12 .hub img {
    border: 1px solid var(--light);
}

/****** Ancre lien contenu accessibilité ****/
#main-anchor {
    scroll-margin-top: 120px;
}

/****** menu ancre ****/
.menu-ancre li {
    flex: 1 1 100%;
}

.menu-ancre a {
    font-weight: 700;
    display: block;
    text-decoration: none;
    font-size: 1.3rem;
    line-height: 1.5rem;
    padding-bottom:1.2rem;
}

.frame-type-menu_section~.frame-default::before {
    content: "";
    display: block;
    height: 60px;
    margin-top: -60px;
    visibility: hidden;
}

.frame-type-menu_section~.frame-default h2 {
    border-top: 1px solid var(--light);
    padding-top: 2.5rem;
}

.frame-type-menu_section+.frame-default h2 {
    border-top: 0 none;
}

/****** menu pictos ****/
.menu-pictos a {
    text-align: center;
    position: relative;
    text-decoration: none !important;
    width: 6.5rem;
    margin: 0 .5rem;
}

.menu-pictos a .picto, .menu-pictos a .pictoon {
    padding: 1rem;
    border-radius: 100%;
    border: 5px solid var(--light);
    width: 6.5rem;
    height: 6.5rem;
}
.menu-pictos a h3,
.menu-pictos a .h3 {
    min-height: 3rem;
    font-size: 1.2rem;
}

.menu-pictos a .pictoon {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    opacity: 0;
    transition: opacity ease 500ms;
    border-color: var(--primary);
}

.menu-pictos a .picto,
.menu-pictos a:hover .pictoon, .menu-pictos a:focus .pictoon {
    position: relative;
    z-index: 3;
    opacity: 1;
}

.menu-pictos a:hover .picto, .menu-pictos a:focus .picto {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

.menu-pictos a .unique {
    position: static !important;
    z-index: 3 !important;
}
.menu-pictos a:hover .unique, .menu-pictos a:focus .unique {
    border-color: var(--primary);
}


/**** classe more à associer avec le svg + ****/
a .more svg, .more svg {
    fill: var(--secondary);
    align-self: flex-end;
}

a:hover .more svg, a:focus .more svg, a.more:hover svg, a.more:focus svg {
    fill: var(--primary);
}

.nohub a {
    font-weight: 500;
}

.nohub a.more svg {
    flex: none;
    margin-left: .5rem;
    align-self: flex-start;
}

.nohub .more {
    min-height: 6rem;
    border-bottom: 1px solid var(--gray);
}
/************** les boutons rte *************/
.bouton {
    padding: 1.5rem 4rem;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    display: inline-block;
}
.ce-uploads .bouton {
   padding:1rem 3rem;
   margin:.5rem;
}
a.bouton.rond {
    border-radius: 50rem;
    border: 1px solid var(--secondary);
}

a.bouton.rond:hover, a.bouton.rond:focus {
    color: var(--white);
    background-color: var(--secondary);
}

.bouton.rectangle {
    border-radius: unset;
    color: var(--white);
    border: 1px solid var(--primary);
    background-color: var(--primary);
}

a.bouton.rectangle:hover,
a.bouton.rectangle:focus,
.accordion button:hover,
.accordion button:focus {
    color: var(--primary);
    background-color: var(--white);
}

/****** bouton tous toutes ****/
a.tous {
    display: inline-block;
    font-family: "Roboto Condensed";
    font-size: 1.6rem;
    text-transform: uppercase;
    text-decoration:none;
}
a.tous:before, .frame-aplat a.tous:hover:before, .frame-aplat a.tous:focus:before {
    content: "";
    display: inline-block;
    width: 1rem;
    height: 1.6rem;
    background: url("../Images/sup.png") no-repeat center left;
    margin-right: 1rem;
    position: relative;
    top:2px;
}
a.tous:after, .frame-aplat a.tous:hover:after, .frame-aplat a.tous:focus:after {
    content: "";
    display:block;
    border-bottom:1px solid var(--secondary);
    margin-left: 2rem;
}
a.tous:hover:before, a.tous:focus:before {
    background-image: url("../Images/sup-on.png");
}
a.tous:hover:after, a.tous:focus:after {
    border-color: var(--primary);
}

.frame-aplat a.tous {
    font-weight: 600;
}
.frame-aplat a.tous:before {
    background-image: url("../Images/sup-blanc.png");
}
.frame-aplat a.tous:after {
    border-color: var(--white);
}
/*** bouton retour est utilisé aussi pour le bouton télécharger de ce-uploads ***/
.retour {
    font-size: smaller;
    color: var(--primary);
    border: 1px solid var(--primary);
    margin: 2rem 0;
}

.retour:hover, .retour:focus {
    color: var(--white);
    background-color: var(--primary);
}

/***************************** formulaires **********************/
form * {
    font-family: "Roboto Condensed";
}

/*
form .row>div>* {
    padding-left: 0;
}
*/

fieldset {
    margin-bottom: 2rem;
}

legend {
    font-size: 2.4rem;
}

label,
p.label {
    color: var(--secondary);
    font-weight: 600;
    margin: 1rem 0 0.5rem 0;
    font-family: "Roboto Condensed";
    text-transform: uppercase;
    font-size: 1.7rem;
}

.form-check label{
    text-transform : none ;
    font-weight :normal
}

.radio label {
    font-weight: 100;
    line-height: 0;
    text-transform: none;
    font-size: 1.6rem;
}

.help-block p{
    margin :0;
}
.help-block{
    margin :-1rem 0 0 0;
    font-weight: 400;
    font-size: 1.6rem;
    text-transform: none;
}

.powermail_fieldwrap_champsobligatoires {
    font-size: smaller;
}

/* .powermail_fieldwrap_champsobligatoires>div:before {
    content: "*";
    display: inline;
    color: var(--primary);
    font-weight: 600;
    font-size: 2rem;
    padding-right: .2rem;
} */

.mandatory {
    color: var(--primary);
}
.powermail_fieldwrap_champsobligatoires .mandatory {
    font-size: 1.7rem;
}
select {
    border: 1px solid var(--secondary);
    background:0 none;
}

/*** dont moteur de recherche solr****/
#tx-solr-search-form-pi-results .input-group div {
    flex:1 1 50%;
    padding-right: 1rem;
}
#tx-solr-search-form-pi-results #macs-event input[type="checkbox"] {
    appearance: none; /* Pour supprimer l'apparence par défaut */
    -webkit-appearance: none; /* Pour Chrome et Safari */
    background: transparent; /* Fond transparent */
    margin: .3rem 0 0 0; /* Ajustement de marge */
    width: 2.5rem; /* Largeur spécifique pour l'élément visible */
    height: 2.5rem; /* Hauteur spécifique pour l'élément visible */
    position: relative; /* Position relative pour le pseudo-élément */
    cursor: pointer; /* Curseur pointeur */
}
#tx-solr-search-form-pi-results #macs-event input[type="checkbox"]:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 2px solid var(--primary); /* Bordure rouge */
    border-radius: .5rem;
    box-sizing: border-box; /* Inclut la bordure dans la taille définie */
}
input[type="checkbox"]:checked:after {
    content: '✔'; /* Caractère de coche */
    position: absolute;
    top: -0.1rem;
    left: .5rem;
    font-size: 1.8rem; /* Taille de la coche */
    color: white; /* Couleur de la coche */
}
#tx-solr-search-form-pi-results #macs-event input[type="checkbox"]:checked:before {
    background-color: var(--primary); /* Fond rouge pour indiquer qu'elle est cochée */
}


#searchModal .tx-solr-search-form .form-control,
#tx_solr_home_searchbox .tx-solr-search-form .form-control{
    height: auto;
}

#sortDropDown:after {
    display: none;
}
.facets {
    padding: 0;
    list-style: none;
}

#tx-solr-search-form-pi-results .input-group div.rech {
    flex:100%;
}
#tx-solr-search-form-pi-results .input-group div.rech button {
    padding: 1rem 4rem;
    border-radius: .5rem;

}
#tx-solr-search-form-pi-results .input-group div .form-control {
    border-radius: .5rem;
}

.tx_solr .btn-circle {
    font-size: 1.5rem;
    height: auto;
    padding: 3px 10px;
}
.tx_solr .btn-circle:last-child {
    font-weight: 500;
    background-color: var(--light);
}
.solr-pagination:first-child {
    display: none;
}
.solr-pagination:last-child {
    display: block;
}
/*** moteur de recherche specifique accueil et modale ****/
.tx-solr-search-form .rounded-pill {
    border: 0;
    padding: 1.8rem 3rem;
}

#tx_solr_home_searchbox {
    width: 80%;
    position: relative;
}
#tx_solr_home_searchbox button {
    border-left: 1px solid var(--secondary);
    position: absolute;
    right: 1rem;
    top: .5rem;
}
.tx-solr-autosuggest {
    background: rgba(255,255,255,.9);
    width:600px !important;
    margin-left: 1rem !important;
    margin-top: 1rem;
    max-width: 60% !important;
}
.tx-solr-autosuggest strong {
    color: var(--primary);
}
.tx-solr-autosuggest .autocomplete-selected {
    background: var(--light)
}
.tx-solr-autosuggest .autocomplete-group {
    padding: 5px;
    background: transparent;
    font-weight: 700;
    text-transform: uppercase;
}
.badge {
    font-size:inherit;
    padding: .25 .5rem;
    background: var(--light);
}
/*** specifique sidebar ****/

#sidebar .facets li {
    margin-bottom: 2rem;
}
#sidebar .input-group {
    display:block;
}
#sidebar .input-group input, #sidebar .input-group button {
    width: 100%;
    margin-bottom: 1rem;
}
.recherche .tx-solr-search-form label {
    flex: 100%;
    padding-bottom: 1rem;
}
.carre {
    width: 10rem;
    height: 9rem;
    margin-bottom:1rem;
    overflow: hidden;
    margin: auto;
}
.carre img {
    object-fit:cover;
    height: 100%;
}
.carre.petit {
    width: 5rem;
    height: 6rem;
}
.results-highlight {
    padding:.2rem .3rem;
    background-color: var(--light);
    font-weight: 700;
}

/** Facettes **/
#tx-solr-facets-in-use {
    padding: 0 1rem;
}
#tx-solr-facets-in-use a {
    margin:.5rem;
    display: block;
}
.facet-type-dateRange fieldset {
    margin-bottom: 0;
}
.facet-type-dateRange fieldset legend {
    color: var(--secondary);
    font-weight: 600;
    margin: 1rem 0 0.5rem 0;
    font-family: "Roboto Condensed";
    text-transform: uppercase;
    font-size: 1.7rem;
}
.facet-type-dateRange fieldset label {
    font-weight: 400;
    text-transform: lowercase;
    margin: 0;
}

.ce-uploads .h4 {
    margin-top:0;
}
.results-list .card-title {
    min-height: 4.5rem;
}
#tx-solr-sorting .dropdown-menu {
    min-width: 15rem;
    padding:.5rem;
}
#tx-solr-search-functions h2 {
    margin-top: 0;
    margin-bottom: 0;
}
/*********************    ged     ********************/

/********************* pagination ********************/
.pagination {
    justify-content: center;
    position:relative;
    margin-top: 2rem;
    padding-top: 1rem;
    padding-bottom:1rem;

    width: 100%;
}
.solr-pagination:last-child .pagination {
    border-top: 1px solid var(--gray);
}
.solr-pagination .pagination .previous {
    position: absolute;
    left: 0;
}
.solr-pagination .pagination .last {
    position: absolute;
    right: 0;
}
.pagination li {
    padding: 0 1rem;
}
.pagination li.current {
    color: var(--primary);
}
/***************************** les communes ***************************/

/*** carte commune svg ****/

body .jqvmap-label {
    -moz-border-radius: 3px;
    background: #E1E6EA;
    color: var(--secondary);
    font-weight: bold;
    padding: 10px 20px;
    border-radius: 0;
    font-size: 1.5rem;
    margin-left: 54px;
    margin-top: -34px;
}

.jqvmap-label span {
    display: block;
    color: var(--primary);
}

.jqvmap-label::after {
    content: "";
    border: solid;
    border-width: 30px 15px;
    border-color: #E1E6EA transparent transparent transparent;
    left: calc(50% - 15px);
    position: absolute;
    bottom: -60px;
}

/**** extension communes *****/
.liste-commune a:focus {
    color: var(--primary);
    outline: none;
}
/*** popup ***/
.mfp-title h3{
    color: #fff;
}

/*** extension chantier ***/

.liste-chantier{
    list-style: none;
    padding: 0;
}
.liste-chantier>li {
    border-top: 1px solid var(--gray);
    padding: 3rem 0;
}
.liste-chantier .title {
    color: var(--dark);
    margin-top: 0;
}
.liste-chantier .title::before {
    content: "";
    width: 3.5rem;
    height: 4rem;
    float: left;
    background: var(--primary);
    margin-right: 2rem;
}
.liste-chantier .photo-time {
    font-weight: bold;
    background: #fff;
    margin: -3.5rem 0 2rem;
    width: fit-content;
    padding: 0.5rem 4rem 1rem 1rem;
}
.liste-chantier .photo-time::after {
    content:".";
    font-size:6rem;
    line-height:1rem;
    margin-left: 1rem;
}
.liste-chantier .commune h3 {
    font-size: 2.5rem;
    margin-top: 0;
    color:var(--primary);
}
.liste-chantier .wrap-label {
    position: relative;
    padding-left: 4rem;
}
.liste-chantier .wrap-label.commune {
    margin: 0 0 2rem 0;
    padding: 0;
}
.liste-chantier .label {
    font-weight: bold;
    display: inline-block;
}
.liste-chantier .wrap-label::before {
    content: "";
    display: inline-block;
    width: 3rem;
    height: 3rem;
    background-position: center;
    background-size: contain;
    position: absolute;
    top: 1rem;
    left:0;
}
.liste-chantier .wrap-label.date::before {
    background-image:url("../Images/SVG/cone.svg");
}
.liste-chantier .wrap-label.montant::before {
    background-image:url("../Images/SVG/euro.svg");
}
.liste-chantier .wrap-label.piste::before {
    background-image:url("../Images/SVG/road.svg");
}
.liste-chantier .wrap-label.partenaire::before {
    background-image:url("../Images/SVG/relation.svg");
}
.liste-chantier .wrap-label span {
    display: block;
    font-weight: normal;
}
/***************************** les actus ***************************/
.news-single .article {
    display:flex;
    flex-direction: column;
}

.news-hub h2.h3,
.event h2.h3 {
    letter-spacing: normal;
}

.news-hub h3,
.news-hub h2.h3 {
    margin: 0;
    --max-lines: 3;
    position: relative;
    max-height: calc(2.5rem * var(--max-lines));
    overflow: hidden;
}
.news-hub .extra {
    order:-1;
}
.news-hub.article-content h3,
.news-hub.article-content h2.h3 {
    text-transform: none;
}
.news-single .thumbnail {
    max-width: 50%;
    margin: 0 auto 3rem ;
}
.news-single .lead {
    margin-bottom: 1rem;
}
.extra {
    font-size: smaller;

}
.news-single .extra, .news-single .frame-default {
    order:4;
}
.news-single .extra {
    text-align: right;
}
.news-single .next a {
    text-align: right;
    display: block;
}

/**pxa-social-feed**/

.tx-pxa-social-feed .social-feed-container.masonry .social-feed-item {
    outline: 1px solid black;
    outline-offset: -15px;
    padding: 30px;
}

/*** gestion filtre catégories en css uniquement ****/

/**** à voir si toujours d'actualité ****/
.news .btn-group button.btn.btn-primary {
    background-color: var(--white);
    color: var(--secondary);
    padding: 0;
    margin: 0;
    border: 0 none;
    text-align: left;
    font-size: 1.6rem;
    font-weight: 500;
    box-shadow: unset;
}
.news .btn-group button.btn.btn-primary i {
    display:none;
}
.news .btn-group a {
    order: 2;
}
.news .btn-group a + a {
    width: 1rem;
    height: 1rem;
    background-color: transparent;
    margin-right: .5rem;
    align-self: center;
    order:1;
}
.news .btn-group a:hover + a,
.news .btn-group a:focus + a,
.news .btn-group a.active  {
    background-color: var(--primary);
}
.news .btn-group {
    display: flex;
}

/*** nouvelle gestion filtre catégories d'actus *****/
.category-menu-view li {
    width: 100%;
}

/***************************** Agenda ***************************/

.event a:after {
    content: "";
    width: 0;
    height: 1px;
    display: block;
    flex:none;
    order:4;
    margin-top: 1rem;
    background-color: var(--primary);
    transition: all ease-in-out 500ms;
}

.event a:hover:after,
.event a:focus:after {
    width: 100%;
}

.event .event-img {
    height: 31rem;
    background-color: var(--light);
    overflow:hidden;
}

.event .event-img img, .news-img img, .hub-img img {
    object-fit: cover;
    height:100%;
    transition: transform .7s;
}
.event a:hover .event-img img,
.event a:focus .event-img img {
    transform: scale(1.1);
}
.event h3,
.event h2.h3 {
    text-transform: none;
}

.date-cat {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    padding: 1rem 0;
    position:relative;
    z-index: 3;
}

.date-cat p {
    margin-bottom: 0;
}

.event .date-cat {
    padding: 0 2rem;
    align-items: flex-end;
}

.date-event, .date-debut, .date-fin {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.date-event {
    background-color: var(--primary);
    color: var(--white);
    flex: none;
    width: 9rem;
    min-height: 14rem;
    line-height: 1.1;
    color: #fff;
    align-items: center;
    font-weight: 700;
}
.event .date-event {
    position: relative;
    margin-top: -8rem;
    margin-right: 1rem;
}
.date-event p {
    font-family: "Roboto Condensed";
}
.date-event .day {
    font-size: 2.2rem;
    transition: font-size .7s ease;
}
.date-event .month {
    text-transform:uppercase;
    font-size: 1.6rem;
    transition: font-size .7s ease;
}
a:hover .day,
a:focus .day,
a:hover .month,
a:focus .month {
    font-size: 2.3rem;
}
.cat-event {
    font-size: 1.5rem;
}
.cat-event, .pin {
    font-family: "Roboto Condensed";
    text-transform: uppercase;
}
.pin, .tarif, .public, .date-heure, .download-title {
    padding-left:3.2rem;
    background: url("../Images/SVG/picto-pin-agenda.svg") no-repeat left top;
    background-size: 3rem;
}
.date-heure {
    background-image: url("../Images/SVG/picto-clock.svg");
    background-size: 2rem;
}
.tarif {
    background-image: url("../Images/SVG/picto-euro.svg");
    background-position: left;
    padding-left: 4.2rem;
}
.download-title {
    background-image: url("../Images/SVG/picto-download-circle.svg");
    background-position: left;
    padding-left: 4.2rem;
}
.public {
    background-image: url("../Images/SVG/picto-family.svg");
}
.pin {
    background-position:-4px;
}
.event .pin {
    background-size: 2.5rem;
    background-position:-2px;
}
.tx-nova-event .lead {
    font-weight: 400;
    font-size: inherit;
}
#single-agenda .h3:before {
    content: "";
    display: inline-block;
    background-image: url("../Images/SVG/picto-organisateur.svg");
    width: 3rem;
    height: 3rem;
    background-position: center;
    margin-right: 1rem;
    margin-bottom: -0.8rem;
}
#single-agenda hr {
    border-top: 5px solid var(--light);
}

/**** attention si uniquement page accueil, déplacer ****/
.menu-agenda a {
    padding: 0 1.4rem;
    border-left: 2px solid var(--primary);
    font-family: "Roboto Condensed";
    text-transform: uppercase;
}
.menu-agenda li, .menu-agenda .list-inline-item:not(:last-child) {
    margin-right: 0;
}
.menu-agenda li:last-child a {
    border-right: 2px solid var(--primary);
}
/****** inscription newsletter *****/
fieldset fieldset {
    margin-top: 3rem;
}
.tx-sremailsubscribe-pi1-multiple-checkboxes {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
}
.tx-sremailsubscribe-pi1 label {
    text-transform: none;
}
.tx-sremailsubscribe-pi1-multiple-checkboxes * {
    margin: 0;

}
.tx-sremailsubscribe-pi1-multiple-checkboxes dt {
    width: 5%;
    text-align: right;
    position: relative;
    top: -1px;
}
.tx-sremailsubscribe-pi1-multiple-checkboxes dd {
    width: 95%;
    padding-bottom: 2rem;
    padding-left: 1rem;
}
/*********************** topheader ************************/
header .btn {
    padding: 0;
}

/*** generique modale ****/
button.close {
    background-color: var(--primary);
    width: 6rem;
    height: 6rem;
}
/*
.modal {
    z-index:10050 !important;
}
*/
/*** menu haut et menu principal modale ***/
.nav-link {
    font-family: "Roboto Condensed";
    font-weight: 700;
    line-height: 1.3;
}

.menutop li:first-child a, .menutop li:nth-child(0n+2) a {
    padding-top: 1.6rem;
}

.dropdown-toggle {
    background: none;
    border: 0 none;
    margin-left: .6rem;
}

.dropdown-toggle:after {
    display: block;
    content: "\f105";
    font-family: Fontawesome;
    color: var(--primary);
    border: 0;
    margin: auto;
    position: relative;
    font-size: 2.3rem;
    top: -.5rem;
}

.dropdown-toggle:hover:after, .dropdown-toggle:focus:after, .show>.dropdown-toggle:after {
    content: "\f107";
}

.navbar-expand a {
    font-family: "Roboto Condensed";
}

.navbar-expand .navbar-nav .nav-link {
    color: var(--primary);
    padding: 1rem 0 2rem 0;
    font-size: 2rem;
}

.navbar-expand .navbar-nav .nav-link:after {
    content: "";
    display: block;
    width: 5rem;
    height: .5rem;
    background-color: transparent;
    margin-top: .5rem;
}

.navbar-expand .navbar-nav .nav-link:hover:after,
.navbar-expand .navbar-nav .nav-link:focus:after,
.navbar-expand .navbar-nav .active .nav-link:after,
.navbar-expand .navbar-nav .current .nav-link:after {
    background-color: var(--primary);
}

.navbar-expand .navbar-nav .dropdown-menu {
    position: static;
}

.modal-body {
    padding: 1rem 3rem;
}

.modal-body .navbar-nav>li {
    padding-right: 3rem;
}

.dropdown-menu {
    padding: 0;
}

.menu2 {
    width: 100%;
    height: 100%;
    border-right: 1px solid var(--light);
}

.menu2 a {
    font-size: 1.6rem;
}

.menu2 ul li {
    line-height: .9;
    padding-bottom: 1rem;
}

.menu2>li>a {
    font-weight: 600;
    margin-bottom: 1rem;

}

/*** modale ****/
#searchModal .modal-dialog {
    max-width:90vw;
    height: 70vh;
}
#fenetre-menu-principal .modal-dialog {
    max-width:100%;
}

.modal-content {
    height: 100%;
}
.modal-body {
    display: flex;
    flex-direction:column;
}
/*** Menu Je souhaite ***/
#menu-souhait {
    font-family: "Roboto Condensed";
}

#menu-souhait button, #menu-souhait a, #menu-souhait li {
    color: var(--white);
    background-color: var(--primary);
    border: 0;
    border-radius: 0;
    margin: 0;
    padding:0;
}

#menu-souhait button {
    padding: 3rem 3rem 3rem 0;
    text-transform: uppercase;
    background-color: rgba(69, 157, 160, .8);
    font-size:2rem;
    transition: all ease 200ms;
    position:relative;
    right: -140px;
    transition: all ease-in 500ms;
}
#menu-souhait button .fa {
    padding: 0 1.5rem 0 2.5rem;
}
#menu-souhait button:hover, #menu-souhait button:focus {
    background-color: rgba(69, 157, 160, 1);
    font-weight:600;
    right: 0;
}

#menu-souhait .dropdown-toggle:after {
    display:none;
}

#menu-souhait li {
    white-space: normal;
}

#menu-souhait li:last-child a {
    border-width: 0;
}

#menu-souhait .show li {
    width: 36rem;
}

#menu-souhait a {
    display: flex;
    margin: 0 1.5rem;
    padding:.4rem;
    border-bottom: 1px solid rgba(255,255,255,.4);
    font-size: 1.6rem;
}

#menu-souhait a:before {
    content: "\f111";
    font-family: "FontAwesome";
    font-size: 1.5rem;
    width: 1.6rem;
    margin-right: 1rem;
    color: transparent;
    flex: none;
}
#menu-souhait a:hover, #menu-souhait a:focus {
    color: #fff;
    font-weight: 600;
}
#menu-souhait a:hover:before, #menu-souhait a:focus:before {
    color: #fff;
}
/*** accessconfig ****/
#accessconfig {
    align-self: flex-start;
    padding-top: .5rem;
}

#accessconfig button {
    background: transparent;
    border: 0 none;
    color: #fff;
    width: 2.4em;
}

#accessconfig button:hover, #accessconfig button:focus {
    background-color: var(--primary);
    border: 1px solid var(--primary);
}

#a42-ac fieldset {
    border-color: var(--primary);
    background-color: var(--light);
}

#a42-ac h1 {
    color: var(--secondary);
}

#a42-ac input[type="radio"]:checked+label::before {
    border-color: var(--secondary);
}

#a42-ac input[type="radio"]+label::after {
    background-color: var(--primary);
}

#a42-ac label {
    margin: 0 .7em .533em .5em;
    font-size: 1.3em;
}

#a42-ac input[type="radio"]+label {
    padding-left: 1.967em;
}

.a42-ac-high-contrast a.article .news-img-wrap::before, .a42-ac-high-contrast .focus a .img-wrap::before {
    background: 0 none;
}

.a42-ac-high-contrast>header:before {
    display: none;
}
.a42-ac-high-contrast button:focus,
.a42-ac-high-contrast a.bouton:focus {
    outline: solid;
}

.a42-ac-p {
    width: 100%;
    text-align: center;
    margin-top: 2rem;
}

/*** bandeau ***/
.bandeau {
    height: 10rem;
}

/*********************** main *****************/
/*** breadcrumb ***/
.breadcrumb {
    list-style: '>';
}

.breadcrumb-item {
    font-family: "Roboto Condensed";
    padding-right: 1rem;
}

.breadcrumb-item a {
    padding-right: .3rem;
}

.breadcrumb-item:first-child {
    list-style: none;
}

.breadcrumb-item.active {
    font-weight: 700;
    padding-left: 1rem;
}

.breadcrumb-item:before {
    display: none;
}

/*** social link ***/
#shareBlock p {
    font-family: 'Roboto Condensed';
}
#shareBlock ul {
    padding-left: .2rem;
    margin-bottom: 0;
}
#shareBlock li {
    list-style: none;
    display: inline-block;
}
/*** colonne de droite **/
.side,
#sidebar {
    font-size: smaller;
}

#sidebar header,
.side .frame > header>h2 {
    border-bottom: 1px solid var(--primary);
    margin-bottom: 1.5rem;
}

.side .frame > header > h2,
#sidebar header > h2 {
    font-size: 2rem;
    font-family: 'Roboto Condensed';
    font-weight: 700;
    margin-bottom: 0;
    margin-top: 0;
    border-bottom: 1px solid var(--primary);
}

.side .frame > header > h2 span,
#sidebar h2 {
    display: inline-block;
    padding: 1rem;
    color: #fff;
    background-color: var(--primary);
    line-height: 1;
}
.side .frame > header > p,
.side .frame header + div {
    margin-top: 1.5rem;
}

/************************ footer *******************/
#colophon .frame-ruler-after::after {
    border-bottom: 2px solid var(--white);
    margin-top: 0;
}

#return-to-top {
    position:fixed;
    right: 1rem;
    bottom: .5rem;
    z-index: 333333;
    background: none;
    border: none;
    margin: 0;
    padding: 0;
}
#colophon .menu-pictos a .picto,
#colophon .menu-pictos a .pictoon {
    border:none;
}

.carte {
    background: url("../Images/situation.png") no-repeat bottom right;
}
.france-relance img {
    width: 10rem;
}
#colophon .col-lg-4 + .col-lg-4 p {
    margin-bottom: 0;
}
#colophon h2 {
    color: var(--secondary);
    font-size: 1.8rem;
    margin-bottom: 0;
    text-align:center;
}
#colophon h3,
#colophon .h3 {
    margin-top: 0 !important;
}

#colophon .h4, #colophon .phone {
    color: var(--secondary);
    font-size: 1.8rem;
}
#colophon .ce-bodytext, #colophon address {
    font-size: 1.6rem;
}
#colophon .phone, #colophon .clock {
    align-items:center;
}
#colophon .phone:before, #colophon .clock:before {
    font-size: 3rem;
}

#footer-copyright .list-inline-item a {
    font-size:1.4rem;
    border-right: 1px solid var(--secondary);
    padding:0 .5rem 0 0;
}
/*** gestion des pictos réseaux sociaux footer + accueil ****/
.reseaux a {
    font-size: 3rem;
    color: #85919b;
    padding: 0 2rem;
    border-left: 1px solid #85919b;
    line-height: 1.1;
}
.reseaux a:hover,
.reseaux a:focus {
    color: var(--secondary);
}
.reseaux li:first-child a {
    border-width: 0;
}
#colophon .reseaux li:first-child a {
    padding-left: 1rem;
}
/***** attention la css de la homepage est gérée dans une feuille de style accueil.css******/

/* Small devices (landscape phones, 576px / 36em and up) */
@media (min-width: 36em) {
    .nav-item {
        flex: 1 1 50%;
    }
    .menu-pictos a:first-child {
        margin-left:0;
    }
}

/* Medium devices (tablets, 768px / 48em and up) */
@media (min-width: 48em) {

    .nav-item {
        flex: 1 1 30%;
    }

    .bandeau {
        height: calc(100vh - 60rem);
    }

    #menu-souhait .show li {
        width: 50rem;
    }

    .frame-type-menu_section {
        position: sticky;
        top: 110px;
        z-index: 1021;
        background: white;
        transition: all ease-in-out 500ms;
    }

    .menu-ancre a {
        min-height: 5rem;
        text-align: center;
        padding-bottom:0;
    }

    .menu-ancre a:after {
        content: "";
        display: block;
        height: 1rem;
        width: 4rem;
        position: relative;
        top: 1rem;
        background-color: transparent;
        transition: all ease-in-out 500ms;
    }

    .menu-ancre a:hover:after,
    .menu-ancre a:focus:after,
    .menu-ancre a.active:after {
        background-color: var(--primary);
    }

    .event {
        flex: 0 0 50%;
        max-width: 50%;
    }
    .event {
        margin-bottom: 3rem;
    }

    .frame-aplat:after {
        content: "";
        display: block;
        height: 0;
        border-right: 60px solid var(--primary);
        border-bottom: 60px solid var(--white);
    }
    #tx-solr-facets-in-use a {
        display: inline-block;
    }
}

/* en dessous de (desktops, 992px / 62em and up) */
@media (max-width: 62em) {
    #colophon div, #colophon p, #colophon .reseaux, #colophon .phone {
        text-align:center;
        margin: auto;
        justify-content: center;
        align-items:center;
    }
    #colophon .reseaux {
        margin:1rem 0;
    }
}
/* Large devices (desktops, 992px / 62em and up) */
@media (min-width: 62em) {
    h1.entry-title, .lead {
        margin-bottom: 4rem;
    }
    /* Pour la page avec la recherche l'agenda ainsi que le moteur de recherche générale juste en dessous*/
    #p36 h1.entry-title,
    #p175 h1.entry-title {
        margin-bottom:0;
    }
    #p6 h1.entry-title {
        margin-bottom:1rem;
    }
    h2, .h2 {
        margin-top: 2.5rem;
        margin-bottom: 2rem;
    }
    .event .event-img {
        height: 36rem;
    }
    .hub a, .news-list-view a {
        min-height: 32rem;
    }

    .hub-img, .news-img {
        height: 25rem;
    }

    .nav-item {
        flex: 1 1 25%;
    }

    .pager li {
        flex-basis: 48%;
    }

    .side .frame,
    #sidebar > div {
        margin-bottom: 4rem;
    }

    .side .external-link {
        display: flex;
        flex-wrap: nowrap;
        align-items: flex-start;
    }

    #colophon a.bouton.rond {
        margin: 2rem 0 3.2rem 0;
    }

    .event {
        flex: 0 0 33.33333333%;
        max-width: 33.33333333%;
    }
    .frame-aplat .ce-gallery {
        flex: 1 1 38%;
    }

    .frame-aplat .ce-bodytext {
        flex: 1 1 62%;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: flex-end;
    }
    .deuxcol .col-lg-8 .news-list-view .col-lg-4 {
            flex: 0 0 50%;
            max-width: 50%;
    }
    #menu-souhait {
        position: fixed !important;
        right: 0;
        top: calc(100vh - 70%) !important;
        z-index: 1022;
    }
    .frame-type-container-blocgascon:before {
        flex: none;
    }
    .texte-petit {
        font-size: 80%;
    }
    #tx-solr-search-form-pi-results .input-group div {
        flex:1 1 15%;
    }
}

/* X-Large devices (large desktops, 1200px / 75em and up) */
@media (min-width: 75em) {
    .bandeau {
        height: 50vh;
    }

    h1.entry-title, .lead {
        margin-bottom: 5.5rem;
    }

    h2, .h2 {
        margin-top: 3.5rem;
        margin-bottom: 3rem;
    }

    .bar {
        display: block;
        width: 1px;
        height: 40px;
        padding-left: 1rem;
        margin-right: 1rem;
        border-right: 1px solid var(--gray);
        position: relative;
        top: .8rem;
    }
    .menu-pictos a {
        width: 12rem;
        margin: 0 1rem;
    }

    .menu-pictos a .picto, .menu-pictos a .pictoon {
        padding: 2.8rem;
        width: 12rem;
        height: 12rem;
    }
    .menu-pictos a h3,
    .menu-pictos a .h3 {
        font-size: 1.6rem;
    }
    .hub a, .news-list-view a, .ce-gallery figure a {
        min-height: 37rem;
        transition: all ease-in-out 300ms;
    }
    .ce-gallery figure a img {
        transition: all ease-in-out 600ms;
    }
    .hub-img, .news-img {
        height: 30rem;
    }
    .hub a:hover img,
    .hub a:focus img,
    .news-list-view a:hover img,
    .news-list-view a:focus img,
    .ce-gallery figure a:hover img,
    .ce-gallery figure a:focus img {
        transform: scale(1.05);
    }
    .nav-item {
        flex: 1 1 0;
    }
    .frame-aplat header * {
        font-size:3.4rem;
    }
    .frame-aplat .ce-gallery {
        flex: 1 1 48%;
    }

    .frame-aplat .ce-bodytext {
        flex: 1 1 52%;
    }
}

/* XX-Large devices (larger desktops, 1400px / 87.5em and up) */
@media (min-width: 87.5em) {
    .container-xxl {
        max-width: 150rem;
    }
    body, .lead {
        font-size:1.8rem;
    }
    h1 {
        font-size:5rem;
    }
    h2 {
        font-size:3.2rem;
    }
    #tx-solr-search-functions {
        position:relative;
    }
}

/* XXX-Large devices (larger desktops, 1600px / 100em and up) */
@media (min-width: 100em) {
    .menutop .nav-link {
        padding-right: 2rem;
    }
}