@charset "utf-8";
/* CSS Document */

body {
  margin: 0;
  padding: 0;
}

.content {
  position: relative;
  text-align: center;
  padding: 20px;
  color: #fff;
}

.foreground-image {
  background-image: url("bg/foreground.jpg");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 0;
  opacity: 1;
}

.foreground-image2 {
  background-image: url("bg/foreground2.jpg");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 1;
  opacity: 0;
}

.foreground-image3 {
  background-image: url("bg/foreground3.jpg");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 2;
  opacity: 0;
}

.background-image {
  background-image: url("bg/bg_00.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 1;
  transition: opacity 1s ease-in-out;
}

.background-image2 {
  background-image: url("bg/bg_02.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image3 {
  background-image: url("bg/bg_03.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image4 {
  background-image: url("bg/bg_04.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image5 {
  background-image: url("bg/bg_05.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image6 {
  background-image: url("bg/bg_06.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image7 {
  background-image: url("bg/bg_07.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image8 {
  background-image: url("bg/bg_08.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image9 {
  background-image: url("bg/bg_09.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image10 {
  background-image: url("bg/bg_10.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image11 {
  background-image: url("bg/bg_11.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image12 {
  background-image: url("bg/bg_12.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image13 {
  background-image: url("bg/bg_13.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image14 {
  background-image: url("bg/bg_14.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image15 {
  background-image: url("bg/bg_15.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image16 {
  background-image: url("bg/bg_16.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image17 {
  background-image: url("bg/bg_17.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image18 {
  background-image: url("bg/bg_18.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image19 {
  background-image: url("bg/bg_19.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image20 {
  background-image: url("bg/bg_20.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image21 {
  background-image: url("bg/bg_21.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image22 {
  background-image: url("bg/bg_22.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image23 {
  background-image: url("bg/bg_23.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image24 {
  background-image: url("bg/bg_24.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image25 {
  background-image: url("bg/bg_25.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image26 {
  background-image: url("bg/bg_26.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image27 {
  background-image: url("bg/bg_27.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image28 {
  background-image: url("bg/bg_28.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image29 {
  background-image: url("bg/bg_29.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image30 {
  background-image: url("bg/bg_30.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image31 {
  background-image: url("bg/bg_31.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image32 {
  background-image: url("bg/bg_32.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image33 {
  background-image: url("bg/bg_33.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image34 {
  background-image: url("bg/bg_34.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image35 {
  background-image: url("bg/bg_35.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image36 {
  background-image: url("bg/bg_36.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image37 {
  background-image: url("bg/bg_37.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image38 {
  background-image: url("bg/bg_38.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image39 {
  background-image: url("bg/bg_39.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image40 {
  background-image: url("bg/bg_40.png");
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.background-image.show {
  opacity: 1;
}

.background-image2.show {
  opacity: 1;
}

.background-image3.show {
  opacity: 1;
}

.background-image4.show {
  opacity: 1;
}

.background-image5.show {
  opacity: 1;
}

.background-image6.show {
  opacity: 1;
}

.background-image7.show {
  opacity: 1;
}

.background-image8.show {
  opacity: 1;
}

.background-image9.show {
  opacity: 1;
}

.background-image10.show {
  opacity: 1;
}

.background-image11.show {
  opacity: 1;
}

.background-image12.show {
  opacity: 1;
}

.background-image13.show {
  opacity: 1;
}

.background-image14.show {
  opacity: 1;
}

.background-image15.show {
  opacity: 1;
}

.background-image16.show {
  opacity: 1;
}

.background-image17.show {
  opacity: 1;
}

.background-image18.show {
  opacity: 1;
}

.background-image19.show {
  opacity: 1;
}

.background-image20.show {
  opacity: 1;
}

.background-image21.show {
  opacity: 1;
}

.background-image22.show {
  opacity: 1;
}

.background-image23.show {
  opacity: 1;
}

.background-image24.show {
  opacity: 1;
}

.background-image25.show {
  opacity: 1;
}

.background-image26.show {
  opacity: 1;
}

.background-image27.show {
  opacity: 1;
}

.background-image28.show {
  opacity: 1;
}

.background-image29.show {
  opacity: 1;
}

.background-image30.show {
  opacity: 1;
}

.background-image31.show {
  opacity: 1;
}

.background-image32.show {
  opacity: 1;
}

.background-image33.show {
  opacity: 1;
}

.background-image34.show {
  opacity: 1;
}

.background-image35.show {
  opacity: 1;
}

.background-image36.show {
  opacity: 1;
}

.background-image37.show {
  opacity: 1;
}

.background-image38.show {
  opacity: 1;
}

.background-image39.show {
  opacity: 1;
}

.background-image40.show {
  opacity: 1;
}

.midia-container {
  position: fixed;
  top: 55%;
  left: 50.025%;
  transform: translate(-50%, -50%);
  z-index: -2;
}

#video {
  width: 33.6vh;
  height: 74vh;
  object-fit: cover;
}

.background-image,
.background-image2,
.background-image3 {
  /* Estilos para as imagens de fundo */
}

.controller{
	position: fixed;
	left: 20px;
	top: 20px;
	z-index: 10;
}
.controller button{
	margin-bottom: 10px;
}