/********************************************
*  CSS FDH PEPI 
*
*  2020.01.20 -  Les steppes mongoles 
*  
*
*****************************************/
/* 
 Seuil responsive
 1200px
 979px
 767px
 480px
*/
/* 1. BASE
==============================================================================*/
/* 1.0 fonts
------------------------------------------------------------------------------*/
/* google fonts
   Cabin Sketch + Montserrat + Open sans
*/
.font-cabin {
    font-family: 'Cabin Sketch', cursive;
}

.font-open {
    font-family: 'Open Sans', sans-serif;
}

.font-montserrat {
    font-family: 'Montserrat', sans-serif;
}

/* 1.1 color
------------------------------------------------------------------------------*/
.orange {
    color: #eb6622;
}

.orange-bg {
    background-color: #eb6622;
}

.blue {
    color: #005f8f;
}

.blue-bg {
    background-color: #005f8f;
}

.font-blue {
    color: #0381c1;
}

.lightblue {
    color: #3da7d8;
}

.lightblue-bg {
    background-color: #3da7d8;
}

.font-lightblue {
    color: #42b3ff;
}

.lightbluemap {
    color: #b5d0d0;
}

.lightbluemap-bg {
    background: #b5d0d0;
}

.gray {
    color: #4b4b4b;
}

.gray-bg {
    background-color: #4b4b4b;
}

.black {
    color: #000;
}

.black-bg {
    background-color: #000;
}

.white {
    color: #fff;
}

.white-bg {
    background-color: #fff;
}

.ivory {
    color: #f4f2e9;
}

.ivory-bg {
    background-color: #f4f2e9;
}

/* 1.1 Tags & Reset --> bootstrap
------------------------------------------------------------------------------*/
body {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    background: #fff;
    color: #434343;
}

@media (max-width: 767px) {
    body {
        padding-left:0;
        padding-right: 0;
    }
}

input, button, select, textarea {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px !important;
}

