@font-face {
  font-family: 'FinancierText';
  src:  url('../font/Financier_Text_Regular.woff2') format('woff2'),
        url('../font/Financier_Text_Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'FinancierText';
  src:  url('../font/Financier_Text_Regular_Italic.woff2') format('woff2'),
        url('../font/Financier_Text_Regular_Italic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: 'FinancierText';
  src:  url('../font/Financier_Text_Bold.woff2') format('woff2'),
        url('../font/Financier_Text_Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'FinancierText';
  src:  url('../font/Financier_Text_Bold_Italic.woff2') format('woff2'),
        url('../font/Financier_Text_Bold_Italic.woff') format('woff');
  font-weight: bold;
  font-style: italic;
}

/* roles [national] */



/**, :after, :before { box-sizing:border-box; }*/
html,body { margin:0; padding:0; height:100%; background-color:#FFFEF5; color:#231F20; }

body {
	font:400 20px/1.4 'FinancierText', times, serif;
}

p { margin:0; text-indent:30px; }
p:first-of-type { text-indent:0; }

p.def { margin-top:4px; margin-bottom:2px; text-indent:30px; font-weight:700; font-size:.7em; letter-spacing:.02em; text-transform:uppercase; font-family: 'Work Sans', sans-serif; }
.mask span { padding:4px 0; background-color:#BDDECD; }

p.mask, .mask + p, h2 + p, h3 + p, h4 + p  { text-indent:0; }
.mask a { margin-top:-4px; margin-bottom:-4px; padding-top:4px; padding-bottom:4px; border-bottom:0; text-decoration:none; }
.mask:hover span a { background-color:#91C9AC; }

p + .mask { margin-bottom:1.5em; }
ul.mask { margin-top:-.5em; }

.no-wrap { white-space:nowrap; }
.lang { position:absolute; top:16px; right:20px; font-size:14px; font-family:"Work Sans",sans-serif; text-transform:uppercase; color:#bddecd; }
.lang:hover { color:#8BCAAD; }

sup, sub {
  vertical-align: baseline;
  position: relative;
  top: -0.4em;
}
sub { 
  top: 0.4em; 
}

.overline { text-decoration:overline; }

.inner { margin:0 auto; padding:80px 60px; max-width:33em; }
.roles {
	margin:60px 0 0 20px;
	padding-left:20px; 
	border-left:3px solid #91C9AD;
}
.roles > p:first-child > strong:first-child { font-family: 'Work Sans', sans-serif; text-transform:uppercase; letter-spacing:.05em; }

@media screen and (min-width: 600px) {
	.green dt { clear:both; float:left; width:30%; }
	.green dd { float:right; width:70%; margin-left:0; margin-bottom:2em; }
}

ol.none { list-style:none; padding-left:0; }
ol.letter { list-style:upper-alpha; }

ul { padding-left:1em; }
li { margin-left:0; padding-left:.5em; }

img { max-width:100%; height:auto; }
figure { margin:0 0 3em; }
figcaption { margin-top:30px; font-size:.8em; font-family: 'Work Sans', sans-serif; }
figure.full img { display:block; margin:0 auto; max-width:100%; height:auto; }
figure .copy { position:relative; padding:2px 8px; margin-top:-21px; font-size:12px; font-family: 'Work Sans', sans-serif; float:right; background-color:rgba(0,0,0,.2); color:#fff; }
figure .copy abbr { border-bottom: 1px dotted rgba(255,255,255,.7); }


section { position:relative; min-height:500px; text-align:right; background-color:#011026; background-repeat:no-repeat; color:#B5D0C2; overflow:hidden; }
section .inner { position:relative; height:100%; }

section h2 { padding-top:160px; padding-bottom:200px; font-size:3em; font-weight:400; line-height:1.1; }
section h2 .l { float:left; width:10%; text-align:right; }
section h2 .r { float:left; padding-left:8px; width:90%; text-align:left; box-sizing:border-box; }

section .heptagone { position:absolute; left:-40%; top:-20%; padding-top:100%; width:100%; }
section .heptagone svg { width:100%; height:100%; position:absolute; top:0; left:0; opacity:.3; }

section.green { background-color:#91C9AC; color:#102640; text-align:left; }
section.green svg path,
section.green svg line,
section.green svg polygon { stroke:#102640; }

article a { border-bottom:2px solid #91C9AC; }
section.green a { border-bottom:2px solid #011026; }

section#head .inner { max-width:35em; }

h1 { margin:0; padding:80px 0; text-align:left; font-weight:400; font-size: 3em; line-height:1.2; }
.year { text-align:left; font-size:2em; font-family: 'Work Sans', sans-serif; letter-spacing:.05em; }
.fr h1 { font-size:2.5em; }

h2 { margin:0; padding:0; }
h3 { margin-top:2.5em; }

h3, h4, h5 { text-transform:uppercase; font-family: 'Work Sans', sans-serif; letter-spacing:.05em; }

h3.big { position:relative; margin:3em 0 2em; padding-left: 80px; color:#8BCAAD; font-size:2em; font-weight:400; letter-spacing:.05em; line-height: 1; font-family:'FinancierText', times, serif; text-transform:uppercase; }
h3.big .nb { position:absolute; left:0; top:-13px; width:60px; height:60px; line-height:60px; font-weight:inherit; text-align:center; border:1px solid #8BCAAD; border-radius:100%; text-indent:2px; }
h3.big.no-number { padding-left:0; }

a { color:inherit; text-decoration:none; }

table { margin-left:auto; margin-right:auto; border:0; border-collapse: collapse; }
table thead th,
table thead td,
table tfoot th,
table tfoot td { border-bottom:2px solid #231F20; font-weight:700; text-align:left; }
table tbody th,
table tbody td { border-bottom:1px solid #231F20; }
th, td { padding-top:.75em; padding-right:.75em; }
th.no-border, td.no-border { border-bottom-color:transparent; }

th.align-left { text-align:left; }
.table-2 .inner { max-width:1200px; }
.table-2 table { width:100%; }
.table-2 .renewal { position:relative; }
.table-2 .renewal:before { display:block; content:' '; position:absolute; width:15px; height:5px; bottom:-2px; left:-15px; background-color:#91C9AC; }
.table-caption { margin-top:2em; font-size:.8em; font-family: 'Work Sans', sans-serif; }

.with-legend .inner  { max-width:1000px; }
.with-legend .group { vertical-align:middle; }
.with-legend .group img:nth-child(1) { width:70%; height:auto; }
.with-legend .group img:nth-child(2) { width:25%; height:auto; margin-bottom:20%; }
.with-legend .table-caption { margin-left:auto; margin-right:auto; max-width:33em; }

@media screen and (max-width: 600px) {
	body { 	font:400 16px/1.4 'FinancierText', times, serif; }
	
	section { min-height:90%; }
	
	section h2 { padding-top:80px; padding-bottom:100px; font-size:2em; line-height:1.1; }
	h1 { font-size: 2.2em; }
	
	.lang { top:10px; right:10px; }
	
	.inner { padding-left:20px; padding-right:20px; max-width:100%; }
	
	.table-2 th, .table-2 td { font-size:12px; }
	.table-2 tr:nth-child(1) th,
	.table-2 tr:nth-child(2) th {
		font-size:10px;
	}

	.table-4 { font-size:14px; }
	
	.with-legend .group { text-align:center; }
	.with-legend .group img:nth-child(1) { width:100%; }
	.with-legend .group img:nth-child(2) { width:40%; margin-bottom:auto; }
	
	figure .copy { font-size:9px; margin-top:-16px; }
}

blockquote { position:relative; margin:5em 0; padding-left:100px; max-width:90%; font-size:.83em; font-family: 'Work Sans', sans-serif; }
blockquote:before { display:block; position:absolute; left:0; content: "“"; font-size:200px; line-height:200px; color:#91C9AC; }
blockquote cite { margin:1.5em 2em; display:block; }

.fr blockquote:before { content:"«"; top:-.35em; }

dt { font-weight:700; }

#page { position:relative; }

#head { border-bottom:3px solid rgba(255,255,255,.1); }

#toc-toggle { position:fixed; top:20px; left:20px; width:60px; height:60px; line-height:60px; text-align:center; background-color:#BDDECD;/*#8BCAAD;*/ border-radius:100%; color:#102640;/*#FFFEF5;*/ z-index:100; }
#toc-toggle:hover { background-color:#8BCAAD; }

#toc, #tdm { position:fixed; top:0; bottom:0; left:-400px; width:400px; height:100%; overflow-y:auto; background-color: #fffef5; border-right:2px solid #8BCAAD; z-index:99; text-align:left; }
#toc .inner, #tdm .inner { padding:30px 20px 30px; }

#toc a, #tdm a { border-bottom:0; }

#toc ol, #tdm ol { margin:0; padding:0; font-weight:700; list-style:none; line-height:1; }
#toc ol ol, #tdm ol ol { /*display:none;*/ margin-top:.4em; font-weight:400; }
#toc ol ol.open,
#toc li:hover > ol,
#tdm ol ol.open,
#tdm li:hover > ol { display:block !important; }
#toc li.current > p a, #tdm li.current > p a { background-color:#bddecd; }
#toc li a.active, #tdm li a.active { background-color:#bddecd; }

#toc ol li, #tdm ol li { margin:0; padding:.3em 0; }
#toc ol p, #tdm ol p { margin:0; }
#toc ol ol li, #tdm ol ol li { font-size:.83em; padding-left:1.15em; line-height:1.2; }
#toc ol ol li.third-level, #tdm ol ol li.third-level { padding-left:2em; }

.toc-open #toc,
.toc-open #tdm { left:0; }
.toc-open #toc-toggle { left:371px;}

@media screen and (min-width: 1280px) {
	.toc-open #page { padding-left:400px; }
}
@media screen and (max-width: 420px) {
	#toc, #tdm { width:90%; }
	#toc-toggle { top:-30px; left:50% !important; margin-left:-30px; padding-top:26px; line-height:30px; font-size:14px; box-sizing:border-box; }
	
	h3.big { padding-left: 0; color:#8BCAAD; font-size:1.6em; }
	h3.big .nb { position:relative; top:0; width:auto; height:auto; line-height:inherit; text-align:inherit; border:inherit; border-radius:inherit; }
	h3.big .nb:after { content: "."; }
	
	blockquote { margin:2em 0; padding-left:30px; max-width:100%; }
	blockquote:before { left:-10px; font-size:70px; line-height:70px; }
	blockquote cite { margin:1.5em; }
}

.top-heptagone { position: relative; margin:60px 0 0; width:100%; height:auto; padding-bottom:100%; }
.top-heptagone svg { width:100%; height:100%; position:absolute; top:0; left:0; }

.figure-1 .inner { max-width:1200px; }
.figure-1 svg { width:100%; height:auto; }
.figure-1 .table-caption { margin-left:auto; margin-right:auto; max-width:33em; text-align:left; }

.figure-2 .inner { max-width:900px; text-align:left; }
.figure-2 .inner p { margin:2em auto; max-width:33em; }

.figure-3 .inner { max-width:1200px; text-align:left; }
.figure-3 img { display:block; float:none; width:100%; }
.figure-3 .inner p { margin:2em auto; max-width:33em; }

@media screen and (min-width: 600px) {

	.top-heptagone { margin:60px 20% 0; width:60%; }

	.figure-3 img { display:block; float:left; width:50%; }
	
}

#footer { background-color:#011026; color:#B5D0C2; font-size:16px; }
#footer .logo { display:block; margin: 2em 0 2em; max-width:30%; height:auto; }
#footer p { float:left; padding-right:20px; text-indent:0; width:50%; box-sizing:border-box; }

#footer .copy { padding-top:0; }

section h2:after,
.group:after {
  content: "";
  display: table;
  clear: both;
}

/* grid list */

.grid-list { margin:0 auto; max-width:1440px; }
.grid-list::after { content: ""; display: table; clear: both; }

.grid-list > * { display:block; float:left; margin-right:20px; }

.xs-4-columns > * { width: calc(25% - 15px + 0px); }
.xs-3-columns > * { width: calc(33.3333% - 13.3333px + 0px); }
.xs-2-columns > * { width: calc(50% - 10px + 0px); }
.xs-1-column > * { width: 100%; }

.xs-4-columns > *:nth-child(4n),
.xs-3-columns > *:nth-child(3n),
.xs-2-columns > *:nth-child(2n) { margin-right:0; }

.xs-4-columns > *:nth-child(4n+1),
.xs-3-columns > *:nth-child(3n+1),
.xs-2-columns > *:nth-child(2n+1) { clear:left; }

.xs-show { display:initial; }
.xs-hidden { display:none; }

@media (min-width: 600px) { /* s-  600 to 960 */
	
	.xs-show { display:none; }
	.xs-hidden { display:initial; }
	
	
	.xs-4-columns > * { margin-right:40px; width: calc(25% - 30px + 0px); }
	.xs-3-columns > * { margin-right:40px; width: calc(33.3333% - 26.6667px + 0px); }
	.xs-2-columns > * { margin-right:40px; width: calc(50% - 20px + 0px); }
	.xs-1-column > *  { margin-right:40px; width: 100%; }
	
	.s-4-columns > * { width: calc(25% - 30px + 0px); }
	.s-3-columns > * { width: calc(33.3333% - 26.6667px + 0px); }
	.s-2-columns > * { width: calc(50% - 20px + 0px); }
	.s-1-column > *  { width: 100%; }
	
	.grid-list[class*=" s-"] > * { margin-right:40px; clear:none; }
	
	.s-4-columns > *:nth-child(4n),
	.s-3-columns > *:nth-child(3n),
	.s-2-columns > *:nth-child(2n) { margin-right:0; }

	.s-4-columns > *:nth-child(4n+1),
	.s-3-columns > *:nth-child(3n+1),
	.s-2-columns > *:nth-child(2n+1) { clear:left; }
}
@media (min-width: 960px) { /* m-  960 to 1280 */
	.m-4-columns > * { width: calc(25% - 30px + 0px); }
	.m-3-columns > * { width: calc(33.3333% - 26.6667px + 0px); }
	.m-2-columns > * { width: calc(50% - 20px + 0px); }
	.m-1-column > * { width: 100%; }
	
	.grid-list[class*=" m-"] > * { margin-right:40px; clear:none; }
	
	.m-4-columns > *:nth-child(4n),
	.m-3-columns > *:nth-child(3n),
	.m-2-columns > *:nth-child(2n) { margin-right:0; }

	.m-4-columns > *:nth-child(4n+1),
	.m-3-columns > *:nth-child(3n+1),
	.m-2-columns > *:nth-child(2n+1) { clear:left; }
}
@media (min-width: 1280px) { /* l-  1280 + */
	.l-4-columns > * { width: calc(25% - 30px + 0px); }
	.l-3-columns > * { width: calc(33.3333% - 26.6667px + 0px); }
	.l-2-columns > * { width: calc(50% - 20px + 0px); }
	.l-1-column > * { width: 100%; }
	
	.grid-list[class*=" l-"] > * { margin-right:40px; clear:none; }
	
	.l-4-columns > *:nth-child(4n),
	.l-3-columns > *:nth-child(3n),
	.l-2-columns > *:nth-child(2n) { margin-right:0; }

	.l-4-columns > *:nth-child(4n+1),
	.l-3-columns > *:nth-child(3n+1),
	.l-2-columns > *:nth-child(2n+1) { clear:left; }
}

abbr { border-bottom: 1px dotted rgba(0,0,0,.3); text-decoration: none !important; }
#abbr-tooltip {
  position: fixed;
  bottom: -5em;
  left: 0;
  right: 0;
  background-color: #FFF;
  border-top: 1px solid #000;
  text-align: center;
  font-size: 1.4em;
  padding: 1em .5em;
  transition: bottom cubic-bezier(.73,0,.27,1) .3s;
  will-change: transform;
  /* Layer hack to force the tooltip on to another layer */
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
#abbr-tooltip.visible {
  bottom: 0em;
}



/* animation */

#toc, #tdm, #toc-toggle  {
	-webkit-transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1);
	-moz-transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1);
	-ms-transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1);
	-o-transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1);
	transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1);
}
#page {
	-webkit-transition: padding-left 0.4s cubic-bezier(0.7, 0, 0.3, 1);
	-moz-transition: padding-left 0.4s cubic-bezier(0.7, 0, 0.3, 1);
	-ms-transition: padding-left 0.4s cubic-bezier(0.7, 0, 0.3, 1);
	-o-transition: padding-left 0.4s cubic-bezier(0.7, 0, 0.3, 1);
	transition: padding-left 0.4s cubic-bezier(0.7, 0, 0.3, 1);
}
