/*====================================================================================================*/
/* TABLE DES MATIÈRES */
/*====================================================================================================*/

/*
    --------------------------------------------------------------------------------------------------
    -1-     GÉNÉRAL
    --------------------------------------------------------------------------------------------------
    -2-     BANNIÈRE
    --------------------------------------------------------------------------------------------------
    -3-     SUJETS DE L'HEURE
    --------------------------------------------------------------------------------------------------
    -4-     MINISTÈRE EN ACTION
    --------------------------------------------------------------------------------------------------
    -5-     LEADER DE MOBILITÉ
    --------------------------------------------------------------------------------------------------
    -6-     BANNIÈRE EMPLOI
    --------------------------------------------------------------------------------------------------
    -7-     SITES CONNEXES
    --------------------------------------------------------------------------------------------------
    -8.1-   MINISTRE ET SUIVRE LE MINISTÈRE
    --------------------------------------------------------------------------------------------------
    -8.2-   MÉDIAS SOCIAUX
    --------------------------------------------------------------------------------------------------
*/


/*====================================================================================================*/
/*  -1-     GÉNÉRAL */
/*====================================================================================================*/

/******Variables*******/
:root {
    --bleu: #006AA1;
    --bleu-pale: #1E7FB1;
    --bgEmploi: #202b4b;
    /*Couleur background emploi*/
}

/*******Structure de la page*******/
#ColonneCentre {
    padding: 0 !important;
}

#ConteneurContentRow {
    width: 100% !important;
}

.containerPage {
    max-width: 990px;
    margin: 0 auto;
    padding: 0 15px;
}

/*****Sections*****/
.containerPage img {
    max-width: 100%;
}

.backgroundBleu {
    background-color: var(--bleu);
}

.titreArticle {
    font-size: 16px !important;
}

/*Fonts*/
.accueil.h2 {
    font-size: 32px !important;
    font-weight: bold !important;
}

/*Reset styles des listes*/
.resetList {
    margin: inherit !important;
    padding: 0 !important;
    overflow: inherit !important;
}

.resetList li {
    padding: 0 !important;
    margin: 0 !important;
}

.resetList li::before {
    content: '' !important;
}


/*====================================================================================================*/
/*  -1-     BANNIÈRE */
/*====================================================================================================*/

/*Desktop*/
.banniereAccueil.conteneurBandeau {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 46% 55%;
    /* height: 225px; */ /*été 2023*/
    height: 240px; /*Automne 2023*/
    /*marge section*/
    margin-bottom: 3em;
    background-image: url("/PublishingImages/bandeau/2025/ete/bandeau-desktop.jpg");
}


/*Mobile*/
@media (max-width: 767px) {
    .banniereAccueil.conteneurBandeau {
        background-image: url("/PublishingImages/bandeau/2025/ete/bandeau-mobile.jpg");
        height: 180px !important;
        /*marge section*/
        margin-bottom: 2em;
        background-position: 47% 55%;
    }
}

/* @media (max-width: 767px) and (-webkit-min-device-pixel-ratio: 1.25) {
    .banniereAccueil.conteneurBandeau {
        background-image: url("/PublishingImages/bandeau/hiver-2023/bandeau-mobile-125.png");
    }
} */

/*====================================================================================================*/
/*  -3-     SUJETS DE L'HEURE */
/*====================================================================================================*/

/*Structure*/
.sujetsHeure .containerSujets {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
}

.sujetsHeure .itemsSujets {
    flex: 0 1 auto;
    width: 48%;
    margin-bottom: 2em !important;
    height: 85px;
    border: 2px solid #006BA4;
}

@media(min-width: 768px) {
    .sujetsHeure .itemsSujets:nth-child(n+3) {
        /*marge section*/
        margin-bottom: 1em;
    }
}

@media(max-width: 767px) {
    .sujetsHeure .itemsSujets:nth-child(n+4) {
        /*marge section*/
        margin-bottom: 1em;
    }
}

/*Liens*/
.sujetsHeure .itemsSujets a.liensSujets {
    display: block;
    padding: 0 1.5em;
    height: 100%;
}

