@font-face {
  font-family: "FilsonProMedium";
  src: url("../../fonts/FilsonProMedium-Medium.woff") format("woff"), url("../../fonts/FilsonProMedium-Medium.woff2") format("woff2"); }

@font-face {
  font-family: "FilsonProLight";
  src: url("../../fonts/FilsonProLight-Light.woff") format("woff"), url("../../fonts/FilsonProLight-Light.woff2") format("woff2"); }

* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

html {
  font-size: 62.5%; }

body {
  margin: 0;
  font-family: 'FilsonProMedium';
  font-size: 1.6rem;
  overflow: hidden;
  position: relative; }
  body p {
    margin: 0; }
  body li {
    list-style: none; }

.homepage {
  height: 100vh;
  width: 100vw;
  position: relative;
  overflow: hidden; }
  @media screen and (max-width: 1024px) {
    .homepage {
      display: none; } }
  .homepage__shoe {
    position: absolute;
    height: auto;
    width: 60%;
    top: 2vh;
    left: -15vw; }
  .homepage video {
    position: absolute;
    right: 0;
    bottom: 0;
    -o-object-fit: cover;
       object-fit: cover;
    min-height: 100%;
    min-width: 100%;
    z-index: -500; }
  .homepage__content {
    padding: 2rem;
    width: 50vw;
    height: 40vh;
    position: absolute;
    top: 10vh;
    right: 10%; }
    .homepage__content h1 {
      margin: 0;
      margin-bottom: 2rem;
      font-size: 10rem;
      color: #fff;
      position: relative; }
      .homepage__content h1::after {
        content: ' ';
        position: absolute;
        top: calc(100%  + 3px);
        left: 10px;
        height: 6px;
        border-radius: 10px;
        width: 30%;
        background: #fff; }
    .homepage__content h3 {
      color: #fff;
      font-size: 3rem;
      margin: 0;
      margin-bottom: 10rem; }
    .homepage__content__links {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex; }
      .homepage__content__links a {
        color: #fff;
        text-decoration: none;
        font-weight: 700; }
      .homepage__content__links > a {
        margin-left: 5rem;
        margin-top: 5rem;
        margin-right: 10rem;
        margin-bottom: 10rem;
        display: block;
        width: 190px;
        height: 190px;
        border: solid #fff 2px;
        -webkit-transition: all .1s linear;
        transition: all .1s linear;
        -webkit-transform: rotate(45deg);
                transform: rotate(45deg);
        -webkit-transform-origin: center;
                transform-origin: center;
        position: relative;
        color: #000;
        background: #fff;
        text-decoration: none; }
        .homepage__content__links > a::before {
          position: absolute;
          content: ' ';
          width: 100%;
          height: 100%;
          border: solid 2px #fff;
          bottom: -15px;
          left: -15px;
          -webkit-transition: all .3s ease-in;
          transition: all .3s ease-in; }
        .homepage__content__links > a:hover::before {
          left: 0;
          bottom: 0; }
        .homepage__content__links > a p {
          width: 100%;
          font-size: 2rem;
          text-align: center;
          position: absolute;
          top: 50%;
          left: 50%;
          -webkit-transform-origin: top left;
                  transform-origin: top left;
          -webkit-transform: rotate(-45deg) translateY(-50%) translateX(-50%);
                  transform: rotate(-45deg) translateY(-50%) translateX(-50%); }
      .homepage__content__links > div.buttons {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column; }
        .homepage__content__links > div.buttons > a {
          display: block;
          border: solid 2px #fff;
          position: relative; }
          .homepage__content__links > div.buttons > a p {
            position: absolute;
            top: 50%;
            left: 50%;
            text-align: center;
            -webkit-transform-origin: top left;
                    transform-origin: top left;
            -webkit-transform: rotate(45deg) translateY(-50%) translateX(-50%);
                    transform: rotate(45deg) translateY(-50%) translateX(-50%); }
        .homepage__content__links > div.buttons .arrow {
          position: absolute;
          left: 16%;
          top: -12%; }
          .homepage__content__links > div.buttons .arrow p {
            position: static;
            color: #fff;
            font-size: 2rem;
            margin-bottom: 1rem; }
          .homepage__content__links > div.buttons .arrow_img {
            width: 80px;
            height: auto; }
        .homepage__content__links > div.buttons a.kickstarter {
          width: 120px;
          height: 120px;
          margin-bottom: 2rem;
          background: #2edd72;
          position: relative;
          -webkit-transition: all .3s ease;
          transition: all .3s ease;
          -webkit-transform: translateX(-70%) rotate(-45deg);
                  transform: translateX(-70%) rotate(-45deg); }
          .homepage__content__links > div.buttons a.kickstarter > img {
            position: absolute;
            top: 50%;
            left: 50%;
            width: 50%;
            height: auto;
            -webkit-transform: translateY(-50%) translateX(-50%) rotate(45deg);
                    transform: translateY(-50%) translateX(-50%) rotate(45deg); }
        .homepage__content__links > div.buttons .socials {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center;
          position: relative;
          -webkit-transform: translateY(-31%) translateX(4%);
                  transform: translateY(-31%) translateX(4%); }
          .homepage__content__links > div.buttons .socials:hover [class^="network"] {
            left: 0; }
          .homepage__content__links > div.buttons .socials a {
            -webkit-transform: rotate(-45deg);
                    transform: rotate(-45deg);
            margin-right: 3rem; }
            .homepage__content__links > div.buttons .socials a:last-child {
              margin-right: 0; }
            .homepage__content__links > div.buttons .socials a:not(.share) {
              -webkit-transition: all .3s ease;
              transition: all .3s ease;
              width: 50px;
              height: 50px;
              border: solid 2px #fff;
              background: #fff;
              position: relative;
              z-index: 1; }
              .homepage__content__links > div.buttons .socials a:not(.share) img:not(.arrow_img) {
                position: absolute;
                top: 50%;
                left: 50%;
                -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
                        transform: translateX(-50%) translateY(-50%) rotate(45deg);
                width: 60%;
                height: auto; }
          .homepage__content__links > div.buttons .socials a.network1 {
            left: -30%; }
          .homepage__content__links > div.buttons .socials a.network2 {
            left: -55%; }
          .homepage__content__links > div.buttons .socials a.network3 {
            left: -80%; }
          .homepage__content__links > div.buttons .socials a.share {
            position: relative;
            width: 100px;
            height: 100px;
            background: #22b7ff;
            display: block;
            border: solid 2px #fff;
            z-index: 5; }
            .homepage__content__links > div.buttons .socials a.share img {
              position: absolute;
              top: 50%;
              left: 50%;
              width: 50%;
              height: auto;
              -webkit-transform: translateY(-50%) translateX(-50%) rotate(45deg);
                      transform: translateY(-50%) translateX(-50%) rotate(45deg); }

.page2 {
  display: none;
  width: 100vw;
  height: 100vh;
  background-image: url(../img/pool.jpg);
  background-position: center;
  background-size: 99.5%;
  display: none; }
  .page2 .bigTitle {
    position: absolute;
    font-size: 13.5rem;
    font-family: 'FilsonProMedium', Arial, sans-serif;
    top: 13%;
    left: 21%; }
  .page2 .firstInfo {
    left: 3%;
    top: 47%; }
  .page2 .secondInfo {
    right: 9%;
    top: 46%; }
  .page2 .firstTitle {
    top: 43%;
    left: 8%; }
  .page2 .secondTitle {
    top: 39%;
    right: 12%; }
  .page2 .sLeft {
    left: 29%;
    bottom: 17%; }
  .page2 .sRight {
    right: 32%;
    bottom: 10%; }
  .page2 .yellowShoe {
    position: absolute;
    top: 21%;
    width: 98%; }

.page3 {
  display: none;
  width: 100vw;
  height: 100vh;
  background-image: url(../img/plage.jpg);
  background-position: center;
  background-size: 100%; }
  .page3 .blueShoe {
    position: absolute;
    top: 20%;
    right: 32%;
    width: 72%;
    -webkit-transform: rotate(20deg);
            transform: rotate(20deg); }
  .page3 .bigAttribute {
    left: 44%; }
  .page3 .firstInfo {
    right: 43%;
    top: 37%; }
  .page3 .secondInfo {
    right: 9%;
    top: 60%; }
  .page3 .firstTitle {
    top: 33%;
    left: 38%; }
  .page3 .secondTitle {
    top: 55%;
    right: 12%; }
  .page3 .sLeft {
    left: 10%;
    bottom: 30%; }
  .page3 .sRight {
    right: 66%;
    bottom: 10%; }

.page4 {
  display: none;
  width: 100vw;
  height: 100vh;
  background-image: url(../img/city_day.jpg);
  background-position: center;
  background-size: 100%; }
  .page4 .greyShoe {
    position: absolute;
    top: 20%;
    right: 30%;
    width: 42%;
    -webkit-transform: rotate(30deg);
            transform: rotate(30deg); }
  .page4 .bigAttribute {
    left: 70%;
    font-size: 10.5rem; }
  .page4 .firstInfo {
    right: 73%;
    top: 42%; }
  .page4 .secondInfo {
    right: 5%;
    top: 67%; }
  .page4 .firstTitle {
    top: 37%;
    left: 8%; }
  .page4 .secondTitle {
    top: 63%;
    right: 12%; }
  .page4 .sLeft {
    left: 36%;
    bottom: 51%; }
  .page4 .sRight {
    right: 34%;
    bottom: 35%; }

.page5 {
  display: none;
  width: 100vw;
  height: 100vh;
  background-image: url(../img/city_night.jpg);
  background-position: center;
  background-size: 100%; }
  .page5 .greyShoe {
    position: absolute;
    top: 16%;
    right: 30%;
    width: 42%;
    -webkit-transform: rotate(29deg);
            transform: rotate(29deg); }
  .page5 .bigAttribute {
    left: 5%;
    bottom: 6%;
    color: white; }
  .page5 .firstInfo {
    right: 73%;
    top: 42%; }
    .page5 .firstInfo p {
      color: white; }
  .page5 .secondInfo {
    right: 3%;
    top: 33%; }
    .page5 .secondInfo p {
      color: white; }
  .page5 .firstTitle {
    top: 37%;
    left: 8%;
    color: white; }
  .page5 .secondTitle {
    top: 28%;
    right: 8%;
    color: white; }
  .page5 .sLeft {
    left: 41%;
    bottom: 50%; }
  .page5 .sRight {
    right: 40%;
    bottom: 40%; }

.page6 {
  display: none;
  width: 100vw;
  height: 100vh;
  background-image: url(../img/montagne.jpeg);
  background-position: center;
  background-size: 100%; }
  .page6 .blackShoe {
    position: absolute;
    top: -29%;
    right: 37%;
    width: 82%;
    -webkit-transform: rotate(2deg);
            transform: rotate(2deg); }
  .page6 .bigAttribute {
    left: 66%;
    bottom: 47%;
    color: white; }
  .page6 .firstInfo {
    right: 41%;
    top: 17%; }
  .page6 .secondInfo {
    right: 7%;
    top: 74%; }
  .page6 .firstTitle {
    top: 13%;
    left: 37%;
    color: white; }
  .page6 .secondTitle {
    top: 69%;
    right: 11%;
    color: white; }
  .page6 .sLeft {
    left: 13%;
    bottom: 61%; }
  .page6 .sRight {
    right: 60%;
    bottom: 21%; }

.page7 {
  display: none;
  width: 100vw;
  height: 100vh;
  background-image: url(../img/forest.jpg);
  background-position: center;
  background-size: 100%; }
  .page7 .greenShoe {
    position: absolute;
    top: 14%;
    right: 32%;
    width: 39%;
    -webkit-transform: rotate(3deg);
            transform: rotate(3deg); }
  .page7 .bigAttribute {
    left: 54%;
    bottom: 55%; }
  .page7 .firstInfo {
    right: 73%;
    top: 40%; }
  .page7 .secondInfo {
    right: 7%;
    top: 74%; }
  .page7 .firstTitle {
    top: 35%;
    left: 9%; }
  .page7 .secondTitle {
    top: 69%;
    right: 11%; }
  .page7 .sLeft {
    left: 30%;
    bottom: 32%; }
  .page7 .sRight {
    right: 37%;
    bottom: 23%; }

.transition {
  position: absolute;
  height: 100vh;
  top: 0;
  right: auto;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 5;
  width: 0;
  color: #fff;
  overflow: hidden; }
  .transition h2 {
    font-size: 4rem;
    position: absolute;
    width: 70%;
    height: 50px;
    white-space: nowrap;
    overflow: hidden;
    top: 50%;
    left: 50%;
    text-align: center;
    -webkit-transform: translateX(-50%) translateY(-50%);
            transform: translateX(-50%) translateY(-50%); }
  .transition.translate {
    -webkit-animation: translate 3s ease-in-out forwards;
            animation: translate 3s ease-in-out forwards; }
  .transition[data-transition="1"] {
    background: url(../img/transitions/spain.jpg); }
  .transition[data-transition="2"] {
    background: url(../img/transitions/beachsteps.jpg); }
  .transition[data-transition="3"] {
    background: url(../img/transitions/hk.jpg); }
  .transition[data-transition="4"] {
    background: url(../img/city_night.jpg); }
  .transition[data-transition="5"] {
    background: url(../img/transitions/rocky-mountains.jpg); }
  .transition[data-transition="6"] {
    background: url(../img/transitions/blackforest.jpg); }
  .transition[data-transition="7"] {
    background: url(../img/transitions/manchester.jpg); }

@-webkit-keyframes translate {
  from {
    width: 0; }
  50% {
    width: 100%;
    left: 0;
    color: #fff; }
  51% {
    width: 100%;
    left: auto;
    right: 0; }
  100% {
    left: auto;
    right: 0;
    width: 0; } }

@keyframes translate {
  from {
    width: 0; }
  50% {
    width: 100%;
    left: 0;
    color: #fff; }
  51% {
    width: 100%;
    left: auto;
    right: 0; }
  100% {
    left: auto;
    right: 0;
    width: 0; } }

.logos {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
  position: fixed;
  top: 5vh;
  padding: 0 1rem;
  left: 0; }
  .logos a {
    display: block;
    text-decoration: none;
    color: #000;
    font-size: 3rem;
    font-family: 'FilsonProMedium'; }
  .logos a.kickstarter {
    width: 80px;
    height: 80px;
    margin-bottom: 2rem;
    background: #2edd72;
    border: solid 2px #fff;
    position: relative;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    -webkit-transform: translateX(-70%) rotate(-45deg);
            transform: translateX(-70%) rotate(-45deg); }
    .logos a.kickstarter > img {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 30%;
      height: auto;
      -webkit-transform: translateY(-50%) translateX(-50%) rotate(45deg);
              transform: translateY(-50%) translateX(-50%) rotate(45deg); }

.squareB {
  -webkit-box-shadow: 0 0 0 rgba(34, 183, 255, 0.6);
          box-shadow: 0 0 0 rgba(34, 183, 255, 0.6);
  position: absolute;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  border: #22b7ff 5px solid;
  width: 100px;
  height: 100px;
  -webkit-animation: blink 1.3s infinite;
          animation: blink 1.3s infinite; }

@-webkit-keyframes blink {
  70% {
    -webkit-box-shadow: 0 0 0 10px rgba(34, 183, 255, 0);
            box-shadow: 0 0 0 10px rgba(34, 183, 255, 0); } }

@keyframes blink {
  70% {
    -webkit-box-shadow: 0 0 0 10px rgba(34, 183, 255, 0);
            box-shadow: 0 0 0 10px rgba(34, 183, 255, 0); } }

.squareW {
  position: relative;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
  border: #FFFFFF 5px solid;
  width: 90px;
  height: 90px; }

.firstInfo {
  position: absolute;
  padding: 1%;
  width: 500px;
  background: rgba(255, 255, 255, 0.6);
  border: #22b7ff 5px solid;
  display: none; }
  .firstInfo p {
    text-align: center;
    font-size: 1.9rem;
    font-family: 'FilsonProLight', Arial, sans-serif; }

.secondInfo {
  position: absolute;
  padding: 1%;
  width: 500px;
  background: rgba(255, 255, 255, 0.6);
  border: #22b7ff 5px solid;
  display: none; }
  .secondInfo p {
    text-align: center;
    font-size: 1.9rem;
    font-family: 'FilsonProLight', Arial, sans-serif; }

.littleAttribute {
  position: absolute;
  margin: 0;
  font-size: 3rem;
  font-family: 'FilsonProLight', Arial, sans-serif; }

.bigAttribute {
  margin: 0;
  position: absolute;
  font-family: 'FilsonProMedium';
  font-size: 13.5rem; }

.next-page {
  position: fixed;
  color: #000;
  background: #fff;
  bottom: 50px;
  left: 50%;
  display: block;
  width: 110px;
  height: 110px;
  z-index: 999;
  border: solid 2px #fff;
  -webkit-transform: translateX(-50%) rotate(45deg);
          transform: translateX(-50%) rotate(45deg); }
  .next-page::before {
    position: absolute;
    content: ' ';
    width: 100%;
    height: 100%;
    border: solid 2px #fff;
    bottom: -15px;
    left: -15px;
    -webkit-transition: all .3s ease-in;
    transition: all .3s ease-in; }
  .next-page:hover::before {
    left: 0;
    bottom: 0; }
  .next-page p {
    width: 100%;
    padding: 0 5px;
    font-size: 1.8rem;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-transform: rotate(-45deg) translateY(-50%) translateX(-50%);
            transform: rotate(-45deg) translateY(-50%) translateX(-50%); }

.about {
  position: absolute;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  display: none;
  padding: 3rem; }
  .about__title {
    font-family: "FilsonProMedium", sans-serif;
    font-size: 6rem;
    font-weight: 700;
    text-align: left;
    margin-top: 0;
    height: 10%; }
  .about__content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 80%; }
    .about__content__map {
      width: 15%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: end;
          -ms-flex-align: end;
              align-items: flex-end;
      height: 90%;
      position: relative; }
      .about__content__map > div {
        width: 100%;
        text-align: center; }
      .about__content__map img {
        width: 90%; }
      .about__content__map p {
        margin-bottom: 2rem; }
      .about__content__map .map-line {
        width: 2px;
        height: 182px;
        background: #22b7ff;
        position: absolute;
        z-index: 5;
        left: 50%;
        -webkit-transform: translateX(-50%);
                transform: translateX(-50%);
        bottom: calc(20% + 20px); }
      .about__content__map .map-pin {
        width: 40px;
        height: 40px;
        background: #22b7ff;
        position: absolute;
        bottom: 20%;
        left: 50%;
        border-radius: 100px;
        -webkit-transform: translateX(-50%);
                transform: translateX(-50%); }
    .about__content__column {
      position: relative;
      width: 25%;
      margin-right: 3%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      height: 90%; }
      .about__content__column:last-child {
        margin-right: 0; }
      .about__content__column img {
        position: absolute;
        width: 100%;
        height: auto; }
      .about__content__column:nth-child(even) {
        -webkit-box-align: end;
            -ms-flex-align: end;
                align-items: flex-end; }
        .about__content__column:nth-child(even) img {
          top: -7%;
          left: 0;
          width: 110%;
          height: 66%;
          -o-object-fit: cover;
             object-fit: cover;
          border: solid 10px #fff;
          z-index: 3; }
      .about__content__column:nth-child(odd) {
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start; }
        .about__content__column:nth-child(odd) img {
          bottom: 16%;
          left: -10%;
          width: 120%;
          height: 50%;
          -o-object-fit: cover;
             object-fit: cover;
          border: solid 10px #fff;
          z-index: 2;
          border-bottom: 0; }
      .about__content__column:last-child img {
        left: -10%;
        width: 130%;
        height: 50%;
        -o-object-fit: cover;
           object-fit: cover;
        border: solid 10px #fff;
        z-index: 1;
        border-bottom: 0; }
      .about__content__column h3 {
        font-size: 3rem;
        margin-top: 0;
        margin-bottom: 2rem;
        position: relative; }
        .about__content__column h3::after {
          content: ' ';
          position: absolute;
          left: 0;
          top: calc(100% + 3px);
          height: 2px;
          width: 100px;
          background: #000; }
  .about .next-page {
    border-color: #22b7ff;
    margin: 0 auto;
    color: #fff;
    background: #22b7ff; }
    .about .next-page::before {
      border-color: #22b7ff; }

.responsive {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: url(../img/video_poster.jpg);
  background-size: cover;
  display: none; }
  @media screen and (max-width: 1024px) {
    .responsive {
      display: block; } }
  .responsive img {
    position: absolute;
    z-index: 0;
    width: 100%;
    height: auto;
    top: 5vh;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%); }
  .responsive h1 {
    font-family: "FilsonProMedium", sans-serif;
    font-size: 4rem;
    text-align: center;
    color: #fff;
    margin: 10rem auto 5rem;
    position: relative;
    width: 60%;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    z-index: 5; }
    .responsive h1::after {
      content: ' ';
      position: absolute;
      width: 30%;
      height: 3px;
      top: calc(100% + 3px);
      left: 0;
      background: #fff; }
  .responsive p {
    color: #fff;
    font-size: 1.8rem;
    text-align: center;
    position: relative;
    z-index: 5; }
    .responsive p:last-of-type {
      margin-bottom: 5rem; }
  .responsive .kickstarter {
    width: 100px;
    height: 100px;
    background: #2edd72;
    border: solid 2px #fff;
    margin: 0 auto;
    display: block;
    position: relative;
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg); }
    .responsive .kickstarter img {
      width: 70%;
      height: auto;
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
              transform: translateX(-50%) translateY(-50%) rotate(45deg); }
  .responsive h3 {
    color: #fff;
    font-size: 1.8rem;
    text-align: center;
    margin-top: 2.5rem; }
  .responsive div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 80%;
    margin: 0 auto;
    margin-top: 5rem; }
    .responsive div a {
      display: block;
      width: 70px;
      height: 70px;
      background: #fff;
      -webkit-transform: rotate(-45deg);
              transform: rotate(-45deg);
      position: relative; }
      .responsive div a img {
        width: 70%;
        height: auto;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
                transform: translateX(-50%) translateY(-50%) rotate(45deg); }

.endpage {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: url(../img/end.jpg);
  background-size: cover;
  display: none; }
  .endpage h2, .endpage h3 {
    text-align: center;
    color: #fff; }
  .endpage h2 {
    font-size: 5rem; }
  .endpage h3 {
    font-size: 4rem; }
  .endpage .kickstarter {
    width: 100px;
    height: 100px;
    background: #2edd72;
    border: solid 2px #fff;
    margin: 0 auto;
    display: block;
    position: relative;
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg); }
    .endpage .kickstarter img {
      width: 70%;
      height: auto;
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
              transform: translateX(-50%) translateY(-50%) rotate(45deg); }
  .endpage div.socials {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 60%;
    margin: 0 auto;
    margin-top: 5rem; }
    .endpage div.socials a {
      display: block;
      width: 70px;
      height: 70px;
      background: #fff;
      -webkit-transform: rotate(-45deg);
              transform: rotate(-45deg);
      position: relative; }
      .endpage div.socials a img {
        width: 70%;
        height: auto;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
                transform: translateX(-50%) translateY(-50%) rotate(45deg); }