/* surcharge bootstrap pour eviter le 'Helvetica Neue' */
h1, h6 {
    font-family: 'Cabin Sketch', cursive;
    font-weight: 700;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

h2, h3, h4, h5, strong, b, legend {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
}

abbr {
    text-decoration: none;
    border: none !important;
}

h1 {
    font-size: 2.5em;
    margin-top: 0.5em;
    line-height: 120%;
}

h3 {
    font-size: 1.4em;
    margin-top: .5em;
    margin-bottom: 0.5em;
}

h5 {
    font-size: 1.1em;
    margin-bottom: 0.2em;
}

iframe {
    width: 100%;
    margin-bottom: 1em;
}

/* pour que youtube soit responsive */
/* les tags */
a {
    color: #3da7d9;
}

a:focus, a:hover, a:active {
    background-color: transparent;
    color: #123b57;
}

a[hreflang]:after {
    content: "";
}

a.fat {
    font-weight: bold;
    text-decoration: none!important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

a.but-img:hover {
    opacity: 0.6;
}

.but-invisible {
    visibility: hidden;
}

h1 a {
    text-decoration: none !important;
}

h3 img {
    vertical-align: baseline;
}

/*
.debug-layout {display:none;}  
*/
/*
.row {background:#ccc;}
.span1,.span2,.span3,.span4,
.span5,.span6,.span7,.span8,
.span9,.span10,.span11,.span12 {background:pink;} 
*/
/* 1.1bis Tailles
------------------------------------------------------------------------------*/
.size-15 {
    font-size: 1.5rem;
}

.size-12 {
    font-size: 1.2rem;
}

.size-11 {
    font-size: 1.1rem;
}

.size-10 {
    font-size: 1.0rem;
}

.size-9 {
    font-size: 0.9rem;
}

.size-8 {
    font-size: 0.8rem;
}

/* 1.2 Base SPIP 
------------------------------------------------------------------------------*/
.spacer, hr.spip {
    clear: both;
}

/* Document (version 2015.03.04) */
dl.spip_documents {
    margin: 0;
}

.spip_documents a.spip_out {
    background: transparent !important;
    text-decoration: none!important;
    border: 0px #fff !important;
}

/* pour eviter les bordures sur lien img [<img1>->url] */
.spip_documents_left {
    float: left;
    margin-right: 1.5em;
    margin-bottom: 0.8em;
}

.spip_documents_right {
    float: right;
    margin-left: 1.5em;
    margin-bottom: 0.8em;
}

@media (max-width: 967px) {
    .spip_documents_left, .spip_documents_right {
        float:none;
        margin: 1em 0;
    }
}

dl.spip_documents_center, .spip_documents_center {
    display: block !important;
    float: none;
    text-align: center;
    margin: .8em auto;
}

.spip_doc_titre, .spip_doc_descriptif {
    clear: both;
    font-size: 0.8em;
    margin: 0 auto;
    font-family: Verdana;
}

img.spip_logos {
    margin: 10px;
}

dl.spip_documents a img {
    border: 0 !important;
}

/* modele speciale img afficher titre et desc */
.spip_doc_titre {
    font-size: 0.9em;
    font-weight: bold;
}

.spip_doc_descriptif {
    font-size: 0.8em;
    font-weight: normal;
}

dd.spip_doc_credits {
    font-size: 0.8em;
    text-align: center;
    margin: 0;
}

/* formulaire */
.erreur_message {
    font-size: 11px;
    color: #d00;
    display: block;
    font-family: arial,verdana;
    font-size: 110%;
}

.reponse_formulaire {
    margin: 1em 0;
    font-family: arial,verdana;
    font-size: 110%;
}

.reponse_formulaire_ok {
    color: #0a0;
    font-family: arial,verdana;
    font-size: 110%;
}

.formulaire_spip ul, .formulaire_spip li {
    margin: 0;
    padding: 0;
    list-style: none;
}

.spip_surligne {
    background: yellow;
}

#spip-admin {
    left: 35%;
}

/* tableau */
table.spip {
    font-size: 0.78rem;
}

/* en responsive,  lineariser le tableau pour eviter les scrolls*/
@media (max-width: 767px) {
    table.spip th, table.spip tr, table.spip td {
        display:block;
    }

    table.spip thead th {
        border-bottom: none !important;
    }

    table.spip thead th+th {
        border-top: none;
    }

    table.spip tr {
        border-bottom: 1px solid;
    }

    table.spip td {
        border-bottom: none;
    }
}

/* 2. LAYOUT
==============================================================================*/
.invisible {
    display: none;
}

.clear {
    clear: both;
}

.align-left {
    text-align: left !important;
}

.align-right {
    text-align: right !important;
}

.align-center {
    text-align: center !important;
}

.uppercase {
    text-transform: uppercase;
}

.strong {
    font-weight: bold;
}

.align-items {
    display: flex;
    flex-direction: row;
    justify-content: center;
}

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

.margin-top-2rem {
    margin-top: 2rem;
}

.margin-bottom-1-5rem {
    margin-bottom: 1.5rem;
}

.margin-bottom-1-9rem {
    margin-bottom: 1.9rem;
}

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

.margin-bottom-9rem {
    margin-bottom: 9rem;
}

.padding-bottom-1-9rem {
    padding-bottom: 1.9rem;
}

.padding-bottom-4rem {
    padding-bottom: 4rem;
}

.padding-bottom-9rem {
    padding-bottom: 9rem;
}

.margin-top-1-5rem {
    padding-top: 1.5rem;
}

.padding-top-2rem {
    padding-top: 2rem;
}

.padding-top-4rem {
    padding-top: 4rem;
}

.padding-top-9rem {
    padding-top: 9rem;
}

.margin-left-1rem {
    margin-left: 1rem;
}

/* 2.1 Header
------------------------------------------------------------------------------*/
.header {
    position: relative;
    background: transparent url(../img/gradient.png) repeat-x;
}

/* exception pour les pages sans slides */
.header-noslide {
    background-image: url(../img/logo-generique.png);
    background-size: contain;
    min-height: 150px;
}

@media (max-width: 767px) {
    .header-noslide {
        background-image:none;
        min-height: 100px;
    }
}

.header-head {
    display: inline;
    margin: .7rem 1rem 0 0;
    width: 200px;
    /* reduire la taille du logo pepi */
}

.header-baseline {
    display: none;
}

.nav {
    position: absolute;
    width: 100%;
    z-index: 1000;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-end;
}

.nav-menu, .nav-menu li {
    margin: 0;
    padding: 0;
    list-style: none;
    display: inline-block;
}

.nav-menu span {
    display: none;
}

.nav-menu a {
    display: inline-block;
    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    text-align: center;
    font-size: 0.85rem;
    margin-right: .7rem;
}

.nav-menu a.on, .nav-menu a:hover {
    /*background-color:#db813a;*/
    transition: all .2s ease-in;
}

.burger {
    display: none;
}

.slide-encart {
    background: #3a709e;
    width: 30rem;
    padding: 1rem;
    box-shadow: 8px 8px 5px rgba(0, 0, 0, 0.5);
    color: #fff;
    position: absolute;
    left: 0;
    bottom: 3rem;
}

.pepin .slide-encart {
    background: #eb6622;
    width: 24rem;
}

.slide-encart a {
    color: #fff;
    font-weight: 700;
}

.slide-encart a:hover {
    color: #123b57;
}

.slide-key {
    margin: .9rem 0;
}

.slide-key span {
    font-family: 'Cabin Sketch', cursive;
    font-weight: 700;
    font-size: 1.55rem;
    padding: 4px;
    border: 1px solid #fff;
    text-transform: uppercase;
}

.slide-encart-texte {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.5rem;
    line-height: 120%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

.slide-encart-texte-emphasis {
}

.slider-wrapper {
    /*border:1px solid red;*/
    position: relative;
    /*height:50vh;
	min-height:400px;*/
}

@media (max-width: 979px) {
    .slide-gradient {
        display:none;
    }

    .slide-key {
        display: none;
    }

    .slide-encart {
        width: calc(100% - 2em);
        box-shadow: none;
        bottom: 0;
        left: 0 !important;
    }

    .slide-encart-texte {
        font-size: 1rem;
        margin-right: 130px;
        min-height: 60px;
    }
}

/*** les slides - owl-carousel ***/
.slide-gradient {
    position: absolute;
    background: transparent url(../img/gradient.png) repeat-x;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 10;
    min-height: 200px;
    pointer-events: none;
}

/* hack 2023: limiter la hauteur 70% */
.slide, .slide-img img {
    max-height: 70vh !important;
    object-fit: cover !important;
}

/* hack 2023 end */
.owl-nav {
    position: absolute;
    right: 1%;
    margin-top: -90px;
}

.owl-nav div {
    display: inline-block;
    font-size: 0;
    width: 83px;
    height: 63px;
    background: transparent url(../img/slide-prev.png);
}

.owl-nav div.owl-next {
    background: transparent url(../img/slide-next.png);
}

.owl-nav div:hover {
    opacity: 0.6;
}

@media (max-width: 979px) {
    .owl-nav {
        margin-top:-70px;
    }

    .owl-nav div, .owl-nav div.owl-next {
        width: 41px;
        height: 31px;
        background-size: cover;
        margin-right: 5px;
    }
}

@media (max-width: 768px) {
    /* en rwd, footer la slide en hauteur */ .container-slides {
        min-height:30vh;
    }

    .slide {
        min-height: 30vh;
    }

    .header-head-logo {
        padding-left: 5px;
        max-width: 120px;
        height: auto;
    }

    .slide-encart {
        padding-top: 10px;
        padding-bottom: 0;
    }

    .slide-encart-texte {
        font-size: .7rem;
    }
}

/* 2.3 Contenu
------------------------------------------------------------------------------*/
.contenu a {
    text-decoration: underline;
}

/* 2.5 Footer
------------------------------------------------------------------------------*/
.footer {
    border-top: 1px solid #005f8f;
    color: #005f8f;
    font-size: .80rem;
    font-family: 'Montserrat', sans-serif;
}

.footer strong {
    font-size: .88rem;
}

.footer a {
    color: #005f8f;
    text-decoration: none !important;
    /* bug FF */
}

.footer a:hover {
    text-decoration: underline;
}

.footer a:hover img {
    opacity: 0.6;
    transition: all .2s ease-in;
}

/*** footer-col1 ***/
.footer-col1-inner {
    margin-top: 1em;
}

.footer-col1-inner-inner {
    display: flex;
    margin-top: 0.5em;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: top;
}

.footer-col1-inner-inner div {
    flex: 0 1 auto;
    margin-left: 20px;
}

.footer-col1-inner-inner div:first-child {
    margin-left: 0;
    margin-top: 5px;
}

.footer-col1-inner-inner div.footer-col1-texte {
    flex: 1 1 0;
}

/*** footer-col2 ***/
.footer-col2-inner {
    border-left: 1px solid #005f8f;
    border-right: 1px solid #005f8f;
    margin: 0 1em;
    min-height: 150px;
    color: #2d1c67;
}

.footer-col2-inner a {
    color: #2b1d68;
}

.footer-col2-inner a:hover {
    color: #8d80ba;
    text-decoration: none;
}

.footer-col2-inner-inner a {
    /*display:flex;
	margin-top:3.5em;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;*/
    text-align: center;
}

.footer-col2-logo {
    padding: 2rem 0 0 0;
}

.footer-col2-texte {
    /*flex:1 1 0;*/
    padding-bottom: 2rem;
}

/*** footer-col3 ***/
.footer-col3-inner {
    margin-top: 2.0rem;
}

.footer-col3-inner strong {
    font-size: 1.1rem;
}

.footer-social {
    margin: .5rem 0 .4em 0;
}

.footer-copy {
    font-family: 'Open Sans', sans-serif;
    margin: 2rem 0 2rem 0;
    /*text-align:right;*/
}

.footer-copy strong {
    font-size: 0.9rem !important;
}

.footer-copy a:hover {
    color: #3da7d8;
}

/* socicon */
.socicon {
    font-size: 1.6rem;
    margin-right: .4em;
    border-radius: 200%;
    transition: all .2s ease-in;
    border: none !important;
    text-decoration: none !important;
}

a.facebook, a.twitter {
    text-decoration: none !important;
}

.socicon:hover {
    color: #72beba;
}

@media (max-width: 767px) {
    .footer {
        padding-left:10px;
        padding-right: 10px;
    }

    .footer-col2-inner {
        margin: inherit;
        border: none;
        min-height: 0;
    }

    .footer-col2-inner-inner a {
        display: block;
        text-align: center;
    }

    .footer-col3-inner {
        margin-bottom: 2em;
        text-align: center;
    }
}

/* 3. PAGES 
==============================================================================*/
/* 3.0 Homepage Sommaire
------------------------------------------------------------------------------*/
.dashed {
    /*border-bottom:1px dashed;*/
    /* https://stackoverflow.com/questions/6250394/how-to-increase-space-between-dotted-border-dots*/
    background-image: linear-gradient(to right, #3da7d8 50%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 25px 1px;
    background-repeat: repeat-x;
}

.dashed-blue {
    background-image: linear-gradient(to right, #005f8f 50%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 25px 1px;
    background-repeat: repeat-x;
}

h1.dashed {
    display: inline-block;
    margin-top: 4.5rem;
    margin-bottom: 1.1rem;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0.6rem;
    text-transform: uppercase;
}

h1.dashed.font-blue {
    background-image: linear-gradient(to right, #005f8f 50%, rgba(255,255,255,0) 0%);
}

/*** icones pepi ****/
.icon {
    width: 36px;
    height: 35px;
    margin-right: 13px;
    background-size: cover;
    /* pour permettre eviter les pb en responsive */
}

.icon-clock {
    background: transparent url(../img/icon-clock.png) no-repeat;
}

.icon-dl {
    background: transparent url(../img/icon-dl.png) no-repeat;
}

.icon-arrow-white {
    background: transparent url(../img/icon-arrow-white.png) no-repeat;
}

.icon-video, .icon-video-orange {
    background: transparent url(../img/icon-video.png) no-repeat;
    height: 51px;
    position: relative;
    top: -8px;
}

.icon-video-orange {
    background: transparent url(../img/icon-video-orange.png) no-repeat;
}

.icon-big {
    height: 57px;
    width: 57px;
    position: relative;
    top: -10px;
}

.icon-info {
    background: transparent url(../img/icon-info.png) no-repeat;
}

.icon-arrow {
    background: transparent url(../img/icon-arrow.png) no-repeat;
}

.icon-spot {
    background: transparent url(../img/icon-spot.png) no-repeat;
}

.icon-mail {
    background: transparent url(../img/icon-mail.png) no-repeat;
}

.icon-arrow-orange {
    background: transparent url(../img/icon-arrow-orange.png) no-repeat;
}

.icon-arrow-down-orange {
    background: transparent url(../img/icon-arrow-down-orange.png) no-repeat;
}

.icon-arrow-down-blue {
    background: transparent url(../img/icon-arrow-down-blue.png) no-repeat;
}

.icon-target {
    background: transparent url(../img/icon-target.png) no-repeat;
}

.icon-team {
    background: transparent url(../img/icon-team.png) no-repeat;
}

@media (max-width: 767px) {
    .icon {
        width:36px;
        height: 35px;
        transform: scale(0.5);
        margin-top: -7px;
        margin-right: 2px;
    }

    .icon-video, .icon-video-orange {
        height: 57px;
        top: -12px;
    }

    .icon-big {
        height: 57px;
        width: 57px;
        top: -12px;
    }
}

/*** home-bg ***/
.home-bg img {
    width: 100%;
    height: auto;
}

/*** bloc news ***/
.bloc-news-wrapper {
    display: flex;
    justify-content: space-around;
    margin-bottom: 2rem;
}

.bloc-news {
    width: 28%;
    max-width: 240px;
    /* largeur du masque */
}

.bloc-news a {
    text-decoration: none;
}

.bloc-news-img {
    text-align: center;
    margin: .4rem .4rem 1rem .4rem;
}

.bloc-news-date {
    margin-bottom: 0.4em;
    margin-left: 1rem;
    font-size: 1.2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

.bloc-news-key {
    margin-bottom: 0.5rem;
    margin-left: 1rem;
}

.bloc-news-key span {
    background: #3da7d8 none repeat scroll 0 0;
    color: #f7f4ee;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 2px 3px;
    text-transform: uppercase;
    display: inline-block;
    margin-bottom: 3px;
}

.bloc-news-key a {
    text-decoration: none;
}

.bloc-news-orange .bloc-news-key span {
    background-color: #eb6622;
}

.bloc-news-blue .bloc-news-key span {
    background-color: #005f8f;
}

a:hover .bloc-news-key span {
    background: #123b57;
}

.bloc-news-titre {
    font-family: "Montserrat",sans-serif;
    border-bottom: 1px solid;
    font-size: 1.13rem;
    font-weight: 700;
    margin-bottom: 0.4em;
    padding-bottom: 0.5rem;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    margin-left: 1rem;
    /* pour le image masque */
}

.bloc-news-titre-big {
    font-size: 1.2rem;
    margin-bottom: 1.8rem;
    border: none;
}

.bloc-news-titre-big + .bloc-news-texte-s p:first-child {
    margin-top: -1rem;
}

.bloc-news-texte {
    font-size: 1.2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    margin-left: 1rem;
    /* pour le image masque */
}

.bloc-news-texte-s {
    font-size: 1em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    margin-left: 1rem;
    /* pour le image masque */
}

.bloc-news-orange {
    color: #eb6622;
}

.bloc-news-blue {
    color: #005f8f;
}

.bloc-news-lightblue {
    color: #3da7d8;
}

@media (max-width: 767px) {
    .bloc-news-wrapper {
        display:block;
    }

    .bloc-news {
        width: 100%;
        margin: 0 auto 3em auto;
    }
}

/*** bloc-news-wrapper-4cols ***/
/* ce bloc est un declinaison du bloc-news defini plus haut */
.bloc-news-wrapper-4cols a {
    color: #005f8f;
}

.bloc-news-wrapper-4cols a:hover {
    color: #73b3de;
}

.bloc-news-wrapper-4cols .bloc-news {
    width: 20%;
    max-width: 240px;
    /* largeur du masque */
}

.bloc-news-wrapper-4cols .bloc-news-titre {
    border: none;
    font-weight: 400;
}

.bloc-news-next {
    padding-top: 40px;
}

@media (max-width: 767px) {
    .bloc-news-wrapper-4cols .bloc-news {
        width:100%;
        margin: 0 auto 3em auto;
    }

    .bloc-news-next {
        width: 100%;
        padding-top: 0;
        text-align: center;
    }
}

/*** bloc reassu ***/
.reassu {
    /*background:yellow; */
    text-align: center;
    margin: 1.5rem 3rem 1.5rem 3rem;
}

.reassu a {
    text-decoration: none;
}

.reassu a:hover {
    opacity: .9;
}

.reassu-titre {
    font-family: 'Cabin Sketch', cursive;
    font-size: 1.7rem;
    margin: 0.8rem 0;
    color: #0381c1;
    line-height: 1;
}

.reassu-orange .reassu-titre {
    color: #eb6622;
}

.reassu-logo-img {
    background: #0381c1;
    border-radius: 100%;
    width: 80px;
    height: 80px;
    padding: 15px;
}

.reassu-logo-img--orange {
    background: #eb6622;
}

.reassu-texte {
    color: #005f8f;
    line-height: 160%;
    font-size: .95rem;
}

/*** bloc reassu stats ***/
.homestat-wrapper {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

@media (max-width: 767px) {
    .homestat-wrapper {
        flex-direction:column;
    }
}

.homestat-item {
    margin: 1rem;
    padding-top: 1rem;
    text-align: center;
}

.homestat-item-3 {
    min-width: 25%;
}

.homestat-item-subwrapper {
    display: flex;
    justify-content: space-around;
}

.homestat-item-item:first-child {
    margin-right: 1rem;
}

.homestat-nb {
    font-family: 'Cabin Sketch', cursive;
    font-size: 3.5rem;
    color: #005f8f;
    padding: 1rem 0;
}

.homestat-cc {
    font-family: 'Cabin Sketch', cursive;
    font-size: 1.5rem;
    padding: .25rem 0;
    color: #eb6622;
    text-transform: uppercase;
}

.homestat-txt {
    color: #005f8f;
    font-size: .85rem;
}

/*** bloc reassu bloc texte ***/
.reassu-bloctxt {
    color: #005f8f;
}

.reassu-bloctxt-titre {
    margin-bottom: .25rem;
}

.reassu-bloctxt-2 {
    padding-top: 4rem;
}

@media (max-width: 767px) {
    .reassu-bloctxt {
        margin-bottom:5rem;
    }

    .reassu-bloctxt-titre, .reassu-bloctxt-texte {
        padding: 0 1rem;
    }
}

/* 3.1 Projet 
------------------------------------------------------------------------------*/
/* exception pour les page projet sans slide et avec medaillon superpose */
.owl-carousel.container-slides-overflow-show .owl-stage-outer {
    overflow: inherit;
}

/*** trio ***/
.trio {
    position: absolute;
    left: 6%;
    left: calc((100% - 1450px) / 2);
    bottom: -100px;
    width: 441px;
    height: 294px;
    background: transparent url(../img/bg-trio.png);
}

.trio-item {
    position: absolute;
}

.trio-item:hover {
    opacity: 0.9;
}

.trio-1 {
    top: 25px;
    left: 170px;
}

.trio-2 {
    top: 160px;
    left: 80px;
}

.trio-3 {
    top: 160px;
    left: 260px;
}

@media (max-width: 1200px) {
    .trio {
        display:none;
    }
}

/*** barometre ***/
.barometre {
    margin-top: 1.5rem;
    /* background:yellow;*/
    display: flex;
    justify-content: center;
    /*space-around;	*/
}

.barometre-item {
    /*background:pink;*/
    margin: 0 4px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #005f8f;
    padding: 0 1rem;
    border-right: 1px solid
}

.barometre-item1, .barometre-item2 {
    color: #eb6622;
    border-color: #eb6622;
}

.barometre-item1 {
    max-width: 200px;
}

.barometre-item6 {
    border: none;
    padding: 0;
    max-width: 152px;
    /*border:1px solid red;*/
}

.barometre-item6:hover {
    opacity: 0.6;
}

.barometre-illus {
    /*border:1px solid red;*/
    margin-right: 0.5rem;
}

.barometre-texte {
    /*border:1px solid pink;*/
}

@media (max-width: 1200px) {
    .barometre {
        flex-direction:column;
    }

    .barometre-item {
        border-top: 1px solid;
        border-right: none;
        padding: 1rem;
        justify-content: center;
    }

    .barometre-item1, .barometre-item6 {
        max-width: 100%;
        border-top: none;
    }
}

/*** fiche ****/
.header-projet-titre {
    background-image: linear-gradient(to right, #005f8f 50%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 25px 1px;
    background-repeat: repeat-x;
}

.header-projet-titre h1 {
    font-size: 2.1rem;
    text-transform: uppercase;
}

.fiche-slogan {
    margin-top: 2em;
    padding: 2em;
    color: #eb6622;
    font-size: 1.4rem;
    background-image: linear-gradient(to right, #eb6622 50%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 25px 1px;
    background-repeat: repeat-x;
}

.social-projet a {
    display: inline-block;
    margin-right: 3px;
}

.social-projet a:hover {
    opacity: 0.6;
}

@media (max-width: 767px) {
    .fiche-projet {
        padding:1rem;
    }

    .news-fb {
        display: none;
    }
}

/****** btn-border ******/
.btn-border-wrapper {
    display: flex;
}

a.btn-border {
    border: 1px solid;
    padding: 0.5rem;
    margin: 0 10px 5px 0;
    max-width: 60%;
    text-align: center;
    display: inline-flex;
    align-items: center;
    font-size: 1.1rem;
    text-decoration: none;
}

a.btn-border-double {
    min-height: 2.8em;
    font-style: italic;
}

a.btn-border.on {
    font-weight: normal;
}

a.btn-border-orange {
    color: #eb6622;
    border-color: #eb6622;
}

a.btn-border-orange.on {
    color: #fff;
    background-color: #eb6622;
}

a.btn-border-blue {
    color: #005f8f;
    border-color: #005f8f;
}

a.btn-border-blue.on {
    color: #fff;
    background-color: #005f8f;
}

a.btn-border-lightblue {
    color: #3da7d8;
    border-color: #3da7d8;
}

a.btn-border-lightblue.on {
    color: #fff;
    background-color: #3da7d8;
}

a.btn-border-white {
    color: #fff;
    border-color: #fff;
}

.btn-border:hover {
    opacity: 0.7;
}

.btn-next {
    background: transparent url(../img/but-next-row.png) no-repeat right center;
    padding-right: 28px !important;
}

.btn-previous {
    background: transparent url(../img/but-prev-row.png) no-repeat left center;
    padding-left: 28px !important;
}

/**** faq *****/
.faq-row {
    padding-bottom: 3rem;
}

.faq-row, .faq-row a {
    color: #fff;
}

.faq-row h1 {
    margin: 3.5rem 0 2rem 0;
    font-size: 2.8rem;
}

.faq-row h2 {
    font-family: 'Cabin Sketch', cursive;
    font-weight: 700;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-size: 1.7rem;
    padding: 2rem 0 0 0;
}

.faq-row .icon {
    margin-right: 0;
}

.faq-texte {
    /*border-bottom:1px dashed;*/
    /* https://stackoverflow.com/questions/6250394/how-to-increase-space-between-dotted-border-dots*/
    background-image: linear-gradient(to right, #fff 50%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 25px 1px;
    background-repeat: repeat-x;
    padding: 0 0 2rem 0;
}

.faq-row .faq-texte:last-child {
    background: none;
}

@media (max-width: 767px) {
    .faq-texte {
        margin:1em;
    }
}

/**** video ***/
.bg-video-top {
    background-image: url(../img/bg-video-top.png);
    background-size: cover;
    height: 34px;
}

.bg-video-bottom {
    background-image: url(../img/bg-video-bottom.png);
    background-size: cover;
    height: 46px;
}

/* 3.1' Projets tous 
------------------------------------------------------------------------------*/
/* projets: en cours */
.bloc-news-projet-wrapper {
    flex-wrap: wrap;
    justify-content: flex-start;
    /*space-between;*/
}

.bloc-news-projet-wrapper .bloc-news {
    font-size: 0.8rem;
    max-width: none;
    width: 22%;
    margin-right: 2.25%;
    margin-bottom: 2rem;
}

@media (max-width: 767px) {
    .bloc-news-projet-wrapper .bloc-news {
        width:90%;
        margin: 3rem auto;
        text-align: center;
    }
}

.bloc-news-projet-wrapper .bloc-news a {
    color: #005f8f;
}

.bloc-news-projet-wrapper .bloc-news a:hover {
    color: #3da7d9;
}

/* projets: archives */
.archives {
    /*background:yellow;*/
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    /*justify-content:space-between*/
    ; justify-content: flex-start;
}

.archive {
    width: 21%;
    margin-right: 4%;
    margin-bottom: 1.5rem;
    background-image: linear-gradient(to right, #005f8f 50%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 25px 1px;
    background-repeat: repeat-x;
}

@media (max-width: 767px) {
    .archive {
        width:90%;
        margin: 0.5rem auto;
    }
}

.archive:hover {
    background-color: #f1f1f1;
}

.archive a {
    display: flex;
    text-decoration: none;
    align-items: center;
    text-align: left;
    padding: .5rem .5rem 1.5rem .5rem;
}

.archive-illus {
    margin-right: .8rem;
}

.archive-illus img {
    max-width: 100px;
    border-radius: 100%;
}

.archive-texte {
}

/* 3.2 Article
------------------------------------------------------------------------------*/
.article-contenu {
    color: #005f8f;
}

@media (max-width: 767px) {
    .article-contenu {
        margin:1rem;
    }
}

.chapo {
    color: #005f8f;
    font-size: 1.2rem;
    line-height: 120%;
    padding: 1rem;
    text-align: center;
}

.chapo p:last-child {
    margin-bottom: 0;
}

.texte {
    font-size: 0.9rem;
    margin-top: 1rem;
}

.texte h3 {
    font-size: 1rem;
    margin-bottom: 0.1rem;
}

/* blockquote */
blockquote.spip {
    color: #eb6622;
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 120%;
    text-align: center;
    border: none;
    padding: 0;
    margin: 2.5rem 0;
    background-image: linear-gradient(to right, #eb6622 50%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 25px 1px;
    background-repeat: repeat-x;
}

blockquote.spip p {
    padding: 0 2rem;
}

blockquote.spip p:first-child {
    padding-top: 1.2rem;
    background-image: linear-gradient(to right, #eb6622 50%, rgba(255,255,255,0) 0%);
    background-position: top;
    background-size: 25px 1px;
    background-repeat: repeat-x;
}

blockquote.spip p:last-child {
    padding-bottom: 1.2rem;
}

/***** evenement ******/
.content-evenement {
    margin: 2rem 0 1rem 0;
    padding: 1rem 1rem 2rem 1rem;
    background: #fff;
    border-radius: 1rem;
}

/***** article-share *****/
.article-share h1 {
    background-image: linear-gradient(to right, #3da7d8 50%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 25px 1px;
    background-repeat: repeat-x;
    padding: 1rem;
}

.article-share-but a {
    opacity: .50
}

.article-share-but a:hover {
    opacity: .80
}

/***** article-more *****/
.article-more {
    padding: 2.5rem 0;
    background-image: linear-gradient(to right, #3da7d8 50%, rgba(255,255,255,0) 0%);
    background-position: top;
    background-size: 25px 1px;
    background-repeat: repeat-x;
}

.article-more a {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    text-decoration: none;
    color: #005f8f;
}

.more-illus {
    width: 30%;
    margin-left: 4%;
}

.more-texte {
    width: 56%;
    margin-right: 4%;
}

.article-more.first {
    background-image: none;
}

.article-more a:hover {
    color: #3da7d8;
}

.article-more a:hover img {
    opacity: 0.8;
}

@media (max-width: 767px) {
    .article-more a {
        flex-direction:column;
        flex-wrap: wrap;
    }

    .more-illus {
        margin: 1rem;
        width: auto;
        text-align: center;
    }

    .more-texte {
        margin: 1rem;
        width: auto;
    }
}

/*** article > doc ****/
.content-document {
    margin: 1em 0;
}

.docjoint {
    float: left;
    width: 240px;
    margin: 15px 25px 0 0;
    line-height: 110%;
}

.docjoint small, .docjoint strong {
    display: block;
}

.docjoint a {
    text-decoration: none;
}

.docjoint a img {
    border: 0;
}

/*  article > porfolio (mediabox) */
.portfolio {
    font-size: 0;
    /* pour le bloc inline*/
}

.portfolio-item {
    display: inline-block;
    position: relative;
    overflow: hidden;
}

.portfolio-affichage-2 .portfolio-item {
    width: 48%;
    margin-right: 4%;
    margin-bottom: 2%;
}

.portfolio-affichage-3 .portfolio-item {
    width: 30%;
    margin-right: 5%;
}

.portfolio-item img {
    width: 100%;
    height: auto;
}

.portfolio-affichage-2 .modulo2, .portfolio-affichage-3 .modulo3 {
    margin-right: 0%;
}

.portfolio-item span {
    visibility: hidden;
    position: absolute;
    bottom: 0;
    padding: 0.5em;
    left: 0;
    width: 100%;
    background: rgba(0,0,0,.5);
    color: #fff;
    font-size: 0.8rem;
}

.portfolio-item:hover img {
    opacity: .5;
}

.portfolio-item:hover span {
    visibility: visible;
}

/* 3.4 Page rejoindre
------------------------------------------------------------------------------*/
/*** ariane ***/
.ariane {
    text-align: center;
    padding: .4rem;
    font-size: 0.95rem;
    margin-bottom: 1rem;
}

.ariane a {
    text-transform: uppercase;
    text-decoration: none;
    font-weight: 700;
    color: #a6b6d0;
}

.ariane a:hover, .ariane a.on {
    color: #005f8f;
}

.ariane a.but-ariane {
    display: inline-block;
    margin: 1rem 0.25rem 0 0.25rem;
    padding: 1rem;
    color: #fff;
    background-image: url(../img/bg-but.png);
    background-size: cover;
}

.ariane a.but-ariane--on {
    background-image: url(../img/bg-but-on.png);
}

.ariane a.but-ariane--small {
    padding: 0.25rem 0.75rem;
    font-size: .75rem;
    font-weight: 500;
}

@media (max-width: 767px) {
    .ariane a.but-ariane--small {
        font-size:.5rem;
        margin: 0.2rem;
    }
}

.ariane a.but-ariane:hover {
    opacity: .8;
}

/*** rubriquqe ***/
.rubrique-item {
    color: #005f8f;
    margin-top: 2rem;
}

.rubrique-item h3 {
    font-size: 1rem;
    line-height: 140%;
}

.rubrique-item .icon-arrow {
    top: .8rem;
}

@media (max-width: 767px) {
    .rubrique-item .icon-arrow {
        display:none;
    }

    .rubrique-item-texte {
        padding: 1rem;
    }
}

/**** bg-ivory ***/
.bg-ivory-top {
    background-image: url(../img/bg-ivory-top.png);
    background-size: cover;
    height: 34px;
}

.bg-ivory-bottom {
    background-image: url(../img/bg-ivory-bottom.png);
    background-size: cover;
    height: 34px;
}

/* 3.4 Page dispositif
------------------------------------------------------------------------------*/
.team {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    margin: 0 3rem;
}

.team-item {
    width: 30%;
    margin-bottom: 2.5rem;
    text-align: center;
    color: #005f8f;
}

.team-item a {
    text-decoration: none;
    color: #005f8f;
}

.team-item a:hover {
    color: #42b3ff;
}

.team-illus {
    margin-bottom: 0.5rem
}

.team-email {
    text-decoration: underline;
}

@media (max-width: 767px) {
    .team {
        margin:0 .5rem;
        justify-content: space-around;
    }

    .team-item {
        width: 80%;
    }
}

/* 3.5 Page partenaire
------------------------------------------------------------------------------*/
.partenaires {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
    /*space-around;*/
}

.partenaire-item {
    width: 20%;
    width: calc(20% - 2rem);
    max-width: 166px;
    margin-bottom: 1.8rem;
    margin-left: 1rem;
    margin-right: 1rem;
    text-align: center;
    color: #005f8f;
    /*border:1px solid;*/
    padding-top: 15px;
    padding-bottom: 5px;
    background: #fff;
}

.partenaire-item a {
    color: #005f8f;
    text-decoration: none;
    display: block;
    /* pour l'opacity suivante*/
}

.partenaire-item a:hover {
    opacity: 0.8;
}

.partenaire-illus {
    margin-bottom: 0.5rem
}

@media (max-width: 767px) {
    .partenaires {
        margin:0 .5rem;
        justify-content: space-around;
    }

    .partenaire-item {
        width: 40%;
    }
}

/* 3.5 Page pepins-tuteurs
------------------------------------------------------------------------------*/
/***** recherche *****/
input.search {
    border: 2px solid #005f8b;
    color: #005f8b;
}

input.search::placeholder {
    color: #005f8b;
    font-style: italic;
    opacity: 1;
    /* pour FF */
}

.formulaire_recherche input.submit {
    background: transparent url(../img/bg-search.png) no-repeat center right;
    border: none;
    font-size: 0;
    width: 50px;
    position: relative;
    left: -58px;
}

.recherche-query {
    font-size: 90%;
    padding-left: .5rem;
}

/**** trombi ******/
.trombi {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    /*center;*/
}

.trombi-item {
    width: 30%;
    background-image: linear-gradient(to right, #eb6622 50%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 25px 1px;
    background-repeat: repeat-x;
}

.trombi-recherche .trombi-item {
    background-image: none;
}

.trombi-tuteur .trombi-item {
    width: 100%;
    background-image: linear-gradient(to right, #005f8f 50%, rgba(255,255,255,0) 0%);
}

/* cas particulier pour les archives */
.graphes-archive .trombi-tuteur .trombi-item {
    background: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.graphes-archive .trombi-pepin .trombi-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
    width: 45%;
    color: #eb6622;
    padding: 1rem 0;
}

/* responsive */
@media (max-width: 767px) {
    .trombi {
        padding:1rem;
    }

    .trombi-item {
        width: 100%;
    }
}

.trombi-item a {
    display: flex;
    align-items: center;
    text-decoration: none;
    padding: .8rem 0;
}

.trombi-pepin .trombi-item a {
    color: #eb6622;
}

.trombi-pepin .trombi-item a:hover {
    background-color: #eb6622;
    color: #fff;
}

.trombi-tuteur .trombi-item a {
    color: #005f8f;
}

.trombi-tuteur .trombi-item a:hover {
    background-color: #005f8f;
    color: #fff;
}

.trombi-illus {
    /*min-width:30%;
	width:30%;*/
    min-width: 80px;
    width: 80px;
    padding: 0 .8rem 0 .4rem;
}

.trombi-illus img {
    border-radius: 200%;
}

.trombi-texte {
    text-align: left;
}

/**** graphe *****/
.graphes {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.graphe-item {
    /*border:1px solid red;*/
    margin: 1rem 2rem 1rem 0;
}

.graphe-item-relation {
    text-align: center;
    min-width: 20%;
}

.graphe-item-relation h1 {
    margin: 0;
    font-size: 1.5rem;
}

.graphe-item-1, .graphe-item-3 {
    min-width: 30%;
    text-align: center;
}

.graphe-item-3 {
    text-align: left;
}

/**** graphes-archive *****/
.graphes-archive {
    background-image: linear-gradient(to right, #005f8f 50%, rgba(255,255,255,0) 0%);
    background-position: top;
    background-size: 25px 1px;
    background-repeat: repeat-x;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding-top: 2rem;
}

.graphe-archive-item {
    width: 25%;
    text-align: center;
}

.graphe-archive-item-3 {
    width: 50%;
}

.graphe-item-archive-relation h1 {
    margin: 0;
    font-size: 1.5rem;
}

/* 3.5 Page formulaires temps d'informations
------------------------------------------------------------------------------*/
.info-formation-date {
    margin-bottom: 1rem;
}

.formation {
    margin: .8rem;
    line-height: 160%;
}

.formation-titre {
    color: #999;
}

h3.formation-h3 {
    margin: 2rem 0 .5rem 0;
}

.formulaire_information form input.text, .formulaire_information form input.email, .formulaire_information form select, .formulaire_information form textarea {
    width: inherit;
    /* surcharge bootstrap */
}

.formulaire_donateurs input {
    padding: 15px 5px;
}

/* 3.5 Page mots / equipes en regions
------------------------------------------------------------------------------*/
.patterns-3 {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

.pattern-3 {
    width: 25%;
    margin-bottom: 2rem;
    text-align: center;
}

.pattern-3 a {
    text-decoration: none;
}

.pattern-3 a:hover .pattern-3-illus {
    opacity: 0.85;
}

.pattern-3-titre {
    margin: 1rem 0.75rem;
    padding: .4rem 0.25rem .25rem 0.25rem;
    display: block;
    background: #005f8f;
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
    font-family: 'Cabin Sketch', cursive;
    font-size: 1.2rem;
    line-height: 120%;
}

.pattern-3 a:hover .pattern-3-titre {
    background: #3a709e !important;
}

/* 60. PLUGINS
==============================================================================*/
/* Plugin Oembed
------------------------------------------------------------------------------*/
.oembed {
}

.oembed .spip_doc_titre {
    display: none;
}

.oe-video {
    padding: 0 !important;
    border: none !important;
}

/* Plugin Mediabox
------------------------------------------------------------------------------*/
#cboxClose {
    top: 10px;
    right: 30px;
    height: 25px;
    width: 25px;
    background: url(../img/but-close.png) 0 0 no-repeat;
}

#cboxClose:hover {
    opacity: 0.6;
}

#cboxLoadedContent {
    box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.3);
    padding: 0;
    /* pour eviter le bug apparition / disparition lors du chargement */
    min-height: 100%;
    background: #f4f2e9;
}

/* Plugin GIS
------------------------------------------------------------------------------*/
.leaflet-control a, .leaflet-popup-content a {
    text-decoration: none;
}

/* Plugin Organiseur (calendrier) - upd 2022 SPIP 4
------------------------------------------------------------------------------*/
.fc-button {
    background-color: #005f8f !important;
    border-color: #005f8f !important;
}

.fc-button:hover {
    background-color: #08285e !important;
    border-color: #f4f2e9 !important;
}

.fc-toolbar h2.fc-toolbar-title {
    font-family: 'Cabin Sketch', cursive;
    font-weight: 700;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    color: #005f8f;
    text-transform: uppercase;
    font-size: 2rem;
}

th.fc-col-header-cell {
    background: #005f8f !important;
    text-transform: uppercase;
    padding: 4px 2px !important;
    font-family: 'Cabin Sketch', cursive;
    font-size: 1.2rem;
}

th.fc-col-header-cell a {
    color: #fff !important;
    text-decoration: none;
}

.fc-day {
    background-color: #f4f2e9 !important;
    border: 3px solid #fff !important;
}

.fc-day-other {
    visibility: hidden
}

.fc-day-today {
    background-color: rgb(249 148 6 / .72) !important;
}

.fc-day-past {
    background-color: #f9f8f4 !important;
}

a.fc-day-number, a.calendrier-event {
    text-decoration: none !important;
}

.fc-daygrid-day-number {
    float: left !important;
    color: #005f8f;
    font-weight: 700;
    font-size: 1.6rem;
    padding: 8px !important;
    font-family: 'Cabin Sketch', cursive !important;
    pointer-events: none;
    /* empecher  le click sur les jours */
    text-decoration: none !important;
}

.fc-event-container {
    margin-top: 1.1rem;
    /* pour empecher chevauchement avec le numero jour */
}

.fc-center h2 {
    display: inline-block;
    padding: 0 1rem;
    min-width: 16rem;
}

.fc-center button {
    position: relative;
    background: none;
    border: none;
    font-size: 0;
    padding: 0 !important;
    top: -5px;
}

.fc-center .fc-icon {
    width: 25px;
    height: 25px;
    margin: 0 !important;
}

.calendrier-couleur1, .calendrier-couleur1 .fc-widget-content, .calendrier-couleur2, .calendrier-couleur2 .fc-widget-content, .calendrier-couleur3, .calendrier-couleur3 .fc-widget-content, .calendrier-couleur4, .calendrier-couleur4 .fc-widget-content, .calendrier-couleur5, .calendrier-couleur5 .fc-widget-content, .calendrier-couleur6, .calendrier-couleur6 .fc-widget-content, .calendrier-couleur7, .calendrier-couleur7 .fc-widget-content, .calendrier-couleur8, .calendrier-couleur8 .fc-widget-content, .calendrier-couleur9, .calendrier-couleur9 .fc-widget-content, .calendrier-couleur10, .calendrier-couleur10 .fc-widget-content, .calendrier-couleur11, .calendrier-couleur11 .fc-widget-content, .calendrier-couleur12, .calendrier-couleur12 .fc-widget-content, .calendrier-couleur13, .calendrier-couleur13 .fc-widget-content {
    background-color: #eb6622 !important;
    border-color: #eb6622 !important;
    color: #FFF;
}

/* avoir l'evnement entier */
.fc-daygrid-event {
    flex-wrap: wrap;
}

/* retour à la ligne */
.fc-daygrid-dot-event .fc-event-title {
    white-space: normal;
    padding: 2px 5px 5px 5px;
    line-height: 1.1;
    font-weight: 400 !important;
}

/* 70. PRINT
==============================================================================*/
.print-only {
    display: none;
}

@media print {
    .print-no {
        display: none !important;
    }

    .print-only {
        display: block;
    }

    /* le compresseur spip ne distingue les medias screen, all....
        on reset donc a la main bootstrap pour le print
     
     */
    .span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11, .span12 {
        width: auto !important;
        padding: 5px !important;
        margin: 0 !important;
    }

    a[href]:after {
        content: ""
    }

    /* autres calages pour le print */
    #spip-admin, .social, .row-nav, .sidebar, .footer, .pagination {
        display: none;
    }

    /* header */
    .nav-logo img {
        width: 50%;
        height: auto;
    }

    .nav-tel {
        color: #005499 !important;
        font-size: 1em;
        float: none;
        margin: 0;
        padding: 0;
    }

    /* contenu */
    body {
        font-size: 82%;
        /*12px;*/
    }

    .chapeau {
        border-left: 5px solid #3c93cd;
        padding-left: 30px;
    }

    .article-preview a {
        text-decoration: none !important;
    }

    /*img {width:70%;}  */
    .article-preview img {
        width: 200px;
    }

    .article-preview-illus {
        float: left;
    }
}

/* 80. RESPONSIVE
==============================================================================*/
.responsive-only {
    display: none !important;
}

/* totalement masque: seuil orange  */
.responsive-only-2 {
    display: none !important;
}

/* totalement masque: seuil bleu */
/* casual desktop */
@media (max-width: 1200px) {
    body {
        background:#fff;
    }
}

/* Portrait tablet to landscape and desktop */
@media (max-width: 979px) {
}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
}

/* Landscape phones and down */
@media (max-width: 480px) {
}

/******************
  Menu Burger (2017)
******************/
/* inspi: bk club - merci seb :p */
@media (max-width: 767px) {
    /******* banner *******/ #banner {
        position:relative !important;
        width: 100%;
        background: #fff;
        border-bottom: none;
    }

    /******* navbar *******/
    #navbar {
        position: fixed;
        /**/
        /* position:absolute; */
        top: 120px;
        right: 20px;
        z-index: 100;
        margin: 0;
        padding: 0;
        width: 100%;
        height: 0;
    }

    .nav-menu {
        flex-direction: column;
    }

    .nav-menu span {
        display: block;
    }

    .nav-menu img {
        display: none;
    }

    .nav-menu span {
        display: block;
    }

    .nav-menu li {
        margin: 0;
        align-self: flex-start;
    }

    .nav-menu li.menu-search {
        text-align: left;
        margin-top: 1em;
    }

    #navbar ul {
        margin: 0;
        position: absolute;
        width: 100%;
        height: 100vh;
        left: -100%;
        transition: all .25s ease-in;
        /* overflow:hidden; */
        background-color: rgba(255, 255, 255, 0.95);
        padding-left: 15px;
    }

    #navbar.active ul {
        left: 0;
    }

    #navbar li {
        display: block!important;
    }

    #navbar a {
        float: none;
        display: block;
        background: transparent;
        border-radius: 0;
    }

    #navbar a:hover {
        background: transparent;
    }

    #navbar h3, #navbar a {
        display: block;
        max-width: 15rem;
        padding: 0.5em 0.5em;
        margin: 0 0.5rem;
        color: #333 !important;
        transition: all .1s ease-in;
        font-size: 0.9rem;
        font-weight: normal;
        min-width: 10em;
        border: none;
        border-bottom: 1px solid #000;
        text-align: left;
    }

    #navbar a:hover {
        color: #999 !important;
        padding-left: 1.0rem;
    }

    #navbar a.on {
        color: #fff !important;
        background: #3A709E;
    }

    /******* burger *******/
    .burger {
        /*position:fixed;*/
        display: block;
        position: absolute;
        top: -105px;
        right: -10px;
        width: 30px;
        background: #000;
        cursor: pointer;
        z-index: 99;
        /* on ajoute des bordures pour que le burger soit bien cliquable*/
        border: 10px solid #fff;
        border-top: 20px solid #fff;
        border-bottom: 20px solid #fff;
        border-radius: 4px;
        box-shadow: 3px 3px 1px rgba(85, 83, 79, 0.75);
    }

    .burger::before, .burger::after {
        content: "";
        display: block;
    }

    .burger, .burger::before, .burger::after {
        position: absolute;
        width: 30px;
        height: 3px;
        background: #000;
        transition: all 0.3s ease-in;
    }

    .burger::before {
        margin-top: -7px;
    }

    .burger::after {
        margin-top: 7px;
    }

    /* etat hover */
    .burger:hover, .burger:hover::before, .burger:hover::after {
        background-color: #000;
    }

    /* etat active */
    .active .burger {
        background-color: #fff !important;
    }

    .active .burger::before {
        margin-top: 0;
        transform: rotate(-45deg);
    }

    .active .burger::after {
        margin-top: 0;
        transform: rotate(45deg);
    }

    /* etat active + hover */
    /*
	.active .burger:hover::before,
	.active .burger:hover::after {
	  background-color:#000;
	}
	*/
}


/* archive statique */
.warning-archive {
    background-color: #bc4646;
    color: #fff;
    padding:1rem;
    font-size:1rem;
    text-align:center;
    font-weight:600;
	border:none !important;
	margin:0;
	width:100%;
}