.sujetsHeure .itemsSujets a.liensSujets:hover,
.sujetsHeure .itemsSujets a.liensSujets:focus {
    text-decoration: none;
    background-color: #ddf3ff;
}

.sujetsHeure .liensSujets>span.fa.fa-external-link,
.sujetsHeure .liensSujets img {
    display: none;
}

/*Texte*/
.sujetsHeure .itemsSujets .conteneurTitre {
    display: flex;
    align-items: center;
    height: 100%;
}

.sujetsHeure .itemsSujets h3.titreArticle {
    margin: 0px;
    color: #006ba4;
}

.sujetsHeure .itemsSujets h3.titreArticle .fa-external-link {
    display: inline;
}

@media(max-width: 767px) {
    .sujetsHeure .containerSujets {
        flex-flow: column wrap;
    }

    .sujetsHeure .itemsSujets {
        width: 100%;
        height: inherit;
    }

    .sujetsHeure .itemsSujets a.liensSujets {
        padding: 0.7em;
    }
}



/*====================================================================================================*/
/*  -4-     MINISTÈRE EN ACTION */
/*====================================================================================================*/

/*Structure*/
.ministereAction .accueil.h2 {
    color: var(--white) !important;
    /*marge section*/
    padding-top: 1em;
}

.ministereAction .containerMinistereAction {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: stretch;
    padding-bottom: 3em !important;
}

.ministereAction .itemsMinistereAction {
    flex: 0 1 auto;
    width: 30%;
    background-color: white;
    padding: 2em !important;
    position: relative;
}

.ministereAction .itemsMinistereAction:hover,
.ministereAction .itemsMinistereAction:focus-within {
    background-color: #ddf3ff;
}

.ministereAction .itemsMinistereAction:hover .lienAction,
.ministereAction .itemsMinistereAction .lienAction:focus{
    text-decoration: none !important;
}

.ministereAction .containerInfoAction {
    display: flex;
    flex-flow: column nowrap;
    height: 100%;
}

/*Icône*/
.ministereAction .iconMinistereAction {
    text-align: center;
    margin-bottom: 1em;
}

.ministereAction .iconMinistereAction img {
    width: 70px;
}

/*Texte*/
.ministereAction .containerText {
    display: flex;
    flex-flow: column nowrap;
    height: 100%;
}

.ministereAction .containerText .text-item {
    flex: 0 1 auto;
}

.ministereAction .containerText .titreArticle {
    color: #006BA4 !important;
}

.ministereAction .containerText .titreArticle span.fa-external-link,
.ministereAction .containerText .titreArticle img{
    display:none;
}

.ministereAction .containerText .titreArticle .lienAction::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.ministereAction .textMinistereAction {
    margin-bottom: 1em;
    height: 100%;
}

.ministereAction .lienMinistereAction {
    font-weight: bold;
    color: var(--bleu);
}

.ministereAction .lienMinistereAction .fa.fa-external-link {
    display: inline;
}

@media(max-width: 767px) {
    .ministereAction .containerMinistereAction {
        flex-flow: column wrap;
    }

    .ministereAction .itemsMinistereAction {
        width: 100%;
        margin-bottom: 1em !important;
    }

    .ministereAction .containerInfoAction {
        flex-flow: row nowrap;
    }

    .ministereAction .containerInfoAction .iconMinistereAction {
        flex: 1 0 100px;
        align-self: center;
        text-align: left;
    }

    .ministereAction .containerText .lienMinistereAction {
        align-self: auto;
    }
}

@media(max-width: 450px) {
    .ministereAction .containerInfoAction {
        flex-flow: column nowrap;
    }

    .ministereAction .containerInfoAction .iconMinistereAction {
        flex: 0 1 auto;
    }
}



/*====================================================================================================*/
/*  -5-     LEADER DE MOBILITÉ */
/*====================================================================================================*/

/*Structure*/
.containerPage.leaderMobilite {
    /*marge section*/
    margin-top: 3em;
    margin-bottom: 3em;
}

.leaderMobilite .containerDonnees {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    margin-top: 2em;
}

.leaderMobilite .itemDonnees {
    flex: 0 1 auto;
    width: 25%;
    text-align: center;
    position: relative;
    padding: 0 25px;
}

