@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700;1,900&display=swap");
/*:root {
    --main-font-family: 'Source Sans Pro', sans-serif;
    --white: #ffffff;
    --black: #000000;
    --eu-blue-50: #D0D9EA;
    --eu-blue-100: #D0D9EA;
    --eu-blue-200: #8AA0C9;
    --eu-blue-300: #6480B8;
    --eu-blue-400: #3D61A6;
    --eu-blue-500: #164194;
    --eu-blue-600: #12367B;
    --eu-blue-700: #0F2B63;
    --grey-gold-50: #F7F5F0;
    --grey-gold-100: #E3E1DD;
    --grey-gold-200: #CFCDC9;
    --grey-gold-300: #BAB8B5;
    --grey-gold-400: #A6A4A1;
    --grey-gold-500: #91908D;
    --grey-gold-600: #7D7C7A;
    --grey-gold-800: #545351;
    --grey-gold-900: #403F3D;
    --grey-gold-950: #2B2B29;
    --gold: #E0C96C;
    --orange-50: #FFDEB0;
    --orange-100: #FFF4E6;
    --orange-200: #FFCE8A;
    --orange-300: #FFB854;
    --orange-400: #FFAA33;
    --orange-500: #FF9500;
    --orange-600: #E88800;
    --orange-700: #B56A00;
    --orange-800: #8C5200;
    --orange-900: #6B3F00;
    --orange-950: #523000;
    --h1-font-size: 61px;
    --h2-font-size: 49px;
    --h3-font-size: 39px;
    --h4-font-size: 31px;
    --h5-font-size: 25px;
    --h6-font-size: 20px;
    --d1-font-size: 20px;
    --d2-font-size: 25px;
    --d3-font-size: 20px;
    --d4-font-size: 16px;
    --body-font-size: 16px;
    --small-font-size: 13px;
    --h1-font-size-sm: 33px;
    --h2-font-size-sm: 29px;
    --h3-font-size-sm: 25px;
    --h4-font-size-sm: 23px;
    --h5-font-size-sm: 20px;
    --h6-font-size-sm: 18px;
    --d1-font-size-sm: 29px;
    --d2-font-size-sm: 20px;
    --d3-font-size-sm: 18px;
    --d4-font-size-sm: 16px;
    --body-font-size-sm: 16px;
    --small-font-size-sm: 13px;
    --font-weight-xlight: 200;
    --font-weight-light: 300;
    --font-weight-reg: 400;
    --font-weight-semi: 600;
    --font-weight-bold: 700;
    --font-weight-black: 900;
    --col-max-width: 1390px; 
    --level-highlight-color: #2F80ED;
}*/
@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,700,700i");
body {
  font-family: "Source Sans Pro", sans-serif;
  font-weight: 400;
  color: #403F3D;
  line-height: 1.5rem;
  margin: 0;
}

h1,
h2 {
  text-transform: uppercase;
}

h1,
h2,
h4,
h5 {
  font-weight: 300;
}

h3,
h6 {
  font-weight: 600;
}

h1 {
  font-size: 2.0625rem;
  line-height: 2.125rem;
}

@media screen and (min-width: 48.75rem) {
  h1 {
    font-size: 3.8125rem;
    line-height: 4rem;
  }
}

h2 {
  font-size: 1.8125rem;
  line-height: 2rem;
}

@media screen and (min-width: 48.75rem) {
  h2 {
    font-size: 3.0625rem;
    line-height: 3.375rem;
  }
}

h3 {
  font-size: 1.5625rem;
  line-height: 1.6875rem;
}

@media screen and (min-width: 48.75rem) {
  h3 {
    font-size: 2.4375rem;
    line-height: 2.75rem;
  }
}

h4 {
  font-size: 1.4375rem;
  line-height: 1.75rem;
}

@media screen and (min-width: 48.75rem) {
  h4 {
    font-size: 1.9375rem;
    line-height: 2.25rem;
  }
}

h5 {
  font-size: 1.25rem;
  line-height: 1.4375rem;
}

@media screen and (min-width: 780px) {
  h5 {
    font-size: 1.5625rem;
    line-height: 2rem;
  }
}

h6 {
  font-size: 1.125rem;
  line-height: 1.25rem;
}

