/* CSS Document */
body, html {
  font-family: "Bricolage Grotesque", sans-serif;
  font-optical-sizing: auto;
  max-width: 100vw;
  overflow-x: hidden;
  position: relative;
  color: #9f9fa7; }

body {
  opacity: 0;
  transition: opacity .7s ease; }

tooltip {
  visibility: collapse !important; }

div.ranger {
  display: flex;
  flex-wrap: wrap; }

div.container {
  width: 100%;
  max-width: 100%;
  padding: 0 7%; }

a {
  color: #0cb2e3; }

.bar1, .bar2, .bar3 {
  width: 20px;
  height: 3px;
  background-color: #000;
  margin: 2px 0;
  transition: 0.4s;
  border-radius: 1px; }

/* Rotate first bar */
.change .bar1 {
  -webkit-transform: rotate(-45deg) translate(-2px, 6px);
  transform: rotate(-45deg) translate(-2px, 6px); }

/* Fade out the second bar */
.change .bar2 {
  opacity: 0; }

/* Rotate last bar */
.change .bar3 {
  -webkit-transform: rotate(45deg) translate(-1px, -5px);
  transform: rotate(45deg) translate(-1px, -5px); }

.slick-slide:focus, .slick-slide a {
  outline: none; }

div#menu-sec {
  display: none; }
  div#menu-sec ul {
    display: flex;
    flex-direction: column; }
    div#menu-sec ul li a {
      display: block;
      padding: 10px 0;
      width: 100%;
      text-align: center; }

main#page .container {
  max-width: 100%;
  width: 100%;
  padding: 0 20px; }
main#page section#hero {
  display: flex;
  flex-direction: column;
  padding: 48px 0; }
  main#page section#hero div.container div.col {
    max-width: 570px; }
    main#page section#hero div.container div.col img {
      width: 140px; }
    main#page section#hero div.container div.col h1 {
      color: #45454D;
      font-size: 64px;
      font-weight: 600;
      line-height: 72px;
      margin: 0;
      margin-top: 48px;
      letter-spacing: -2%; }
    main#page section#hero div.container div.col p {
      color: #9f9fa7;
      font-size: 18px;
      font-weight: 400;
      line-height: 30px;
      letter-spacing: -2%; }
  main#page section#hero.dark {
    background-color: #111318; }
    main#page section#hero.dark div.container div.col h1 {
      color: #E2E2E9; }
    main#page section#hero.dark div.container div.col p {
      color: #C4C6D0; }
main#page section#articles {
  display: flex;
  flex-direction: column;
  padding: 48px 0; }
  main#page section#articles div.container h2 {
    font-size: 36px;
    color: #45454D;
    line-height: 44px;
    letter-spacing: -1.75%;
    font-weight: 600; }
  main#page section#articles div.container .ranger {
    width: calc(100% + 18px);
    margin-left: -9px;
    margin-right: -9px; }
    main#page section#articles div.container .ranger .col {
      padding: 0 9px;
      width: 33.3333%; }
      main#page section#articles div.container .ranger .col .tuile {
        border: 1px solid #DCDCE5;
        border-radius: 20px;
        padding: 20px 20px 40px 20px; }
        main#page section#articles div.container .ranger .col .tuile div.img {
          position: relative;
          height: 0;
          padding-bottom: 56%;
          width: 100%;
          border: 1px solid #DCDCE5;
          border-radius: 8px;
          overflow: hidden; }
          main#page section#articles div.container .ranger .col .tuile div.img img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center; }
        main#page section#articles div.container .ranger .col .tuile h3 {
          font-size: 24px;
          color: #45454D;
          font-weight: 600;
          margin: 0 0 8px;
          line-height: 30px;
          letter-spacing: -1.75%; }
        main#page section#articles div.container .ranger .col .tuile p {
          font-size: 16px;
          line-height: 25px;
          letter-spacing: -1%;
          color: #9F9FA7;
          margin: 0; }
        main#page section#articles div.container .ranger .col .tuile .row-term {
          display: flex;
          gap: 8px;
          margin: 18px 0; }
          main#page section#articles div.container .ranger .col .tuile .row-term span {
            border-radius: 8px;
            display: block;
            padding: 5px 10px;
            font-size: 14px;
            line-height: 16px;
            font-weight: 600;
            background-color: rgba(49, 181, 141, 0.2) !important; }
        main#page section#articles div.container .ranger .col .tuile button {
          border: none;
          color: #45454D;
          text-transform: uppercase;
          font-weight: 600;
          font-size: 16px;
          line-height: 18px;
          padding: 0;
          margin: 24px 0 0;
          background-color: transparent; }
  main#page section#articles.dark {
    background-color: #111318; }
    main#page section#articles.dark div.container h2 {
      color: #E2E2E9; }
    main#page section#articles.dark div.container .ranger .col .tuile h3 {
      color: #E2E2E9; }
    main#page section#articles.dark div.container .ranger .col .tuile p {
      color: #C4C6D0; }
    main#page section#articles.dark div.container .ranger .col .tuile button {
      color: #E2E2E9; }
    main#page section#articles.dark div.container .ranger .col .tuile {
      border-color: #282A2F; }
    main#page section#articles.dark div.container .ranger .col .tuile div.img {
      border-color: #282A2F; }

/*# sourceMappingURL=styles.css.map */
