*, *::before, *::after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

* {
  margin: 0; }

html, body {
  height: 100%; }

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased; }

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%; }

input, button, textarea, select {
  font: inherit; }

p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word; }

#root, #__next {
  isolation: isolate; }

@font-face {
  font-family: 'Maax-Black';
  src: url("../fonts/Maax-Black.eot");
  src: url("../fonts/Maax-Black.eot?#iefix") format("embedded-opentype"), url("../fonts/Maax-Black.woff2") format("woff2"), url("../fonts/Maax-Black.woff") format("woff"), url("../fonts/Maax-Black.ttf") format("truetype"), url("../fonts/Maax-Black.svg#Maax-Black") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'RobotoSlab-Light';
  src: url("../fonts/RobotoSlab-Light.eot");
  src: url("../fonts/RobotoSlab-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/RobotoSlab-Light.woff2") format("woff2"), url("../fonts/RobotoSlab-Light.woff") format("woff"), url("../fonts/RobotoSlab-Light.ttf") format("truetype"), url("../fonts/RobotoSlab-Light.svg#RobotoSlab-Light") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'Maax-Bold';
  src: url("../fonts/Maax-Bold.eot");
  src: url("../fonts/Maax-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/Maax-Bold.woff2") format("woff2"), url("../fonts/Maax-Bold.woff") format("woff"), url("../fonts/Maax-Bold.ttf") format("truetype"), url("../fonts/Maax-Bold.svg#Maax-Bold") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'RobotoSlab-Bold';
  src: url("../fonts/RobotoSlab-Bold.eot");
  src: url("../fonts/RobotoSlab-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/RobotoSlab-Bold.woff2") format("woff2"), url("../fonts/RobotoSlab-Bold.woff") format("woff"), url("../fonts/RobotoSlab-Bold.ttf") format("truetype"), url("../fonts/RobotoSlab-Bold.svg#RobotoSlab-Bold") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'RobotoSlab-Regular';
  src: url("../fonts/RobotoSlab-Regular.eot");
  src: url("../fonts/RobotoSlab-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/RobotoSlab-Regular.woff2") format("woff2"), url("../fonts/RobotoSlab-Regular.woff") format("woff"), url("../fonts/RobotoSlab-Regular.ttf") format("truetype"), url("../fonts/RobotoSlab-Regular.svg#RobotoSlab-Regular") format("svg");
  font-weight: normal;
  font-style: normal; }

