@charset "UTF-8";
/* UTF-8 before doing anything */

/**
 * ROCSSTI: a CSS base by Nicolas Hoffmann https://rocssti.net/en/
 * Builder: https://rocssti.net/en/builder-css 
 * inspired by http://www.knacss.com/
 * 
 * A Röcssti-quote, only for pleasure:
 * “Röcssti is a revolution.” — Steeve Jobs 
 *
 * ROCSSTI is under MIT license: https://github.com/nico3333fr/ROCSSTI/blob/master/LICENSE
 *
 * this CSS is provided "as is", without any warranty of any type,
 * author can’t be responsible of anything you might do with RÖCSSTI
 *
 * convention (adapt if needed)
 *  .parent
 *  .parent__child
 *  .parent--modifier 
 * 
 *
 * RTL = Right To Left =>
 * to adapt a website in a language that is written from right to left
 * designed for multilingual websites with LTR et RTL
 *  
 * 
 * summary
 * 01 -- reset
 * 02 -- webfonts + Hx structure
 * 03 -- useful classes (utils) + typo fix + styles for "fixed tags"
 * 04 -- links + icons
 * 05 -- layout & modules
 * 06 -- structure (page / skip links / header / main content / footer)
 * 07 -- forms
 * 08 -- inside content
 * 09 -- minor breakpoints between desktop and tablets
 * 10 -- tablets - major breakpoint
 * 11 -- minor breakpoints between tablets and mobile
 * 12 -- mobile - major breakpoint
 * 13 -- minor breakpoints for very small mobiles
 * 14 -- print
 * 15 -- fix viewport
 * 16 -- state classes
 * 17 -- bonus: Fixes IE
 */




/*
 *****************************************************************
 * 1 -- reset
 *****************************************************************
 */

/* for HTML 5 */
article, aside, datagrid, datalist, details, dialog, figure, footer, header, main, menu, nav, section { display: block; }
audio, canvas, progress, video { display: inline-block; }
abbr, eventsource, mark, meter, time, output, bb { display: inline; }

/* to comment/fallback if you care about IE<8 */
html { box-sizing: border-box; }
*, *:before, *:after {
  box-sizing: inherit;
  outline: 0;
}

/* reset minimum */
html, body, blockquote, ul, ol, form, button { margin: 0; padding: 0; }
button { border: 0; }
p, ul, ol, dl, blockquote, pre, td, th, label, textarea {
  font-size: 1em; /* equiv 16px */
  line-height: 1.5;
  margin: 1.5em 0;
}

/* reset buttons, remember to style them in forms */
input, select, textarea, optgroup, button {
  background: transparent;
  border: 0;
  font: inherit;
  /* -webkit-appearance: none; */
}
/* fix display img/iframe */
img,
iframe { vertical-align: middle; }

ul, ol { padding-left: 2em; }

.boxed-images {
	border: #ccc 1px solid !important;
}

.unstyled {
  padding-left: 0;
  list-style-type: none;
}
[dir="rtl"] ul, 
[dir="rtl"] ol { 
  padding-left: 0; 
  padding-right: 2em;
}
[dir="rtl"] .unstyled {
  padding-right: 0;
}

/* base font size at 10px */
html { 
  font-size: 62.5%;
  /* IE9-IE11 math fixing. See https://connect.microsoft.com/IE/feedback/details/816709/ */
  /* Thanks to @guardian, @victorbritopro, @eQRoeil & Knacss */
  font-size: calc(1em * 0.625);
}
body {
  background: #fff;
  color: #000;
  font-family: 'roboto', Arial, sans-serif;
  font-size: 1.6em; /* equiv 16px */
  line-height: 1.5; /* to update if needed */
}
/* font adaptation */
[dir="rtl"],
[dir="rtl"] body {
  font-family: 'Droid Arabic Naskh','roboto', Arial, sans-serif;
}
/*[lang=ru] body {
  font-family:  'Droid Arabic Naskh','roboto', Arial, sans-serif;
}*/




/*
 *****************************************************************
 * 02 -- webfonts + Hx structure 
 *****************************************************************
 */ 

@font-face {
    font-family: 'roboto';
    src: url('fonts/Roboto-Light-webfont.eot');
    src: url('fonts/Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Roboto-Light-webfont.woff2') format('woff2'),
         url('fonts/Roboto-Light-webfont.woff') format('woff'),
         url('fonts/Roboto-Light-webfont.ttf') format('truetype'),
         url('fonts/Roboto-Light-webfont.svg#robotolight') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    /*font-family: 'robotolight_italic';*/
	font-family: 'roboto';
    src: url('fonts/Roboto-LightItalic-webfont.eot');
    src: url('fonts/Roboto-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Roboto-LightItalic-webfont.woff2') format('woff2'),
         url('fonts/Roboto-LightItalic-webfont.woff') format('woff'),
         url('fonts/Roboto-LightItalic-webfont.ttf') format('truetype'),
         url('fonts/Roboto-LightItalic-webfont.svg#robotolight_italic') format('svg');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    /*font-family: 'roboto_bold';*/
    font-family: 'roboto';
    src: url('fonts/Roboto-Bold-webfont.eot');
    src: url('fonts/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Roboto-Bold-webfont.woff2') format('woff2'),
         url('fonts/Roboto-Bold-webfont.woff') format('woff'),
         url('fonts/Roboto-Bold-webfont.ttf') format('truetype'),
         url('fonts/Roboto-Bold-webfont.svg#robotolight') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'robotomedium';
	/*font-family: 'roboto';*/
    src: url('fonts/Roboto-Medium-webfont.eot');
    src: url('fonts/Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Roboto-Medium-webfont.woff2') format('woff2'),
         url('fonts/Roboto-Medium-webfont.woff') format('woff'),
         url('fonts/Roboto-Medium-webfont.ttf') format('truetype'),
         url('fonts/Roboto-Medium-webfont.svg#robotomedium') format('svg');
    font-weight: normal;
    font-style: normal;
}


