body {
  background: #111111;
  margin: 0;
  color: #111111;
  font-family: 'Source Sans Pro', sans-serif;
}

.black {
  color: #111111;
}
.white {
  color: #ffffff;
}
.orange {
  color: #e84e19;
}

.scene {
  position: relative;
  overflow: hidden;
}
.scene.black {
  background-color: #333333;
}
.scene.white {
  background-color: #ffffff;
}
.scene.orange {
  background-color: #e84e19;
}

.layer {
  width: 100%;
  height: 100vh;
}
.layer.background {
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.box {
  position: absolute;
  width: 100%;
  text-align: center;
}
.box div {
  padding: 0px 15px;
}

.font-25 {
  font-size: 25px;
}
.font-35 {
  font-size: 35px;
}
.font-45 {
  font-size: 55px;
}
@media (max-width: 991px) {
  .font-25 {
    font-size: 20px;
  }
}

/*#region page */
.flag.left {
  text-align: left;
}
.flag.right {
  text-align: right;
}
.flag.middle {
  top: 27%;
}
.flag.bottom {
  bottom: 0;
}
.page .flag img {
  width: 150px;
}

.page .icon {
  top: 15%;
  left: 20%;
  width: 25%;
}
.page .icon.right {
  left: 35%;
}
.page .icon img {
  width: 150px;
}
.page .icon.x2 img {
  width: 150px;
}

.page .title {
  top: 7%;
  left: 5%;
  text-align: left;
  width: 50%;
}

.page .text {
  top: 40%;
  left: 5%;
  width: 25%;
  text-align: left;
}
.page .text.right {
  left: 35%;
}
.page .text.full {
  width: 50%;
}

.page .border {
  width: 55px;
  height: 100vh;
  display: block;
  right: -75%;
  position: relative;
}

.page .border.white {  
  background-color: #ffffff;
}

.page .border.orange {  
  background-color: #e84e19;
}

@media (max-width: 991px) {
  .page .flag {
    display: none;
  }
  
  .page .border {
    display: none;
  }

  .page .icon {
    top: 5%;
    left: 0%;
    width: 100%;
  }
  .page .icon.right {
    left: 0%;
  }
  .page .icon img {
    width: 50px;
  }
  .page .icon.x2 img {
    width: 100px;
  }
}

/*#endregion*/

/*#region SCENE 1 */
#scene-1 .logo {
  top: 20%;
}
#scene-1 .logo img {
  width: 300px;
}

#scene-1 .text {
  bottom: 15%;
}

#scene-1 .arrow {
  bottom: 1%;
}
#scene-1 .arrow img {
  width: 75px;
}

@media (max-width: 991px) {
  #scene-1 .logo img {
    width: 225px;
  }

  #scene-1 .text {
    bottom: 17%;
  }

  #scene-1 .arrow img {
    width: 55px;
  }
}
/*#endregion*/

/*#region SCENE 11 */
#scene-11 .logo {
  top: 20%;
}
#scene-11 .logo img {
  width: 300px;
}

#scene-11 .text {
  bottom: 0;
    padding: 15px 10px;
    background-color: #000;
}

#scene-11 .arrow {
  top: 1%;
}
#scene-11 .arrow img {
  width: 75px;
}

@media (max-width: 991px) {
  #scene-11 .logo img {
    width: 225px;
  }

  #scene-11 .arrow img {
    width: 55px;
  }
}
/*#endregion*/

/*#region SCENE 2 */
#scene-2 .image {
  top: 3%;
}
#scene-2 .image img {
  width: 650px;
}
#scene-2 .text {
  top: 41%;
}
#scene-2 .text div {
  margin: auto;
  width: 500px;
}
@media (max-width: 991px) {
  #scene-2 .image {
    display: none;
  }
  #scene-2 .image {
    top: 35%;
  }
  #scene-2 .text div {
    width: 360px;
  }
}
/*#endregion*/