/* CMF - 2022 CSS Document */

/* =============================================================================
   $Reset
   ========================================================================== */
@charset "UTF-8";

article, aside, details, figcaption, figure,
footer, header, hgroup, main, nav, section, summary{display: block;}
script{display: none !important;}

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {margin: 0; padding: 0; border: 0; vertical-align: baseline;}

audio, canvas, video {display: inline-block;
    *display: inline;
    *zoom: 1;
}

/* =============================================================================
   $Colors
   ========================================================================== */
:root {
    --defaultColor : rgba(0,32,96,1); /* - bleu navy */
    --navy : rgba(0,32,96,1);
    --blue : rgba(108,198,216,1);
    --yellow : rgba(245,186,73,1);
    --green : rgba(115,191,141,1);
    --orange : rgba(215,91,57,1);
    --grey: rgba(248, 248, 248, 1);
}

/* =============================================================================
   $Fonts
   ========================================================================== */

@font-face {
    font-family: 'icoCMF';
    src:  url('/files/fr/css/fonts/icoCMF.eot');
    src:  url('/files/fr/css/fonts/icoCMF.eot#iefix') format('embedded-opentype'),
    url('/files/fr/css/fonts/icoCMF.ttf') format('truetype'),
    url('/files/fr/css/fonts/icoCMF.woff') format('woff'),
    url('/files/fr/css/fonts/icoCMF.svg#IcoCNM') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

/* =============================================================================
   $Base / Elements
   ========================================================================== */

*, *::before, *::after { 
    margin: 0; 
    padding: 0; 
    box-sizing : border-box; 
}

html {font-size: 62.5%;}

body {
    position: relative; 
    min-width: 320px;
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 1.4rem; 
    line-height: 1.6; 
    color: #333; 
    background-color: #FFF;
    padding: 175px 0 0 0;
}

a {
    text-decoration: none; 
    color: #212121;
}

a:hover {
    color: rgba(0,0,0,0.60); 
}

a:hover h2 {
    text-decoration: underline;
}

ul, ol, dl, dt, dd {
    list-style: none; 
    margin: 0; 
    padding: 0; 
    list-style-position: outside; 
}

ol{counter-reset: li;}
ol li{position: relative; margin: 0 0 5px 0;}
ol > li:before {
    left: 5px;
    left: 0.3125rem;
    top: 0;
    font-size: 15px;
    line-height: 21px;
    font-weight: bold;
    color: rgba(0,32,96,1);
    content: counter(li) ". ";
    counter-increment: li;
}
p {
    line-height: 1.4;
}

h1 {
    font-size: 3.8rem; 
    font-weight: bold; 
    line-height: 4.2rem;
}

h2 {
    font-size: 1.8rem; 
    line-height: 1.3;
    font-weight: bold;
}

small {
    font-size: 80%;
}

table {
    border-collapse: collapse;
    vertical-align: top;
    width: 100%;
    margin: 0 0 20px 0;
}

sup{line-height: 1;}

.underline {text-decoration: underline;}
.clear { clear: both;}
.hidden { display: none;}
.italic{font-style: italic;}
.txtRight{text-align: right;}

/* =============================================================================
   $Icons / $Picto
   ========================================================================== */

[class*="icon_"].before::before, 
[class*="icon_"].after::after { 
    display: inline-block;
    font-family: 'icoCMF';
    font-size: 2.36rem;
    vertical-align: sub;
    transition: margin 0.15s ease-in-out;
    cursor: pointer;
    padding: 0;
}
[class*="icon_"].after::after { 
    margin-left: 5px; 
}

.icon_arrow-back.before::before {content: "\e909";}
.icon_time.before::before {content: "\e911"; font-size: 1.5rem !important; color: #8b9cbc; vertical-align: middle;}
.icon_arrow_left.before::before {content: "\e902";}
.icon_arrow_right.before::before,  .icon_arrow_right.after::after{content: "\e903";}
.icon_menu.before::before {content: "\e91a"; font-size: 3rem !important; width:40px;}
.icon_menu.burgerNav_open_state.before::before {content: "\e909"; font-size: 3rem !important; padding: 5px 0 0 10px;}
.icon_check.before::before{content:'\e905';}
.icon_switch.before::before{content:'\e90f';}
.icon_newspaper.before::before{content:'\e935';}
.icon_key.before::before{content:'\e92b';}
.icon_cogs.before::before{content:'\e929';}
.icon_bookmarkEmpty.before::before{content:'\e923'; vertical-align: baseline !important;}
.icon_info.before::before{content: "\e917"; padding: 0 5px 0 0;}
.icon_note.before::before{content: "\e918"; padding: 0 5px 0 0; color: #f7cd43}
.icon_userConnect.before::before{content: '\e920'}
.icon_userPassword.before::before{content: '\e92b'}
.icon_email.before::before{content: '\e92c'}
.icon_copyLink.before::before{content: '\e9cb'; font-size: 2rem !important;}
.icon_copyLink.before:hover::before{color: #212121;}
.icon_quote.before::before{content: '\e92e';}
.icon_pdf.before::before{content: '\e930'; padding: 0 5px 0 0;}
.icon_link::before{content:url(../images/add_circle.png); }

.icon_home.before::before{content:'\e937'; color: #999; vertical-align: baseline !important; padding: 0 10px 0 0 !important;}
.icon_exclamation.before::before{
    content:url(../images/ico_essentiel.svg);
    width: 10px;
    margin: 0 10px 0 0;
    vertical-align: bottom;
    display: inline-block;
    cursor: default;
}

.icon_bookmark::before{  content: '\e925';  font-size: 2rem;}
.icon_bookmark.active::before { content: '\e923';  color: rgba(0,32,96,1)}
.icon_bookmark:hover::before { content: '\e925'; color: rgba(0,32,96,1)}

.icon_like::before{content:"\e912"; color: var(--navy); color: #002060; }
.icon_like:hover::before{color: #125DB5;}
.icon_like[data-like-state="true"]::before{content: "\e922"; color: rgba(0,32,96,1);}
.icon_like[data-like-state="true"]:hover::before{content:"\e912";}

.icon_like_empty_small::before{font-family:icoCMF; content:"\e922"; color: rgba(0,32,96,1); font-size: 2rem; vertical-align: sub; }

.icon_search::before {content: "\e92a"; margin: 0; color: rgba(0,32,96,1); vertical-align:middle; font-size: 2.2rem !important}
.icon_search:hover::before{color: rgba(245,186,73,1);}
.icon_search.searchInput_active_state::before {content: "\e92a"; color: rgba(245,186,73,1);} 

.icon_user::before {content: "\e926"; font-size: 2.4rem !important; color: rgba(0,32,96,1);}
.icon_user.navAccount_active_state::before, .icon_user:hover::before{color: #125DB5}

/* catalogue de picto de la MOA */
[class*="picto_"]::before{ 
    display: inline-block;
    cursor: pointer;
    padding: 0;
    content:'';
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
}

.picto_casque::before{
    background-image: url(../images/pictos/casque_bleu_40px.png);
    width: 40px;
    height: 40px;
    vertical-align: middle;
    margin: 0 10px 0 0;
}

/* =============================================================================
   $Alerts Message / notification
   ========================================================================== */

.msg_container {
    max-width: 400px;
    margin: 10px auto 0;
}

.msgBox,
.messageBox {
    padding: 6px 15px;
    margin-bottom: 10px;
    font-weight: 500;
    font-size: 1.2rem;
    border-radius: 5px;
}

.msgBox.info, .messageBox.info{background: #EFF6FF; color: #125DB5;}
.msgBox.note, .messageBox.note{border: 1px dashed #CCC;}

.msgBox.error,
.messageBox.error,
.msgBox.validation,
.messageBox.validation {
    background: #FEF3C7;
    color: #B91C1C;
}

.msgBox.success,
.messageBox.success {
    background: #ECFDF5;
    color: #047857;
}

.tooltip{display: none; position: absolute; border: 1px solid #004494; box-shadow: 0 0 4px 0 #999; background-color: rgba(0,32,96,0.8); border-radius: 4px; padding: 5px 10px; color: #FFF; font-size: 1.2rem; z-index: 999; max-width: 300px; min-width: 160px;}


/* =============================================================================
   $Forms : gestion des formulaires
   ========================================================================== */

/* version */
.fieldIcon{
    position: relative; 
    margin: 0 0 10px 0;
    overflow: hidden;
}
.labelIcon{
    float: left;
    background-color: rgba(0,32,96,1);
    border-radius: 4px 0 0 4px;
    padding: 0 5px;
    line-height: 40px;
    width: 50px;
    height: 40px;
    text-align: center;
    color: #FFF;
}
.labelIcon span{display: none;}

.inputIcon{
    border-radius: 0 4px 4px 0 !important;
    background-color: #EFF6FF;
    border: none !important;
    height: 40px;
    line-height: 40px;
    width: calc(100% - 50px);
}

.inputIcon:focus, .inputIcon:focus-visible{border: none; outline: none;}


span.oblig {
    color: #e2001a;
}

input[type='checkbox']{
    cursor: pointer;
}

.blocButtons{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center; 
    margin: 10px 0;
}

input[type=text],
input[type=password]{
    position: relative;
    display: inline-block;
    padding: 0 15px;
    line-height: 40px;
    height: 40px;
    border-radius: 4px;
    border-width: 0 0 0 5px;
    border-style: solid;
    border-color: rgba(0,32,96,1);
    color: #888;
    letter-spacing: 1px;
}

.AuthenticationComponent input[type=text],
.AuthenticationComponent input[type=password] {
    height: 40px;
}

input[type=submit], 
input[type=button], 
button:not([class^="icon_"]),
.btn { 
    position: relative;
    display: inline-block;
    padding: 0 30px;
    line-height: 32px;
    background-color: rgba(0,32,96,1);
    font-weight: bold;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    border: none;
    cursor: pointer;
    transition: .2s ease-in-out;
    border-radius: 4px;
}

input[type=submit]:hover, 
input[type=button]:hover, 
button:not([class^="icon_"]):hover,
.btn:hover { 
    border: none;
    background-color: rgba(0,32,96,0.8);
}

button[class^="icon_"] {
    border: none;
    background: none;
}

.btn.greenColor{
    background-color: rgba(115,191,141,1) !important;
}
.btn.greenColor:hover{
    background-color: rgba(115,191,141,0.8) !important;
}

form a{text-decoration: underline;}
form .center{text-align: center;}
form .error{color: #B91C1C; font-size: 1.2rem;}

/* =============================================================================
   $Layout
   ========================================================================== */

#wrapper{
    position: relative;  
    z-index: 2; 
    text-align: left; 
    padding: 35px 0;
}

.constrain {
    max-width: 1024px; 
    margin: 0 auto; 
    position: relative; 
}

.constrainMedium{
    max-width: 600px; 
    margin: 0 auto; 
    position: relative;
}

section{
    position: relative;
    overflow: hidden;
    padding: 5px 0 0 0;
    background-color: #FFF;
}

.column{float: left;}
.columnMain{
    width: 700px;
}
.columnAside{
    width: calc(100% - 720px);
    margin:  0 0 0 20px;
}

.layout_lighter{margin: 0 0 20px 0;}
.layout_lighter h1{margin: 0 0 20px 0;}

.grid{
    display: -ms-grid;
    display: grid;
    -ms-grid-row-gap: 20px;
    grid-row-gap: 20px;
}

.grid2 {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-column-gap: 24px;
    grid-column-gap: 24px;
}

.grid3 {
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    -ms-grid-column-gap: 18px;
    grid-column-gap: 18px;
}

.grid img{width: 100%}

@media screen and (max-width: 1024px) {
    .constrain{padding: 0 10px;}
}

@media screen and (max-width: 980px){
    #wrapper{padding-top: 5px;}
    .constrain,
    .constrainMedium{
        padding:0 10px;
    }
    .column{float: none;}
    .columnMain{max-width:960px;width:auto;}
    .columnAside{
        width:100%;
        display:grid;
        margin: 0;
        grid-row-gap: 20px;
        grid-template-columns: 1fr 1fr;
        grid-column-gap: 24px;
    }
}
@media screen and (max-width: 812px) {
    .constrain {
        width: 100%;
    }
    .grid{display: block;}
    .column{float: none;}
    .columnMain, .columnAside{width: 100%; margin: 0;}
}

@media screen and (max-width: 600px) {
    .columnAside{display:block;}
}

/* =============================================================================
   $Header : Layout
   ========================================================================== */

header, 
#header {
    position: fixed;
    z-index: 10;
    background-color: #fff;
    box-shadow: 0 1px 6px rgba(0,0,0,.16);
    left: 0;
    right: 0;
    top: 0;
}

.headerTop{
    background-color: var(--grey); 
    background-color: #F8f8f8;
    color: rgba(0,32,96,1); 
    text-align: center; 
    line-height: 30px; 
    border-bottom: 1px solid #EEE; 
    text-transform: uppercase;    
}
.headerTop p{line-height: 2;}

.headerMiddle{
    position: relative;
    overflow: hidden;
    margin: 0 0 10px 0;
}
.headerBottom{
    position: relative;
}

.barNavBurger .slideNav{
    display:none;
    position:fixed;
    top:103px;
    background:var(--grey);
    background: #f8f8f8;
    bottom:0;
    width:80%;
    left:-812px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.12);
    transition: transform .3s ease,-webkit-transform .3s ease;
}

.headerMiddle #open_nav{
    display: none;
    margin: 5px 0 0 0;
    width: 40px;
}

.headerMiddle #open_nav span{
    font-size: 1.2rem;
    display: block;
}
.headerMiddle #open_nav.burgerNav_open_state span{
    display: none;
}

.headerMiddle .logo{
    display: inline-block;
    margin: 40px 0 5px 0;
}

.barNavBurger .slideNav #search_burger{
    display: block;
    position: absolute;
    background: #eee;
    left: 0;
    right: 0;
    bottom: 0;
}

.barNavBurger .slideNav #search_burger .search-txt{
    width:100%;
    background: none;
    border:none;
    color: #212121;
    font-size: 1.5rem;
    padding: 0 35px 0 75px;
    outline: none;
    transition: .15s ease-in-out;
}

.barNavBurger .slideNav #search_burger .search-txt::placeholder {
    text-transform:uppercase;
}

.search-btn-burger{
    position: absolute;
    left: 25px;
    top: 50%;
    margin-top:-18px;
    font-size: 1.5rem;
    color: #fff;
    pointer-events: none;
    text-decoration: none;

}

.barNavBurger .slideNav #search_burger .icon_search.before::before{
    vertical-align:middle;
}

@media screen and (max-width: 980px) {
    body{padding: 110px 0 0 0;}
    .headerTop p{font-size: 1.1rem;}
    .headerMiddle{height: 70px;}
    .headerMiddle #open_nav{
        display: inline-block;
        vertical-align: middle;
        height:80px;
        margin:auto 0;
    }
    .headerMiddle .logo{
        position: absolute;
        top: 0;
        left: 50px;
        right: 0;
        text-align: center;
        margin: 0;
        padding: 5px 10px;
        display: block;
    }
    .headerMiddle .logo img {width:auto;max-width:100%;}
    .headerRight{display:none;}
    .barNavBurger .slideNav{
        display:block;
    }

    .barNavBurger .slideNav.burgerNav_open_state, .tablet .barNavBurger .slideNav.burgerNav_open_state{
        -webkit-transform: translateX(812px);
        -ms-transform: translateX(812px);
        transform: translateX(812px);
    }
}

@media screen and (max-width: 812px) {
    .headerMiddle {
        height: 52px;
    }
    .headerMiddle #open_nav{
        height: 62px;
    }

    .barNavBurger .slideNav {
        top:85px;
    }
}

