:root {
        --text: #161616;
--links: #000091;
--titles: #3a3a3a;
--page-background: #f5f5fe;
--highlight: #000091;
--boxes-background: #FFFFFF;
--boxes-border: #ededf2;
--section-titles: #f5f5fe;
--section-titles-background: #000091;
--header-background: #FFFFFF;
--header-links: #6a6af4;
--footer-background: #FFFFFF;
--footer-links: #000091;
    }
    
/* STYLE SHEET */

/* || INSTANCES */

:root {
    --general-width: 1200px;
    --color-title-data: #3a3a3a;
    --color-tab-hover: #161616;
    --color-tag-background: #000091;
    --foot-border: #ededf2;
    --foot-background: #FAFAFA;
    --grey-50: #161616;
    --grey-50-hover: #343434;
    --grey-50-active: #474747;
    --grey-200: #3a3a3a;
    --grey-200-hover: #616161;
    --grey-200-active: #777777;
    --grey-main-525: #7b7b7b;
    --grey-main-525-hover: #a6a6a6;
    --grey-main-525-active: #bababa;
    --grey-975: #f6f6f6;
    --grey-975-hover: #dfdfdf;
    --grey-975-active: #cfcfcf;
    --grey-950: #eeeeee;
    --grey-950-hover: #d2d2d2;
    --grey-950-active: #c1c1c1;
    --grey-850: #cecece;
    --grey-850-hover: #a8a8a8;
    --grey-850-active: #939393;
    --grey-1000: #ffffff;
    --grey-1000-hover: #f6f6f6;
    --grey-1000-active: #ededed;
    --blue-france-525:#6a6af4;
    --blue-france-525-hover:#9898f8;
    --blue-france-525-active:#aeaef9;
    --blue-france-975-75: #f5f5fe;
    --blue-france-975-75-hover: #dcdcfc;
    --blue-france-975-75-active: #cbcbfa;
    --blue-france-950-100: #ececfe;
    --blue-france-950-100-hover: #cecefc;
    --blue-france-950-100-active: #bbbbfc;
    --blue-france-sun-113-625: #000091;
    --blue-france-sun-113-625-hover: #1212ff;
    --blue-france-sun-113-625-active: #2323ff;
    --blue-france-925-125: #e3e3fd;
    --blue-france-925-125-hover: #c1c1fb;
    --blue-france-925-125-active: #adadf9;
    --warning-main-525: #d64d00;
    --valid-main-525: #1f8d49;
    --info-main-525: #0078f3;
    --error-main-525: #f60700;
    --shadow-color: rgba(0,0,18,.16);
    --raised-shadow: 0 1px 3px var(--shadow-color);
    --overlap-shadow: 0 2px 6px var(--shadow-color);
    --lifted-shadow: 0 3px 9px var(--shadow-color);
}

/* Récupération des typos */
@font-face {
    font-family: "Marianne";
    font-weight: lighter;
    src: url('/assets/theme_font/Marianne-Light.woff');
}
@font-face {
    font-family: "Marianne";
    font-weight: bolder;
    src: url('/assets/theme_font/Marianne-Medium.woff');
}
@font-face {
    font-family: "Marianne";
    font-weight: bold;
    src: url('/assets/theme_font/Marianne-Bold.woff');
}
@font-face {
    font-family: "Marianne";
    src: url('/assets/theme_font/Marianne-Regular.woff');
}
@font-face {
    font-family: "MarianneBold";
    src: url('/assets/theme_font/Marianne-Bold.woff');
}
@font-face {
    font-family: "MarianneLight";
    src: url('/assets/theme_font/Marianne-Light.woff');
}
@font-face {
    font-family: "MarianneRegular";
    src: url('/assets/theme_font/Marianne-Regular.woff');
}
@font-face {
    font-family: "MarianneMedium";
    src: url('/assets/theme_font/Marianne-Medium.woff');
}

/* || COULEURS */

/* Titres sections et facette des jeux de données */
.odswidget-facet__facet-title, .ods-catalog-card__visualization, .ods-tabs__tab--horizontal {
    color: var(--grey-200);
}

/* Passage de la souris au dessus d'un titre Tableau/Analyse/Export ... */
.ods-catalog-card__visualization:hover {
    color: var(--grey-200-hover);
}

/* Tag présent sur les jeux de données et sur les pages*/

.fr-tags-group {
    display: flex;
    justify-content: start;
    list-style-type: none;
    padding:0px;
}

.fr-tag--sm{
    margin-left:1em;
}