@media screen and (min-width: 48.75rem) {
  h6 {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}

h1,
h2,
h3,
h4 {
  margin-bottom: 3.5rem;
}

h5,
h6 {
  margin-bottom: 2rem;
}

.heading-orange {
  color: #8C5200;
}

.heading-blue,
.title-blue {
  color: #3D61A6;
}

strong {
  font-weight: 700;
}

p {
  margin-bottom: 1rem;
  word-break: break-word;
}

a {
  color: #3D61A6;
}

a:hover {
  color: #12367B;
}

a.button {
  color: #ffffff;
  background-color: #3D61A6;
  border: 0.0625rem solid #6480B8;
  padding: 0.75rem 1.25rem;
  text-decoration: none;
  display: inline-block;
}

a.button:hover {
  background-color: #12367B;
}

sup {
  color: #3D61A6;
}

.column-width {
  max-width: 86.875rem;
}

@media screen and (min-width: 48.75rem) {
  .column-width {
    margin: auto;
    width: 90%;
  }
}

.show-for-sr {
  position: absolute;
  width: 0.0625rem;
  height: 0.0625rem;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  border: 0;
}

hr {
  border: 0;
  border-bottom: 0.0625rem solid #CFCDC9;
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.skip-link {
  position: absolute;
}

.skip-link ul li {
  list-style: none;
}

.skip-link ul li a {
  position: fixed;
  top: 0px;
  right: 100%;
  padding: 0.625rem;
  font-size: 0.8125rem;
  line-height: normal;
  font-weight: bold;
  color: #ffffff;
  background-color: #164194;
  white-space: nowrap;
  z-index: 0;
}

.skip-link ul li a:focus {
  left: 0;
  right: auto;
  z-index: 1000;
}

/**
 * @license
 * MyFonts Webfont Build ID 3656518, 2018-10-17T08:22:44-0400
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: Gilroy-Regular by Radomir Tinkov
 * URL: https://www.myfonts.com/fonts/radomir-tinkov/gilroy/regular/
 * Copyright: Copyright © 2016 by Radomir Tinkov. All rights reserved.
 * 
 * Webfont: Gilroy-RegularItalic by Radomir Tinkov
 * URL: https://www.myfonts.com/fonts/radomir-tinkov/gilroy/regular-italic/
 * Copyright: Copyright © 2015 by Radomir Tinkov. All rights reserved.
 * 
 * Webfont: Gilroy-Medium by Radomir Tinkov
 * URL: https://www.myfonts.com/fonts/radomir-tinkov/gilroy/medium/
 * Copyright: Copyright © 2016 by Radomir Tinkov. All rights reserved.
 * 
 * Webfont: Gilroy-Light by Radomir Tinkov
 * URL: https://www.myfonts.com/fonts/radomir-tinkov/gilroy/light/
 * Copyright: Copyright © 2016 by Radomir Tinkov. All rights reserved.
 * 
 * Webfont: Gilroy-ExtraBold by Radomir Tinkov
 * URL: https://www.myfonts.com/fonts/radomir-tinkov/gilroy/extra-bold/
 * Copyright: Copyright © 2016 by Radomir Tinkov. All rights reserved.
 * 
 * Webfont: Gilroy-Bold by Radomir Tinkov
 * URL: https://www.myfonts.com/fonts/radomir-tinkov/gilroy/bold/
 * Copyright: Copyright © 2016 by Radomir Tinkov. All rights reserved.
 * 
 * Webfont: Gilroy-Black by Radomir Tinkov
 * URL: https://www.myfonts.com/fonts/radomir-tinkov/gilroy/black/
 * Copyright: Copyright © 2016 by Radomir Tinkov. All rights reserved.
 * 
 * 
 * License: https://www.myfonts.com/viewlicense?type=web&buildid=3656518
 * Licensed pageviews: 500,000
 * 
 * © 2018 MyFonts Inc
*/
/* @import must be at top of file, otherwise CSS will not work */
/* @import url("//hello.myfonts.net/count/37cb46"); */
@font-face {
  font-family: 'jrc-icons';
  src: url("../fonts/jrc-font.svg?v=v2.1") format("svg");
  src: url("../fonts/jrc-font.eot?v=v2.1");
  src: url("../fonts/jrc-font.eot?v=v2.1") format("embedded-opentype"), url("../fonts/jrc-font.woff2?v=v2.1") format("woff2"), url("../fonts/jrc-font.ttf?v=v2.1") format("truetype"), url("../fonts/jrc-font.woff?v=v2.1") format("woff");
  font-weight: normal;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: subpixel-antialiased;
}

footer {
  background-color: #ffffff;
  border-top: 0.5rem solid #3D61A6;
  padding-top: 2.875rem;
  padding-bottom: 2.875rem;
}

@media screen and (max-width: 48.75rem) {
  footer {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}

@media screen and (max-width: 30rem) {
  footer {
    padding: 2rem;
  }
}

footer .column-width {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media screen and (max-width: 21.875rem) {
  footer .column-width {
    flex-direction: column;
    align-items: flex-start;
  }
}

footer .eu-logo {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 21.875rem) {
  footer .eu-logo {
    margin-bottom: 1rem;
  }
}

footer .eu-logo a.header-logo-svg {
  background-image: url(../img/logo-european-commission.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  width: 5.625rem;
  height: 3.875rem;
}

@media screen and (max-width: 33.125rem) {
  footer .eu-logo a.header-logo-svg {
    width: 3.625rem;
    height: 2.5rem;
  }
}

footer .eu-logo .header-logo-jrc-svg {
  background-image: url(../img/logo-joinr-research-centre.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  margin-left: 2rem;
  width: 3.3125rem;
  height: 2.5rem;
}

@media screen and (max-width: 33.125rem) {
  footer .eu-logo .header-logo-jrc-svg {
    width: 2.875rem;
    height: 2.125rem;
  }
}

@media screen and (max-width: 33.125rem) {
  footer .eu-logo .header-logo-jrc-svg {
    margin-left: 0.5rem;
  }
}

footer .social-footer {
  height: 1.875rem;
}

@media screen and (max-width: 33.125rem) {
  footer .social-footer {
    height: 1.5rem;
  }
}

footer .social-footer ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
}

footer .social-footer ul li a {
  font-size: 0;
  text-decoration: none;
}

footer .social-footer ul li.social-twitter-icon a:before {
  vertical-align: middle;
  content: "";
  font-size: 1.875rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media screen and (max-width: 33.125rem) {
  footer .social-footer ul li.social-twitter-icon a:before {
    font-size: 1.5rem;
  }
}

footer .social-footer ul li.social-facebook-icon a:before {
  vertical-align: middle;
  content: "";
  font-size: 1.875rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media screen and (max-width: 33.125rem) {
  footer .social-footer ul li.social-facebook-icon a:before {
    font-size: 1.5rem;
  }
}

footer .social-footer ul li.social-youtube-icon a:before {
  vertical-align: middle;
  content: "";
  font-size: 2rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media screen and (max-width: 33.125rem) {
  footer .social-footer ul li.social-youtube-icon a:before {
    font-size: 1.625rem;
    width: 1.5rem;
    height: 1.5rem;
    position: relative;
    top: -0.0625rem;
  }
}

footer .social-footer ul li.social-linkedin-icon a:before {
  vertical-align: middle;
  content: "";
  font-size: 1.875rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media screen and (max-width: 33.125rem) {
  footer .social-footer ul li.social-linkedin-icon a:before {
    font-size: 1.5rem;
  }
}

footer .social-footer ul li.social-instagram-icon a:before {
  vertical-align: middle;
  content: "";
  font-size: 1.875rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media screen and (max-width: 33.125rem) {
  footer .social-footer ul li.social-instagram-icon a:before {
    font-size: 1.5rem;
  }
}

footer .social-footer ul li a:before {
  width: 1.875rem;
  height: 1.875rem;
  display: block;
  margin-left: 1rem;
}

@media screen and (max-width: 33.125rem) {
  footer .social-footer ul li a:before {
    margin-left: 0.5rem;
    width: 1.5rem;
    height: 1.5rem;
    font-size: 1.5rem;
  }
}

@media screen and (max-width: 48.75rem) {
  header {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}

@media screen and (max-width: 30rem) {
  header {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

header .column-width {
  display: flex;
  justify-content: space-between;
}

header .eu-logo .header-logo-svg {
  display: flex;
  align-items: center;
  text-decoration: none;
  margin-right: 1.25rem;
  background-image: url(../img/logo-european-commission.svg);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
}

header .eu-logo .header-logo-svg .show-for-sr {
  color: #ffffff !important;
}

@media screen and (max-width: 48.75rem) {
  header .eu-logo .logo-text-all {
    display: none;
  }
}

header .eu-logo .logo-text-white {
  line-height: 0.8;
}

header .eu-logo .logo-text:not(.logo-text-gold) {
  color: #ffffff;
  font-size: 1.375rem;
}

header .eu-logo .logo-text.logo-text-gold {
  color: #E0C96C;
  font-size: 0.875rem;
  font-weight: 700;
}

header .eu-logo .logo-text.logo-text-1 {
  margin-right: 0.375rem;
}

header .burger-menu {
  width: 2rem;
  height: 2rem;
}

header .burger-menu .menu-icon {
  text-decoration: none;
  display: block;
  width: 100%;
  height: 100%;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}

header .burger-menu .menu-icon:before {
  vertical-align: middle;
  content: "";
  font-size: 2rem;
  color: #403F3D;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media screen and (max-width: 48rem) {
  header .burger-menu .menu-icon:before {
    color: #ffffff;
  }
}

header #nav {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  position: fixed;
  z-index: 2;
  top: 0;
  height: 100%;
  width: 100%;
  right: 0;
  background: #ffffff;
}

header #nav .close-menu-wrapper {
  margin: 1.5rem 3.75rem;
}

header #nav a.close-menu {
  text-decoration: none;
}

header #nav a.close-menu:before {
  vertical-align: middle;
  content: "";
  font-size: 1.5rem;
  color: #91908D;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

header #nav ul {
  border-top: 1px solid #CFCDC9;
  margin-top: 0;
  padding: 1.5rem 3.75rem;
  list-style: none;
}

@media screen and (max-height: 37.5rem) {
  header #nav ul {
    overflow-y: scroll;
    height: 100vh;
  }
}

@media screen and (max-width: 37.5rem) {
  header #nav ul {
    width: calc(100% - 7.5rem);
  }
}

header #nav ul li {
  margin-bottom: 1.875rem;
}

header #nav ul li a {
  color: #403F3D;
  text-decoration: none;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  padding-left: 1.25rem;
  width: 100%;
  font-weight: bold;
}

header #nav ul li a.pdf-icon {
  display: flex;
  width: auto;
  justify-content: space-between;
  align-items: flex-start;
}

header #nav ul li a.pdf-icon:after {
  vertical-align: middle;
  content: "";
  font-size: 0.9375rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

header #nav ul li a.pdf-icon:after {
  margin-left: 0.3125rem;
  margin-top: 0.3125rem;
}

header #nav ul li a:before {
  content: '';
  width: 0.4375rem;
  height: 0.4375rem;
  display: inline-block;
  vertical-align: middle;
  border-radius: 50%;
  background-color: #3D61A6;
  margin-right: 0.5rem;
  position: absolute;
  top: 0.5625rem;
  left: 0;
}

@media screen and (min-width: 600px) {
  header #nav {
    width: 80%;
    max-width: 22.1875rem;
  }
}

header #nav:target {
  right: 0;
  transition: right 0.7s;
  box-shadow: 0 0 1.5625rem 0 rgba(0, 0, 0, 0.25);
}