/*Chiffre et texte*/
.leaderMobilite .itemDonnees .chiffre {
    font-size: 30px;
    font-weight: bold;
    color: var(--bleu) !important;
    margin-bottom: 1rem !important;
}

.leaderMobilite .itemDonnees .info {
    font-size: 20px;
    color: var(--bleu) !important;
}

.leaderMobilite .itemDonnees p {
    margin: 0 !important;
    line-height: 1 !important;
}

/*Bordure bleue*/
.leaderMobilite .itemDonnees:not(:last-child):after {
    content: '';
    position: absolute;
    top: 15%;
    right: 0;
    width: 2px;
    height: 70%;
    background-color: var(--bleu);
}

@media(max-width: 767px) {
    .leaderMobilite .accueil.h2 {
        text-align: center;
    }

    .containerPage.leaderMobilite {
        /*marge section*/
        margin-top: 2em;
    }

    .leaderMobilite .containerDonnees {
        display: flex;
        flex-flow: column wrap;
        justify-content: space-between;
        margin-top: 0;
    }

    .leaderMobilite .itemDonnees {
        flex: 0 1 auto;
        width: 100%;
        text-align: center;
        position: relative;
        padding: 0 25px;
        margin: 1.5em 0;
    }

    .leaderMobilite .itemDonnees:not(:last-child):after {
        content: '';
        border-bottom: 2px solid var(--bleu);
        width: 150px;
        display: block;
        margin: 0 auto;
        position: relative;
        top: 1.6em;
    }
}



/*====================================================================================================*/
/*  -6-     BANNIÈRE EMPLOI */
/*====================================================================================================*/

/*Couleur de fond à changer selon la bannière utilisée*/
.sectionEmploi.backgroundEmploi {
    background-color: var(--bgEmploi);
}

@media(max-width: 400px) {
    .sectionEmploi.backgroundEmploi {
        background-image: none;
    }
}

/*Couleur de fond coupé de chaque côté en responsive*/
.sectionEmploi .containerEmploi {
    overflow: hidden;
}

/*Centrer l'image*/
.sectionEmploi .containerEmploi img {
    display: block;
    margin: 0 auto;
}

@media(max-width: 400px) {

    /*À partir de 400px, l'image est responsive*/
    .sectionEmploi .containerEmploi img {
        width: 100%;
    }
}

/*Bannière clicable sur toute la largeur de la page*/
.sectionEmploi .containerEmploi a {
    display: block;
}

.sectionEmploi .containerEmploi a:focus {
    border-top: 5px solid var(--bleu);
}



/*====================================================================================================*/
/*  -7-     SITES CONNEXES */
/*====================================================================================================*/

/*Structure*/
.sitesConnexes .containerSites {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    margin-top: 4em !important;
    margin-bottom: 4em !important;
}

.sitesConnexes .containerSites .itemSites {
    flex: 0 1 48%;
    padding: 1.5em !important;
    border: 2px solid var(--bleu);
    position: relative;
}

.sitesConnexes .containerSites .itemSites:hover,
.sitesConnexes .containerSites .itemSites:focus-within {
    text-decoration: none !important;
    background-color: #ddf3ff;
}

/*Info Site*/
.sitesConnexes .itemSites .containerContenuSites {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
}

.sitesConnexes .containerContenuSites .zoneIcone {
    flex: 0 1 25%;
    text-align: center;
}

.sitesConnexes .containerContenuSites .zoneIcone img {
    max-height: 100px;
}

.sitesConnexes .containerContenuSites .zoneInfo {
    flex: 0 1 70%;
}

.sitesConnexes .containerContenuSites .zoneInfo .titreSite {
    font-size: 18px;
    color: #5d5c5c;
    font-weight: bold;
    margin-bottom: 20px;
}

.sitesConnexes .containerContenuSites .zoneInfo .lienSite {
    font-weight: bold;
    color: #006BA4 !important;
    font-size: 16px;
}

.sitesConnexes .containerContenuSites .zoneInfo .lienSite a:hover,
.sitesConnexes .containerContenuSites .zoneInfo .lienSite a:focus{
    text-decoration: none;
}