.ods-catalog-card__keyword, .ods-dataset-visualization__edit-dataset-link, .fr-tag--sm{
    background-color: var(--blue-france-925-125);
    color: var(--blue-france-sun-113-625);
    font-size:12px;
    padding:4px 12px 4px 12px;
    border-radius:12px;
}

.ods-catalog-card__keyword:hover, .ods-dataset-visualization__edit-dataset-link:hover {
    background-color: var(--blue-france-925-125-hover);
    color: var(--blue-france-sun-113-625);
}


/* || TEXTES */

/* Header equipements.sports.gouv.fr */
.headertext {
    font-size: 2em;
    font-family: "MarianneRegular";
    color: #000091;
}

/* Titres */

h1 h2 h3 h4 {
    color: #3a3a3a;
    font-family: "MarianneRegular";
}

h1 {
    font-size: 40px;
    line-height: 48px;
    margin-bottom: 24px;
}

h2 {
    font-size: 32px;
    line-height: 40px;
    margin-bottom: 24px;
}

h3 {
    font-size: 28px;
    line-height: 36px;
    margin-bottom: 24px;
}

h4 {
    font-size: 24px;
    line-height: 32px;
    margin-bottom: 24px;
}

/* Corps de texte principal */
body {  
    font-family: "Marianne", "Segoe UI", Roboto, Helvetica, Arial, sans-serif
}

.fr-text p, .fr-text li {
    font-size:1.2em;
    text-align:justify;
    margin-bottom:1em;
}

/* Liens */

a:hover {
    color: #000091;
    text-decoration: none;
}

/* || DSFR SEARCH BAR */
.fr-search-bar {
    width:100%;
    display: flex;
    flex-direction: row;
    padding: 1em;
}
/* Search Bar Input */
.fr-input {
    width:100%;
    padding: 0.75rem 1.5rem;
    border-radius: .25rem 0 0 0;
    border: 0;
    background-color : var(--grey-975);
    font-size: 1rem;
    border-bottom: 2px solid var(--blue-france-sun-113-625);
}
.fr-input:hover::placeholder {
    color: var(--blue-france-sun-113-625);
}
/* Search Bar Icone recherche */
.fr-btn {
    padding: 0.75rem 1.5rem;
    border-radius: 0 .25rem 0 0;
    border: 0;
    color : var(--grey-1000);
    background-color : var(--blue-france-sun-113-625);
    font-size: 1rem;
    width: max-content;
    border-bottom: 2px solid var(--blue-france-sun-113-625);
}
.fr-btn:hover {
    background-color : var(--blue-france-sun-113-625-hover);
    border-bottom: 2px solid var(--blue-france-sun-113-625-hover);
}

.fr-btn i {
    margin-right: 0;
    color : var(--grey-1000);
}
.fr-btn i:hover{
    background-color : var(--blue-france-sun-113-625-hover);
}

@media screen and (max-width: 768px) {
    .lg-view{
        display:none;
    }
}

/* || KPI */

.kpi-card {
    background-color: #FFFFFF;
    height: 100%;
    padding: 20px;
    border-radius: 4px;
    margin-bottom: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
}

.kpi-icon {
    color: #000091;
    color: var(--secondary-color);
    font-size: 3rem;
    margin-top: 0;
    margin-bottom: 13px;
    max-width: 100%;
}

/* Tuiles */

.fr-tile__container {
    display: flex;
    flex-wrap: wrap;
}

@media (max-width: 768px) {.fr-tile__container > a {
    width: 100%;
    padding-top: 20px;
    }
}

.fr-tile {
    min-height: 100%;
    width : 100%;
    padding : 32px 32px 36px 32px;
    display: flex;
    flex-direction: column;
    border-top: solid 1px var(--grey-950);
    border-right: solid 1px var(--grey-950);
    border-left: solid 1px var(--grey-950);
    border-bottom: solid 5px #000091;
    text-align: center;
    color: #161616;
}

.fr-tile:hover {
    background-color : var(--grey-1000-hover);
}

.fr-tile__title {
    color: #000091;
    min-height: 2.5em;
}


/* KPI to do */

.kpi-title {

}

.kpi-number {

}

.kpi-desc {

}


/* || MISE EN PAGE */

/* Général */

.box 
{
    padding:30px 30px 30px 30px;
    max-width : var(--general-width);
    margin-left:auto;
    margin-right:auto;
    margin-top:20px;
    margin-bottom:10px
}

.box-white
{
    background-color:#FFFFFF;
    padding:30px 30px 30px 30px;
    max-width : var(--general-width);
    margin-left:auto;
    margin-right:auto;
    margin-top:20px;
    margin-bottom:10px
}

/* Enlever les padding */