header #nav:not(:target) {
  right: -100%;
  transition: right 1.1s;
}

header #nav:not(:target) a.close-menu,
header #nav:not(:target) ul li a {
  visibility: hidden;
  pointer-events: none;
}

@media screen and (max-width: 780px) {
  body.page-home header {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}

@media screen and (max-width: 30rem) {
  body.page-home header {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}

@media screen and (max-width: 48.75rem) {
  body.page-home header .column-width {
    align-items: center;
  }
}

@media screen and (max-width: 48.75rem) {
  body.page-home header {
    background-color: #164194;
  }
}

@media screen and (max-width: 48.75rem) {
  body.page-home header .burger-menu a.menu-icon {
    color: #ffffff;
  }
}

@media screen and (min-width: 48.8125rem) {
  body.page-home header .burger-menu a.menu-icon {
    color: #403F3D;
  }
}

body.page-home header .burger-menu a.menu-icon:before {
  color: #ffffff;
}

@media screen and (min-width: 48.8125rem) {
  body.page-home header .burger-menu a.menu-icon:before {
    color: #403F3D;
  }
}

@media screen and (min-width: 48.8125rem) {
  body.page-home header .eu-logo a.header-logo-svg {
    margin-left: 3.875rem;
    margin-top: 5.125rem;
    width: 9.25rem;
    height: 6.375rem;
  }
}

@media screen and (max-width: 48.75rem) {
  body.page-home header .eu-logo a.header-logo-svg {
    width: 5.625rem;
    height: 3.875rem;
  }
}

@media screen and (max-width: 480px) {
  body.page-home header .eu-logo a.header-logo-svg {
    width: 4.25rem;
    height: 2.9375rem;
  }
}

@media screen and (min-width: 48.8125rem) {
  body.page-home header .burger-menu {
    margin-top: 3.625rem;
  }
}

body:not(.page-home) header {
  padding-top: 2rem;
  padding-bottom: 2rem;
  background-color: #164194;
}

body:not(.page-home) header .column-width {
  align-items: center;
}

@media screen and (max-width: 30rem) {
  body:not(.page-home) header {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}

body:not(.page-home) header .eu-logo a {
  display: flex;
  align-items: center;
  text-decoration: none;
}

body:not(.page-home) header .eu-logo .header-logo-svg {
  width: 5.625rem;
  height: 3.875rem;
}

body:not(.page-home) header .burger-menu .menu-icon:before {
  color: #ffffff;
}

.what-are-values--circle {
  position: absolute;
  z-index: 0;
  text-align: center;
  width: 100%;
  height: 100%;
}

.what-are-values--circle svg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  cursor: -webkit-grab;
  cursor: grab;
}

.what-are-values--circle svg:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

.what-are-values--circle g[class*="openess"] {
  overflow: visible;
  opacity: 0;
}

.what-are-values--circle g[class*="openess"].active {
  opacity: 1;
}

.what-are-values--circle .man-in-the-center {
  cursor: pointer;
}

.what-are-values--circle g[class*="-name"] {
  cursor: pointer;
}

.what-are-values--circle .zones-numbers {
  display: none;
}

.what-are-values--circle .zones-numbers.active {
  display: block;
}

.what-are-values--circle .zones-numbers g {
  cursor: pointer;
}

.what-are-values--circle .info-icon {
  cursor: pointer;
}

.close-modal {
  position: absolute;
  text-decoration: none;
  right: 0;
  z-index: 1;
}

.close-modal:before {
  vertical-align: middle;
  content: "";
  font-size: 2rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal {
  display: none;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: calc(100% - 7rem);
  z-index: 4;
  background-color: #ffffff;
  box-shadow: 0 0 0.9375rem 0 rgba(0, 0, 0, 0.3);
  padding: 3.5rem;
}

.modal .modal-inner {
  position: relative;
}

@media screen and (max-width: 610px) and (max-height: 43.75rem) {
  .modal .modal-inner {
    height: 87vh;
  }
}

@media screen and (min-width: 611px) and (max-height: 43.75rem) {
  .modal .modal-inner {
    max-height: 50vh;
    overflow-y: scroll;
  }
}

@media screen and (max-width: 610px) and (max-height: 43.75rem) {
  .modal .modal-inner .modal__content {
    overflow-y: scroll;
    height: 73vh;
  }
}

@media screen and (max-width: 610px) and (max-height: 26.25rem) {
  .modal .modal-inner .modal__content {
    height: 53vh;
  }
}

.modal h2 {
  margin-top: 0;
  width: calc(100% - 2.5rem);
}

@media screen and (min-width: 38.125rem) {
  .modal {
    z-index: 2;
    left: auto;
    right: 2%;
    top: 25vh;
    max-width: 29.5625rem;
    height: auto;
    width: 100%;
  }
}

.modal p {
  padding-right: 7.5rem;
}

@media screen and (max-width: 38.125rem) and (max-height: 62.5rem) {
  .modal p {
    padding-right: 1.875rem;
  }
}

@media screen and (max-width: 38.125rem) and (max-height: 30rem) {
  .modal p {
    padding-right: 7.5rem;
  }
}

.modal svg {
  width: 9.8125rem;
  height: auto;
  position: absolute;
  bottom: 5.375rem;
  right: -0.625rem;
  display: none;
}

@media screen and (min-width: 38.125rem) {
  .modal svg {
    bottom: -1.875rem;
    right: -1.875rem;
  }
}

.modal svg.graph-level-1 {
  display: block;
}

.modal svg.graph-level-1 path:nth-child(5) {
  fill: #2F80ED;
}

.modal svg.graph-level-2 {
  display: block;
}

.modal svg.graph-level-2 path:nth-child(4) {
  fill: #2F80ED;
}

.modal svg.graph-level-3 {
  display: block;
}

.modal svg.graph-level-3 path:nth-child(3) {
  fill: #2F80ED;
}

.modal svg.graph-level-4 {
  display: block;
}

.modal svg.graph-level-4 path:nth-child(2) {
  fill: #2F80ED;
}

.modal svg.graph-level-5 {
  display: block;
}

.modal svg.graph-level-5 path:nth-child(1) {
  fill: #2F80ED;
}

.modal svg.graph-level-5 {
  display: block;
}

.modal .modal-icon {
  position: absolute;
  width: 7.9375rem;
  height: 7.9375rem;
  bottom: 7.0625rem;
  right: 0;
  display: none;
}

@media screen and (min-width: 38.125rem) {
  .modal .modal-icon {
    bottom: 0;
  }
}

.modal .icon-achievment {
  display: block;
}

.modal .icon-achievment:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-action {
  display: block;
}

.modal .icon-action:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-caring {
  display: block;
}

.modal .icon-caring:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-concern {
  display: block;
}

.modal .icon-concern:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-dependability {
  display: block;
}

.modal .icon-dependability:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-dominance {
  display: block;
}

.modal .icon-dominance:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-face {
  display: block;
}

.modal .icon-face:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-hedonism {
  display: block;
}

.modal .icon-hedonism:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-humility {
  display: block;
}

.modal .icon-humility:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-interprersonal {
  display: block;
}

.modal .icon-interprersonal:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-nature {
  display: block;
}

.modal .icon-nature:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-personal {
  display: block;
}

.modal .icon-personal:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-resources {
  display: block;
}

.modal .icon-resources:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-rules {
  display: block;
}

.modal .icon-rules:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-societal {
  display: block;
}

.modal .icon-societal:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-stimulation {
  display: block;
}

.modal .icon-stimulation:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-thought {
  display: block;
}

.modal .icon-thought:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-tolerance {
  display: block;
}

.modal .icon-tolerance:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.modal .icon-tradition {
  display: block;
}

.modal .icon-tradition:before {
  vertical-align: middle;
  content: "";
  font-size: 7.9375rem;
  color: #7D7C7A;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

dl.metadata {
  display: grid;
  margin-bottom: 3.5rem;
  margin-top: 0;
  row-gap: 0.5rem;
}

@media screen and (min-width: 420px) {
  dl.metadata {
    grid-template-columns: auto 1fr;
    -moz-column-gap: 1.5rem;
         column-gap: 1.5rem;
  }
}

dl.metadata dt {
  font-weight: 700;
}

dl.metadata dt:after {
  content: ":";
}

dl.metadata dd {
  margin-left: 0;
  margin-top: -0.5rem;
}

@media screen and (min-width: 26.25rem) {
  dl.metadata dd {
    margin-top: 0;
  }
}

.page-home {
  position: relative;
}

.page-home .image-bg {
  position: fixed;
  top: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
}

.page-home .image-bg img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  z-index: 0;
  display: inline-block;
  margin-top: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  overflow: hidden;
}

@media screen and (min-width: 48.75rem) {
  .page-home .contains-content .column-width {
    display: flex;
  }
}

@media screen and (min-width: 75rem) {
  .page-home .contains-content .column-width.column-width-content {
    max-width: 71.5rem;
  }
}

@media screen and (min-width: 75rem) {
  .page-home .contains-content .column-width .eu-logo {
    padding-left: 7.5rem;
  }
}

@media screen and (max-width: 62.5rem) {
  .page-home .contains-content .column-width .left-side {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

@media screen and (min-width: 48.75rem) {
  .page-home .contains-content .column-width .left-side {
    width: 16.75rem;
    margin-right: 6.25rem;
  }
}

@media screen and (min-width: 48.75rem) {
  .page-home .contains-content .column-width .right-side {
    width: calc(100% - 23rem);
  }
}

.page-home .contains-content .description h1 {
  margin-top: 3.625rem;
  margin-bottom: 0;
}

@media screen and (min-width: 48.75rem) {
  .page-home .contains-content .description h1 {
    margin-top: 2.25rem;
  }
}

.page-home .contains-content .description h2 {
  margin-top: 1.5rem;
  margin-bottom: 0;
  font-size: 1.5625rem;
  line-height: 1.875rem;
  font-weight: 600;
}

@media screen and (min-width: 48.75rem) {
  .page-home .contains-content .description h2 {
    margin-top: 6rem;
    font-size: 2.125rem;
    line-height: 2.75rem;
  }
}

.page-home .contains-content .description h3 {
  margin-top: 1.5rem;
  margin-bottom: 1rem;
  font-size: 1.25rem;
  line-height: 1.4375rem;
  font-weight: 300;
}

@media screen and (min-width: 48.75rem) {
  .page-home .contains-content .description h3 {
    margin-top: 2rem;
    margin-bottom: 2.625rem;
    font-size: 1.5625rem;
    line-height: 2rem;
  }
}

.page-home .contains-content .jrc-logo {
  display: flex;
  justify-content: flex-end;
  line-height: 0;
}

@media screen and (min-width: 48.75rem) {
  .page-home .contains-content .jrc-logo {
    justify-content: center;
  }
}

.page-home .contains-content .jrc-logo a {
  display: inline-block;
  font-size: 0;
  background-image: url(../img/logo-joinr-research-centre.svg);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
  width: 3.125rem;
  height: 2.3125rem;
}

@media screen and (min-width: 48.75rem) {
  .page-home .contains-content .jrc-logo a {
    width: 6.25rem;
    height: 4.625rem;
  }
}

.page-home .contains-content .jrc-logo img {
  width: 3.125rem;
}

@media screen and (min-width: 48.75rem) {
  .page-home .contains-content .jrc-logo img {
    width: auto;
  }
}

.page-home .contains-content .blue-box {
  background-color: #3D61A6;
}

.page-home .contains-content .blue-box a {
  text-decoration: none;
  color: #ffffff;
  position: relative;
  display: block;
  padding-top: 1.5rem;
  padding-bottom: 2rem;
}

.page-home .contains-content .blue-box a:after {
  vertical-align: middle;
  content: "";
  font-size: 2.5rem;
  color: #ffffff;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.page-home .contains-content .blue-box a:after {
  position: absolute;
  right: 1.5rem;
  bottom: 1.5rem;
  z-index: 1;
}

@media screen and (max-width: 48rem) {
  .page-home .contains-content .blue-box a:after {
    font-size: 2rem;
    bottom: 4rem;
    right: 2rem;
  }
}

@media screen and (min-width: 58.125rem) {
  .page-home .contains-content .blue-box a {
    padding-top: 5rem;
    padding-bottom: 5rem;
    display: flex;
    align-items: center;
  }
}

.page-home .contains-content .blue-box a .box-left {
  background-image: url(../img/icon-what-are-values.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  max-width: 4.375rem;
}

@media screen and (max-width: 48.75rem) {
  .page-home .contains-content .blue-box a .box-left {
    height: 4.625rem;
  }
}

@media screen and (min-width: 48.75rem) {
  .page-home .contains-content .blue-box a .box-left {
    width: 30%;
    max-width: 8.75rem;
    padding-bottom: 30%;
  }
}

.page-home .contains-content .blue-box a .box-left img {
  width: 100%;
  height: auto;
}

@media screen and (min-width: 48.75rem) {
  .page-home .contains-content .blue-box a .box-right {
    margin-left: 5%;
    width: 70%;
  }
}

.page-home .contains-content .blue-box a div.box-right-title {
  font-weight: 600;
  font-size: 1.5625rem;
  line-height: 1.6875rem;
}

@media screen and (min-width: 48.75rem) {
  .page-home .contains-content .blue-box a div.box-right-title {
    font-size: 2.4375rem;
    line-height: 2.75rem;
  }
}

.page-home .contains-content .blue-box a div.box-right-title,
.page-home .contains-content .blue-box a p {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

@media screen and (max-width: 48.75rem) {
  .page-home .contains-content .blue-box a div.box-right-title,
  .page-home .contains-content .blue-box a p {
    padding-right: 3.75rem;
  }
}

@media screen and (max-width: 48.75rem) {
  .page-home .contains-content .blue-box a p {
    font-size: 1.25rem;
  }
}

.page-home .contains-content .blue-box a {
  padding-left: 2rem;
  padding-right: 2rem;
  position: relative;
}

@media screen and (min-width: 58.125rem) {
  .page-home .contains-content .blue-box a {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}

.page-home .contains-content .white-boxes {
  margin-top: 1rem;
}

@media screen and (min-width: 62.5625rem) {
  .page-home .contains-content .white-boxes {
    display: flex;
    margin-top: 0.5rem;
  }
}

@media screen and (max-width: 62.5rem) {
  .page-home .contains-content .white-boxes {
    margin-bottom: 4.375rem;
  }
}

.page-home .contains-content .white-boxes .card {
  display: flex;
  width: 100%;
}

@media screen and (min-width: 62.5625rem) {
  .page-home .contains-content .white-boxes .card {
    width: 33.333333%;
  }
}

@media screen and (min-width: 62.5625rem) {
  .page-home .contains-content .white-boxes .card:nth-child(1) {
    margin-right: 1.3%;
  }
  .page-home .contains-content .white-boxes .card:nth-child(2) {
    margin-right: 1.3%;
  }
}

.page-home .contains-content .white-boxes .card:nth-child(1) a:before {
  vertical-align: middle;
  content: "";
  font-size: 2.5rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.page-home .contains-content .white-boxes .card:nth-child(2) a:before {
  vertical-align: middle;
  content: "";
  font-size: 2.5rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.page-home .contains-content .white-boxes .card:nth-child(3) a:before {
  vertical-align: middle;
  content: "";
  font-size: 2.5rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.page-home .contains-content .white-boxes .card a {
  display: block;
  width: -webkit-fill-available;
  width: -moz-available;
  background-color: #ffffff;
  text-decoration: none;
  font-size: 1.25rem;
  color: #403F3D;
  font-weight: 600;
  padding: 30% 7%;
  position: relative;
}

@media screen and (max-width: 62.5rem) {
  .page-home .contains-content .white-boxes .card a {
    display: flex;
    align-items: center;
  }
  .page-home .contains-content .white-boxes .card a .card-link-inner {
    margin: 0 1rem;
    width: 100%;
  }
}

@media screen and (max-width: 48rem) {
  .page-home .contains-content .white-boxes .card a .card-link-inner {
    font-size: 1.125rem;
  }
}

@media screen and (min-width: 62.5625rem) {
  .page-home .contains-content .white-boxes .card a:before {
    margin-bottom: 1rem;
  }
}

@media screen and (min-width: 62.5625rem) {
  .page-home .contains-content .white-boxes .card a:before, .page-home .contains-content .white-boxes .card a:after {
    display: block;
  }
}

.page-home .contains-content .white-boxes .card a:after {
  vertical-align: middle;
  content: "";
  font-size: 2.5rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media screen and (min-width: 62.5625rem) {
  .page-home .contains-content .white-boxes .card a:after {
    position: absolute;
    right: 1.25rem;
    bottom: 1.25rem;
  }
}

@media screen and (max-width: 48rem) {
  .page-home .contains-content .white-boxes .card a:after {
    font-size: 2rem;
  }
}

@media screen and (max-width: 62.5rem) {
  .page-home .contains-content .white-boxes .card a {
    margin-top: 0.5rem;
    padding: 2rem;
  }
}

@media screen and (min-width: 62.5625rem) {
  .page-home .contains-content .white-boxes .card a {
    padding: 14% 12% 32% 12%;
  }
}

.page-home .contains-content {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.page-home .contains-content > header {
  flex-shrink: 0;
}

.page-home .contains-content > .column-width {
  flex-grow: 1;
}

.page-home .contains-content .left-side {
  display: flex;
  flex-direction: column;
}

.page-home .contains-content .left-side > * {
  flex-shrink: 0;
}

.page-home .contains-content .left-side .jrc-logo {
  margin-top: auto;
}

.page-inner {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.page-inner h1 {
  font-size: 1.8125rem;
  line-height: 2rem;
}

@media screen and (min-width: 48.75rem) {
  .page-inner h1 {
    font-size: 3.0625rem;
    line-height: 3.375rem;
  }
}

.page-inner:before {
  content: '';
  width: 100%;
  height: 38.75rem;
  background-image: url(../img/jrc-report-executive-summary-bg.png);
  position: absolute;
  z-index: -1;
}

.page-inner.enlightenment-research-projects:before {
  background-image: url(../img/jrc-enlightenment-2-0-research-projects-3-bg.png);
}

.page-inner .column-width {
  display: flex;
  flex-wrap: wrap;
  position: relative;
}

@media screen and (max-width: 48.75rem) {
  .page-inner .conteiner .column-width {
    flex-direction: column;
  }
}

.page-inner .main-content {
  position: relative;
}

@media screen and (min-width: 48.75rem) {
  .page-inner .main-content {
    max-width: 70.625rem;
    width: calc(100% - 16.25rem);
  }
}

.page-inner .main-content .img-text-group {
  margin-top: 2.5rem;
}

@media screen and (min-width: 58.125rem) {
  .page-inner .main-content .img-text-group:before {
    content: '';
    border-left: 3px solid #CFCDC9;
    height: 6.25rem;
    position: absolute;
    right: 0;
  }
}

.page-inner .main-content .img-text-group h5:first-child {
  margin-top: 0;
}

@media screen and (min-width: 58.125rem) {
  .page-inner .main-content .img-text-group .left-side {
    width: 30%;
    padding-right: 10%;
  }
}

.page-inner .main-content .img-text-group .img-text-group-description {
  margin-top: 1rem;
  font-size: 0.8125rem;
  line-height: 1.125rem;
  padding-bottom: 2.5rem;
  position: relative;
}

@media screen and (min-width: 58.125rem) {
  .page-inner .main-content .img-text-group .img-text-group-description {
    padding-bottom: 5.3125rem;
  }
  .page-inner .main-content .img-text-group .img-text-group-description:before {
    content: '';
    border-bottom: 0.1875rem solid #CFCDC9;
    width: 2.5rem;
    position: absolute;
    left: 0;
    bottom: 0;
  }
}

.page-inner .main-content .img-text-group .button {
  margin-top: 3.5rem;
}

.page-inner .anchors {
  width: 11.625rem;
  padding: 0;
  position: sticky;
  top: 10vh;
  height: 100%;
  background-color: #ffffff;
  margin-top: 11vh;
  list-style: none;
  padding: 2.6875rem 2.625rem 1.625rem 2rem;
}

@media screen and (max-width: 48.75rem) {
  .page-inner .anchors {
    display: none;
  }
}

.page-inner .anchors li {
  margin-bottom: 16px;
}

.page-inner .anchors li a {
  text-decoration: none;
  font-size: 0.8125rem;
  line-height: 1.125rem;
  border-left: 0.25rem solid #ffffff;
  display: block;
  padding-left: 0.75rem;
  padding-right: 0.375rem;
}

.page-inner .anchors li a.active {
  font-weight: 600;
  border-color: #3D61A6;
  padding-right: 0;
}

.page-inner .anchors li a:hover {
  color: #3D61A6;
}

.page-inner .anchors li a:hover,
.page-inner .anchors li a:focus-visible {
  font-weight: 600;
  padding-right: 0;
}

.page-inner .anchors li a:focus-visible {
  color: #12367B;
}

.page-inner > .conteiner {
  flex-grow: 1;
}

.page-inner > header,
.page-inner > footer {
  flex-shrink: 0;
}

.main-content img {
  width: 100%;
}

.main-content .main-content-inner h2 {
  text-transform: capitalize;
  font-weight: 300;
  font-size: 1.4375rem;
  line-height: 1.75rem;
}

@media screen and (min-width: 48.75rem) {
  .main-content .main-content-inner h2 {
    font-size: 1.9375rem;
    line-height: 2.25rem;
  }
}

.main-content .main-content-inner h3 {
  font-weight: 300;
  font-size: 1.25rem;
  line-height: 1.4375rem;
}

@media screen and (min-width: 780px) {
  .main-content .main-content-inner h3 {
    font-size: 1.5625rem;
    line-height: 2rem;
  }
}

.main-content .main-content-inner h4[id],
.main-content .main-content-inner h5[id] {
  color: #3D61A6;
}

@media screen and (min-width: 58.125rem) {
  .main-content .main-content-inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
}

.main-content .main-content-inner .left-side.left-side-top {
  margin-top: 8vh;
}

@media screen and (max-width: 48.75rem) {
  .main-content .main-content-inner .left-side {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}

@media screen and (max-width: 30rem) {
  .main-content .main-content-inner .left-side {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

@media screen and (min-width: 58.125rem) {
  .main-content .main-content-inner .left-side {
    width: 40%;
  }
}

.main-content .main-content-inner .right-side {
  background-color: #ffffff;
  padding-left: 2rem;
  padding-right: 2rem;
}

.main-content .main-content-inner .right-side.right-side-top {
  padding-top: 4.5rem;
}

.main-content .main-content-inner .right-side.right-side-bottom {
  padding-bottom: 4.5rem;
  min-height: 75vh;
}

@media screen and (min-width: 30rem) {
  .main-content .main-content-inner .right-side {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}

@media screen and (min-width: 48.75rem) {
  .main-content .main-content-inner .right-side {
    padding-left: 3.75rem;
    padding-right: 3.75rem;
  }
}

@media screen and (min-width: 58.125rem) {
  .main-content .main-content-inner .right-side {
    width: calc(60% - 7.5rem);
  }
}

.main-content .main-content-inner p > a {
  text-decoration: none;
}

.main-content .main-content-inner p > a.more:after {
  content: " ";
  display: inline-block;
  width: 0.375rem;
  height: 0.375rem;
  border-top: 0.0625rem solid #3D61A6;
  border-left: 0.0625rem solid #3D61A6;
  transform: rotate(135deg) skew(0);
  margin-left: 0.375rem;
}

.main-content .main-content-inner p > a:hover:after {
  border-color: #12367B;
}

.enlightenment-research-projects.page-inner .main-content h3 {
  text-transform: capitalize;
  font-weight: 300;
  font-size: 1.4375rem;
  line-height: 1.75rem;
  margin-top: 3.75rem;
}

@media screen and (min-width: 48.75rem) {
  .enlightenment-research-projects.page-inner .main-content h3 {
    font-size: 1.9375rem;
    line-height: 2.25rem;
  }
}

.enlightenment-research-projects.page-inner .main-content .img-text-group {
  margin-top: 0;
  margin-bottom: 4.5rem;
}

.enlightenment-research-projects.page-inner .main-content .img-text-group:before {
  display: none;
}

.enlightenment-research-projects .img-text-group h3,
.enlightenment-research-projects .img-text-group h4,
.enlightenment-research-projects .img-text-group h5,
.enlightenment-research-projects .img-text-group h6 {
  margin-top: 0;
}

.enlightenment-research-projects .img-text-group h4 {
  margin-bottom: 2rem;
  font-weight: 600;
  font-size: 1.125rem;
  line-height: 1.25rem;
}

@media screen and (min-width: 48.75rem) {
  .enlightenment-research-projects .img-text-group h4 {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}

@media screen and (min-width: 58.75rem) {
  .enlightenment-research-projects .img-text-group img.header-logo-svg {
    max-width: 16.875rem;
    margin-top: -1.25rem;
  }
}

.tools.page-inner {
  background: #6480B8;
}

.tools.page-inner:before {
  display: none;
}

.tools.page-inner .conteiner {
  position: relative;
  overflow: hidden;
  padding-bottom: 1.5rem;
}

.tools.page-inner .conteiner:before {
  vertical-align: middle;
  content: "";
  font-size: 31.9375rem;
  color: #8AA0C9;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media screen and (min-width: 58.1875rem) {
  .tools.page-inner .conteiner {
    padding-bottom: 8.25rem;
  }
}

.tools.page-inner .conteiner:before {
  background-image: none;
  position: absolute;
  width: 8.8125rem;
  height: 8.8125rem;
}

@media screen and (max-width: 58.125rem) {
  .tools.page-inner .conteiner:before {
    top: 1.125rem;
    right: -1.5rem;
    font-size: 8.8125rem;
  }
}

@media screen and (min-width: 58.1875rem) {
  .tools.page-inner .conteiner:before {
    bottom: -6.875rem;
    left: -6.875rem;
    width: 31.9375rem;
    height: 31.9375rem;
  }
}

.tools.page-inner .main-content {
  max-width: none;
  width: 100%;
}

.tools.page-inner .main-content .main-content-inner {
  justify-content: flex-start;
}

.tools .main-content .main-content-inner .left-side {
  width: 12.5rem;
}

@media screen and (max-width: 58.125rem) {
  .tools .main-content .main-content-inner .left-side.left-side-top {
    margin-top: 0;
  }
}

.tools .main-content .main-content-inner .right-side {
  padding: 0;
  background: none;
}

@media screen and (min-width: 58.1875rem) {
  .tools .main-content .main-content-inner .right-side {
    width: calc(100% - 12.5rem);
  }
}

.tools h1 {
  color: #ffffff;
}

@media screen and (max-width: 48rem) {
  .tools h1 {
    margin-top: 3.125rem;
    margin-bottom: 2.75rem;
  }
}

@media screen and (min-width: 58.1875rem) {
  .tools .main-content .main-content-inner .left-side h1 {
    margin-top: 0;
  }
}

@media screen and (min-width: 58.1875rem) {
  .tools .right-side {
    margin-top: 9.2vh;
  }
}

@media screen and (min-width: 81.3125rem) {
  .tools .right-side {
    display: flex;
  }
}

@media screen and (min-width: 81.3125rem) {
  .tools .tools-list {
    margin-left: 0.375rem;
    margin-right: 0.375rem;
    width: 33.3333%;
  }
  .tools .tools-list:nth-child(1) {
    margin-left: 0;
  }
  .tools .tools-list:nth-child(3) {
    margin-right: 0;
  }
}

@media screen and (max-width: 81.25rem) {
  .tools .tools-list {
    margin-bottom: 1.5rem;
  }
}

.tools .tools-list .tools-header {
  background-color: #3D61A6;
  height: calc(120px - 3rem);
  padding: 1.5rem 7% 1.5rem 1.5rem;
  color: #ffffff;
  margin-bottom: 0.5rem;
  font-size: 1.25rem;
  font-weight: 600;
}

@media screen and (min-width: 931px) {
  .tools .tools-list .tools-header {
    height: calc(160px - 3rem);
  }
}

.tools .tools-list .tools-header:before {
  display: block;
  margin-bottom: 1rem;
}

.tools .tools-list:nth-child(1) .tools-header:before {
  vertical-align: middle;
  content: "";
  font-size: 3rem;
  color: #ffffff;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.tools .tools-list:nth-child(2) .tools-header:before {
  vertical-align: middle;
  content: "";
  font-size: 3rem;
  color: #ffffff;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.tools .tools-list:nth-child(3) .tools-header:before {
  vertical-align: middle;
  content: "";
  font-size: 3rem;
  color: #ffffff;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media screen and (max-width: 58.1875rem) {
  .tools .tools-list .tools-header:before {
    font-size: 2rem !important;
  }
}

.tools .tools-list .tools-group ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.tools .tools-list .tools-group ul li {
  margin-bottom: 0.125rem;
}

.tools .tools-list .tools-group ul li a {
  background-color: #ffffff;
  display: block;
  text-decoration: none;
  font-weight: 600;
  padding: 16px 24px;
  color: #403F3D;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.tools .tools-list .tools-group ul li a:after {
  vertical-align: middle;
  content: "";
  font-size: 2.5rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.tools .tools-list .tools-group ul li a:after {
  margin-left: 3.625rem;
}

.page-what-are-values .main-content .main-content-inner .left-side.left-side-top {
  margin-top: 5vh;
  position: relative;
  z-index: 1;
  height: 77vh;
  margin-top: 1.25rem;
}

@media screen and (min-width: 58.1875rem) {
  .page-what-are-values .main-content .main-content-inner .left-side.left-side-top {
    margin-left: 2.5%;
    margin-top: 2.875rem;
  }
}

.page-what-are-values .main-content .main-content-inner .left-side.left-side-top .close-modal-desktop {
  display: none;
}

@media screen and (min-width: 58.1875rem) {
  .page-what-are-values .main-content .main-content-inner .left-side.left-side-top .close-modal-desktop {
    display: block;
  }
}

.page-what-are-values .main-content .main-content-inner .left-side.left-side-top .close-modal-mobile {
  display: block;
}

@media screen and (min-width: 58.1875rem) {
  .page-what-are-values .main-content .main-content-inner .left-side.left-side-top .close-modal-mobile {
    display: none;
  }
}

.page-what-are-values .main-content .main-content-inner .left-side.left-side-top .close-modal {
  cursor: pointer;
  background: none;
  border: none;
  top: 1.875rem;
  right: -2.5rem;
}

@media screen and (max-width: 58.125rem) {
  .page-what-are-values .main-content .main-content-inner .left-side.left-side-top .close-modal {
    right: 1.875rem;
    position: fixed;
  }
}

@media screen and (max-height: 63.4375rem) {
  .page-what-are-values .main-content .main-content-inner .left-side.left-side-top {
    overflow-y: scroll;
    overflow-x: clip;
    padding-right: 3.125rem;
  }
  .page-what-are-values .main-content .main-content-inner .left-side.left-side-top .close-modal {
    right: 1.25rem;
  }
}

@media screen and (max-height: 63.4375rem) and (min-width: 58.1875rem) {
  .page-what-are-values .main-content .main-content-inner .left-side.left-side-top .close-modal {
    right: 0.625rem;
  }
}

@media screen and (max-height: 43.75rem) {
  .page-what-are-values .main-content .main-content-inner .left-side.left-side-top {
    height: 66vh;
  }
}

@media screen and (max-width: 58.125rem) {
  .page-what-are-values .main-content .main-content-inner .left-side.left-side-top {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 4;
    margin-top: 0;
    background: #ffffff;
    height: 100%;
    width: calc(100% - 6rem);
  }
}

@media screen and (min-width: 48.75rem) and (max-width: 58.125rem) {
  .page-what-are-values .main-content .main-content-inner .left-side.left-side-top {
    padding: 3rem;
  }
}

@media screen and (max-width: 30rem) {
  .page-what-are-values .main-content .main-content-inner .left-side.left-side-top {
    width: calc(100% - 4rem);
  }
}

.page-what-are-values {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  position: fixed;
  overflow: hidden;
}

.page-what-are-values .conteiner {
  width: 100%;
  height: 100%;
}

.page-what-are-values header {
  position: relative;
  z-index: 4;
}

.page-what-are-values h1 {
  font-size: 2.0625rem;
  line-height: 2.125rem;
  margin-bottom: 2.75rem;
}

@media screen and (min-width: 48.75rem) {
  .page-what-are-values h1 {
    font-size: 2.25rem;
    line-height: 1.2;
    margin-bottom: 3rem;
  }
}

@media screen and (max-width: 58.125rem) {
  .page-what-are-values h1 {
    padding-right: 3rem;
  }
}

.page-what-are-values.page-inner:before {
  display: none;
}

.page-what-are-values .column-width {
  max-width: none;
  width: 95%;
}

.page-what-are-values header .column-width {
  max-width: none;
}

@media screen and (max-width: 48.75rem) {
  .page-what-are-values header .column-width {
    width: 100%;
  }
}

.page-what-are-values .conteiner {
  flex: 1;
}

.page-what-are-values .conteiner .column-width {
  width: 100%;
  height: 100%;
}

.page-what-are-values .conteiner .column-width .main-content {
  max-width: none;
  width: 100%;
  height: 100%;
}

.page-what-are-values .conteiner .column-width .main-content .main-content-inner {
  width: 100%;
  height: 100%;
}

.page-what-are-values .left-side .values-and-identities-info {
  display: flex;
  margin-top: 2rem;
}

.page-what-are-values .left-side .values-and-identities-info .indicator {
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
}

.page-what-are-values .left-side .values-and-identities-info .indicator-1 {
  background-image: url(../img/value-show-how-it-expands.svg);
  margin-right: 1.25rem;
  width: 4.75rem;
  height: 7.9375rem;
}

.page-what-are-values .left-side .values-and-identities-info .indicator-2 {
  background-image: url(../img/numbers-for-the-layer-info.svg);
  width: 4.75rem;
  height: 7.9375rem;
}

.page-what-are-values ul.swipe-instructions {
  margin-top: 3rem;
  list-style: none;
  padding-left: 0;
}

.page-what-are-values ul.swipe-instructions li {
  margin-bottom: 3rem;
  display: flex;
  font-size: 0.9375rem;
  line-height: 1.25rem;
}

.page-what-are-values ul.swipe-instructions li:nth-child(1):before {
  vertical-align: middle;
  content: "";
  font-size: 2rem;
  color: #545351;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.page-what-are-values ul.swipe-instructions li:nth-child(2):before {
  vertical-align: middle;
  content: "";
  font-size: 2rem;
  color: #545351;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.page-what-are-values ul.swipe-instructions li:before {
  margin-right: 1.5rem;
  margin-top: 0.25rem;
}

.page-what-are-values .main-content .main-content-inner {
  justify-content: flex-start;
}

@media screen and (min-width: 58.1875rem) {
  .page-what-are-values .main-content .main-content-inner .left-side {
    max-width: 18.5rem;
  }
}

.page-what-are-values #what-are-values-svg {
  overflow: visible !important;
}

.page-what-are-values .magnify-block {
  position: absolute;
  z-index: 1;
  right: 2rem;
  top: 1.5rem;
  display: flex;
  justify-content: space-between;
  width: 4.125rem;
  height: 1.5rem;
  border-radius: 1.875rem;
  padding: 0.75rem;
  background: #ffffff;
}

@media screen and (min-width: 30rem) {
  .page-what-are-values .magnify-block {
    right: 2.375rem;
  }
}

@media screen and (min-width: 48.8125rem) {
  .page-what-are-values .magnify-block {
    right: 1.5%;
  }
}

@media screen and (min-width: 58.1875rem) {
  .page-what-are-values .magnify-block {
    right: 2%;
    top: 2.25rem;
  }
}

@media screen and (min-width: 58.125rem) {
  .page-what-are-values .magnify-block {
    width: 5.5rem;
    height: 2rem;
  }
}

.page-what-are-values .magnifying {
  display: block;
  width: 2rem;
  height: 2rem;
  text-decoration: none;
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
}

.page-what-are-values .magnifying.magnifying-minus:before {
  vertical-align: middle;
  content: "";
  font-size: 2rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.page-what-are-values .magnifying.magnifying-plus:before {
  vertical-align: middle;
  content: "";
  font-size: 2rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media screen and (max-width: 58.125rem) {
  .page-what-are-values .magnifying {
    width: 1.5rem;
    height: 1.5rem;
  }
  .page-what-are-values .magnifying:before {
    font-size: 1.5rem !important;
  }
}

.page-what-are-values .values-identities-info-block {
  position: absolute;
  z-index: 1;
  display: inline-block;
  margin-left: 1.25rem;
  margin-top: 1.375rem;
}

@media screen and (min-width: 30rem) {
  .page-what-are-values .values-identities-info-block {
    margin-left: 2.875rem;
  }
}

@media screen and (min-width: 48.8125rem) {
  .page-what-are-values .values-identities-info-block {
    margin-left: 2%;
  }
}

@media screen and (min-width: 58.1875rem) {
  .page-what-are-values .values-identities-info-block {
    margin-left: 2.5%;
    margin-top: 2.25rem;
  }
}

.page-what-are-values .values-identities-info {
  border-radius: 3.125rem;
  position: relative;
  color: #000000;
  text-decoration: none;
  border: none;
  background: none;
  padding: 0.75rem 1rem;
  margin-left: -0.75rem;
  cursor: pointer;
  font-size: 0.8125rem;
}

.page-what-are-values .values-identities-info:after {
  vertical-align: middle;
  content: "";
  font-size: 2rem;
  color: #3D61A6;
  font-family: 'jrc-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.page-what-are-values .values-identities-info:after {
  margin-left: 0.5rem;
  font-size: 1.5rem;
}

@media screen and (min-width: 58.1875rem) {
  .page-what-are-values .values-identities-info {
    font-size: 0.9375rem;
  }
  .page-what-are-values .values-identities-info:after {
    font-size: 2rem;
  }
}

body.page-what-are-values:not(.instructions-active) .values-identities-info {
  display: block;
  background-color: #ffffff;
}

body.page-what-are-values .instructions-active .values-identities-info {
  display: none;
  visibility: hidden;
  pointer-events: none;
  cursor: none;
}

body.page-what-are-values:not(.instructions-active) .left-side-top {
  display: none;
}

body.page-what-are-values .instructions-active .left-side-top {
  display: block;
}

.contact-us h3 {
  text-transform: capitalize;
  font-weight: 300;
  font-size: 1.4375rem !important;
  line-height: 1.75rem;
  margin-top: 3.75rem;
}

@media screen and (min-width: 48.75rem) {
  .contact-us h3 {
    font-size: 1.9375rem !important;
    line-height: 2.25rem;
  }
}
/*# sourceMappingURL=valide.css.map */