.sitesConnexes .containerContenuSites .zoneInfo .lienSite a:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
}

.sitesConnexes .containerContenuSites .zoneInfo .lienSite .fa.fa-external-link {
    display: inline;
}

@media(max-width: 767px) {
    .sitesConnexes .containerSites {
        flex-flow: column wrap;
    }

    .sitesConnexes .containerSites .itemSites:first-child {
        margin-bottom: 1.5em !important;
    }
}

@media(max-width: 450px) {
    .sitesConnexes .itemSites .containerContenuSites {
        flex-flow: column wrap;
    }

    .sitesConnexes .containerContenuSites .zoneIcone {
        text-align: center;
        margin-bottom: 1em;
    }

    .sitesConnexes .containerContenuSites .zoneIcone img {
        height: 100px;
    }

    .sitesConnexes .containerContenuSites .zoneIcone.Qc511 {
        margin-bottom: 1em;
    }
}
/*====================================================================================================*/
/*  -8.1-     MINISTRE ET SUIVRE LE MINISTÈRE */
/*====================================================================================================*/

    /*Variables*/
    .sectionMinistreMedias h2,
    .sectionMinistreMedias p,
    .sectionMinistreMedias a {
        color: white !important;
    }

    /*Structure des 2 sections*/
    .sectionMinistreMedias {
        display: flex;
        flex-flow: row nowrap;
        gap: 2.5em;
        color: white !important;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    @media(max-width: 683px) {
        .sectionMinistreMedias {
            flex-flow: column nowrap;
        }
    }


    .sectionMinistreMedias .itemsMinistreMedias {
        flex: 1 1 50%;
        color: white;
    }

    /**Section Ministre**/
    .sectionMinistreMedias .containerSectionMinistre {
        display: flex;
        flex-flow: row nowrap;
        gap: 2em;
    }

    .sectionMinistreMedias .itemsMinistre {
        flex: 0 1 auto;
    }

    .sectionMinistreMedias .photoMinistre {
        align-self: center;
    }

    .sectionMinistreMedias .photoMinistre img{
        max-width: 98px;
    }

    .sectionMinistreMedias .infoMinistre {
        flex: 1 1 auto;
        /* align-self: center; */
        display: flex;
        flex-flow: column nowrap;
        justify-content: space-between;
    }

    .itemsInfoMinistre {}

    .sectionMinistreMedias .infoMinistre h2,
    .sectionMinistreMedias .containerMediasSociaux h2 {
        font-size: 18px;
        margin-left: 0;
    }

    .sectionMinistreMedias .infoMinistre .fonctions {
        font-size: 14px;
        line-height: 1.2;
        margin-bottom: 10px;
    }

    .sectionMinistreMedias .lienExterne img{
        display: none;
    }

    .sectionMinistreMedias .lienExterne .fa-external-link{
        display: inline;
    }

    /*Section Médias sociaux*/
    .containerSectionMedias p {
        margin-bottom: 0 !important;
    }

    .bouton-MediasSociaux-niv2.btn-facebook:hover {
        opacity: 0.8;
    }

    img.logo-fb {
        width: 32px;
    }

    .listeMediasSociaux .itemMediasSociaux {
        flex: 0 1 auto;
    }

    .itemMediasSociaux .lienAcademos {
        background-position: 0px -1px;
    }

    a.lienAcademos {
        width: 32px;
    }

    .sousMenuMediasSociaux .titre {
        color: #006FA9;
    }



.containerMediasSociaux {
    display: flex;
    flex-flow: column wrap;
}

.containerMediasSociaux .itemsMediasSociaux{
    flex: 1 1 auto;
}

.containerMediasSociaux ul#listeMediasSociaux{
    padding-top: 1.7em !important;
}

