*,
    *::before,
    *::after {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      text-decoration: none;
      font-family: 'Roboto', sans-serif;
    }

    body {
      margin: 0;
      font-family: Helvetica, sans-serif;
      /* background-color: #b8b8b8; */
      overflow: hidden;

      background: #E8E5E5;
      /* background: rgb(137,175,204);
        background: linear-gradient(360deg, rgba(137,175,204,1) 0%, rgba(236,241,255,1) 100%); */
    }

    body,
    html {
      overflow-x: hidden !important;
      scroll-behavior: smooth;
    }



    .frank-ruhl-libre-titulo {
      font-family: "Frank Ruhl Libre", serif;
      font-optical-sizing: auto;
      font-weight: 600;
      font-style: normal;
    }






    @keyframes opacity {
      0% {
        opacity: 0;
        filter: blur(15px) opacity(0.5);
      }

      100% {
        opacity: 1;
        filter: blur(0px) opacity(1);
      }
    }

    @keyframes fade-uppp {
      0% {
        opacity: 0;
        transform: translateY(50px);

        filter: blur(15px) opacity(0.5);
      }

      100% {
        opacity: 1;
        transform: translateY(0px);

        filter: blur(0px) opacity(1);
      }
    }

    @keyframes fade-up {
      0% {
        opacity: 0;
        transform: translateY(150px) scale(0.95);

        filter: blur(15px) opacity(0.5);
      }

      100% {
        opacity: 1;
        transform: translateY(0px) scale(1);

        filter: blur(0px) opacity(1);
      }
    }

    @keyframes fade-down {
      0% {
        opacity: 0;
        transform: translateY(-200px) scale(1);

        filter: blur(15px) opacity(0.5);

      }

      100% {
        opacity: 1;
        transform: translateY(0px) scale(1);

        filter: blur(0px) opacity(1);

      }
    }

    @keyframes rotate1 {
      0% {
        transform: rotate(0deg);
      }

      100% {
        transform: rotate(360deg);
      }
    }

    @keyframes rotate2 {
      0% {
        transform: rotate(0deg);
      }

      100% {
        transform: rotate(-360deg);
      }
    }






    /* a {
        color: #000;

        color: #fff;
        mix-blend-mode: difference;
      } */

    /* header */

    .header {
      background: rgb(255, 255, 255);
      /* background: linear-gradient(360deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5) 99%); */
      /* box-shadow: 1px 1px 4px 0 rgba(0,0,0,.1); */
      position: fixed;
      width: 100%;
      z-index: 9999;

      animation: fade-down 3s;
      animation-timing-function: cubic-bezier(.22, .61, .36, 1);

      transition: all 300ms ease-in-out;
    }

    .header ul {
      margin: 0;
      padding: 0;
      list-style: none;
      overflow: hidden;
    }

    .header li a {
      display: block;
      padding: 20px 20px;
      /* border-right: 1px solid rgba(29, 29, 29, 0.2); */
      text-decoration: none !important;
      cursor: pointer;

      color: #000000;
      /* mix-blend-mode: difference; */
      z-index: 1234;

    }


    /* .header li a:hover,
      .header .menu-btn:hover {
        background-color: rgba(29, 29, 29, 0.2);
      } */

    .header .logo {
      display: block;
      float: left;
      font-size: 2em;
      padding: 10px 50px;
      text-decoration: none;

    }

    .header .logo h1 {
      color: #000000;
      font-family: "Frank Ruhl Libre", serif;
      font-weight: 600;
      transition: all 0.5s ease-out;
      /* font-stretch: 200%; */
      transform: scaleX(1.7);
      transform-origin: 0 0;
      font-size: 4vh;
      letter-spacing: 2px;

    }

    .header .logo:hover h1 {
      color: #3F59A4;
      /* font-stretch: 200%; */
      transform: scaleX(2);
      transform-origin: 0 0;
      font-size: 4vh;

    }



    /* menu */

    .header .menu {
      clear: both;
      max-height: 0;
      transition: max-height .2s ease-out;


    }

    .header a p {
      font-family: "Frank Ruhl Libre", serif;
      font-weight: 400;
      transition: all 0.5s ease-out;
      letter-spacing: 1px;
      font-size: 2.2vh;
    }

    .header li:hover a p {
      font-weight: 600;
      color: #3F59A4;

    }



    /* menu icon */

    .header .menu-icon {
      cursor: pointer;
      display: inline-block;
      float: right;
      padding: 28px 20px;
      position: relative;
      user-select: none;
    }

    .header .menu-icon .navicon {
      background: #333;
      display: block;
      height: 2px;
      position: relative;
      transition: background .2s ease-out;
      width: 18px;
    }

    .header .menu-icon .navicon:before,
    .header .menu-icon .navicon:after {
      background: #333;
      content: '';
      display: block;
      height: 100%;
      position: absolute;
      transition: all .2s ease-out;
      width: 100%;
    }

    .header .menu-icon .navicon:before {
      top: 5px;
    }

    .header .menu-icon .navicon:after {
      top: -5px;
    }

    /* menu btn */

    .header .menu-btn {
      display: none;
    }

    .header .menu-btn:checked~.menu {
      max-height: 240px;

      background: rgb(255, 255, 255);
      /* background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 99%); */

    }

    .header .menu-btn:checked~.menu-icon .navicon {
      background: transparent;
    }

    .header .menu-btn:checked~.menu-icon .navicon:before {
      transform: rotate(-45deg);
    }

    .header .menu-btn:checked~.menu-icon .navicon:after {
      transform: rotate(45deg);
    }

    style.css .header .menu-btn:checked~.menu-icon:not(.steps) .navicon:before,
    .header .menu-btn:checked~.menu-icon:not(.steps) .navicon:after {
      top: 0;
    }

    /* 48em = 768px */

    @media (min-width: 48em) {
      .header li {
        float: left;
      }

      .header li a {
        padding: 20px 50px;
      }

      .header .menu {
        clear: none;
        float: right;
        max-height: none;

      }

      .header .menu-icon {
        display: none;
      }



    }









    /* Entrada */

    /* .entrada{
        height: 100vh;
        width: 100%;
      }

      .entrada img {
        width: 100%;
        height: fit-content;

        overflow: hidden;
      } */

    /* 
      .outer-container {
	max-width: 600px;
	margin: auto;
	width: 90%;
	padding: 200px 0px;
	position: relative;
}

.image-container {
	padding-bottom: (1/1) * 100%;
	background: black;
	position: relative;
	overflow: hidden;
	z-index: 2;
	background-size: cover;
	background-position: center;
}

.section-title {
	margin: 0;
	font-size: 64px;
	width: 100%;
	text-align: center;
	position: absolute;
	top: 50%;
	left: -30%;
	transform: translateY(-50%);
	z-index: 1;
	white-space: nowrap;

	&.on-dark {
		color: white;
	}

	span {
		position: relative;
		display: block;
	}
} */





    .entrada {
      width: 100vw;
      height: 90vh;
      display: flex;
      float: left;
      flex-direction: row;

      white-space: nowrap;

    }

    .leftside {
      height: 100vh;
      width: 90vw;
      white-space: nowrap;
      padding-top: 10%;
      z-index: 2;
      position: absolute;

      padding-left: 50px;
    }

    .rightside {
      height: 100vh;
      width: 100vw;
      white-space: nowrap;
      /* padding-top: 7%; */
      z-index: 1;
      position: relative;
      right: -20vw;
    }





    .text-box {
      min-height: 240px;

      animation: fade-up 1.5s;
      animation-timing-function: cubic-bezier(.22, .61, .36, 1);

    }

    .text-box h1 {
      font-size: 8.5vw;
      line-height: 8vw;

      color: #3F59A4;
      font-family: "Frank Ruhl Libre", serif;
      font-weight: 600;
      letter-spacing: 2px;

      -webkit-filter: drop-shadow(0px 0px 4px #2b2b2b2c);
      filter: drop-shadow(0px 0px 4px #2b2b2b2c);
    }

    .auto-input {
      color: #000000;
      font-family: "Frank Ruhl Libre", serif;
      font-weight: 600;
      letter-spacing: -3px;
    }

    .little-text-box p {
      font-size: 1.2vw;
      line-height: 1.5vw;
      font-weight: 350;
      animation: fade-up 3s;
      animation-timing-function: cubic-bezier(.22, .61, .36, 1);

      padding-top: 20px;
    }





    /* button */
    .book-link {
      margin: 50px 0 0 0;
      padding: 0;
      border: 0;
      font-size: 3vw;
      line-height: 1;
      color: #000000;
      letter-spacing: 0.25px;
      text-transform: uppercase;
      /* font-family: "Extenda Trial 20 Micro"; */
      font-weight: 300;
      font-style: normal;
      display: inline-flex;
      align-items: center;
      gap: 28px;
      position: relative;
      text-decoration: none;


      animation: fade-up 3s;
      animation-timing-function: cubic-bezier(.22, .61, .36, 1);
    }

    .book-link .linktext {
      position: relative;
      overflow: hidden;
      display: inline-block;
    }

    .book-link .linktext::before {
      position: absolute;
      content: "";
      left: 0;
      bottom: 0px;
      width: 100%;
      height: 1.5px;
      background-color: #000000;
      transform: scaleX(1);
      transition: transform 250ms ease-in-out;
      transform-origin: 0 0;
    }

    .book-link:hover .linktext:before {
      transform: scaleX(0);
      transform-origin: 100% 100%;
    }

    .book-link .arrow {
      height: 36px;
      width: 36px;
      top: -5px;
      display: inline-block;
      position: relative;
      overflow: hidden;
    }

    .book-link .arrow::before,
    .book-link .arrow::after {
      position: absolute;
      content: "";
      background-color: #223A8F;
      transition: all ease-in-out 0.35s;
      transform-origin: 0 0;
      border-radius: 30px;
    }

    .book-link .arrow::before {
      height: 2px;
      width: 100%;
      top: 0;
      right: 0;
    }

    .book-link .arrow::after {
      width: 2px;
      height: 100%;
      top: 0;
      right: 0;
    }

    .book-link:hover .arrow::before {
      width: 65%;
    }

    .book-link:hover .arrow::after {
      height: 65%;
    }

    .book-link .arrow span {
      background-color: #223A8F;
      height: 2px;
      width: 100%;
      display: inline-block;
      transform: rotate(-45deg) translate(-3px, -1px);
      transform-origin: right top;
      border-radius: 30px;
      position: relative;
      transition: all ease-in-out 0.35s;
      position: absolute;
      top: 0;
      left: 0;
    }

    .book-link .arrow span::before {
      background-color: #223A8F;
      content: "";
      height: 100%;
      width: 15px;
      left: -15px;
      top: 0;
      position: absolute;
    }






















    .container {
      display: flex;
      justify-content: center;
      height: 100%;
      opacity: 1;
      transition: all ease-in-out 2s;

      animation: fade-down 1.5s;
      animation-timing-function: cubic-bezier(.22, .61, .36, 1);

      overflow-x: visible;
    }

    #scene {
      position: relative;
      width: fit-content;
      height: fit-content;





      .img-1,
      .img-2,
      .img-3 {
        position: absolute;
      }

      .img-3 {
        background-image: url(imgs/barcosvg.svg);
        background-position: center;
        width: 600px;
        height: 600px;
        background-size: contain;
        background-repeat: no-repeat;

        color: #000000;
        margin: 25px 25px;
        opacity: 0.95;

      }

      .img-2 {
        background-image: url(imgs/nomesvg.svg);
        background-position: center;
        width: 650px;
        height: 650px;
        background-size: contain;
        background-repeat: no-repeat;

        filter: blur(0.6px);
        fill: green;

        animation: rotate2 50s infinite linear;

        -webkit-filter: drop-shadow(0px 0px 4px #6666);
        filter: drop-shadow(0px 0px 4px #6666669d);
      }

      .img-1 {
        background-image: url(imgs/cordasvg.svg);
        background-position: center;
        width: 750px;
        height: 750px;
        background-size: contain;
        background-repeat: no-repeat;

        margin: -45px -45px;
        animation: rotate1 20s infinite linear;

        filter: blur(.8px);
        /* 
  -webkit-filter: drop-shadow(0px 0px 4px #6666);
  filter: drop-shadow(0px 0px 4px #6666);   */

      }
    }












    section {
      width: 100vw;
      min-height: 100vh;
      padding: 100px 0px;
      animation: opacity 3s;

    }

    .titulo h1 {
      font-size: 3.2vw;
      color: #000000;
      font-family: "Frank Ruhl Libre", serif;
      font-weight: 400;
      letter-spacing: -1px;
      margin-bottom: 15px;

      padding: 0px 50px;

    }

    .titulo p {
      font-size: 1.2vw;
      line-height: 1.5vw;
      font-weight: 350;
      margin-bottom: 25px;

      padding: 0px 50px;
    }




    .maps {
      width: 100%;
      height: 70vh;

      padding: 0px 50px;
    }













    .scroll {
      position: relative;
      display: flex;
      justify-content: center;
      width: 100%;
      overflow: hidden;
      /* -webkit-mask-image: linear-gradient(90deg, transparent, #fff 20%, #fff 80%, transparent); */
    }

    .scroll div {
      white-space: nowrap;
      animation: scroll var(--time) linear infinite;
      animation-delay: calc(var(--time)*-1);

    }

    .scroll div:nth-child(2) {
      animation: scroll2 var(--time) linear infinite;
      animation-delay: calc(var(--time)/-2);
    }

    @keyframes scroll {
      0% {
        transform: translateX(100%);
      }

      100% {
        transform: translateX(-100%);
      }
    }

    @keyframes scroll2 {
      0% {
        transform: translateX(0);
      }

      100% {
        transform: translateX(-200%);
      }
    }



    .imgBox div {
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .imgBox img {
      max-width: 100px;
      scale: 0.8;
    }
















    @keyframes slide {
      from {
        transform: translateX(0);
      }

      to {
        transform: translateX(-100%);
      }
    }

    .logos {
      margin-top: 15vh;
      overflow: hidden;
      padding: 60px 0;
      /* background: white; */
      white-space: nowrap;
      position: relative;
    }

    .logos:before,
    .logos:after {
      position: absolute;
      top: 0;
      width: 50%;
      height: 100%;
      content: "";
      z-index: -2;
    }

    .logos:before {
      right: 0;
      background: linear-gradient(to left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.7));
    }

    .logos:after {
      left: 0;
      background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.7));
    }

    /* .logos:hover .logos-slide {
  animation-play-state: paused;
} */

    .logos-slide {
      display: inline-block;
      animation: 35s slide infinite linear;
    }

    .logos-slide img {
      height: 140px;
      margin: 0 40px;
    }



























    /* 

.slidershow{
  width: 90vw;
  height: 80vh;
  overflow: hidden;
}
.middle{
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}
.navigation{
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
}
.bar{
  width: 50px;
  height: 10px;
  border: 2px solid #fff;
  margin: 6px;
  cursor: pointer;
  transition: 0.4s;
}
.bar:hover{
  background: #fff;
}

input[name="r"]{
    position: absolute;
    visibility: hidden;
}

.slides{
  width: 500%;
  height: 100%;
  display: flex;
}

.slide{
  width: 20%;
  transition: 0.6s;
}
.slide img{
  width: 100%;
  height: auto;
}

#r1:checked ~ .s1{
  margin-left: 0;
}
#r2:checked ~ .s1{
  margin-left: -20%;
}
#r3:checked ~ .s1{
  margin-left: -40%;
}
#r4:checked ~ .s1{
  margin-left: -60%;
}
#r5:checked ~ .s1{
  margin-left: -80%;
}
 */







.textosobre{
  display: flex;

}

.textosobre p {
  width: 50%;
  
}




















    /* 
 ol,ul{list-style:none}
 table{border-collapse:collapse;border-spacing:0} */
    /* q,blockquote{quotes:none} */
    /* q:before,q:after,blockquote:before,blockquote:after{content:"";content:none} */
    /* a img{border:none} */
    article {
      display: block
    }

    #slider {
      text-align: center
    }

    /* label,a{color:brown;cursor:pointer;text-decoration:none;font-style:italic} */
    /* label:hover,a:hover{color:#ddd!important} */
    /* *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box} */
    /* label,
    #active,
    img {
      -moz-user-select: none;
      -webkit-user-select: none
    } */

    .catch {
      display: block;
      height: 0;
      overflow: hidden
    }

    #slider {
      margin: 0 auto
    }

     input {
      display: none
    } 

    #slide1:checked~#slides .inner {
      margin-left: 0
    }

    #slide2:checked~#slides .inner {
      margin-left: -100%
    }

    #slide3:checked~#slides .inner {
      margin-left: -200%
    }

    #slide4:checked~#slides .inner {
      margin-left: -300%
    }

    #slide5:checked~#slides .inner {
      margin-left: -400%
    }

    article img {
      width: 100%;
    }

    #slides .inner {
      width: 500%;
      line-height: 0;
    }

    #slides article {
      width: 20%;
      float: left;
    }

    #commands {
      margin: -25% 0 0 0;
      width: 100%;
      height: 50px;
    }

    #commands label {
      display: none;
      width: 80px;
      height: 80px;
      opacity: 0.5;
    }

    #commands label:hover {
      opacity: 0.8;
    }

    #active {
      position: relative;
      z-index: 5;
      margin: 16% 0 0;
      text-align: center;
    }

    #active label {
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      border-radius: 5px;
      display: inline-block;
      width: 10px;
      height: 10px;
      background: #bbb;
    }

    #active label:hover {
      background: #333;
      border-color: #777 !important;
    }

    #slide1:checked~#commands label:nth-child(2),
    #slide2:checked~#commands label:nth-child(3),
    #slide3:checked~#commands label:nth-child(4),
    #slide4:checked~#commands label:nth-child(5),
    #slide5:checked~#commands label:nth-child(1) {
      background: url('imgs/right-arrow.png') no-repeat;
      float: right;
      margin: 0 18px 0 0;
      display: block;
    }

    #slide1:checked~#commands label:nth-child(5),
    #slide2:checked~#commands label:nth-child(1),
    #slide3:checked~#commands label:nth-child(2),
    #slide4:checked~#commands label:nth-child(3),
    #slide5:checked~#commands label:nth-child(4) {
      background: url('imgs/left-arrow.png') no-repeat;
      float: left;
      margin: 0 0 0 35px;
      display: block;
    }

    #slide1:checked~#active label:nth-child(1),
    #slide2:checked~#active label:nth-child(2),
    #slide3:checked~#active label:nth-child(3),
    #slide4:checked~#active label:nth-child(4),
    #slide5:checked~#active label:nth-child(5) {
      background: #000;
      opacity: 0.6;
      border-color: #fff !important;
      border: 2px solid #fff;
    }

    .caption {
      line-height: 20px;
      margin: 0 0 -150%;
      position: absolute;
      padding: 320px 12px;
      opacity: 0;
      color: #fff;
      text-transform: none;
      text-align: left;
      font-size: 18px;
    }

    .caption bar {
      display: inline-block;
      padding: 10px;
      background: #000;
      border-radius: 3px 3px 3px 3px;
      -moz-border-radius: 3px 3px 3px 3px;
      -webkit-border-radius: 3px 3px 3px 3px;
      opacity: 0.7;
      filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);
    }

    #slides {
      position: relative;
      padding: 2px;
      margin: 45px 0 0;
    }

    #slides .inner {
      -webkit-transform: translateZ(0);
      -webkit-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
      -moz-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
      -ms-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
      -o-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
      transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
      -webkit-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
      -moz-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
      -ms-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
      -o-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
      transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000)
    }

    #slider {
      -webkit-transform: translateZ(0);
      -webkit-transition: all 0.5s ease-out;
      -moz-transition: all 0.5s ease-out;
      -o-transition: all 0.5s ease-out;
      transition: all 0.5s ease-out
    }

    #commands label {
      -webkit-transform: translateZ(0);
      -webkit-transition: opacity 0.2s ease-out;
      -moz-transition: opacity 0.2s ease-out;
      -o-transition: opacity 0.2s ease-out;
      transition: opacity 0.2s ease-out
    }

    #slide1:checked~#slides article:nth-child(1) .caption,
    #slide2:checked~#slides article:nth-child(2) .caption,
    #slide3:checked~#slides article:nth-child(3) .caption,
    #slide4:checked~#slides article:nth-child(4) .caption,
    #slide5:checked~#slides article:nth-child(5) .caption {
      opacity: 1;
      -webkit-transition: all 1s ease-out 0.6s;
      -moz-transition: all 1s ease-out 0.6s;
      -o-transition: all 1s ease-out 0.6s;
      transition: all 1s ease-out 0.6s
    }

    #commands,
    #commands label,
    #slides,
    #active,
    #active label {
      -webkit-transform: translateZ(0);
      -webkit-transition: all 0.5s ease-out;
      -moz-transition: all 0.5s ease-out;
      -o-transition: all 0.5s ease-out;
      transition: all 0.5s ease-out
    }

    article {
      display: block;
      position: relative;
      transform: translate(0%, -25%);
    }

    article img {
      width: 100%;
    }



    #container {
      width: 100%;
      overflow: hidden;
      height: 80vh;
    }

    #slider {
      max-width: 100%;
      padding: 0 50px;

      max-height: 80vh;

      margin-bottom: 50px;
    }


    @media only screen and (max-width:850px) and (min-width:450px) {
      #slider #commands {
        margin: -50% 0 0 -5%;
        width: 100%;
        height: 70px;
        position: absolute;
      }

      #slider #commands label {
        -moz-transform: scale(0.9);
        -webkit-transform: scale(0.9);
        -o-transform: scale(0.9);
        -ms-transform: scale(0.9);
        transform: scale(0.9)
      }

      #slider #slides .caption {
        padding: 280px 12px
      }

      #slider #slides {
        padding: 2px 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0
      }

      #slider #active {
        margin: 15% 0 0;
        display: none;
      }

      #slider {
        padding: 0 20px;
      }

    }

    @media only screen and (max-width:450px) {
      #slider #commands {
        margin: -80% 0 0 -5%;
        width: 100%;
        height: 70px;
        position: absolute;
      }

      #slider #active {
        margin: 12% 0 0;
        display: none;
      }

      #slider #slides {
        padding: 2px 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0
      }

      #slider #slides .caption {
        opacity: 0 !important
      }

      #slider #commands label {
        -moz-transform: scale(0.7);
        -webkit-transform: scale(0.7);
        -o-transform: scale(0.7);
        -ms-transform: scale(0.7);
        transform: scale(0.7)
      }

      article img {
        width: auto;
        height: 100vh;
      }

      #slider {
        padding: 0 20px;
      }
    }























































    .footer {
      display: flex;
      flex-flow: row wrap;
      padding: 30px 30px 20px 30px;
      color: #fff;
      background-color: #19244b;
      /* border-top: 1px solid #e5e5e5; */

      width: 100vw;

      animation: fade-uppp 1.5s;

      font-size: 0.8rem;

    }

    .footer>* {
      flex: 1 100%;
    }

    .footer__addr {
      margin-right: 1.25em;
      margin-bottom: 1em;
      width: 100%;
      height: fit-content;
    }

    .footer__addr img {
      width: 25%;
    }

    .footer__addr h2 {
      font-size: 1rem;

      margin-top: 1.3em;
      font-weight: 400;

    }

    .nav__title {
      font-size: 1rem;

      font-weight: 500;
      letter-spacing: 0.5px;
    }

    .footer address {
      font-style: normal;
      color: #c5c5c5;
    }

    .footer__btn {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 36px;
      max-width: max-content;
      background-color: #ffffff9d;
      border-radius: 100px;
      color: #fff;
      line-height: 0;
      margin: 0.6em 0;
      padding: 0 1.3em;
      transition: 0.5s;
    }

    .footer__btn:hover {
      background-color: #ffffff;
      color: #3F59A4;
    }

    .footer ul {
      list-style: none;
      padding-left: 0;
    }

    .footer li {
      line-height: 2em;
    }

    .footer a {
      text-decoration: none;
    }

    .footer__nav {
      display: flex;
      flex-flow: row wrap;
    }

    .footer__nav>* {
      flex: 1 50%;
      margin-right: 1.25em;
    }

    .nav__ul a {

      color: #c5c5c5;
      white-space: nowrap;

      transition: 0.5s;
    }

    .nav__ul a:hover {
      color: #fff;
    }

    .nav__ul--extra {
      column-count: 2;
      column-gap: 1.25em;
    }

    .legal {
      display: flex;
      flex-wrap: wrap;
      color: #999;
    }

    .legal__links {
      display: flex;
      align-items: center;
      opacity: 0.7;

    }

    .legal__links a {
      color: #fff;
    }

    .heart {
      color: #000000;
      text-decoration: none;
    }




    @media screen and (min-width: 24.375em) {
      .legal .legal__links {
        margin-left: auto;
      }






    }

    @media screen and (min-width: 40.375em) {
      .footer__nav>* {
        flex: 1;
      }

      .nav__item--extra {
        flex-grow: 2;
      }

      .footer__addr {
        flex: 1 0px;
      }

      .footer__nav {
        flex: 2 0px;
      }






    }



















    @media only screen and (min-width: 1500px) {

      .text-box {
        height: 280px;
      }

      .little-text-box p {
        padding-top: 70px;
      }


      #scene {
        .img-3 {
          width: 900px;
          height: 900px;
        }

        .img-2 {
          width: 950px;
          height: 950px;
        }

        .img-1 {
          width: 1050px;
          height: 1050px;
        }
      }


      #local {
        margin-top: 500px;
      }


    }

    @media only screen and (min-width: 1700px) {

      .text-box {
        height: 300px;
      }

      .little-text-box p {
        padding-top: 100px;
      }

    }

    @media only screen and (min-width: 2200px) {

      .text-box {
        height: 340px;
      }

      .little-text-box p {
        padding-top: 150px;
      }




    }

















    @media only screen and (max-width: 1281px) {

      /* .rightside {
    position: relative;
    right: -92px;
    top: 54px;
  } */


    }





    @media only screen and (max-width: 1100px) {

      .text-box {
        height: 190px;
      }

      .text-box h1 {
        font-size: 10vh;
        line-height: 7vw;
      }

      .little-text-box p {
        font-size: 2.2vw;
        line-height: 3.5vw;
        font-weight: 350;

      }

      .book-link {
        font-size: 4vw;
        font-weight: 390;
        gap: 10px;
        margin: 0px 0 0;

      }




      .leftside {
        width: 85vw;
        white-space: break-spaces;
      }



      .titulo h1 {
        font-size: 7.2vw;
      }

      .titulo p {
        font-size: 3.7vw;
        line-height: 5.5vw;
      }


      .textosobre{
        display: flex;
        flex-direction: column;
      
      }
      
      .textosobre p {
        width: 100%;
        
      }
    }

    @media only screen and (max-width: 1000px) {

      .text-box {
        height: 200px;
      }

      .text-box h1 {
        font-size: 10vh;
        line-height: 8vw;
      }

      .little-text-box p {
        font-size: 2.2vw;
        line-height: 3.5vw;
        font-weight: 350;

      }

      .book-link {
        font-size: 5vw;
        font-weight: 390;
        gap: 10px;
      }




      .container {
        opacity: 0.4;
      }

      /* #scene{
    .img-3 {
    opacity: 0.4;
  }
    .img-2 {
    opacity: 0.4;

  }
   .img-1 {
    opacity: 0.4;
    }
  } */



    }

    @media only screen and (max-width: 800px) {

      .text-box {
        height: 220px;
      }

      .text-box h1 {
        font-size: 10vh;
        line-height: 10vw;
      }

      .little-text-box p {
        font-size: 2.2vw;
        line-height: 3.5vw;
        font-weight: 350;

      }

      .book-link {
        font-size: 6vw;
        font-weight: 390;
        gap: 10px;
      }


    }

    @media only screen and (max-width: 700px) {

      .text-box {
        height: 280px;
      }

      .text-box h1 {
        font-size: 11vh;
        line-height: 12vw;
      }

      .little-text-box p {
        font-size: 2.7vw;
        line-height: 3.5vw;
        font-weight: 350;

      }

      .book-link {
        font-size: 7vw;
        font-weight: 390;
        gap: 10px;
      }



      .header .logo {
        padding: 10px 20px;
      }

      section {
        padding: 100px 0px;

      }

      .titulo h1 {
        padding: 0px 20px;
      }

      .titulo p {
        padding: 0px 20px;
      }

      .maps {
        padding: 0px 20px;
      }

      .leftside {
        padding-left: 20px;
      }


    }

    @media only screen and (max-width: 600px) {

      .text-box {
        height: 400px;
      }

      .text-box h1 {
        font-size: 11vh;
        line-height: 17vw;
      }

      .little-text-box p {
        font-size: 3vw;
        line-height: 3.5vw;
        font-weight: 350;

      }

      .book-link {
        font-size: 8vw;
        font-weight: 390;
        gap: 10px;
      }

    }

    @media only screen and (max-width: 500px) {

      .text-box {
        height: 400px;
      }

      .text-box h1 {
        font-size: 9.5vh;
        line-height: 17vw;
      }

      .little-text-box p {
        font-size: 3.5vw;
        line-height: 3.5vw;
        font-weight: 400;
        animation: fade-up 3s;
        animation-timing-function: ease;
        animation-timing-function: cubic-bezier(.22, .61, .36, 1);
        padding-top: 20px;
      }

      .book-link {
        font-size: 9vw;
        font-weight: 390;
        gap: 10px;
      }


      .titulo h1 {
        font-size: 7.7vw;
      }

      .titulo p {
        font-size: 4vw;
        line-height: 5.5vw;
      }

    }

    @media only screen and (max-width: 450px) {

      .text-box {
        height: 250px;
      }

      .text-box h1 {
        font-size: 7.8vh;
        line-height: 17vw;
      }

      .little-text-box p {
        font-size: 3.5vw;
        line-height: 3.5vw;
        font-weight: 400;
        animation: fade-up 3s;
        animation-timing-function: ease;
        animation-timing-function: cubic-bezier(.22, .61, .36, 1);
        padding-top: 20px;
      }

      .book-link {
        font-size: 9vw;
        font-weight: 390;
        gap: 10px;

        top: -30px;
      }


      #entrada {
        min-height: 80vh;
      }

      .rightside {
        padding-top: 7%;
      }

      #scene {
        .img-3 {
          width: 400px;
          height: 400px;
        }

        .img-2 {
          width: 450px;
          height: 450px;
        }

        .img-1 {
          width: 550px;
          height: 550px;
        }
      }

    }