/*
 * Style by Datagif
 * 
 */

/* @group RESETS */

/* Eric Meyer reset.css v2.0 20110126 -- & -- normalize.css v3.0.2 --- resets group v1.3 */

@font-face {
    font-family: 'europa';
    src: url('fonts/europa-bold-webfont.woff2') format('woff2'),
    url('fonts/europa-bold-webfont.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}



@font-face {
    font-family: 'freight-text-pro';
    src: url('fonts/freight-text-pro-demibold-59185dd111a00-webfont.woff2') format('woff2'),
    url('fonts/freight-text-pro-demibold-59185dd111a00-webfont.woff') format('woff');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'freight-text-pro';
    src: url('fonts/freight-text-pro-book-59185d4be2f1e-webfont.woff2') format('woff2'),
    url('fonts/freight-text-pro-book-59185d4be2f1e-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'europa';
    src: url('fonts/europa-regular-webfont.woff2') format('woff2'),
    url('fonts/europa-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'franklin-gothic-urw';
    src: url('fonts/franklin-gothic-urw-demi.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}


@font-face {
    font-family: 'franklin-gothic-urw';
    src: url('fonts/FranklinGothicBookRegular.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'mostra-nuova';
    src: url('fonts/mostra-nuova-regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'mostra-nuova';
    src: url('fonts/mostra-nuova-bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;

}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}
strong, b {font-weight: bold; font-family: Europa }
i { font-style: italic }
*, *:before, *:after {box-sizing: border-box;}

html {font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {display: block;}
audio, canvas, progress, video {display: inline-block;}
audio:not([controls]) {display: none; height: 0;}

[hidden], template {display: none;}

a {background-color: transparent;}
a:active, a:hover {outline: 0;}

abbr[title] {text-decoration: underline dotted;}
strong {font-weight: bold;}
em, dfn {font-style: italic;}
mark {background: #ff0; color: #333C45;}
small {font-size: 80%;}
sub, sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

img {border: 0;}
svg:not(:root) {overflow: hidden;}
svg{pointer-events: none;}
ol, ul {list-style: none;}

hr {height: 0;}
pre {overflow: auto;}
code, kbd, pre, samp {font-family: monospace, monospace; font-size: 1em;}

button, input, optgroup, select, textarea {color: inherit; font: inherit; margin: 0;}
button {overflow: visible;}
button, select {text-transform: none;}
button, html input[type="button"], input[type="reset"], input[type="submit"] {-webkit-appearance: button; cursor: pointer;}
button[disabled], html input[disabled] {cursor: default;}
button::-moz-focus-inner, input::-moz-focus-inner {border: 0; padding: 0;}
input {line-height: normal;}
input[type="checkbox"], input[type="radio"] {padding: 0;}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {height: auto;}
input[type="search"] {-webkit-appearance: textfield;}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
textarea {overflow: auto;}
optgroup {font-weight: bold;}

.list-article .illustrated-container figure {width: 140px;height: 80px;float: right;background-repeat: no-repeat;background-position: center;background-size: cover;position: relative}
.illustrated-container figure.no-image { background-image: url('../images/placeholder-black.jpg')!important; background-size: auto !important }

table {border-collapse: collapse; border-spacing: 0;}
td, th {padding: 0;}

.notice-msg { background: red; color: white; padding: 10px; margin: 10px 0 }

/* Personal & h5bp defaults */

a[href], a[role="button"] {cursor: pointer;}

a[role="button"] {
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	      /*user-select: none;*/ /* not supported yet */
}

img {display: block;}
:focus {outline: 0 none;}
textarea {resize: vertical;}
audio, canvas, img, svg, progress, video {vertical-align: middle;}

:lang(fr) {quotes: "\00ab\00a0" "\00a0\bb" "\201c" "\201d";} /* « … “…” … » */
:lang(en) {quotes: "\201c" "\201d" "\2018" "\2019";} /* “ … ‘…’ … ” */
q::before, blockquote > p::before {content: open-quote;}
q::after, blockquote > p::after {content: close-quote;}

.subscribers-hide{display: none !important}

/* @end RESETS */

/* group ANIMATIONS */

@-webkit-keyframes underlineLink {
  0%   {
    transform: scaleX(0);
    transform-origin: left top;
  }
  40%   {
    transform: scaleX(1);
    transform-origin: left top;
  }
  60%   {
    transform: scaleX(1);
    transform-origin: right top;
  }
  100%   {
    transform: scaleX(0);
    transform-origin: right top;
  }

}
@-moz-keyframes underlineLink {
  0%   {
    transform: scaleX(0);
    transform-origin: left top;
  }
  40%   {
    transform: scaleX(1);
    transform-origin: left top;
  }
  60%   {
    transform: scaleX(1);
    transform-origin: right top;
  }
  100%   {
    transform: scaleX(0);
    transform-origin: right top;
  }

}
@-o-keyframes underlineLink {
  0%   {
    transform: scaleX(0);
    transform-origin: left top;
  }
  40%   {
    transform: scaleX(1);
    transform-origin: left top;
  }
  60%   {
    transform: scaleX(1);
    transform-origin: right top;
  }
  100%   {
    transform: scaleX(0);
    transform-origin: right top;
  }

}
@keyframes underlineLink {
  0%   {
    transform: scaleX(0);
    transform-origin: left top;
  }
  40%   {
    transform: scaleX(1);
    transform-origin: left top;
  }
  60%   {
    transform: scaleX(1);
    transform-origin: right top;
  }
  100%   {
    transform: scaleX(0);
    transform-origin: right top;
  }
}

/* end ANIMATIONS */

/* @group BASE */

html {
	height: 100%;
	color: #333;
	font: 1em/1.4 Helvetica, sans-serif;
}

/*html {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}*/

body {
	min-height: 100%;
    background-color: #F8F8F8;
    font-family:"europa";
    font-weight: 400;
    color: #333C45;
}

/* header mobile */
@media (max-width: 769px) {
    body {
        padding-top: 50px;
    }
}

/*
::-moz-selection {background-color: #b3d4fc; text-shadow: none}
     ::selection {background-color: #b3d4fc; text-shadow: none}
*/

a {
	color: inherit;
}

a:hover {
	
}

a:active, a:hover {outline: 0 none;}

/*
a {
	transition: color 100ms, background-color 100ms;
}

a:hover {
	transition: color 0ms, background-color 0ms;
}

a svg {transition: fill 100ms ease;}
a:hover svg {transition: fill 50ms ease;}
*/

/* Helpers / utils */

.hidden,
.template {
	display: none !important;
	visibility: hidden;
}

.clearfix::before, .clearfix::after {
	content: " ";
	display: block; /* `table` instead of `block` to contain the top-margins of child elements */
}
.clearfix::after {clear: both;}

.link:not(.slug):not(.line-after) {
    text-decoration: underline;
}

/* @end BASE */
body.bodyLock{overflow-y: hidden}
/* @group LAYOUTS */
/* newsletter english */
.english_newsletter_component{display: block;width: 100%;margin: 20px auto;text-align: center;padding: 40px 40px 10px 40px;position: relative;background-color: #f5f5f5}
.english_newsletter_component.square{background-position: 420px -78px}
.english_newsletter_component img.logo{position: absolute;left:20px;top:20px;padding:5px}
.english_newsletter_component .info{display: block;width: 55%;margin:auto;font-size: 0;box-sizing: border-box;vertical-align: top}
.english_newsletter_component.square .info{width: 90%}
.english_newsletter_component .info h2{font-size: 13px;color:black;line-height: 25px}
.english_newsletter_component .info h3{font-size: 18px;color:black;font-weight: bold;padding: 20px 0 10px 0}
.english_newsletter_component .info input[type="email"]{background-color: white;height:38px;display: inline-block;width: calc(100% - 150px);color:black;border:solid 1px #707070;border-radius: 5px;padding:0 10px;font-size: 14px}
.english_newsletter_component .info input[type="email"].required{border:solid 1px red}
.english_newsletter_component .info input[type="submit"]{background-color: black;color:white;display: inline-block;width: 150px;border:none;font-size:14px;height:39px;position: relative;top:0;right:6px;border-top-left-radius: 0;border-bottom-left-radius: 0;border-top-right-radius: 5px;border-bottom-right-radius: 5px}
.english_newsletter_component .info h4.newsletterMessage{color:red;display: block;width:100%;padding:10px 0;font-size: 16px}
.english_newsletter_component .info a{display: inline-block;font-size: 13px;font-weight: bold;margin:10px 0;color:#002868!important;padding:0 5px 0 0}
.english_newsletter_component .info a:last-child{color:#BF0A30!important;border-left:solid 1px black;padding:0 0 0 5px}
.english_newsletter_component .info span{color:red;display: block;width:100%;padding:10px 0;font-size: 11px}
.newsletter_english_preview table th, td{border:none!important}
.newsletter_english_preview table{margin:auto!important}
.english_newsletter_component.mobile{display: none}
/* newsletter english */

/* newsletter english landing page*/
.maincontainer.newsletter_english_landing_page{width: 100%;margin:auto;display: block}
.container.newsletter_english_landing_page{display: block;width:100%;font-size: 0;box-sizing: border-box;margin:0;padding:0}
.container.newsletter_english_landing_page .header-wrapper{display: block;width: 100%;margin: auto;background-color: #231F20;height: 194px;text-align: center}
.container.newsletter_english_landing_page .header-wrapper h2{font-size:35px;color:white;position: relative;top:45px}
.container.newsletter_english_landing_page .body-wrapper{display: block;margin: auto;position: relative;width: 960px;border: solid 1px white;height: auto;border-radius: 12px;box-shadow: 0 0 2px 2px rgba(0,0,0,0.05);padding: 20px 2%;box-sizing: border-box;font-size: 0;vertical-align: top;bottom: 65px;background-color: white;max-width: 800px}
.container.newsletter_english_landing_page .body-wrapper p{color:black;font-size: 17px;display: block;line-height: 25px}
.container.newsletter_english_landing_page .body-wrapper span{color:black;font-size: 30px;display: block;margin:20px auto;text-decoration: underline}
.container.newsletter_english_landing_page .body-wrapper a{color: black;font-size: 25px;display: inline-block;margin: 20px auto;width: 180px;vertical-align: top;position: relative;top: 35px}
.container.newsletter_english_landing_page .body-wrapper .newsletter{display: inline-block;width:calc(100% - 180px);vertical-align: top;margin:40px auto}
.container.newsletter_english_landing_page .body-wrapper .newsletter input[type="email"]{background-color: white;height:38px;display: inline-block;width: calc(100% - 140px);color:black;border:solid 1px #707070;border-radius: 5px;padding:0 10px}
.container.newsletter_english_landing_page .body-wrapper .newsletter input[type="email"].required{border:solid 1px red}
.container.newsletter_english_landing_page .body-wrapper .newsletter input[type="submit"]{background-color: black;color:white;display: inline-block;width: 100px;font-size:14px;height:40px;position: relative;top:1px;right:6px;border:none;border-radius: 5px}
.container.newsletter_english_landing_page .body-wrapper .newsletter h4.newsletterMessage{color:red;display: block;width:100%;padding:10px 0;font-size: 11px}
/* newsletter english landing page*/

/* newsletter overlay*/
.newsletter-overlay{position: fixed;top: 0;bottom: 0;left: 0;right: 0;background-color: rgba(0,0,0,.5);display: none;z-index: 999}
.newsletter-overlay .content{width: 600px;margin: auto;position: relative;height: 100%}
.newsletter-overlay .content .container{overflow-y: scroll;overflow-x: hidden;position: absolute;font-size: 14px;top: 70px;left: 0;right: 0;background-color: #fff;height:85%}
.newsletter-overlay .content .container a.close{font-size: 20px;right: 30px;position: absolute;top: 5px;color:white;text-shadow: 0 0 4px black}
.newsletter-overlay .content .container a.close span{position:fixed}
/* newsletter overlay*/

.static_leaderboard_container {clear: both; display: block; margin: 10px auto; height: 100px; text-align: center}
.static_leaderboard_container img {object-fit: contain; width: 100%; height: 100%;}
.static_leaderboard_container img.mobile {display: none;}

/*Article Components*/

table[class="chiffre-component"]{width:600px;border-top:1px solid #E5E5DD;border-bottom:1px solid #E5E5DD;table-layout:auto!important;font-family:Europa,Helvetica, Arial, sans-serif}
.chiffre-component{width:600px;border-top:1px solid #E5E5DD;border-bottom:1px solid #E5E5DD;table-layout:auto!important;font-family:Europa,Helvetica, Arial, sans-serif}
table[class="chiffre-component"] td{text-align:left;}
.chiffre-component td{text-align:left;}
table[class="chiffre-component"] td[class="number"]{font-size:80px;font-family:"mostra-nuova",Helvetica,Arial,sans-serif;font-weight:bold;}
.chiffre-component .number{font-size:80px;font-family:"mostra-nuova",Helvetica,Arial,sans-serif;font-weight:bold;}
table[class="chiffre-component"] td[class="number"] span{font-size:18px;font-weight:normal;}
.chiffre-component .number span{font-size:18px;font-weight:normal;}
table[class="chiffre-component"] td[class="description"]{font-size:20px;}
.chiffre-component .description{font-size:20px;}


table[class="explanatory-text-component"]{width:600px;border:1px solid #E5E5DD;table-layout:auto!important;font-family:Europa,Helvetica, Arial, sans-serif}
.explanatory-text-component{width: 600px;border:1px solid #E5E5DD;table-layout:auto!important;font-family:Europa,Helvetica, Arial, sans-serif}
table[class="explanatory-text-component"] td{text-align:left;}
.explanatory-text-component td{text-align:left;}
table[class="explanatory-text-component"] td[class="title"]{color:#D61C3B;text-transform:uppercase;font-size:19px;font-weight:bold;}
.explanatory-text-component .title{color:#D61C3B;text-transform:uppercase;font-size:19px;font-weight:bold;}
table[class="explanatory-text-component"] td[class="description"]{font-size:17px;}
.explanatory-text-component .description{font-size:17px;}


table[class="chronologie-component"]{width:600px;border-top:1px solid #E5E5DD;border-bottom:1px solid #E5E5DD;table-layout:auto!important;font-family:Europa,Helvetica, Arial, sans-serif}
.chronologie-component{width: 600px;border-top:1px solid #E5E5DD;border-bottom:1px solid #E5E5DD;table-layout:auto!important;font-family:Europa,Helvetica, Arial, sans-serif}
table[class="chronologie-component"] td{text-align:left;}
.chronologie-component td{text-align:left;}
table[class="chronologie-component"] td[class="title"]{font-size:13px;font-weight:bold;color:#D61C3B;text-transform:uppercase;}
.chronologie-component .title{font-size:13px;font-weight:bold;color:#D61C3B;text-transform:uppercase;}
table[class="chronologie-component"] td[class="date-entry"]{font-size:18px;}
.chronologie-component .date-entry{font-size:18px;}
table[class="chronologie-component"] td[class="date-entry"] .date{background-color:#333C45;color:#FFFFFF;font-size: 20px;font-weight:bold;}
.chronologie-component .date-entry .date{background-color:#333C45;color:#FFFFFF;font-size: 20px;font-weight:bold;}


table[class="quote-component"]{width:600px;border-top:1px solid #E5E5DD;border-bottom:1px solid #E5E5DD;table-layout:auto!important;font-family:Europa,Helvetica, Arial, sans-serif}
.quote-component{width: 600px;border-top:1px solid #E5E5DD;border-bottom:1px solid #E5E5DD;table-layout:auto!important;font-family:Europa,Helvetica, Arial, sans-serif}
table[class="quote-component"] td{text-align:left;}
.quote-component td{text-align:left;}
table[class="quote-component"] td[class="quote"]{font-size:28px;font-weight:bold;line-height:30px;}
.quote-component .quote{font-size:28px;font-weight:bold;line-height:30px;}
table[class="quote-component"] td[class="name"]{color:#D61C3B;font-weight:bold;font-size:14px;text-transform:uppercase;}
.quote-component .name{color:#D61C3B;font-weight:bold;font-size:14px;text-transform:uppercase;}
table[class="quote-component"] td[class="description"]{color:#939EA8;font-weight:bold;font-size:14px;text-transform:uppercase;}
.quote-component .description{color:#939EA8;font-weight:bold;font-size:14px;text-transform:uppercase;}


table[class="person-info-component"]{width:600px;border-top:1px solid #E5E5DD;border-bottom:1px solid #E5E5DD;table-layout:auto!important;font-family:Europa,Helvetica, Arial, sans-serif}
.person-info-component{width: 600px;border-top:1px solid #E5E5DD;border-bottom:1px solid #E5E5DD;table-layout:auto!important;font-family:Europa,Helvetica, Arial, sans-serif}
table[class="person-info-component"] td{text-align:left;vertical-align:middle}
.person-info-component td{text-align:left;vertical-align:middle}
table[class="person-info-component"] td[class="person-image"] img{width:60px;height:60px;border-radius:50%;border:none}
.person-info-component .person-image img{width:60px;height:60px;border-radius:50%;border:none}
table[class="person-info-component"] td[class="name"]{color:#D61C3B;font-weight:bold;font-size:14px;text-transform:uppercase;}
.person-info-component .name{color:#D61C3B;font-weight:bold;font-size:14px;text-transform:uppercase;}
table[class="person-info-component"] td[class="description"]{color:#939EA8;font-weight:bold;font-size:14px;text-transform:uppercase;}
.person-info-component .description{color:#939EA8;font-weight:bold;font-size:14px;text-transform:uppercase;}
table[class="person-info-component"] td[class="quote"]{font-size:28px;font-weight:bold;line-height:30px;}
.person-info-component .quote{font-size:28px;font-weight:bold;line-height:30px;}
table[class="person-info-component"] td[class="date-entry"]{font-size:18px;}
.person-info-component .date-entry{font-size:18px;}
table[class="person-info-component"] td[class="date-entry"] .date{background-color:#333C45;color:#FFFFFF;font-size: 20px;font-weight:bold;}
.person-info-component .date-entry .date{background-color:#333C45;color:#FFFFFF;font-size: 20px;font-weight:bold;}

table[class="chiffre-component"], table[class="explanatory-text-component"], table[class="chronologie-component"], table[class="quote-component"], table[class="person-info-component"]{font-size:0}
table[class="chiffre-component"] p, table[class="explanatory-text-component"] p, table[class="chronologie-component"] p, table[class="quote-component"] p, table[class="person-info-component"] p{margin:0!important}

/*End Article Components*/


	/* Global wrapers */

.width-wrap {
	width: 100%;
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
}

.width-wrap.reader {text-align: center}
.width-wrap.reader a {display: inline-block;margin: 0 0 15px 0;}
.width-wrap.reader img {width: 50%;display: inline-block;}

.article-body .article-content img.inlineImage {display:block}

@media (max-width: 769px) {

	.main-container.width-wrap {
        padding-left: 0;
        padding-right: 0;
    }
}

	/* Centering */

.v-centerer {
	font-size: 0rem;
	white-space: nowrap;
}

	.v-centerer::before {
		content: "";
		display: inline-block;
		height: 100%;
		vertical-align: middle;
		/*width: 0.1em;
		margin-right: -0.4em;*/
	}
	
	.v-centered {
		display: inline-block;
		vertical-align: middle;
		font-size: 1rem;
		white-space: normal;
	}

.abs-centered {
	position: absolute;
	top: 50%;
	left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

/* @end LAYOUTS */

/* @group TEXTS & COLORS */

	/* Color classes */

.white-bg {background-color: #fff;}
.dark-bg {background-color: #222;}
.light-grey-bg {background-color: #f7f7f7;}

/* @end TEXTS & COLORS */


/* @end CSS3 PREFIXES EXAMPLES */

/* @group ELEMENT */



@media (max-width: 500px) {
	
}

/* @end ELEMENT */

/*@group LAYOUTSIZE*/

.no-scroll {
    overflow-y: hidden;
}

.main-container.search-result {
    padding-top:20px;
}

.main-container.author {
    padding-top: 40px;
}

.main-container.filter { 
    padding-top: 40px;
}

.bottom-sep {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #E5E5DD;
}

/*@end LAYOUTSIZE*/

/* @group HEADER */

.site-header {
    position: relative;
    z-index: 20;
    background-color: #333C45;
    width: 100%;
    color: #fff;
    display: flex;
    align-items: stretch;
    flex-direction: row;
    justify-content: space-between;
    transition: all 0.2s ease-in;
}

.site-header.ninety-anniversary {background-color: #FFFFFF; color: #000000}
.site-header.ninety-anniversary .logo-container {background-color: white; max-width: 240px}
.site-header.ninety-anniversary .left-col .month-edition {border: 2px solid #333c45; color: #333c45}
.site-header.ninety-anniversary .left-col .month-edition:hover {background-color: #333c45; color: white}
.site-header.ninety-anniversary .right-col .subs-btn {display: none}
/*.header-sticky.site-header.ninety-anniversary .right-col .subs-btn {display: inline-block}*/
.classic-sticky.site-header.ninety-anniversary .subs-btn {font-family: "franklin-gothic-urw"; display: inline-block; background-color: #E9B441; text-decoration: none; -webkit-border-radius: 3px; -moz-border-radius: 3px;
    border-radius: 3px; padding: 7px 15px; font-size: 0.77em; text-transform: uppercase; margin-right: 10px; align-self: center; transition: background-color 0.2s ease-in, color 0.2s ease-in;}
.classic-sticky.site-header.ninety-anniversary .my-account {padding: 22px 0 0 0}
.site-header.ninety-anniversary .right-col .search-btn {border: 2px solid #000000; position: relative}
.site-header.ninety-anniversary .right-col .search-btn img {position: absolute; top: calc(50% - 7px)}
.site-header.ninety-anniversary .right-col .account-btn {border: 2px solid #000000}
.site-header.ninety-anniversary .right-col .orient-btn:hover {background-color: white}
.site-header.ninety-anniversary .right-col .account-btn:hover {background-color: white}
.site-header.ninety-anniversary .right-col .search-btn:hover {background-color: white}
.site-header.ninety-anniversary .orient-btn {border-left: 1px solid black; color: black}
.site-header.ninety-anniversary .my-account {padding: 18px 0 0 0}
.site-header.ninety-anniversary .my-account a {position: relative}
.site-header.ninety-anniversary .my-account a img {position: absolute; top: calc(50% - 7px)}
.category-site-nav.ninety-anniversary {background-color: black}
.category-site-nav.ninety-anniversary .nav-container {text-align: center}
.category-site-nav.ninety-anniversary .nav-container .nav-item {text-transform: uppercase; padding: 0.3em 20px}
.category-site-nav .nav-container a.subs-btn {font-family: "franklin-gothic-urw"; display: inline-block; background-color: #E9B441; text-decoration: none; -webkit-border-radius: 3px; -moz-border-radius: 3px;
    border-radius: 3px; padding: 7px 15px; font-size: 0.77em; text-transform: uppercase; margin-right: 10px; align-self: center; transition: background-color 0.2s ease-in, color 0.2s ease-in;}
.show-when-hidden a.subs-btn, a.subs-btn.show-when-hidden {display: inline-block!important;}
.site-header.header-sticky.ninety-anniversary {background-color: white}
.site-header.header-sticky.ninety-anniversary .left-col .logo-container{background-color: white}
.site-header.header-sticky.ninety-anniversary .article-title {color: black}
.site-header.header-sticky.ninety-anniversary .social-box .social-box-networks {background-color: white}
.site-header.header-sticky.ninety-anniversary .social-box .social-link {border: 2px solid #333C45}
.site-header.header-sticky.ninety-anniversary .social-box .social-link:hover {background-color: #fff; color: #333C45}

.site-header.classic-sticky {
    position: fixed;
    top: 0;
}

    .logo-container {
        padding: 10px;
        background-color: #DB1429;
        max-width: 206px;
        justify-self: flex-start;
        height: 100%;
        transition: max-width 0.1s ease-in;
    }

        .logo-container img {
            width: 100%;
            height:auto ;
        }

    .link-container {
        padding-left: 15px;
        padding-right: 20px;
        padding-top: 15px;
        padding-bottom: 15px;
        color: #ffffff;
    }

    .left-col {
        display: flex;
        align-items: center;
    }

    .left-col .month-edition {
        font-family:"franklin-gothic-urw";
        font-weight: 500;
        display: inline-block;
        text-decoration: none;
        border: 2px solid #FFFFFF;
        -webkit-border-radius:3px;
        -moz-border-radius:3px;
        border-radius:3px;
        padding: 9px 15px;
        margin-left: 20px;
        font-size:0.77em;
        text-transform: uppercase;
        transition: background-color 0.2s ease-in, color 0.2s ease-in;
    }

    .classic-sticky .left-col .month-edition {
        padding:4px 10px;
        font-size:0.77em;
    }

    .month-edition:hover {
        background-color: #fff;
        color: #333C45;
    }

    .right-col {
        display: flex;
    }

        .right-col .subs-btn {
            font-family:"franklin-gothic-urw";
            font-weight: 500;
            display: inline-block;
            background-color: #E9B441;
            text-decoration: none;
            -webkit-border-radius:3px;
            -moz-border-radius:3px;
            border-radius:3px;
            padding: 10px 15px;
            font-size:0.77em;
            text-transform: uppercase;
            float: right;
            margin-right: 10px;
            align-self: center;
            transition: background-color 0.2s ease-in, color 0.2s ease-in;
        }


        .classic-sticky .right-col .subs-btn {
            padding: 6px 10px;
        }

        .right-col .subs-btn:hover {
            background-color: #cb9d29;
            color: #fff;
        }

        .right-col .search-btn {
            display: inline-block;
            text-decoration: none;
            border: 2px solid #fff;
            -webkit-border-radius:50%;
            -moz-border-radius:50%;
            border-radius:50%;
            padding: 7px 12px;
            float: right;
            width: 42px;
            height: 42px;
            margin-right: 10px;
            align-self: center;
            transition: background-color 0.2s ease-in;
        }

        .classic-sticky .right-col .search-btn {
            width: 28px;
            height:28px;
            padding: 0 6px;
        }

        .right-col .search-btn:hover {
            background-color: #49525b;
        }

        .right-col .account-btn {
            display: inline-block;
            text-decoration: none;
            border: 2px solid #fff;
            -webkit-border-radius:50%;
            -moz-border-radius:50%;
            border-radius:50%;
            padding: 10px 12px;
            float: right;
            width: 42px;
            height: 42px;
            font-size:0.7em;
            font-weight: 600;
            text-transform: uppercase;
            align-self: center;
            margin-right: 10px;
            transition: background-color 0.2s ease-in;
        }

        .classic-sticky .right-col .account-btn {
            width: 28px;
            height: 28px;
            padding: 2px 5px;
        }

        .right-col .account-btn:hover {
            background-color: #49525b;
        }

        .right-col .normal-btn {
            display: inline-block;
            text-decoration: none;
            border: 2px solid #fff;
            -webkit-border-radius:50%;
            -moz-border-radius:50%;
            border-radius:50%;
            padding: 10px 12px;
            float: right;
            width: 42px;
            height: 42px;
            font-size:0.7em;
            font-weight: 600;
            text-transform: uppercase;
            align-self: center;
            margin-right: 10px;
            transition: background-color 0.2s ease-in;
        }



        .right-col .normal-btn:hover {
            background-color: #49525b;
        }

        .classic-sticky .normal-btn .account-btn {
            width: 28px;
            height: 28px;
            padding: 2px 5px;
        }

    .orient-btn {
        display: flex;
        min-width: 140px;
        border-left: 1px solid #515960;
        font-size: 0.85em;
        text-decoration: none;
        align-items: center;
        justify-content: center;
        transition: background-color 0.2s ease-in;
        text-transform: uppercase;
    }

    .classic-sticky .orient-btn {
        display: none;

    }

    .right-col .orient-btn:hover {
        background-color: #49525b;
    }


    .lang-btn {
        position: relative;
        border-left: 1px solid #515960;
        display: flex;
        font-size: 0.85em;
        text-decoration: none;
        align-items: center;
        justify-content: center;
        min-width: 70px;
        transition: background-color 0.2s ease-in;
    }


    .site-header .lang-btn span {
        display: none;
        border-top: 1px solid #515960;
        position: absolute;
        bottom:-71px;
        left: 0;
        font-size: 0.85em;
        padding: 27px;
        color: #ffff;
        background-color: #333c45;
    }


    .site-header .lang-btn span.open {
        display: block;
    }


    .site-header .lang-btn span:hover {
        background-color: #49525b;
    }

    .classic-sticky .lang-btn {
        display: none;

    }

    .right-col .lang-btn:hover {
        background-color: #49525b;
    }


.category-site-nav {
    position: relative;
    z-index: 10;
    background-color: #333c45;
    border-top: 1px solid #515960;
    transition: all 0.2s ease-in;
}

    .category-site-nav .nav-container {
    }

    .nav-container li {
        display: inline-block;
    }


.nav-container li.in-english{float: right; margin: 0 25px 0 0}
.nav-container li.in-english a{text-decoration: underline}
.nav-container li.in-english a:hover{-webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none}

    .nav-container .nav-item {
        font-family:"franklin-gothic-urw";
        font-weight: 400;
        color: #fff;
        display: block;
        font-size: 0.85em;
        line-height: 1.8;
        padding: 0.3em 15px;
        text-decoration: none;
        transition: box-shadow 0.2s ease-in;
    }

    .nav-container .nav-item.active {
        -webkit-box-shadow: inset 0px -3px 0px 0px rgba(224,19,42,1);
        -moz-box-shadow: inset 0px -3px 0px 0px rgba(224,19,42,1);
        box-shadow: inset 0px -3px 0px 0px rgba(224,19,42,1);
    }

    .nav-container .nav-item:hover {
        -webkit-box-shadow: inset 0px -3px 0px 0px rgba(224,19,42,1);
        -moz-box-shadow: inset 0px -3px 0px 0px rgba(224,19,42,1);
        box-shadow: inset 0px -3px 0px 0px rgba(224,19,42,1);
    }


.header-indicator {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    position: relative;
    z-index: 99;
    background-color: #f5f5f5;
}

    .header-indicator a {
        display: block;
        padding: 10px 0 5px;
        text-decoration: none;
        transition: background-color 0.2s ease-in;
    }

    .header-indicator .indicator-item {
        vertical-align: middle;
        padding-left: 30px;
        padding-right: 50px;
        text-decoration: none;
        border-right: 1px solid #CCCCCC;
    }

        .header-indicator .indicator-item img {
            display: inline-block;
            margin-right: 5px;
        }

    .header-indicator a:last-child {
        background-color: #E0E0E0;
    }

    .header-indicator a:last-child:hover {
        background-color: #fff;
    }

    .header-indicator a:last-child .indicator-item {
        padding-right:15px;
        border-right:none;
        padding-top:6px;
        padding-left: 20px;
        text-transform: uppercase;
        font-size: 0.75em;
        line-height:1;
    }

    .header-indicator a:nth-last-child(2) .indicator-item {
        border-right:none;
    }

        .header-indicator .indicator-item .indicator-number {
            display: inline-block;
            vertical-align: middle;
            font-size: 1.9em;
            margin-right: 15px;
        }

        .header-indicator .indicator-info {
            display: inline-block;
        }

        .header-indicator .indicator-name {
            border-top:none;
        }

    .header-sticky {
        display: block;
        position: fixed;
        top:-47px;
        left: 0;
        right: 0;
        z-index: 10;
    }

        .header-sticky .sticky-wrapper {
            display: flex;
            justify-content: space-between;
            position: relative;
            z-index: 21;
            background-color: #333c45;
        }

        .header-sticky .category-site-nav{
            display:none;
            position: absolute;
            top: 100%;
            left: 0;
            right: 0;
        }

        .header-sticky .left-col {
            max-width: 60%;
        }

        .header-sticky .right-col {
            align-items: center;
            position: absolute;
            top: 0;
            right: 0;
            height: 100%;
        }

        .header-sticky .logo-container,
        .classic-sticky .logo-container {
            max-width: 145px;
            padding: 5px;
        }

        .header-sticky .article-title {
            margin-left: 15px;
        }

        .header-sticky .subs-btn {
            padding: 6px 13px;
        }

        .header-sticky .social-box {
            position: static;
            display: flex;
            align-items: center;
            margin-right:15px;
        }

            .header-sticky .social-box .social-box-networks,
            .header-sticky .social-box-share{
                display: flex;
                align-items: center;
                margin-bottom:0;
            }

            .header-sticky .social-box-share{
                width: 100%;
            }

            .header-sticky .social-box .social-box-networks {
                z-index: 1;
                margin-right: 0;
                background-color: #333C45;
                transition: margin 0.2s ease;
            }

            .header-sticky .social-box .social-box-networks.active {
                margin-right: 0px;
            }

                .header-sticky .social-box .social-link{
                    border: 2px solid #fff;
                    width: 28px;
                    height:28px;
                    padding-top:2px;
                    margin-right:5px;
                }
                .header-sticky .social-box .social-link:last-child{
                    margin-right:16px;
                }

                .header-sticky .social-box .social-link:hover {
                    background-color: #fff;
                    color: #333C45;

                }
        
.header-sticky .reading-progress { 
    display: none;
    position: absolute;
    top:100%;
    left:0;
    right:0;
    height: 4px;
    background-color: #d61c3b;
    transform: scaleX(0);
    transform-origin: 0 0;
    transition: trasnform 0.1s ease;
    z-index: 100;
 }

.dataPage h1 {font-size: 24px; font-weight: bold; padding: 0 0 10px 0;}
.dataPage h1 a{text-decoration: none}
.dataPage .userProfile::after {clear: both;content:'';display: block}
.dataPage .userProfile .userPhoto {float: left;width: 200px;}
.dataPage .userProfile .userPhoto p.name {font-weight: bold;font-style: italic;margin: 5px 0 15px 0; font-size: 20px;}
.dataPage .userProfile .userPhoto a {font-size: 16px;color: #489dba;margin: 0 0 5px 0;display: block;}
.dataPage .userProfile .userInfo {float: left;width: 680px;margin: 0 0 30px 20px;}
.dataPage .userProfile .userInfo ul.tabbedMenu {height: 48px;border-bottom: 1px solid #afadad}
.dataPage .userProfile .userInfo ul.tabbedMenu li.active {border-bottom: 1px solid #fff; border-top: 1px solid #afadad;border-left: 1px solid #afadad;border-right: 1px solid #afadad;border-bottom:1px solid #f8f8f8;height: 48px}
.dataPage .userProfile .userInfo ul.tabbedMenu li { text-transform: uppercase;color: #09346b;font-weight: bold; float: left;border-top: 1px solid #fff;border-left: 1px solid #fff}
.dataPage .userProfile .userInfo ul.tabbedMenu li a { padding: 15px 25px;display: block;text-decoration: none;}
.dataPage .userProfile .userInfo .tabs {border-left: 1px solid #afadad;border-right: 1px solid #afadad;border-bottom: 1px solid #afadad;}
.dataPage .userProfile .userInfo .tabs > div div {padding: 10px}
.dataPage .button {border: none; border-radius: 6px; cursor: pointer; background: #333; color: white; padding: 5px 12px; text-align: center; display: inline-block; margin: 10px 0; text-transform: uppercase; font-size: 12px;}
.dataPage .commerce {float: right;}
.dataPage .table p{width: 200px;vertical-align: top;font-weight: bold;padding: 5px;display: inline-block}
.dataPage .table input[type=text],.dataPage .table input[type=password] {padding: 5px;width: 230px;border: 1px solid #aaa;margin: 0 0 10px 0;}

.article-locked-paywall {display: none}

@media (max-width: 900px) {
    .static_leaderboard_container {width: 90%}
    .static_leaderboard_container img.mobile {display: block;}
    .static_leaderboard_container img.desktop {display: none;}
    .header-sticky .article-title {
        max-height: 20px;
        display: inline;
        overflow: hidden;
    }

    .nav-container .nav-item{padding: 0.3em 10px}
}

@media (max-width: 769px) {

    .header-indicator .indicator-item {
        padding-right: 0;
    }
}
/* @end HEADER */

/* @group HEADER MOBILE */

@media (min-width: 770px) {
    .header-mobile,
    .nav-mobile {
        display: none;
    }
}

@media (max-width: 769px) {

    .header-indicator,
    .site-header,
    .category-site-nav,
    .search-bar {
        display: none;
    }

    .english_newsletter_component{background-position: 250px -98px}
    .article-body .article-content .english_newsletter_component{padding: 70px 0 20px 0}
    .english_newsletter_component .info{width: 100%}
    .english_newsletter_component{padding: 70px 10px 20px 10px}
    .english_newsletter_component .info input[type="email"]{width: calc(100% - 100px)}
    .english_newsletter_component .info input[type="submit"]{width: 100px}
    .english_newsletter_component .info h2{font-size: 12px}
    .english_newsletter_component .info h3{padding:10px 0;font-size: 15px}
    .english_newsletter_component.square{background-position: 230px -78px}
    .newsletter-overlay .content{width:100%}
    .newsletter-overlay .content .container a.close span{top:70px}
    .english_newsletter_component.mobile{display: block}
    .english_newsletter_component.desktop{display: none}

    .header-mobile {
        display: block;
        background-color: #DD1329;
        height: 50px;
        position: fixed;
        width: 100%;
        z-index: 12;
        top: 0;
        left: 0;
        right: 0;
    }

    .header-mobile.ninety-anniversary {background-color: white}
    .header-mobile.ninety-anniversary .header-btn {border-right: black}
    .header-mobile.ninety-anniversary .header-btn::before {background-color: black}
    .header-mobile.ninety-anniversary .header-btn::after {background-color: black; box-shadow: 0 -5px 0 0 #000}
    .header-mobile.ninety-anniversary .mobile-logo {margin-left: -60px}
    .header-mobile.ninety-anniversary .mobile-logo img {max-width: 120px}

        .header-mobile .header-btn::before {
            background-clip: padding-box;
            background-color: #fff;
            content: "";
            display: block;
            height: 2px;
            left: 50%;
            margin-left: -10.5px;
            margin-top: 4px;
            position: absolute;
            top: 54%;
            transition: all 200ms ease 0s;
            width: 21px;
        }

        .header-mobile .header-btn.active::before {
            height: 3px;
            transform: rotate(45deg);
            margin-top: -2.5px;
        }

        .header-mobile .header-btn {
            display: inline-block;
            height: 100%;
            position: relative;
            vertical-align: middle;
            width: 50px;
            vertical-align: middle;
            border-right:1px solid #DB5064;
            margin-right:30px;
        }

        .header-mobile .header-btn::after {
            background-clip: padding-box;
            background-color: #fff;
            content: "";
            display: block;
            height: 2px;
            left: 50%;
            margin-left: -10.5px;
            position: absolute;
            top: 54%;
            transition: all 200ms ease 0s;
            width: 21px;
            box-shadow: 0 -5px 0 0 #fff;
            margin-top: -1px;
        }

        .header-mobile .header-btn.active::after {
            box-shadow: 0 0 0 0 #fff;
            height: 3px;
            margin-top: -2.5px;
            transform: rotate(135deg);
        }

        .header-mobile .mobile-logo {
            display: inline-block;
            vertical-align: middle;
            position: absolute;
            left: 50%;
            margin-left: -75px;
            margin-top: 10px;
        }

        .header-mobile .mobile-logo img{
            max-width:150px;
            height: auto;
        }

    .nav-mobile {
        background-color: #333C45;
        padding:15px;
        position: fixed;
        top:50px;
        width: 100%;
        z-index:10;
        left:-100%;
        transition: left 0.1s ease-in;
        height: calc(100vh - 49px);
    }

    .nav-mobile.open {
        left:0;
        overflow-y: auto;
    }

    .nav-mobile .search-bar {
        display: block;
        position: static;
        background-color: #333C45;
        padding-bottom:15px;
        padding-top:0;
        padding-left:0;
        padding-right: 0;
        pointer-events: auto;
    }

        .nav-mobile .search-bar .search-form {
            background-color: #333C45;
        }

        .nav-mobile .search-form .search-label {
            background-color: #333C45;
        }

        .nav-mobile .search-form .search-field {
            background-color: #333C45;
            margin-left:0;
            border-left:none;
            font-size:1.2em;
            margin-bottom:5px;
        }

        .nav-mobile .search-btn-ok {
            top: 15px;
        }

        .nav-mobile .subs-btn {
            text-align: center;
            color: #fff;
            background-color: #EAB533;
            font-family: "franklin-gothic-urw";
            border-radius: 3px;
            display: block;
            font-size: 0.8em;
            font-weight: 500;
            padding: 10px 15px;
            margin-bottom:15px;
            text-decoration: none;
            text-transform: uppercase;
            transition: background-color 0.2s ease-in 0s, color 0.2s ease-in 0s;
        }

        .nav-mobile .subs-btn:hover {
            background-color: #cb9d29;
        }

            .nav-mobile .subs-btn span {
                vertical-align: middle;
            }

            .nav-mobile .subs-btn svg {
                display: inline-block;
                vertical-align: middle;
                margin-top: 2px;
            }

    .nav-mobile .month-edition {
        text-align: center;
        border: 2px solid #ffffff;
        color: #fff;
        display: block;
        border-radius: 3px;
        font-family: "franklin-gothic-urw";
        font-size: 0.8em;
        font-weight: 500;
        padding: 10px 15px;
        margin-bottom:15px;
        text-decoration: none;
        text-transform: uppercase;
        transition: background-color 0.2s ease-in 0s, color 0.2s ease-in 0s;
    }

    .nav-mobile .month-edition:hover {
        color: #333C45;
    }

    .nav-list {
        border-top:1px solid #515960;
        border-bottom:1px solid #515960;
        padding:15px 0;
        margin-bottom:15px;
    }

        .nav-list li {
            margin-bottom:10px;
        }

        .nav-list li:last-child {
            margin-bottom:0;
        }
    
            .nav-list .nav-item{
                color: #fff;
                text-decoration: none;
                font-size:1.2em;
                line-height: 1;
                transition: opacity 0.2s ease-in 0s;
            }

            .nav-list .nav-item:hover {
                opacity: 0.8;
            }

    .nav-mobile .all-indicators-btn {
        text-align: center;
        color: #333C45;
        background-color: #D8D8D8;
        font-family: "franklin-gothic-urw";
        border-radius: 3px;
        display: block;
        font-size: 0.8em;
        font-weight: 500;
        padding: 10px 15px;
        margin-bottom:15px;
        text-decoration: none;
        text-transform: uppercase;
        transition: background-color 0.2s ease-in 0s;
        margin-bottom:15px;
    }

    .nav-mobile .all-indicators-btn:hover {
        background-color: #fff;
    }

    .nav-mobile .account-container {
        padding:15px 0;
        border-top:1px solid #515960;
        border-bottom:1px solid #515960;
    }

        .nav-mobile .account-btn {
            color: #fff;
            align-self: center;
            border: 2px solid #fff;
            border-radius: 50%;
            display: inline-block;
            font-size: 0.7em;
            font-weight: 600;
            height: 42px;
            margin-right: 10px;
            padding: 10px 12px;
            text-decoration: none;
            text-transform: uppercase;
            transition: background-color 0.2s ease-in 0s;
            width: 42px;
            vertical-align: middle;
        }

            .nav-mobile .account-wrapper:hover .account-btn {
                background-color: #49525b;
            }

        .nav-mobile .account-label {
            color: #fff;
            font-size:1.2em;
            vertical-align: middle;
            text-decoration: none;
            transition: opacity 0.2s ease-in;
        }

            .nav-mobile .account-wrapper:hover .account-label {
                opacity:0.8;
            }

    .nav-mobile .cold-list {
        padding:15px 0;
        border-bottom:1px solid #515960;
    }

        .nav-mobile .cold-list li {
            margin-bottom:2px;
        }

        .nav-mobile .cold-list .cold-item {
            color: #fff;
            text-decoration: none;
            font-size:0.95em;
        }

    .nav-mobile .orient-btn {
        display: block;
        border-left:none;
        border-bottom:1px solid #515960;
        color: #fff;
        padding-top: 15px;
        padding-bottom: 15px;
        font-size: 1.05em;
        transition: opacity 0.2s ease-in;
    }

    .nav-mobile .orient-btn:hover {
        opacity:0.8;
    }

    .nav-mobile .social-follow {
        border-bottom:1px solid #515960;
        color: #fff;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .nav-mobile .lang-btn {
        display: block;
        border-left:none;
        color: #fff;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .nav-mobile .lang-btn a {
        text-transform: uppercase;
        text-decoration: none;
    }

    .nav-mobile .social-btn {
        color: #fff;
        align-self: center;
        border: 2px solid #fff;
        border-radius: 50%;
        display: inline-block;
        font-size: 0.7em;
        font-weight: 600;
        height: 42px;
        margin-right: 10px;
        padding: 10px 12px;
        text-decoration: none;
        text-transform: uppercase;
        transition: background-color 0.2s ease-in 0s;
        width: 42px;
        vertical-align: middle;
    }

    .dataPage h1 {width: 90%;margin: 0 5% 10px 5%}
    .dataPage .userProfile .userInfo,.dataPage .userProfile .userPhoto{width: 90%;margin: 0 5% 30px 5%}
    .dataPage .table p,.dataPage .table input[type=text], .dataPage .table input[type=password]{width: 100%}

    table[class="chiffre-component"], table[class="explanatory-text-component"], table[class="chronologie-component"], table[class="quote-component"], table[class="person-info-component"]{width:100%}

}

/* @end HEADER  MOBILE */

/* @group BLOCS */


/* @group RUBRIC HEADER */

.rubric-header {
    position: relative;
    background: url('../images/rubric-header-bg.jpg');
    background-size: 100% 100%;
    color: #fff;
    padding: 70px 0 80px 0;
    text-align: center;
    margin-bottom: 20px;
}

.rubric-header.red {
    background: none;
    background-color: #db1429;
}

.rubric-header.title-only {
    padding: 70px 0 70px 0;
}

.rubric-header.no-desc {
    padding-bottom: 50px;
}

    .rubric-header.no-desc .rubric-title {
        margin-bottom: 10px;
    }

    .rubric-header .layer {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        background-color: rgba(0,0,0,0.4);
    }

    .rubric-header .rubric-title{
        position: relative;
        font-size: 2.2em;
        font-weight: 600;
        margin-bottom: 5px;
        line-height:1;
    }
    
    .rubric-desc { 
        position: relative;
        margin-bottom: 20px;
        font-weight: 500;

     }

    .rubric-tags-list li {
        position: relative;
        display: inline-block;
    }

        .rubric-tags-list .tag-item {
            display: inline-block;
            color: #FFF;
            font-size: 0.7em;
            font-weight: 500;
            margin-right: 5px;
            padding: 5px 10px;
            text-transform: uppercase;
            border: 1px solid white;
            border-radius: 3px;
            text-decoration: none;
            transition: color 0.2s ease;
            transition: background-color 0.2s ease;
            margin: 5px 0;
        }

        .rubric-tags-list .tag-item:hover,.rubric-tags-list .tag-item.active {color: #333C45;background-color: #fff}

.rubric-header.thin {
    padding: 30px 0 30px 0;
}

.rubric-header.sponso{
    padding: 45px 0 30px 0;
    margin-bottom: 0;
}
    .rubric-sponsor {
        padding: 10px 0;
        font-size: 0.8em;
        text-transform: uppercase;
        background-color: #fff;
        text-align: center;
        margin-bottom: 20px
    }

    .rubric-sponsor.align-left {
        text-align: left;
        padding: 20px
    }

    .rubric-sponsor .logo-sponsor {
        display: inline-block;
        margin-top: -7px;
        max-height: 35px;
    }

    .rubric-sponsor span {
        color: #333C45;
        display: inline-block;
        margin-right: 10px;
        font-weight: 600;
    }

@media (max-width: 769px) {
    .rubric-tags-list {
        list-style-type: none;
        white-space: nowrap;
        overflow-x: auto;
        padding-left: 30px;
        padding-right: 30px;
    }

    .rubric-tags-list li{
        display: inline;
    }
}

/* @end RUBRIC HEADER */

/*@group ARTICLES*/

.block-article {
    position: relative;
}
.block-article .block-article-link{display: block; text-decoration: none;position: relative}
.block-article-list.bottom-sep .article-list-wrapper .block-article .dossier_span,.block-article .block-article-link .dossier_span, article .illustrated-container span {position: absolute;top:0;left:0; background-color: #D61C3B;color: white;font-size: 0.8em; padding: 4px 7px 3px 7px;font-family: "franklin-gothic-urw";text-transform:uppercase;z-index: 10}
article .illustrated-container span.spe{background-color:#FF6600;font-size: 0.7em}
.block-article-list.bottom-sep .article-list-wrapper .block-article .dossier_span,.block-article .block-article-link .dossier_span {display: none}
.block-article-list.bottom-sep .article-list-wrapper .block-article .dossier_span.desktop,.block-article .block-article-link .dossier_span.desktop {display: block;width: 100%;}
.block-article.small-width.publi-info .block-article-link {
        height:280px;
        background-size:cover;
        background-repeat:no-repeat;
        background-position: center center;
    }

    .block-article.small-width.publi-info .block-article-link::before {
        display: block;
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(199,199,199,0) 22%, rgba(0,0,0,1) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(199,199,199,0) 22%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(199,199,199,0) 22%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#000000',GradientType=0 ); /* IE6-9 */

    }
    
        .block-article .article-spe {
            z-index: 1;
            position: absolute;
            top:0;
            left:0;
            font-size: 0.7em;
            text-transform: uppercase;
            line-height: 1;
            color: #333C45;
            background-color: #fff;
            padding: 11px 10px 9px;
            font-weight:600;
        }

        .block-article .article-spe.dark {
            color: #fff;
            background-color: #333C45;
        }

        .block-article.sponso .article-spe {
            background-color: #FF6600;
            color: #fff;
        }

        .block-article .sponsor-name,
        .folder-article-container .sponsor-name {
            text-transform: uppercase;
            font-size:0.8em;
            margin-top: 10px;
        }

            .block-article.sponso .sponsor-name span,
            .folder-article-container.sponso .sponsor-name span{
                vertical-align: middle;
            }
        
            .block-article .sponsor-name img,
            .folder-article-container.sponso .sponsor-name img,
            .block-article .article-spe img {
                display: inline-block;
            }

            .block-article .article-spe span {
                vertical-align: middle;
            }

        .block-article .article-img {
            opacity: 1;
            transition: opacity 0.2s ease-in;
        }

        .article-img.no-image{
            background-image: url('../images/placeholder-black.jpg')!important;
            background-size: cover !important;
            background-position: 50% 50%;
        }

        .block-article.full-width .article-img {
            vertical-align: bottom;
            width:52.1%;
            height: 274px;
            min-height: 100%;
            background-color: #e1e1e1;
            background-size:cover;
            background-position: center;
            background-repeat:no-repeat;
            transition: opacity 0.2s ease-in;
        }

        .block-article .block-article-link:hover .article-img {
            opacity: 0.8;
        }

            .block-article-link .article-img img {
                width: 100%;
                height: auto;
                opacity:1;
                display:none;
            }

        .block-article.full-width .block-content {
            position: relative;
            z-index: 1;
            float: right;
            vertical-align: bottom;
            width: 51.1%;
            margin-top: 37px;
            margin-left: -3.7%;
            padding: 25px 3.2% 0 3.2%;
            min-height:237px;
            background-color: #FFF;
        }
            .block-content .slug {
                border-bottom: 2px solid #d61c3b;
                color: #d61c3b;
                display: inline-block;
                font-family: "franklin-gothic-urw";
                font-size: 0.8em;
                font-weight: 500;
                line-height: 1;
                padding-bottom: 2px;
                text-transform: uppercase;
                position: relative;
            }

                .line-after {
                    position: relative;
                    border-bottom: 2px solid #000;
                    text-decoration: initial;
                }

                .line-after::after {
                    content: "";
                    position: absolute;
                    top: 100%;
                    left: 0;
                    width: 100%;
                    height: 3px;
                    background-color: #fff;
                    -webkit-transform: scaleX(0);
                    -ms-transform: scaleX(0);
                    -moz-transform: scaleX(0);
                    transform: scaleX(0);
                    animation-timing-function: ease-in-out;
                }

                .line-after:hover::after {
                    animation: underlineLink 0.6s forwards;
                }


            .block-content .slug.spe-une {
                border-bottom: none;
                color: #333c45;
            }
            .sponso .block-content .slug {
                color: #FF6600;
                border-bottom: 2px solid #FF6600;

            }

            .full-width .block-content .slug {
                margin-bottom: 20px;
            }

            .full-width .block-content .content-title {
                font-size: 1.75em;
                line-height: 1.1;
                font-weight:600;
            }

            .full-width.sponso .block-content .content-title {
                color: #FF6600;
                font-size: 2em;
            }

            .block-article .block-article-link:hover .content-title {
                opacity: 0.9;
            }

    .block-article-list .article-list-wrapper {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        flex-wrap: wrap;
    }

        .block-article.small-width {
            margin-bottom: 25px;
            width: 31.83%;
        }

        .block-article.half-width {
            width: 48%;margin: 0 0 30px 0;
        }

            .publi-info .publi-brand {
                margin-bottom: 15px;
            }

            .block-article .round-label.blog {
                background-color: transparent;
                border: 3px solid #fff;
                border-radius: 50%;
                color: #fff;
                font-size: 0.7em;
                height: 61px;
                left: 10px;
                padding-top: 20px;
                position: absolute;
                text-align: center;
                text-transform: uppercase;
                top: 10px;
                width: 61px;
                z-index: 1;
            }

            .block-article.small-width .article-img {width:100%;height:169px;min-height: 100%;background-size: cover;background-repeat:no-repeat;background-color: #e1e1e1;position: relative;}
            .block-article.small-width .block-content {position: relative;float: right;width: 90%;margin-top: -35px;padding: 30px 20px 20px 20px;background-color: #FFF; height: 156px}
            .block-article.small-width.publi-info .block-content {
                    margin-top: 0;
                    float: none;
                    background: transparent;
                    color: #fff;
                    height:100%;
                    padding-top: 130px}

            .block-article.half-width .article-img {
                width:100%;
                height:230px;
                min-height: 100%;
                background-size: cover;
                background-position: center;
                background-repeat:no-repeat;
                background-color: #e1e1e1;
            }

            .block-article.half-width .block-content {
                position: relative;
                padding-top: 5px;
                background-color: #FFF;
            }

                .block-article.half-width.publi-info .block-content {
                    margin-top: 0px;
                    float: none;
                    background: transparent;
                    color: #fff;
                    height:100%;
                    padding-top: 130px;
                }

                .small-width .block-content .slug {
                    margin-bottom: 17px;
                }

                .small-width .block-content .content-title {
                    font-size: 1.2em;
                    line-height: 1.1;
                }

                .small-width.sponso .block-content .content-title {
                    color: #FF6600;
                }

                .half-width .block-content .slug {
                    margin-bottom: 17px;
                }

                .half-width .block-content .content-title {
                    font-size: 1.65em;
                    line-height: 1.1;
                    font-weight: 600;
                }

                .half-width.sponso .block-content .content-title {
                    color: #ff6600;
                }

.article-content .enselection-container{background-color: #F4F4F4; padding: 15px; margin: 0 0 10px 0}
.article-content .enselection-container a{font-size: 15px; color: #000000 !important; font-weight: bold; font-size: 18px}
.article-content .enselection-container a span{color: #B72941}
.enselection_component_mobile{display: none}

@media (max-width: 769px) {

    .block-article.full-width .block-article-link,.block-article.small-width .block-article-link { padding: 10px 20px 0 }

    .block-article .round-label {
        padding: 0;
        line-height: 1.3;
        margin-bottom: 5px;
        margin-top: 10px;
    }

    .block-article-list.left-column .block-article.small-width .round-label + .block-article-link {
        padding-top: 2px;
    }

    .block-article .round-label ~ .block-article-link {
        padding-top: 5px;
    }

    .bottom-sep + .block-article.full-width .block-article-link {
        padding: 0 20px;
    }

    .block-article.full-width .article-spe,
    .block-article.small-width .article-spe {
        position: static;
        display: inline-block;
        margin-right:30%;
    }

    .block-article.full-width .block-content,
    .block-article.small-width .block-content {
        background-color: transparent;
        float: left;
        margin-left: 0;
        margin-top: 0;
        min-height:inherit;
        width: 57%;
        padding:0;
        vertical-align: bottom;
    }

    .block-article.full-width .article-img,
    .block-article.small-width .article-img {
        min-height: initial;
        height: 65px;
        width: 22%;
        float: right;
        min-width: 120px;
        position: relative;
    }
    .block-article .article-img.no-image{width: 0;min-width: 0;height: 0}
    .full-width .block-content .content-title,
    .small-width .block-content .content-title {
        font-size:1em;
        font-weight:500;
        display: inline;
        line-height:1.2;
    }

    .full-width.sponso .block-content .content-title,
    .small-width.sponso .block-content .content-title {
        font-size:1em;
        line-height: 1.2em;
    }

    .block-content .slug.spe-une {
        display: inline;
    }

    .full-width .block-content .slug,
    .small .block-content .slug {
        margin-bottom:0;
    }

    .block-article .article-spe {
        padding: 5px;
        font-size:0.6em;
        margin-bottom:5px;
    }

    .block-content .slug {
        font-size:0.65em;
    }

    .block-article.small-width {
        width: 100%;
        margin-bottom: 0;
        border-bottom:1px solid #e5e5dd;
        padding-bottom:20px;
        padding-top:0;
    }

    .block-article.small-width:last-child {
        /* padding-bottom:0; */
        border-bottom:none;
    }

    .block-article.small-width .block-content {
        height: inherit;
    }

    .small-width .block-content .slug {
        margin-bottom:0;
    }
    .width-wrap.reader img {width: 80%}
}

/*@end ARTICLES*/

/*@group ARTICLES PUB*/

.block-article-list.bottom-sep,
.block-article-column.bottom-sep {
    padding-bottom:0;
}

.magazine-rubric-folder .block-article-list.bottom-sep {
    padding-bottom: 20px;
}

    .block-article-column .block-article-list.left-column {
        float: left;
        width: 68.1%;
        margin-right: 0;

    }

        .block-article-list.left-column .block-article.small-width{
            float: left;
            margin-right: 3%;
            margin-bottom: 3%;
            width: 47%;
        }

    .block-article-column .block-pub.right-column {
        float: left;
        width: 31.9%;
        overflow: hidden;
    }

    .block-pub.right-column .pub-label,
    .publi-info .label-publi-info {
        text-transform: uppercase;
        line-height: 1;
        font-size:0.55em;
        margin-bottom: 10px;
        color: #333C45;
    }

@media (max-width: 769px) {

    .magazine-rubric-folder .block-article-list.bottom-sep {
        padding-bottom: 0;
        border-bottom: 0;
    }

    .block-article-list.left-column .block-article.small-width {
        width: 100%;
        margin-right:0;
        margin-bottom:0;
    }

    .block-article-column .block-article-list.left-column {
        width: 100%;
    }

    .enselection_component_mobile{display: block}
    .enselection_component_mobile{margin: 0 0 20px 0}
    .enselection_component_mobile .header{background-color: #EAB531; padding: 12px}
    .enselection_component_mobile .header h2{color: #FFFFFF; font-size: 20px}
    .enselection_component_mobile .header h2 a{text-decoration: none}
    .enselection_component_mobile .container{background-color: #fbfbfb; padding: 20px 20px 0 20px; overflow: hidden}
    .enselection_component_mobile .container article{width: 100%; margin: 0 0 20px 0; background-color: #FFFFFF; position: relative; min-height: 110px}
    .enselection_component_mobile .container article a.float{float: left; width: 148px}
    .enselection_component_mobile .container article figure{width: 100%; height: 110px}
    .enselection_component_mobile .container article > div{padding: 5px 5px 5px 10px; margin: 0 0 0 148px}
    .enselection_component_mobile .container article > div a{text-decoration: none}
    .enselection_component_mobile .container article > div h3{font-size: 14px; margin: 0 0 6px 0}
    .enselection_component_mobile .container article > div h4{color: #868686; font-style: italic; font-size: 14px}
    .enselection_component_mobile .container a.more{float: right; font-size: 15px; margin: 0 0 20px 0; text-decoration: none}
}

/*@end ARTICLES PUB*/

/*@group PUB*/

.pub-full-size {
    background-color: #ECEDED;
    padding: 15px 0;
    margin-bottom: 20px;
    text-align: center;
    overflow: hidden;
}

    .pub-full-size .pub-container{
        display: inline-block;
        text-align: left;
    }

        .pub-full-size .pub-label {
            color: #333c45;
            font-size: 0.55em;
            margin-bottom: 5px;
            text-transform: uppercase;
            text-align: left;
        }

        .pub-full-size a{
            display: inline-block;
        }

        .pub-full-size a img {
            max-width: 100%;
            height: auto;
        }

        .mobile-pub {
            width: 100%;
            text-align: center;
            display: none;
        }

        .pub-full-size img{
            display: inline-block;
        }

@media (max-width: 769px) {
    .pub-label {
        padding-left: 20px;
    }

    .mobile-pub {
        display: block;
    }

    .desktop-pub {
        display: none;
    }
}

/*@end PUB*/

/*@group READ OTHER*/
.read-other.mobile{
    display: none
}
.read-other {
    margin-top: 20px;
    width: 300px;
    padding: 18px 10px;
    background-color: #fff;
}

    .read-other .header{
        text-align: center;
        padding-bottom: 18px;
    }
    
        .read-other .title {
            font-size: 0.8em;
            font-weight: 600;
            text-transform: uppercase;
        }
    
    .read-other .other-article {
        display: block;
        text-decoration: none;
        padding: 15px 10px;
        border-top: 1px solid #E5E5DD;
        margin-bottom: 0px;
        transition: background-color 0.2s ease;
    }
        .read-other .other-article .left-column {
            width: 75%;
            display: inline-block;
            margin-right: -5px;
            vertical-align: middle;
        }

        .read-other .other-article .right-column {
            width: 25%;
            display: inline-block;
            text-align: right;
            vertical-align: middle;
        }

            .read-other .other-article .slug {
                border-bottom: 2px solid #d61c3b;
                color: #d61c3b;
                display: inline-block;
                font-family: "franklin-gothic-urw";
                font-size: 0.8em;
                font-weight: 500;
                line-height: 1;
                padding-bottom: 2px;
                text-transform: uppercase;
            }

            .read-other .other-article .article-title {
                margin-top: 5px;
                font-size: 1.05em;
                line-height: 1.15;
                font-weight: 600;
                transition: opacity 0.2s ease-in;
            }

            .read-other .article:hover .article-title{
                opacity:0.8;
            }

            .read-other .rounded-mask{
                max-width: 55px;
                margin-right: 0px;
            }

@media (max-width: 900px) {
    .read-other.mobile{
        display: block;
        width: 100%;
        margin: 0 0 20px 0;
    }
}
/*@end READ OTHER*/

/*@group DOSSIER*/

.dossier {
    padding-top: 40px;
}

    .block-folder .folder-preview {
        position: relative;
    }
.block-folder .folder-preview a {display: inline-block;background-repeat: no-repeat;background-position: center center;width: 100%; height: 538px;background-size: cover}

.block-folder .folder-preview img{
    width: 100%;
    height:auto;
}

.block-folder .folder-preview .dossier_firstItem {background-size: cover;background-position: center center;width: 960px;height: 540px;display: inline-block;}

        .folder-preview .dossier-spe{
            z-index: 1;
            position: absolute;
            top:0;
            left:0;
            font-size: 0.72em;
            text-transform: uppercase;
            line-height: 1;
            color: #fff;
            background-color: #333C45;
            padding: 11px 10px 9px;
            font-weight:600;
        }

        .folder-preview .dossier-spe.missed {
            color: #fff;
            background-color: #333C45;
        }

        .folder-preview .round-label,
        .block-article .round-label {
            position: absolute;
            top: 20px;
            left: 20px;
            width: 61px;
            height: 61px;
            color: #fff;
            border-radius: 50%;
            text-transform: uppercase;
            font-size: 0.7em;
            background-color: #333C45;
            text-align: center;
            padding-top: 23px;
            z-index: 1;
        }
        .block-article .round-label {
            top: 10px;
            left: 10px;
        }

        .block-folder.small-folder .folder-preview img {
            display: none;
        }

        .block-folder .folder-preview a:hover img {
            opacity: 0.8;
        }

    .folder-article-container {background-color: #ffffff;position:relative;float:right;width:100%}

    .folder-article-container.hasImage {margin-top: -90px;width: 94%;}

        .folder-article-container .folder-title {
            background-color: #D61C3B;
            color: #fff;
            text-transform: uppercase;
            font-size: 0.73em;
            padding-left:15px;
        }

        .sponso .folder-article-container .folder-title {
            background-color: #ff6600;
        }

        .folder-article-container.sponso .folder-title {
            background-color: #FC6621;
        }

            .folder-article-container .folder-title .sponso-brand {
                display: inline-block;
                border-left:1px solid #D95266;
                margin-left: 5px;
                padding: 8px 10px 8px 10px;
            }

            .folder-article-container .folder-title span {
                display: inline-block;
                padding: 8px 0;
            }

        .folder-article-container .folder-name {
            width: 70%;
            font-size: 2.1em;
            font-weight:600;
            padding-top:40px;
            padding-left:40px;
            padding-right:40px;
            margin-bottom:30px;
            line-height: 1;
        }

        .folder-article-container .folder-desc {
            width: 80%;
            font-size:1.1em;
            padding-left:40px;
            padding-right:40px;
            margin-bottom:30px;
        }

        .folder-article-container.sponso .folder-name {
            color: #FC6621;
            margin-bottom:0px;
        }

        .folder-article-container.sponso .sponsor-name {
            padding-left:40px;
            margin-top:5px;
            margin-bottom:25px;
        }

            .folder-article-container .folder-name a {
                text-decoration: none;
            }


            .folder-article-container .folder-name a:hover {
                opacity:0.9;
            }

        .folder-article-container .folder-article-list {
            padding-left: 40px;
            padding-right: 40px;
        }

            .folder-article-list li {
                margin-bottom: 10px;
            }

                .folder-article-list .folder-article-item {
                    display : block;
                    text-decoration: none;
                }

                .folder-article-list .folder-article-item:hover .rounded-mask {
                    opacity: 0.7;
                }

                    .rounded-mask::after {
                        content: "";
                        display: block;
                        padding-bottom: 100%;
                    }

                    .rounded-mask {
                        display: inline-block;
                        vertical-align: middle;
                        position: relative;
                        overflow: hidden;
                        -webkit-border-radius: 100%;
                        -moz-border-radius: 100%;
                        border-radius: 100%;
                        width: 100%;
                        max-width: 40px;
                        margin-right: 15px;
                        opacity: 1;
                        transition: opacity 0.2s ease-in;
                        background-color: #e1e1e1;
                        background-size: cover;
                        background-position: center;
                    }

                        .rounded-mask img {
                            display: none;
                        }

                    .folder-article-item .folder-item-title {
                        display: inline-block;
                        font-size: 1.1em;
                        width: 80%;
                        vertical-align: middle;
                    }

            .folder-article-list .more-article {
                padding-left: 60px;
                margin-bottom: 40px;
            }

                .more-article img {
                    display: inline-block;
                    margin-right: 5px;
                    margin-top:-2px;
                }

                .more-article a {
                    text-decoration: none;
                    font-size: 0.75em;
                    text-transform: uppercase;
                    font-weight:600;
                }

                .more-article a:hover {
                    opacity:0.9;
                }

    .block-folder.small-folder .folder-article-container{
        background-color: #fff;
        float: right;
        margin-left: -3.7%;
        margin-top: 37px;
        min-height: 244px;
        padding: 25px 3.2% 0;
        position: relative;
        vertical-align: bottom;
        width: 51.1%;
        z-index: 1;
    }

    .block-folder.small-folder .folder-preview{
        background-color: #e1e1e1;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 274px;
        min-height: 100%;
        transition: opacity 0.2s ease-in 0s;
        vertical-align: bottom;
        width: 52.1%;
    }
.block-folder.small-folder .folder-preview a {height: 275px}

        .block-folder.small-folder .folder-article-container {
            padding:0;
        }

            .block-folder.small-folder .folder-article-container .folder-name{
                width:100%;
                padding-left: 30px;
                padding-right: 30px;
                font-size:1.65em;
                margin-bottom:20px;
                padding-top: 30px;
            }

            .block-folder.small-folder .folder-article-container .folder-name + .sponsor-name{
                margin-top: 0;
            }

            .sponso .folder-article-container .folder-name{
                color: #ff6600;
            }

            .block-folder.small-folder .folder-article-container .folder-article-list .more-article{
                margin-bottom:31px;
            }

            .block-folder.small-folder .folder-article-container .sponsor-name {
                font-size: 0.8em;
                margin-top: 10px;
                margin-bottom: 20px;
                padding-left:30px;
                text-transform: uppercase;
            }

            .block-folder.small-folder .folder-article-container .sponsor-name span {
                vertical-align: middle;
            }

            .block-folder.small-folder .folder-article-container .sponsor-name img {
                vertical-align: middle;
                display: inline-block;
            }

            .folder-mobile-img {
                display: none;
            }


@media (max-width: 900px) {

    .dossier {
        padding-top:0;
        padding-left: 0;
        padding-right: 0;
    }

    .folder-article-container .folder-name,
    .folder-article-container .folder-desc {
        width: 100%;
        padding-left:15px;
        padding-right:15px;
    }

    .folder-article-container .folder-name {
        font-size:1.4em;
        margin-bottom:15px;
        padding-top:15px;
    }
}


@media (max-width: 769px) {

    .block-folder {
        position: relative;
        overflow: hidden;
    }

    .article-container div.folder-article-container {
        width: calc(100% - 40px);
        margin: 0 auto;
    }

    .folder-article-container .folder-article-list {
        padding-left:15px;
        padding-right:15px;
    }

    .folder-article-item .folder-item-title {
        width: calc(100% - 65px);
    }

    .folder-article-list .more-article {
        margin-bottom:15px;
    }



    .block-article .round-label,
    .block-article .round-label.blog {
        position: absolute;
        width: 30px;
        height: 30px;
        font-size: 6px;
        padding: 0 3px;
        line-height: 30px;
        top: 3px;
        left: 3px;
        margin: 0;
    }

    .block-article-list .block-article.small-width .round-label {
        padding: 3px 0;
        line-height: 1.3;
        margin-top: 6px;
        margin-bottom: 0px;
        border: 0 none;
    }

    .block-article-column .block-pub.right-column {
        display: none;
    }

    .block-folder.small-folder .folder-preview {
        /*display: none;*/
        position: absolute;
        height: 220px;
        top: 0;
        left: 0;
        min-height: initial;
        width: 100%;
    }

    .block-folder.small-folder .folder-article-container {
        float: none;
        margin-left:0;
        min-height: inherit;
        width: 100%;
    }

    .block-folder.small-folder .folder-article-container {
        background-color: #fff;
        margin-left: 20px;
        margin-top: 170px;
        padding-bottom: 20px;
    }

    .block-folder.small-folder .folder-article-container {

    }

    .folder-mobile-img {
        display: block;
        min-width: 100px;
        width:20%;
        height:auto;
        float: right;
        margin-top:20px;
        display: none; /* todo */
    }

    .magazine .folder-article-container .folder-title {
        font-size:0.7em;
        margin-left: 0;
    }

    .folder-article-container .folder-title span {
        padding: 3px 0;
    }

    .block-folder.small-folder .folder-article-container .folder-name {
        font-size: 1.5em;
        padding-left: 15px;
        float: left;
        width: 100%;
        padding-top: 20px;
        margin-bottom: 20px;
    }

    .magazine .folder-article-container .folder-article-list {
        float: left;
        width: 100%;
        padding-left: 15px;
    }

    .block-folder.small-folder .folder-article-container .folder-name + .sponsor-name {
        float: left;
        padding-left: 45px;
    }

    .block-folder.small-folder .folder-article-container .folder-article-list .more-article {
        margin-bottom:0;
    }

    .block-folder.small-folder .folder-article-container .sponsor-name {
        float: left;
        padding-left:45px;
    }

    .block-folder .folder-preview a {height: 310px}
    .block-folder .folder-preview .dossier_firstItem {width: 100%;height: 310px}
}

/*@end DOSSIER*/

/*@group NEWSLETTER*/

.block-nl {
    background-color: #333C45;
    padding: 15px;
}

    .block-nl .nl-title {
        color: #fff;
        text-align: center;
        font-size: 0.77em;
        font-weight:600;
        margin-bottom: 5px;
    }

    .block-nl .nl-form {
        display: flex;
        width: 100%;
        padding-bottom: 10px;
    }

        .nl-form .nl-email {
            background-image: url("../images/email-picto.svg");
            background-color: transparent;
            background-repeat:no-repeat;
            background-position: center left;
            border-top: none;
            border-right: none;
            border-left: none;
            border-bottom: 1px solid #51595f;
            padding-left:30px;
            font-family:"franklin-gothic-urw";
            color: #fff;
            font-size: 1em;
            font-weight:300;
            padding-top:10px;
            padding-bottom:10px;
            width: 100%;
            margin-right:2%;
        }

        .nl-form .nl-btn {
            border:2px solid #fff;
            border-radius:4px;
            background-color: transparent;
            padding: 10px 20px 10px 40px;
            color: #fff;
            background-image: url("../images/arrow-white.svg");
            background-position: 15px center;
            background-repeat:no-repeat;
            text-transform: uppercase;
            font-size:0.7em;
            transition: background 0.2s ease-in, color 0.2s ease-in;
        }

        .nl-form .nl-btn:hover {
            background-color: #fff;
            color: #333C45;
            background-image: url("../images/arrow.svg");
        }

@media (max-width: 769px) {

    .block-nl .nl-form {
        display: block;
        text-align: center;
        padding-bottom: 0;
    }

    .block-nl .nl-form input[type="text"]{
        min-height: 60px;
    }

    .nl-form .nl-btn {
        display: inline-block;
        margin-top: 10px;
    }

}

/*@end NEWSLETTER*/

/*@group Liste*/

    .block-list { margin-bottom: 0 }

    .bottom-sep + .block-list {
        margin-top:-20px;
    }

    .block-list + .bottom-sep { margin-top: 20px }

        .block-list a {
            display: block;
            text-decoration: none;
            padding-top:10px;
            padding-bottom: 10px;
            margin-bottom:0;
            border-bottom: 1px solid #e5e5dd;
        }

        /*.bottom-sep + .block-list a:first-child {*/
            /*border-top: 1px solid #e5e5dd;*/
        /*}*/

            .block-list .list-article {
                display: flex;
                align-items: center;
            }

                .list-article .article-title {
                    color: #333C45;
                    line-height: 1;
                    width: 77%;
                }
                article .illustrated-container{width:33%}
               .list-article .article-title .metas-container{
                        margin-bottom: 10px;
                    }

                    .list-article .article-title > h4 {
                        font-size: 1.5em;
                        margin-top: 10px;
                        margin-bottom: 10px;
                    }

                    .list-article.sponso .article-title >h4 {color:#FF6600}
                    .list-article.partner .article-title >h4 {color:#D61C3B}

                    .list-article .article-title .slug {
                        display: block;
                        float: left;
                        padding-bottom: 2px;
                        color: #D61C3B;
                        font-family:"franklin-gothic-urw";
                        font-weight:500;
                        font-size:0.8em;
                        line-height:1;
                        text-transform: uppercase;
                        border-bottom: 2px solid #D61C3B;
                        vertical-align: middle;
                        margin-right: 8px;
                        margin-top:14px;
                    }

                    .list-article .article-title .metas-container .slug {
                        margin-top:0;
                    }

                    .list-article .article-title .date {
                        display: inline-block;
                        color: #939EA8;
                        font-size:0.65em;
                        line-height:1;
                        vertical-align: middle;
                        margin-top: 2px;
                        margin-right: 5px;
                        font-family:"franklin-gothic-urw";
                        font-weight:500;
                    }

                        .list-article .article-title .title-content {
                            display: inline-block;
                            clear: both;
                        }

                        .block-list a:hover .illustrated-container{
                            transition: opacity 0.3s ease;
                        }

                        .block-list a:hover .illustrated-container {
                            opacity:0.8;
                        }

                        .block-list a:hover .list-article .article-title{
                            opacity:0.9;
                        }

                        .block-list a:hover .list-article .title-content {
                            text-decoration: underline;
                        }

                        .list-article.indicator .article-title {
                            width: 70%;
                            padding-right: 8%;
                            display: inline-block;
                        }

                        .list-article.illustrated .article-title {
                            width: 85%;
                            padding-right: 8%;
                            float: left;
                        }

                        .list-article.indicator .indicator-container {
                            width: 29%;
                            display: inline-block;
                            border-left:1px solid #E5E5DD;
                            padding: 8px 0 8px 15px;
                        }

                        .list-article.illustrated .illustrated-container {
                            position: relative;
                            width: 15%;
                            float: right;
                        }

                            .illustrated-container .article-spe{
                                position: absolute;
                                top: 0;
                                left: 0;
                                font-size: 0.8em;
                                padding-top:4px;
                                padding-right:7px;
                                padding-bottom:3px;
                                padding-left:7px;
                                text-transform: uppercase;
                                background-color: #D61C3B;
                                color: #fff;
                                font-family:"franklin-gothic-urw";
                            }

                            .indicator-container .indicator-info {
                                width: 60%;
                                display: inline-block;
                            }

                                .indicator-info .indicator-name {
                                    text-transform: uppercase;
                                    font-size: 0.6em;
                                    font-weight: bold;
                                    color: #485461
                                }

                                .indicator-info .indicator-place {
                                    text-transform: uppercase;
                                    font-size: 0.6em;
                                    color: #485461
                                }

                        .indicator-container .indicator-number {
                            width: 38%;
                            display: inline-block;
                            text-align: right;
                            font-size: 1.7em;
                            line-height:1;
                            font-family:"mostra-nuova";
                            font-weight:600;
                        }

                            .indicator-container .indicator-number span {
                                font-size: 0.6em;
                            }

                        .indicator-container .indicator-number.positif {
                            color: #39B64A;
                        }

                        .indicator-container .indicator-number.negatif {
                            color: #D81736;
                        }

                        .list-article .article-title a {
                            text-decoration: none;
                            transition: opacity 0.2s ease-in;
                        }

                        .list-article .article-title a:hover {
                            opacity:0.8;
                        }

@media (max-width: 900px) {

    .list-article .article-title {
        width: 75%;
    }

.list-article.illustrated .illustrated-container {
        width: 25%;
    }

.list-article.illustrated .illustrated-container img {
        width: 100%;
        height: auto;
    }
}

@media (max-width: 769px) {
    .block-list {
        margin-bottom:0;
    }
        .block-list a {
            padding-left: 20px;
            padding-right: 20px;
        }

        .list-article .article-title > h4 {
            font-size:1em;
            line-height:1.2;
            margin-top: 5px;
            margin-bottom: 5px;
        }

    .list-article .article-title {width: 55% !important}
    .list-article.fullWidth .article-title,.block-article .block-article-link.fullWidth .block-content {width: 100%}
    .list-article .illustrated-container {width: 45% !important}


    .list-article .illustrated-container figure {width:100%; height:50px; background-position: center; background-repeat: no-repeat; background-size: cover;float: right}

    .list-article .article-title .slug {
        font-size:0.65em;
        margin-top: 10px;
        padding-bottom: 2px;
        /*border-bottom-width: 1px;*/
    }
}
     
/*@end Liste*/

/*@group abonnement*/

.subscription-page {
    text-align: center;
}

    .subscription-header {
        margin-bottom: -280px;
        text-align: center;
        background: #e9b441;
        padding-top: 40px;
        padding-bottom: 290px;
    }

        .subscription-title {
            color: #fff;
            font-size: 2.8em;
            line-height: 1.1;
            text-decoration: underline;
            font-weight: 600;
            margin-bottom:50px;
        }

        h2.subscription-title {
            font-size: 2.6em;
            text-align: center;
            color: #333C45;
        }

        .subscription-baseline {
            text-align: center;
            color: #333C45;
            font-size: 1.3em;
            line-height: 1;
            margin-top:-40px;

        }

        .subscription-header .subscription-baseline {
            color: #fff;

        }

    .offers-container {
        display: inline-block;
        text-align: left;
    }

    .offers-container.paper {
        margin-top: 0;
    }

        .offer {
            display: inline-block;
            vertical-align: top;
            background: #fff;
            border-top:10px solid #333C45;
            width: 100%;
            max-width:380px;
            padding-left:25px;
            padding-right:25px;
            padding-bottom:20px;
            margin-right: 20px;
            margin-bottom: 90px;
        }

        .offer.full {
            display: block;
            margin-left: auto;
            margin-right:auto;
            width: 790px;
            max-width: 95%;
        }

            .offer.full .offer-content{
                border-bottom: 1px solid #333C45;
            }

        .offer .offer-title {
            color: #EAB532;
            font-size:1.6em;
            line-height: 1.2;
            font-weight:500;
            padding-top:25px;
            padding-bottom:25px;
            text-align: center;
            border-bottom:1px solid #333C45;
        }

        .offer .offer-title span {
            color: #EAB532;
            display: block;
            text-align: center;
        }

        .offer .offer-header {
            min-height:305px;
            padding-top:30px;
            padding-bottom:25px;
            border-bottom:1px solid #333C45;
            text-align: center;
        }

        .offer.full .offer-header {
            border-bottom: none;
            text-align: center;
            float: left;
            width: 50%;
        }

        .offer.paper .offer-header {
            min-height:auto;
        }

            .offer .offer-header .illu-container{
                display: inline-block;
            }

            .offer .offer-header span {
                color: #EAB532;
                font-size:2em;
                font-weight:300;
                margin:0 25px;
            }

            .offer-header .offer-illu {
                display:inline-block;
                margin-bottom:40px;
            }

                .offer-header .offer-illu:first-child {
                    margin-left:15px;
                }

                .offer-header.only .offer-illu:first-child {
                    margin-left:0;
                }

            .offer-header .offer-access {
                text-align: center;
                font-size:1.6em;
                font-weight:600;
            }

                .offer-header .offer-access span {
                    display: block;
                    text-align: center;
                    line-height: 0.8;
                    font-size:1.1em;
                }

            .offer-header .offer-devices {
                margin-top:5px;
                text-align: center;
                width: 70%;
                margin-right: auto;
                margin-left: auto;
                font-size:1.1em;
            }

        .offer .offer-pricing {
            text-align: center;
            padding-top:25px;
        }

        .offer .offer-pricing .papier-abonner-info-button {
            border-bottom: 1px solid black;
            padding-bottom: 30px;
            margin-bottom: 20px;
        }

        .footer-full .offer-pricing {
            width: 50%;
            float: left;
        }

            .offer-pricing .offer-price {
                font-size:1.6em;
                font-weight:500;
                margin-bottom:10px;
            }

            .offer-pricing .price-detail {
                font-size:1.1em;
                margin-bottom:20px;
            }

                .offer-pricing .offer-price span {
                    color: #EAB532;
                }

            .offer-pricing .offer-choice {
                display:block;
                padding-top:10px;
                padding-bottom:10px;
                background-color: #e9b441;
                color: #fff;
                text-decoration: none;
                transition: background 0.2s ease-in;
                max-width: 330px;
                margin-left:auto;
                margin-right:auto;
                border-radius:3px;
                font-size: 1em;
                text-transform: uppercase;
            }

            .offer-pricing .offer-choice:hover {
                background-color: #CB9D29;
            }

                .offer-pricing .offer-choice svg {
                    margin-top:-4px;
                    margin-right:10px;
                }


            .offer.full .options-list{
                float: left;
                width: 50%;
                margin-bottom: 20px;
                margin-top: 20px;
                padding-top:10px;
                padding-bottom: 10px;
                padding-left:30px;
                border-left:1px dotted #333C45;
            }


            .offer-detail .options-list{
                margin-top:30px;
            }

                .options-list .offer-option {
                    font-size: 1.1em;
                    margin-bottom:10px;
                    text-align: left;
                }

                    .offer-option .yellow-mask{
                        display: inline-block;
                        width:50px;
                        height: 50px;
                        border-radius: 50%;
                        border:2px solid #e9b441;
                        text-align: center;
                        vertical-align: middle;
                        margin-right: 15px;
                        padding-top:8px;
                    }

                    .offer-option .option-desc{
                        display: inline-block;
                        width: calc(100% - 75px);
                        vertical-align: middle;
                    }

                        .offer-option .yellow-mask img{
                            display: inline-block;
                            vertical-align: middle;
                        }

            .offer-pricing .price-infos {
                text-align: left;
                padding-left:30px;
                list-style: disc;
                color: #EAB532;
                font-size: 1.1em;
            }

            .full .offer-pricing .price-infos {
                padding-left:50px;
            }

            .offer-pricing .price-infos.bottom-sep {
                border-bottom-color: #333C45;
            }

                .offer-pricing .price-infos li{
                    margin-bottom:5px;
                }

                .offer-pricing .price-infos .special-info{
                    list-style: none;
                    margin-bottom:40px;
                }
                .offer-pricing .price-infos .special-info.in-list{
                    margin:10px 0;
                }

                .full .offer-pricing .price-infos .special-info{
                    margin-bottom:0;
                }
                    .offer-pricing .price-infos span {
                        color: #333C45;
                    }

                    .offer-pricing .price-infos .special-info span{
                        color: #B8BEC4;
                    }

                .offer-pricing .special-condition {
                    color: #B8BEC4;
                    font-size:0.8em;
                    text-align: left;
                    margin-bottom: 40px;
                }

@media (max-width: 769px) {

    .subscription-page .subscription-title {
        font-size: 1.5em;
        margin-bottom: 40px;
    }

    .offer {
        display: block;
        width: 95%;
        min-width: 280px;
        max-width: none;
        margin-right:auto;
        margin-left:auto;
        padding-left: 15px;
        padding-right: 15px;
    }

    .offer.full .options-list {
        float: none;
        width: 100%;
        padding: 25px 0;
        border: none;
        margin: 0;
        border-top: 1px solid #333C45;
    }

    .offer .offer-header, .offer.full .offer-header {
        min-height: initial;
        width: 100%;
        float: none;
    }

        .offer-header .offer-illu {
            max-width: 90px;
            height: auto;
            margin-bottom:20px;
        }

        .offer-header .offer-illu:first-child {
            margin-left:0;
        }

        .offer .offer-header span {
            margin-left:5px;
            margin-right:5px;
        }

        .offer-header .offer-access {
            font-size:1.2em;
        }

        .offer-header .offer-devices {
            font-size:0.9em;
        }

    .offer .offer-pricing {
        width: 100%;
        display: block;
        float: none;
    }
        .offer-pricing .offer-price {
            font-size:1.2em;
        }

        .offer-pricing .price-detail {
            font-size:0.9em;
        }

        .offer-pricing .price-infos li {
            font-size:0.75em;
        }

    .offer .offer-title {
        font-size:1.4em;
    }

    .offer-option .option-desc {
        font-size:0.8em;
    }

}

        .contact-list {
            margin-top:40px;
            margin-bottom:30px;
        }

            .contact-list .contact-item {
                display: inline-block;
                color: #333C45;
                margin-right:45px;
                font-weight:600;
                margin-bottom:20px;
            }

                .contact-item .contact-link{
                    background-position: center center;
                    background-repeat: no-repeat;
                    border: 2px solid #333c45;
                    border-radius: 50%;
                    display: inline-block;
                    height: 40px;
                    line-height: 1;
                    margin-right: 5px;
                    padding-top: 8px;
                    text-align: center;
                    transition: background-color 0s ease 0s, color 0.2s ease 0s;
                    vertical-align: middle;
                    width: 40px;
                    margin-right:20px;
                }

.block-subscription .subs-infos {
    background-color: #EAB531;
    position: relative;
    padding:3% 4.5%;

}

.block-subscription .subs-header .subs-infos {padding: 0;margin: 0 0 20px 0}
    .block-subscription .subscription-title {
        text-transform: uppercase;
        text-decoration: none;
        font-weight: 500;
        font-size: 2.2em;
        color: #fff;
        line-height: 1;
        margin-bottom: 10px;
    }

        .block-subscription .subscription-title span{
            font-weight:600;
        }

    .block-subscription .subscription-desc {
        font-size: 1.1em;
        line-height: 1;
        margin-bottom: 20px;
    }

        .block-subscription .subs-btn,
        .magazine-offer .subs-btn {
            display: inline-block;
            text-decoration: none;
            border: 2px solid #FFFFFF;
            color: #fff;
            -webkit-border-radius:3px;
            -moz-border-radius:3px;
            border-radius:3px;
            padding: 9px 21px 9px;
            font-family:"franklin-gothic-urw";
            text-transform: uppercase;
            font-size:0.8em;
            font-weight:300;
            transition: background 0.2s ease-in;
        }

        .block-subscription .subs-btn.big-size {
            font-size:1em;
        }

        .block-subscription .subs-btn:hover,
        .magazine-offer .subs-btn:hover {
            background-color: #cb9d29;
        }

        .block-subscription .subs-btn img {
            display: inline;
            margin-right: 5px;
            margin-top: -3px;
        }

        .subs-illu-devices {
            height: auto;
            max-width: 290px;
            position: absolute;
            right: 4%;
            top: 14.5%;
            width: 100%;
        }

        .subs-infos .already-member {
            font-size:0.7em;
            color: #fff;
            margin-top:5px;
            font-weight:300;
        }

    .block-subscription.list-banner {

    }

    .list-banner-wrapper {
        background-color: #EAB531;
        padding:3% 4.5%;
    }

        .list-banner .subs-infos {
            float: left;
            width: 66%;
        }

        .list-banner .subs-btn {
            float: right;
        }

            .list-banner .subscription-title {
                text-transform: none;
                font-size: 1.5em;
                font-weight:500;
                text-decoration: none;
            }

        .list-banner .article-subs-container {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
        }

            .list-banner .article-subs {
                width: 23.5%;
            }

            .list-banner .article-subs-link {
                display: block;
                position: relative;
                text-decoration: none;
            }

            .article-subs-link .article-img,
            .article-subs-link .article-subs-name,
            .article-subs-link .article-subs-title {
                transition: opacity 0.2s ease-in;
            }

            .article-subs-link:hover .article-img,
            .article-subs-link:hover .article-subs-name,
            .article-subs-link:hover .article-subs-title {
                opacity:0.8;
            }

                .article-subs-container .article-img {
                    background-position: center center;
                    background-repeat: no-repeat;
                    background-size: cover;
                    height: 100px;
                    min-height: 100%;
                    width: 100%;
                }

                    .article-subs-container .article-img img {
                        display: none;
                    }

                .article-subs-container .article-subs-content {
                    height: 105px;
                    overflow: hidden;
                    background-color: #fff;
                    border-bottom: 3px solid #333C45;
                    padding: 10px;
                    text-align: center;
                    font-size:0.9em;
                }

                    .article-subs-content .article-subs-name {
                        text-transform: uppercase;
                        font-weight:600;
                        font-family:"franklin-gothic-urw";
                    }

                    .article-subs-content .article-subs-title {
                        font-size:1.15em;
                        width: 85%;
                        margin-left:auto;
                        margin-right:auto;
                        line-height:1.2;
                    }

@media (max-width: 769px) {

    .article-subs-container .article-subs-content {
        height: 125px;
    }

    .subs-illu-devices {
        position: relative;
        text-align: center;
        margin: 30px auto 0;
        right: initial;
        top: initial;
    }

    .block-subscription {
        margin-top:20px;
        text-align: center;
    }

    .block-subscription .subscription-title {
        font-size:1em;
        text-transform: none;
    }



    .block-subscription .subscription-title span{
        font-size:1.5em;
    }

    .block-subscription .subs-btn {
        margin-bottom:20px;
    }

    .read-again span {
        background-color: #fff;
        border-radius: 3px;
        padding:2px 4px;
        text-transform: uppercase;
        font-size:0.65em;
        font-family:"franklin-gothic-urw";
        font-weight:600;
    }

    .block-subscription.list-banner {
        display: none;
    }

    .contact-list .contact-item {
        position: relative;
        padding-left: 50px;
        word-break: break-all;
        font-size: 0.9em;
        width: 100%;
        margin-right: 0;
        margin-bottom: 30px;
        text-align: left;
    }
        .contact-item .contact-link {
            position: absolute;
            left: 0;
            top: 50%;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
        }
        .contact-item a {
            display: block;
        }

}

/*@end abonnement*/

/*@group indicateur*/

.block-indicator {
    color: #fff;
    background-color: #333C45;
}
    
    .block-indicator .indicator-header {
        padding: 0 0 20px 0;
        text-align: center;
        text-transform: uppercase;
        background-color: #F5F5F5;
    }
        .block-indicator .indicator-header h3 {
            font-size: 1.1em;
            font-weight: 600;
            color: #333C45;
        }
    .block-indicator .indicator-wrapper {
        margin-right: -2%;
        padding: 15px 20px 15px 0;
    }

        .indicator-wrapper .indicator-item {
            display: block;
            text-decoration: none;
            border-right: 1px solid #515960;
            float: left;
            padding-right: 2%;
            margin-left: 2%;
            width: 31.33%;
        }

        .indicator-wrapper .indicator-item:last-child {
            border-right: none;
        }

            .indicator-wrapper .indicator-name {
                border-top: 10px solid #fff;
                padding-top: 20px;
                font-size: 1.2em;
                line-height: 1;
                margin-bottom: 10px;
                transition: border 0.2s ease-in;
            }
            .indicator-wrapper .cont {
                height: 95px;
                margin: 0 0 10px 0;
            }

            @media (min-width: 769px) {
                .indicator-wrapper .indicator-item:hover .indicator-name {
                    border-top: 10px solid #939ea8;
                }
            }

            .indicator-item .indicator-date {
                color: #939EA8;
                font-family:"franklin-gothic-urw";
                font-size: 0.8em;
                text-transform: uppercase;
                line-height: 1;
                margin-bottom: 20px;
            }

            .indicator-item .indicator-number {
                font-size: 2.7em;
                line-height: 1;
                font-family:"mostra-nuova";
                font-weight: 600;
            }

            .indicator-item .indicator-number.positif {
                color: #39B64A;
            }

            .indicator-item .indicator-number.negatif {
                color: #D81736;
            }

                .indicator-item .indicator-number span {
                    font-size: 0.75em;
                }

            .block-indicator .indicator-footer {
                border-top: 1px solid #515960;
                text-align: right;
                text-decoration: none;
                padding: 20px;
                text-transform: uppercase;
                font-size:0.75em;
            }

                .block-indicator .indicator-footer a {
                    display: inline-block;
                    text-decoration: none;
                    margin-left:0;
                    transition: opacity 0.2s ease-in;
                }

                .block-indicator .indicator-footer a:hover {
                    opacity: 0.8;
                }

                    .block-indicator .indicator-footer img{
                        display: inline-block;
                        vertical-align: top;
                        margin-top: 3px;
                        margin-right: 3px;
                    }

@media (max-width: 900px) {

    .indicator-item .indicator-number {
        font-size:4.3em;
    }

}

@media (max-width: 769px) {

    .block-indicator .indicator-wrapper {
        padding-left:20px;
        padding-right:20px;
        margin-right:0;
    }

    .indicator-wrapper .indicator-item {
        width: 100%;
        margin-left: 0;
        padding-right:0;
        border-right:none;
    }

    .indicator-wrapper .indicator-item:first-child .indicator-name {
        border-top: 10px solid #fff;
    }

    .indicator-item .indicator-number {
        font-size:3em;
        margin-bottom:20px;
    }

    .indicator-wrapper .indicator-name {
        border-top: 1px solid #515960;
    }

    .indicator-item .indicator-date {
        margin-bottom:10px;
    }

}
/*@end indicateur*/

/*@group EDITO*/

.block-edito {
    border-top: 10px solid #333C45;

    text-align: center;
}

.block-edito .edito-container {
    background-color: #fff;
    padding:40px 100px 30px;
}

    .block-edito .slug {
        display: inline-block;
        color: #D61C3B;
        text-transform: uppercase;
        border-bottom:2px solid #D61C3B;
        font-family: "franklin-gothic-urw";
        font-size:1.05em;
        font-weight:500;
        letter-spacing: 0.18em;
        padding-bottom:2px;
        line-height: 1;
        margin-bottom:20px;
    }

    .block-edito .edito-title {
        font-size: 2.1em;
        font-weight: 600;
        line-height: 1;
        margin-bottom: 15px;
        padding-left: 40px;
        padding-right: 40px;
    }

    .block-edito .edito-autor {
        line-height: 1;
        font-size:0.9em;
        font-family: "franklin-gothic-urw";
        margin-bottom:20px;
    }

        .block-edito .edito-autor a {
            text-decoration: none;
        }

    .block-edito .edito-standfirst {
        font-family:"freight-text-pro";
        font-size: 1.3em;
        margin-bottom: 15px;
    }

    .block-edito .read-full {
        display: inline-block;
        text-decoration: none;
        line-height: 1;
        text-transform: uppercase;
        font-size:0.73em;
        font-weight:600;
        transition: opacity 0.2s ease-in;
    }

    .block-edito .read-full:hover {
        opacity:0.8;
    }

        .block-edito .read-full img {
            display: inline-block;
            margin-right:5px;
            vertical-align: top;
        }

@media (max-width: 769px) {
    .block-edito .edito-container {
        padding: 30px 20px;
    }
}

/*@end EDITO*/

/* @end BLOCS */

/* @group filter */

.filter .filter-publications {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 10px solid #333C45;
}
    .filter .filter-publications .meta-title{
        text-transform: uppercase;
        font-size: 0.7em;
        font-weight: 600;
        display: block;
    }

    .filter .filter-publications .title{
        font-size: 2.5em;
        font-weight: 600;
        display: inline-block;
        vertical-align: middle;
    }

    .add-alert {
        text-decoration: none;
        border:2px solid #333C45;
        padding:8px 10px 8px 35px;
        border-radius: 3px;
        vertical-align: middle;
        position: relative;
        margin-left: 20px;
        transition: background, color 0.2s ease-in;
    }

    .add-alert span::before {
        background-color: #333C45;
        content: "";
        display: inline-block;
        height: 15px;
        left: 17px;
        position: absolute;
        top: 11px;
        transform: rotate(90deg);
        width: 2px;
        transition: background 0.2s ease-in;
    }

    .add-alert span::after {
        background-color: #333C45;
        content: "";
        display: inline-block;
        height: 15px;
        left: 17px;
        position: absolute;
        top: 12px;
        transform: rotate(180deg);
        width: 2px;
        transition: background 0.2s ease-in;
    }
    
    .add-alert:hover {
        background-color: #333C45;
        color: #fff;
    }

    .add-alert:hover span::before,
    .add-alert:hover span::after {
        background-color: #fff;
    }

@media (max-width: 769px) {

    .main-container.width-wrap.filter {
        padding-left: 20px;
        padding-right: 20px;
    }

    .filter .filter-publications {
        text-align: center;
    }

    .filter .filter-publications .title {
        display: block;
        width:50%;
        margin-left:auto;
        margin-right: auto;
        text-align: center;
        font-size:1.6em;
        line-height:1;
        margin-bottom:15px;
    }

    .filter .filter-publications .meta-title {
        text-align: center;
        margin-bottom:15px;
    }

    .add-alert {
        display: inline-block;
        margin-left:0;
        margin-bottom:10px;
        font-size:0.7em;
        font-weight:600;
        text-transform: uppercase;
    }

    .add-alert span::before {
        top:7px;
    }

    .add-alert span::after {
        top:8px;
    }

    .filter .block-list a{
        padding-left: 0;
        padding-right:0;
    }

}


/* @end filter */

/* @group author  */

.author-description {
    margin-bottom: 30px;
}

.author-description .rounded-mask {
    float: left;
    max-width: 60px;
}

.author-description .author-informations{
    width: 70%;
    float: left;
}

    .author-description .author-informations .author-name {
        font-size: 2.3em;
        font-weight: 600;
        margin-bottom: 10px;
        line-height: 1;
    }

    .author-description .author-informations .author-bio {
        font-size: 1em; 
        margin-bottom: 15px;
    }
    

    .author-description .social-buttons .social {
        text-transform: uppercase;
        text-decoration: none;
        font-size: 0.7em;
        font-weight: 600;
        display: inline-block;
        padding: 8px 10px;
        border: 2px solid #333C45;
        border-radius: 3px;
        margin-right: 10px;
        transition: color,background 0.2s ease-in;
    }

    
    .author-description .social-buttons .social:hover {
        background-color: #333C45;
        color: #fff;
    }

    .author-description .social-buttons svg {
        margin-right: 5px;
        margin-top: -3px;
    }

.author-publications {
    font-size: 0.75em;
    font-weight: 600;
    border-bottom: 8px solid #333C45;
    padding-bottom: 10px;
    margin-bottom: 15px;
}

@media (max-width: 900px) {
.author-publications{
        margin-left: 20px;
        margin-right: 20px;
    }

    .author-description {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media (max-width: 769px) {

    .author-description .author-informations {
        float: none;
        width: 100%;
    }

    .author-description .author-informations .author-name {
        height: 60px;
        padding-top:10px;
        font-size:1.5em;
    }

    .author-description .rounded-mask {
        max-width:50px;
    }

    .author-description .social-buttons .social {
        margin-right:0;
        width:48%;
    }

}

/* @end author */

/* @group search */
.welcome-message{width: 100%;max-width: 1000px;margin: 10px auto;padding: 15px;background-color: #eceded;border-radius: 4px;position: relative}
.welcome-message p{margin: 0 0 10px 0}
.welcome-message p.welcome-title{text-align: center}
.welcome-message p span{font-weight: bold}
.welcome-message .close-welcome {background-color: #eceded;
    position: absolute;
    top: 15px;
    right:15px;
    width: 18px;
    height: 18px;
    border: none;}
.welcome-message .close-welcome::before {
    display: block;
    content: "";
    background-color: #B7BDC3;
    position: absolute;
    width: 18px;
    height: 3px;
    top: 5px;
    left: 0;
    transform: rotate(-45deg);}
.welcome-message .close-welcome::after {
    display: block;
    content: "";
    background-color: #B7BDC3;
    position: absolute;
    width: 18px;
    height: 3px;
    top: 5px;
    left: 0;
    transform: rotate(45deg);}

.search-bar {
    position: absolute;
    top: -100px;
    left:0;
    right: 0;
    z-index: 5;
    background-color: #49545F;
    padding-bottom: 55px;
    padding-top: 55px;
    transform-origin: top center;
    pointer-events: none;
    transition: transform 0.25s ease-in;
    overflow: hidden;
}

.search-bar.open {
    pointer-events: auto;
}

.search-bar.result {
    display: block;
    padding-bottom: 30px;
    padding-top: 55px;
    position: static;
    pointer-events: auto;
    transform: scale(1);
    opacity:1;
    pointer-events: auto;
}

.search-bar .results-number {
    color: #B7BEC4;
    text-transform: uppercase;
    margin-top: 15px;
    font-size: 12px;
}

.search-overlay {
    display: none;
    position: fixed;
    z-index: 2;
    top: 120px;
    left:0;
    right: 0;
    bottom: 0;
    background-color: #333C45;
    opacity: 0;
    transition: opacity 0.1s ease-in;
}


.search-overlay.open {
    display: block;
    opacity: 0.3;
}

    .search-bar .search-close {
        background-color: #49545F;
        position: absolute;
        top: 20px;
        right: 20px;
        width:18px;
        height: 18px;
        border: none;
    }

    .search-bar .search-close::after {
        display: block;
        content: "";
        background-color: #B7BDC3;
        position: absolute;
        width: 18px;
        height:3px;
        top: 5px;
        left: 0;
        transform: rotate(45deg);
    }

    .search-bar .search-close::before {
        display: block;
        content: "";
        background-color: #B7BDC3;
        position: absolute;
        width: 18px;
        height:3px;
        top: 5px;
        left: 0;
        transform: rotate(-45deg);
    }

    .search-bar .search-form {
        background-color: #49545F;
        width: 100%;
        margin-left:auto;
        margin-right: auto;
        position: relative;
        border-bottom: 1px solid #666F78;
    }

        .search-form .search-label {
            background-color: #49545F;
            color: #fff;
            font-size: 1.5em;
        }

        .search-form .search-field {
            background-color: #49545F;
            color: #fff;
            border: none;
            font-size: 1.5em;
            margin-left: 3%;
            padding-top:8px;
            padding-bottom:3px;
            padding-left:10px;
            padding-right:3%;
            margin-bottom:15px;
            width: 75%;
        }

        .search-btn-ok {
            display: inline-block;
            background-image: url('../images/search-btn.svg');
            background-color: transparent;
            background-size:cover;
            width: 17px;
            height: 17px;
            border: none;
            position: absolute;
            top: 25px;
            right: 0;
            opacity: 0.8;
            padding: 0;
        }

        .search-bar .nb-result {
            margin-top:30px;
            font-size:0.8em;
            color: #B8BEC4;
            text-transform: uppercase;
        }
        .search-result .block-list .list-article p {
            margin-bottom: 5px;
        }
    
@media (max-width: 1000px) {
    .search-bar {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media (max-width: 769px) {

    .search-bar.result {
        padding: 30px 0;
    }

    .result .search-form .search-label {
        font-size:1.2em;
    }

    .result .search-form .search-field {
        font-size: 1.1em;
        width: 100%;
        padding-left: 0;
        margin-left: 0;

    }

    .result .search-btn-ok {
        top:15px
    }

}
/* @end search */

/* @group article*/

.article-container {
    margin-bottom:55px;
}

    .article-container.no-category .article-header {
        padding-top: 20px;
    }

    .article-container .article-header {
        border-top: 10px solid #D61C3B;
        padding-top: 30px;
        padding-bottom: 30px;
        border-bottom: 1px solid #E5E5DD;
        margin-bottom: 25px;
    }

    .article-container .article-header.large-image {
        padding-bottom: 15px;
    } 

        .article-container .article-header .special-issue-container {
            font-family: "franklin-gothic-urw";
            font-size: 0.7em;
            text-transform: uppercase;
            font-weight: 600;
            margin-bottom: 20px;
            padding-bottom: 25px;
            border-bottom: 1px solid #E5E5DD;
        }

        .article-container .article-header .special-issue-infos {
            float: left;
        }

        .article-container .article-header .special-issue-infos ~ .partnering{
            display: inline-block;
            margin-top: 7px;
        }
            
            .article-container.special.partner-only .special-issue-container .partnering {
                display:inline-block;
                /*padding: 8px 0;*/
                vertical-align: middle;
            }

            .article-container.special.partner-only .special-issue-container .partner-logo {
                display: inline-block;
            }
    
            .article-container.special.partner-only .special-issue-container .warning {
                display: inline-block;
                text-align: right;
                vertical-align: middle;
                width: 50%;
            }

            .article-header .special-issue-container .special-issue-link {
                margin-left: 5px;
                margin-right: 10px;
                color: #d61c3b;
                padding: 8px 10px;
                text-decoration: none;
                border: 1px solid #E5E5DD;
                border-radius: 5px;
                transition: color,background-color 0.2s ease;
                display: inline-block;
            }

            .article-header .special-issue-container .special-issue-link:hover {
                color: #333C45;
                background-color: #fff;
            }
    
    .article-container.special .article-header {
        padding-top: 0;
        border-top: 10px solid #D61C3B;
    }

        .article-container.special .special-issue-container {
            padding-top: 25px;
            padding-left: 10px;
            padding-right: 10px;
            background-color: #fff;
            border: none;
        }
        .article-container.special.special-issue .special-issue-container {
            padding-top: 25px;
            padding-left: 10px;
            padding-right: 10px;/*
            border-bottom: 1px solid #E5E5DD;
            background-color: transparent;*/
        }
        
            .article-container.special .special-issue-container .partner-logo {
                display: inline-block;
                margin-left: 10px;
                margin-top: -5px;
            }

            .article-container.special .special-issue-container .warning{
                font-weight: 500;
                width: 28%;
                font-family: "europa";
                color: #b0b0b0;
                font-size: 0.9em;
                float:right;
                text-transform: none;
                margin-top:7px;
            }

            .article-container.special .special-issue-container .warning.big-size {
                font-size: 1.1em;
                text-transform: uppercase;
            }
    
    .article-container.sponso .article-header {
        border-top: 10px solid #FF6600;
    }

        .article-container.sponso .article-header .slug {
            color: #FF6600;
            border-bottom: 2px solid #FF6600;
        }

        .article-container .article-header .slug {
            border-bottom: 2px solid #d61c3b;
            color: #d61c3b;
            display: inline-block;
            font-family: "franklin-gothic-urw";
            font-size: 0.7em;
            font-weight: 600;
            line-height: 1;
            padding-bottom: 2px;
            margin-bottom: 30px;
            text-transform: uppercase;
            position: relative;
        }

        .slug a {
            text-decoration: none;
            transition: opacity 0.2s ease-in;
        }

        .slug a:hover {
            text-decoration: none;
            opacity:0.8;
        }

        .article-container .article-header .article-title {
            font-size:3.31em;
            font-weight:600;
            line-height: 1.05;
            margin-bottom: 20px;
        }

        .article-container .article-header .article-title a {
            text-decoration: none;
        }

        .article-container .article-header .article-title.sponso-title {
            color: #ff6600;
        }

        .article-container .article-header .article-metas {
            font-size: 0.87em;
            line-height: 1;
        }
        
        .article-container .article-header .standfirst-illustration {margin-top: 30px;margin-bottom: 20px;;width:100%;height:538px;background-size:cover;background-repeat: no-repeat;background-position: center center }
            .article-container .article-header .standfirst-illustration > img {
                width: 100%;
                height:auto;
                margin-bottom:25px;
            }

    .article-container .article-header .standfirst-illustration figcaption{position: absolute;bottom: -30px; border: none;padding-bottom: 0;margin-bottom: 0}
    .article-container .article-header .standfirst-illustration figcaption::before,.article-container .article-body .article-content .image .caption::before {content:'';display: inline-block;clear:both;width: 14px;height: 13px;position: absolute;margin-left: -30px;margin-right: 10px;top:5px;background-image:url('../images/photo-picto.svg');background-size: cover;background-repeat: no-repeat}

    .article-container .article-body {width: 57.3%;font-family:"freight-text-pro" !important;float: left;max-width: 580px;}
    .article-container .indicator-container {width: 57.3%;max-width: 580px;padding: 0 0 20px 0; border-bottom: 1px solid #E5E5DD;margin: 0 0 10px 0}
    .article-container .indicator-container .name {color:#D61C3B;text-transform: uppercase;font-weight: 600;font-size:1em;}
    .article-container .indicator-container .indicator-name{ font-size: 1.3em;font-weight: 600;margin: 7px 0 0 0;}
    .article-container .indicator-container .indicator-date{line-height: 0;margin: 4px 0 10px 0;text-transform: capitalize;}
    .article-container .indicator-container .content{width: 85%}
    .article-container .indicator-container .content .mensuelle,.article-container .indicator-container .content .variation{width: 47%;font-weight: 600;border-top: 1px solid #E5E5DD;margin: 15px 0}
    .article-container .indicator-container .content .big-nb{font-size: 3.3em;font-family: "mostra-nuova";}
.article-container .indicator-container .content p {line-height:16px;font-weight: 100;margin: -12px 0 0 0}
.article-container .indicator-container .content .right{float: right}
    .article-container .indicator-container .content .left{float: left}
    .article-container .indicator-container .content::after{display: block;content:'';clear: both}
    .article-container .indicator-container a::before{display: inline-block;content:'';clear: both;margin: 0 10px 0 0;background-image:url('../images/arrow-white.svg');width: 20px;height: 15px;background-size: contain;background-repeat: no-repeat;}
    .article-container .indicator-container a{text-transform: uppercase;font-size: 0.75em;color: #fff;background-color: #3E4751; padding: 14px 20px;border-radius: 3px;text-decoration: none;display: flex;width: 155px}
    .article-container .indicator-container a:hover{background-color: #333C45;}
    .article-container .article-body .article-content .image{border-bottom: 1px solid #E5E5DD; margin: 0 0 25px 0}
    .article-container .article-body .article-content .image .fig {margin: 0 0 15px 0;cursor: zoom-in;}
    .article-container .article-body .article-content .image .fig figure{height: 310px;background-repeat: no-repeat;background-position: center center;background-size: contain}
    .article-container .article-body .article-content .image .caption {font-family: "europa";color: #485461;font-size:13px;padding-left: 30px;position: relative;    margin: 0 0 25px 0;}
    .article-container .articleImageOverlay{position: fixed; background: rgba(38,38,38,0.8); top: 0;left: 0;bottom: 0;right: 0;z-index: 20; display: none;}
    .article-container .articleImageOverlay.active{display: flex}
    .article-container .articleImageOverlay .overlayHighresImage{background-size: contain;background-repeat: no-repeat;background-position: center center;color: white;margin: auto;position: relative;width:1000px;height: 800px;}
    .article-container .articleImageOverlay .overlayHighresImage .overlayClose{color: #D6D1D1;font-size: 30px; position: fixed;z-index:10;left: 85%;top:30px; padding:20px;}

    .article-body .article-standfirst {
            font-size: 1.3em;
            line-height: 1.5;
            font-weight:600;
            margin-bottom: 15px;
        }

        .article-body .standfirst-illustration {
            position: relative;
        }

            .article-body .standfirst-illustration a {
                display: block;
                position: absolute;
                top: 10px;
                left: 10px;
                border:1px solid #fff;
                line-height: 1;
                color: #ffffff;
                border-radius: 5px;
                padding: 10px 12px 8px;
                text-decoration: none;
                font-family: "europa";
                font-size:0.7em;
                font-weight:600;
                background-color: rgba(0, 0, 0, 0.5);
                transition: background 0.2s ease-in;
            }

            .article-body .standfirst-illustration a:hover {
                background-color: rgba(0, 0, 0, 1);
            }

            .article-body .standfirst-illustration a img {
                display: inline;
            }

            .article-body .standfirst-illustration > img {
                width: 100%;
                height:auto;
                margin-bottom:25px;
            }


            .standfirst-illustration .caption {
                font-family: "europa";
                color: #485461;
                font-size:0.8em;
                padding-left: 30px;
                padding-bottom:17px;
                border-bottom: 1px solid #E5E5DD;
                margin-bottom: 25px;
            }

                .standfirst-illustration .caption img {
                    display: inline-block;
                    margin-left: -30px;
                    margin-right: 10px;
                }

        .article-body .article-content{font-size: 21px;line-height: 1.5;margin-bottom: 30px;position: relative}
        .article-body .article-content.premium::after {content: "";position: absolute;bottom: 0;left: 0;right: 0;height: 150px;background:-moz-linear-gradient(rgba(255,255,255,0),#f8f8f8);background:-webkit-linear-gradient(rgba(255,255,255,0),#f8f8f8);background:linear-gradient(rgba(255,255,255,0),#f8f8f8)}
        .article-body .subscribe {margin: 0 0 40px 0}
        .article-body .subscribe h3 {font-size: 18px;text-align: center;margin: 0 0 30px 0}
        .article-body .subscribe .olj-message{color: #636161;}
        .article-body .subscribe .olj-message a{color: #db1429;}
        .article-body .subscribe .btn{display:inline-block;width:48%;font-family: "europa";;text-transform: uppercase;text-align:center;text-decoration: none;padding: 15px 20px 15px;color:#fff;border-radius: 3px; font-size:0.8em;font-weight: 600;}
        .article-body .subscribe .subscribe-btn {background-color: #e9b441;}
        .article-body .subscribe .subscribe-btn:hover{background-color:#cb9d29}
        .article-body .subscribe .account-btn {background-color: white;float: right;color:#333c45;    border: 1px solid #333c45;}
        .article-body .subscribe .account-btn:hover {background-color:#333c45;color:white}
        .article-body .article-content p {margin: 0 0 20px 0}
        .article-body .article-content img { margin: 10px 0; width: 100%; height: auto; top: 5px!important;} /* display:none; width: 80px!important; */
        .article-body .article-content img.pull-left {margin: 10px 10px 10px 0}
        .article-body .article-content img.pull-right {margin: 10px 0 10px 10px}
        .article-body .article-content a {color: #D61C3B;    text-decoration: none;}

        .article-body h2 {font-family: "europa";font-weight: 600;font-size: 1.1em}
        .article-body h3 {font-family: "europa";font-weight: 600}
        .article-body h4 {font-family: "europa";font-weight: 600;font-size: 0.9em}

        .article-body .article-content ~ .info-bloc {
            margin-top: -5px;
        }
        .article-body .article-content table tbody tr td{text-align: left}

        .article-body .article-content ~ h3 {
            padding-top: 10px;
        }

        .article-body .info-bloc {
            border-top: 1px solid #E5E5DD;
            border-bottom: 1px solid #E5E5DD;
            margin-bottom: 20px;
            padding-top:30px;
            padding-bottom:45px;
        }

            .article-body .info-bloc .slug {
                color: #d61c3b;
                font-size: 0.8em;
                font-family: "franklin-gothic-urw";
                font-weight: 500;
                line-height: 1;
                padding-bottom: 2px;
                margin-bottom:25px;
                text-transform: uppercase;
            }

        .article-body .info-bloc.key-number {
            padding-bottom:30px;
        }

            .key-number .digit {
                font-family: "mostra-nuova";
                font-size: 1em;
                font-weight: 500;
                line-height: 0.7;
                margin-bottom: 20px;
            }

                .key-number .digit span {
                    font-size: 4.3em;
                    font-weight: 600;
                }

            .key-number .legend {
                font-family: "europa";
                font-size:1.22em;
            }

        .article-body .timeline {
            padding-bottom: 25px;
        }

            .article-body .date-list li {
                font-family: "franklin-gothic-urw";
                font-size:1.1em;
                margin-bottom: 15px;
                width: 90%;
            }

            .article-body .date-list li:last-child {
                margin-bottom: 0;
            }

                .article-body .date-list li .key-date {
                    color: #fff;
                    padding: 2px 5px;
                    line-height: 1.8;
                    background-color: #333c45;
                    font-weight:500;
                    margin-right: 10px;
                }

        .article-body .bio {
            padding-bottom: 25px;
        }

            .bio .bio-portrait {
                display: inline-block;
                width: 70px;
                height: 70px;
                background-size: cover;
                background-repeat:no-repeat;
                border-radius: 50%;
                vertical-align: middle;
                margin-right: 20px;
            }

                .bio .bio-portrait img {
                    display: none;
                }

            .bio .person-info {
                display: inline-block;
                vertical-align: middle;
                font-size:0.9em;
                font-family: "franklin-gothic-urw";
                text-transform: uppercase;
                font-weight:500;
            }

                .bio .person-info .person-name {
                    font-size:0.9em;
                    color: #D81736;
                }

                .bio .person-info .person-job {
                    font-size:0.9em;
                    color: #939EA8;
                }



            .article-body blockquote {
                font-family: "franklin-gothic-urw";
            }

            .bio blockquote {
                font-family: "europa";
                font-size:1em;
                font-weight:600;
                line-height:1.1;
                margin-top: 25px;
                margin-bottom: 25px;
                width: 66%;
            }

            .bio blockquote p {
                font-size: 1.6em;
                margin-top: 15px;
                line-height:1.1;
                margin-bottom: 0;
            }


        .article-body .focus {
            border: 1px solid #E5E5DD;
            padding: 30px;
            font-family: "franklin-gothic-urw";
            line-height: 1;
            margin-bottom:20px;
        }
    
        .article-body .focus + .focus{
            margin-bottom: 0px;
            margin-top: 30px;
        }

        
        .article-body .focus + .focus:last-child {
            margin-bottom: 40px;
        }

        .article-body .focus.big-photo {
            padding: 0 0 30px 0 ;
        }

        .article-body .focus.big-photo img {
            width: 100%;
            height:auto;
            margin-bottom: 30px;
        }

            .article-body .focus.big-photo .focus-title,
            .article-body .focus.big-photo .focus-txt {
                padding: 0 30px;
            }

            .article-body .focus.small-photo img {
                float: right;
                margin-left: 25px;
                margin-bottom: 15px;
            }

            .focus .focus-title {
                color: #D81736;
                margin-bottom: 20px;
                font-weight:500;
                font-size: 17px;
                font-style: normal;
                text-transform: uppercase
            }

                .focus .focus-title span {
                    color: #333C45;
                }

            .focus .focus-txt {
                font-size: 17px;
                line-height:1.5;
                font-style: normal;
            }
            .focus .focus-txt::after {  clear: both; display: block; content: ' ' }

            blockquote.info-bloc p {
                font-family: "europa";
                font-size:1.6em;
                font-weight:600;
                line-height:1.1;
                margin-bottom: 20px;
                width: 70%;
            }

            blockquote.info-bloc p::before {
                font-family: "franklin-gothic-urw";
                display: inline;
                content: open-quote;
            }

            blockquote.info-bloc p::after {
                font-family: "franklin-gothic-urw";
                display: inline;
                content: close-quote;
            }

            blockquote.info-bloc cite {
                color: #D81736;
                font-size:0.77em;
                font-weight:500;
                text-transform: uppercase;
                line-height: 1;
            }

            blockquote.info-bloc .quote-autor-job {
                font-weight:500;
                font-size:0.77em;
                text-transform: uppercase;
                color: #939EA8;
                line-height: 1;
            }

        .article-body .info-bloc.graphic {

        }

            .info-bloc.graphic .slug,
            .info-bloc.table .slug {
                font-size:0.8em;
                max-width:400px;
            }

            .info-bloc.table {
                border-bottom: none;
                padding-bottom: 0;
            }

            .info-bloc.graphic .source,
            .info-bloc.table .source {
                font-family: "franklin-gothic-urw";
                font-size:0.85em;
            }

        .article-body .info-bloc.table {
            margin-bottom: 30px;
        }
        
        .table {
            position: relative;
        }

        .article-body .table{
            position: inherit;
        }
        .table .table-scale::before {
            display: inline-block;
            content: "";
            width: 13px;
            height:13px;
            background-color: #333C45;
            border-radius: 50%;
            vertical-align: middle;
            margin-right:5px;
            margin-top:-4px;
        }
        
        .table .table-scale {
            font-family:"europa";
            font-size:0.9em;
            vertical-align: middle;
            margin-bottom: 15px;
            margin-top: -15px;
        }

            .article-body .scrollable-table {
                position: relative;
                /*transition: width 200ms cubic-bezier(0.325, 0.63, 0, 1), max-width 200ms cubic-bezier(0.325, 0.63, 0, 1);
                max-width: 100%;
                width: 100%;*/
            }

                /*.article-body .scrollable-table:hover {
                    max-width: 960px;
                    width: calc(100vw - 40px);
                    z-index: 5;
                }*/

            .article-body .table-wrapper {
                overflow-x: auto;
                overflow-y: hidden;
                background: linear-gradient(90deg, #f5f5f5 100%, rgba(255,255,255,0)) 0 0,linear-gradient(270deg, #f5f5f5 100%, rgba(255,255,255,0)) 100% 0,linear-gradient(90deg, #e3e3e3 95%, rgba(255,255,255,0)) 0 0,linear-gradient(270deg, #e3e3e3 -7px, rgba(255,255,255,0)) 100% 0;
                background-repeat: no-repeat;
                background-color: #f5f5f5;
                background-size: 200px 100%,12px 100%,200px 100%,12px 100%;
                background-attachment: local,local,scroll,scroll;
            }

            .article-body .table-wrapper::-webkit-scrollbar {
              -webkit-appearance: none;
              width: 4px;
              height: 8px;
            }
            .article-body .table-wrapper::-webkit-scrollbar-thumb {
              border-radius: 4px;
              background-color: rgba(0, 0, 0, .5);
              -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
              box-shadow: 0 0 1px rgba(255, 255, 255, .5);
            }

                .table-wrapper .shadow{
                    position: absolute;
                    top: 0;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    -webkit-box-shadow: inset -120px 0px 82px -43px rgba(245,245,245,1);
                    box-shadow: inset -120px 0px 82px -43px rgba(245,245,245,1);
                    z-index: 2;
                }

                
                .table .scrollable-table-overlay{
                    position: fixed;
                    top: 0;
                    bottom: 0;
                    left: 0;
                    right: 0;
                    background-color: #000;
                    z-index: 0;
                    opacity: 0;
                    display: none;
                    z-index: 2;
                }

                .table .scrollable-table-overlay.active{
                    display: block;
                    opacity: 0.3;
                }

                .article-body .scrolling-table {
                    margin-left: 180px;
                    table-layout: fixed;
                    cursor: default;
                    font-family: "franklin-gothic-urw";
                    text-align: center;
                    border-spacing: 10px 0;
                    border-collapse: separate;
                    z-index: 1;
                }
    
                    .article-body .scrolling-table th {
                        text-transform: uppercase;
                        font-weight: 500;
                        font-size:0.68em;
                        border-bottom: 1px solid #B8BEC4;
                        padding-bottom:10px;
                        min-width: 90px;
                        white-space: nowrap
                    }
    
                    .article-body .scrolling-table td {
                        border-bottom: 1px solid #E5E5DD;
                        font-size: 14px;
                        vertical-align: middle;
                        overflow-x: hidden;
                        overflow-y: auto;
                        height:44px;
                        overflow-y: hidden;white-space: nowrap;
                    }

                    .article-body .scrolling-table td .v-centered{
                        font-size:0.8rem;
                        margin-bottom: 0;font-weight: bold;
                    }
                    .article-body .scrolling-table td .v-centered p{margin: 0}
                    .article-body .scrolling-table tr td:first-child{
                        background: #F5F5F5;
                        -ms-transform: translateZ(0);
                        -webkit-transform: translateZ(0);
                        transform: translateZ(0);
                        position: absolute;
                        left: 0;
                        border-right: 1px solid #f2f2f2;
                        min-width: 190px !important;
                        max-width: 190px !important;
                        width: 190px;
                        font-size: 0.77em;
                        font-weight: 500;
                        padding-right: 30px;
                        text-align: left;
                    }

                    .article-body .scrolling-table tr th:first-child{
                        text-transform: uppercase;
                        font-weight: 500;
                        font-size:0.68em;
                        border-bottom: 1px solid #B8BEC4;
                        padding-bottom:10px;
                        min-width: 190px !important;
                        max-width: 190px !important;
                        width: 190px;
                        padding-right: 30px;
                        text-align: left;
                        background: #F5F5F5;
                        -ms-transform: translateZ(0);
                        -webkit-transform: translateZ(0);
                        transform: translateZ(0);
                        position: absolute;
                        left: 0;
                        top:0;
                        height: 41px;
                    }

    .article-container .block-article-list {
        padding-top: 25px;
        border-top: 1px solid #E5E5DD;
    }

        .article-recommendation {
            text-align: center;
            text-transform: uppercase;
            line-height: 1;
            font-size:0.8em;
            font-family: "europa";
            font-weight:600;
            margin-bottom: 25px;
        }

    .article-column {
        position: relative;
        float: right;
        width: 32%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

        .article-column .article-pub{
            font-size:0.55em;
            text-transform: uppercase;
            -webkit-transform: translateY(0);
            -ms-transform: translateY(0);
            -moz-transform: translateY(0);
            transform: translateY(0);
        }

        .article-column .article-pub img{
            margin-top: 2px;
        }

    .article-container .folder-article-container {
        width: auto;
        margin-top: 0;
        float: none;
        position: static;
        margin-bottom: 35px;
    }

        .article-container .folder-article-container .folder-title {
            font-family: europa;
            background-color: #D61C3B;
            color: #fff;
            text-transform: uppercase;
            font-size: 0.8em;
            padding: 4px 10px;
        }

        .article-container .folder-article-container .folder-name {
            font-size: 1.1em;
            font-weight: 500;
            padding-top: 10px;
            padding-bottom: 10px;
            padding-left: 10px;
            padding-right: 40px;
            margin-bottom: 30px;
        }

        .article-container .folder-article-list {
            font-family: "europa";
            margin-top: 20px;
            padding-bottom: 30px;
            padding-left: 20px;
        }
            
            .article-container .folder-article-list .more-article {
                margin-bottom: 0;
            }

.upgrade-subscription{height: 220px; width: 100%; margin: 20px 0; position: relative; display: block}
.upgrade-subscription.hide{display: none}
.upgrade-subscription:before{content: ''; width: 20px; height: 20px; top: 0; left: 0; border-top: 6px solid #F7D244; border-left: 6px solid #F7D244; position: absolute}
.upgrade-subscription:after{content: ''; width: 20px; height: 20px; bottom: 0; right: 0; border-bottom: 6px solid #F7D244; border-right: 6px solid #F7D244; position: absolute}
.upgrade-subscription .container{position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: auto; text-align: center; width: 50%}
.upgrade-subscription .container .products{margin: 0 0 40px 0; font-size: 0; position: relative}
.upgrade-subscription .container .products:after{content: ''; border-bottom: 1px solid #F7D244; position: absolute; width: 120px; left: 0; right: 0; margin: auto; bottom: -20px}
.upgrade-subscription .container .products .old-product, .upgrade-subscription .container .products .new-product{width: 80px; display: inline-block; position: relative; vertical-align: top}
.upgrade-subscription .container .products .old-product{vertical-align: middle}
.upgrade-subscription .container .products figure{width: 40px; height: 35px; background: url('/assets/images/upgrade-subscription-arrow.png') no-repeat center; background-size: contain; display: inline-block; margin: 0 20px}
.upgrade-subscription .container .products .new-product img{display: block}
.upgrade-subscription .container .products .new-product img:first-child{margin: 0 0 10px 0}
.upgrade-subscription .container p{font-size: 18px; margin: 0 0 20px 0 !important; font-weight: bold; color: #000000}
.upgrade-subscription .container .more{color: #F7D244; text-decoration: underline; font-size: 16px; font-weight: bold}

/*--- New Account --*/
.main-container .help{margin:30px 0}
/*.main-container .help .faq{border-bottom:2px solid rgba(204, 204, 204, 0.4); padding:0 0 15px 0; margin:0 0 15px 0}*/
.main-container div.help h3{font-size:20px; font-weight: bold; margin-bottom:15px; color:black; border-bottom:2px solid rgba(204, 204, 204, 0.4)}
.main-container div.help p{font-size:15px; color:black}

.main-container.mon-compte{position: relative}
.main-container.mon-compte a{text-decoration: none}
.main-container.mon-compte .required{border:1px solid #db1429 !important;}
.main-container.mon-compte .alert-message{padding:5px; margin-top:10px}
.main-container.mon-compte .alert-message.inline{position: absolute; right:20px; top:107px; width:500px; margin:0}
.main-container.mon-compte .alert-message figure{width: 30px; height:30px; display: inline-block; vertical-align: top;}
.main-container.mon-compte .alert-message.inline figure{position: relative; top:4px}
.main-container.mon-compte .alert-message.inline.small-text figure{top:0}
.main-container.mon-compte .alert-message.error{border:1px solid #db1429;}
.main-container.mon-compte .alert-message.success{border:1px solid #009900;}
.main-container.mon-compte .alert-message.error figure{background:url('/assets/images/alert.png'); background-size:contain; background-position: center; background-repeat: no-repeat}
.main-container.mon-compte .alert-message.success figure{background:url('/assets/images/success.png'); background-size:contain; background-position: center; background-repeat: no-repeat}
.main-container.mon-compte .alert-message p{font-size:14px; font-family: Helvetica; padding-left:5px; display: inline-block}
.main-container.mon-compte .alert-message.inline p{width:450px}
.main-container.mon-compte .alert-message p a{color:#195ee6; text-decoration: underline}
.main-container.mon-compte .alert-message .text{display: inline-block; width:96%}
.main-container.mon-compte .alert-message .text p{width:100%}
.main-container ul.tab-menu {height: 56px;}
.main-container ul.tab-menu li {color: black; font-weight: bold; border-top: 1px solid #fff; background-color:#ECEDED; float:left; transition: 0.3s ease; width:20%}

.main-container ul.tab-menu li:not(:last-child){border-right: 2px solid white}
.main-container ul.tab-menu li.active {background-color: #db1429; color:white}
.main-container ul.tab-menu li a {display: block; font-size:18px; padding: 15px 0; text-align: center;}

.main-container ul.tab-menu li.main a img{width:15px; height:15px; vertical-align: top; position: relative; top:5px}
.main-container ul.tab-menu li.main.active a img:first-child{display: none;}
.main-container ul.tab-menu li.main.active a img:nth-child(2){display: inline-block}
.main-container ul.tab-menu li.main a img:nth-child(1){display: inline-block}
.main-container ul.tab-menu li.main a img:nth-child(2){display: none}

.main-container .tabbedMenu-mobile{display: none}
.main-container ul.tabbedMenu {height: 48px;}
.main-container ul.tabbedMenu li {color: black; font-weight: bold; border-top: 1px solid #fff; background-color:rgba(242, 242, 242, 0.7); float:left; transition: 0.3s ease; width:125px}
.main-container ul.tabbedMenu li:first-child{width:150px}
.main-container ul.tabbedMenu li:nth-child(2){width:100px}
.main-container ul.tabbedMenu li img{width:15px; height:15px; vertical-align: top}
.main-container ul.tabbedMenu li:not(:last-child){border-right: 2px solid #e6e6e6}
.main-container ul.tabbedMenu li.active {background-color: black; color:white}
.main-container ul.tabbedMenu li a {display: block; font-size:16px; padding: 15px 0; text-align: center}

.main-container .tabbedMenu-mobile .selected{color:white; padding:13px 0;text-transform: capitalize !important; background-color:#db1429; position: relative}
.main-container .tabbedMenu-mobile .selected .title{display: inline-block; font-weight: bold}
.main-container .tabbedMenu-mobile .selected .title img:first-child{display: none}
.main-container .tabbedMenu-mobile .selected b{color:white; font-size:23px; margin-left:10px; position: absolute; top:8px; transition: 0.3s}
.main-container .tabbedMenu-mobile.active .selected b{transform: rotate(180deg)}
.main-container .tabbedMenu-mobile{text-align: center}
.main-container .tabbedMenu-mobile img{width:15px; height:15px; vertical-align: top; display: inline-block; position: relative; top:2px}
.main-container .tabbedMenu-mobile ul li {color: black; font-weight: bold; border-top: 1px solid #fff; background-color:rgba(242, 242, 242, 0.7); transition: 0.3s ease; width:100%}
.main-container .tabbedMenu-mobile ul li.main a img:nth-child(2){display: none}
.main-container .tabbedMenu-mobile ul li:not(:last-child){border-bottom: 2px solid white}
.main-container .tabbedMenu-mobile ul li.active {background-color: black; color:white}
.main-container .tabbedMenu-mobile ul li a {display: block; font-size:16px; padding: 13px 0; text-align: center}

.main-container .tabs{margin:30px 0}
.main-container .tabs div#profil{position: relative}
.main-container .tabs h2.title{font-size:22px; font-weight: bold; margin-bottom:40px; max-width:450px}
.main-container .tabs h2.title:after{content:''; background-color:rgba(217, 217, 217, 0.9); width:50px; height:4px; display: block; margin-top:5px;}
.main-container .tabs .hidden-tab{display: none}
.main-container .tabs .hide{opacity: 0}
.main-container .tabs label.error{font-size: 14px; color: red; display: inline-block;}
.main-container .tabs form{font-size:0; box-sizing: border-box; margin-top:30px}
.main-container .tabs form.edit_profile .col-1, .main-container .tabs form.edit_profile .col-2{display: inline-block; vertical-align: top; box-sizing: border-box; font-size:0; width:50%}
.main-container .tabs form.edit_profile .col-1{padding-right:20px;}
.main-container .tabs form.edit_profile .form-input{margin-bottom:30px; position: relative}
.main-container .tabs form.edit_profile .form-input p{font-size:16px; padding-right: 5px; color:black; display: inline-block; width:30%; vertical-align: top}

.main-container .profile_message{position: absolute; left:0; top:18px; width:70%;}
.main-container .pass_message.error{position: absolute; top:25px; width: 100%}
.main-container .profile_message, .main-container .pass_message{margin: 10px 0 25px 0; padding: 6px 12px; background: #f6f6f6; font-size:15px; font-family:Helvetica; display: none; transition: 0.3s}
.main-container .pass_message{margin:0}
.main-container .profile_message.error, .main-container .pass_message.error{color:#721c24; display: block; background-color:#f8d7da; border:2px solid #f5c6cb; border-radius: .25rem}
.main-container .profile_message.success, .main-container .pass_message.success{color:#155724; display: block; background-color:#d4edda; border:2px solid #c3e6cb; border-radius: .25rem}

.main-container .tabs form input.error{border-color:#DB1429 !important;}
.main-container .tabs form.edit_profile .form-input input{width:70%; border:1px solid #CCCCCC; height:30px; padding:0 4px; color:black; font-family: Helvetica; font-size:15px}
.main-container .tabs form.edit_profile .form-link{text-align: right; position: relative}
.main-container .tabs form.edit_profile .btn-sbmt{display: inline-block; width:20%}
.main-container .tabs form.edit_profile .edit_details{display: inline-block; width:80%;}
.main-container .tabs form.edit_profile .form-link .edit_details a{font-size:18px; color:rgb(94, 142, 237); text-decoration: underline; }
.main-container .tabs form.change_password{margin-top:20px; position: relative}
.main-container .tabs form.change_password .form-control{padding:20px 0 0 0}
.main-container .tabs form.change_password .form-input{width:50%; display: inline-block; margin-bottom: 20px; box-sizing:border-box; vertical-align: top}
.main-container .tabs form.change_password .form-input input{width:70%; border:1px solid #CCCCCC; height:30px; padding:0 4px; font-family: Helvetica; font-size:15px; color:black}
.main-container .tabs form.change_password .form-input p{font-size:16px; padding-right: 5px; color:black; display: inline-block; width:30%; vertical-align: top}
.main-container .tabs form.change_password .form-input:first-child, .main-container .tabs form.change_password .form-input:nth-child(3n){padding-right: 20px;}
.main-container .tabs form.edit_profile input[type='submit'], .main-container .tabs form.change_password .form-input input[type='submit']{border-radius:20px; color:white; background-color:black; font-weight:bold; transition: 0.3s; font-size:16px;text-align: center; border:2px solid black; }
.tabs form.change_password .form-input input[type='submit']{padding:5px 0 25px 0}
.main-container .tabs form.edit_profile input[type='submit']:hover, .main-container .tabs form.change_password input[type='submit']:hover{color:black; background-color:white;}
.main-container .tabs form.edit_profile input[type='submit']{width:20%; padding:5px 0 3px 0}
.main-container .tabs form a.submit{font-size:16px; color:white; background-color:#333C45; font-weight: bold; border-radius: 5px; padding:10px 40px; cursor:pointer}
.main-container .tabs form.change_password input[type='submit']{width:40%;}
.main-container .tabs form.change_password .btn{text-align: right}
.main-container .tabs form.change_password .btn .btn-sbmt{display: inline-block; width:42%}
.main-container .tabs form.change_password p.title{font-size:16px; font-weight: bold; display: block; margin-bottom: 20px; color:black; border-bottom:2px solid rgba(204, 204, 204, 0.4); padding:0 0 10px 0}
.main-container .tabs form.change_password label.error{font-size: 14px; color: red; display: inline-block; font-family: Helvetica}
.main-container .tabs form.edit_profile label.error{font-family:Helvetica; font-size: 14px; color: red; position: absolute; top: 39px; left: 0;}

.main-container .tabs form.change_password label.error{font-size: 14px; color: red; display: inline-block; font-family: Helvetica}
.main-container .tabs form.edit_profile label.error{font-family:Helvetica; font-size: 14px; color: red; position: absolute; top: 39px; left: 0;}

.main-container .tabs .loader {border: 3px solid #d9d9d9; border-radius: 50%; border-top: 3px solid #333C45; border-right: 3px solid #333C45; position: absolute; right:53px; width: 35px; height:35px; -webkit-animation: spin 1s linear infinite; animation: spin 1s linear infinite;  }
.main-container .tabs form.edit_profile .loader{top:-7px;}
.main-container .tabs form.change_password .loader{top:initial; bottom:42px;}

.main-container .tabs i.fa{font-weight: bold}
.main-container .tabs #mon_compte div.logout{margin:0 0 15px 0; display: block;}
.main-container .tabs #mon_compte div.logout a{color:rgb(94, 142, 237); font-size:17px}
.main-container .tabs #mon_compte.shortened-name h2{max-width: 300px}
.main-container .tabs #mon_compte section{margin:0 0 40px 0; position: relative}
.main-container .tabs #mon_compte section:first-child{margin:50px 0 40px 0}
.main-container .tabs #mon_compte section .head-title{border-bottom:2px solid rgba(204, 204, 204, 0.4); font-size:0; box-sizing: border-box}
.main-container .tabs #mon_compte section .head-title h3{display: inline-block; font-size:20px; font-weight:bold; width:70%; color:black}
.main-container .tabs #mon_compte section .head-title a{display: inline-block; text-align: right; width:30%; font-size:14px; color:#195ee6; cursor: pointer}
.main-container .tabs #mon_compte section p:first-child{padding:10px 0}
.main-container .tabs #mon_compte section p{font-size:16px; color:black; padding-bottom: 10px;}
.main-container .tabs #mon_compte section p span:first-child{font-weight: bold}
.main-container .tabs #mon_compte section .content p:first-child{padding-top:15px}
.main-container .tabs #mon_compte section .content p:not(:last-child){padding-bottom: 15px}
.main-container .tabs #mon_compte section.help .content p{padding-bottom: 0}


.main-container .tabs #abonnement .subscription-details{margin:25px 0 0 0}
.main-container .tabs #abonnement .arreter-overlay, .main-container .tabs #abonnement .unsubscribe-section{position:fixed; background-color:rgba(0,0,0,0.7); top:0; bottom:0; right:0; left:0; display: none; z-index:99999}
.main-container .tabs #abonnement .arreter-overlay .content{background-color:white;width:25%; margin:300px auto; height:235px; text-align:center; position: relative;}
.main-container .tabs #abonnement .arreter-overlay .content span.close, .main-container .tabs #abonnement .unsubscribe-section .content span.close{position: absolute; top:5px; right:15px; font-size:25px; font-weight: bold; cursor: pointer}
.main-container .tabs #abonnement .arreter-overlay .content h2{color:#DB1429; font-size:20px; padding:40px 0 20px 0; font-weight: bold}
.main-container .tabs #abonnement .arreter-overlay .content p{font-size:14px;}
.main-container .tabs #abonnement .arreter-overlay .content .date{font-size:16px; font-weight: bold}
.main-container .tabs #abonnement .unsubscribe-section .content .btns{margin:35px 0; text-align: center}
.main-container .tabs #abonnement .arreter-overlay .content .btns{margin:40px 0}
.main-container .tabs #abonnement .unsubscribe-section .content .btns a{font-size:15px;}
.main-container .tabs #abonnement .unsubscribe-section .content .btns a, .main-container .tabs #abonnement .arreter-overlay .content .btns a{padding:7px 30px; color:white;border-radius:20px; text-transform: uppercase;}
.main-container .tabs #abonnement .unsubscribe-section .content .btns a:first-child, .main-container .tabs #abonnement .arreter-overlay .content .btns a:first-child{background-color:#DB1429; margin-right:20px; cursor: pointer}
.main-container .tabs #abonnement .unsubscribe-section .content .btns a:last-child, .main-container .tabs #abonnement .arreter-overlay .content .btns a:last-child{background-color:black; cursor:pointer}
.main-container .tabs #abonnement .unsubscribe-section .content{width:70%; margin:80px auto; padding:30px; background-color:white; max-height:750px; overflow-y: scroll; position: relative; border-radius: 20px}
.main-container .tabs #abonnement .unsubscribe-section .content .heading p:last-child{padding:15px 0 10px 0}
.main-container .tabs #abonnement .unsubscribe-section .content .reasons{padding-bottom: 20px}
.main-container .tabs #abonnement .unsubscribe-section .content .reasons .list input{display: none}
.main-container .tabs #abonnement .unsubscribe-section .content .suggestions{margin:10px 0 20px 0}
.main-container .tabs #abonnement .unsubscribe-section .content .suggestions .form-input:not(:last-child){margin-bottom: 10px}
.main-container .tabs #abonnement .unsubscribe-section .content .suggestions .form-input textarea{width:90%}
.main-container .tabs #abonnement .subscription-details a{display: block;color:#195ee6; text-decoration: underline;line-height:2; font-size:15px; cursor: pointer}
.main-container .tabs #abonnement a.purchase{display: block;color:#195ee6; text-decoration: underline;line-height:2; font-size:15px;}

.main-container .tabs #abonnement p{font-size:16px; line-height: 1.5; color:black}
.main-container .tabs #abonnement p.formule span, .main-container .tabs #abonnement .content p span{font-weight: bold}
.main-container .tabs #abonnement .payment-history{margin:10px 0 20px 0}
.main-container .tabs #abonnement .payment-history p.title{font-size:16px; font-weight: bold; padding:0 0 10px 0; margin:0 0 20px 0; border-bottom: 2px solid rgba(204, 204, 204, 0.4)}
.main-container .tabs #abonnement .payment-history table{width:100%; border:1px solid rgba(204, 204, 204, 0.9); border-collapse: collapse; line-height: 2.5; font-family: Helvetica}
.main-container .tabs #abonnement .payment-history table th, td{border:1px solid rgba(204, 204, 204, 0.9); text-align: center}
.main-container .tabs #abonnement .more-access {margin-top:25px}
.main-container .tabs #abonnement .more-access p.title{font-size:16px; font-weight: bold; padding:0 0 10px 0; border-bottom:2px solid rgba(204, 204, 204, 0.4); color:black}
.main-container .tabs #abonnement .more-access div.formule{font-size:24px; font-weight: bold; margin:20px 0 10px 0; color:black; font-family: Helvetica}
.main-container .tabs #abonnement .more-access div.teaser{font-size:18px; margin:0 0 20px 0; color:black; font-weight: bold}
.main-container .tabs #abonnement .more-access div.teaser p{color:black}
.main-container .tabs #abonnement .more-access .details{font-size: 0; margin-top:10px;}
.main-container .tabs #abonnement .more-access .details .price{display: inline-block; width:50%; vertical-align: top}
.main-container .tabs #abonnement .more-access .details .price p{font-size:20px; color:#f6c342}
.main-container .tabs #abonnement .more-access .details .price p span.large-number{font-size:45px; font-weight: bold}
.main-container .tabs #abonnement .more-access .details figure{display: inline-block; height:250px; width:50%}
.main-container .tabs #abonnement .more-access a.subscribe{width: 180px; text-align: center; height:40px; display: block; font-size: 20px; margin: 20px 0 0 0;  color: #FFFFFF; background-color: #f6c342; border-radius: 10px; line-height: 40px;}
.main-container .tabs #abonnement .more-access .description{width:100%; margin:30px 0 0 0;font-family: Helvetica; color:black; font-size:16px}
.main-container .tabs #abonnement .more-access a.subscribe{margin:30px auto 0}

.main-container .tabs #newsletters ul li{border-bottom: 1px solid rgba(204, 204, 204, 0.6); padding: 0 0 20px 0; overflow: hidden; position: relative}
.main-container .tabs #newsletters ul li .details{vertical-align: top; padding-left: 180px; width: 100%; float: left}
.main-container .tabs #newsletters ul li .details .details-header{position: relative}
.main-container .tabs #newsletters ul li .details .details-header > p{display: inline-block; font-size: 18px; font-weight: bold; vertical-align: top; width: 70%; color: black}
.main-container .tabs #newsletters ul li .details .details-header .subscribed{display: inline-block; position: absolute; right: 0; width: 145px; overflow: hidden; text-align: center}
.main-container .tabs #newsletters ul li .details .details-header .subscribed figure{width: 62px; height: 40px; background-position: center; background-repeat: no-repeat; background-size: cover; background-image: url('/assets/images/subscribed.png'); position: relative; transition: 0.3s; margin: auto}
.main-container .tabs #newsletters ul li .details .details-header .subscribed p.success{font-size: 14px; color: rgb(16, 135, 16); padding: 12px 0 0 0; width: 100%; transition: 0.3s}
.main-container .tabs #newsletters ul li .details .details-header .subscribed p.error{color: #DB1429; padding: 5px 0 0 0; transition: 0.3s; overflow: hidden}
.main-container .tabs #newsletters ul li .imageOverlay{position: fixed; background: rgba(38,38,38,.8); top: 0; left: 0; bottom: 0; right: 0; z-index: 99999999; display: none; overflow: auto}
.main-container .tabs #newsletters ul li .imageOverlay .content{height: 100%; margin: auto; position: relative}
.main-container .tabs #newsletters ul li .imageOverlay .content a{color: #d6d1d1; font-size: 50px; cursor: pointer; position: absolute; right: 40px; top: 0}
.main-container .tabs #newsletters ul li .imageOverlay .content img{position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: auto}
.main-container .tabs #newsletters ul li .newsletter-image{width: 163px; height: 150px}
.main-container .tabs #newsletters ul li .details-footer{position: absolute; bottom: 20px; right: 0; font-size: 0; width: 100%; padding: 0 0 0 180px}
.main-container .tabs #newsletters ul li .details-footer .preview{display: inline-block}
.main-container .tabs #newsletters ul li .details-footer .preview a{text-decoration: underline; color: rgb(94, 142, 237); font-size: 14px; cursor: pointer}
.main-container .tabs #newsletters ul li .details-footer .preview_moncompte_newsletter a{text-decoration: underline; color: rgb(94, 142, 237); font-size: 14px; cursor: pointer}
.main-container .tabs #newsletters ul li .details-footer .subscribe{vertical-align: text-bottom; text-align: right; position: relative; float: right}
.main-container .tabs #newsletters ul li .details-footer .subscribe a{padding: 6px 25px; background-color: #000000; color: #FFFFFF; font-size: 13px; font-weight: bold; border-radius: 15px; border: 1px solid black; cursor: pointer; vertical-align: top; transition: 0.2s}
.main-container .tabs #newsletters ul li .details-footer .subscribe.subscribed a{background-color: #e6e6e6; color: rgba(0,0,0,0.8); border: 1px solid #ccc}
.main-container .tabs #newsletters ul li .details-footer .subscribe .loading{position: absolute; width: 163px; top: -10px; height: 35px; z-index: 1}
.main-container .tabs #newsletters ul li .details-footer .subscribe .loading i{position: absolute; top: 10px; right: 28px; width: 18px; height: 18px; background: url('/assets/images/spinner.gif') no-repeat center; background-size: contain}
.main-container .tabs #newsletters ul li .details-footer .subscribe.unsubscribed .loading i{right: 45px}

/*-- End new account --*/

@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


@media (max-width: 900px) {
    .article-container .article-header {
        padding-left: 20px;
        padding-right: 20px;
    }
    .article-container .article-body {
        width: 100%;
    }
    .article-body .subscribe{text-align: center;margin: 0;}
    .article-body .subscribe a{width: 92%}
    .article-body .subscribe .account-btn {float: none;margin: 10px 0 0 0 }
    .article-body .article-content img { width: 100%; height: auto }

        .article-body .caption {
            padding-left: 50px;
            padding-right: 20px;
        }

    #eco_newsletter_article .caption{padding: 0}
    #eco_newsletter_article .caption span{font-size: 15px; font-style: italic}

    .article-column {
        display: none;
    }

    .article-container.special .special-issue-container .warning {
        width: 100%;
        font-size:1em;
    }
}

@media (max-width: 769px) {

    .article-container .article-header .article-title {
        font-size: 1.5em;
        line-height: 1.2;
    }

    .article-container .article-header {
        border-top: none;
        margin-left:20px;
        margin-right:20px;
        padding-left: 0;
        padding-right: 0;
    }

    .article-container.special .article-header {
        margin-top: 20px;
    }

    .article-container .article-header .slug {
        margin-bottom: 15px;
    }

    .article-body .article-standfirst {
        font-size:1.15em;
        margin-left:20px;
        margin-right:20px;
    }

    .article-container .article-header .article-metas {
        color: #959faa;
    }

    .article-body .article-content,.article-body h3 { padding-left:20px;padding-right:20px;font-size: 1.2em}

    .bio blockquote p {
        margin-left: 0;
        margin-bottom:20px;
        font-size:1.4em;
    }

    blockquote.info-bloc p {
        font-size:1.4em;
        margin-left:0;
        width: 100%;
    }

    .article-body .focus.small-photo img {
        float: none;
        width:100%;
        height:auto;
        margin-left:0;

    }

    .article-body .focus {
        padding-top:0;
        padding-left:0;
        padding-right:0;
        margin-left: 20px;
        margin-right: 20px;
    }

    .focus .focus-title,
    .focus .focus-txt {
        padding-left:20px;
        padding-right:20px;
    }

    .focus .focus-title {
        margin-top:30px;
    }

    .article-body .info-bloc {
        margin-left: 20px;
        margin-right: 20px;
        padding-top: 15px;
    }

        .article-body .info-bloc.key-number {
            padding-bottom: 15px;
        }

            .key-number .legend {
                font-size:1em;
            }

    .key-number .digit span {
        font-size:3.1em;
    }

    .bio blockquote {
        margin-bottom: 10px;
        margin-top: 10px;
        width: 100%;
    }

    .article-recommendation {
        padding-left:20px;
        text-align: left;
        margin-bottom:0;
    }

    .related-container {
        margin-left: 20px;
        margin-right: 20px;
    }

    .related-container .article-header {
        margin-left: 0;
        margin-right:0;
    }

    .article-body .scrollable-table .table-wrapper {
        background: none;
    }

    .article-body .scrollable-table .scrolling-table {
        margin-left: 0;
    }

    .article-body .scrollable-table .scrolling-table tr td:first-child,
    .article-body .scrollable-table .scrolling-table tr th:first-child {
        position: relative;
    }

    /*-- Mon-compte --*/
    .main-container.mon-compte .alert-message{width:95%; margin:10px auto 0}
    .main-container.mon-compte .alert-message figure{width:8%}
    .main-container.mon-compte .alert-message p{width: 90%}
    .main-container.mon-compte .alert-message.inline{position: initial; width:95%; margin:10px auto 0}
    .main-container.mon-compte .alert-message.inline p{width:90%}
    .main-container.mon-compte .alert-message .text{width:90%}

    .main-container .tabs #newsletters ul li .details{width: 100%; padding: 0; float: none}
    .main-container .tabs #newsletters ul li .details .details-header .subscribed{width: 50px}
    .main-container .tabs #newsletters ul li .details .details-header .subscribed figure{width: 56px; height: 40px; top: -8px}
    .main-container .tabs #newsletters ul li .details .details-header .subscribed p.success{display: none}
    .main-container .tabs #newsletters ul li .details .details-header > p{margin: 0 0 20px 0}
    .main-container .tabs #newsletters ul li .details .description{margin: 0 0 20px 0}
    .main-container .tabs #newsletters ul li .newsletter-image{width: 100%}
    .main-container .tabs #newsletters ul li .details-footer{position: relative; bottom: -15px; right: 0; margin: 10px 0 13px 0; padding: 0}
    .main-container .tabs #newsletters ul li .details-footer .preview{width: 50%}
    .main-container .tabs #newsletters ul li .imageOverlay .content a{right: 10px; top: -20px}
    .main-container .tabs #newsletters ul li .imageOverlay .content img{position: initial; top: initial; transform: none}


    /*-- menu --*/
    .main-container ul.tab-menu{display: none}
    .main-container ul.tab-menu li{width:100%}
    .main-container ul.tab-menu li a{padding:10px 0}
    .main-container ul.tabbedMenu{display:none}
    .main-container .tabbedMenu-mobile{display:block}

    /*--ENd menu --*/

    .main-container .tabs{margin:20px auto 40px; width:95%}
    .main-container .tabs h2.title{width:100%; margin-bottom:20px}
    .main-container .tabs form.edit_profile .col-1{padding-right:0}
    .main-container .tabs form.edit_profile .col-1, .main-container .tabs form.edit_profile .col-2{width:100%; display: block}
    .main-container .tabs form.edit_profile .form-link{width:120px; margin:auto; display: block;}
    .main-container .tabs form.change_password{margin-top:25px}
    .main-container .tabs form.change_password .form-input:first-child, .main-container .tabs form.change_password .form-input:nth-child(3n){padding-right:0}
    .main-container .tabs form.change_password .form-input{width:100%; display: block}
    .main-container .tabs form.change_password .form-input.btn{width:120px; margin:auto; text-align: center; display: block}
    .main-container .tabs form a.submit{display: block; padding:10px; text-align: center}
    .main-container .tabs .loader{position: initial; margin: auto}
    .main-container .tabs #mon_compte section .head-title a{position: absolute; left:0; bottom:-25px; text-align: left; width:100%}
    .main-container .tabs #abonnement .arreter-overlay .content{width:90%; margin:200px auto 0}
    .main-container .tabs #abonnement .arreter-overlay .content p{font-size:16px; padding:0 10px}
    .main-container .profile_message{width:100%; top:20px}
    .main-container .tabs form.edit_profile{margin-top:45px}
    form.edit_profile .loader{position: initial}
}
/* @group related article*/

.related-container {
    border-top: 10px solid #D61C3B;
    padding-top: 5px;
}

    .related-container .article-container {
          margin-bottom: 0;
          border-bottom: 1px solid #E5E5DD;
        }

        .related-container .article-header {
            border: none;
            padding-bottom: 15px;
        }

            .related-container .article-container .article-header .slug {
                margin-bottom: 10px;
            }

            .related-container .article-header .article-title {
                margin-bottom: 25px;
            }

            .related-container .article-container .article-header .article-metas {
                color: #939EA8;
                margin-bottom: 25px;
            }

            .related-container .article-container .article-header .article-standfirst {
                width: 57.3%;
                margin-bottom: 30px;
                font-family: "freight-text-pro";
                font-size: 1.3em;
                line-height: 1.5;
                font-weight: 600;
                max-height: 90px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }

            .related-container .article-header .related-link-button {
                background-color: #333C45;
                padding: 12px 16px;
                border-radius: 3px;
                color: #fff;
                text-decoration: none;
                text-transform: uppercase;
                font-size: 0.75em;
                margin-bottom: 30px;
                transition: background-color 0.2s ease;
            }

            .related-container .article-header .related-link-button:hover {
                background-color: #49525b;
            }

                .related-container .related-link-button img {
                    display: inline;
                    color: #fff;
                    margin-top: -3px;
                    margin-right: 6px;
                }

/* @end related article*/


/* @group ad arch article */

.ad-arch-container {
    top:104px;
    left: 0;
    right: 0;
    position: absolute;
    overflow: hidden;
    text-align: center;
}

    .ad-arch-container.resizing img{
        margin-left: 0;
        opacity: 0;
    }

    .ad-arch-container img {
        margin-left: calc(50% - 1000px);
        opacity: 1;
    }

@media (max-width: 500px) {
     
.article-container.special.special-issue .special-issue-container {
        display: block;
        text-align: center;
    }

    .article-header .special-issue-container .special-issue-link {
        /*min-width: 146px;*/
        font-size:0.9em;
        margin-right:0;
        margin-left: 0;
        padding: 5px 8px;
    }

     .article-container .article-header .special-issue-container {
        padding-top:15px;
        padding-bottom: 15px;
    }

    .article-container.special.special-issue .special-issue-container {
        padding-top:15px;
    }

    .article-container .article-header .special-issue-infos {
        display: flex;
        /*flex-wrap: wrap;*/
        float: left;
        justify-content: space-between;
        width: 100%;
        margin-bottom: 14px;
    }

    .article-container .article-header .special-issue-infos ~ .partnering {
        margin-top: 0;
    }

        .article-container .article-header .special-issue-infos span{
            margin-right: 5px;
            width: 35%;
        }

        .article-container .article-header .special-issue-infos .partnering{
            margin-top:10px;
        }

    .article-container.special.partner-only .special-issue-container .warning {
        width: 100%;
        text-align: left;
    }
}

@media (min-width: 770px) {
    .main-container.ad-arch{
        margin-top: 77px;
        padding: 10px;
    }
}

@media (max-width: 769px) {
    .ad-arch-container {
        display: none;
    }
}


/* @end ad arche article*/


/* @group social box */

.article-identity {
    position: relative;
}
   .article-container .social-box {
        float: right;
        padding-left: 10px;
        padding-bottom: 10px;
    }

.social-box .social-box-networks{
            width: 100%;
            margin-bottom: 8px;
        }
            
            .social-box .social-link {
                text-align: center;
                padding-top: 8px;
                background-repeat: no-repeat;
                background-position: center center;
                line-height: 1;
                vertical-align: middle;
                width: 40px;
                height: 40px;
                border-radius: 50%;
                border: 2px solid #333C45;
                display: inline-block;
                margin-right: 5px;
                transition: background-color,color 0.2s ease;
            }
            
            .social-box .social-link:hover {
                background-color: #333C45;
                color: #fff;
            }

            .social-box .social-link.switch-lang:hover {
                background-color: #FFFFFF
            }

                .social-box .social-link img {
                    display: none;
                }

.article-header .social-box-share {
    transform: scale(0);
    transform-origin: 100% 0;
    transition: transform 0.1s ease;
}
.article-header .social-box-share.active {
    transform: scale(1);
}

.social-box .social-box-networks .social-link.en{background-image: url('/assets/images/goto_en_article.png'); background-size: cover; background-repeat: no-repeat; background-position: center; border: none}
.social-box .social-box-networks .social-link.fr{background-image: url('/assets/images/goto_fr_article.png'); background-size: cover; background-repeat: no-repeat; background-position: center; border: none}
.switch-lang-mobile{display: none}

@media (max-width: 600px){
    .article-container .social-box {
        display: none;
    }
}

/* @end social box */


.my-account {padding: 10px 0}
.my-account .user-popup {display: none; min-width: 165px; position: absolute; right: 140px; top: 64px; transition: 0.1s; list-style: none; line-height: 35px; background: #f5f5f5; padding: 20px; box-shadow: 1px 2px 5px 1px rgba(128, 128, 128, 0.35); border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; border-top: 1px solid #333c45;}
.classic-sticky .my-account .user-popup {top: 47px; transition: 0.1s}
.my-account .user-popup a {color: black; text-decoration: none}
.my-account .user-popup.active {display: block}

/*@group Paywall*/


.paywall.bottom-subscription{bottom:20px;right:30px;left:initial!important;position:fixed;background:url("../images/paywall_subscription.png");background-position:center center;background-size:cover;border-left: solid 6px #C61320;width:400px;padding:20px;height:auto;display: block;margin:auto;box-shadow: 0 0 2px 2px rgba(0,0,0,0.05)}
.paywall.bottom-subscription .container{background-color: transparent;display: block;margin:auto}
.paywall.bottom-subscription .container .paywall_subscription{text-align:center}
.paywall.bottom-subscription .container .paywall_subscription img{margin:auto}
.paywall.bottom-subscription .container h2{color:#676767;font-size:20px;width: auto;padding: 20px 0 0 0}
.paywall.bottom-subscription .container h3{color:#C61320;font-size:12px;width: auto;padding: 10px 0 0 0}
.paywall.bottom-subscription .container span{color: rgba(103, 103, 103, 0.6);font-size: 12px;padding: 15px 0;display: block}
.paywall.bottom-subscription .container{font-size: 0;box-sizing: border-box;vertical-align: top;width: 80%;margin: auto}
.paywall.bottom-subscription .container input{background-color: rgba(103, 103, 103, 0.11);border-radius: 8px;border-color: transparent;display: inline-block;outline:none;font-size:16px;height:28px;color:black;padding: 0 0 0 10px;width: 160px;text-decoration: none}
.paywall.bottom-subscription .container input.required{border:solid 1px #C61320}
.paywall.bottom-subscription .container a.newsletter_paywall_subscription_call{background-color: #1E2329;color: white;font-size: 12px;padding: 6px 15px;border-radius: 5px;position: relative;right: 7px;text-decoration: none;bottom: 2px}
.paywall.bottom-subscription .container a.close_paywall_subscription{font-size: 20px;position: absolute;right: -50px;top: -13px;color:#676767;cursor: pointer}

.subs-only {
    overflow-y: hidden;
}

    .paywall {
        position: fixed;
        bottom: 0;
        background-color: #333C45;
        left: 0;
        right:0;
        color: #fff;
        z-index: 13;
    }

    .search-overlay.paywalled {display: block;opacity: 0.3;top: 0}
    .search-overlay.paywalled.premium{display: none}

        .paywall .progress-bar {
            display: flex;
            justify-content: space-between;
        }

            .progress-bar .progress-item {
                background-color: #70767D;
                padding: 5px 0;
                width: calc(100% / 3);
                display: block;
                margin:0 5px;
            }

.progress-bar .progress-item.used{margin:0 5px 0 0}
.progress-bar .progress-item:last-child{margin:0 0 0 5px}

            .progress-bar .progress-item.used {
                background-color: #e9b441;
                padding: 5px 0;
                width: calc(100% / 3);
                display: block;
            }
            .paywall .progress-bar-full {background-color: #F1C562; padding: 5px 0}

        .paywall .progress-infos {
            display: flex;
            justify-content:space-around;
            padding: 10px 45px;
            text-align: center;
            font-size:1.1em;
            position: relative;
        }

.paywall .progress-infos .wrapper{text-align: left}
.paywall .progress-infos .wrapper h2{padding:10px 0;font-weight: bold;font-size: 1.10em}
.paywall .progress-infos .wrapper a{display: block;padding:10px 0}

        .paywall .fermer {
            position: absolute;
            right: 30px;
            top: 10px;
            cursor: pointer;
            width: 25px;
            height: 25px;
            border: 1px solid white;
            border-radius: 50%;
            padding: 3px;
            line-height: 18px;
        }

        .paywall .paywall-connect-link {
            text-align: center; margin: 0 0 15px 0
        }

        .paywall.completed .progress-infos {
            display: block;
        }

            .progress-infos .status {
                display: inline-block;font-size: 14px;
                /*text-align: left;*/
                /*line-height: 30px;*/
            }

            .completed .progress-infos .status {
                margin-bottom:20px;
            }
.completed .progress-infos  h2{margin:0 0 20px 0}
.completed .progress-infos .retour{display: block;width: 100%;text-align: right}
.completed .progress-infos .retour a{position: relative;right:10px;top:30px}
.paywall .fermer.close_paywall_subscription{color:black;font-size: 20px}
.paywall .btn-container{position: relative;top:5px}


                .progress-infos .status span {
                    color: #F1C562;
                    border-bottom: 3px solid #F1C562;
                }

            .progress-infos .price {
                display: inline-block;
                margin-right:10px;
            }

            .progress-infos .progress-btn:hover {
                color: #333C45;
                background-color: #fff;
            }

            .progress-infos .progress-btn svg {
                    margin-top:-2px;
                    margin-right:5px;
                }
            
    .paywall.completed {
        padding-bottom:0;
    }
            
        .paywall.completed .progress-bar {
            background-color: #F1C562;
            padding:5px 0px;
        }

            .paywall.completed .progress-infos .status {
                font-weight:600;
                /*text-align: center;*/
                display: block;
                font-size:1.5em}
.paywall.completed .progress-infos .status.premium::before{clear:both;content:'';background-image:url('../images/white-lock.png');background-size: cover;background-repeat: no-repeat;width: 20px;height: 20px;display: inline-block;margin: 0 10px 0 0;}
                .progress-infos .status span {
                    color: #e9b441;
                    border-bottom: 3px solid #e9b441;
                }

            .progress-infos .price {
                display: block;
                margin-right:0;
                margin-bottom:20px;
            }

        .progress-infos .progress-btn {
            display: inline-block;
            text-decoration: none;
            padding: 15px 20px 15px;
            background-color: #e9b441;
            border-radius: 3px;
            text-transform: uppercase;
            font-size: 0.64em;
            font-weight:600;
            line-height: 1;
            margin-right:0
        }

        .progress-infos .progress-btn:hover {
            color: #fff;
            background-color: #cb9d29;
        }

            .progress-infos .progress-btn svg {
                margin-top:-2px;
                margin-right:5px;
            }

        .already-member a {
            text-decoration: none;
            border-bottom:2px solid #fff;
            font-size: 14px;
        }
        .already-member{font-size: 14px;padding:0 0 0 15px}

        .already-member a:hover {
            text-decoration: none;
            border-bottom:none;
        }

@media (min-width: 770px) {
    .paywall-mobile {
        display: none;
    }

}

@media (max-width: 769px) {

    .block-article-list.bottom-sep .article-list-wrapper .block-article .dossier_span,.block-article .block-article-link .dossier_span {display: block}
    .block-article-list.bottom-sep .article-list-wrapper .block-article .dossier_span.desktop,.block-article .block-article-link .dossier_span.desktop {display: none}
    .paywall .progress-infos { display: block; padding: 20px 0}
    .paywall .btn-container{top:0}
    /*.paywall .progress-infos .already-member {position: absolute; bottom: 0; left: 0; right: 0; font-size: 14px; margin: 0 0 15px 0; clear: both; width: 100%; text-align: center}*/

    .paywall {display: none}
    .paywall-mobile {display: block;}

    .paywall-mobile:not(.completed) .status{
        line-height: 41px;
        font-size: 15px;
    }

    .paywall-mobile.completed .progress-infos .status {
        font-size: 1.35em;
        line-height: normal;
        max-width: 80%;
        margin: 0 auto 15px auto;
    }

    .paywall-mobile.completed .progress-btn {display: block;margin: 15px auto 15px auto;max-width: 90%;font-size: 16px}

    .paywall .fermer {
        right: 4px;
    }
    /*.progress-infos .progress-btn {color: #e9b441; background: none; border-bottom: 2px solid #e9b441; margin: 0 auto 30px auto; border-radius: 0; padding: 0}*/
    .article-locked-paywall .progress-infos .status {font-size: 14px; line-height: normal; max-width: 100%; margin: 0 auto 15px auto; padding: 0 10px}
    .article-locked-paywall .progress-infos .status span {color: white; border: none}

    .switch-lang-mobile{display: block; width: 40px; height: 40px; border-radius: 50%; border: 2px solid #333C45; margin: 10px 0 0 0}
    .switch-lang-mobile.en{background-image: url('/assets/images/goto_en_article.png'); background-size: cover; background-repeat: no-repeat; background-position: center}
    .switch-lang-mobile.fr{background-image: url('/assets/images/goto_fr_article.png'); background-size: cover; background-repeat: no-repeat; background-position: center}
    .upgrade-subscription .container{width: 100%}
}

/*@end Paywall*/

/* @end article*/

/* @group inscription form */

.main-container.form {
    padding-top: 20px;
}

.inscription-form-header {margin-bottom: 15px;padding-bottom: 15px;border-bottom: 10px solid #333C45;position:relative}
.inscription-form-header .title {font-size: 2.5em;font-weight: 600}
.inscription-form-header a{position: absolute;bottom: 20px;right: 20px;}
.account-success h2{font-weight: 600;font-size: 1.5em;margin: 0 0 15px 0}
.account-success p{margin: 0 0 5px 0}


.sub-form ::-webkit-input-placeholder {
    color: #333;
    display: inline-block;
    vertical-align: middle;
    color: #B8BEC4;
    font-size: 1em;
    line-height: 0.8em;
}

.sub-form ::-moz-placeholder          {
    color: #333;
    display: inline-block;
    vertical-align: middle;
    color: #B8BEC4;
    font-size: 1em;
    line-height: 0.8em;
}

.sub-form :-ms-input-placeholder      {
    color: #333;
    display: inline-block;
    vertical-align: middle;
    color: #B8BEC4;
    font-size: 1em;
    line-height: 0.8em;}

    .sub-form .form-input{
        background-color: transparent;
        display: block;
        margin-bottom: 20px;
        border-radius: 2px;
        text-shadow: none;
        border: none;
        border: 2px solid #B8BEC4;
        border-radius: 3px;
        padding: 20px 15px 15px;
    }

    .sub-form .form-label {
        font-size: 0.8em;
        text-transform: uppercase;
        display: block;
        margin-bottom: 5px;
    }

    .sub-form legend {
        text-transform: uppercase;
        font-weight: 600;
        font-size: 0.8em;
        margin-bottom: 15px;
    }

    .sub-form .radio-container {
        position: relative;
        display: inline-block;
        margin-right: 30px;
    }

        .sub-form .radio {
            opacity: 0;
            position: absolute;
            top: 0;
            left: 0;
        }

            .sub-form .form-radio {
                margin-bottom: 15px;
            }

            .sub-form .form-radio-label {
                cursor: pointer;
            }

    .sub-form .form-circle {
        position: relative;
        cursor: pointer;
        display: inline-block;
        width: 14px;
        height: 14px;
        border: 2px solid #333C45;
        border-radius: 50%;
        background-clip: padding-box;
        margin-bottom: -2px;
        margin-right: 5px;
    }

    .sub-form .form-checkbox {
        position: relative;
    }

        .sub-form .checkbox{
            opacity: 0;
            position: absolute;
            top: 0;
            left: 0;      
        }


    .radio:checked + label .form-circle::after{
        content: '';
        display: block;
        position: absolute;
        width: 6px;
        height: 6px;
        top: 50%;
        left: 50%;
        margin-left: -3px;
        margin-top: -3px;
        background-color: #333C45;
        border-radius: 50%;
        background-clip: padding-box;
    }

        .sub-form .form-check-square {
            position: relative;
            width: 15px;
            height: 15px;
            border-radius: 2px;
            display: inline-block;
            border: 2px solid #B8BEC4;
            margin-right: 10px;
            vertical-align: middle;
        }
        
        .sub-form .checkbox-label {
            display: inline-block;
            vertical-align: middle;
            font-size:0.82em;
        }

        .checkbox:checked + label .form-check-square::after {
                content: '';
                display: block;
                position: absolute;
                width: 7px;
                height: 7px;
                top: 2px;
                left: 2px;
                background-color: #B8BEC4;
                background-clip: padding-box;    
        }

.sub-form .newsletters-container .form-checkbox:nth-child(1){
    margin-bottom: 10px;
}
.sub-form .address-shipment .form-input {
    width: 100%;
}

.sub-form .form-select {
    display: block;
    margin-bottom: 20px;
}
.sub-form fieldset {
    padding-bottom: 20px;
    margin-bottom: 10px;
    margin-top: 20px;
}

.sub-form .select-container {
    position: relative;
}

.sub-form .form-input.full{
    width: 100%;
}

.sub-form .form-input.half{
    width: 50%;
}

.sub-form .form-input.small{
    width: 30%;
}

.sub-form .form-input.very-small{
    width: 20%;
}

.sub-form .select-container .form-select {
    width: 50%;
    height: 60px;
}

.sub-form .form-input.error {
    margin-bottom: 0;
    background-color: rgba(350,89,85,0.13);
    border: 2px solid #D81736;
}

.sub-form .error-label{
    color: #D81736;
    margin-bottom: 20px;
    font-weight: 600;
    font-size: 0.8em;
}

.sub-form .account-creation {
    padding-bottom: 25px;
    margin-bottom: 20px;
    border-bottom: 1px solid #E5E5DD;
}

.sub-form .payment {
    border-bottom: 1px solid #E5E5DD;
}

.sub-form .address-shipment {
    border-bottom: 1px solid #E5E5DD;
}

.submit-container {
    padding-top: 20px;
    text-align: center;
}

.sub-form .submit{
    border: none;
    display: inline-block;
    background-color: #EAB532;
    padding: 15px 20px;
    border-radius: 3px;
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 0.75em;
    margin-bottom: 30px;
    transition: background-color,color 0.2s ease;
}

.sub-form .submit:hover {
    background-color: #cb9d29;
}

.sub-form .submit svg {
    display: inline;
    color: #fff;
    margin-top: -2px;
    margin-right: 6px;
}

.sub-form .submit .icon-arrow {
    transition: color 0.2s ease;
}

.sub-form .submit:hover .icon-arrow{
    color: #333C45;
}

.inscription-form-header + .sub-form .submit-container .submit:hover svg {
    color: #fff;
}

.alert-form {
    border-top: 1px solid #e5e5dd;
    padding-top:10px;
    padding-bottom:10px;
}

    .alert-form .my-alerts {
        border-bottom: 1px solid #e5e5dd;
    }

    .alert-form .alert-desc {
        font-size:0.85em;
    }

        .my-alerts .alert-container {
            width:60%;
        }

            .sub-form.alert-form .form-checkbox, .my-alerts.alert-form .form-checkbox{
                display: inline-block;
                white-space: nowrap;
                width: 165px;
                margin-bottom:5px;
            }

            .sub-form.alert-form .alert-rhythm .form-checkbox{
                display: block;
            }

        .sub-form .submit-alert .submit {
            background-color: #b7bec4;
        }

        .sub-form .submit-alert .submit:hover {
            background-color: #878e94;
        }

        .alert-container + .form-label {
            margin-top:20px;
        }



@media (max-width: 900px) {

    .inscription-form-header {
        margin-left: 20px;
        margin-right: 20px;
    }

    .sub-form fieldset {
        padding-left:20px;
        padding-right:20px;
    }

    .my-alerts .alert-container {
        width:80%;
    }

}


@media (max-width: 769px) {

    .inscription-form-header .title {
        font-size:1.6em;
    }

    .inscription-form-header {
        padding-bottom: 5px;
    }

    .sub-form .form-input.half {
        width: 100%;
    }

    .sub-form .form-input.very-small {
        width: 45%;
    }

    .sub-form .form-input.small {
        width: 55%;
    }

    .sub-form legend {
        padding-left: 20px;
    }

    .alert-form .alert-desc {
        padding-left:20px;
        padding-right:20px;
    }

    .my-alerts .alert-container {
        width: 100%;
    }

    .sub-form.alert-form .form-checkbox {
        width: 48%;
    }
}
/* @end inscription form*/

/*@group MAGAZINE*/

.magazine {

}

    .magazine-header {
        background-color: #fff;
        border-top:10px solid #D61C3B ;
        line-height: 1;
        padding-top:30px;
        padding-bottom:30px;
        padding-left:30px;
        margin-bottom:20px;
        color: #4A4A4A;
        margin-top:30px;
    }

    .magazine-header .magazine-title{
        background-color: #fff;
        font-weight: 600;
        font-size:2em;
        display: inline-block;
        vertical-align: middle;
    }

    .magazine-header .magazine-pdf-link {
        vertical-align: middle;
        border: 2px solid #4A4A4A;
        border-radius: 3px;
        display: inline-block;
        font-family: "franklin-gothic-urw";
        font-size: 0.9em;
        font-weight: 500;
        margin-left: 20px;
        padding: 9px 15px;
        text-decoration: none;
        text-transform: uppercase;
        transition: background-color 0.2s ease-in 0s, color 0.2s ease-in 0s;
    }

    .magazine-header .magazine-pdf-link:hover {
        color: #efefef;
        background-color: #4A4A4A;
    }

        .magazine-header .magazine-pdf-link svg {
            margin-right:10px;
            vertical-align: middle;
        }

        .magazine-header .magazine-pdf-link span {
            vertical-align: middle;
        }

    .magazine-header .rubric-tags-list {
        margin-top:20px;
    }

        .magazine-header .rubric-tags-list .tag-item {
            background-color: #4A4A4A;
            border: 1px solid #4A4A4A;
            transition: background 0.2s ease-in;
            text-transform: initial;
            font-size: 0.875em;
        }

        .magazine-header .rubric-tags-list .tag-item:hover {
            color: #fff;
            background-color: #626262;
        }

    .magazine-rubric-folder {
        margin-bottom:40px;
    }
    
        .magazine-rubric-folder .folder-title {
            background-color: #EBEBEB;
        }
    
            .magazine-rubric-folder .folder-title span {
                display: inline-block;
                vertical-align: middle;
                background-color: #D81736;
                width: 40%;
                color: #fff;
                text-align: right;
                font-size:1.5em;
                letter-spacing:0.02em;
                line-height: 1;
                padding-top: 5px;
                padding-bottom: 7px;
                margin-right:-3px;
                padding-right:30px;
            }
    
            .magazine-rubric-folder.sponso .folder-title span {
                background-color: #ff6600;
            }

            .magazine-rubric-folder .folder-title span.full-width {
                width: 100%;
                text-align: left;
                padding-left:30px;
            }
    
            .magazine-rubric-folder .folder-title a {
                display: inline-block;
                vertical-align: middle;
                background-color: #EBEBEB;
                text-decoration: none;
                width: 59.9%;
                margin-right:-3px;
                padding-left:20px;
            }
    
        .magazine-rubric-folder .folder-content {
            background-color: #fff;
            padding: 40px;
        }

            .magazine-rubric-folder .block-article.small-width {margin-bottom:20px}
            .magazine-rubric-folder .small_articles {width: 100%;padding:30px 0 0 0;border-top:1px solid #E5E5DD;display: flex;justify-content: space-between;flex-wrap:wrap}
            .magazine-rubric-folder .small_articles .block-article.small-width{display: inline-block}
            .magazine-rubric-folder .block-article.small-width .block-content {
                float: none;
                margin-top: 0;
                width: 100%;
                padding-left:0;
                padding-right:0;
                padding-bottom:0;
                padding-top:10px;
                height:auto;
            }

        .magazine-rubric-folder .block-article.full-width .article-img {
            float: left;
            width: 48%;
            margin-left: 0;
            margin-top: 0;
        }

        .magazine-rubric-folder .block-article.full-width .block-content {
            float: left;
            width: 52%;
            margin-left: 0;
            margin-top: 0;
        }

        .magazine-rubric-folder .block-article.full-width .block-content {
            padding-top:15px;
            min-height: auto;
            padding-right:0;
        }

            .magazine-rubric-folder .full-width.sponso .block-content .content-title {
                font-size: 1.75em;
            }

        .magazine-rubric-folder .block-article.full-width .article-img {
            height: 230px;
        }
        
        .magazine-offer {
            background-color: #E9B430;
            padding:20px;
            text-align: center;
            margin-bottom:40px;
        }
            
            .magazine-offer span {
                font-size:1.25em;
                color: #fff;
                display: inline-block;
                vertical-align: middle;
                line-height: 1;
            }

            .magazine-offer .price {
                font-size:2.5em;
                line-height: 0.7;
                margin-left:1%;
                font-weight: 600;
                vertical-align: top;
            }

            .magazine-offer .subs-btn {
                margin-left:7%;
                font-size:0.6em;
            }

@media (max-width: 769px) {

    .magazine-header {
        margin-top:20px;
        text-align: center;
        margin-bottom:0;
        margin-left: 20px;
        margin-right: 20px;
        padding-right:20px;
        padding-left:20px;

    }

    .rubric-tags-list li{
        margin: 5px auto;
    }

    .magazine-header .magazine-title {
        display: block;
        text-align: center;
        font-size:1.6em;
    }

    .magazine-header .magazine-pdf-link {
        margin-left: 0;
        margin-top:20px;
    }

    .magazine-offer .price {
        display: block;
        font-size:1.6em;
        line-height: 1;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .magazine-offer .subs-btn {
        margin-left:0;
    }

    .magazine-rubric-folder .block-article.small-width .block-content {
        width:60%;
    }

    .magazine-rubric-folder .block-article.full-width .article-img {
        height: 65px;
        width: 20%;
        float: right;
    }

    .magazine-rubric-folder .block-article.full-width .block-content {
        padding-top: 0;
    }

    .magazine-rubric-folder .folder-title span {
        width:54%;
        text-align: left;
        padding-right:0;
        padding-left:20px;
        font-size:1em;
    }

    .magazine-rubric-folder .folder-title a {
        width:45.9%;
        font-size:0.7em;
        text-transform: uppercase;
    }

    .block-article.half-width {
        width:100%;
        padding-bottom: 20px;
        margin-bottom: 20px;
        border-bottom:1px solid #e5e5dd;
    }

    .block-article.half-width .article-img {
        height: 65px;
        width:20%;
        float: right;
    }

    .block-article.half-width .block-content {
        float: left;
        width: 60%;
    }

    .half-width .block-content .content-title {
        font-size:1em;
        display: inline;
        line-height:1;
    }

    .half-width .block-content .slug {
        margin-bottom: 0;
    }

    .magazine-rubric-folder .folder-content {
        padding:20px;
    }

    .magazine-rubric-folder .block-article.full-width .block-article-link,
    .magazine-rubric-folder .block-article.small-width .block-article-link {
        padding-top: 0;
        padding-bottom: 0;
        padding-left: 0;
        padding-right: 0;
    }

    .magazine-rubric-folder .full-width.sponso .block-content .content-title {
        font-size:1.1em;
    }

}

@media (max-width: 480px) {
    .block-article.half-width .block-content {
        width: 80%;
    }
}

/*@end MAGAZINE*/


/*@group footer*/
.whitebeard-footer {background: #ececec;text-align: center;padding: 5px 0;font-size: 13px;}
.whitebeard-footer a{text-decoration: none;}
.whitebeard-footer a img{display: inline-block;vertical-align: inherit;}
.site-footer {
    background-color: #333C45;
    padding-top: 20px;
    color: #fff;
}

    .site-footer .block-nl {

    }

    .site-footer .footer-link {
        background-color: #2C353E;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        padding: 20px;
    }

        .site-footer .footer-link {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
        }

            .footer-link .left-col {
                flex-direction: row;
                justify-content: space-between;
            }

                .footer-link .left-col li {
                    margin-right:20px;
                }

                    .footer-link .left-col a {
                        font-size:0.8em;
                        text-decoration: none;
                    }

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

    .mobile-footer {
        display: none;
    }

@media (max-width: 1305px) {

    .site-footer {display: none}

    .mobile-footer {display: block; background-color: #333C45;color: #fff}

        .mobile-footer .subs-btn {
            text-align: center;
            color: #fff;
            background-color: #EAB533;
            font-family: "franklin-gothic-urw";
            border-radius: 3px;
            font-size: 0.8em;
            font-weight: 500;
            padding: 10px 15px;
            margin-bottom:15px;
            text-decoration: none;
            text-transform: uppercase;
            transition: background-color 0.2s ease-in 0s, color 0.2s ease-in 0s;
            display: inline-block;
            vertical-align: middle;
            margin: 0;
        }

        .mobile-footer .list-footer {
            border-bottom:1px solid #51595f;
            padding:20px 10px;
            text-align: center;
        }

            .list-footer li {
                display: inline-block;
                margin-right:20px;
            }

            .list-footer .footer-item {
                text-decoration: none;
                text-transform: uppercase;
                font-size:0.7em;
                color: #cacacc;
            }

        .mobile-footer .footer-btn {
            padding:20px 20px;
            border-bottom:1px solid #51595f;
            text-align: center;
        }

            .mobile-footer .nl-btn {
                text-align: center;
                color: #fff;
                background-color: #B9BEC4;
                font-family: "franklin-gothic-urw";
                border-radius: 3px;
                display: block;
                font-size: 0.8em;
                font-weight: 500;
                padding: 10px 15px;
                text-decoration: none;
                text-transform: uppercase;
                transition: background-color 0.2s ease-in 0s, color 0.2s ease-in 0s;
                display: inline-block;
                vertical-align: middle;
                margin: 0;
            }

            .mobile-footer .cdl-copyright {
                font-size:0.7em;
                text-align: center;
                padding:20px;
                text-transform: uppercase;
            }
}

@media (max-width: 769px) {
    .mobile-footer .subs-btn, .mobile-footer .nl-btn {
        display: block;
        margin: 10px auto;
    }
}


/*@end footer*/

/*@group CONNECT BOX*/

.connect-box-layer {
    display: none;
    position: fixed;
    top: 0;
    right:0;
    bottom: 0;
    left: 0;
    background-color: rgba(51,50,69,0.4);
    z-index: 15;
    transform: scale(0.8);
    opacity: 0;
    transition: opacity 0.2s ease-in;
}

.connect-box-layer.open {
    display: block;
    transform: scale(1);
    opacity: 1;
}

    .connect-box {
        background-color: #fff;
        padding: 25px;
        border-radius: 5px;
        display: flex;
        max-width: 760px;
    }

.connect-box-close {
    display: block;
    border: none;
    background-color: transparent;
}

    .connect-box-close,
    .connect-box-close:active {
        display: block;
        position: absolute;
        top:-10px;
        right:-10px;
        width: 20px;
        height: 20px;

    }

    .connect-box-close::after {
        display: block;
        content: '';
        position: absolute;
        top:0;
        right:10px;
        width: 2px;
        height:15px;
        background-color: #333c45;
        transform: rotate(-45deg);
    }

    .connect-box-close::before {
        display: block;
        content: '';
        position: absolute;
        top:0;
        right:10px;
        width: 2px;
        height:15px;
        background-color: #333c45;
        transform: rotate(45deg);
    }

        .connect-box .connect-title {
            text-transform: uppercase;
            margin-bottom: 20px;
            font-family:"franklin-gothic-urw";
            font-size: 0.8em;
            font-weight:500;
        }

    .connect-box .login-box {
        flex:1 1 50%;
    }

        .connect-box .login-box .sub-form .form-input {
            padding:15px 15px 10px;
        }

        .connect-box .login-box .sub-form .form-label {
            display: inline-block;
        }

        .connect-box .login-box .forget-pw {
            display: inline-block;
            font-size:0.7em;
            float: right;
            margin-top:4px;
        }

        .connect-box .login-box .sub-form .form-input.half {
            width: 100%;
        }

        .connect-box .login-box .sub-form .form-checkbox,
        .connect-box .login-box .sub-form .submit {
            display: inline-block;
            margin-right: 15px;
        }
        
        .connect-box .login-box .sub-form .submit {
            border: 2px solid #333C45;
            background-color: #333C45;
            color: #fff;
            margin-right: 0;
            margin-bottom: 0;
            float: right;
            padding: 10px 15px;
        }

        .connect-box .login-box .sub-form .submit:hover {
            background-color: #fff;
            color: #333C45;
        }

    .connect-box .sign-box {
        flex:1 1 50%;
        padding-left: 20px;
        margin-left: 20px;
        position: relative;
        border-left: 1px dotted #E5E5DD;
    }

    .connect-box .sign-btn {
        position: absolute;
        bottom: 0;
        right: 0;
        background-color: #F1C562;
        color: #fff;
        border-radius: 3px;
        display: inline-block;
        font-family: "franklin-gothic-urw";
        font-size: 0.79em;
        font-weight: 500;
        margin-right: 10px;
        padding: 10px 15px;
        text-decoration: none;
        text-transform: uppercase;
        transition: background-color 0.2s ease-in 0s, color 0.2s ease-in 0s;
    }

    .connect-box .sign-btn:hover {
        background-color: #cb9d29;
        color: #fff;
    }

        .connect-box .sign-btn svg{
            margin-right:10px;
        }

@media (max-width: 769px) {

    .connect-box {
        left: 21%;
        flex-direction: column;
        -webkit-transform: translate(6%, -50%);
        -ms-transform: translate(6%, -50%);
        -moz-transform: translate(6%, -50%);
        transform: translate(6%, -50%);
    }

    .connect-box .sign-box {
        border-top: 1px dotted #e5e5dd;
        border-left:none;
        margin-left: 0;
        padding-top: 20px;
        padding-left: 0;
        margin-top:20px;
    }

    .connect-box .sign-btn {
        position: static;
        margin-top: 10px;
    }
}

@media (max-width: 500px) {

    .connect-box {
        left: 21%;
        -webkit-transform: translate(-14%, -50%);
        -ms-transform: translate(-14%, -50%);
        -moz-transform: translate(-14%, -50%);
        transform: translate(-14%, -50%);
    }
}

/*@end CONNECT BOX*/

/*@grop STATIC PAGES*/

.static-pages {
    margin-top: 75px;
    padding-top:30px;
    padding-bottom: 110px;
    margin-bottom: 110px;
    border-top:10px solid #DB1429;
    background-color: #fff;
}

    .static-pages .title {
        color: #DB1429;
        padding-left: 60px;
        padding-right: 60px;
        font-size: 2.8em;
        font-weight:600;
        line-height: 1;
    }

    .static-pages .txt-container {
        width:70%;
        margin-left: auto;
        margin-right: auto;
        margin-top:35px;
        padding-top:35px;
        border-top: 1px solid #F3F3EF;
        font-size: 1.2em;
    }

        .static-pages .txt-container p {
            margin-top:30px;
        }

        .static-pages .txt-container p:first-child {
            margin-top:0;
        }

            .static-pages .txt-container span {
                font-weight:600;
            }

@media (max-width: 769px) {

    .static-pages {
        margin-top:20px;
    }

    .static-pages .title {
        padding-left: 20px;
        padding-right: 20px;
    }

    .static-pages .txt-container {
        width: 100%;
        padding-left: 20px;
        padding-right: 20px;
    }

}

/*@end STATIC PAGES*/

/*@group DATAROOM*/

.dataroom-filter {
    background-color: #49545F;
    padding: 25px 0;
    margin-bottom:50px;
}

    .filter-container {

    }

        .filter-container .filter-infos {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            margin-bottom:20px;
        }

            .filter-container .dataroom-title{
                font-size:1.5em;
                color: #fff;
                vertical-align: bottom;
                line-height: 1;
                text-transform: uppercase;
                font-family:"europa";
                font-weight:500;
                max-width: 10em;
            }

            .filter-container .filter-desc {
                font-size:1.1em;
                color: #CCCCCC;
                text-align: right;
                line-height: 1;
                vertical-align: bottom;
            }

            .filter-container .filter-search,
            .filter-select {
                display: inline-block;
                position: relative;
                width: 40%;
                margin-right:2%;
            }

            .filter-container .filter-select {
                margin-left:-3px;
            }

            .filter-select::after {
                display: block;
                content: '';
                background-color: #B8BEC4;
                width: 3px;
                height: 11px;
                position: absolute;
                top:20px;
                right:10px;
                border-radius: 3px;
                pointer-events: none;
                transform: rotate(45deg);
                transition: transform 0.1s ease-in;
            }

            .filter-select::before {
                display: block;
                content: '';
                background-color: #B8BEC4;
                width: 3px;
                height: 11px;
                position: absolute;
                top:20px;
                right:16px;
                border-radius: 3px;
                pointer-events: none;
                transform: rotate(-45deg);
                transition: transform 0.1s ease-in;
            }

                .filter-input {
                    background-color: #49545F;
                    padding:12px 20px;
                    border: 2px solid #B8BEC4;
                    border-radius: 3px;
                    color: #fff;
                    width: 100%;
                }

                select.filter-input {
                    height:50px;
                    -webkit-appearance: none;
                    -moz-appearance:    none;
                    appearance:         none;
                    padding-top:0;
                    padding-bottom: 0;
                }

                    .filter-input option{
                        background-color: #fff;
                        border-bottom: 1px solid #e5e5dd;
                        padding: 20px;
                        color: #49545f;
                    }

                .filter-search .search-btn-ok {
                    padding:0;
                    border: none;
                    right: 20px;
                    top:17px;
                }

            .filter-btn {
                text-transform: uppercase;
                font-size:0.75em;
                color: #fff;
                width: 15%;
                background-color: #3E4751;
                padding:16px 20px;
                border-radius: 3px;
                border:none;
                box-shadow: none;
                transition: background-color 0.2s ease-in;
            }

            .filter-btn:hover {
                background-color: #333C45;
            }

.dataroom {

}

    .dataroom .indicator-wrapper {
        border-bottom: 1px solid #E5E5DD;
        margin-bottom:35px;
    }

        .dataroom .indicator-item {
            margin-bottom:45px;
            border-right:1px solid #E5E5DD;
            border-top: 10px solid #333c45;
            transition: border 0.2s ease-in;
        }

        @media (min-width: 769px) {
            .dataroom .indicator-wrapper .indicator-item:hover {
                border-top: 10px solid #939ea8;
            }
        }

        .dataroom .indicator-item:nth-child(3n) {
            border-right:none;
        }

        .dataroom .indicator-wrapper .indicator-slug {
            font-size: 1em;
            font-weight: 600;
            line-height: 1;
            padding-top: 20px;
            text-transform: uppercase;
            border-bottom: 2px solid #000;
            display: inline-block;
        }

        .dataroom .indicator-wrapper .indicator-name {
            height:60px;
            overflow: hidden;
        }

        .dataroom .indicator-wrapper .indicator-name,
        .dataroom .indicator-wrapper .indicator-item:hover .indicator-name {
            border-top: none;
        }

    .dataroom .indicator-legend {
        margin-bottom:35px;
        text-align: center;
        padding-left: 20px;
        padding-right:20px;
    }


@media (max-width: 769px) {


    .paywall .progress-infos .wrapper{text-align: center;display: block;width: 90%;margin: auto}
    .paywall .progress-infos{padding: 40px 0}
    .paywall.completed .progress-infos{padding: 20px 0}
    .completed .progress-infos a.retourHomePage{font-size:16px}
    .progress-infos .progress-btn{display: block;margin: 15px auto 15px auto;max-width: 90%;font-size: 16px}

    .paywall.bottom-subscription{bottom:0;right:0;left:initial!important;position:fixed;background:url("/assets/images/paywall_subscription.png");background-position:center center;background-size:cover;border-top: solid 6px #C61320;width:100%;padding:20px 0;height:auto;display: block;margin:auto;box-shadow: 0 0 2px 2px rgba(0,0,0,0.05);border-left: none}
    .paywall.bottom-subscription .container{background-color: transparent;display: block;margin:auto}
    .paywall.bottom-subscription .container .paywall_subscription{text-align:center}
    .paywall.bottom-subscription .container h2{color:#676767;font-size:20px;width: auto;padding: 20px 0 0 0}
    .paywall.bottom-subscription .container h2 P{color:#676767;font-size:20px;width: auto;padding: 0}
    .paywall.bottom-subscription .container h3{color:#C61320;font-size:12px;width: auto}
    .paywall.bottom-subscription .container span{color: rgba(103, 103, 103, 0.6);font-size: 12px;padding: 15px 0;display: block}
    .paywall.bottom-subscription .container span p{color: rgba(103, 103, 103, 0.6);font-size: 12px;padding: 15px 0;display: block}
    .paywall.bottom-subscription .container{font-size: 0;box-sizing: border-box;vertical-align: top;width: 80%;margin: auto}
    .paywall.bottom-subscription .container input{background-color: rgba(103, 103, 103, 0.11);border-radius: 8px;border-color: transparent;display: inline-block;outline: none;font-size: 16px;height: 28px;color: black;padding: 0 0 0 10px;width: 160px;text-decoration: none}
    .paywall.bottom-subscription .container input.required{border:solid 1px #C61320}
    .paywall.bottom-subscription .container a.newsletter_paywall_subscription_call{background-color: #1E2329;color: white;font-size: 12px;padding: 6px 15px;border-radius: 5px;position: relative;right: 7px;text-decoration: none;bottom: 2px}
    .paywall.bottom-subscription .container a.close_paywall_subscription{font-size: 20px;position: absolute;right: -20px;top: -13px;color:#676767;cursor: pointer}
    .paywall.bottom-subscription .container:before{display: none}

    .dataroom .indicator-wrapper {
        padding-left: 20px;
        padding-right:20px;
        margin-top: 20px;
    }

    .dataroom .indicator-wrapper .indicator-name,
    .dataroom .indicator-wrapper .indicator-item:hover .indicator-name {
        border-top: none;
    }

    .dataroom .indicator-wrapper .indicator-item:first-child .indicator-name {
        border-top: none;
    }

    .dataroom .indicator-item {
        border-right: none;
        margin-bottom: 0;
        border-top:10px solid #000;
    }

        .dataroom .indicator-wrapper .indicator-slug {
            font-size:0.7em;
            border-top:none;
        }

        .dataroom .indicator-wrapper .indicator-name {
            padding-top: 5px;
            font-size: 1.1em;
            height: inherit;
            width: 55%;
        }

        .dataroom .indicator-wrapper .indicator-date {
            width: 55%;
            margin-bottom:20px;
        }

        .dataroom .indicator-wrapper .indicator-item .indicator-number {
            float: right;
            margin-top:-70px;
        }


}
    
/*@end DATAROOM*/

/*@group DATAROOM DETAIL*/

.dataroom-detail {
    padding-top: 45px;
}

    .dataroom-detail .filter-input {
        background-color: transparent;
        border-color: #B8BEC4;
        color: #323C46;
    }


    .dataroom-detail .data-slug {
        color: #DA1030;
        font-size:1em;
        text-decoration: underline;
        text-transform: uppercase;
        font-weight: 600;
        margin-bottom:20px;
    }

    .dataroom-detail .data-title {
        font-size: 3.31em;
        font-weight: 600;
        line-height: 0.8;
        margin-bottom: 15px;
    }

    .dataroom-detail .data-source {
        color: #939EA9;
        font-size:0.8em;
        text-transform: uppercase;
        margin-bottom:20px;
    }

        .dataroom-detail .data-source span {
            text-transform: none;
        }

    .dataroom-detail .data-date {
        margin-bottom:20px;
    }

    .dataroom-detail .filter-select.data-date::after, .dataroom-detail .filter-select.data-date::before {
        display: none;
    }

        .data-date .filter-input-wrapper {
            position: relative;
            height: 100%;
            width: 100%;
            display: inline-block;
            width: 49%;
        }

        .data-date .filter-input-wrapper::after {
            display: block;
            content: '';
            background-color: #B8BEC4;
            width: 3px;
            height: 11px;
            position: absolute;
            top:20px;
            right:16px;
            border-radius: 3px;
            pointer-events: none;
            transform: rotate(45deg);
            transition: transform 0.1s ease-in;
        }

        .data-date .filter-input-wrapper::before {
            display: block;
            content: '';
            background-color: #B8BEC4;
            width: 3px;
            height: 11px;
            position: absolute;
            top:20px;
            right:23px;
            border-radius: 3px;
            pointer-events: none;
            transform: rotate(-45deg);
            transition: transform 0.1s ease-in;
        }


    .dataroom-detail .data-container {
        border-top:10px solid #343B43;
        padding-top:30px;
        margin-bottom:50px;
    }

        .data-container .data-param {
            display: flex;
        }

            .data-param .param-box {
                float: left;
                width:25%;
                padding-right:5px;
                padding-left:15px;
                border-right: 1px solid #E5E5DD;
            }

            .data-param .param-box:last-child {
                border-right: none;
            }

                .param-box .txt{
                    font-weight: 600;
                    height: 55px;
                    display: flex;
                    align-items: flex-end;
                    margin-bottom:10px;
                }

                    .param-box .txt span {
                        font-size:1.8em;
                        font-family:"europa";
                        line-height: 1.1;
                        margin-right:7px;
                    }

                    .param-box .txt .big-nb{
                        font-size:3.3em;
                        font-family:"mostra-nuova";
                        line-height: 0.8;
                    }

                    .negatif-nb {
                        color: #DA1030;
                    }

                .param-box .filter-select {
                    width: 100%;
                    margin-right: 0;
                }

                .param-box .filter-select::before,
                .param-box .filter-select::after {
                    top: 10px;
                }

                    .param-box .filter-input {
                        border: 1px solid #dedede;
                        padding: 0;
                        font-size: 0.85em;
                        height: 20px;
                        padding: 0 10px;
                        min-height: 30px;
                    }

    .dataroom-detail .related-box {
        border: 1px solid #E5E5DD;
        margin-bottom:50px;
    }

        .related-box .panel-container {

        }

            .panel-container .title {
                display: block;
                padding-left: 45px;
                text-decoration: none;
                font-weight:500;
                position: relative;
                transition: background 0.2s ease-in;
                font-family:"franklin-gothic-urw";
            }

            .panel-container .title:hover {
                background-color: #F5F5F5;
            }

                .panel-container .title::before {
                    display: block;
                    content: '';
                    background-color: #B8BEC4;
                    width:2px;
                    height:16px;
                    position: absolute;
                    top:23px;
                    left:21px;
                    transition: transform 0.2s ease-in;
                }

                .panel-container .title.open::before {
                    transform: rotate(90deg);
                }

                .panel-container .title::after {
                    display: block;
                    content: '';
                    background-color: #B8BEC4;
                    width:2px;
                    height:16px;
                    position: absolute;
                    top:23px;
                    left:21px;
                    transform: rotate(90deg);
                }

                .panel-container .title.no-slide {
                    pointer-events: none;
                    cursor: pointer;
                }

                .panel-container .title.no-slide::before,
                .panel-container .title.no-slide::after {
                    display: none;
                }

            .panel-container .panel-title {
                text-transform: uppercase;
                border-bottom: 1px solid #E5E5DD;
                line-height:3.3;
                font-size:1.15em;
            }

            .panel-container:last-child .panel-title {
                border-bottom: none;

            }

                .panel-container .infos-panel {
                    display: none;
                    background-color: #F5F5F5;
                }

                    .infos-panel .infos-line {
                        margin: 0 15px;
                        border-bottom: 1px solid #E5E5DD;
                        padding-top:15px;
                        padding-bottom:15px;
                        padding-left: 30px;
                    }

                    @media (max-width : 769px) {
                        .infos-panel .infos-line {
                            padding-left: 0;
                        }
                    }

                    .infos-panel .infos-line:last-child {
                        border-bottom: none;
                    }

                        .infos-line .line-metas {
                            float: left;
                            width:40%;
                        }

                            .line-metas .line-title {
                                font-size: 1.2em;
                                font-weight: 500;
                                padding-left: 30px;
                            }

                            .line-metas .line-date {
                                padding-left: 30px;
                                color: #939EA9;
                                font-size:0.65em;
                            }

                                .line-metas .line-date span {
                                    text-transform: uppercase;
                                    font-size:1.1em;
                                }

                            .line-metas .line-title::before,
                            .line-metas .line-title:after {
                                top:6px;
                                left: 7px;
                            }

                        .infos-line .line-data {
                            float: left;
                            width:20%;
                            font-size: 1.1em;
                            font-family:"franklin-gothic-urw";
                            font-weight:500;
                        }

                            .positif-nb {
                                color: #39B64A;
                            }

                        .infos-line .infos-panel {
                            display: none;
                            margin-top:5px;
                            border-top: 1px solid #E5E5DD;
                            margin-top: 15px;
                        }

                        .infos-line .infos-line {
                            margin-right: 0;
                            margin-left: 0;
                        }

                            .infos-line .infos-panel .infos-line:last-child {
                                padding-bottom:0;
                            }

                            .infos-line .infos-panel .infos-line  {
                                padding-left: 15px;
                            }

                            /*.infos-line .infos-panel .infos-line .title,
                            .infos-line .infos-panel .infos-line .line-date  {
                                padding-left: 50px;
                            }*/

                            .infos-line .infos-panel .infos-line .title::before,
                            .infos-line .infos-panel .infos-line .title::after {
                                display: none;
                            }

    .dataroom-detail .quick-info {
        width: 65%;
        margin-bottom:50px;
    }

        .quick-info .quick-info-title {
            font-size: 1.2em;
            font-weight: bold;
        }

        .quick-info .quick-info-text {
            font-size: 1.3em;
            font-family:"freight-text-pro";
        }

    .dataroom-detail .graph-section {
        margin-bottom:50px;
    }

        .graph-section .graph-container {
            width: 70%;
            float: left;
            border-right: 1px solid #E5E5DD;
            padding-right: 15px;
        }

            .graph-container .graph-name {
                display: inline-block;
                width: 44%;
                text-transform: uppercase;
                color: #D81736;
                font-weight: 600;
                font-size:0.9em;
            }

            .graph-container .graph-option {
                display: inline-block;
                text-decoration: none;
                text-transform: uppercase;
                transition: opacity 0.2s ease-in;
                font-size:0.8em;
                font-weight: normal;
                width: 27%;
                vertical-align: top;
                text-align: right;
            }

            .graph-container .graph-option.active {
                font-weight: bold
            }

                .graph-container .graph-option svg{
                    margin-top:-4px;
                }

            .graph-container .graph-option:hover {
                opacity:0.8;
            }

            .graph-container .graph-legend {
                font-size:0.9em;
                margin-top:5px;
            }

                .graph-legend .legend-color {
                    border-radius: 50%;
                    display: inline-block;
                    height: 12px;
                    width: 12px;
                    margin-right:7px;
                }

            .graph-container .graph {
                height:300px;
                background-color: #e9e9e9;
                margin-top:35px;
            }

        .graph-section .graph-filter {
            width: 30%;
            float: left;
            border-left: 1px solid #E5E5DD;
            padding-left: 25px;
            margin-left: -1px;
        }

            .graph-filter .title {
                text-transform: uppercase;
                font-size:1.1em;
                font-weight: 600;
                margin-bottom:20px;
            }

            .graph-filter .filter-select {
                width: 100%;
                margin-bottom:20px;
            }

            .graph-filter .filter-choice {
                margin-bottom:20px;
            }

            .graph-filter .filter-btn  {
                width: 100%;
            }

            .graph-filter .filter-select .filter-input{
                padding-left: 10px;
            }

    .dataroom-detail .other-indicator-title {
        font-size: 0.9em;
        font-weight: 600;
        text-transform: uppercase;
        margin-bottom:30px;
    }

    .indicator-list {
        margin-bottom:30px;
    }

        .indicator-list li:first-child .indicator-sub-item {
            display: block;
        }

        .indicator-list .indicator-item {
            display: block;
            padding:20px 0;
            border-bottom: 1px solid #E5E5DD;
            text-decoration: none;
        }

        .indicator-list li:last-child .indicator-item {
            border-bottom: none;
        }

        .indicator-list .indicator-item .title {
            font-size:1.6em;
            float: left;
            line-height: 1;
            font-family: franklin-gothic-urw;
            position: relative;
            transition: opacity 0.2s ease-in;
            width: 50%;
        }

        .indicator-list .indicator-item .title.extra {
            padding: 0 0 0 30px;
        }

        .indicator-list .indicator-item a {
            text-transform: initial;
        }

        .indicator-list .indicator-item a:hover {
            padding-left: 1px;
        }

        .indicator-list .indicator-item .title.extra::before {
            border-color: #3c3c3b transparent transparent;
            border-style: inset;
            border-width: 10px 6px 0;
            content: "";
            height: 0;
            margin-right: 12px;
            margin-top: -3px;
            pointer-events: none;
            position: absolute;
            top: 50%;
            left:0;
            width: 0;
            z-index: 1;
            transform: rotate(-90deg);
            transition: transform 0.2s ease-in;
        }

        .indicator-list .indicator-item .title.open::before {
            transform: rotate(0deg);
        }

        .indicator-list .indicator-item .date +  .title {
            margin-top: 5px;
        }

        .indicator-list .indicator-item .numbers-wrapper {
            float: right;
            width: 50%;
        }

        .indicator-list .indicator-item .nb {
            float: left;
            width: 40%;
            line-height: 1;
            margin-top: 5px;
        }

            .indicator-list .indicator-item .nb span {
                font-size:1.5em;
                font-weight:600;
            }

        .indicator-list .indicator-item .progression {
            float: left;
            line-height: 1;
            margin-top: 5px;
            width: 60%;
        }

            .indicator-list .indicator-item .progression span{
                font-size:1.5em;
                font-weight:600;
            }

    .dataroom-detail .dataroom-filter {
        padding-left:30px;
        padding-right:30px;
        padding-bottom:35px;
        padding-top:35px;
        margin-bottom:0;
    }

    .dataroom-detail .dataroom-filter .filter-input {
        color: #fff;
    }

@media (max-width : 769px) {

    .dataroom-filter {
        margin-bottom:0;
        padding: 30px 0;
    }

        .dataroom-detail .dataroom-filter .filter-container {
            padding: 0;
        }

    .filter-container {
        text-align: center;
        color: #49545f;
    }

    .filter-container .filter-infos {
        display: block;
    }

    .filter-container .filter-search, .filter-select {
        width: 100%;
        margin-right:0;
        display: inline-block;
    }

    .filter-container .dataroom-title {
        text-transform: none;
        vertical-align: middle;
        width: 100%;
        display: block;
        font-weight:600;
        max-width: none;
    }

    .filter-input {
        margin-right:0;
        width: 100%;
        background-color: transparent;
        margin-bottom:20px;
    }

    .filter-container .filter-select {
        margin-left:0;
    }

    .dataroom-filter .filter-btn {
        width: 50%;
    }

    .filter-container .filter-desc {
        display: block;
        text-align: center;
        /*width: 300px;
        max-width: 90%;*/
        margin: 20px auto;
    }

    .main-container.width-wrap.dataroom-detail {
        padding-top:25px;
    }

    .main-container.width-wrap.dataroom-detail .content-wrapper {
        padding-left: 20px;
        padding-right: 20px;
    }

    .dataroom-detail .data-slug {
        font-size:0.7em;
        margin-bottom:15px;
    }

    .dataroom-detail .data-title {
        font-size:1.6em;
    }

    .dataroom-detail .data-container {
        padding-top:0;
        margin-bottom:30px;
    }

    .data-container .data-param {
        flex-direction: column;
    }

        .data-param .param-box {
            width: 100%;
            border-right: none;
            border-bottom: 1px solid #e5e5dd;
            padding-left: 0;
            padding-right: 0;
            padding-top:10px;
            padding-bottom:10px;
        }

    .param-box .txt .big-nb {
        font-size:2.9em;
    }

    .param-box .txt {
        height:inherit;
        margin-bottom:0;
    }

    .dataroom-detail .data-container .filter-input {
        margin-bottom:0;
        margin-top:5px;
    }

    .dataroom-detail .data-date {
        width: 100%;
        margin-bottom:0;
    }

    .dataroom-detail .quick-info {
        width: 100%;
    }

    .graph-section .graph-container {
        float: none;
        width: 100%;
        border-right:none;
        padding-right:0;
        border-bottom: 1px solid #e5e5dd;
        padding-bottom:15px;
    }

    .graph-container .graph-name {
        display: block;
        width: 100%;
        font-size:0.75em;
    }

    .graph-container .graph-option {
        width: 48%;
        font-size:0.7em;
        text-align: left;
    }

    .graph-container .graph {
        margin-top:15px;
    }

    .graph-section .graph-filter {
        width: 100%;
        border-left:none;
        margin-top:15px;
        padding-left:0;
    }

    .graph-filter .filter-select {
        margin-bottom:0;
    }

    .param-box .filter-select::before,
    .param-box .filter-select::after {
        top:16px;
    }

    .panel-container .panel-title {
        font-size:0.9em;
    }

    .line-metas .line-title {
        font-size: 1em;
    }

    .panel-container .title::before,
    .panel-container .title::after {
        top:13px;
    }

    .infos-line .line-metas {
        float: none;
        width:100%;.infos-line .line-metas
    }

    .param-box .txt span {
        font-size:1.4em;
    }

    .infos-line .line-data {
        width: 33%;
        border-right: 1px solid rgba(175, 175, 175, 0.1);
        text-align: center;
    }

    .infos-line .line-data:last-child {
        border-right: none;
    }
        .infos-line .line-data .data-nb {
            font-size: 1.2em;
        }

        .infos-line .line-data .data-unit {
            font-size: 0.5em;
        }

    .indicator-list .indicator-item .title {
        float: none;
        font-size:1.1em;
    }

    .indicator-list .indicator-item .numbers-wrapper {
        float: none;
    }

    .indicator-list .indicator-item .title ~ .progression,
    .indicator-list .indicator-item .title ~ .nb {
        margin-left: 30px;        
    }

    .indicator-list .indicator-sub-item .indicator-item .title ~ .progression,
    .indicator-list .indicator-sub-item .indicator-item .title ~ .nb {
        margin-left: 0;        
    }

    .indicator-list .indicator-item .progression,
    .indicator-list .indicator-item .nb {
        font-size: 0.9em;
        float: none;
        padding-top: 10px;
    }

    .indicator-list .indicator-item .nb {
        margin-right:15px;
    }

    .indicator-list .indicator-sub-item .title {
        font-size:0.9em;
    }

}

/*@end DATAROOM DETAIL*/

/*@group DATAROOM LIST*/

    .datalist-title {
        font-size:3.2em;
        font-weight:600;
        border-bottom: 10px solid #323C46;
        line-height: 1;
        padding-bottom: 20px;
        margin-bottom:10px;
        margin-top:50px;
    }

            .indicator-item .date {
                color: #939EA8;
                font-size:0.77em;
            }

                .indicator-item .date span {
                    text-transform: uppercase;
                }

        .indicator-list .indicator-sub-item {
            display: none;
        }

            .indicator-list .indicator-sub-item .indicator-item {
                padding-left:20px;
            }

            .indicator-list .indicator-sub-item .title {
                font-size:1.05em;
                font-weight: 500;
                text-transform: uppercase;
                padding-left: 0;
                margin-top:5px;
            }

            .indicator-list .indicator-sub-item .title::before {
                display: none;
            }

            .indicator-list .indicator-sub-item .progression,
            .indicator-list .indicator-sub-item .nb {
                margin-top: 0;
            }

@media (max-width: 769px) {

    .main-container.width-wrap.dataroom-liste {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datalist-title {
        margin-top:20px;
        font-size:1.6em;
        margin-bottom:0;
    }

}

/*@end DATAROOM LIST*/

/*@group VISIONNEUSE*/

.jSlider {
    font-size: 0rem;
    overflow: hidden;
    white-space: nowrap;
    display: table-cell;
    vertical-align: middle;
}

.jSlider > * {
    display: inline-block;
    font-size: 1rem;
    vertical-align: top;
    white-space: normal;
}

.viewer-container {
    display: block;
    background-color: #333C45;
    position: fixed;
    top:0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index:100;
    opacity: 0;
    visibility: hidden;
}

.viewer-photo {
    height: 100%;
    overflow-y: auto;
    display: table;
    width: 100%;
}
.viewer-slider-container .viewer-slider-item {
    white-space: nowrap;
    width: 100%;
    overflow: auto;
    position: relative;
    max-height: 100vh;
}

.viewer-slider-item .viewer-item-photo {
    display: inline-block;
    padding: 5% 3.5% 0;
    width: 75%;
    transition: all 0.2s ease-in-out;
}

.viewer-photo-container {
    position: relative;
    margin: 0 auto;
}

.viewer-subscription {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.85);
    text-align: center;
}

.viewer-subscription .flow-bloc-subscription {
    width: 300px;
    border: none;
    white-space: normal;
    margin: 0;
}

.viewer-slider-container .viewer-slider-item .viewer-item-image {
    margin: 0 auto;
    width: 100%;
    max-width: 1250px;
    max-height: 100%;
    height: auto;
    transition: all 0.2s ease-in-out;
}

.viewer-slider-item .viewer-item-infos {
    display: inline-block;
    vertical-align: top;
    white-space: normal;
    width: 20%;
    overflow: hidden;
    padding-left: 0;
    color: #fff;
    padding-top:5%;
}

.viewer-item-desc {
    margin-bottom: 30px;
    font-weight:300;
}

@media (max-width: 769px) {

    .viewer-slider-item .viewer-item-infos {
        width: 90%;
        display: block;
        margin: 10px auto;
    }

    .viewer-slider-item .viewer-item-photo {
        width: 90%;
        display: block;
        padding: 0;
        margin: 10px auto;
    }

}

/* @group READER */

.viewer-close {
    position: absolute;
    z-index: 2;
    top: 30px;
    right: 30px;
    display: block;
    text-align: center;
    color: #fff;
    width: 15px;
    height:20px;
    text-decoration: none;
}
    .viewer-close span {
        position: relative;
        display: block;
    }

    .viewer-close span::before {
        background-color: #fff;
        content: "";
        display: block;
        height: 20px;
        position: absolute;
        width: 2px;
        left:5px;
        transform: rotate(-45deg);
        transition: transform 0.2s ease-in 0s;
    }

    .viewer-close span::after {
        background-color: #fff;
        content: "";
        display: block;
        height: 20px;
        position: absolute;
        left:5px;
        transform: rotate(45deg);
        transition: transform 0.2s ease-in 0s;
        width: 2px;
    }

    .viewer-close:hover span::before {
        transform: rotate(0deg);
    }

    .viewer-close:hover span::after {
        transform: rotate(90deg);
    }

.reader-nav-bloc {
    display: block;
    width: 30px;
    height: 30px;
    text-align: center;
}

.reader-nav {
    margin-bottom:15px;
}

.reader-nav-button {
    display: inline-block;
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    border: 2px solid #fff;
    border-radius: 100%;
}

.counter {
    border: none;
}

a.reader-nav-button:hover,
.reader-nav-button.active {
    background-color: rgba(255,255,255,0.05);
}

.reader-nav-button .icon {
    stroke: #fff;
}

.reader-nav-col-container {
    width: 100%;
    width: calc(100% + 2px);
}

.reader-nav-link {
    display: block;
    float: left;
    width: 50%;
    padding: 13.3% 0;
    border-left: 1px solid #404040;
    border-bottom: 1px solid #404040;
    margin-left: -1px;
    color: #fff;
    text-transform: uppercase;
    font-size: 0.6em;
    text-decoration: none;
}

a.reader-nav-link:hover {
    background-color: rgba(255,255,255,0.05);
}

.counter--mobile, .reader-nav--mobile {
    display: none;
}

@media (max-width: 769px) {

    .viewer-slider-item .counter, .viewer-slider-item .reader-nav {
        display: none;
    }

    .counter--mobile, .reader-nav--mobile {
        display: block;
    }    

    .counter--mobile {
        position: absolute;
        bottom: 23px;
        left: 5%;
        text-align: left;
    }

    .reader-nav--mobile {
        position: absolute;
        bottom: 15px;
        right: 5%;
    }

        .reader-nav--mobile .prev{
            margin-right: 20px;
        }

}

/* @end READER */

/*@end VISIONNEUSE*/


/* @group GLOBAL ALERTS */

.global-alert {
	color: #222;
	background-color: #FFF3B8;
	left: 0;
	position: fixed;
	text-align: center;
	top: 0;
	width: 100%;
	z-index: 1000;
	font: 300 1em/1.3em Helvetica, sans-serif;
	padding: 1.2em 0 1.6em;
}

	.global-alert p {margin: 0 0 0.6em;}
	.global-alert p:last-of-type {margin-bottom: 0;}
	.global-alert a:hover {color: #9d8511;}
	
	.global-alert .global-alert-close {
		cursor: pointer;
		display: block;
		font-size: 16px;
		padding: 3px 7px 4px;
		position: absolute;
		right: 6px;
		top: 6px;
		line-height: 18px;
	}
	
	.global-alert .global-alert-close:hover {background-color: #e4c00f; color: #fff;}
	.global-alert .global-alert-close:active {background-color: #766203; color: #fff;}
	
	.global-alert-close-handler:checked + .global-alert {display: none;}

/* @end GLOBAL ALERTS */

/* @group PRINT */

@media print {
	
	*, *:before, *:after, *:first-letter, *:first-line {
		background: transparent !important;
		color: #333C45 !important;
		box-shadow: none !important;
		text-shadow: none !important;
	}
	
	a, a:visited {text-decoration: underline;}
	a[href]:after {content: " (" attr(href) ")";}
	abbr[title]:after {content: " (" attr(title) ")";}
	a[href^="javascript:"]:after, a[href^="#"]:after {content: "";}
	pre, blockquote { border: 1px solid #999; page-break-inside: avoid;}
	
	thead {display: table-header-group;}
	tr, img {page-break-inside: avoid;}
	img {max-width: 100% !important;}
	
	p, h2, h3 {orphans: 3; widows: 3;}
	h2, h3 {page-break-after: avoid;}
	
}

/* @end PRINT */

/* @group NATIVE ADD */
    
    .native-alert {
        display: inline-block;
        position: relative;
        cursor: pointer;
    }

        .native-alert:hover .native-alert-tooltip{
            -webkit-transform: translateX(-50%) translateY(0px);
            -ms-transform: translateX(-50%) translateY(0px);
            -moz-transform: translateX(-50%) translateY(0px);
            transform: translateX(-50%) translateY(0px);
            opacity: 1;
        }

        .native-alert .symbol {
            display: block;
        }

        .native-alert.active .symbol {
            color: #d61c3b;
        }

        .native-alert.active .native-alert-tooltip .cancel-alert {
            display: block;
        }
        .native-alert.active .native-alert-tooltip .alert-me {
            display: none;
        }

        .native-alert-tooltip {
            position: absolute;
            pointer-events: none;
            left: 50%;
            bottom: 140%;
            width: 150px;
            background-color: #fefefe;
            border: 2px solid #d61c3b;
            -webkit-transform: translateX(-50%) translateY(10px);
            -ms-transform: translateX(-50%) translateY(10px);
            -moz-transform: translateX(-50%) translateY(10px);
            transform: translateX(-50%) translateY(10px);
            padding: 10px 0;
            opacity: 0;
            transition: opacity 0.3s ease, transform 0.4s ease;
            z-index: 3;
        }

        .native-alert-tooltip:after, .native-alert-tooltip:before {
            top: 100%;
            left: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
        }

        .native-alert-tooltip:after {
            border-color: rgba(255, 255, 255, 0);
            border-top-color: #ffffff;
            border-width: 10px;
            margin-left: -10px;
        }
        .native-alert-tooltip:before {
            border-color: rgba(214, 28, 59, 0);
            border-top-color: #d61c3b;
            border-width: 13px;
            margin-left: -13px;
        }

        .native-alert-tooltip p{
            font-size: 0.688em;
            text-align: center;
            color: #d61c3b;
            max-width: 100%;
        }

        .native-alert-tooltip p .cancel-alert {
            display: none;
        }



/* @end NATIVE ADD */

/* @group STICKY SOCIAL FOOTER MOBILE */
    .mobile-sticky-footer {
        height: 38px;
        position: fixed;
        display: none;
        width: 100%;
        background-color: #333b45;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 10;
    }
    
    .mobile-sticky-footer ul {
        height: 100%;
        width: 100%;
    }
        .mobile-sticky-footer ul li {
            display: inline-block;
            vertical-align: middle;
            height: 100%;
            width: 25%;
            border-right: 1px solid #757a7d;
            text-align: center;
            position: relative;
            padding: 5px 0;
        }

        .mobile-sticky-footer ul li a {display: block}

        .mobile-sticky-footer ul li:last-child {
            border-right: none;
        }
            
            .mobile-sticky-footer ul li svg {
                color: #fff;
            }
            
                .mobile-sticky-footer ul li svg path{
                    fill: #fff;
                }

    @media (max-width: 769px) {

        .mobile-sticky-footer {
            display: block;
        }
    }

/* @group STICKY SOCIAL FOOTER MOBILE */

/* @ test */
    .article-pub.test {
        margin-top: 200px;
    }
    /* Sticky Element */

    .sticky-element {
        position: relative;
        display: block;
        width: 100%;
        margin: 0;
        padding-top: 20px;
    }

        .sticky-element .flow-bloc,
        .sticky-element .circulation-bloc {
            margin: 0;
        }

    .sticky-element.stuck {
        position: fixed;
        top: 65px;
    }

    .sticky-element.pined-bottom {
        position: absolute;
        bottom: 0;
        margin-bottom: 0;
        padding-right: 0px;
        padding-left: 0px;
    }

    .sticky-element-container {
        position: relative;
        width: 100%;
        height: 700px;
    }

/* end test*/

/* @group DEBUG *
element:nth-child(even) {background-color: rgba(255, 154, 242, 0.2);}
element:nth-child(odd) {background-color: rgba(115, 254, 228, 0.2);}
/* @end DEBUG