/* =============================================================================
   $Account
   ========================================================================== */
.GPRF_Account{
    position: absolute;
    text-align: left;
    right: 10px;
    bottom: 0;
}

.GPRF_Account #open_account{
    width:24px;
    line-height: 32px;
    display:block;
}

.GPRF_Account .navAccount {
    display: none;
    position: absolute;
    top: 33px;
    right: -10px;
    width: 240px;
    background-color: #FFF;
    z-index: 10;
    box-shadow: 0 3px 6px rgba(0,0,0,0.20);
    border-top: 3px solid #004494;
}

.GPRF_Account .navAccount a{
    display: block;
    padding:0 10px;
}
.GPRF_Account .navAccount a:hover{
    background-color:#004494;
    color:#fff;
}
.GPRF_Account .navAccount .before::before{
    padding: 0 10px 0 0;
}

.GPRF_Account .navAccount.navAccount_active_state{
    display: block;
}

.GPRF_Account .navAccount .icon_bookmarkEmpty.before::before{vertical-align:sub!important;}

.GPRF_ClientAreaDashboard{
    border-radius: 5px;
}
.clientCard{
    background-color: var(--grey);
    background-color: #f8f8f8;
    padding: 20px 40px;
    border: 2px solid var(--navy);
}

.clientCard li strong{display: inline-block; width: 170px; margin: 0 10px 0 0;}
.clientCard li span{display: inline-block;}

.ClientAreaDashboard h1,
.ClientAreaChangePasswordComponent h1,
.ChangePasswordByLinkComponent h1{
    margin: 0 0 10px;
    text-transform:uppercase;
    color:var(--navy);
    color: #002060;
    font-size:2.4rem;
}
.ClientAreaDashboard section.S_bottom{padding-top:0;}
.ClientAreaDashboard .block{
    margin: 30px 0 0;
    border-radius: 5px;
    background-color: var(--grey);
    padding: 20px;    
}
.ClientAreaDashboard .block .title{
    font-size: 1.8rem;
    text-transform: uppercase;
    display: block;
    margin: 0 0 20px 0;
    color: var(--navy);
    color: #002060;
}

/* Modules Last Connexion et Devices */
.ClientAreaDashboard .block ul{
    margin-top: 15px;
}

.ClientAreaDashboard .block li{
    font-size: 1.2rem; 
    margin: 3px 0; 
    overflow: hidden;
}

.GXCO_lastConnexion li.connectionFailed {
    color: #e2001a;
}

.ClientAreaDashboard .block li span {
    float: left;
}

.ClientAreaDashboard .block li span.device {
    min-width: 300px; 
    max-width: 300px; 
    margin-right: 40px; 
    display: block; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
    overflow: hidden;
}

.ClientAreaDashboard .block li span.date,
.ClientAreaDashboard .block li span.hour {
    margin-right: 20px;
}

.ClientAreaDashboard .ico-pc::before{content: "\e93b";}
.ClientAreaDashboard .ico-mac::before{content: "\e93c";}
.ClientAreaDashboard .ico-mobile::before{content: "\e93d";}
.ClientAreaDashboard .ico-tablet::before{content: "\e93f";}
.ClientAreaDashboard .ico-pc::before,
.ClientAreaDashboard .ico-mac::before,
.ClientAreaDashboard .ico-mobile::before,
.ClientAreaDashboard .ico-tablet::before {
    font-family: 'icoCMF';
    float: left;
    margin: 0 10px 0 0;
    font-size: 1.8rem;
    line-height: 1.8rem;
}

/* =============================================================================
   $Account : gestion du mot de passe
   ========================================================================== */
.ForgotPasswordComponent h1,
.AuthenticationComponent h1,
.LogoutComponent h1{
    max-width: 600px;
    margin: 0 auto 10px;
    font-size:2.4rem;
    text-transform: uppercase;
    color:var(--navy);
    color: #002060;
}

.GXCO_changePassword, GXCO_ResetPassword{
    max-width: 600px;
    margin:0;
}

.GXCO_changePassword .formRow, .GXCO_changePassword .blocButton,
.GXCO_ResetPassword .formRow, .GXCO_ResetPassword .blocButton{
    margin: 10px 0;
}

.LogoutComponent .blocButtons{
    margin: 30px 0;
}

.GXCO_changePassword .formRow .labelForm,
.GXCO_ResetPassword .formRow .labelForm{
    display: block;
    font-weight: bold;
    margin: 0 0 5px;
}

.GXCO_changePassword .oblig,
.GXCO_ResetPassword .oblig{
    margin-left: 3px;
}

.GXCO_ResetPassword .formRow .helpMessage,
.GXCO_changePassword .formRow .helpMessage{
    font-weight: normal;
    font-size: 1.1rem;
    color: rgba(0,0,0,0.60);
    margin: 5px 0;
}

.GXCO_changePassword input[type="text"], #updatePassword input[type="password"],
.GXCO_ResetPassword input[type="text"]{
    width: 100%;
    background-color: #EFF6FF;
}

.GXCO_ResetPassword .bloctxt,
.GXCO_changePassword .bloctxt{
    text-align: right;
    font-size: 1.1rem;
    color: rgba(0,0,0,0.60);
}

/* =============================================================================
   $Search : module / component
   ========================================================================== */
/* search */
.box_search {
    position: absolute;
    right: 40px;
    bottom: 0;
}

.box_search #open_search{
    width:24px;
    line-height:32px;
    display:block;
}

.box_search form{
    display: none;
    position: absolute;
    top: 34px;
    right: -10px;
    width: 280px;
    background-color: #FFF;
    padding: 5px 10px;
    z-index: 10;
    border-top: 3px solid rgba(245,186,73,1);
    box-shadow: 0 3px 6px rgba(0,0,0,0.20);
}

.box_search form.searchInput_active_state{
    display: block;
}

.box_search form input{
    border: none;
    height: 36px;
    width: 100%;
    letter-spacing: 0.5px;
}
.box_search form placeholder{
    letter-spacing: 0.5px;

}

.box_search form input:focus, .box_search form input:focus-visible{outline: 0; box-shadow: none;}

/* page de recherche */
.searchHeader{border-bottom: 4px solid #eee; padding: 0 0 20px 0; margin: 0 0 20px 0;}
.searchHeader p{margin: 10px 0;}
.SearchComponent h1{margin: 10px 0 10px; font-size:2.4rem; text-transform:uppercase; color:var(--navy); color: #002060;}
.SearchComponent #SearchForm {margin: 0 0 10px 0;}

.SearchComponent #SearchForm label{font-weight: bold; font-size: 2rem; margin: 0 0 10px 0; display: block;  ; }
.SearchComponent #SearchForm .field{display: flex;}
.SearchComponent #SearchForm .field input[type=text]{flex-grow: 4; margin: 0 10px 0 0; background-color: #EFF6FF;}

.SearchComponent #filter .typeFilter{padding: 10px 20px; background-color: var(--grey); background-color: #f8f8f8;}
.SearchComponent #filter .title{color: var(--navy); color: #002060; margin: 0 0 10px 0; font-weight: bold;}
.SearchComponent #filter .nameFacette{display: block; margin: 0 0 5px 0; text-transform: lowercase;}
.SearchComponent #filter ul{margin: 0 0 10px 0;}
.SearchComponent #filter li{
    border: 1px solid #CCC; padding: 0 15px; line-height: 32px; color: #888; background-color: #FFF;
    display: inline-block; border-radius: 4px; margin: 0 0 5px 0;cursor: pointer; text-transform: uppercase;
}
.SearchComponent #filter li:hover{
    background-color: rgba(245,186,73,1); 
    border: 1px solid #d19a31;
}

.SearchComponent #filter li:hover a{color: #FFF}


/* =============================================================================
   $Navigation
   ========================================================================== */

.nav_model01{
    clear: both;
    overflow: hidden;
    margin: 5px 0 0 0;
}
.nav_model01 li{
    display: inline-block;
}
.nav_model01 li a{
    display: inline-block;
    text-align: center;
    color: #FFF;
    text-transform: uppercase;
    line-height: 28px;
    padding: 0 30px;
    background-color: rgba(0,32,96,1);
    position: relative;
}
.nav_model01 li a:hover, .nav_model01 li.selected a{
    color: rgba(0,32,96,1);
    background-color: rgba(255,255,255,1);
}

.nav_model01 li a:hover::after, .nav_model01 li.selected a::after{
    content:'';
    height: 4px;
    width: 100%;
    position: absolute;
    left: 0; right: 0; bottom: 0;
    background-color: rgba(0,32,96,1);
}

.nav_model02{font-size:1.4rem;}
.nav_model02 .itemLevel1 a{
    line-height: 45px;
    display: block;
    padding:0 20px;
}
.nav_model02 .nav_niv2 {margin: 0 0 0 30px;}
.nav_model02 .itemLevel1:hover > a,
.nav_model02 .itemLevel1.selected > a {
    background:var(--navy);
    background: rgba(0,32,96,1);
    color:#ffffff;
}