.wo-padding {
    padding:0px;
}

.shadow 
{
    box-shadow:var(--lifted-shadow)
}

/* Bouton */

.bouton, .ods-error-page__home-link-item {
    background-color:var(--blue-france-sun-113-625);
    padding:0.5em 2em; 
    color:var(--blue-france-975-75);
    margin-top:10px;
    margin-bottom:10px;
}

.bouton:hover, .ods-error-page__home-link-item:hover { 
    background-color:var(--blue-france-sun-113-625-hover);
    color:var(--blue-france-975-75);
    text-decoration:none;
}

.bouton-clear {
    background-color:transparent;
    padding:7px 36px; 
    color:var(--blue-france-sun-113-625);
    border:1px solid var(--blue-france-sun-113-625);
    box-shadow: none;
    margin-top:10px;
    margin-bottom:10px;
}

.bouton-clear:hover { 
    background-color:var(--blue-france-975-75);
    color:var(--blue-france-sun-113-625);
    text-decoration:none;
    box-shadow: none;
}

/* Selection */

.fr-select {
    padding: 8px 40px 8px 16px;
    margin-top: 8px;
    font-family: 'Marianne', "Open Sans", Helvetica, arial, sans-serif;
    font-size: 16px;
    color: #161616;
    border:none;
    border-radius: 3px 3px 0px 0px;
    border-bottom: 2px solid var(--grey-200);
    background-color: var(--grey-950);
    max-width: 100%;
}

.fr-select:hover {
    background-color: white;
}

option {
    font-family: 'Marianne', "Open Sans", Helvetica, arial, sans-serif;
    font-size: 16px;
}

/* Date input */

.odswidget-timerange {
    text-align: left;
}

.odswidget-timerange__label {
    font-family: 'Marianne', "Open Sans", Helvetica, arial, sans-serif;
    font-size: 16px;
    color: #161616;
    padding : 4px;
}

.odswidget-timerange__input {
    padding: 8px 40px 8px 16px;
    margin-top: 8px;
    font-family: 'Marianne', "Open Sans", Helvetica, arial, sans-serif;
    font-size: 16px;
    color: #161616;
    border:none;
    border-radius: 3px 3px 0px 0px;
    border-bottom: 2px solid var(--grey-200);
    background-color: var(--grey-950);
    max-width: 100%;
    width : 150px;
}

/* Tableau des ODS Widgets ADV TABLE */
/* tout doit être en !important pour changer ce qui est en place */

div.odswidget-adv-table__container {
    border-radius: 0px !important;
    -webkit-box-shadow : none !importnant;
    box-shadow : none !important;
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}

div.odswidget-adv-table__container table tr td {
    background-color: transparent !important;
    padding : 16px !important ;
    border : none !important;
}

table.odswidget-adv-table__table {
    border-collapse: separate;
    border-spacing: 0;
}

table.odswidget-adv-table__table th {
    font-family: 'MarianneBold', "Open Sans", Helvetica, arial, sans-serif !important;
    color : var(--grey-50) !important;
    padding : 16px !important ;
    border-radius : 0px !important;
    background-color : var(--grey-950) !important;
    border-bottom : 2px solid var(--grey-200) !important;
}

table.odswidget-adv-table__table td {
    color : var(--grey-200) !important;
}

table.odswidget-adv-table__table tr:nth-child(even) {
    background-color: var(--grey-975) !important;
}

table.odswidget-adv-table__table tr:nth-child(odd) {
    background-color: var(--grey-950) !important;
}

/* Jeux de données (box et titre) */

.ods-catalog-card h2 {
    border:none;
    color:initial;
    font-size:initial;
    margin-bottom:initial;
    padding-top:initial
}
.ods-catalog-card .ods-catalog-card__metadata-item-value-text a {
    color:initial
}

/* || BOITE D'ALERTE */

.fr-alert {
    position: relative;
    background-color: var(--grey-1000);
    border: solid black;
    border-width: 1px 1px 1px 40px;
    padding: 1em
}

.fr-alert__title {
    margin: 0px;
    font-size: 1.5em;
    line-height: 1.5em;
}

.fr-alert__icon {
    position: absolute;
    top: 18px; 
    left: -32px;
    filter: invert(100%);
}

.fr-alert--error {
    border-color: var(--error-main-525)
}

.fr-alert--warning {
    border-color: var(--warning-main-525)
}

.fr-alert--valid {
    border-color: var(--valid-main-525)
}

.fr-alert--info {
    border-color: var(--info-main-525)
}

/* || TETE DE PAGE */

/* FROM DSFR (on fait au mieux) */

