@font-face {
  font-family: "futura-bold";
  src: url("futura-bold.woff2") format("woff2");
}

:root {
  --w: 300px;
  --h: 250px;
}

* {
  font-family: "futura-bold";
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-weight: normal;
  outline: none;
  text-rendering: optimizeLegibility !important;
  -webkit-font-smoothing: antialiased !important;
  -webkit-text-size-adjust: 100%;
  text-decoration: none;
  overflow: hidden;
}

html, body, p, a {
  color: #000;
  font-size: 16px;
}

.slide {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.title {
  opacity: 0;
  position: absolute;
  bottom: 20px;
  left: 20px;
  font-size: 32px;
  color: white;
  text-shadow: 5px 5px 5px rgba(0,0,0,0.5);
}

#slide4, #slide6 {
  color: white;
  text-align: center;
  background-color: #D90725;
}

  #slide4 #logo {
    width: 200px;
    padding: 20px;
  }

  #slide4 .message {
    font-size: 40px;
  }
  #slide4 .message .big{
    font-size: 60px;
  }
  #slide6{
    padding-top:30px;
  }
  #slide6 .message {
    font-size: 30px;
    line-height: 60px;
  }

.message .text {
  opacity: 0;
}

#slide5 {
  color: #000;
  text-align: center;
  background-color: #fff;
  padding:20px;
}

  #slide5 .message {
    font-size: 26px;
    line-height: 1.2;
    margin-bottom:30px;
  }

  #slide5 img {
    height: 50%;
    padding: 20px;
  }

#slide7 .left {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  height: 30%;
  background-color: #D90725;
  display: flex;
  align-items: center;
  justify-content: center;
}

  #slide7 .left img {
    width: 40%;
  }


#slide7 .right {
  position: absolute;
  left: 0;
  top: 30%;
  right: 0;
  bottom: 0;
  width: var(--w);
  background-color: #D90725;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #000;
  background-color: #fff;
}

#slide7 .text{
  text-align:center;
  font-size:30px;
  line-height:1.1;
}

#slide7 .url {
  color: #D90725;
  text-align: center;
  font-size: 15px;
  padding-top: 20px;
  width: var(--w);
}

#stage {
  border: 1px solid rgb(43, 46, 107);
  position: relative;
  width: var(--w);
  height: var(--h);
  cursor: pointer;
  overflow: hidden;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  background-color: #000;
}

#preloader {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10000;
  background: #fff;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
}

  #preloader img {
    width: 50px;
  }