.nav_model02 .user-account-link > a::before{content:"\e926";}
.nav_model02 .icon_cogs > a::before{content:"\e929";}
.nav_model02 .icon_key > a::before{content:"\e92b";}
.nav_model02 .icon_newspaper > a::before{content:"\e935";}
.nav_model02 .icon_bookmarkEmpty > a::before{content:"\e923";}
.nav_model02 .icon_switch > a::before{content:"\e90f";}

.nav_model02 .user-account-link > a::before,
.nav_model02 .itemLevel1[class*="icon_"] > a::before{
    font-family:'icoCMF';
    font-size: 2.6rem !important;
    vertical-align:top;
    color: #212121;
    margin-right:10px;
}

.nav_model02 .user-account-link > a,
.nav_model02 .user-account-link > a:hover{
    background: var(--green);
    background: #73bf8d;
    color:#ffffff;
}

.nav_model02 .itemLevel1[class*="icon_"] > a:hover::before,
.nav_model02 .selected[class*="icon_"] > a::before{
    color:#fff;
}

@media (max-width: 980px){
    #mainNav{
        display:none;
    }
}

/* =============================================================================
   $Footer : Layout
   ========================================================================== */

#footer .footerTop{background-color: rgba(0,32,96,1); color: #FFF; padding: 10px 0; text-align: center;}
#footer .footerTop a{color: #FFF;}

#footer .footerBottom{ 
    background-color: var(--grey); 
    background-color: #f8f8f8;
    border-top: 2px solid #FFF;
    font-size: 1.3rem; 
    font-weight: 500;
    padding: 20px;
    text-align: center;
}

#footer a {
    display: inline-block; 
    padding: 0 10px;
}

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

/* =============================================================================
   Module : gestion des modules avec la class .mod
   ========================================================================== */
.mod{
    margin: 0 0 40px 0;
    position: relative;
}


.mod .title{
    text-transform: uppercase;
    padding: 0;
    letter-spacing: 0.5px;
    font-weight: 500;
}

.mod.hasColor .title{
    color: #FFF;
    line-height: 30px;
}

.mod.border .title{
    margin: 0 0 20px 0;
    box-shadow: -3px -3px 6px -3px rgba(0,0,0,0.45);
}
.mod.border .title span{
    display: inline-block;
    background: rgba(0,32,96,1);
    color: #FFF;
    padding: 0 20px;
    position: relative;
    line-height: 30px;
    height: 30px;
}

.mod.border .title.greyColor {
    border-color: #CCC;
}
.mod.ribbon .title{
    padding: 0 10px 0 50px;
}

.mod.ribbon .title::before {
    content:'';
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border-top: 30px solid #FFF;
    border-right: 28px solid transparent;
}

.mod.ribbon .title::after{
    content:'';
    position: absolute;
    top: 30px;
    left: 0;
    width: 0;
    height: 0;
    border-top: 18px solid transparent;
    border-left: 34px solid transparent;
}

.mod.navyColor .title{
    background-color: rgba(0,32,96,1);
    background-color: var(--navy);
}
.mod.blueColor .title{
    background-color: rgba(108,198,216,1);
    background-color: var(--blue);
}
.mod.yellowColor .title{
    background-color: rgba(245,186,73,1);
    background-color: var(--yellow);
}
.mod.greenColor .title{
    background-color: rgba(115,191,141,1);
    background-color: var(--green);
}
.mod.orangeColor .title{
    background-color: rgba(215, 91, 57,1);
    background-color: var(--orange);
}

.mod.navyColor .title::after{
      border-top-color: rgba(0, 0, 0,1);
}
.mod.blueColor .title::after{
      border-top-color: rgba(95, 170, 185,1);
}
.mod.yellowColor .title::after{
      border-top-color: rgba(215, 162, 62,1);
}
.mod.orangeColor .title::after{
      border-top-color: rgba(179, 83, 56,1);
}
.mod.greenColor .title::after{
      border-top-color: rgba(117, 153, 129,1);
}

.mod.ribbon .modContent{
    margin: 0 0 0 34px;
    border-width: 1px;
    border-style: solid;
    border-color: #EEE;
    padding: 16px;
}

.mod a{cursor: pointer}

@media screen and (max-width: 812px) {
    .mod.ribbon .title::before, .mod.ribbon .title::after {
        content: initial;
    }
    .mod.ribbon .modContent{margin: 0;}
    .mod.ribbon .title{padding: 0 10px 0 20px;}
}

/* =============================================================================
   $GFWK : module / component
   ========================================================================== */