@media (max-width: 767px) and (min-width: 683px){
    .containerMediasSociaux {
        display: flex;
        flex-flow: column nowrap;
        /* align-items: flex-end; */
    }

    .itemsMediasSociaux.general {
        flex: 0 1 28%;
    }

    .sectionMinistreMedias:not(.versionAnglaise) .containerSectionMinistre .fiche a{
        text-wrap: nowrap;
    }

    .containerMediasSociaux ul#listeMediasSociaux {
        flex: 0 1 70%;
        padding-top: 3em !important;
    }
}
@media (max-width: 400px){
    .sectionMinistreMedias .containerSectionMinistre {
        gap: 1em;
    }

    .itemsMinistreMedias .photoMinistre{
        order: 1;
    }
}


/*====================================================================================================*/
/*  -8.2-     MÉDIAS SOCIAUX */
/*====================================================================================================*/

/*Reset styles de boutons*/
.buttonReset,
.buttonReset:hover,
.buttonReset:focus {
    border: none;
    margin: 0;
    padding: 0;
    width: auto;
    min-width: 0;
    overflow: visible;

    background: transparent;

    /* inherit font & color from ancestor */
    color: inherit;
    font: inherit;

    /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */
    line-height: normal;

    /* Corrects font smoothing for webkit */
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;

    /* Corrects inability to style clickable `input` types in iOS */
    -webkit-appearance: none;
}

/* Remove excess padding and border in Firefox 4+ */
.buttonReset::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/*Structure de la liste*/
.listeMediasSociaux {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
    max-width: 400px;
    margin: 0 auto;
    height: 53px;
    position: relative;
}

.listeMediasSociaux .itemMediasSociaux {
    /* flex: 0 1 15%; */
    text-align: center;
    padding: 0 !important;
    /*position: relative;*/
}

.listeMediasSociaux .itemMediasSociaux>a {
    display: block;
}

/*Couleur des icônes*/
.listeMediasSociaux .fa {
    color: white;
    font-size: 32px;
}

.listeMediasSociaux .itemMediasSociaux:hover .fa,
.listeMediasSociaux .itemMediasSociaux a:focus .fa,
.listeMediasSociaux .itemMediasSociaux .bouton-MediasSociaux-niv2:focus .fa {
    color: #cee5ff;
    font-size: 32px;
}

/*Logo X*/
.itemMediasSociaux .logo-x{
    max-width: 28px;
}

.itemMediasSociaux .bouton-twitter:hover .logo-x,
.itemMediasSociaux .bouton-twitter:focus .logo-x{
    opacity: 0.8;
}

/*Academos sprite*/
.itemMediasSociaux .lienAcademos {
    background: url('/ElementsPersonnalisationSite/Images/mediasSociaux/academos-svg.svg') no-repeat top left;
    background-position: 33% -1px;
    height: 25px;
}

.itemMediasSociaux .lienAcademos:hover,
.itemMediasSociaux .lienAcademos:focus {
    opacity: 0.8;
}

/*Structure des médias sociaux avec sous menu*/
.listeMediasSociaux .itemMediasSociaux .conteneurBouton {
    position: relative;
}

.listeMediasSociaux .itemMediasSociaux .sousMenuMediasSociaux {
    position: absolute;
    /* width: 400px; */
    margin-top: 11px;
    position: absolute;
    left: 0;
    z-index: 1;
    border-bottom: 4px solid var(--bleu);
    background-color: var(--white);
    box-shadow: 0px 4px 4px rgb(0 0 0 / 25%);
    text-align: left;
    color: #3C393A;
}

@media(max-width: 415px) {
    .listeMediasSociaux .itemMediasSociaux .sousMenuMediasSociaux {
        width: 100vw;
        left: -15px;
    }
}

.listeMediasSociaux .itemMediasSociaux .sousMenuMediasSociaux ul {
    margin-top: 0;
}

.listeMediasSociaux .itemMediasSociaux .sousMenuMediasSociaux ul,
.listeMediasSociaux .itemMediasSociaux .sousMenuMediasSociaux li {
    padding: 0;
}

.listeMediasSociaux .itemMediasSociaux .sousMenuMediasSociaux .lienSousMenu {
    display: block;
    padding: 10px;
}

.listeMediasSociaux .itemMediasSociaux .sousMenuMediasSociaux .lienSousMenu:hover,
.listeMediasSociaux .itemMediasSociaux .sousMenuMediasSociaux .lienSousMenu:focus {
    text-decoration: none !important;
    background-color: #DEEFFF;
}