@media (min-width: 62em) {
    .fr-header {
        --idle: transparent;
        --hover: var(--background-raised-grey-hover);
        --active: var(--background-raised-grey-active);
        background-color: #FFF;
        filter: drop-shadow(var(--raised-shadow));
        z-index: 500;
        position: relative;
    }
}

.fr-header__logo {
    height : 120px;
}

.header-text {
    font-family: 'MarianneBold', "Open Sans", Helvetica, arial, sans-serif;
    font-size: 20px;
    color: var(--blue-france-sun-113-625);
    padding-left:15px;
    margin-bottom:0;
}

.header-tagline {
    font-size: 16px;
    color: #161616;
    padding-left:15px;
}

.fr-container {
    background-color: white;
    max-width : var(--general-width);
    margin-left :auto ;
    margin-right : auto;
}

.fr-header__body-row {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    padding: 1.5rem 0;
    margin: 0 -1rem;
    position: relative;
}

.fr-header__brand {
    background: transparent;
    filter: none;
    flex-wrap: nowrap;
    margin-bottom: -1rem;
    margin-top: -1rem;
    padding-left: 0;
    padding-right: 0;
    width: auto;
    z-index: auto;
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    margin-left:20px;
}

.fr-header__menu {
    border-top-width : 1px;
    border-top-style: solid;
    border-color: var(--foot-border);
    box-shadow: 0 3px 3px var(--shadow-color);
}

.fr-header__under-login {
    position : absolute;
    top: 75px;
    right: 20px;
    padding-right: 12px;
    margin-right: 10px;
}

.fr-nav__list {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display : flex;
    flex-wrap : wrap;
    flex-direction : row;
}

/* BOUTON NAVIGATION LIEN (doit être le même que dropbtn) */

.fr-nav__item {
    margin-left:10px;
}

.fr-nav__link {
    background-color: white;
    color: #161616;
    padding: 16px;
    height: 100%;
    font-size: 14px;
    font-family: 'MarianneRegular', "Open Sans", Helvetica, arial, sans-serif;
    border: none;
    cursor: pointer;
    display: inline-block;
    border-bottom : solid 2px white;
}

.fr-nav__link:hover {
    color: var(--blue-france-sun-113-625);
    background-color: var(--blue-france-975-75);
    border-bottom : solid 2px var(--blue-france-sun-113-625);
}

/* Style The Dropdown Button (doit être le même que fr-nav__link) */