/* fil d'ariane */
.GFWK_breadcrumb{margin: 0 0 10px 0;}
.GFWK_breadcrumb li{display: inline; font-size: 1.2rem; color: #666; padding: 0; color: #999; text-transform: uppercase;}
.GFWK_breadcrumb li::before, .GFWK_breadcrumb li a::before{vertical-align:middle!important; cursor: initial!important; font-size: 1.5em; color:#212121;line-height:1rem; height:12px;}

/* pagination */
.GFWK_pager{text-align: center; margin: 30px 0; clear: both;}
.pagination{text-align: right; margin: 10px 0;}
.GFWK_pager a, .pagination a{display: inline-block; padding: 0 5px; cursor: pointer;}
.GFWK_pager a.disabled, .pagination a.disabled{opacity:.3; pointer-events: none; cursor:not-allowed;}
.GFWK_pager a.selected, .pagination a.current{background: #002060; color: #fff;}

/* =============================================================================
   $GSOC : module / component
   ========================================================================== */
.info_views{display: none;}
.GSOC_topMost a, .GSOC_Most_Liked a{display: block;}

.GSOC_topMost a:hover .objectlinker-text,
.GSOC_Most_Liked a:hover .mostLikedText{
    text-decoration: underline;
}
.GSOC_topMost .num,
.GSOC_Most_Liked .num{
    display: inline-block;
    width: 40px;
    font-size: 2.8rem;
    text-align: center;
    height: 50px;
    line-height: 35px;
}

.GSOC_topMost .num{color: #73bf8d; color: var(--green); }
.GSOC_Most_Liked .num{color: #73bf8d; color: var(--green); }

.GSOC_topMost .objectlinker-text,
.GSOC_Most_Liked .mostLikedText {
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 45px);
    height: 100%;
    font-size: 1.4rem;
    white-space: normal;
    padding: 10px 0 10px 5px;
    color: #212121;
}
.GSOC_topMost .nbLinker,
.GSOC_Most_Liked .nbLinker{
    font-size: 1.1rem; color: #888; padding: 0 0 0 3px; display: inline-block;
}

/* =============================================================================
   $GRDC : modules
   ========================================================================== */

/* gestion de la date de publication */
article .infoPublish{
    margin: 0;
    color: #999;
    font-size: 1.1rem;
    text-transform: uppercase;
    position: absolute;
    bottom: 5px;
}
article .infoPublish .info_published,
article .infoPublish .info_time {
    display: inline-block;
    vertical-align: middle;
}
article .infoPublish .info_time .readingTime {
    vertical-align: middle;
}

/* gestion des actions en liste de contenus */
article .infoContent{
    position: absolute;
    bottom: 5px;
    right: 0;
    text-align: right;
    color: rgba(0,32,96,1);
    line-height: 1.1;
}
    article .infoContent span {cursor: pointer;}

    article .infoContent .like-counter{display: none;}

/* model1 : slider home */
.GRDC_List_Model1{position: relative;}
.GRDC_List_Model1 article{ position: relative; padding: 0 !important;}
.GRDC_List_Model1 figure{ float:left; width: 60%; position: relative;}
.GRDC_List_Model1 figure img{ width: 100%;}
.GRDC_List_Model1 figure.noImage{min-height: 215px !important;}
.GRDC_List_Model1 .content {
    position:absolute;
    right:0;
    top:0;
    bottom:0;
    width:40%;
    background-color: #fff;
}
.GRDC_List_Model1 .content .corps {
    padding:0 10px;
}
.GRDC_List_Model1 .mainKeyword{
    background-color: rgba(0,32,96,1);
    color: #FFF;
    display: inline-block;
    padding: 0 20px;
    margin: 0 0 10px 0;
    position: relative;
    font-size: 1.4rem;
    text-transform: uppercase;
    line-height: 30px;
    height: 30px;
}
.GRDC_List_Model1 .title {
    font-weight: bold;
    font-size: 1.8rem;
    color: rgba(0,32,96,1);
    color: var(--navy);
}
.GRDC_List_Model1 .lSSlideOuter .lSPager.lSpg{
    text-align:center;
}

@media (max-width: 480px) {
    .GRDC_List_Model1 figure{float: none; width: 100%;}
    .GRDC_List_Model1 .content{position: relative; width: 100%; right: initial; top: initial; padding: 0 0 30px 0;}
}

/* model2 : chiffre / le saviez vous */
.GRDC_List_Model2{margin-left:-34px;}
.GRDC_List_Model2 .modContent{padding: 16px 16px 0 16px !important;}
.GRDC_List_Model2 h2{font-size: 4rem;}
.GRDC_List_Model2 article{overflow: hidden; padding: 0 !important; margin: 0 0 20px 0;}
.GRDC_List_Model2 figure, 
.GRDC_List_Model2 .eltTitle{
    float: left;
    width: 40%;
    text-align: center;
    color: #888;
    font-size: 1.3rem;
    margin: 0 20px 0 0;
}
.GRDC_List_Model2 figure img{width: 100%;}

@media (max-width: 980px) {
    .GRDC_List_Model2{margin-left:0;}
}


/* model3 : Nous */
.GRDC_List_Model3 .title{color: #FFF; background-color:rgba(0,32,96,1); background-color: var(--navy); height: 80px; line-height: 30px; padding: 0 20px;}
.GRDC_List_Model3 .contentList{ overflow: hidden; position: relative; margin: 0 20px; top: -50px;}
.GRDC_List_Model3 article{background-color: #FFF; border-bottom: 1px solid #eee;}
.GRDC_List_Model3 .corps{ padding: 10px;}
.GRDC_List_Model3 img{width: 100%;}
.GRDC_List_Model3 .contentList p{font-size: 1.3rem;}
.GRDC_List_Model3.count1,
.GRDC_List_Model3.count2{
    max-width:700px;
}

@media (max-width: 812px) {
    .GRDC_List_Model3 .corps {
        position: relative;
        margin: 0;
        padding: 0;
    }
    .GRDC_List_Model3 .title{height: 30px; line-height: 30px; padding: 0 20px;}
    .GRDC_List_Model3 .contentList{padding: 15px; position: static; top: auto; margin: 0; border: 1px solid #eee;}
}

/* modèle 4 et modèle 5 */
.GRDC_List_Model4 .contentList,
.GRDC_List_Model5 .contentList{ overflow: hidden;}

.GRDC_List_Model4 .col2,
.GRDC_List_Model5 .col1{ order: 2;}

.GRDC_List_Model4 .col1,
.GRDC_List_Model5 .col2{ order: 1;}

.ie .GRDC_List_Model4 .col2,
.ie .GRDC_List_Model5 .col1,
.ie .ContentListComponent .grid article:nth-child(2n) { -ms-grid-column: 2; -ms-grid-row: 1; margin: 0 0 20px 10px;}

.ie .GRDC_List_Model4 .col1,
.ie .GRDC_List_Model5 .col2,
.ie .ContentListComponent .grid article:first-child { -ms-grid-column: 1; -ms-grid-row: 1;  margin: 0 10px 20px 0;}

.ie .ContentListComponent .grid article:nth-child(3){-ms-grid-row: 2; margin: 0 10px 20px 0;}
.ie .ContentListComponent .grid article:nth-child(4){-ms-grid-column: 2; -ms-grid-row: 2; margin: 0 0 20px 10px;}
.ie .ContentListComponent .grid article:nth-child(5){-ms-grid-row: 3; margin: 0 10px 20px 0;}
.ie .ContentListComponent .grid article:nth-child(6){-ms-grid-column: 2; -ms-grid-row: 3;  margin: 0 0 20px 10px;}
.ie .ContentListComponent .grid article:nth-child(7){-ms-grid-row: 4; margin: 0 10px 20px 0;}
.ie .ContentListComponent .grid article:nth-child(8){-ms-grid-column: 2; -ms-grid-row: 4;  margin: 0 0 20px 10px;}

.ie .ContentDetailComponent .GRDC_List_Model3 .grid article:nth-child(1){ -ms-grid-column: 1; -ms-grid-row: 1; margin: 0 10px 20px 0;}
.ie .ContentDetailComponent .GRDC_List_Model3 .grid article:nth-child(2){ -ms-grid-column: 2; -ms-grid-row: 1; margin: 0 5px 20px 5px;}
.ie .ContentDetailComponent .GRDC_List_Model3 .grid article:nth-child(3){ -ms-grid-column: 3; -ms-grid-row: 1; margin: 0 0 20px 10px;}

.GRDC_List_Model4 .primary figure,
.GRDC_List_Model5 .primary figure{
    width: 100%;
}

.GRDC_List_Model4 .primary figure img,
.GRDC_List_Model5 .primary figure img{
    width: 100%;
}

.GRDC_List_Model4 .primary figure + .corps,
.GRDC_List_Model5 .primary figure + .corps{
    background: #FFF;
    padding: 20px 20px 14px 20px;
    position: relative;
    margin: -40px 10px 0 10px;
}

.GRDC_List_Model4 .primary .corps p,
.GRDC_List_Model5 .primary .corps p{
    margin: 5px 0 0 0;
}

.GRDC_List_Model4 .simple,
.GRDC_List_Model5 .simple{
    margin: 0 0 20px 0;
    border-bottom: 1px solid #EEE;
}

.GRDC_List_Model4 .simple img,
.GRDC_List_Model5 .simple img {
    width: 30%; float: left; margin: 0 5px 0 0;
}

@media (max-width: 812px) {
    .ie .ContentListComponent .grid article:nth-child(2n),
    .ie .ContentListComponent .grid article:nth-child(4),
    .ie .ContentListComponent .grid article:nth-child(6),
    .ie .ContentListComponent .grid article:nth-child(8),
    .ie .ContentDetailComponent .GRDC_List_Model3 .grid article:nth-child(2),
    .ie .ContentDetailComponent .GRDC_List_Model3 .grid article:nth-child(3)
    {margin: 0;}

    .GRDC_List_Model4 .primary figure + .corps,
    .GRDC_List_Model5 .primary figure + .corps{
        position: relative;
        margin: 0;
        padding: 0;
        left: initial;
        right: initial;
        bottom : initial;
    }
    .GRDC_List_Model4 .primary,
    .GRDC_List_Model5 .primary{
        margin: 0 0 20px 0;
        border-bottom: 1px solid #EEE;
    }
}

/* model 6 : bloc rendez-vous */
.GRDC_List_Model6{
    position: relative;
    margin: 0 0 30px 0;
    background-color: #f9d4cb;
    overflow: hidden;
    display: flex;
}

.GRDC_List_Model6 .blocLeft {
    position: relative;
    width: 260px;
    min-height: 160px;
    padding: 18px;
    background: rgba(0,32,96,1) url('/files/fr/images/agenda_bleu.png') no-repeat;
    background-size: 80px;
    background-position: center 50px;
    text-align: center;
    color: #FFF;
    text-transform: uppercase;
}

.GRDC_List_Model6 .blocLeft a {
    color: #fff;
    display:block;
    width:100%;
    height:100%;
}

.GRDC_List_Model6 .blocLeft::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    display: block;
    background-color: #fff;
    clip-path: polygon(0 0, 0% 100%, 50% 100%);
    opacity: .15;
}

.GRDC_List_Model6 .blocRight {
    width: calc(100% - 260px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex-grow: 1;
    padding: 24px 35px 10px;
    background-color: #fff;
    border: 3px solid rgba(0,32,96,1);
}

.GRDC_List_Model6 .event{
    margin: 0 0 5px 0;
    overflow: hidden;
}

.GRDC_List_Model6 .event .date{
    float: left;
    background: rgba(255,255,255,0.5);
    padding: 0 10px;
    border-radius: 4px;
    font-size: 1.3rem;
    margin: 0 5px 0 0;
    color: rgba(0,32,96,1);
    min-width:100px;
}

.GRDC_List_Model6 .event h2{
    font-size: 1.5rem;
    color: rgba(0,32,96,1);
}

.GRDC_List_Model6 .event h2 a{
    color: rgba(0,32,96,1); 
}
.GRDC_List_Model6 .event h2 a.ico_linkedin{
    float: right;
}
.GRDC_List_Model6 .event h2 a.ico_linkedin:hover{
    text-decoration: none;
}


.GRDC_List_Model6 .event h2 a:hover {
    text-decoration:underline;
}

@media (max-width: 980px) {
    .GRDC_List_Model6 {
        display: unset;
    }

    .GRDC_List_Model6 .blocLeft, .GRDC_List_Model6 .blocRight {
        width: 100%;
    }
}

/* model7 : point de vue */
.GRDC_List_Model7 figure{float: left; width: 38%; margin: 0 5px 0 0;}
.GRDC_List_Model7 figure img{ width: 100%;}
.GRDC_List_Model7 h2{font-size: 1.4rem; color: rgba(0,32,96,1); margin: 5px 0;}
.GRDC_List_Model7 .corps{margin: 0 0 5px 0;}
.GRDC_List_Model7 .corps p{font-size: 1.3rem;}
.GRDC_List_Model7 article{overflow: hidden; margin-bottom: 5px;}
.GRDC_List_Model7 .infoContent{right: 10px;}

/* model 8 : a la une en colonne de droite */
.GRDC_List_Model8 article{position: relative; margin: 0 0 10px 0; padding: 0 0 20px 0; border-bottom: 1px solid #EEE;}
.GRDC_List_Model8 article:last-child{border: none;}
.GRDC_List_Model8 h2{font-size: 1.5rem; color: rgba(0,32,96,1); margin: 0 0 10px 0;}
.GRDC_List_Model8 div, .GRDC_List_Model8 p{font-size: 1.26rem;}

/* model 9 : sur la meme rubrique */
.GRDC_List_Model9{padding: 40px 0 0 0;}
.GRDC_List_Model9.count1, .GRDC_List_Model9.count2{max-width:700px;}
.GRDC_List_Model9 .title{color: #FFF; background-color: rgba(0,32,96,1); height: 80px; line-height: 30px; padding: 0 30px;}
.GRDC_List_Model9 .contentList{ overflow: hidden; margin: 0 30px; position: relative; top: -50px;}
.GRDC_List_Model9 img{width: 100%;}
.GRDC_List_Model9 .corps{background-color: #FFF;}
.GRDC_List_Model9 .contentList p{font-size: 1.3rem;}
.GRDC_List_Model9 .contentList article{font-size: 1.3rem; border-bottom: 1px solid #eee;}

/* model 10 : derniers points de vue en colonne de droite */
.GRDC_List_Model10.mod.ribbon .modContent{min-height: 330px; position:relative;}
.GRDC_List_Model10 article{position: relative; margin: 0 0 10px 0; padding: 0 0 35px 0; border-bottom: 1px solid #EEE; overflow: hidden;}
.GRDC_List_Model10 article:last-child{border: none;}
.GRDC_List_Model10 figure{float: left; width:35%; margin: 0 5px 0 0;}
.GRDC_List_Model10 figure img{ width: 100%;}
.GRDC_List_Model10 h2{font-size: 1.5rem; color: rgba(0,32,96,1); margin: 0 0 10px 0;}
.GRDC_List_Model10 .corps, .GRDC_List_Model10 p{font-size: 1.3rem;}
.GRDC_List_Model10 .pagination{display:block; line-height: 32px; margin:0; white-space:nowrap;}
.GRDC_List_Model10 .pagination .prev,
.GRDC_List_Model10 .pagination .next{
    display:none;
}
.GRDC_List_Model10 .showMore{display:block; float:left; margin: 0 5px 0 0;}
.GRDC_List_Model10 .showMoreLink{
    display:inline-block;
    padding: 0 10px;
    height: 32px;
    line-height:32px;
    font-size: 1.3rem;
    background-color: rgba(115,191,141,1);
    background:var(--green);
    color:#fff;
}
.GRDC_List_Model10 a.showMoreLink:hover{
    color:rgba(0,0,0,0.60);
    background: none;
    border-bottom: 3px solid rgba(115,191,141,1);
}

.GRDC_List_Model1 .contentList .infoContent,
.GRDC_List_Model1 .contentList .infoPublish,
.GRDC_List_Model3 .contentList .infoContent,
.GRDC_List_Model3 .contentList .infoPublish{
    padding: 0 10px;
}

.GRDC_List_Model4 .primary .infoPublish,
.GRDC_List_Model4 .primary .infoContent,
.GRDC_List_Model5 .primary .infoPublish,
.GRDC_List_Model5 .primary .infoContent{
    padding: 0 30px;
}

@media (max-width: 812px) {
    .GRDC_List_Model9::before{content: none;}
    .GRDC_List_Model9 .title{position:static; padding: 0 10px 0 20px; background-color: rgba(0,32,96,1); line-height: 30px; height: 30px;}
    .GRDC_List_Model9 .contentList{margin: 0;border: 1px solid #eee; padding: 16px; position: static; top:auto;}
    .GRDC_List_Model9 .contentList article{position: relative; margin: 0 0 30px 0; border: none;}
    .GRDC_List_Model3 .contentList article{position: relative; margin: 0 0 30px 0; border: none;}
    .GRDC_List_Model3 .contentList .infoContent,
    .GRDC_List_Model3 .contentList .infoPublish,
    .GRDC_List_Model4 .contentList .infoContent,
    .GRDC_List_Model4 .contentList .infoPublish,
    .GRDC_List_Model5 .contentList .infoContent,
    .GRDC_List_Model5 .contentList .infoPublish{
        padding: 0;
    }
}

.ie .SearchComponent .grid article:first-child{-ms-grid-row: 1; -ms-grid-column: 1; margin: 0 10px 20px 0;}
.ie .SearchComponent .grid article:nth-child(2){-ms-grid-row: 1; -ms-grid-column: 2; margin: 0 5px 20px 5px;}
.ie .SearchComponent .grid article:nth-child(3){-ms-grid-row: 1; -ms-grid-column: 3; margin: 0 0 20px 10px;}
.ie .SearchComponent .grid article:nth-child(4){-ms-grid-row: 2; -ms-grid-column: 1; margin: 0 10px 20px 0;}
.ie .SearchComponent .grid article:nth-child(5){-ms-grid-row: 2; -ms-grid-column: 2; margin: 0 5px 20px 5px;}
.ie .SearchComponent .grid article:nth-child(6){-ms-grid-row: 2; -ms-grid-column: 3; margin: 0 0 20px 10px;}
.ie .SearchComponent .grid article:nth-child(7){-ms-grid-row: 3; -ms-grid-column: 1; margin: 0 10px 20px 0;}
.ie .SearchComponent .grid article:nth-child(8){-ms-grid-row: 3; -ms-grid-column: 2; margin: 0 5px 20px 5px;}
.ie .SearchComponent .grid article:nth-child(9){-ms-grid-row: 3; -ms-grid-column: 3; margin: 0 0 20px 10px;}

.ie .BookmarkedContentListComponent .grid article:first-child{-ms-grid-row: 1; -ms-grid-column: 1; margin: 0 10px 20px 0;}
.ie .BookmarkedContentListComponent .grid article:nth-child(2){-ms-grid-row: 1; -ms-grid-column: 2; margin: 0 0 20px 10px;}
.ie .BookmarkedContentListComponent .grid article:nth-child(3){-ms-grid-row: 2; -ms-grid-column: 1; margin: 0 10px 20px 0;}
.ie .BookmarkedContentListComponent .grid article:nth-child(4){-ms-grid-row: 2; -ms-grid-column: 2; margin: 0 0 20px 10px;}
.ie .BookmarkedContentListComponent .grid article:nth-child(5){-ms-grid-row: 3; -ms-grid-column: 1; margin: 0 10px 20px 0;}
.ie .BookmarkedContentListComponent .grid article:nth-child(6){-ms-grid-row: 3; -ms-grid-column: 2; margin: 0 0 20px 10px;}
.ie .BookmarkedContentListComponent .grid article:nth-child(7){-ms-grid-row: 4; -ms-grid-column: 1; margin: 0 10px 20px 0;}
.ie .BookmarkedContentListComponent .grid article:nth-child(8){-ms-grid-row: 4; -ms-grid-column: 2; margin: 0 0 20px 10px;}
.ie .BookmarkedContentListComponent .grid article:nth-child(9){-ms-grid-row: 5; -ms-grid-column: 1; margin: 0 10px 20px 0;}
.ie .BookmarkedContentListComponent .grid article:nth-child(10){-ms-grid-row: 5; -ms-grid-column: 2; margin: 0 0 20px 10px;}

@media (max-width: 812px) {

}

/* Sondage / Vote */

.GRDC_webPoll .question{
    font-size: 1.6rem;
    line-height: 2.2rem;
    font-weight: bold;
}

.GRDC_webPoll .msgBox {
    margin: 10px 0;
} 

.GRDC_webPoll .reponse {
    font-size: 1.4rem;
} 

.GRDC_webPoll .percent {
    font-size: 1.2rem;
    line-height: 1rem;
} 

.GRDC_webPoll .total {
    margin: 16px 0;
    font-size: 1.4rem;
}

.pollComponent legend {
    font-weight: bold;
}

.pollComponent ul.poll_choices {
    margin: 16px 0 0 16px;
}

.pollComponent ul.poll_choices li {
    display: flex;
    align-items: center;
    margin: 8px 0;
    border: 1px solid #dae0e7;
    border-radius: 4px;
    background: #fbfbfb;
}
.pollComponent ul.poll_choices li:hover{
    background-color: #f8f8f8;
}

.pollComponent ul.poll_choices input {
    cursor: pointer;
    display: block;
    margin: 10px;
}

.pollComponent ul.poll_choices label {
    cursor: pointer;
    display: block;
    flex-grow: 1;
    padding: 10px 0;
}


.pollComponent ul.poll_choices input:checked + label {
    font-weight: bold;
    color: #3A3B41;
}


.pollComponent p.reponse {
    margin: 10px 0 0;
    font-weight: 500;
}

.pollComponent .resconteneur {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.pollComponent .resconteneur .bar_container{
    flex-grow: 1;
    background: #f1f7ff;
    border-radius: 10px;
}

.pollComponent .resultat {
    position: relative;
    height: 6px;
    min-width: 6px;
    border-radius: 10px;
    background: rgb(0,68,148);
    background: linear-gradient(90deg, rgba(0,68,148,1) 0%, rgba(18,93,181,1) 50%, rgba(50,124,210,1) 100%);
}

.percent{
    margin-left: 20px;
    text-align: right;
}

.pollComponent fieldset {
    margin-top: 12px;
}

.pollComponent ul.poll_choices {
    margin: 0;
}

.pollComponent ul.poll_choices label {
    padding: 6px 0;
    font-size: 1.4rem;
}

/* Liens utiles */
.usefulLinks li {
    margin:0;
    padding:0 0 10px;
    line-height:1rem;
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: space-between;
    flex-wrap: nowrap;
    align-items: center;
    border-top:1px solid #eee;
    padding:10px 5px;
}

.usefulLinks li:first-child{
    border:none;
}
.usefulLinks li a + div.wrapper_linkedin a.ico_linkedin,
.usefulLinks li a + a.ico_linkedin{
    text-align:center;
    width:32px;
    height:32px;
    line-height:32px;
    font-size:0;
    display:inline-block;
}
.usefulLinks li a:hover + a.ico_linkedin:hover{
    opacity: 0.7
}

.usefulLinks li a + div.wrapper_linkedin{
    width: 40px;
    text-align:center;
}

.ico_linkedin::before{
    content:"\eac9";
    font-family:'icoCMF';
    font-size:28px;
    color:#0877bf;
    font-weight:normal;
    font-style:normal;
    vertical-align:middle;
}
.ico_linkedin:hover::before {
    color: #3f99d3;
}

.ico_linkedin span{
    display: inline-block;
    text-indent:-9999px;
}

/* =============================================================================
   $GRDC : Liste de contenus (component : contentList)
   ========================================================================== */

.contentList article{position: relative; padding: 0 0 35px 0;}
.contentList article h2 {
    color: rgba(0,32,96,1); margin: 0 0 10px 0;
}
.contentList article.primary h2 {
    font-size: 2.2rem;
}
.contentList article figure{overflow: hidden;}
.contentList article.noImage figure{background: url(../images/logo-CMF-tablet_inverse.png) #EEE; background-repeat: no-repeat; background-position: 50% 50%; background-size: 90%; min-height: 160px; margin: 0 0 5px 0;}
.contentList article figure img{transition: transform .7s ease-in-out; width: 100%;}
.contentList article a:hover figure img{
    transform: scale(1.05);
}
.contentList article.gallery figure::before,
.contentList article.video figure::before{
    font-family:icoCMF;
    font-size: 2.4rem;
    text-align:right;
    color:#fff;
    background: rgb(0,0,0);
    background: -moz-linear-gradient(180deg, rgba(0,0,0,.6) 20%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(180deg, rgba(0,0,0,.6) 20%, rgba(255,255,255,0) 100%);
    background: linear-gradient(180deg, rgba(0,0,0,.6) 20%, rgba(255,255,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#ffffff",GradientType=1);
    display: block;
    position:absolute;
    padding: 5px 10px;
    left:0;
    right:0;
    top:0;
    z-index:9999;
}

.contentList article.gallery figure::before{content:"\e92f";}
.contentList article.video figure::before{content:"\e941";}

.ContentListComponent h1{text-transform: uppercase; font-size: 2.4rem; margin: 0 0 10px 0; color: rgba(0,32,96,1)}
.ContentListComponent .contentList article{border-bottom: 1px solid #EEE;}
.ContentListComponent article img{width: 100%;}
.ContentListComponent article.primary{margin: 0 0 30px 0;}

.ContentListComponent article.primary .corps{
    padding: 20px 20px 5px 20px;
    position: relative;
    margin: -40px 10px 0 10px;
    z-index: 1;
    background-color: #FFF;
}
.ContentListComponent article.primary.noImage .corps{
     margin: 0;
}

.ContentListComponent .contentList article.element{
    margin: 0 0 20px 0;
}

.ContentListComponent .contentList .primary .infoPublish,
.ContentListComponent .contentList .primary .infoContent{
    padding: 0 30px;
}

.contentList.inline article{overflow: hidden;}
.contentList.inline figure{float: left; width: 20%;}
.contentList.listPdv.inline figure{width:36%; margin: 0 5px 0 0;}

/* =============================================================================
   $GRDC : Detail de contenu (component : contentDetail)
   ========================================================================== */
.ContentDetailComponent{margin: 0;}
.ContentDetailComponent .contentHeading{font-size:0px;}
.ContentDetailComponent h1{margin: 10px 0 30px 0; color: rgba(0,32,96,1); display:inline-block; vertical-align:top; width:75%;margin-right:5%;}
.ContentDetailComponent .logo-marque{display:inline-block; vertical-align:top; width:20%; margin:12px 0 0; text-align:right;}
.ContentDetailComponent .logo-marque img{max-width:100%;}
.ContentDetailComponent figcaption{color: #888; font-size: 1.12rem;}
.ContentDetailComponent figcaption p{margin: 0;}

.ContentDetailComponent .infos{
    width:auto;
    position:static;
    padding: 2px 0; 
    margin: 0 0 20px 0; 
    overflow: hidden; 
    background:none;
}

    .ContentDetailComponent .infosShare {
        color: rgba(0,32,96,1);
    }

.ContentDetailComponent .infos [class*="icon_"].before::before{vertical-align: middle;}
.ContentDetailComponent .infos:not(.cartouche) .infosDate{
    text-transform:uppercase;    
    float:left;
    margin:0;
}

.ContentDetailComponent .infos:not(.cartouche) .infosShare{
    float: right;
}
.ContentDetailComponent .infos:not(.cartouche) .infosDate,
.ContentDetailComponent .infos:not(.cartouche) .infosShare{
    line-height:3.2rem;
}

.ContentDetailComponent .infos:not(.cartouche) .infosShare > span{
    border: 1px solid #EEE;
    padding: 4px 4px 6px 4px;
    border-radius: 4px;
}

.ContentDetailComponent .infos.cartouche{
    position:absolute;
    left:0;
    width:75px;
    padding:5px 10px;
    background-color: #f8f8f8;
    color:rgba(0,0,0,0.60);
    text-align:center;
    z-index:2;
}
.ContentDetailComponent .infos.cartouche .infosDate .info_day,
.ContentDetailComponent .infos.cartouche .infosDate .info_month,
.ContentDetailComponent .infos.cartouche .infosDate .info_year,
.ContentDetailComponent .infos.cartouche .infosShare span{
    display:block;
}

.ContentDetailComponent .infos.cartouche .like-counter,.ContentDetailComponent .infosShare .like-counter {vertical-align: sub; color: #888; font-style: normal; }

.infosShare span{
    cursor: pointer;
}
.ContentDetailComponent .infos.cartouche .infosDate .info_day {
    font-weight:bold;
    font-size:2.4rem;
    color:#212121;
}
.ContentDetailComponent .infos.cartouche .infosDate .info_month {
    text-transform:uppercase;
    font-size:1.1rem;
    line-height: normal;
}
.ContentDetailComponent .infos.cartouche .infosDate .info_year {
    font-size:1.1rem;
}
.ContentDetailComponent .infos.cartouche .infosDate .info_time{
    border: 1px solid #ccc;
    border-left:none;
    border-right:none;
    padding:5px 0;
    margin:5px 0;
    display:block;
}

.ContentDetailComponent .info_published,
.ContentDetailComponent .info_time.before::before,
.ContentDetailComponent .info_time .readingTime{
    vertical-align: middle;
}
.ContentDetailComponent .info_time.before::before{margin:0 2px;}
.ContentDetailComponent .contentTop{position: relative; margin:0 0 30px;}
.ContentDetailComponent .contentTop .accroche{ 
    margin: 10px 0 20px 0; 
    font-size: 1.7rem; 
    z-index: 1; 
    position: relative;
    letter-spacing: 0.5px;
}
.ContentDetailComponent .contentTop .mainImage, .ContentDetailComponent .contentTop .galerieContent{width:80%;float:right;clear:both;}
.ContentDetailComponent .contentTop .mainImage + .accroche, .ContentDetailComponent .contentTop .galerieContent + .accroche{
    box-shadow:0 3px 6px 3px rgba(0,0,0,0.20);
    margin:0 8px;
    display:inline-block;
    width:80%;
    padding:25px;
    background:#ffffff;
}
.ContentDetailComponent .contentTop .mainImage + .accroche{margin-top:-43px;}
.ContentDetailComponent .contentTop .galerieContent + .accroche {margin-top: -70px;}
.ContentDetailComponent .contentTop .mainImage img, .ContentDetailComponent .contentTop .galerieContent img{width: 100%;}
.ContentDetailComponent .richContentComponents .mainImage img, .ContentDetailComponent .richContentComponents .galerieContent img{width: auto;}
.ContentDetailComponent .contentTop .mainImage figcaption{display: none;}

@media screen and (max-width: 812px) {
    .ContentDetailComponent h1{display:block; width: auto; margin: 0; font-size: 3rem; line-height: 1.1;}
    .ContentDetailComponent .logo-marque{display:block; width:auto; text-align:center;margin:10px 0;}
    .ContentDetailComponent .contentTop .mainImage, .ContentDetailComponent .contentTop .galerieContent{width:100%;float:none;clear:none;}
    .ContentDetailComponent .contentTop .mainImage + .accroche, .ContentDetailComponent .contentTop .galerieContent + .accroche {
        box-shadow:none;
        display:block;
        width:100%;
        margin:10px 0 20px 0;
        padding:0;
    }

    .ContentDetailComponent .infos.cartouche{
        position:static;
        background:none;
        width:auto;
        text-align:left;
        z-index:2;
        padding:2px 0;
    }
    .ContentDetailComponent .infos.cartouche .infosDate{float:left;color:#999;text-transform:uppercase;line-height: 3.2rem;}
    .ContentDetailComponent .infos.cartouche .infosShare{float:right;color:#999;line-height: 3.2rem;}
    .ContentDetailComponent .infos.cartouche .infosDate .info_day,
    .ContentDetailComponent .infos.cartouche .infosDate .info_month,
    .ContentDetailComponent .infos.cartouche .infosDate .info_year,
    .ContentDetailComponent .infos.cartouche .infosShare span{
        display:unset;
        font-weight:normal;
        font-size:inherit;
        color:inherit;
    }

    .ContentDetailComponent .infos.cartouche .infosDate .info_time{
        border: none;
        padding:0;
        margin:0;
        display:unset;
    }
}

.ContentDetailComponent p.center{text-align: center;}

.richContentComponents > div{margin: 0 0 30px 0; clear: both; overflow: hidden;}
.richContentComponents h2{margin: 10px 0 20px 0; color: rgba(0,32,96,1); letter-spacing: 1px; font-size: 2.4rem;}
.richContentComponents h3{margin: 10px 0 10px 0; color: #212121; letter-spacing: 1px; font-size: 1.8rem; line-height: 1.3;}
.richContentComponents p{margin: 0 0 10px 0; line-height: 1.8;}
.richContentComponents p a{text-decoration: underline;}
.richContentComponents ul li ul{
    margin: 0 0 0 20px;
}

.richContentComponents ul li a{
    text-decoration: underline;
}
.richContentComponents ul:not(.lSPager) li::before {
    content: '';
    background-color: #125DB5;
    display: inline-block;
    margin: 0 10px 1px 0;
    width: 5px;
    height: 5px;
    border-radius: 5px;
    line-height: 5px;
}

.richContentComponents .insetComponent{
    padding: 20px;
    background-color: #FFF;
    box-shadow: 0 3px 6px 3px rgba(0,0,0,0.20);
    margin: 0 8px 30px 8px !important;
    overflow: hidden;
}

.insetComponent h2,
.insetComponent h3,
.insetComponent h4,
.insetComponent .insetTitle{
    color: rgba(0,32,96,1);
    line-height: 1.3;
}

.insetComponent h2{font-size: 1.8rem; margin-bottom: 15px;}
.insetComponent h3{font-size: 1.6rem; margin-bottom: 15px;}

.ContentDetailComponent .insetComponent .insetTitle {
    font-weight: bold; 
    font-size: 2.2rem; 
    margin: 10px 0 20px 0;
}

.insetComponent .insetSignature{
    font-style: italic;
    font-size: 1.6rem;
    color: rgba(0,32,96,1);
    margin: 10px 0 0;
    text-align:right;
}

.insetComponent .insetSignature::before{ 
    content: "-";
    display: inline;
    position: relative;
    left: -12px;
}

.ContentDetailComponent .insetComponent ul {
    margin: 12px 0;
}

.ContentDetailComponent .insetComponent li {
    margin-bottom: 2px;
}

.richContentComponents .imageContent img{width: 100%; margin: 10px 0 0 0;}

.richContentComponents .image .imageContent.right{float: right; width: 170px; margin: 0 0 10px 20px;}
.richContentComponents .image .imageContent.left{float: left; width: 170px; margin: 0 20px 10px 0;}
.richContentComponents .image .textContent.left{float: left; width: calc(100% - 200px);}
.richContentComponents .image .textContent{float: right; width: calc(100% - 200px);}
.richContentComponents .pdfComponent{background-color: #f8f8f8; padding: 30px;}
.ContentDetailComponent .note{font-size: 1.2rem; color: #888; padding: 10px 0; border-top: 1px solid #888; margin: 10px 0 0 0; display: table; clear: both;}

.ContentDetailComponent .citation{ 
    position: relative;
    margin: 0 auto 30px;
    padding: 30px;
    background-color: #f8f8f8;  
    color: rgba(0,32,96,1);
    max-width: 80%;
}

.richContentComponents .textComponent img.petit{width: 50px !important; height: auto !important;}
.richContentComponents .textComponent img.moyen{width: 100px !important; height: auto !important;}
.richContentComponents .textComponent img.grand{width: 150px !important; height: auto !important;}

.richContentComponents .textComponent.image .citation{max-width: 100%;}

.ContentDetailComponent .left.imageContent ~ .citation,
.ContentDetailComponent .right.imageContent ~ .citation {
    display:inline-block;
    max-width: 65%;
}

.ContentDetailComponent .citation .txt{ 
    position: relative;
    display: inline-block;
    font-style: italic;
    font-size: 1.6rem; 
    line-height: 2.6rem;
    margin: 0;
}

.ContentDetailComponent .citation::before{
    content: "\e92e";
    font-family: 'icoCMF';
    display: block;
    position: absolute;
    top: 10px;
    left: 5px;
    font-style: normal;
    font-weight: normal;
    font-size: 2.6rem;
    -moz-transform: scale(-1, 1);
    -webkit-transform: scale(-1, 1);
    -o-transform: scale(-1, 1);
    -ms-transform: scale(-1, 1);
    transform: scale(-1, 1);
}
.ContentDetailComponent .citation::after{
    content: "\e92e";
    font-family: 'icoCMF';
    display: block;
    position: absolute;
    bottom: 10px;
    right: 5px;
    font-style: normal;
    font-weight: normal;
    font-size: 2.2rem;
}

.ContentDetailComponent .citation .nom{ 
    position: relative;
    display: block;
    margin: 3px 0; 
    font-style: normal;
    font-size: 1.6rem;
    text-align: right;
}

.ContentDetailComponent h2.rel{
    padding: 0 0 0 20px;
    margin: 10px 0 20px 40px;
    border-left: 4px solid rgba(0,32,96,1);
    font-size: 1.9rem;
}

.ContentDetailComponent .question{
    font-weight: bold; 
    color: #FFF;
    margin: 8px 0 0 0 !important;
    display: table;
    letter-spacing: 0.5px;
    padding: 5px 20px;
    background-color: rgba(115,191,141,1);
}

.ContentDetailComponent .answer{
    font-weight: bold;
    color: #FFF; 
    margin: 8px 0 0 0 !important;
    display: table;
    letter-spacing: 0.5px;
    padding: 5px 20px;
    background-color: rgba(108,198,216,1);;
}


.ContentDetailComponent .chiffre,
.ContentDetailComponent p.chiffre{
    font-size: 3rem; 
    color: #6cc6d8;
    margin: 16px 0;
    line-height: 1.1;
}

.ContentDetailComponent .nombre {
    background: #f8f8f8;
    padding: 16px;
    margin-bottom: 16px;
}

    .ContentDetailComponent .nombre .valeur {
        color: #002060;
        margin: 0;
        font-size: 30px;
        font-weight: 600;
        line-height: 140%;
    }

.ContentDetailComponent .titreresultat{
    display: table;
    padding: 5px 20px; 
    background-color: rgba(245,186,73,1); 
    color: #fff;
    font-weight: bold;
    letter-spacing: 0.5px;
    font-size: 1.4rem;
    margin: 8px 0 0 0 !important;
}

.ContentDetailComponent .pararesultat{
    border: 1px solid #eee; 
    padding: 10px 20px; 
    font-size: 1.4rem;
}

.ContentDetailComponent .video h1{
    margin: 0;
}

.ContentDetailComponent .videoComponent{margin: 30px 0;}
.componentDescription{color: #999;}
.videoContentExt.reduceVideo{width: 50% !important; margin: auto;}
.videoContentExt, .videoContentInt, .googleContent{position: relative; overflow: hidden; padding-top: 56.25%;}
.videoContentExt iframe, .videoContentInt iframe{width: 100%; padding-top: 0;}
.googleContent iframe, .videoContentExt iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;}

.videoContentExt iframe, .videoContentInt iframe{width: 100%; padding-top: 0;}
.googleContent iframe, .videoContentExt iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;}

.videoContentExt.videoBimm {padding:0px;}

 .moviePlayer,  .videoContent{
    text-align: center;
    margin: 0 0 30px 0;
    overflow: hidden;
    padding-top: 56.25%;
    position: relative;
}

.moviePlayer iframe,  .videoContent iframe {
    width: 100%;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
}

.moviePlayer div{width: 100% !important;}

.moviePlayer.videoBimm {padding:0px;}

.ContentDetailComponent .pointdevue .richContentComponents{
    display:flex;
    align-items: flex-start;
    align-content: flex-start;
    gap: 10px;
}

.ContentDetailComponent .pointdevue .pdvContent{
    flex:65%;
}

.ContentDetailComponent .pointdevue .pdvPortrait{
    flex:35%;
    position:relative;
}

.ContentDetailComponent .pointdevue .pdvPortrait .left,
.ContentDetailComponent .pointdevue .pdvPortrait .right{
    position: relative;
}

.ContentDetailComponent .pointdevue .pdvPortrait .left img,
.ContentDetailComponent .pointdevue .pdvPortrait .right img{
    width:70%;
}

.ContentDetailComponent .pointdevue .pdvPortrait figcaption{
    color: rgba(0,32,96,1);
}
.ContentDetailComponent .pointdevue .pdvPortrait .left figcaption {
    position:absolute;
    bottom:0;
    left:40%;
    right:0;
}

.ContentDetailComponent .pointdevue .pdvPortrait .right figcaption {
    position:absolute;
    bottom:0;
    left:0;
    right:40%;
}

@media screen and (max-width: 812px) {
    .ContentDetailComponent h2{display:block; width: auto; margin: 0; font-size: 2rem; line-height: 1.1;}


    .ContentDetailComponent .pointdevue .pdvPortrait .left,
    .ContentDetailComponent .pointdevue .pdvPortrait .right{
        float:none;
        width:auto;
    }

    .ContentDetailComponent .pointdevue .pdvPortrait .left figcaption,
    .ContentDetailComponent .pointdevue .pdvPortrait .right figcaption{
        position:static;
    }
}

@media screen and (max-width: 480px) {
    .richContentComponents .imageContent.left,
    .richContentComponents .imageContent.right,
    .richContentComponents .textContent.left{
        float: none;
        width: 100%;
        margin: 0 0 20px 0;
    }
}

/* =============================================================================
   $GRDC : Inscription aux newsletters (component : NewsLetterSmartSubscriptionComponent)
   ========================================================================== */

.NewsLetterSmartSubscriptionComponent h1{
    text-transform:uppercase;
    font-size: 2.4rem;
    margin: 0 auto 10px;
    color: rgba(0,32,96,1);
}

.GRDC_newsletterSubscribe .listForm{
    margin-top:25px;
}

.NewsLetterSmartSubscriptionComponent .wrapper,
.NewsLetterSmartSubscriptionComponent #wrapper {
    z-index: unset;
}

.GRDC_newsletterSubscribe .GRDC_newsletters {
    display: flex;
    width: 100%;
    margin-bottom: 16px;
}

.GRDC_newsletterSubscribe .GRDC_newsletters:not(:last-of-type) {
    border-bottom: 1px solid #eee;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .nl_illustration {
    width: 160px;
    margin: 0;
    padding: 0;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .nl_illustration svg {
    width: 90%;
    height: 90%;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .nl_illustration img {
    width: 90%;
    height: auto;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .nwl-illustration {
    display: none;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .nl_infos {
    padding-left: 32px;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .nl_infos .nwl-title_wrapper .nwl-title {
    font-size: 1.8rem;
    line-height: 2.4rem;
    font-weight: 700;
    color: rgba(0,32,96,1);
}

.GRDC_newsletterSubscribe .GRDC_newsletters .nwl-description {
    margin-top: 8px;
    font-size: 1.4rem;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .nwl-description a {
    display: inline-block;
    margin-top: 6px;
    font-size: 1.2rem;
    font-weight: 700;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .nwl-description a {
    display: inline-block;
    margin-top: 6px;
    font-size: 1.2rem;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .action {
    margin-top: 16px;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .toggle_wrapper {
    display: inline-block;
    cursor: pointer;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .toggle_wrapper .toggle_switch {
    position: relative;
    display: inline-block;
    width: 40px;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .toggle_wrapper .toggle_switch .under_toggle {
    position: relative;
    z-index: 0;
    width: 32px;
    height: 12px;
    border-radius: 7px;
    transition: position ease .5s,background-color ease .5s;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .toggle_wrapper.off .under_toggle {
    background-color: rgba(0,0,0,.38);
}

.GRDC_newsletterSubscribe .GRDC_newsletters .toggle_wrapper.on .under_toggle {
    background-color: rgba(0,32,96,0.4);
}

.GRDC_newsletterSubscribe .GRDC_newsletters .toggle_wrapper .toggle_switch .toggle {
    position: absolute;
    top: -2px;
    z-index: 1;
    width: 16px;
    height: 16px;
    border-radius: 10px;
    box-shadow: 1px 1px 0 rgba(0,0,0,.14), 0 2px 1px -1px rgba(0,0,0,.12), 0 1px 3px 0 rgba(0,0,0,.20);
    transition: position ease .5s,background-color ease .5s;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .toggle_wrapper.off .toggle {
    right: 6px;
    left: 0;
    background-color: #fff;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .toggle_wrapper.on .toggle {
    right: 6px;
    left: auto;
}

.GRDC_newsletterSubscribe .GRDC_newsletters .toggle_wrapper.on .toggle_switch .toggle {
    background-color: rgba(0,32,96,1);
}

.GRDC_newsletterSubscribe .GRDC_newsletters .toggle_wrapper .toggle_label {
    display: inline-block;
    line-height: 2rem;
    font-size: 1.4rem;
    font-weight: 700;
}

.GRDC_newsletters .toggle_wrapper.on .toggle_label {
    color: rgba(0,32,96,1);
}

.icon_eye:before {
    content: "\e93e";
    font-family: 'icoCMF';
    font-style: normal;
    font-size: 1.6rem;
    vertical-align:middle;
    margin-right: 5px;
    color: rgba(0,32,96,1);
}

.preview_button i{
    display: inline-block;
    background: #d8ebff;
    color: #125db5;
    padding: 6px;
    font-size: 1.4rem;
    border-radius: 20px;
    margin-right: 8px;
}

#preview{z-index: 9998; display: none; width: 680px; background: #f8f8f8; box-shadow: 0 4px 8px rgba(0,0,0,0.50); opacity: 1; position: fixed; left: 50%; top: 100px; padding: 0; transform: translateX(-50%); border-radius:5px;}
#preview .top{padding:10px 20px;}
#preview .top h2{text-align: center; margin: 20px 0; font-size: 2rem; color: rgba(0,32,96,1);}
#preview .top span { float: right;}
#preview .contentPreview { margin: 0 auto; overflow-y: scroll; height: 600px; margin: 20px; width: calc(100% - 40px)}
#preview .contentPreview td, #preview .contentPreview h1{ border: initial; background-color: initial;}
#preview .contentPreview ::before {background-color: initial;}
#preview .closeBox {cursor: pointer; font-size: 14px;}
#preview .modalClose::after{
    font-family: 'icoCMF';
    content: "\e92d";
}

/* =============================================================================
   StaticPage
   ========================================================================== */

.FreeHtmlComponent h1{
    margin: 10px 0 30px 0;
    color: rgba(0,32,96,1);
}

.StaticPage h2{
    font-size: 2.2rem;
    color: rgba(0,32,96,1);
    margin: 0 0 10px 0;
}

.StaticPage h3{
    margin: 10px 0 10px 0;
    color: #212121;
    letter-spacing: 1px;
    font-size: 1.8rem;
    line-height: 1.3;
}

.StaticPage a{
    color: rgba(0,32,96,1);
    font-weight:600;
    cursor: pointer;
}

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

.StaticPage p{
    margin: 0 0 12px;
}

.StaticPage ul, .StaticPage ol {
    margin:0 0 12px;
}

.StaticPage li {
    margin-bottom:0px;
}

.StaticPage ul li::before{
    content: '\e938';
    font-family: icoCMF;
    color: #125DB5;
    display: inline-block;
    padding: 0 10px 0 0;
}

.StaticPage table{
    width: 80%; 
    margin: 32px 0;
}

.StaticPage table thead {
    background-color: rgba(0,32,96,1);
    color:#fff;
}

.StaticPage table tbody {
    background-color: #f8f8f8;
}

.StaticPage table tbody tr:nth-child(even){
    background-color: #fff;
}

.StaticPage table th{
    background: rgba(0,32,96,1);
    color: #fff;
    vertical-align: middle;
    padding: 0 20px;
    font-size: 1.4rem;
}

.StaticPage table tr{
    border-bottom: 1px solid #ccc;
    padding: 5px;
}

.StaticPage table td{
    padding: 12px 20px;
    font-size: 1.4rem;
}

.StaticPage table .c{
    text-align: center; 
}

.StaticPage table .h{
    vertical-align: middle;
}

/* =============================================================================
   $GRDC : Contenus favoris (component : BookmarkedContentListComponent)
   ========================================================================== */

.BookmarkedContentListComponent h1{
    text-transform:uppercase;
    font-size: 2.4rem;
    margin: 0 0 10px;
    color: rgba(0,32,96,1);
}

.BookmarkedContentListComponent p.bookmarks_infos{
    margin: 0 0 40px;
}

.BookmarkedContentListComponent .contentList article.element {
    margin: 0 0 20px 0;
}
.BookmarkedContentListComponent .contentList article {
    border-bottom: 1px solid #EEE;
}

/* =============================================================================
   Page Agenda
   ========================================================================== */

.modAgenda.mod{
    margin-bottom: 40px;
}

.modAgenda.mod.GRDC_List_Model11{
    margin-bottom: 15px;
}

.modAgenda article > a{
    display:block;
    margin:0;
    padding:0;
}

.modAgenda h2 {
    text-transform: uppercase;
    font-size: 3.6rem;
    margin: 0 0 20px 0;
    color: rgba(0,32,96,1);
}

.modAgenda.GRDC_List_Model12 h2 {
    font-size:2.4rem;
}

.modAgenda h2 .yellowColor {
    color: rgba(245,186,73,1);
}

.modAgenda .corps .eventTitle, .modAgenda .corps .eventTitle a {
    text-transform: none;
    font-size: 1.4rem;
    color: rgba(91,155,213,1);
}

.modAgenda .corps .eventTitle a{
    text-decoration:underline;
}

.modAgenda .corps .eventTitle a:hover{
    color: rgba(91,155,213,.7);
}

.modAgenda .corps .eventTitle, .modAgenda .corps .text{
    display: inline;
}

.modAgenda .corps .text{
    color: rgba(0,32,96,1);
    margin:0 0 0 5px;
    font-size:1.4rem;
}

.modAgenda article {
    margin: 0;
    padding: 0;
    position:relative;
    font-size:0;
}

.modAgenda.GRDC_List_Model11 article {
    margin: 0 0 15px 0;
}

.modAgenda article:last-child {
    margin-bottom: 0;
}

.modAgenda img{
    max-width:100%;
    height:auto;
    transition: transform .7s ease-in-out;
}

.modAgenda article.image a:hover img{
    transform: scale(1.05);
}

.modAgenda .surtitre {
    color: rgba(0,32,96,1);
    font-size: 1.4rem;
    font-weight: bold;
    margin: 3px 0;
}

.modAgenda article .ico_linkedin,
.modAgenda .noimage .articleContent,
.modAgenda .eventLink,
.modAgenda .eventLinks{
    display:inline-block;
    vertical-align: middle;
}

.modAgenda .noimage .articleContent{
    width:80%;
}

.modAgenda .eventLinks{
    text-align:right;
    width:15%;
    margin-left:5%;
}

.modAgenda .eventLink{
    width:24px;
    height:auto;
}
    .modAgenda .eventLink:hover {
        opacity: 0.7;
    }

.modAgenda .ico_linkedin{
    width:32px;
    height:32px;
    line-height:32px;
    font-size:0;
    display:inline-block;
    margin-left:16px;
}

@media screen and (max-width: 812px) {
    .modAgenda .noimage .articleContent{
        width:80%;
    }

    .modAgenda .eventLinks{
        text-align:right;
        width:20%;
        margin-left:0;
    }
}

.modAgenda.GRDC_List_Model12{
    border:2px solid rgba(0,32,96,1);
    padding:15px 10px;
}

.modAgenda.GRDC_List_Model13 .brand{
    font-size:0px;
    margin:0 0 40px 0;
}

.modAgenda.GRDC_List_Model13 .brand .logo-marque,
.modAgenda.GRDC_List_Model13 .brand .eventListByBrand{
    display:inline-block;
    font-size:1.4rem;
}

.modAgenda.GRDC_List_Model13 .brand .brandTitle {
    color: rgba(0,32,96,1);
    text-transform: uppercase;
    margin:0 0 10px;
    font-size:2.3rem;
}

.modAgenda.GRDC_List_Model13 .brand .logo-marque{
    margin: 0 20px 0 0;
    vertical-align:top;
    border: 1px solid #002060;
    padding:10px;
    text-align:center;
    font-size:0px;
    border-radius:10px;
    border-top-right-radius:0;
    line-height:80px;
    height:82px;
    width:82px;
}

.modAgenda.GRDC_List_Model13 .brand .eventListByBrand {
    width: 588px;
}

@media screen and (max-width: 812px) {
    .modAgenda.GRDC_List_Model13 .brand .logo-marque {
        display:none;
    }

    .modAgenda.GRDC_List_Model13 .brand .eventListByBrand{
        display:block;
        max-width:none;
    }
}

/* =============================================================================
   $Plugin : lightBox chocolat
   ========================================================================== */
.chocolat-zoomable.chocolat-zoomed {
    cursor: zoom-out;
}
.chocolat-open{overflow: hidden;}
.chocolat-overlay{ height:100%;  width:100%; position:fixed; left:0; top:0; z-index:10; background-color:#000; display: none; opacity: 0.8;}
.chocolat-wrapper{ height:100%; width:100%; position:fixed; display: none; left:0; top:0; z-index: 999; color: #fff;}
.chocolat-zoomable .chocolat-img{ cursor : zoom-in;}
.chocolat-loader{ height:32px; width:32px; position:absolute; left:50%; top:50% ; margin-left:-16px; margin-top:-16px; z-index:1000; background:url(/files/fr/images/loader.gif); display:none;}
.chocolat-content{ position:fixed; width:0px; height:0px;  left:50%; top:50%; z-index:997; text-align: left;}
.chocolat-content .chocolat-img{ position:absolute; width:100%; height:100%;}
.chocolat-image{cursor: zoom-in;}
.chocolat-wrapper .chocolat-left{ position:absolute; left:0;  width:50px; height:100px; top: 50%; margin-top: -50px; cursor:pointer; background:url(/files/fr/images/left.png) 50% 50% no-repeat; z-index: 997; display: none;}
.chocolat-wrapper .chocolat-right{ position:absolute; right:0; width:50px; height:100px; top: 50%; margin-top: -50px; cursor:pointer; background:url(/files/fr/images/right.png)  50% 50% no-repeat; z-index: 997; display: none;}
.chocolat-wrapper .chocolat-right.active{ display: block;}
.chocolat-wrapper .chocolat-left.active{display: block;}
.chocolat-wrapper .chocolat-top{position:absolute; top:0px; right: 0; left: 0;  line-height:50px; height:50px; overflow: hidden; z-index: 997; margin-bottom: 10px;}
.chocolat-wrapper .chocolat-close{ width:50px; height:50px; cursor:pointer; position: absolute; top: 0; right: 0; background:url(/files/fr/images/close.png) 50% 50% no-repeat;}
.chocolat-wrapper .chocolat-bottom{ position:absolute; bottom:0; left: 0;  right: 0; line-height:40px; height:40px; font-size:12px; z-index: 997; padding-left: 15px;  padding-right: 15px; background: rgba(0, 0, 0, 0.2); text-align: center; margin-top: 10px;}
.chocolat-wrapper .chocolat-set-title{display: inline-block;  padding-right: 15px; line-height: 1; border-right: 1px solid rgba(255, 255, 255, 0.3);}
.chocolat-wrapper .chocolat-pagination{ display: inline-block; vertical-align: middle; 15px;padding-right: 15px; margin: 0 10px;}
.chocolat-wrapper .chocolat-fullscreen{ width: 16px;  height: 40px; background: url(/files/fr/images/fullscreen.png) 50% 50% no-repeat; display: block; margin:auto 10px; cursor: pointer; display:inline-block; vertical-align: middle;}
.chocolat-wrapper .chocolat-description{ display: inline-block; vertical-align: middle; text-align: center}

/* no container mode*/
body.chocolat-open>.chocolat-overlay{z-index:994;}
body.chocolat-open > .chocolat-loader {z-index: 994;}
body.chocolat-open>.chocolat-content{z-index:997;}

/* container mode*/
.chocolat-in-container .chocolat-wrapper,
.chocolat-in-container .chocolat-content,
.chocolat-in-container .chocolat-overlay{position: absolute;}
.chocolat-in-container{ position: relative;}

/* =============================================================================
   plugin : lightSlider
   ========================================================================== */
/*! lightslider - v1.1.3 - 2015-04-14
* https://github.com/sachinchoolur/lightslider
* Copyright (c) 2015 Sachin N; Licensed MIT */
/** /!!! core css Should not edit !!!/**/ 

.lSSlideOuter {
    position: relative;
    overflow: hidden;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}
.lightSlider:before, .lightSlider:after {
    content: " ";
    display: table;
}
.lightSlider {
    overflow: hidden;
    margin: 0;
}
.lSSlideWrapper {
    max-width: 100%;
    overflow: hidden;
    position: relative;
}
.lSSlideWrapper > .lightSlider:after {
    clear: both;
}
.lSSlideWrapper .lSSlide {
    -webkit-transform: translate(0px, 0px);
    -ms-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
    -webkit-transition: all 1s;
    -webkit-transition-property: -webkit-transform,height;
    -moz-transition-property: -moz-transform,height;
    transition-property: transform,height;
    -webkit-transition-duration: inherit !important;
    transition-duration: inherit !important;
    -webkit-transition-timing-function: inherit !important;
    transition-timing-function: inherit !important;

}
/*
    @media screen and (min-width: 1000px) {
        .lSSlideWrapper .lSSlide {
            min-height: 240px;
        }
    }
*/
    .lSSlideWrapper .lslide a {
        display: block;
        text-decoration: none !important;
    }

    .ContentDetailComponent .lSSlideWrapper .lslide a {
        text-align: center;
    }
        .lSSlideWrapper .lslide a img.lazyload {
            max-height: 360px;
        }

        @media screen and (min-width: 1000px) {
            .lSSlideWrapper .lslide a img.lazyload {
                max-height: none;
            }
        }

        .lSSlideWrapper .lslide #pub-dfp-p6 {
            float: none;
            height: 250px;
            margin: 0 auto;
        }

.lSSlideWrapper .lSFade {
    position: relative;
}
.lSSlideWrapper .lSFade > * {
    position: absolute !important;
    top: 0;
    left: 0;
    z-index: 9;
    margin-right: 0;
    width: 100%;
}
.lSSlideWrapper.usingCss .lSFade > * {
    opacity: 0;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transition-duration: inherit !important;
    transition-duration: inherit !important;
    -webkit-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-timing-function: inherit !important;
    transition-timing-function: inherit !important;
}
.lSSlideWrapper .lSFade > *.active {
    z-index: 10;
}
.lSSlideWrapper.usingCss .lSFade > *.active {
    opacity: 1;
}
/** /!!! End of core css Should not edit !!!/**/

/* Pager */
.lSSlideOuter .lSPager.lSpg {
    margin: 0;
    padding: 0;
    text-align: right;
}
.lSSlideOuter .lSPager.lSpg > li {
    cursor: pointer;
    display: inline;
}
.lSSlideOuter .lSPager.lSpg > li a {
    display: inline-block;
    position: relative;
	height:8px;
    width: 8px;
	margin: 0 5px;
    overflow: hidden;
    background-color: #CCC;
	text-indent: 100%;
    white-space: nowrap;
	border-radius: 50%;
    z-index: 99;
    -webkit-transition: all 0.5s linear 0s;
    transition: all 0.5s linear 0s;
}

.lSSlideOuter .lSPager.lSpg > li:hover a, .lSSlideOuter .lSPager.lSpg > li.active a {
    background-color: rgba(0,32,96,1);
}
.lSSlideOuter .media {
    opacity: 0.8;
}
.lSSlideOuter .media.active {
    opacity: 1;
}
/* End of pager */

/** Gallery */
.lSSlideOuter .lSPager.lSGallery {
    list-style: none outside none;
    padding-left: 0;
    margin: 10px 0 0 0;
    overflow: hidden;
    transform: translate3d(0px, 0px, 0px);
    -moz-transform: translate3d(0px, 0px, 0px);
    -ms-transform: translate3d(0px, 0px, 0px);
    -webkit-transform: translate3d(0px, 0px, 0px);
    -o-transform: translate3d(0px, 0px, 0px);
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.lSSlideOuter .lSPager.lSGallery li {
    overflow: hidden;
    -webkit-transition: border-radius 0.12s linear 0s 0.35s linear 0s;
    transition: border-radius 0.12s linear 0s 0.35s linear 0s;
    min-width: 10px;
    margin-top: 0;
}
.lSSlideOuter .lSPager.lSGallery li.active, .lSSlideOuter .lSPager.lSGallery li:hover {
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,0.8);
}
.lSSlideOuter .lSPager.lSGallery img {
    display: block;
    height: auto;
    max-width: 100%;
    border-radius: 10px;
}
.lSSlideOuter .lSPager.lSGallery:before, .lSSlideOuter .lSPager.lSGallery:after {
    content: " ";
    display: table;
}
.lSSlideOuter .lSPager.lSGallery:after {
    clear: both;
}
/* End of Gallery*/

/* slider actions */
.lSAction{
    margin: 0 5px;
    text-align: center;
    -webkit-tap-highlight-color: transparent;
    position: absolute;
    top: 15px;
    right: 15px;
}

.lSAction > a {
    width: 32px;
    display: inline-block;
    height: 32px;
    background-repeat: no-repeat;
    cursor: pointer;
    z-index: 99;
    margin: 2px 5px;
    transition: opacity 0.35s linear 0s;
    border-radius: 50%;
    background-color: rgba(255,255,255,0.8);
    background-position: 50% 50%;
}
.lSAction > a:hover {
    opacity: 1;
}
.lSAction > .lSPrev {
    background-image: url('/files/fr/images/angle-left.png');
}
.lSAction > .lSNext {
    background-image: url('/files/fr/images/angle-right.png');
}
.lSAction > a.disabled {
    pointer-events: none;
}
.cS-hidden {
    height: 1px;
    opacity: 0;
    filter: alpha(opacity=0);
    overflow: hidden;
}


/* vertical */
.lSSlideOuter.vertical {
    position: relative;
}
.lSSlideOuter.vertical.noPager {
    padding-right: 0px !important;
}
.lSSlideOuter.vertical .lSGallery {
    position: absolute !important;
    right: 0;
    top: 0;
}
.lSSlideOuter.vertical .lightSlider > * {
    width: 100% !important;
    max-width: none !important;
}

/* vertical controlls */
.lSSlideOuter.vertical .lSAction > a {
    left: 50%;
    margin-left: -14px;
    margin-top: 0;
}
.lSSlideOuter.vertical .lSAction > .lSNext {
    background-position: 31px -31px;
    bottom: 10px;
    top: auto;
}
.lSSlideOuter.vertical .lSAction > .lSPrev {
    background-position: 0 -31px;
    bottom: auto;
    top: 10px;
}
/* vertical */


/* Rtl */
.lSSlideOuter.lSrtl {
    direction: rtl;
}
.lSSlideOuter .lightSlider, .lSSlideOuter .lSPager {
    padding-left: 0;
    list-style: none outside none;
}
.lSSlideOuter.lSrtl .lightSlider, .lSSlideOuter.lSrtl .lSPager {
    padding-right: 0;
}
.lSSlideOuter .lightSlider > *,  .lSSlideOuter .lSGallery li {
    float: left;
}
.lSSlideOuter.lSrtl .lightSlider > *,  .lSSlideOuter.lSrtl .lSGallery li {
    float: right !important;
}
/* Rtl */

@-webkit-keyframes rightEnd {
    0% {
        left: 0;
    }

    50% {
        left: -15px;
    }

    100% {
        left: 0;
    }
}
@keyframes rightEnd {
    0% {
        left: 0;
    }

    50% {
        left: -15px;
    }

    100% {
        left: 0;
    }
}
@-webkit-keyframes topEnd {
    0% {
        top: 0;
    }

    50% {
        top: -15px;
    }

    100% {
        top: 0;
    }
}
@keyframes topEnd {
    0% {
        top: 0;
    }

    50% {
        top: -15px;
    }

    100% {
        top: 0;
    }
}
@-webkit-keyframes leftEnd {
    0% {
        left: 0;
    }

    50% {
        left: 15px;
    }

    100% {
        left: 0;
    }
}
@keyframes leftEnd {
    0% {
        left: 0;
    }

    50% {
        left: 15px;
    }

    100% {
        left: 0;
    }
}
@-webkit-keyframes bottomEnd {
    0% {
        bottom: 0;
    }

    50% {
        bottom: -15px;
    }

    100% {
        bottom: 0;
    }
}
@keyframes bottomEnd {
    0% {
        bottom: 0;
    }

    50% {
        bottom: -15px;
    }

    100% {
        bottom: 0;
    }
}
.lSSlideOuter .rightEnd {
    -webkit-animation: rightEnd 0.3s;
    animation: rightEnd 0.3s;
    position: relative;
}
.lSSlideOuter .leftEnd {
    -webkit-animation: leftEnd 0.3s;
    animation: leftEnd 0.3s;
    position: relative;
}
.lSSlideOuter.vertical .rightEnd {
    -webkit-animation: topEnd 0.3s;
    animation: topEnd 0.3s;
    position: relative;
}
.lSSlideOuter.vertical .leftEnd {
    -webkit-animation: bottomEnd 0.3s;
    animation: bottomEnd 0.3s;
    position: relative;
}
.lSSlideOuter.lSrtl .rightEnd {
    -webkit-animation: leftEnd 0.3s;
    animation: leftEnd 0.3s;
    position: relative;
}
.lSSlideOuter.lSrtl .leftEnd {
    -webkit-animation: rightEnd 0.3s;
    animation: rightEnd 0.3s;
    position: relative;
}
/*/  GRab cursor */
.lightSlider.lsGrab > * {
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: -o-grab;
  cursor: -ms-grab;
  cursor: grab;
}
.lightSlider.lsGrabbing > * {
  cursor: move;
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: -o-grabbing;
  cursor: -ms-grabbing;
  cursor: grabbing;
}


.lightSlider.dCarousel figure img {
    max-width: 100%;
    width: 100%
}

.lightSliderLongFormat {
    height: 480px !important;
}


/* =============================================================================
   CSS Print
   ========================================================================== */

@media print{
    body{overflow: visible; background-color: #fff; font-size: 0.8cm; line-height: 1.1; margin-top: 1.1cm; margin-right: 1.1cm; margin-bottom: 1.1cm; margin-left: 1.1cm; text-align: left !important; font-family: 'Roboto', 'Arial', sans-serif;}

    .noprint, .noprint * {display: none !important;}
    *,
    *::before,
    *::after,
    *:first-letter,
    p:first-line,
    div:first-line,
    blockquote:first-line,
    li:first-line {background: transparent !important; color: #212121 !important;  box-shadow: none !important; text-shadow: none !important; text-align: left !important;}
    /*a::after {content: "("attr(href)")"; font-size: 0.4cm; color: #999;}*/
    iframe{display: none;}
    h1{font-size: 0.7cm;}
    h2{font-size: 0.6cm; margin: 0 0 0.5cm 0;}
    h4{font-size: 0.4cm; margin: 0 0 0.5cm 0;}
    figcaption, .caption{text-align: center; font-size: 0.3cm; margin: 0 0 0.2cm 0;}
    p {orphans: 3; widows: 3; font-size: 0.4cm; margin: 0.2cm 0 0.2cm 0;}
    .bottomContent{margin: 0.3cm 0 0 0; color: #999; font-size: 0.3cm;}

    .detail{width: 100% !important; padding: 0 !important;  margin: 0 auto !important;}
    .detail h1{font-size: 0.9cm; }
    .detail h1 span{display: block; color: #696969; font-size: 0.6cm;}
    .galerieContent {overflow: hidden;}

    .question, .rel{font-weight: bold;}
    .rel{font-style: italic;}
    .insetComponent{border: 1px solid #555;}
    .textComponent figure{width: 40%;}
    .textComponent figure img{width: 100%;}
    .textComponent figure.left{float: left; margin: 0 20px 10px 0;}
    .textComponent figure.right{float: right; margin: 0 0 10px 20px;}
    .pdfComponent, .videoComponent{display: none;}
    .titreresultat{font-weight: bold; font-size: 0.4cm;}
    .pararesultat{font-size: 0.4cm; padding: 0.2cm; border: 1px solid #888;}
    .citation{border-left: 3px solid #888; padding: 0 0 0 0.5cm;}
    .mainImage{text-align: center}
    .mainImage img{max-width: 50%;}
    .tab-sticky{display: none}

    .displayOnSmartphone{display: none !important;}
}