.listeMediasSociaux .itemMediasSociaux .sousMenuMediasSociaux .titre {
    font-weight: bold;
}

.listeMediasSociaux .itemMediasSociaux .sousMenuMediasSociaux .texte {
    color: #515151;
}

.listeMediasSociaux li>.sousMenuMediasSociaux {
    display: none;
}

.listeMediasSociaux li.visible>.sousMenuMediasSociaux {
    display: block;
}

.listeMediasSociaux .sousMenuMediasSociaux li {
    border-bottom: 1px solid var(--bleu);
}

.listeMediasSociaux button.bouton-MediasSociaux-niv2 {
    width: 100%;
    height: 32px;
}

.listeMediasSociaux button.bouton-MediasSociaux-niv2.menuActif:after {
    width: 100%;
    height: 5px;
    content: '';
    background-color: var(--white);
    position: absolute;
    bottom: -11px;
    left: 0;
    z-index: 1;
}

/*Icône lien externe*/
.listeMediasSociaux a.lienExterneCache span,
.listeMediasSociaux a.lienExterneCache img {
    display: none;
}

.listeMediasSociaux .itemMediasSociaux .fa.fa-external-link {
    display: none;
}







/*IE...*/
@media screen and (-ms-high-contrast: active),
screen and (-ms-high-contrast: none) {

    /*Général*/
    .backgroundBleu {
        background-color: #006AA1;
    }

    /*Sujets de l'heure*/
    .sujetsHeure .accueil.h2 {
        margin-bottom: 1em;
    }

    .sujetsHeure .itemsSujets {
        overflow: hidden;
        display: table;
    }

    .sujetsHeure .liensSujets {
        vertical-align: middle;
        display: table-cell !important;
    }

    .sujetsHeure .itemsSujets:nth-child(n+3) {
        margin-bottom: 2em;
    }

    .sujetsHeure .itemsSujets .conteneurTitre {
        display: inherit;
        height: 100%;
    }


    /*Ministère en action*/
    .backgroundBleu.ministereAction {
        background-color: white !important;
    }

    .ministereAction .accueil.h2 {
        margin-bottom: 1em;
    }

    .ministereAction .containerMinistereAction {
        display: inherit;
        padding: 0;
    }

    .ministereAction .containerMinistereAction .itemsMinistereAction {
        padding: 0 !important;
        width: 100%;
    }

    .ministereAction .containerMinistereAction .containerInfoAction {
        display: table;
    }

    .ministereAction .containerInfoAction .iconMinistereAction {
        display: table-cell;
        padding-right: 2em;
    }

    .ministereAction .containerInfoAction .containerText {
        vertical-align: top;
        display: table-cell;
    }

    .ministereAction .containerInfoAction .lienMinistereAction {
        margin-bottom: 4em;
        color: #006AA1;
    }


    /*Leader de mobilité*/
    .containerPage.leaderMobilite {
        margin-bottom: 4em;
    }

    .leaderMobilite .itemDonnees .chiffre,
    .leaderMobilite .itemDonnees .info {
        color: #006AA1;
    }


    /*Emploi*/
    .backgroundEmploi.sectionEmploi {
        background-color: #202b4b;
    }


    /*Sites connexes*/
    .sitesConnexes .containerSites {
        display: inherit;
    }

    .sitesConnexes .itemSites .containerContenuSites {
        justify-content: inherit;
        flex-flow: inherit !important;
    }

    .sitesConnexes .itemSites {
        padding: 0 !important;
        border: none !important;
    }

    .sitesConnexes .itemSites .zoneIcone {
        flex: 0 1 20%;
        margin-right: 1em;
    }

    .sitesConnexes .itemSites .zoneIcone img {
        width: 100%;
        height: 100%;
    }

    .sitesConnexes .itemSites .zoneInfo {
        margin-bottom: 3em;
    }


    /*Medias Sociaux*/
    .listeMediasSociaux .itemMediasSociaux .sousMenuMediasSociaux {
        background-color: white;
        border-bottom: 4px solid #006AA1;
        box-shadow: 1px 1px 4px;
    }
}