.dropbtn {
    background-color: white;
    color: #161616;
    padding: 16px;
    font-size: 14px;
    font-family: 'MarianneRegular', "Open Sans", Helvetica, arial, sans-serif;
    border: none;
    cursor: pointer;
    display: inline-block;
    border-bottom : solid 2px white;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: white;
    font-size: 14px;
    font-family: 'MarianneRegular', "Open Sans", Helvetica, arial, sans-serif;
    min-width: 200px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 2;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {
    color: var(--blue-france-sun-113-625);
    background-color: var(--blue-france-975-75);
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
    color: var(--blue-france-sun-113-625);
    background-color: var(--blue-france-975-75);
    border-bottom : solid 2px var(--blue-france-sun-113-625);
}

/* MOBILE */

.fr-header-mobile__logo {
    height : 120px;
}

.ods-responsive-menu-placeholder__container {
    background-color : white; 
    border-bottom : solid 1px var(--foot-border);
    text-align : left ;
}

/* Menu Mobile (burger) */

/* Logo burger */
.ods-responsive-menu-placeholder__toggle {
    color:#161616;
    background-color:white;
}
.ods-responsive-menu-placeholder__toggle:hover {
    color: var(--blue-france-sun-113-625);
    background-color: var(--blue-france-975-75);
}

/* fr-container Suppression des marges */
.ods-responsive-menu-collapsible--collapsed > .ods-responsive-menu-collapsible__container > .ods-responsive-menu-collapsible__content > .fr-header__menu > .fr-container {
    padding-left:0;
    padding-right:0;
}
/* fr-na__item Centrer les boutons */
.ods-responsive-menu-collapsible--collapsed > .ods-responsive-menu-collapsible__container > .ods-responsive-menu-collapsible__content > .fr-header__menu > .fr-container > .fr-nav > .fr-nav__list > .fr-nav__item {
    width:100%;
    margin-left:0;
}
/* fr-nav__link */
.ods-responsive-menu-collapsible--collapsed > .ods-responsive-menu-collapsible__container > .ods-responsive-menu-collapsible__content > .fr-header__menu > .fr-container > .fr-nav > .fr-nav__list > .fr-nav__item > .fr-nav__link {
    width:100%;
}
/* dropdown */
.ods-responsive-menu-collapsible--collapsed > .ods-responsive-menu-collapsible__container > .ods-responsive-menu-collapsible__content > .fr-header__menu > .fr-container > .fr-nav > .fr-nav__list > .fr-nav__item > .dropdown {
    width:100%;
}
/* dropbtn */
.ods-responsive-menu-collapsible--collapsed > .ods-responsive-menu-collapsible__container > .ods-responsive-menu-collapsible__content > .fr-header__menu > .fr-container > .fr-nav > .fr-nav__list > .fr-nav__item > .dropdown > .dropbtn {
    width:100%;
}
/* dropdown-content */
.ods-responsive-menu-collapsible--collapsed > .ods-responsive-menu-collapsible__container > .ods-responsive-menu-collapsible__content > .fr-header__menu > .fr-container > .fr-nav > .fr-nav__list > .fr-nav__item > .dropdown > .dropdown-content {
    position:relative;
    width:100%;
}
/* Suppression des logos */
.ods-responsive-menu-collapsible--collapsed > .ods-responsive-menu-collapsible__container > .ods-responsive-menu-collapsible__content > .fr-header__body {
    display:none;
}

/* Modification secondary-menu ODS (connexion) */

/* Recentrer les boutons de connexions*/
.ods-front-header__management-menu {
    top: 20px;
}

/* Bouton back office */
.ods-front-header__management-menu-item--backoffice {
    background-color: white;
    margin:0;
}

/* Textes */
.ods-front-header__management-menu-item{
    padding : 4px 12px 4px 12px;
}

.ods-front-header__management-menu-item-link, .fr-header__button {
    color:var(--blue-france-sun-113-625);
    font-size: 14px;
    font-family: 'Marianne', "Open Sans", Helvetica, arial, sans-serif;
    margin : 0;
}
.ods-front-header__management-menu-item-link:hover, .fr-header__button:hover{
    background-color:var(--grey-975);
    border-bottom: 0px;
}


/* || PIED DE PAGE */

/* Cadre général */
.ods-front-footer__back { 
    position: relative;   
    bottom: 0; 
    left: 0;
    right: 0;
    width: 100%;
    height:auto; 
    line-height:auto;
    padding-bottom:1%;
    padding-top:1em;
    border-top:solid 2px var(--foot-border);
    background-color: white;

}

.ods-front-footer__container {
    max-width : var(--general-width);
    margin-top :20px;
    margin-left :auto;
    margin-right :auto;
}

.ods-front-footer__body {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
}

/* Logos et liens */

.ods-front-footer__logo {
    height: 150px;
}

.ods-front-footer__link {
    line-height:40px;
    padding-left:1em;
    padding-right:1em;
    color:#161616;
}

/* Pour prendre en compte la gestion des cookies */

.ods-front-footer__line a, .ods-front-footer__line{
    color:var(--grey-main-525);
}

.ods-front-footer__link:hover {
    text-decoration: none;
    color:#000091;
} 

.ods-front-footer__bottom-list {
    border-top:solid 2px var(--foot-border);
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    padding: 0px;
    margin-bottom: 0px;
}

.ods-front-footer__bottom-item {
    color: grey;
    display: inline;
}

/* LICENCE FOOTER */

.ods-front-footer__licence {
    text-align: left;
    padding-left:1em;
}

.ods-front-footer__licence a{
    text-align: left;
    padding-left:0;
}

.ods-front-footer__licence a:hover{
    color:#000091;
}

/* || NON CLASSE */

.ods-front-header {
    padding-left :0px;
    padding-right :0px;
}

@media (min-width: 992px) {
    .ods-front-header {
        height: 148px;
        margin-bottom: 0px;
    }  
    .fr-header__responsive-login {
        display : none;
    }
    .@media (min-width: 992px)
}

@media (min-width: 1200px) {
    .ods-front-header__menu-item {
        margin-right: 2%;
    }     
}

/* Tweet */
.partage {float:right; 
    margin-top:-8%;
    margin-right:3%;
    overflow:auto;
    margin-bottom:1%;
    width:20%;
    height:auto;
    text-align:right;

}

hr {clear: both;
    visibility: hidden; 
    width:100%; 
    height:1%; 
    line-height:1%;    

}

/* Correction explore */


.mb10 {margin-bottom:10%;}
.mb5 {margin-bottom:5%;}

.main--page {margin:0}
.maxwidth {max-width:1000px;margin:auto}
.back-lightgrey {background-color:#F6F6F6}

.padding-t {padding-top:100px}

.ods-content {overflow:hidden}