/* other for titles */
@font-face {
    font-family: 'roboto_regular';
    /*font-family: 'roboto';*/
    src: url('fonts/Roboto-Regular-webfont.eot');
    src: url('fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Roboto-Regular-webfont.woff2') format('woff2'),
         url('fonts/Roboto-Regular-webfont.woff') format('woff'),
         url('fonts/Roboto-Regular-webfont.ttf') format('truetype'),
         url('fonts/Roboto-Regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'roboto_slab';
    src: url('fonts/RobotoSlab-Regular-webfont.eot');
    src: url('fonts/RobotoSlab-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/RobotoSlab-Regular-webfont.woff2') format('woff2'),
         url('fonts/RobotoSlab-Regular-webfont.woff') format('woff'),
         url('fonts/RobotoSlab-Regular-webfont.ttf') format('truetype'),
         url('fonts/RobotoSlab-Regular-webfont.svg#roboto_slabregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'Droid Arabic Naskh';
  font-style: normal;
  font-weight: normal;
  src: url('fonts/DroidNaskh-Regular.eot');
  src: url('fonts/DroidNaskh-Regular.eot?#iefix') format('embedded-opentype'),
       url('fonts/DroidNaskh-Regular.woff2') format('woff2'),
       url('fonts/DroidNaskh-Regular.woff') format('woff'),
       url('fonts/DroidNaskh-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Droid Arabic Naskh';
  font-style: normal;
  font-weight: bold;
  src: url('fonts/DroidNaskh-Bold.eot');
  src: url('fonts/DroidNaskh-Bold.eot?#iefix') format('embedded-opentype'),
       url('fonts/DroidNaskh-Bold.woff2') format('woff2'),
       url('fonts/DroidNaskh-Bold.woff') format('woff'),
       url('fonts/DroidNaskh-Bold.ttf') format('truetype');
}

.robotomedium { font-family: 'robotomedium'; font-weight: normal; }
.robotoslab { font-family: 'roboto_slab'; font-weight: normal; }
[dir="rtl"] .robotomedium { font-family: 'Droid Arabic Naskh'; }
[dir="rtl"] .robotoslab { font-family: 'Droid Arabic Naskh'; }

/* calculated via https://rocssti.net/en/builder-css
 * based on http://soqr.fr/vertical-rhythm/ thanks @goetter & @eQRoeil */

h1,
.h1 {
  display: block;
  font-size: 1.625em; /* equiv 26px */
  line-height: 1.3;
  margin: 0 0 .92308em 0;
  font-weight: bold;
}
h2,
.h2 {
  display: block;
  font-size: 1.5em; /* equiv 24px */
  line-height: 1.3;
  margin: 0 0 .5em 0;
  font-weight: bold;
}
h3,
.h3 {
  display: block;
  font-size: 1.375em; /* equiv 22px */
  line-height: 1.3;
  margin: 0 0 1.09091em 0;
  font-weight: bold;
}
h4,
.h4 {
  display: block;
  font-size: 1.25em; /* equiv 20px */
  line-height: 1.3;
  margin: 0 0 1.2em 0;
}
h5,
.h5 {
  display: block;
  font-size: 1.125em; /* equiv 18px */
  line-height: 1.33333;
  margin: 0 0 1.33333em 0;
}
h6,
.h6 {
  display: block;
  font-size: 1em; /* equiv 16px */
  line-height: 1.5;
  margin: 0 0 1.5em 0;
}

[dir="rtl"] h1, [dir="rtl"] .h1,
[dir="rtl"] h2, [dir="rtl"] .h2,
[dir="rtl"] h3, [dir="rtl"] .h3,
[dir="rtl"] h4, [dir="rtl"] .h4 {
  font-family: 'Droid Arabic Naskh','roboto_slab';
}

.uppercase {
  text-transform: uppercase;
}

/*  other useful classes */
.smaller {
  font-size: .625em; /* equiv 10px */
  line-height: 2.4;
  margin: 2.4em 0;
}
.small {
  font-size: .75em; /* equiv 12px */
  line-height: 2;
  margin: 2em 0;
}
.big {
  font-size: 1em; /* equiv 16px */
  line-height: 1.5;
  margin: 1.5em 0;
}
.bigger {
  font-size: 1.125em; /* equiv 18px */
  line-height: 1.33333;
  margin: 1.33333em 0;
}
.biggest {
  font-size: 1.25em; /* equiv 20px */
  line-height: 1.2;
  margin: 1.2em 0;
}

.fs12p { font-size: 1.2rem;  /*line-height: 1.9rem;*/ }
.fs19p { font-size: 1.9rem;  /*line-height: 1.9rem;*/ }
.fs20p { font-size: 2rem; /*line-height: 2rem;*/ }
.fs22p { font-size: 2.2rem;/*line-height: 2.4rem;*/ }
.fs24p { font-size: 2.4rem; font-weight: bold;/*line-height: 2.4rem;*/ }
.fs26p { font-size: 2.6rem; font-weight: bold;/*line-height: 2.6rem;*/ }
.fs35p { font-size: 3.5rem; font-weight: bold;/*line-height: 3.5rem;*/ }
.fs40p { font-size: 4rem; font-weight: bold;/*line-height: 4rem;*/ }
.fs43p { font-size: 4.3rem; font-weight: bold;/*line-height: 4.3rem;*/ }
.fs50p { font-size: 5rem; font-weight: bold;/*line-height: 5rem;*/ }
.fs51p { font-size: 5.1rem; font-weight: bold;/*line-height: 5.1rem;*/ }
.fs56p { font-size: 5.6rem; font-weight: bold;/*line-height: 5.6rem;*/ }
.fs70p { font-size: 7rem; font-weight: bold;/*line-height: 5.6rem;*/ }

.lh120 { line-height: 1.2; }
.lh130 { line-height: 1.3; }


/*
 *****************************************************************
 * 03 -- useful classes (utils) + typo fix + styles for "fixed tags"
 *****************************************************************
 */

.noborder,
iframe,
dialog { border: 0; }

/*
 * taken from http://tinytypo.tetue.net/ made by @tetue
 * tuned with the help of http://www.nicolas-hoffmann.net/utilitaires/codes-hexas-ascii-unicode-utf8-caracteres-usuels.php
 *
 * see http://en.wikipedia.org/wiki/International_variation_in_quotation_marks for reference
 */
q,
:lang(en) > q,
:lang(ar) > q {
  quotes: "\201C" "\201D" "\2018" "\2019";
}
:lang(fr) > q {
  quotes: "\00AB\A0" "\A0\00BB" "\201C" "\201D" "\2018" "\2019";
}
:lang(es) > q {
  quotes: "\00AB" "\00BB" "\201C" "\201D";
}
:lang(ru) > q {
  quotes: "\00AB" "\00BB" "\201E" "\201F";
}
q:before {
  content: open-quote;
}
q:after {
  content: close-quote;
}

/* avoid ugly line-height */
sup,
sub {
  vertical-align: 0;
  position: relative;
}
sup {
  bottom: 1ex;
}
sub {
  top: .5ex;
}





/* avoid margin on nested elements */
li p,
li ul {
  margin-bottom: 0;
  margin-top: 0;
}
/* Thou shalt not pass (Moïse or Gandalf, don’t remember) */
/*textarea,
table,
td,
th,
code,
pre,
samp,
div,
p,*/
.cut, .break {
  word-wrap: break-word;
}
@supports (-webkit-hyphens: auto) or (-ms-hyphens: auto) or (hyphens: auto) {
  /*textarea,
  table,
  td,
  th,
  code,
  pre,
  samp,
  div,
  p,*/
  .cut {
    word-wrap: normal;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
  }
}
/* remove hyphenation if needed */
.nocut {
  word-wrap: normal;
}
@supports (-webkit-hyphens: auto) or (-ms-hyphens: auto) or (hyphens: auto) {
  .nocut {
    -webkit-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
  }
}

code,
pre,
samp {
  white-space: pre-wrap;
}
code {
  line-height: 1;
}
kbd {
  border: solid 1px;
  border-top-left-radius: .5em;
  border-top-right-radius: .5em;
  padding: 0 .25em;
}
table {
  margin-bottom: 1.5em;
  table-layout: fixed;
}
/* important, abbr are good */
/* only those with a title are shown */
abbr[title] {
  border-bottom: dotted 1px; 
  cursor: help;
  text-decoration: none;
  /* color inherited from text */
} 

/* text aligns */
.alignright  { text-align: right; }
.aligncenter { text-align: center; }
.alignleft   { text-align: left; }

/* RTL */
[dir="rtl"] .alignright  { text-align: left; }
[dir="rtl"] .alignleft   { text-align: right; }




/*
 *****************************************************************
 * 04 -- links + icons
 *****************************************************************
 */

/* links */
a {
  color: #2573be;
  cursor: pointer;
}
/* remember focus */
a:focus,
a:hover,
a:active {
  color: #000;
}
/* avoid border on images in links + fix border image IE */
a:link img,
a:visited img, 
img {
  border-style: none;
}

.nodecoration {
  text-decoration: none;
}
/*.promote {
width: auto;
height: 10em;
}
.engage {
width: auto;
height: 10em;
}
.reflect {
width: auto;
height: 10em;
}*/

.promoteicon {
	position: relative; 
	display: block;
	margin: 0 auto;
	width: auto;
	height: 10em;
}
.promote:hover .promoteicon img {
	content: url(../images/icons/icon-promote-hover.svg);
}

.engageicon {
	position: relative; 
	display: block;
	margin: 0 auto;
	width: auto;
	height: 10em;
}
.engage:hover .engageicon img {
	content: url(../images/icons/icon-engage-hover.svg);
}

.reflecticon {
	position: relative; 
	display: block;
	margin: 0 auto;
	width: auto;
	height: 10em;
}
.reflect:hover .reflecticon img {
	content: url(../images/icons/icon-reflect-hover.svg);
}
/* links with icons, may use DATA-URI */

/* external links */
/*a[href^="http://"],
a[href^="https://"] {

}*/
/* if full URL of the website in an internal link, remove icon */
/*a[href^="http://www.mydomaine.com"] {

}*/
/* contact, mailto links */
/*.mail,
a[href^="mailto:"] {

}*/
/* if URL ends with .pdf or whatever */
/*a[href$=".pdf"] {

}*/

/* facto icons */
/*[class*=icon-30] {
  display: inline-block;
  width: 30px;
  height: 30px;
}*/





/*
 *****************************************************************
 * 05 -- layout & modules
 *****************************************************************
 */

/**
 * layout
 */


/* it depends, it exceeds (french joke) */
img,
table,
td,
blockquote,
code,
pre,
textarea,
input,
svg {
  height: auto;
  max-width: 100%;
}
/* no reset on embed, object & video, some players don’t like */

blockquote {
	color: #003260;
	font-size: 1.9rem;
	border-left:10px solid #faa838;
	padding: 0 0 0 1em;
}
[dir=rtl] blockquote {
	border-left: 0;
	border-right: 10px solid #faa838;
  padding: 0 1em 0 0;
}

legend {
	color: #000;
	font-size: 1.6rem;
}

/* useful to manage floats */
/* containing floats */
.mod {
  overflow: auto;
}
.mod--hidden,
.no-scroll { 
  overflow: hidden;
}

/* some floattings */
.left {
  float: left;
}
.right {
  float: right;
}

/* clear floats */
.clear {
  clear: both;
}
/*
.clearleft {
  clear: left;
}
.clearright {
  clear: right;
}
*/
/*
.clearhidden {
  clear: both;
  margin: 0;
  padding: 0;
  visibility: hidden;
}
*/
/*
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
*/

/* RTL */
[dir="rtl"] .left {
  float: right;
}
[dir="rtl"] .right {
  float: left;
}
/*
[dir="rtl"] .clearleft {
  clear: right;
}
[dir="rtl"] .clearright {
  clear: left;
}
*/



/* gut : "spacing" empty div */
.gut {
  height: 1px;
}

/* table-design in CSS */
.row {
  display: table;
  table-layout: fixed;
}
.inline-row {
  display: inline-table;
  table-layout: fixed;
}
.line {
  display: table-row;
}
.col {
  display: table-cell;
  vertical-align: top;
}
.col-noalign {
  display: table-cell;
}

/* alignments */
.aligntop    { vertical-align: top; }
.alignbottom { vertical-align: bottom; }
.alignmiddle { vertical-align: middle; }

/* block */
.bl {
  display: block;
}

/* inline-block, useful for grids, and not only */
.inbl,
.grid {
  display: inline-block;
}

/* grid = element of inline-grid */
.grid {
  vertical-align: top;
}

/* to relativize */
.relative {
  position: relative;
}

/* centered block */
.center {
  margin-left: auto;
  margin-right: auto;
}

/* hardware-acceleration activation */
.hardware-accelerated {
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
}


/* block widths */
.w1   { width: 1%; }
.w2   { width: 2%; }
.w3   { width: 3%; }
.w4   { width: 4%; }
.w5   { width: 5%; }
.w10  { width: 10%; }
.w20  { width: 20%; }
.w25  { width: 25%; }
.w30  { width: 30%; }
.w33  { width: 33.333%; }
.w40  { width: 40%; }
.w45  { width: 45%; }
.w48  { width: 48%; }
.w49  { width: 49%; }
.w50  { width: 50%; }
.w60  { width: 60%; }
.w66  { width: 66.666%; }
.w70  { width: 70%; }
.w75  { width: 75%; }
.w80  { width: 80%; }
.w90  { width: 90%; }
.w100 { width: 100%; }

/* here you may add em widths */
/*.w960e { width: 60em; }*/
.w12e { width: 12em; }

/* here you may add pixel widths */
/*.w500p { width: 500px; }*/
.w16p { width: 16px; }
.w40p { width: 40px; }
.w100p { width: 100px; }
.w150p { width: 150px; }
.w160p { width: 160px; }
.w200p { width: 200px; }

/* here you may add em max-widths */
/*.mw960e { max-width: 60em; }*/

/* here you may add pixel max-widths */
/*.mw960p { max-width: 960px; }*/
.mw475px {max-width: 475px; }

/* margins */
.mt0 { margin-top: 0; }
.mt0-5 { margin-top: .5em; }
.mt1 { margin-top: 1em; }
.mt1-5{ margin-top: 1.5em; }
.mt2 { margin-top: 2em; }
[dir="ltr"] .mr0 { margin-right: 0; }
[dir="ltr"] .mr0-5 { margin-right: .5em; }
[dir="ltr"] .mr1 { margin-right: 1em; }
[dir="ltr"] .mr2 { margin-right: 2em; }
.mb0 { margin-bottom: 0; }
.mb0-5 { margin-bottom: .5em; }
.mb1 { margin-bottom: 1em; }
.mb2 { margin-bottom: 2em; }
[dir="ltr"] .ml0 { margin-left: 0; }
[dir="ltr"] .ml0-5 { margin-left: .5em; }
[dir="ltr"] .ml1 { margin-left: 1em; }
[dir="ltr"] .ml2 { margin-left: 2em; }
.m0 { margin: 0; }
.m0-5 { margin: .5em; }
.m1 { margin: 1em; }
.m2 { margin: 2em; }

/* RTL = warning, use with caution */
[dir="rtl"] .mr0 { margin-left: 0; }
[dir="rtl"] .mr0-5 { margin-left: .5em; }
[dir="rtl"] .mr1 { margin-left: 1em; }
[dir="rtl"] .mr2 { margin-left: 2em; }
[dir="rtl"] .ml0 { margin-right: 0; }
[dir="rtl"] .ml0-5 { margin-right: .5em; }
[dir="rtl"] .ml1 { margin-right: 1em; }
[dir="rtl"] .ml2 { margin-right: 2em; }

/* paddings */
.pt0 { padding-top: 0; }
.pt0-5 { padding-top: .5em; }
.pt1 { padding-top: 1em; }
.pt1-9 { padding-top: 1.9em; }
.pt2 { padding-top: 2em; }
.pt3 { padding-top: 3em; }
.pt4 { padding-top: 4em; }
.pt6 { padding-top: 6em; }

[dir="ltr"] .pr0 { padding-right: 0; }
[dir="ltr"] .pr0-5 { padding-right: .5em; }
[dir="ltr"] .pr1 { padding-right: 1em; }
[dir="ltr"] .pr2 { padding-right: 2em; }
.pb0 { padding-bottom: 0; }
.pb0-5 { padding-bottom: .5em; }
.pb1 { padding-bottom: 1em; }
.pb2 { padding-bottom: 2em; }
[dir="ltr"] .pl0 { padding-left: 0; }
[dir="ltr"] .pl0-5 { padding-left: .5em; }
[dir="ltr"] .pl1 { padding-left: 1em; }
[dir="ltr"] .pl2 { padding-left: 2em; }
[dir="ltr"] .pl3 { padding-left: 3em; }
.p0 { padding: 0; }
.p0-5 { padding: .5em; }
.p1 { padding: 1em; }
.p2 { padding: 2em; }

/* RTL = warning, use with caution */
[dir="rtl"] .pr0 { padding-left: 0; }
[dir="rtl"] .pr0-5 { padding-left: .5em; }
[dir="rtl"] .pr1 { padding-left: 1em; }
[dir="rtl"] .pr2 { padding-left: 2em; }
[dir="rtl"] .pl0 { padding-right: 0; }
[dir="rtl"] .pl0-5 { padding-right: .5em; }
[dir="rtl"] .pl1 { padding-right: 1em; }
[dir="rtl"] .pl2 { padding-right: 2em; }
[dir="rtl"] .pl3 { padding-right: 3em; }

.pt20p { padding-top: 20px; }
.pt60p { padding-top: 60px; }
.pl80p { padding-left: 80px; }
.pl30p { padding-left: 30px; }

/* for 1px-high hr */
hr {
  background-color: #ccc;
  border: 0;
  color: #ccc;
  height: 1px;
  margin: 0 0 1em;
  padding: 0;
}

/* to hide text with accessibility… a11y */
.invisible {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.nonvisible { visibility: hidden; }

.hidden, [hidden]  { display: none; } /* hidden everywhere */
.nodesktop { display: none; } /* hidden on desktop */
/*.noprint   {} /* hidden on print */
/*.notablet  {} /* hidden on tablets */
/*.nomobile  {} /* hidden on mobile */


/**
 * modules
 */

.pledge-animated-modal-overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  height: 100%;
  z-index: 66666666;
}
/* pledge modal */
.pledge-animated-modal-overlay {
  background: #000;
  background: rgba(0, 0, 0, .8);
}
.pledge-animated-modal {
  position: fixed;
  top: 15%;
  /*left: 0;
  right: 0;*/
  margin: 0 20%;
  width: 60%;
  z-index: 6677777777777;
  padding: 0;
  text-align: left;
  background: #fff;
}
[dir="rtl"] .pledge-animated-modal {
  text-align: right;
}
.pledge-animated-modal-title {
  margin: 0;
  font-size: 1.5em;
  color: #fff;
  background: #364c97;
  padding: 1em 2em 1em 1em;
  
}
.pledge-animated-modal-close {
  position: absolute;
  right: 0;
  top: 1em;
  width: 2.875em; /* 30+16 */
  height: 2.875em;
  background: url(../images/icons/burgericon2.svg) center center no-repeat;
  font: inherit;
  /*display:none; */ /* noooooooooooon */
}
[dir="rtl"] .pledge-animated-modal-close {
  left: 0;
  right: auto;
}


.pledge-animated-modal {
/*max-width: 560px;
margin: auto;*/

}

.pledge-animated-modal div {
position: relative;
height: 0;
padding-bottom: 56.25%;
}

.pledge-animated-modal div.vertical {
padding-bottom: 48%;
}
.pledge-animated-modal div.vertical2 {
position: relative;
	height: auto;
padding-bottom: 45%;
}

.pledge-animated-modal iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


/* accordion */
.animated-accordion__panel[aria-hidden=true] {
  display: none;
}

.animated-accordion__header {
  display: block;
  position: relative;
  width: 100%;
  text-align: left;
  border-top: 1px solid #ccc;
  color: #01448B;
  padding: 1em 2.5em 0 0;
  font-size: 2rem;
  font-weight: bold;
  outline: 0;
}

[dir="rtl"] .animated-accordion__header {
  text-align: right;
  padding: 1em 0 0 2.5em;
}
.animated-accordion__header[aria-expanded="false"] {
  /*border-bottom: 1px solid #ccc;*/
  padding: 1em 2.5em 1em 0;
}
[dir="rtl"] .animated-accordion__header[aria-expanded="false"] {
  padding: 1em 0 1em 2.5em;
}

/* title opened */
.animated-accordion__header[aria-expanded="true"]:after {
  content: "";
  display: inline-block;
  width: 48px;
  height: 48px;
  background: url(../images/icons/expand-less.svg) no-repeat 0 0;
  position: absolute;
  border-bottom:0;
  right: 0;
}
[dir="rtl"] .animated-accordion__header[aria-expanded="true"]:after {
  left: 0;
  right: auto;
}
/* title closed */
.animated-accordion__header[aria-expanded="false"]:after {
  content: "";
  display: inline-block;
  width: 48px;
  height: 48px;
  background: url(../images/icons/expand-more.svg) no-repeat 0 0;
  position: absolute;
  right: 0;
}
[dir="rtl"] .animated-accordion__header[aria-expanded="false"]:after {
  left: 0;
  right: auto;
}

.humanrightsdays2020 .animated-accordion__header { 
	border: 0;
	color: #006FB7;
}

.animated-accordion__title { display: none; }

.animated-accordion__panel {
  display: block;
  overflow: hidden;
  opacity: 1;
  transition: visibility 0s ease, max-height .5s ease, opacity .5s ease ;
  /* max-height: 400em; */
  /* magic number for max-height = enough height */
  visibility: visible;
  transition-delay: 0s;
  margin: 0;
  padding: 0;
  /*border-bottom: 1px solid #ccc;*/
}
/* This is the hidden state */
[aria-hidden=true].animated-accordion__panel {
  display: block;
  max-height: 0;
  opacity: 0;
  visibility: hidden;
  transition-delay: .5s, 0s, 0s;
  margin: 0;
  padding: 0;
}
[data-accordion-prefix-classes="animated-accordion"] {
  border-bottom: 1px solid #ccc;
}

.humanrightsdays2020 [data-accordion-prefix-classes="animated-accordion"] {
  border-bottom: 0;
}


/* expands */
.animated-before-expandmore__button {
  width: 100%;
  position: relative;
  padding-bottom: 2.5em;
  color: #01448B;
  font-weight: bold;
  background: linear-gradient( to top, transparent 19px, #ccc 20px, transparent 21px );
}
.animated-before-expandmore__button:after {
  content: '+';
  font-family: 'roboto';
  position: absolute;
  left: calc(50% - 20px);
  bottom: 0;
  width: 40px;
  height: 40px;
  z-index: 66;
  background: #01448B;
  border-radius: 50%;
  color: #fff;
  font-size: 2.45em;
  line-height: .95;
  font-weight: normal;
}
[aria-expanded="true"].animated-before-expandmore__button {
  color: #fff;  
}
[aria-expanded="true"].animated-before-expandmore__button:after {
  content: '−';
}

.animated-before-expandmore__to_expand {
  display: block;
  overflow: hidden;
  opacity: 1;
  transition: visibility 0s ease, max-height .5s ease, opacity .5s ease ;
  max-height: 120em;
  /* magic number for max-height = enough height */
  visibility: visible;
  transition-delay: 0s;
}
/* This is the hidden state */
[data-hidden=true].animated-before-expandmore__to_expand {
  display: block;
  max-height: 0;
  opacity: 0;
  visibility: hidden;
  transition-delay: .5s, 0s, 0s;
}



/* carrousels */
.carrousel__container {
  
}
.carrousel__content[aria-hidden=true] {
  display: none;
}
.carrousel__content[aria-hidden=true] {
  white-space: normal;
}

/* exemple styles */
.news-carrousel__container {
  white-space: nowrap;
}
.news-carrousel__control__list {
  position: absolute;
  list-style-type: none;
  top: 100%;
  right: 0;
  left: 0;
  margin-top: -0.5em;
  padding-left: 0;
  text-align: center;
  display: none;
}
.news-carrousel__control__list__item {
  display: inline-block;
  margin: 0 .5em;
}
.news-carrousel__control__list__link {
  display: inline-block;
  width: 1em;
  height: 1em;
  background: #fff;
  border: 1px solid #666;
  border-radius: 1em;
}

.news-carrousel__button-container {
  position: absolute;

}
.news-carrousel__button__previous {
  top: 50%;
  margin-top: -40px;
  left: 0;
  margin-left: -40px;
}
[dir=rtl] .news-carrousel__button__previous {
  	left: auto;
  	right: 0;
	margin-right: -40px;
	margin-left: 0;
}
.news-carrousel__button__next {
  top: 50%;
  margin-top: -40px;
  right: 0;
  margin-right: -40px;
}
[dir=rtl] .news-carrousel__button__next {
	right: auto;
	left: 0;
	margin-left: -40px;
	margin-right: 0;
}
.news-carrousel__button__button {
  margin: 0;
  padding: 0;
  background: transparent;
}


/* ------------------ transition slide ------------------ */
.slide .carrousel__content {
  display: inline-block;
  vertical-align: top;
  visibility: visible;
  width: 100%;
  position: relative;
  -webkit-transition: left .5s ease-in;
  -moz-transition: left .5s ease-in;
  -o-transition: left .5s ease-in;
  -ms-transition: left .5s ease-in;
  transition: left .5s ease-in;
  white-space: normal;
}

.slide .carrousel__content.visibility-off {
  visibility: hidden;
}

.carrouselslide-1-1.slide > div,
.carrouselslide-2-1.slide > div,
.carrouselslide-3-1.slide > div,
.carrouselslide-4-1.slide > div,
.carrouselslide-5-1.slide > div,
.carrouselslide-6-1.slide > div,
.carrouselslide-7-1.slide > div,
.carrouselslide-8-1.slide > div,
.carrouselslide-9-1.slide > div,
.carrouselslide-10-1.slide > div {
  left: 0;
}
.carrouselslide-1-2.slide > div,
.carrouselslide-2-2.slide > div,
.carrouselslide-3-2.slide > div,
.carrouselslide-4-2.slide > div,
.carrouselslide-5-2.slide > div,
.carrouselslide-6-2.slide > div,
.carrouselslide-7-2.slide > div,
.carrouselslide-8-2.slide > div,
.carrouselslide-9-2.slide > div,
.carrouselslide-10-2.slide > div {
  left: -100%;
}
.carrouselslide-1-3.slide > div,
.carrouselslide-2-3.slide > div,
.carrouselslide-3-3.slide > div,
.carrouselslide-4-3.slide > div,
.carrouselslide-5-3.slide > div,
.carrouselslide-6-3.slide > div,
.carrouselslide-7-3.slide > div,
.carrouselslide-8-3.slide > div,
.carrouselslide-9-3.slide > div,
.carrouselslide-10-3.slide > div {
  left: -200%;
}
.carrouselslide-1-4.slide > div,
.carrouselslide-2-4.slide > div,
.carrouselslide-3-4.slide > div,
.carrouselslide-4-4.slide > div,
.carrouselslide-5-4.slide > div,
.carrouselslide-6-4.slide > div,
.carrouselslide-7-4.slide > div,
.carrouselslide-8-4.slide > div,
.carrouselslide-9-4.slide > div,
.carrouselslide-10-4.slide > div {
  left: -300%;
}
.carrouselslide-1-5.slide > div,
.carrouselslide-2-5.slide > div,
.carrouselslide-3-5.slide > div,
.carrouselslide-4-5.slide > div,
.carrouselslide-5-5.slide > div,
.carrouselslide-6-5.slide > div,
.carrouselslide-7-5.slide > div,
.carrouselslide-8-5.slide > div,
.carrouselslide-9-5.slide > div,
.carrouselslide-10-5.slide > div {
  left: -400%;
}
.carrouselslide-1-6.slide > div,
.carrouselslide-2-6.slide > div,
.carrouselslide-3-6.slide > div,
.carrouselslide-4-6.slide > div,
.carrouselslide-5-6.slide > div,
.carrouselslide-6-6.slide > div,
.carrouselslide-7-6.slide > div,
.carrouselslide-8-6.slide > div,
.carrouselslide-9-6.slide > div,
.carrouselslide-10-6.slide > div {
  left: -500%;
}
.carrouselslide-1-7.slide > div,
.carrouselslide-2-7.slide > div,
.carrouselslide-3-7.slide > div,
.carrouselslide-4-7.slide > div,
.carrouselslide-5-7.slide > div,
.carrouselslide-6-7.slide > div,
.carrouselslide-7-7.slide > div,
.carrouselslide-8-7.slide > div,
.carrouselslide-9-7.slide > div,
.carrouselslide-10-7.slide > div {
  left: -600%;
}
.carrouselslide-1-8.slide > div,
.carrouselslide-2-8.slide > div,
.carrouselslide-3-8.slide > div,
.carrouselslide-4-8.slide > div,
.carrouselslide-5-8.slide > div,
.carrouselslide-6-8.slide > div,
.carrouselslide-7-8.slide > div,
.carrouselslide-8-8.slide > div,
.carrouselslide-9-8.slide > div,
.carrouselslide-10-8.slide > div {
  left: -700%;
}
.carrouselslide-1-9.slide > div,
.carrouselslide-2-9.slide > div,
.carrouselslide-3-9.slide > div,
.carrouselslide-4-9.slide > div,
.carrouselslide-5-9.slide > div,
.carrouselslide-6-9.slide > div,
.carrouselslide-7-9.slide > div,
.carrouselslide-8-9.slide > div,
.carrouselslide-9-9.slide > div,
.carrouselslide-10-9.slide > div {
  left: -800%;
}


[dir=rtl] .slide .carrousel__content {
  display: inline-block;
  vertical-align: top;
  visibility: visible;
  width: 100%;
  position: relative;
  -webkit-transition: right .5s ease-in;
  -moz-transition: right .5s ease-in;
  -o-transition: right .5s ease-in;
  -ms-transition: right .5s ease-in;
  transition: right .5s ease-in;
  white-space: normal;
}

[dir=rtl] .carrouselslide-1-1.slide > div,
[dir=rtl] .carrouselslide-2-1.slide > div,
[dir=rtl] .carrouselslide-3-1.slide > div,
[dir=rtl] .carrouselslide-4-1.slide > div,
[dir=rtl] .carrouselslide-5-1.slide > div,
[dir=rtl] .carrouselslide-6-1.slide > div,
[dir=rtl] .carrouselslide-7-1.slide > div,
[dir=rtl] .carrouselslide-8-1.slide > div,
[dir=rtl] .carrouselslide-9-1.slide > div,
[dir=rtl] .carrouselslide-10-1.slide > div {
  left: auto;
  right: 0;
}
[dir=rtl] .carrouselslide-1-2.slide > div,
[dir=rtl] .carrouselslide-2-2.slide > div,
[dir=rtl] .carrouselslide-3-2.slide > div,
[dir=rtl] .carrouselslide-4-2.slide > div,
[dir=rtl] .carrouselslide-5-2.slide > div,
[dir=rtl] .carrouselslide-6-2.slide > div,
[dir=rtl] .carrouselslide-7-2.slide > div,
[dir=rtl] .carrouselslide-8-2.slide > div,
[dir=rtl] .carrouselslide-9-2.slide > div,
[dir=rtl] .carrouselslide-10-2.slide > div {
  left: auto;
  right: -100%;
}
[dir=rtl] .carrouselslide-1-3.slide > div,
[dir=rtl] .carrouselslide-2-3.slide > div,
[dir=rtl] .carrouselslide-3-3.slide > div,
[dir=rtl] .carrouselslide-4-3.slide > div,
[dir=rtl] .carrouselslide-5-3.slide > div,
[dir=rtl] .carrouselslide-6-3.slide > div,
[dir=rtl] .carrouselslide-7-3.slide > div,
[dir=rtl] .carrouselslide-8-3.slide > div,
[dir=rtl] .carrouselslide-9-3.slide > div,
[dir=rtl] .carrouselslide-10-3.slide > div {
  left: auto;
  right: -200%;
}
[dir=rtl] .carrouselslide-1-4.slide > div,
[dir=rtl] .carrouselslide-2-4.slide > div,
[dir=rtl] .carrouselslide-3-4.slide > div,
[dir=rtl] .carrouselslide-4-4.slide > div,
[dir=rtl] .carrouselslide-5-4.slide > div,
[dir=rtl] .carrouselslide-6-4.slide > div,
[dir=rtl] .carrouselslide-7-4.slide > div,
[dir=rtl] .carrouselslide-8-4.slide > div,
[dir=rtl] .carrouselslide-9-4.slide > div,
[dir=rtl] .carrouselslide-10-4.slide > div {
  left: auto;
  right: -300%;
}
[dir=rtl] .carrouselslide-1-5.slide > div,
[dir=rtl] .carrouselslide-2-5.slide > div,
[dir=rtl] .carrouselslide-3-5.slide > div,
[dir=rtl] .carrouselslide-4-5.slide > div,
[dir=rtl] .carrouselslide-5-5.slide > div,
[dir=rtl] .carrouselslide-6-5.slide > div,
[dir=rtl] .carrouselslide-7-5.slide > div,
[dir=rtl] .carrouselslide-8-5.slide > div,
[dir=rtl] .carrouselslide-9-5.slide > div,
[dir=rtl] .carrouselslide-10-5.slide > div {
  left: auto;
  right: -400%;
}
[dir=rtl] .carrouselslide-1-6.slide > div,
[dir=rtl] .carrouselslide-2-6.slide > div,
[dir=rtl] .carrouselslide-3-6.slide > div,
[dir=rtl] .carrouselslide-4-6.slide > div,
[dir=rtl] .carrouselslide-5-6.slide > div,
[dir=rtl] .carrouselslide-6-6.slide > div,
[dir=rtl] .carrouselslide-7-6.slide > div,
[dir=rtl] .carrouselslide-8-6.slide > div,
[dir=rtl] .carrouselslide-9-6.slide > div,
[dir=rtl] .carrouselslide-10-6.slide > div {
  left: auto;
  right: -500%;
}
[dir=rtl] .carrouselslide-1-7.slide > div,
[dir=rtl] .carrouselslide-2-7.slide > div,
[dir=rtl] .carrouselslide-3-7.slide > div,
[dir=rtl] .carrouselslide-4-7.slide > div,
[dir=rtl] .carrouselslide-5-7.slide > div,
[dir=rtl] .carrouselslide-6-7.slide > div,
[dir=rtl] .carrouselslide-7-7.slide > div,
[dir=rtl] .carrouselslide-8-7.slide > div,
[dir=rtl] .carrouselslide-9-7.slide > div,
[dir=rtl] .carrouselslide-10-7.slide > div {
  left: auto;
  right: -600%;
}
[dir=rtl] .carrouselslide-1-8.slide > div,
[dir=rtl] .carrouselslide-2-8.slide > div,
[dir=rtl] .carrouselslide-3-8.slide > div,
[dir=rtl] .carrouselslide-4-8.slide > div,
[dir=rtl] .carrouselslide-5-8.slide > div,
[dir=rtl] .carrouselslide-6-8.slide > div,
[dir=rtl] .carrouselslide-7-8.slide > div,
[dir=rtl] .carrouselslide-8-8.slide > div,
[dir=rtl] .carrouselslide-9-8.slide > div,
[dir=rtl] .carrouselslide-10-8.slide > div {
  left: auto;
  right: -700%;
}
[dir=rtl] .carrouselslide-1-9.slide > div,
[dir=rtl] .carrouselslide-2-9.slide > div,
[dir=rtl] .carrouselslide-3-9.slide > div,
[dir=rtl] .carrouselslide-4-9.slide > div,
[dir=rtl] .carrouselslide-5-9.slide > div,
[dir=rtl] .carrouselslide-6-9.slide > div,
[dir=rtl] .carrouselslide-7-9.slide > div,
[dir=rtl] .carrouselslide-8-9.slide > div,
[dir=rtl] .carrouselslide-9-9.slide > div,
[dir=rtl] .carrouselslide-10-9.slide > div {
  left: auto;
  right: -800%;
}



.slide .carrousel__content[aria-hidden=true] {
  display: inline-block;
}


.hvr-grow {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.hvr-fade {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  overflow: hidden;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: color, background-color;
  transition-property: color, background-color;
}
.hvr-fade, .hvr-fade:hover, .hvr-fade:focus, .hvr-fade:active {
  background-color: #2098D1;
  color: white;
}

/* Wobble Vertical */
@-webkit-keyframes hvr-wobble-vertical {
  16.65% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  33.3% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }
  49.95% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }
  66.6% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  83.25% {
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes hvr-wobble-vertical {
  16.65% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  33.3% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }
  49.95% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }
  66.6% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  83.25% {
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
.hvr-wobble-vertical {
  
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.hvr-wobble-vertical, .hvr-wobble-vertical:hover, .hvr-wobble-vertical:focus, .hvr-wobble-vertical:active {
  -webkit-animation-name: hvr-wobble-vertical;
  animation-name: hvr-wobble-vertical;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

.hideme
{
    opacity:0;
}


/*
 *****************************************************************
 * 06 -- structure (page / skip links / header / main content / footer)
 *****************************************************************
 */

/* === page === */
body::before {
  content: 'desktop';
  display: none;
}

.page {
  margin: 0 auto;
  position: relative;
}

.container {
	max-width: 1160px;
	position: relative;
	margin: 0 auto;
	z-index: 25;
}

.containerbig {
	max-width: 1400px;
	position: relative;
	margin: 0 auto;
	z-index: 3;
}

.subcontainer {
	max-width: 960px;
	position: relative;
	margin: 0 auto;
}

.subcontainer a {
  text-decoration: none;
}


.bg-lightgrey {  background: #f5f5f5;  }
.bg-darkblue { background: #003260; }
.color-darkblue { color: #003260; }

.bg-darkgrey { background: #2B2B2B; }
.bg-black { background: #000000; }

.bg-blue { background: #01448B; }
.color-blue { color: #01448B; }

.humanrightsdays2020 .bg-blue { background: #006FB7; }

.color-green { color: #04A079; }
a.color-green { font-weight: bold; }

.bg-lightblue { background: #5aaffe; }
.color-lightblue { color: #5aaffe; }

.bg-verylightblue { background: #e1e8f5; }
.color-verylightblue { color: #e1e8f5; }

.bg-white { background: #fff; }
.color-white,
.white-link,
.white-link:focus,
.white-link:hover,
.white-link:active { color: #fff; }

.color-black { color: #000; }

.color-orange { color: #faa838; }

.color-orangedark { color: #E14D00; }

.color-grey { color: #CCCCCC; }

/* --- skip links --- */
.skip {
	position: absolute;
}
/* .skip__link = 1 skip link  */
/* they should be visible not only on focus */
.skip__link {
	color: transparent;
	font-size: 0.8em;
}
/* anyway remember making them visible on focus */
.skip__link:focus,
.skip__link:hover,
.skip__link:active {

}

.switchlang {
	/*background: url(../images/bg-gradient.png) no-repeat top right;
	min-height: 37px;*/
  position: relative;
  z-index: 15;
  background: -webkit-linear-gradient( right, #e5eef7 0, #fff 1000px, rgba(255,255,255,0.001)  1010px);
  background: linear-gradient( to left, #e5eef7 0, #fff 1000px, rgba(255,255,255,0.001)  1010px);
}
[dir="rtl"] .switchlang {
  background: -webkit-linear-gradient( left, #e5eef7 0, #fff 1000px, rgba(255,255,255,0.001)  1010px);
  background: linear-gradient( to right, #e5eef7 0, #fff 1000px, rgba(255,255,255,0.001)  1010px);
}

.switchlang__link {
	text-decoration: none;
}

.switchlang__link:hover,
.switchlang__link:focus,
.switchlang__link:active,
.switchlang__link--active {
	color: #000;
}

/* === header === */
.headerlogo {
	margin: 0 auto;
}
.headerlogo img {
  margin-top: -30px;
}

.navigation_2019, .navigation_2020 {
	width: 100%
}

.navigation__link {
  display: inline-block;
	font-weight: bold;
	color: #fff;
	padding: 1em 1.3em;
	text-decoration: none;
	text-transform: uppercase;
}
.navigation__text {
  display: inline-block;
}
.navigation__link--active .navigation__text {
	border-top: 1px solid #faa838;
	border-bottom: 1px solid #faa838;
}

.navigation__link:hover,
.navigation__link:focus,
.navigation__link:active {
	color: #faa838;
}

.sub-navigation__link:hover, 
.sub-navigation__link:focus, 
.sub-navigation__link:active {
	color: #003260;
}

.sub-navigation2019 .sub-navigation__link:hover, 
.sub-navigation2019 .sub-navigation__link:focus, 
.sub-navigation2019 .sub-navigation__link:active {
	color: #faa838;
}

.navigation_2019 .navigation__link {
	color: #8E8E8E;
	padding: 1em .1em;
}

.navigation_2019 .navigation__link--active .navigation__text,
.navigation_2019 .navigation__link:hover  .navigation__text {
	border-top: 1px solid #04A079;
	border-bottom: 1px solid #04A079;
	color: #000;
}

.navigation_2020 .navigation__link {
	color: #006FB7;
	padding: 1em .1em;
}

.humanrightsdays2020 .navigation_2020 .navigation__link {
	color: #ffffff; 
	padding: 1.5em .1em;
}

.humanrightsdays2020 .menu2019-modal .navigation_2020 .navigation__link {
	padding: 1em .1em;
}



.navigation_2020 .navigation__link--active .navigation__text,
.navigation_2020 .navigation__link:hover  .navigation__text {
	border-top: 1px solid #006FB7;
	border-bottom: 1px solid #006FB7;
	color: #000;
}

.humanrightsdays2020 .navigation__link .navigation__text,
.humanrightsdays2020 .navigation__link:hover .navigation__text,
.humanrightsdays2020 .navigation__link--active .navigation__text {
	border: 0;
	color: rgb(255, 255, 255, 0.6);
	font-weight: bold;
}

.humanrightsdays2020 .navigation__link:hover .navigation__text,
.humanrightsdays2020 .navigation__link--active .navigation__text {
	color: #ffffff;
	font-weight: bold;
}

.sub-navigation__text {
	font-weight: bold;
}

.sub-navigation__link--active .sub-navigation__text {
	border-top: 1px solid #faa838;
	border-bottom: 1px solid #faa838;
	color: #003260;
}

.sub-navigation2019 .sub-navigation__link--active .sub-navigation__text {
	border-top: 1px solid #04A079;
	border-bottom: 1px solid #04A079;
	color: #ffffff;
}

.sub-navigation2019 .sub-navigation__link:hover .sub-navigation__text {
	color: #04A079;
}


/* === main content === */
/*.main {

}*/

.rsalc {
  position: fixed;
  right: 0;
/*   top: 11.8em; */
  top: 14em;
  z-index: 555;
  border-left: solid 2px #fff;
  border-top: solid 2px #fff;
  border-bottom: solid 2px #fff;
  border-right: 0;
}
[dir="rtl"] .rsalc {
  right: auto;
  left: 0;
  border-left: 0;
  border-right: solid 2px #fff;
}

.bg-thankyou {
	background: url(../images/banner-thank-you-pledge.jpg) no-repeat center center;
	background-size: cover;
}

.bg-takethepledge {
	background: url(../images/banner-take-the-pledge.jpg) no-repeat center center;
	background-size: cover;
}

.take-action-container {
	background: url(../images/images/banner-take_action-01@2x.jpg) no-repeat center center;
	background-size: cover;
	height: 310px;
	border-bottom: 10px solid #fff;
}
.mosaic-container--ta2  {	background-image: url(../images/images/banner-take_action-01@2x.jpg); }
.mosaic-container--ta2  {	background-image: url(../images/images/banner-take_action-02@2x.jpg); }
.mosaic-container--ta3  {	background-image: url(../images/images/banner-take_action-03@2x.jpg); }
.mosaic-container--ta4  {	background-image: url(../images/images/banner-take_action-04@2x.jpg); }
.mosaic-container--ta5  {	background-image: url(../images/images/banner-take_action-05@2x.jpg); }
.mosaic-container--ta6  {	background-image: url(../images/images/banner-take_action-06@2x.jpg); }

.mosaic-container {
	background: url(../images/images/mosaique-01@2x.jpg) no-repeat center center;
	background-size: cover;
	height: 310px;
	border-bottom: 10px solid #fff;
}
.mosaic-container--img1  {	background-image: url(../images/images/rangee-1.jpg); }
.mosaic-container--img2  {	background-image: url(../images/images/rangee-2.jpg); }
.mosaic-container--img3  {	background-image: url(../images/images/rangee-3.jpg); }
.mosaic-container--img4  {	background-image: url(../images/images/rangee-4.jpg); }
.mosaic-container--img5  {	background-image: url(../images/images/rangee-5.jpg); }
.mosaic-container--img6  {	background-image: url(../images/images/rangee-6.jpg); }
.mosaic-container--img7  {	background-image: url(../images/images/rangee-7.jpg); }
.mosaic-container--img8  {	background-image: url(../images/images/rangee-8.jpg); }
.mosaic-container--img9  {	background-image: url(../images/images/rangee-9.jpg); }
.mosaic-container--img10 {	background-image: url(../images/images/rangee-10.jpg); }

.mosaic {
	height: 310px;
}

.box--takeaction {
	background: rgba(255, 255, 255, 0.9);
	font-style: normal;
	position: absolute;
	right: 0;
	bottom: 10px;
	max-width: 740px;
	padding: .5em 1em;
}

.box--firstcol {
	width: 270px;
}
[lang="es"] .box--firstcol {
  width: 10em;
}
[lang="fr"] .box--firstcol {
  width: 20em;
}

.box--title {
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
	position: relative;
	white-space: nowrap;
}

.box--title:hover {
	color: #003260;
}

.box--title:after {
	content: '';
	display: inline-block;
	white-space: nowrap;
	position: relative;
	background: url(../images/icons/more.svg) 0 0 no-repeat;
	width: 30px;
	height: 30px;
	background-size: contain;
	margin: 0 0 0 .2em;
	top: .05em;
}
[dir=rtl] .box--title::after {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.grid-article { 
	width:22.75%; 
	position: relative;
}

.carrousel .grid-article { 
	width:22%; 
	position: relative;
}

.carrousel .grid-article3 { 
	width:30%; 
	position: relative;
}

.grid-article--sep { width: 3%; }
.grid-article--sep-2 { width: 2%; }
.grid-article--sep-3 { width: 4%; }

.grid-article--sep--nodesktop { display: none; }

.grid-article--title {
	position: absolute;
	left: 0;
	right: 0;
	bottom: -1px;
	font-weight: 400;
	font-size: 1.7rem;
	background: rgba(0, 85, 177, .9);
	padding: .5em 1em;
	margin: 0;
	text-align: center;
	min-height: 67px;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -moz-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	-moz-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	align-items: center;
}

.button-reload {
	background: #01448B url(../images/icons/reload-w.svg) no-repeat center center;
	width: 100px;
	height: 50px;
	border-radius: 50px 50px 0 0;
	position: absolute;
	bottom: -2em;
	left: calc(50% - 50px);
}



.grid-highlight { 
	width:22.75%; 
	position: relative;
}

.grid-highlight img {
	border:1px solid #ccc !important;
}

.grid-highlight--sep { width: 3%; }

.grid-highlight--sep--nodesktop { display: none; }

.grid-champion { 
	width:22.75%; 
	position: relative;
}

.grid-champion--sep { width: 3%; }

.grid-champion--sep--nodesktop { display: none; }

.grid-highlight--title {
	font-weight: bold;
	font-size: 1.8rem;
}

.grid-highlight--desc {
	color: #000;
	font-size: 1.6rem;
}

.article--title {
  text-decoration: none;
}

.separator-white {
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 30px 30px 0 30px;
	border-color: #ffffff transparent transparent transparent;
	margin: 0 auto 2em auto;
	text-align: center;
}

.video__link, .video__link2 {
	position: relative;
	display: block;
	width: 100%;
}

.covid19 .video__link2 {
	height: 560px;
}

.video__link3 {
	position: relative;
	width: 100%;
}

.video__link3:after {
	content: "";
	position: absolute;
	display: block;
	width: 60px;
	height: 60px;
	background: url(../images/icons/play.svg) no-repeat 0 0;
	background-size: contain;
	left: calc( 50% - 30px);
	top: calc( 50% - 30px);
}
.video__link2:after {
	content: "";
	position: absolute;
	display: block;
	width: 60px;
	height: 60px;
	background: url(../images/icons/play.svg) no-repeat 0 0;
	background-size: contain;
	left: calc( 50% - 30px);
	top: calc( 50% - 30px);
}

.covid19 .video__link2:after {
	background: url(../images/covid19/play.svg) no-repeat 0 0;
	background-size: contain;
	left: calc( 50% - 50px);
	top: calc( 50% - 50px);
	width: 100px;
	height: 100px;
}
.covid19 .video__link3:after {
	background: url(../images/covid19/play.svg) no-repeat 0 0;
	background-size: contain;
	top: calc( 50% - 30px + 10px);
}

/*.video__link--big:after {
	width: 70px;
	height: 70px;
}*/
.video__link__title {
	position: absolute;
	left: 0;
	right: 0;
	bottom: -1px;
	font-weight: bold;
	font-size: 1.4rem;
	background: rgba(0, 85, 177, .9);
	padding: .5em 1em;
	margin: 0;
	text-align: center;	
}
.video__link--big .video__link__title {
	height: 60px;
	font-size: 2rem;
	font-weight: bold;
}

@supports ( display: flex ) {
  .flex-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }

  .video__container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin: 0;
  }
  .video__container > .video__link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    padding: 0;
  }

}

.pledge {
	padding-top: 2em;
}

.pledge--link:hover,
.pledge--link:focus,
.pledge--link:active { 
  color: #fff; 
}

.pledge--link { white-space: nowrap; }

.pledge--link::after {
	content: "";
	white-space: nowrap;
	display: inline-block;
	background: url(../images/icons/more-w.svg) no-repeat top right;
	width: 46px;
	height: 40px;
	background-size: contain;
  position: relative;
  top: .1em;
  padding-left: .2em;
  white-space: nowrap;
}
[dir=rtl] .pledge--link::after {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.pledge--link--fr {
	white-space: normal;
	font-size: 4rem;
}


.checklist > li {
	list-style: none;
	background: url(../images/icons/check.svg) no-repeat 0 0;
	padding: .2em .3em 1em 4em;
	background-size: auto;
  min-height: 3.5em; /* avoid truncation image */
}

[dir="rtl"] .checklist > li {
  background-position: 100% 0;
  padding: .2em 4em 1em .3em;
}

.checklist--mini {
  padding-left: 0;
}
[dir="rtl"] .checklist--mini {
  padding-right: 0;
} 
.checklist--mini > li {
	list-style: none;
	background: url(../images/icons/check-30px.svg) no-repeat 0 0;
	padding: .2em .3em 1em 2.5em;
	background-size: auto;
  /*min-height: 3.5em; /* avoid truncation image */
}
[dir="rtl"] .checklist--mini > li {
  background-position: 100% 0;
	padding: .2em 2.5em 1em .3em;
}


.pledge_numbers_content {
  letter-spacing: .1em;
  font-family: 'roboto_slab';
  line-height: 1.1;
}

.number {
  font-family: 'roboto_slab';
}

.blocknumber {
	float:left;
	font-size: 5rem;
	line-height: 1em;
	padding: 0 .4em 0 0;
	font-family: 'roboto_slab';
}
[dir=rtl] .blocknumber {
  float: right;
	padding: 0 0 0 .4em;
}

.campaignlogo img {
    width: 230px;
}

.greyborder {
  border: 1px solid #ccc;
}
.option {
  border-bottom: solid 1px #ddd;
  padding: 0 0 1em 0;
}
.back::before {
  content: '';
  display: inline-block;
  background: url(../images/icons/back.svg) 0 0 no-repeat;
  width: 24px;
  height: 24px;
  position: relative;
  top: 6px;
}
[dir=rtl] .back::before {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.web::after {
  content: '';
  display: inline-block;
  background: url(../images/icons/web.svg) 0 0 no-repeat;
  width: 24px;
  height: 24px;
  position: relative;
  top: 3px;
  margin-left: .5em;
}
[dir=rtl] .web::after {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
	margin: 0 .5em 0 0;
}
.more::after {
  content: '';
  display: inline-block;
  background: url(../images/icons/more.svg) 0 0 no-repeat;
  width: 24px;
  height: 24px;
  position: relative;
  top: 6px;
  margin-left: .5em;
}
[dir=rtl] .more::after {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
	margin: 0 .5em 0 0;
}

.highlight-bloc {
	position: absolute;
	bottom: 0;
	left:0;
	right:0;
}
.highlight-bloc--noabsolute {
  position: static;
}
.highlight-bloc--noabsolute > .highlight-bloc--title {
  margin-top: 0;
  padding-top: .5em;
}

.globact-bloc {
	border-bottom:1px solid #ccc;
}

.highlight-bloc--title, .globact-bloc--title { 
	font-weight: 600; 
}

/* === page === */

.blockbanner {
	min-height: 220px;
}

.box--takeaction--page {
	display: block;
	background: rgba(255, 255, 255, 0.9);
	position: absolute;
	right: 0;
	bottom: 10px;
	padding: .5em 3em;	
	text-align: center;
	width: 100%
}

.box--title--page:after {
	display: none;
}

.bg-socialmedia {
	background-image: url(../images/icons/bg-social-media.svg);
	background-position: center right;
	background-repeat: no-repeat;
}
[dir=rtl] .bg-socialmedia {
	background-position: center left;
  background-image: url(../images/icons/bg-social-media-ar.svg);
}

.wallsio-iframe {
  border:0;height:1080px;width:100%;
}

.aspect-ratio {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 51%;
}

.aspect-ratio iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0; top: 0;
}

.socialmedia {
	text-decoration: none;
	display: block;
	padding: 0.2em 0 0.2em 0;
}

.socialmedia:before {
	content: "";
	display: inline-block;
	width: 40px;
	height: 40px;
	margin-right: .5em;
	background: url(../images/icons/champion-facebook.svg) no-repeat 0 0;
	background-size: contain;
	position: relative;
	top:15px;
}
[dir=rtl] .socialmedia:before {
  margin-right: 0;
  margin-left: .5em;
}

.socialmedia-fb:before {
	background-image: url(../images/icons/champion-facebook.svg);
}

.socialmedia-twitter:before {
	background-image: url(../images/icons/champion-twitter.svg);
}

.socialmedia-web:before {
	background-image: url(../images/icons/champion-website.svg);
}

.socialmedia-instagram:before {
	background-image: url(../images/icons/champion-instagram.svg);
}

.animated-gif {
text-align:center; 
margin-bottom:1em;
}

.maxheight-thumbnail {
max-height:160px;
width:auto;
}

/* === footer === */
/*.footer {

}*/


/* === covid === */

body.covid19 h1 {
	line-height: 1;
}

.humanrightsdays2020 h1 {
	color: #E14B00;
	font-size: 2.3em;
}

.headbanner {
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
}

.bg-headbanner {
	background-color: #f4f5ef;
}


.bannerheader-hrd2021 {
	background-image: url("../../HumanRightsDay2021/layout/images/banner-page-01.jpg");
	background-size: cover;
}

.bannerheader-covid19 {
	background: #E14D00;
}

.banner-covid {
	text-align: center;
	position: relative;
	height: 500px;
	z-index: 1000;
}

.banner-wiioh {
	text-align: center;
	position: relative;
	height: 220px;
	z-index: 200;
}

.banner-wiioh2 {
	text-align: center;
	position: relative;
	height: 316px;
	z-index: 200;
	background-image: url("../images/wiioh/Website_WIIOH_background2.jpg");
}

.bg-bluecovid {
	background: #006FB7;
	color: #fff;
}

.share-covid19 {
	background: #E14D00;
}

/* === fightracism === */

body.fightracism,
body.fightracism p {
	font-size: 20px;
}

body.fightracism h1 {
	font-size: 42px;
}



.contentbox {
	max-width: 760px;
	margin: auto auto;
}

.stickerpicture {
	position: fixed;
	top:0; 
	left: 0;
	right: 0;
	z-index: 100;
	height:100%;
	width: 100%;
	object-fit:cover;
}

.fightpaddingsection {
	padding-bottom: 80px;
	padding-top: 80px;
}

.zindex200 {
	z-index: 200;
	position: relative;
}

.bannerheader-humanrightsdays {
	background: url("../images/humanrightsdays/banner-human-right-day.jpg") no-repeat center center;
	background-size: cover;
	background-position: top left;
	height: 184px;
	position: relative;
	z-index: 200;
}

.bannerheader-istandwithher {
	background: url("../images/banner-istandwithher-v2.png") no-repeat center center;
	background-size: cover;
	background-position: 0 20%;
	height: 184px;
	position: relative;
	z-index: 200;
}

.bannerheader-istandwithher-fr{
	background: url("../images/banner-istandwithher-fr.png") no-repeat center center;
	background-size: cover;
	background-position: 0 20%;
	height: 184px;
	position: relative;
	z-index: 200;
}

.bannerheader-fightracism_2 {
	background: url("../images/banner_2-fightracism.jpg") no-repeat center center;
	background-size: cover;
	background-position: 0 20%;
	height: 184px;
	position: relative;
	z-index: 200;
}

.bannerheader-fightracism_2021 {
	background: url("../images/fightracism/2021/FIGHTracism_Visuals_2021_WEB_homepage.jpg") no-repeat center center;
	background-size: cover;
	/*background-position: 0 20%;*/
	height: 184px;
	position: relative;
	z-index: 200;
}

@media (max-width: 1440px) {
	.bannerheader-fightracism_2021 {
		background-position: -150px 0;
	}
}

.bannerheader-covid_home {
	background: url("../images/covid19/home/banner-covid-standup.jpg") no-repeat center center;
	background-size: cover;
	background-position: 0 20%;
	height: 250px;
	position: relative;
	z-index: 200;
}

.bannerheader-humanrightsdays2020_home {
	background: url("../images/humanrightsdays2020/banner-hrd-standup.jpg") no-repeat center center;
	background-size: cover;
	background-position: 0 20%;
	height: 250px;
	position: relative;
	z-index: 200;
}

.bannerheader-migration {
	background: url("../../migration/layout/images/home-banner-migration.jpg") no-repeat center center;
	background-size: cover;
	background-position: 0 20%;
	height: 250px;
	position: relative;
	z-index: 200;
}

.bannerheader-istandwithher {
	background: url("../../i-stand-with-her/layout/images/StandUp_homepagebanner-2@2x.jpg") no-repeat center center;
	background-size: cover;
	background-position: center;
	height: 250px;
	position: relative;
	z-index: 200;
}

.iswh-bg { 
	height:auto;
    background: url(../../i-stand-with-her/layout/images/StandUp_campaignbanner@2x.jpg) no-repeat;
    background-size: 100%;
    background-position: center top;
    background-attachment: fixed;
    padding-top: 40%;
} 

.bannerheader-fightracism {
	background: url(../images/fightracism/FightRacism_BG@2x.png) no-repeat center center;
	background-size: cover;
	height: 184px;
	position: relative;
	z-index: 200;
}

.bannerheader-humanrightsdays2020 {
	background: url("../images/humanrightsdays2020/bg-light-grey.jpg") no-repeat center center;
	background-size: cover;
	height: 184px;
	position: relative;
	z-index: 200;
}

.bannerheader-home {
	height: 360px;
}

.banner-fight {
	position: relative;	
}

.banner-humanrightsdays2020 {
	/*background: url("../images/humanrightsdays2020/banner-01.jpg") no-repeat center center;*/
	background: url("../images/humanrightsdays2020/banner-page-01.jpg") no-repeat center center;
	background-size: cover;
	z-index: 200;
	min-height: 480px;
}

@media (max-width: 42.5em) { /* equiv 680px */
	.banner-humanrightsdays2020 {
		min-height: 200px;
	}
}

.banner-humanrightsdays2020.banner-2 {
	/*background: url("../images/humanrightsdays2020/banner-02.jpg") no-repeat center center;*/
	background: url("../images/humanrightsdays2020/banner-01.jpg") no-repeat center center;
	background-size: cover;
}

.banner-humanrightsdays2020.banner-3 {
	background: url("../images/humanrightsdays2020/banner-03.jpg") no-repeat center center;
	background-size: cover;
}

.banner-humanrightsdays2020.banner-4 {
	background: url("../images/humanrightsdays2020/banner-04.jpg") no-repeat center center;
	background-size: cover;
}

.banner-humanrightsdays2020.banner-5 {
	background: url("../images/humanrightsdays2020/banner-05.jpg") no-repeat center center;
	background-size: cover;
}

.banner-fight-1 {
	/*background: url(../images/fightracism/GettyImages-143176182_color@2x.png) no-repeat center center;
	background-size: cover;*/
	z-index: 200;
}

.banner-fight-2 {
	background: url(../images/fightracism/FightRacism_BG@2x.png) no-repeat center center;
	background-size: cover;
	z-index: 200;
}

.banner-fight-3 {
	height: 300px;
	background-image: url(), url(../images/fightracism/GettyImages-872036786_color_2@2x.png);
    background-repeat: no-repeat, no-repeat;
    background-size: 50% 100%;
    background-position: left top, right top;
	z-index: 200;
}

.banner-fight-4 {
	background: url(../images/fightracism/FightRacism_BG@2x.png) no-repeat bottom right;
	background-size: cover;
}

.banner-fight-5 {
	/*background: url(../images/fightracism/GettyImages-522437257_color.png) no-repeat bottom right;*/
	background: url("../images/fightracism/banner-hate-speech-genocide.jpg") no-repeat bottom right;
	background-size: cover;
}

.banner-fight-6 {
	background: url(../images/fightracism/GettyImages-872036786_color_2.jpg) no-repeat 0 0;
	background-size: cover
	
}

.banner-fight-7 {
	background: url(../images/fightracism/GettyImages-1094017676_color.jpg) no-repeat 0 -250px;
	background-size: cover
	
}

.banner-fight-8 {
	background: url(../images/fightracism/GettyImages-522437257_color.jpg) no-repeat center center;
	background-size: cover
	
}

.banner-covid1 {
	height: 300px;
}
.banner-covid2 {
	height: 300px;
}

.blockquote {
	text-align: center;
	border: 0;
	color: #ccc;
	font-size: 38px;
	line-height: 40px;
	font-family:"cormorant-garamond";
	font-weight: normal;
	font-weight:600;
	font-style: italic;
}

.cormorant {
	font-family:"cormorant-garamond";
	font-weight: normal;
	font-weight:600;
	font-style: italic;
}

.legend {
	text-align: center;
	color: #ccc;
    font-family: 'roboto';
}

.black-layer {
	content: "";
	background: rgba(0,0,0,.5);
	left:0;
	right: 0;
	top: 0;
	bottom: 0;	
}

.grid-joinus {
	width: 23.5%;
}

.grid-joinus-sep {
	width:2%;
}

.grid-contact {
	width: 23.5%;
	margin: 0 0 2em 0;
}

.grid-contact-sep {
	width:2%;
}

.grid-contact-sep-nodesktop {
	display: none
}

.grid-hate {
	width: 31%;
}

.grid-hate-sep {
	width:3%;
}

.button-green {
	background: #04A079;
	color: #fff;
	padding: .5em 1.5em;
	text-decoration: none;
	font-family: 'robotomedium';
}

.button-green:hover {
	background: #faa838;
}

.button-blue {
	background: #006FB7;
	color: #fff;
	padding: .5em 1.5em;
	text-decoration: none;
	font-family: 'robotomedium';
	display: inline-block
}

.humanrightsdays2020 .button-blue { border-radius: 30px; }

.button-blue:hover {
	background: #006FB7;
	color: #fff;
}

.absolutecontainer {
	position: absolute;
	top:0;
	left: 0;
	right: 0;
}

.heightpicture {
	height: 560px;
}

.heightpicture img.picturehalf {
	height: 560px;
	object-fit:cover;
	width: 100%;
}

.heightpicturemed {
	height: 650px;
}

.heightpicturemed img.picturehalf {
	height: 650px;
	object-fit:cover;
	width: 100%;
}

.heightpicturebig {
	height: 800px;
}

.heightpicturebig img.picturehalf {
	height: 800px;
	object-fit:cover;
	width: 100%;
}

.heightpicturebigger {
	height: 1000px;
}

.heightpicturebigger img.picturehalf {
	height: 1000px;
	object-fit:cover;
	width: 100%;
}

.highlight { display:block; text-decoration: none; }
.highlight--date { color: #000; font-size: 20px; }
.highlight--title { font-family: 'robotomedium'; color: #000; font-size: 30px; line-height: 40px; margin: 0 0 .5em 0; }
.highlight-small .highlight--title { margin: 0;  font-size: 26px; }
.highlight--title.white-link { color: #fff; }
.highlight--text { color: #000; }
.highlight--text .linkmore { color: #04A079; }
.highlight--text .linkmoreblue { color: #006FB7; }

.humanrightsdays2020 .highlight--title { 
	color: #006FB7; 
	line-height: 1.4; 
}

.fr-facebook:before,
.fr-twitter:before,
.fr-youtube:before,
.fr-instagram:before { 
	content: ""; 
	width:20px; 
	height:20px; 
	display: inline-block;  
	background-size: contain; 
	margin: 0 .5em 0 0; 
}
.fr-facebook:before { 
	background: url(../images/fightracism/follow-facebook.svg) no-repeat center center; 
}
.fr-twitter:before { 
	background: url(../images/fightracism/follow-twitter.svg) no-repeat center center; 
}
.fr-youtube:before { 
	background: url(../images/fightracism/follow-youtube.svg) no-repeat center center; 
}
.fr-instagram:before { 
	background: url(../images/fightracism/follow2-instagram.svg) no-repeat center center; 
}

[dir="rtl"] .fr-facebook:before,
[dir="rtl"] .fr-twitter:before,
[dir="rtl"] .fr-youtube:before,
[dir="rtl"] .fr-instagram:before { 
	margin: 0 0 0 .5em; 
}

.bg-campaign {
	background: url(../images/fightracism/banner-handsup@2x.png) no-repeat center center;
	background-size: cover;
}

.weblink { position: relative; display: inline-block; padding-left: 50px; margin: .5em 0; }
.weblink:before {
	content: "";
	display: inline-block;
	width: 40px;
	height: 40px;
	background: url(../images/fightracism/more-big.svg) no-repeat center center;
	background-size: contain;
	position: absolute;
	top:-5px;
	left:0;
}

.pdflink { position: relative; display: inline-block; padding-left: 50px; margin: .5em 0; }
.pdflink:before {
	content: "";
	display: inline-block;
	width: 40px;
	height: 40px;
	background: url(../images/fightracism/pdf.svg) no-repeat center center;
	background-size: contain;
	position: absolute;
	top:-5px;
	left:0;
}

.donate_link,
.donate_link:focus,
.donate_link:active,
.donate_link:hover {
	text-decoration: none;
	color: #fff;
}

/*
 *****************************************************************
 * 07 -- forms
 *****************************************************************
 */

/* makes you want to click on */
label,
button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
  cursor: pointer;
}
button[disabled],
input[type="submit"][disabled],
input[type="button"][disabled],
input[type="reset"][disabled] {
  cursor: default;
}

/* avoid dummy resize */
textarea {
  resize: vertical;
}
/* remove a Firefox difference on button tag */
button::-moz-focus-inner { border: 0; padding: 0; }

label,
button,
input,
select {
  vertical-align: middle;
}

/* to adapt to your design */
input,
select,
textarea {
  padding: .5em;
  border: solid 2px #CCC; 
  color: #666;
}

/* for field texts */
.label {
  display: inline-block;
}

/* to adapt to your design */
.button {
  background: #fff;
  color: #000;
}

/*
 * avoids dimensioning for radio, checkboxes and images
 * and a different display on IE
 */
input[type="radio"],
input[type="checkbox"],
input[type="image"] {
  background-color: transparent;
  border: 0;
  width: auto;
}

/* to cancel input sizing or other if needed */
.auto {
  width: auto;
}

/* error or confirmation messages */
.alert,
.alert input,
.alert textarea,
.alert select {
  color: #bf0000;
  font-weight: bold;
}
/* .redborder is only used to debug */
.alert input,
.alert textarea,
.alert select,
.redborder {
  border: 1px solid #bf0000;
}
.alert img {
  border: 0;
}
/*.ok {

}*/

/* can be completed with HTML5 required attribute
 * example with a color, remember not only displaying information with it
 */
/*select:required:invalid,
input:required:invalid,
input:focus:invalid,
textarea:required:invalid,
textarea:focus:invalid {
  background: #fef6f6;
  -moz-box-shadow: none;
}

input:focus:required:valid,
textarea:focus:required:valid,
select:focus:required:valid {
  background: #efe;
  -moz-box-shadow: none;
}*/

.button-yellow {
	background: #faa838 no-repeat 1em center;
	text-transform: uppercase;
	color: #01448B;
	padding: .2em 1.5em;
}

.button-yellow:hover {
	background: #faa838;
}

.button-donate {
	font-weight: bold;
	margin: 0 1em 0 0;
	min-height: 37px;
}

.button-donate:before {
	content: '';
	width: 20px;
	height: 20px;
	position: relative;
	top: 4px;
	display: inline-block;
	background-image: url(../images/icons/heart.svg);
	background-size: contain;
	margin: 0 .5em 0 0;
}
[dir="rtl"] .button-donate:before {
  margin: 0 0 0 .5em;
}


.button-voice {
  font-family: 'robotomedium';
	margin: 0;
	font-size: 2.3rem;
  min-height: 3.5em;
  font-weight: normal;
  padding: .2em 1em;
}

.button-voice:before {
	content: '';
	width: 30px;
	height: 30px;
	position: relative;
	top: 8px;
	display: inline-block;
	background-image: url(../images/icons/comment.svg);
	background-size: contain;
	margin: 0 .5em 0 0;
}
[dir=rtl] .button-voice:before {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
	margin: 0 0 0 .5em;
}

.button-join {
	font-weight: bold;
	margin: 0 0 0 0;
	padding: .4em 1em .4em 0;
	font-size: 2.3rem;
	position: relative;
	display: inline-block;
	width: 17em;/*300px;*/
}

.button-join::after {
	content: "";
	width: 30px;
	height: 30px;
	position: absolute;
	top: .5em;
	right: .2em;
	display: inline-block;
	background-image: url(../images/icons/more.svg);
	background-size: contain;
	margin: 0 .5em 0 0;
}
[dir=rtl] .button-join {
  padding: .4em 0 .4em 1em;
}
[dir=rtl] .button-join::after {
  left: .2em;
  right: auto;
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg)
}

.button-more {
	margin: 0;
	padding: .4em 1em;
	font-size: 1.8rem;
	text-align: center;
	font-weight: bold;
	position: relative;
	display: inline-block;
	width: 275px;
	text-decoration: none;
}

.button-more::after {
	content: "";
	width: 22px;
	height: 22px;
	position: absolute;
	top: .5em;
	right: .2em;
	display: inline-block;
	background-image: url(../images/icons/more.svg);
	background-size: contain;
	margin: 0 .5em 0 0;
}
[dir=rtl] .button-more::after {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
	margin: 0 0 0 .5em;
  left: .2em;
  right: auto;
}

.button-more-bigger,
.button-more-bigger--simplearrow {
	margin: 0;
	padding: .4em 1em;
	font-size: 1.8rem;
	text-align: center;
	font-weight: bold;
	position: relative;
	display: inline-block;
	width: 350px;
	text-decoration: none;
  max-width: 100%;
}

.button-more-bigger::after,
.button-more-bigger--simplearrow::after {
	content: "";
	width: 22px;
	height: 22px;
	position: absolute;
	top: .5em;
	right: .2em;
	display: inline-block;
	background-image: url(../images/icons/more.svg);
	background-size: contain;
	margin: 0 .5em 0 0;
}
[dir=rtl] .button-more-bigger::after,
[dir=rtl] .button-more-bigger--simplearrow::after {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
  left: .2em;
  right: auto;
}
.button-more-bigger--simplearrow::after {
	background-image: url(../images/icons/arrow.svg);
}

.button-more-long {
	margin: 0;
	padding: .4em 2em .4em 1em;
	font-size: 1.8rem;
	text-align: center;
	font-weight: bold;
	position: relative;
	display: inline-block;
	width: 275px;
	text-decoration: none;
}

.button-more-long::after {
	content: "";
	width: 22px;
	height: 22px;
	position: absolute;
	top: .5em;
	right: .2em;
	display: inline-block;
	background-image: url(../images/icons/more.svg);
	background-size: contain;
	margin: 0 .5em 0 0;
}
[dir=rtl] .button-more-long::after {
  left: .2em;
  right: auto;
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg)
}

.button-full { width: 100%; }



/*
 *****************************************************************
 * 08 -- inside content (other styles for pages)
 *****************************************************************
 */


.iframe-story-form {
  height: 410px;
}




/*
 *****************************************************************
 * 09 -- minor breakpoints between desktop and tablets
 *****************************************************************
 */

@media (max-width: 73.75em) { /* equiv 1180px */
  .switchlang {
    background: -webkit-linear-gradient( right, #e5eef7 0, #fff 800px, rgba(255,255,255,0) 810px);
    background: linear-gradient( to left, #e5eef7 0, #fff 800px, rgba(255,255,255,0) 810px);
  }
  
  .news-carrousel__button__previous {
    margin-left: -30px;
  }
  .news-carrousel__button__next {
    margin-right: -30px;
  }
  
  body.fightracism,
body.fightracism p {
	font-size: 18px;
}
  
  
}

@media (max-width: 64.375em) { /* equiv 1030px */
 
  .autotabletbig {
	  display: block;
	  width: auto;
  }
  
  .notabletbig {
	  display: none
  }

  .ontabletbig-bg-blue-opaque {
    background: rgba(0, 50, 96, .9); /*#003260e6;*/
  }
	
	.ontabletbig-wauto { width: auto; }
	
	.ontabletbig-pl1 { padding-left: 1em; }
	.ontabletbig-pr1 { padding-right: 1em; }

}

@media (max-width: 61.875em) { /* equiv 990px */
 
  .switchlang {
    background: -webkit-linear-gradient( right, #e5eef7 0, #fff 650px, rgba(255,255,255,0) 653px);
    background: linear-gradient( to left, #e5eef7 0, #fff 650px, rgba(255,255,255,0) 653px);
  }

  .navigation__link {
  	padding: 1em .8em;
  }

}

@media (max-width: 56.875em) { /* equiv 990px */
.carrousel .grid-article, .carrousel .grid-article3 {
    width: 100%;
    margin: 0 0 2em 0;
    position: relative;
}
[dir="ltr"] .ontablet-pr0 { padding-right: 0; }
	
	
  .carrousel__content {
  	text-align: center;
	}

}

@media (max-width: 53.75em) { /* equiv 860px */
 
  .navigation__link {
  	padding: 1em .5em;
  }


}

/*@media (max-width: 1530px) { 
	.nounder1530px { display: none; }
	.under1530px { display: block;   }
}*/

/*
 *****************************************************************
 * 10 -- tablets - major breakpoint
 *****************************************************************
 */ 

@media (max-width: 50em) { /* equiv 800px */
   
  /**
   * layout/modules
   */

  /* display elements */
  .nodesktop { display: block; }

  /* hide unnecessary elements */
  .notablet { display: none; }
  
  /* linearization of floating content/table-layout */
  .autotablet {
    float: none;
    display: block;
    width: auto;
  }
  .ontablet-wauto { width: auto; }
  
  .ontablet-aspect-ratio {
	  position: relative;
	  width: 100%;
	  height: 0;
	  padding-bottom: 60%;
	}
	
	.ontablet-aspect-ratio iframe {
	  position: absolute;
	  width: 100%;
	  height: 100%;
	  left: 0; top: 0;
	}
  
  /* margins */
  .ontablet-mt0 { margin-top: 0; }
  .ontablet-mt1 { margin-top: 1em; }
  .ontablet-mt2 { margin-top: 2em; }
  [dir="ltr"] .ontablet-mr0 { margin-right: 0; }
  [dir="ltr"] .ontablet-mr0-5 { margin-right: .5em; }
  [dir="ltr"] .ontablet-mr1 { margin-right: 1em; }
  [dir="ltr"] .ontablet-mr2 { margin-right: 2em; }
  .ontablet-mb0 { margin-bottom: 0; }
  .ontablet-mb1 { margin-bottom: 1em; }
  .ontablet-mb2 { margin-bottom: 2em; }
  [dir="ltr"] .ontablet-ml0 { margin-left: 0; }
  [dir="ltr"] .ontablet-ml0-5 { margin-left: .5em; }
  [dir="ltr"] .ontablet-ml1 { margin-left: 1em; }
  [dir="ltr"] .ontablet-ml2 { margin-left: 2em; }
  .ontablet-m0 { margin: 0; }
  .ontablet-m1 { margin: 1em; }
  .ontablet-m2 { margin: 2em; }

  /* RTL = warning, use with caution */
  [dir="rtl"] .ontablet-mr0 { margin-left: 0; }
  [dir="rtl"] .ontablet-mr1 { margin-left: 1em; }
  [dir="rtl"] .ontablet-mr2 { margin-left: 2em; }
  [dir="rtl"] .ontablet-ml0 { margin-right: 0; }
  [dir="rtl"] .ontablet-ml1 { margin-right: 1em; }
  [dir="rtl"] .ontablet-ml2 { margin-right: 2em; }

  /* paddings */
  .ontablet-pt0 { padding-top: 0; }
  .ontablet-pt0-5 { padding-top: .5em; }
  .ontablet-pt1 { padding-top: 1em; }
  .ontablet-pt2 { padding-top: 2em; }
  [dir="ltr"] .ontablet-pr0 { padding-right: 0; }
  [dir="ltr"] .ontablet-pr1 { padding-right: 1em; }
  [dir="ltr"] .ontablet-pr2 { padding-right: 2em; }
  .ontablet-pb0 { padding-bottom: 0; }
  .ontablet-pb1 { padding-bottom: 1em; }
  .ontablet-pb2 { padding-bottom: 2em; }
  [dir="ltr"] .ontablet-pl0 { padding-left: 0; }
  [dir="ltr"] .ontablet-pl1 { padding-left: 1em; }
  [dir="ltr"] .ontablet-pl2 { padding-left: 2em; }
  .ontablet-p0 { padding: 0; }
  .ontablet-p1 { padding: 1em; }
  .ontablet-p2 { padding: 2em; }
	
  .ontablet-pl1 { padding-left: 1em; }
  .ontablet-pr1 { padding-right: 1em; }

  /* RTL = warning, use with caution */
  [dir="rtl"] .ontablet-pr0 { padding-left: 0; }
  [dir="rtl"] .ontablet-pr1 { padding-left: 1em; }
  [dir="rtl"] .ontablet-pr2 { padding-left: 2em; }
  [dir="rtl"] .ontablet-pl0 { padding-right: 0; }
  [dir="rtl"] .ontablet-pl1 { padding-right: 1em; }
  [dir="rtl"] .ontablet-pl2 { padding-right: 2em; }

  /* text aligns */
  .ontablet-alignleft   { text-align: left; }
  .ontablet-aligncenter { text-align: center; }
  .ontablet-alignright  { text-align: right; }

  /**
   * global structure adaptation (page / skip links / header / main content / footer)
   */
  body::before {
    content: 'tablet';
  }
  
  /**
   * inside content (other styles for pages)
   */
   
  .switchlang {
	  font-size: 1.4rem;
	  position: relative;
    background: #e5eef7;
  }
   
  .humanrightsdays2020 .switchlang {
    background: #fff;
  }
	
	
  .headerlogo,
  .headerlogo img {
    margin-top: 0;
  }
   
  .displaymenu {
	   display: inline-block;
	   position: absolute;
	   top:0;
	   right: 0;
	   height: 37px;
	   width: 37px;
	   background-image: url(../images/icons/burgericon-w.svg);
	   background-position: 0 0;
	   background-size: contain;
	   outline: 0;
	   z-index: 200
  }
  
  .displaymenu2019 {
	   background-image: url(../images/fightracism/burgericon2.svg);
	   background-size: auto;
	   background-repeat: no-repeat;
	   background-position: right 5px;
	   height: 20px;
	   width: 55px;
	   top:.5em;
	   right:.5em;
	   color: #000;
	   text-decoration: none;
  }
  
  .humanrightsdays2020 .displaymenu2019 {
	   background-image: url("../images/humanrightsdays2020/burgericon2.svg");
	   background-size: 13px;
  }
  
  .covid19 .displaymenu2019 {
	  font-weight: bold;
	  color: #006FB7;
	   width: 65px;
	   background-image: url(../images/covid19/burgericon3.svg);
  }
  
  [dir=rtl] .displaymenu {
    right: auto;
    left: 0;
  }
   
  .menu-modal-overlay {
	   background: #003260;
	   position: fixed;
	   left: 0;
	   right: 0;
	   bottom: 0;
	   top:0;
	   display: block; 
	   z-index: 100;
  }
  
  
   
  .menu-modal-close {
	   position: fixed;
	   top:0;
	   right:0;
	   z-index: 300;
	   height: 37px;
	   width: 37px;
	   background: #000;
	   background-image: url(../images/icons/burgericon2.svg);
	   background-position: 0 0;
	   background-size: contain;
	   outline: 0;
  }
  [dir=rtl] .menu-modal-close {
    right: auto;
    left: 0;
  }
   
   .menu-modal-close__text { display: none; }
   
   .menu-modal-title { display: none; }
   
   .menu-modal {
	   position: fixed;
	   z-index: 200;
	   left: 0;
	   right: 0;
	   bottom: 0;
	   top:0;
	   display: block;  
	   background: #003260;
	   overflow: auto;
   }
   
   .menu-modal__content {
	   max-width: 350px;
	   margin: 0 auto;
	   position: relative;
	   padding: 4em 2em 1em 2em;
	   text-align: left;
   }
   
   .menu2019-modal-overlay {
	   background: rgba(0,0,0,.9);
	   position: fixed;
	   left: 0;
	   right: 0;
	   bottom: 0;
	   top:0;
	   display: block; 
	   z-index: 100;
  }
   
  .menu2019-modal-close {
	   position: fixed;
	   top:0.5em;
	   right:0.5em;
	   z-index: 300;
	   height: 20px;
	   width: 55px;
	   background-image: url(../images/fightracism/burgericon2-close.svg);
	   background-position: right 5px;
	   background-size: auto;
	   background-repeat: no-repeat;
	   outline: 0;
  }
   
  .humanrightsdays2020 .menu2019-modal-close {
	  background-image: url("../images/humanrightsdays2020/burgericon2-close.svg");
	  background-size: 15px;
  }
  [dir=rtl] .menu2019-modal-close {
    right: auto;
    left: 0;
  }
   
   .menu2019-modal-close__text { display: none; }
   
   .menu2019-modal-title { display: none; }
   
   .menu2019-modal {
	   position: fixed;
	   z-index: 200;
	   left: 0;
	   right: 0;
	   bottom: 0;
	   top:0;
	   display: block;  
	   background: rgba(0,0,0,.9);
	   overflow: auto;
	   color: #fff;
   }
   
   .covid19 .menu2019-modal {
	   background: #fff;
	  }
   
   .humanrightsdays2020 .menu2019-modal {
	   background: rgba(255,255,255,.96);
	}
   
   .menu2019-modal__content {
	   max-width: 350px;
	   margin: 0 auto;
	   position: relative;
	   padding: 4em 2em 1em 2em;
	   text-align: left;
   }
   
   .menu2019-modal__content .button-donate {
	   font-size: 1em;
   }
   
  .navigation {
	   border-top:1px solid #01448B;
	   padding: 1em 0;
	   border-bottom:1px solid #01448B;
	}
   
  .navigation__item {
		padding: .3em 0em;
	}
	
	.navigation__link {
		font-weight: bold;
		color: #fff;
		padding: .2em 0;
		border-top: 1px solid #003260;
		border-bottom: 1px solid #003260;
		text-decoration: none;
		text-transform: uppercase;
	}
	
	.navigation_2019 .navigation__link {
		border:0 ;
		color: #ccc;	
		padding: .5em 0;
	}
	
	.navigation_2019 .navigation__link .navigation__text {
		border-top: 1px solid #000;
		border-bottom: 1px solid #000;
		color: #ccc;	
	}
	
	.navigation_2020 .navigation__link {
		border:0 ;
		color: #006FB7;	
		padding: .5em 0;
	}
	
	.navigation_2020 .navigation__link .navigation__text {
		border-top: 1px solid #006FB7;
		border-bottom: 1px solid #006FB7;
		color: #006FB7;	
	}
	
	.navigation__link--sub {
		font-weight: normal;
		color: #fff;
		padding: 0;
		text-transform: none;
	}
	
	.navigation__link:hover,
	.navigation__link:focus,
	.navigation__link:active,
	.navigation__link--active  {
		color: #faa838;
	}
	
	.navigation_2019 .navigation__link:hover .navigation__text ,
	.navigation_2019 .navigation__link:focus .navigation__text ,
	.navigation_2019 .navigation__link:active .navigation__text ,
	.navigation_2019 .navigation__link--active .navigation__text {
		border-top: 1px solid #04A079;
		border-bottom: 1px solid #04A079;
		color: #fff;	
	}
	
	.navigation_2020 .navigation__link:hover .navigation__text ,
	.navigation_2020 .navigation__link:focus .navigation__text ,
	.navigation_2020 .navigation__link:active .navigation__text ,
	.navigation_2020 .navigation__link--active .navigation__text {
		border-top: 1px solid #006FB7;
		border-bottom: 1px solid #006FB7;
		color: #032B45;		
	}
	
	.navigation_2019 .sub-navigation__item .navigation__link {
		font-size: 16px;
		margin-left: 2em;
	}

	.mosaic-container,.take-action-container {
		background: none;
		height: auto;
		border: 0
	}
	
	.mosaic {
		height: auto;
	}
	
	.box--takeaction, .box--takeaction--page {
		position: relative;
		width: auto;
		padding: 2em 3em;
			bottom: 0; }

	.carrousel .grid-article,
	.grid-article { 
		width: 45%; 
	}
	
	.grid-article--sep { width: 4%;}
	
	.grid-article--sep--nodesktop { display: inline-block; }
	
	.grid-article--sep--notablet { display: none; }
	
	.grid-highlight { 
		width:48%; 
	}
	
	.grid-highlight--sep { width: 4%; }
	
	.grid-highlight--sep--nodesktop { display: inline-block; }
	
	.grid-highlight--sep--notablet { display: none; }
	
	.grid-champion { 
		width:48%; 
	}
	
	.grid-champion--sep { width: 4%; }
	
	.grid-champion--sep--nodesktop { display: inline-block; }
	
	.grid-champion--sep--notablet { display: none; }

  .video__container {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
   }
   .video__link.notablet {
     display: none;
   }

  .news-carrousel__button__previous,
  .news-carrousel__button__next,
  .carrousel__content {
    /*display: none !important;*/
  }
  .carrousel__container .carrousel__content:first-child {
   /* display: block!important;*/
  }

  .absolutecontainer { position: relative; }

	.grid-joinus {
	width: 100%;
}

.grid-joinus-sep {
	display: none
}

.grid-contact {
	width: 100%;
	margin: 0 0 2em 0;
}

.grid-contact-sep {
	display: none
}

.grid-hate {
	width: 100%;
}

.grid-hate-sep {
	display: none
}

.fightpaddingsection { padding: 50px 1em ; }

.blockquote {
	font-size: 26px;
	line-height: 28px;
}

.heightpicture,.heightpicturemed,.heightpicturebig, .heightpicturebigger {
		height: auto;
	}
	
	.heightpicture img.picturehalf, .heightpicturemed img.picturehalf,.heightpicturebig img.picturehalf , .heightpicturebigger img.picturehalf {
		height: auto;
		object-fit:auto;
		width: 100%;
	}

.video__link, .video__link2 {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
}

	.pl2.pl2-notablet { padding-left: 0; }
	
	.covid19 .video__link2 {
		height: auto;
	}
	
  
  .pledge-animated-modal {
	  margin: 0 10%;
	  width: 80%;
	}
	
	
  
  .covid19 h1.pledge-animated-modal-title {
  font-size: 1em;
  padding: 1em 1em 1em 1em;
  
}
	
}




/*
 *****************************************************************
 * 11 -- minor breakpoints between tablets and mobile
 *****************************************************************
 */


@media (max-width: 48em) { /* equiv 768px */

  [dir="rtl"] .ontablet-pr0 { padding-right: 0; }
	
	
.bannerheader-home img {
    min-width: 320px;
}
	
.iswh-bg { 
background-attachment: unset;
} 

}




/*
 *****************************************************************
 * 12 -- mobile - major breakpoint
 *****************************************************************
 */

@media (max-width: 42.5em) { /* equiv 680px */

  /**
   * layout/modules
   */

  /* display elements */
  .notablet { display: block; }

  /* hide unnecessary elements */
  .nomobile { display: none; }

  /* linearization of floating content/table-layout */
  .automobile {
    float: none;
    display: block;
    width: auto;
  }
  .onmobile-wauto { width: auto; }
  
  /* margins */
  .onmobile-mt0 { margin-top: 0; }
  .onmobile-mt0-5 { margin-top: .5em; }
  .onmobile-mt1 { margin-top: 1em; }
  .onmobile-mt2 { margin-top: 2em; }
  [dir="ltr"] .onmobile-mr0 { margin-right: 0; }
  [dir="ltr"] .onmobile-mr0-5 { margin-right: .5em; }
  [dir="ltr"] .onmobile-mr1 { margin-right: 1em; }
  [dir="ltr"] .onmobile-mr2 { margin-right: 2em; }
  .onmobile-mb0 { margin-bottom: 0; }
  .onmobile-mb1 { margin-bottom: 1em; }
  .onmobile-mb2 { margin-bottom: 2em; }
  [dir="ltr"] .onmobile-ml0 { margin-left: 0; }
  [dir="ltr"] .onmobile-ml0-5 { margin-left: .5em; }
  [dir="ltr"] .onmobile-ml1 { margin-left: 1em; }
  [dir="ltr"] .onmobile-ml2 { margin-left: 2em; }
  .onmobile-m0 { margin: 0; }
  .onmobile-m1 { margin: 1em; }
  .onmobile-m2 { margin: 2em; }

  /* RTL = warning, use with caution */
  [dir="rtl"] .onmobile-mr0 { margin-left: 0; }
  [dir="rtl"] .onmobile-mr1 { margin-left: 1em; }
  [dir="rtl"] .onmobile-mr2 { margin-left: 2em; }
  [dir="rtl"] .onmobile-ml0 { margin-right: 0; }
  [dir="rtl"] .onmobile-ml1 { margin-right: 1em; }
  [dir="rtl"] .onmobile-ml2 { margin-right: 2em; }

  /* paddings */
  .onmobile-pt0 { padding-top: 0; }
  .onmobile-pt1 { padding-top: 1em; }
  .onmobile-pt0-5 { padding-top: .5em; }
  .onmobile-pt2 { padding-top: 2em; }
  [dir="ltr"] .onmobile-pr0 { padding-right: 0; }
  [dir="ltr"] .onmobile-pr1 { padding-right: 1em; }
  [dir="ltr"] .onmobile-pr2 { padding-right: 2em; }
  .onmobile-pb0 { padding-bottom: 0; }
  .onmobile-pb1 { padding-bottom: 1em; }
  .onmobile-pb2 { padding-bottom: 2em; }
  [dir="ltr"] .onmobile-pl0 { padding-left: 0; }
  [dir="ltr"] .onmobile-pl1 { padding-left: 1em; }
  [dir="ltr"] .onmobile-pl2 { padding-left: 2em; }
  .onmobile-p0 { padding: 0 !important; }
  .onmobile-p1 { padding: 1em; }
  .onmobile-p2 { padding: 2em; }

  /* RTL = warning, use with caution */
  [dir="rtl"] .onmobile-pr0 { padding-right: 0; }
  [dir="rtl"] .onmobile-pr1 { padding-right: 1em; }
  [dir="rtl"] .onmobile-pr2 { padding-right: 2em; }
  [dir="rtl"] .onmobile-pl0 { padding-left: 0; }
  [dir="rtl"] .onmobile-pl1 { padding-left: 1em; }
  [dir="rtl"] .onmobile-pl2 { padding-left: 2em; }

  /* text aligns */
  .onmobile-alignleft   { text-align: left; }
  .onmobile-aligncenter { text-align: center; }
  .onmobile-alignright  { text-align: right; }
  
  [dir=rtl] .onmobile-alignleft {
    text-align: right;
  }
  [dir=rtl] .onmobile-alignright {
    text-align: left;
  }

  
  [dir="rtl"] .onmobile-pr0 { padding-left: 0; }
  
  .fs24p, .fs26p, .fs35p, .fs40p, .fs43p, .fs50p, .fs51p, .fs56p, .fs70p { font-size: 2.4rem; }
  
  .fs12p, .fs19p, .fs20p, .fs22p { font-size: 1em; }
  
  blockquote { font-size: 1.6rem; }
  
  .box--title::after {
  	width: 16px;
	  height: 16px;
  }

  .pledge--link::after {
  	width: 16px;
  	height: 16px;
  }
  
  /**
   * global structure adaptation (page / skip links / header / main content / footer)
   */
  body::before {
    content: 'mobile';
  }
  
  /**
   * inside content (other styles for pages)
   */
   
  .menu-modal__content .switchlang { 
	  font-size: 0.8em; 
	  border-top:1px solid #01448B;
	  background: none;
	  padding: .6em 0;
	}
  
  .switchlang {
    z-index: 30;
  }
	
	.switchlang__link {
		color: #fff;
	}
	
	.humanrightsdays2020 .switchlang__link {
		color: #006FB7;
	}
	
	.switchlang__link--active, .switchlang__link:hover {
		color: #faa838;
	}
	
	.humanrightsdays2020 .switchlang__link--active, .humanrightsdays2020 .switchlang__link:hover {
		color: #032B45;
	}

	.carrousel .grid-article,
	.grid-article { 
		width: 100%; 
	}
	
	.grid-article--sep { display: none; }
	
	.grid-highlight { 
		width:100%; 
	}
	
	.grid-highlight--sep { display: none; }
	
	.grid-champion { 
		width:100%; 
	}
	
	.grid-champion--sep { display: none; }

  .video__container {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
   }
   .video__link.nomobile {
     display: none;
   }
   
   
   .switchlang {
	   display: block;
   }
   .swithclang--modal {
     display: none;
   }
   
   .button-yellow {
	   font-size: 1.5em;
	   min-width: 100%;
     width: auto;
     padding-right: 2em;
   }
   [dir=rtl] .button-yellow {
     padding-right: 0;
     padding-left: 2em;
   }
   .button-more-bigger::after {
     top: .7em;
   }
   

  .button-more::after {
  	top: .65em;
  }
  .button-more-long::after {
  	top: 2em;
  }

   
   .pledge_numbers_content { font-size: 2.5em; }
   
   .highlight-bloc { position: relative; }
   .highlight-bloc--title { margin: 0; padding: .5em 0 0 0; }
   
   .footer .col {
	   padding: 15px 0;
   }
   
   .footer {
	   padding: 15px 0;
   }
   
   .footer .mt1 {
	   margin: 0;
   }
   
   .w150p { width: 90px; }
   
   .onmobile-bg-blue { background: #003260; }
   
   .iframe-story-form {
    height: 730px;
   }
   .button-more-bigger--simplearrow::after {
     top: .75em;
   }
   
   .heightpicture,.heightpicturemed,.heightpicturebig, .heightpicturebigger {
		height: auto;
	}
	
	.heightpicture img.picturehalf, .heightpicturemed img.picturehalf,.heightpicturebig img.picturehalf , .heightpicturebigger img.picturehalf {
		height: auto;
		object-fit:auto;
		width: 100%;
	}
	
	.fightracism .logo, .fightracism .logo2 { width: 120px; }
	.fightracism .logo { padding-right: 1em; }
	.covid19 .logo, .covid19 .logo2 { width: 120px; }
	.covid19 .logo { padding-right: 1em; }
	
	.covid19 h1 { font-size: 2.4em; }
	
	.pl2.pl2-nomobile { padding-left: 0; }

}

@media (max-width: 20em) { /* equiv 375px */

.bannerheader-home img {
    min-width: 250px;
}
}

/*
 *****************************************************************
 * 13 -- minor breakpoints for very small mobiles
 *****************************************************************
 */

@media (max-width: 20em) { /* equiv 320px */

  /**
   * layout/modules
   */

  /* display elements */
  /*.nomobile { display: block; }*/

  /* hide unnecessary elements */
  .notinymobile { display: none; }

  /* linearization of floating content/table-layout */
  .autotinymobile {
    float: none;
    display: block;
    width: auto;
  }

  /**
   * global structure adaptation (page / skip links / header / main content / footer)
   */
  body::before {
    content: 'tinymobile';
  }
  .headerlogo {
	  margin: 0 1em ;
  }
  
  /**
   * inside content (other styles for pages)
   */
  .container {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

}






/*
 *****************************************************************
 * 14 -- print
 *****************************************************************
 */

@media print {
  /**
   * add in this all elements which need to be hardly reseted for print
   */
  body,
  html,
  .page,
  .reset4print,
  .bg-blue,
  .bg-blue .color-white {
    background-color: #fff;
    background-image: none;
    border: 0;
    box-shadow: none;
    color: #000;
    float: none;
    height: auto;
    margin: 0;
    max-width: 100%;
    min-height: 0;
    padding: 0;
    position: static;
    width: auto;
    opacity: 1;
    visibility: visible;
    max-height: none;
    display: block;
  }

  body {
    padding: .5em;
  }

  /* hide unnecessary elements */
  .noprint,
  .switchlang,
  .footer,
  .navigation,
  .pledge,
  .rsalc {
    display: none;
  }
  
  /* display specific elements for print */
  .onprint {
    display: block;
  }
  
  /* avoid problematic page break */
  blockquote, ul, ol {
    page-break-inside: avoid;
  }
  h1, h2, h3, caption {
    page-break-after: avoid;
  }
  
  /* display links, except for those containing images */
  /* warning, remember checking the result & think to limitate
   * this option only for inside content links */
  /*a:after {
    content: " (" attr(href) ") ";
  }
  a:after img {
    content: "";
  }*/

  /* fix particular properties */


} /* end print */




/*
 *****************************************************************
 * 15 -- fix viewport
 *****************************************************************
 */

/* fix viewport for Win8 (snap mode) and preparing day
 * when viewport will be supported by all render engines
 *
 * Examples: http://dev.opera.com/articles/view/an-introduction-to-meta-viewport-and-viewport/
 * width=device-width => width: device-width;
 * height=device-height => height: device-height;
 * initial-scale=2 => zoom: 2;
 * maximum-scale=2 => max-zoom: 2;
 * minimum-scale=0.5 => min-zoom: 0.5;
 * user-scalable=no => user-zoom: fixed;
 *
 * for Win8 snap mode => only width: device-width; works for the moment
 */

@-webkit-viewport {
  width: device-width;
}
@-moz-viewport {
  width: device-width;
}
@-ms-viewport {
  width: device-width;
}
@-o-viewport {
  width: device-width;
}
@viewport {
  width: device-width;
}




/*
 *****************************************************************
 * 16 -- state classes
 *****************************************************************
 */

/*
 * State classes = put here to take priority on all classes
 *
 */

/*
.is-hidden,
[aria-hidden=true] {
  display: none;
}
*/




/*
 *****************************************************************
 * 17 -- Bonus: Fixes IE
 *****************************************************************
 */

/*
 * based on conditional classes on HTML element
 *
 * to be used only if there are not to many fixes &
 * small impact on webperfs for other browsers
 *
 */

/* less than IE 9 */
.oldies .nooldies {
  display: none;
}

.ie6 .noie6 {
  display: none;
}
.ie7 .noie7 {
  display: none;
}
.ie8 .noie8 {
  display: none;
}
.ie9 .noie9 {
  display: none;
}

.ie7 .col,
.ie7 .col-noalign,
.ie6 .col,
.ie6 .col-noalign {
  float: left;
}
.ie7 .row,
.ie6 .row {
  overflow: auto;
}

/* RTL */
[dir="rtl"] .ie7 .col,
[dir="rtl"] .ie7 .col-noalign,
[dir="rtl"] .ie6 .col,
[dir="rtl"] .ie6 .col-noalign {
  float: right;
}

.menu2019-modal { 
	margin: 0;
	width: 100vw;
	height: 100vh;
}

.font24px { font-size: 24px; }

.logo-human-rights-day { width: 600px; }
.logo-istandwithher { max-width: 400px;}

@media (max-width: 64.375em) {
	.logo-human-rights-day, .logo-istandwithher { width: 70%; }
	
}

@media (max-width: 50em) {
	.logo-human-rights-day { width: 70%; }
}

@media (max-width: 40em) {
	.logo-human-rights-day { width: 100%; }
	.logo-istandwithher { width: 80%; }
}

@font-face {font-family: 'Code-Pro-Bold-LC';src: url('fonts/37DFEA_3_0.eot');src: url('fonts/37DFEA_3_0.eot?#iefix') format('embedded-opentype'),url('fonts/37DFEA_3_0.woff2') format('woff2'),url('fonts/37DFEA_3_0.woff') format('woff'),url('fonts/37DFEA_3_0.ttf') format('truetype');}

.Code-Pro-Bold-LC { font-family: Code-Pro-Bold-LC; }

.humanrightsdays2020 .section-row {
	padding: 80px 0;
}

.humanrightsdays2020.take-action .section-row {
	padding: 80px 0 0 0;
}
	
.humanrightsdays2020 .background-grey {
	background-color: #EDEDED;
}


.humanrightsdays2020 .js-accordion { 
	background-color: white; 
	padding: 1em;
	padding-left: 30px;
}

.humanrightsdays2020 .recover_better_means .js-accordion__panel ul li { padding-bottom: 1em; }

.humanrightsdays2020 .recover_better_means .js-accordion__panel ul li::marker { color: #E14B00; }

.humanrightsdays2020 .color-orange { color: #E14B00; }

@media (max-width: 42.5em) { /* equiv 680px */
	.humanrightsdays2020 h1 { 
		font-size: 1.8em; 
	}
	.humanrightsdays2020 h2 { 
		font-size: 1.3em; 
	}
	.humanrightsdays2020 .bigger { 
		font-size: 1em; 
	}
}

header {
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
}

.humanrightsdays2020 .pledge-animated-modal-title {
    color: #fff;
	font-size: 1em;
}

.border-grey { border: #ccc 1px solid; }