body {
  font-family: "RobotoSlab-Light"; }
  body main {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
    @media screen and (max-width: 860px) {
      body main {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        display: block;
        height: auto;
        padding-bottom: 30px;
        position: relative; } }
    body main .sidebar {
      width: 550px;
      height: 100%;
      background-color: #e6ecee;
      position: absolute;
      padding-top: 50px;
      padding-bottom: 50px;
      padding-left: 130px;
      left: -550px;
      -webkit-transition: all 500ms;
      -o-transition: all 500ms;
      transition: all 500ms;
      z-index: 9; }
      @media screen and (max-height: 750px) {
        body main .sidebar {
          padding-left: 105px;
          width: 500px; } }
      @media screen and (max-width: 1440px) {
        body main .sidebar {
          padding-left: 105px;
          width: 500px; } }
      @media screen and (max-width: 1300px) {
        body main .sidebar {
          padding-left: 50px;
          width: 400px; } }
      @media screen and (max-width: 1024px) {
        body main .sidebar {
          padding-left: 15px;
          width: 320px; } }
      body main .sidebar.open {
        left: 0;
        -webkit-transition: all 500ms;
        -o-transition: all 500ms;
        transition: all 500ms; }
      body main .sidebar .close {
        position: absolute;
        top: 32px;
        right: 32px;
        cursor: pointer;
        padding: 15px; }
      body main .sidebar h3 {
        font-size: 50px;
        line-height: 60px;
        font-family: "Maax-Black";
        margin: 0;
        font-weight: normal;
        margin-bottom: 18px;
        color: #000000;
        width: 470px; }
        @media screen and (max-width: 1300px) {
          body main .sidebar h3 {
            width: 100%; } }
      body main .sidebar .content-sidebar {
        height: 100%;
        overflow-y: auto;
        overflow-x: hidden;
        padding-right: 137px;
        scrollbar-width: auto;
        scrollbar-color: #000000 #eef2f3; }
        @media screen and (max-height: 750px) {
          body main .sidebar .content-sidebar {
            padding-right: 112px; } }
        @media screen and (max-width: 1440px) {
          body main .sidebar .content-sidebar {
            padding-right: 112px; } }
        @media screen and (max-width: 1300px) {
          body main .sidebar .content-sidebar {
            padding-right: 67px; } }
        @media screen and (max-width: 1024px) {
          body main .sidebar .content-sidebar {
            padding-right: 15px; } }
        body main .sidebar .content-sidebar::-webkit-scrollbar {
          width: 8px; }
        body main .sidebar .content-sidebar::-webkit-scrollbar-track {
          background: #eef2f3; }
        body main .sidebar .content-sidebar::-webkit-scrollbar-thumb {
          background-color: #000000;
          border-radius: 10px;
          border: 0px solid #ffffff; }
      body main .sidebar .content-accord {
        padding-top: 10px; }
        body main .sidebar .content-accord .content-title {
          padding-bottom: 8px;
          margin-bottom: 25px;
          border-bottom: 1px solid #e30613;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex; }
          body main .sidebar .content-accord .content-title .title {
            -webkit-box-flex: 2;
            -ms-flex: 2;
            flex: 2; }
            body main .sidebar .content-accord .content-title .title h4 {
              font-family: "Maax-Bold";
              font-weight: normal;
              font-size: 24px;
              line-height: 28.8px;
              color: #e30613;
              text-transform: uppercase; }
            body main .sidebar .content-accord .content-title .title h5 {
              font-family: "RobotoSlab-Regular";
              font-weight: normal;
              font-size: 14px;
              font-weight: 16.8px;
              color: #e30613; }
          body main .sidebar .content-accord .content-title .icon {
            width: 26px;
            padding-top: 8px;
            margin-left: 5px; }
        body main .sidebar .content-accord .content-list {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          margin-bottom: 20px; }
          body main .sidebar .content-accord .content-list .icon {
            width: 32px;
            margin-right: 20px; }
          body main .sidebar .content-accord .content-list .text {
            -webkit-box-flex: 2;
            -ms-flex: 2;
            flex: 2;
            font-family: "RobotoSlab-Regular";
            font-weight: normal;
            font-size: 16px;
            line-height: 19.2px;
            color: #000000; }
      body main .sidebar .accord-unilateraux {
        padding-top: 27px;
        border-top: 1px solid black; }
        body main .sidebar .accord-unilateraux h6 {
          font-size: 16px;
          line-height: 19.2px;
          font-weight: normal;
          font-family: "RobotoSlab-Bold";
          color: #000000; }
        body main .sidebar .accord-unilateraux p {
          font-size: 16px;
          line-height: 19.2px;
          font-weight: normal;
          font-family: "RobotoSlab-Regular";
          color: #000000;
          margin-bottom: 16px; }
      body main .sidebar .content-droit {
        padding-top: 10px; }
        body main .sidebar .content-droit h6 {
          font-family: "Maax-Bold";
          font-weight: normal;
          font-size: 20px;
          line-height: 24px;
          color: #000000; }
        body main .sidebar .content-droit ul {
          margin-top: 20px;
          padding: 0; }
          body main .sidebar .content-droit ul li {
            font-family: "RobotoSlab-Regular";
            font-weight: normal;
            color: #000000;
            font-size: 16px;
            line-height: 19.2px;
            margin-bottom: 14px;
            list-style: none;
            background-image: url("../img/fleche-list.svg");
            background-repeat: no-repeat;
            background-position: left 6px;
            background-size: 18px;
            padding-left: 45px; }
            body main .sidebar .content-droit ul li:last-child {
              margin-bottom: 0; }
    body main .leftbar {
      width: 550px;
      height: 100%;
      padding-left: 196px; }
      @media screen and (max-height: 750px) {
        body main .leftbar {
          padding-left: 146px;
          width: 500px; } }
      @media screen and (max-width: 1440px) {
        body main .leftbar {
          padding-left: 146px;
          width: 500px; } }
      @media screen and (max-width: 1300px) {
        body main .leftbar {
          padding-left: 50px;
          width: 400px; } }
      @media screen and (max-width: 1024px) {
        body main .leftbar {
          padding-left: 20px;
          width: 300px; } }
      @media screen and (max-width: 860px) {
        body main .leftbar {
          width: 100%;
          padding-right: 20px;
          text-align: center;
          padding-top: 30px; }
          body main .leftbar .content-flex {
            padding-bottom: 30px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center; } }
      body main .leftbar .content-leftbar {
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center; }
      body main .leftbar h1 {
        font-size: 50px;
        line-height: 60px;
        font-family: "Maax-Black";
        margin: 0;
        font-weight: normal;
        margin-bottom: 36px;
        color: #000000; }
        @media screen and (max-height: 750px) {
          body main .leftbar h1 {
            font-size: 42px;
            line-height: 50px;
            margin-bottom: 25px; } }
        @media screen and (max-width: 1440px) {
          body main .leftbar h1 {
            font-size: 42px;
            line-height: 50px;
            margin-bottom: 25px; } }
        @media screen and (max-width: 1300px) {
          body main .leftbar h1 {
            font-size: 42px;
            line-height: 50px;
            margin-bottom: 25px; } }
        @media screen and (max-width: 1024px) {
          body main .leftbar h1 {
            font-size: 38px;
            line-height: 36px;
            margin-bottom: 20px; } }
        @media screen and (max-height: 640px) {
          body main .leftbar h1 {
            font-size: 38px;
            line-height: 36px;
            margin-bottom: 20px; } }
      body main .leftbar h2 {
        font-size: 20px;
        line-height: 24px;
        font-weight: normal;
        color: #000000;
        margin-bottom: 46px; }
        @media screen and (max-height: 750px) {
          body main .leftbar h2 {
            font-size: 18px;
            line-height: 22px;
            margin-bottom: 30px; } }
        @media screen and (max-width: 1440px) {
          body main .leftbar h2 {
            font-size: 18px;
            line-height: 22px;
            margin-bottom: 30px; } }
        @media screen and (max-width: 1300px) {
          body main .leftbar h2 {
            font-size: 18px;
            line-height: 22px;
            margin-bottom: 30px; } }
        @media screen and (max-width: 1024px) {
          body main .leftbar h2 {
            font-size: 16px;
            line-height: 20px;
            margin-bottom: 20px; } }
        @media screen and (max-height: 640px) {
          body main .leftbar h2 {
            font-size: 16px;
            line-height: 20px;
            margin-bottom: 20px; } }
      body main .leftbar .content-icon {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-bottom: 50px; }
        @media screen and (max-height: 750px) {
          body main .leftbar .content-icon {
            margin-bottom: 30px; } }
        @media screen and (max-width: 1440px) {
          body main .leftbar .content-icon {
            margin-bottom: 30px; } }
        @media screen and (max-width: 1300px) {
          body main .leftbar .content-icon {
            margin-bottom: 30px; } }
        @media screen and (max-width: 1024px) {
          body main .leftbar .content-icon {
            margin-bottom: 20px; } }
        @media screen and (max-height: 640px) {
          body main .leftbar .content-icon {
            margin-bottom: 20px; } }
        body main .leftbar .content-icon:last-child {
          margin-bottom: 0; }
        body main .leftbar .content-icon .icon {
          width: 46px;
          margin-right: 16px; }
        body main .leftbar .content-icon h3 {
          font-family: "Maax-Bold";
          font-weight: normal;
          font-size: 20px;
          line-height: 24px;
          color: #e30613;
          margin-bottom: 16px; }
          @media screen and (max-height: 750px) {
            body main .leftbar .content-icon h3 {
              font-size: 18px;
              line-height: 22px; } }
          @media screen and (max-width: 1440px) {
            body main .leftbar .content-icon h3 {
              font-size: 18px;
              line-height: 22px; } }
          @media screen and (max-width: 1300px) {
            body main .leftbar .content-icon h3 {
              font-size: 18px;
              line-height: 22px; } }
          @media screen and (max-width: 1024px) {
            body main .leftbar .content-icon h3 {
              font-size: 18px;
              line-height: 22px; } }
          @media screen and (max-height: 640px) {
            body main .leftbar .content-icon h3 {
              font-size: 18px;
              line-height: 22px; } }
        body main .leftbar .content-icon p {
          color: #000000;
          font-family: "RobotoSlab-Light";
          font-size: 16px;
          line-height: 19.2px;
          font-weight: normal; }
          @media screen and (max-width: 1440px) {
            body main .leftbar .content-icon p {
              font-size: 16px;
              line-height: 19.2px; } }
          @media screen and (max-height: 640px) {
            body main .leftbar .content-icon p {
              font-size: 14px;
              line-height: 19.2px; } }
          @media screen and (max-height: 570px) {
            body main .leftbar .content-icon p {
              font-size: 12px;
              line-height: 18px; } }
          @media screen and (max-width: 1300px) {
            body main .leftbar .content-icon p {
              font-size: 14px;
              line-height: 19.2px; } }
          @media screen and (max-width: 1024px) {
            body main .leftbar .content-icon p {
              font-size: 12px;
              line-height: 19.2px; } }
    body main .content-map {
      height: 100%;
      -webkit-box-flex: 1;
      -ms-flex: 1;
      flex: 1;
      padding-right: 8%;
      padding-left: 3%;
      position: relative; }
      @media screen and (max-height: 630px) {
        body main .content-map {
          padding-left: 2%;
          padding-right: 1%; } }
      @media screen and (max-width: 1600px) {
        body main .content-map {
          padding-left: 2%;
          padding-right: 4%; } }
      @media screen and (max-width: 1300px) {
        body main .content-map {
          padding-left: 15px;
          padding-right: 15px; } }
      body main .content-map svg {
        height: 100%; }
        body main .content-map svg .country {
          cursor: pointer; }
        body main .content-map svg .country-title {
          visibility: hidden; }
      body main .content-map .active-overlay {
        width: 100%;
        height: 100%;
        position: absolute;
        display: none;
        top: 0;
        left: 0; }
    body main .last-update {
      position: absolute;
      right: 15px;
      bottom: 10px;
      font-size: 12px; }

.mtb {
  margin-top: 120px; }

.mtm {
  margin-top: 60px; }

.mts {
  margin-top: 20px; }