@import url("https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@200&family=Sacramento&display=swap");
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

header {
  width: 100%;
  height: 12vh;
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0vh 5vh 0vh 5vh;
  transition: .3s ease-in-out; }
  header .header-div1 {
    width: 25%;
    height: 100%;
    font-family: 'Sacramento', cursive; }
    header .header-div1 a {
      width: 80%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #5a4738; }
  header .header-div2 {
    width: 40%;
    height: 100%;
    font-family: 'Josefin Sans', sans-serif; }
    header .header-div2 nav {
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: space-evenly; }
      header .header-div2 nav a {
        font-size: 15pt;
        text-decoration: none;
        color: #fff;
        font-weight: 600;
        position: relative;
        transition: .2s ease-in-out;
        letter-spacing: 2px; }
        header .header-div2 nav a::after {
          content: " ";
          width: 0%;
          height: 2px;
          background-color: #7bcad8;
          position: absolute;
          bottom: 0;
          left: 0;
          transition: .2s ease-in-out; }
        header .header-div2 nav a:hover {
          color: #7bcad8; }
          header .header-div2 nav a:hover::after {
            width: 100%; }
  header .header-links {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    position: absolute;
    top: 9vh;
    right: 0;
    width: 30vw;
    height: 100vh;
    background-color: #b89073;
    border-left: 1px solid #000;
    flex-direction: column;
    transform: translateX(100%);
    transition: .45s ease-in-out; }
    header .header-links a {
      text-decoration: none;
      font-size: 15pt;
      color: #fff;
      font-weight: 600; }
  header .menu-h {
    width: 1%; }
  header .header-div2 {
    width: 37.5%;
    height: 10vh;
    display: flex;
    align-items: center;
    justify-content: center; }
  header .header-links-2 {
    width: 35%;
    height: 10vh;
    display: flex;
    align-items: center;
    justify-content: space-evenly; }
  header .header-menu-h {
    display: none;
    align-items: center;
    justify-content: center; }
  header #menu-h {
    position: absolute;
    opacity: 0; }
  header label {
    cursor: pointer;
    position: absolute;
    display: block;
    width: 28px;
    height: 20px; }
  header label span {
    display: block;
    position: absolute;
    height: 5px;
    width: 100%;
    border-radius: 30px;
    background-color: #5a4738;
    transition: 0.25s ease-in-out; }
  header label span:nth-child(1) {
    top: 0; }
  header label span:nth-child(2) {
    top: 8px; }
  header label span:nth-child(3) {
    top: 16px; }
  header #menu-h:checked + label span:nth-child(1) {
    transform: rotate(-45deg);
    top: 8px; }
  header #menu-h:checked + label span:nth-child(2) {
    opacity: 0; }
  header #menu-h:checked + label span:nth-child(3) {
    transform: rotate(45deg);
    top: 8px; }
  header #menu-h:checked {
    transform: translateX(0); }

main {
  font-family: 'Josefin Sans', sans-serif; }
  main .main-div1 {
    width: 100% !important;
    height: 80vh;
    background: url(../imgs/banner-coffee-gif.gif);
    background-size: cover;
    background-repeat: no-repeat; }
    main .main-div1 span {
      padding-top: 12vh;
      width: 100%;
      height: 100%;
      display: grid;
      place-items: center;
      padding-bottom: 10vh;
      background-color: #00000085; }
      main .main-div1 span h1 {
        font-size: 40pt;
        color: #a88e76;
        font-family: 'Sacramento', cursive;
        text-shadow: 0 0 12px #805b419a, 0 0 50px #805b419a, 0 0 100px #805b419a; }
  main .main-div2 {
    width: 100%;
    height: 90vh;
    background-color: #ffffff;
    display: flex; }
    main .main-div2 .main-div2-1 {
      width: 50%;
      height: 100%;
      display: grid;
      place-items: center; }
    main .main-div2 .main-div2-2 {
      width: 50%;
      height: 100%;
      padding: 10vh 20vh 10vh 5vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 3vh;
      color: #1b1b20; }
      main .main-div2 .main-div2-2 h2 {
        font-size: 25pt;
        color: #b89073;
        font-family: 'Sacramento', cursive;
        font-weight: 50; }
      main .main-div2 .main-div2-2 h1 {
        font-size: 35pt; }
      main .main-div2 .main-div2-2 p {
        font-size: 13pt;
        font-weight: 600; }
      main .main-div2 .main-div2-2 button {
        padding: 3vh;
        width: 32vh;
        background-color: #b89073;
        border: none;
        border-radius: 10px;
        font-size: 13pt;
        font-weight: 600;
        color: #fff;
        transition: background .3s ease-in-out; }
        main .main-div2 .main-div2-2 button:hover {
          background-color: #b97748;
          color: #7bcad8;
          text-decoration: underline;
          cursor: pointer; }
  main .main-div3 {
    width: 100%;
    height: relative;
    background-color: #f8f0e7;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-wrap: wrap;
    padding: 10vh 0 10vh 0; }
    main .main-div3 .div3-card {
      width: 50vh;
      height: 30vh;
      display: flex;
      color: #1b1b20; }
      main .main-div3 .div3-card .icone {
        width: 20%;
        height: 100%;
        padding: 10vh 1vh 1vh 1vh; }
      main .main-div3 .div3-card .conteudo {
        width: 80%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 2vh;
        gap: 2vh;
        text-align: justify; }
        main .main-div3 .div3-card .conteudo h1 {
          font-size: 18pt; }
        main .main-div3 .div3-card .conteudo p {
          font-size: 13pt;
          font-weight: 600;
          color: #424242; }
  main .main-div4 {
    width: 100%;
    height: 90vh;
    background-color: #1b1b20;
    display: flex; }
    main .main-div4 .div1 {
      width: 50%;
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 2.5vh;
      color: #fff;
      padding: 10vh; }
      main .main-div4 .div1 h1 {
        color: #b89073;
        font-family: 'Sacramento', cursive;
        font-size: 40pt; }
      main .main-div4 .div1 h3 {
        font-size: 30pt; }
        main .main-div4 .div1 h3 span {
          color: #c0c0c0; }
      main .main-div4 .div1 p {
        font-size: 15pt; }
    main .main-div4 .div2 {
      width: 50%;
      height: 100%;
      background: url(../imgs/banner.jpg);
      background-repeat: no-repeat;
      background-size: cover; }
      main .main-div4 .div2 .fundo {
        width: 100%;
        height: 100%;
        background-color: #ffffff1f; }
  main .main-div5 {
    width: 100%;
    height: 110vh;
    display: grid;
    place-items: center;
    padding-bottom: 5vw; }
    main .main-div5 h1 {
      color: #b89073;
      font-family: 'Sacramento', cursive;
      font-size: 30pt; }
    main .main-div5 .div1 {
      width: 70vw;
      height: 80vh;
      display: flex; }
      main .main-div5 .div1 .lista {
        width: 50%;
        height: 100%;
        background-color: #1b1b20;
        display: grid;
        place-items: center;
        padding: 5vh; }
        main .main-div5 .div1 .lista button {
          display: flex;
          width: 90%;
          padding: 1vh;
          background-color: #00000000;
          text-align: left;
          font-size: 12pt;
          border: none;
          color: #fff;
          border-bottom: 1px dotted #b89073;
          transition: .3s ease-in-out; }
          main .main-div5 .div1 .lista button:hover {
            color: #b89073;
            letter-spacing: 3px;
            cursor: pointer; }
      main .main-div5 .div1 .imagem {
        width: 50%;
        height: 100%;
        background: url(../imgs/mesa.png);
        background-repeat: no-repeat;
        background-size: cover; }
        main .main-div5 .div1 .imagem #itens {
          width: 100%;
          height: 100%;
          padding: 5vh;
          display: grid;
          place-items: center;
          gap: 1vh; }
          main .main-div5 .div1 .imagem #itens span {
            width: 100%;
            padding: 2px;
            display: flex;
            justify-content: space-between;
            border-bottom: 1px solid #5a4738;
            font-size: 15pt;
            color: #fff; }
  main .main-div6 {
    width: 100%;
    height: 70vh;
    display: flex; }
    main .main-div6 .div1 {
      width: 50%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center; }
      main .main-div6 .div1 div {
        width: 70%;
        height: 30%; }
        main .main-div6 .div1 div h1 {
          font-size: 40pt; }
        main .main-div6 .div1 div h2 {
          font-size: 30pt; }
        main .main-div6 .div1 div p {
          font-size: 20pt; }
    main .main-div6 .formulario {
      width: 50%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center; }
      main .main-div6 .formulario form {
        display: flex;
        flex-direction: column;
        gap: 1vh; }
        main .main-div6 .formulario form .name input {
          width: 12.5vw; }
        main .main-div6 .formulario form input {
          width: 25vw;
          height: 5vh;
          border: 0;
          border-bottom: 1px solid #b89073; }
          main .main-div6 .formulario form input:focus, main .main-div6 .formulario form input select:focus {
            box-shadow: 0 0 0 0;
            border: none;
            outline: 0;
            border-bottom: 1px solid #5a4738; }
        main .main-div6 .formulario form textarea:focus, main .main-div6 .formulario form select:focus {
          box-shadow: 0 0 0 0;
          border: 0;
          outline: 0;
          border-bottom: 1px solid #5a4738; }
        main .main-div6 .formulario form textarea {
          border: 0;
          border-bottom: 1px solid #b89073; }

footer {
  font-family: 'Josefin Sans', sans-serif;
  width: 100%;
  height: 30vh;
  background-color: #b89073;
  padding-left: 10vw;
  padding-right: 10vw;
  padding-top: 1vw; }
  footer .footer-div1 {
    width: 100%;
    height: 50%;
    color: #5a4738;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px dotted #fff; }
    footer .footer-div1 .logo {
      width: 20%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: 'Sacramento', cursive; }
    footer .footer-div1 .header-2 {
      width: 40%;
      height: 100%; }
      footer .footer-div1 .header-2 nav {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: space-evenly; }
        footer .footer-div1 .header-2 nav a {
          font-size: 14pt;
          text-decoration: none;
          color: #fff;
          font-weight: 600;
          position: relative;
          transition: .2s ease-in-out; }
          footer .footer-div1 .header-2 nav a::after {
            content: " ";
            width: 0%;
            height: 2px;
            background-color: #7bcad8;
            position: absolute;
            bottom: 0;
            left: 0;
            transition: .2s ease-in-out; }
          footer .footer-div1 .header-2 nav a:hover {
            color: #7bcad8; }
            footer .footer-div1 .header-2 nav a:hover::after {
              width: 100%; }
    footer .footer-div1 .num {
      width: 20%;
      height: 100%;
      display: grid;
      place-items: center;
      color: #fff; }
  footer .footer-div2 {
    width: 100%;
    height: 50%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #fff;
    font-size: 14pt;
    padding-left: 2vw;
    padding-right: 2vw; }

.ativo {
  color: #5a4738;
  background-color: #b89073;
  height: 10vh; }

::selection {
  background-color: #7bcad871; }

::-webkit-scrollbar {
  width: 8px;
  background-color: #fff; }

::-webkit-scrollbar-thumb {
  background-color: #b89073;
  border: 0px;
  border-radius: 3px; }

@media (max-width: 1280px) {
  header .header-div1 {
    width: 35vw; }

  main .main-div5 .div1 {
    width: 100% !important; } }
@media (max-width: 1200px) {
  main .main-div2 {
    height: 150vh;
    flex-direction: column; }
    main .main-div2 .main-div2-1, main .main-div2 .main-div2-2 {
      height: 50%;
      width: 100%; }
    main .main-div2 .main-div2-2 {
      padding: 0 30vh 0 30vh;
      text-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; } }
@media (max-width: 1120px) {
  header .header-div2 {
    width: 40vw; } }
@media (max-width: 1080px) {
  header .header-div2 nav {
    gap: 1vh; }

  main .main-div6 {
    display: flex;
    flex-direction: column;
    height: 90vh; }
    main .main-div6 .div1, main .main-div6 .formulario {
      width: 100%;
      height: 50%; }
    main .main-div6 .div1 {
      padding: 10vh 0 10vh 0;
      text-align: center; }
    main .main-div6 .formulario form {
      width: 60vh; }
      main .main-div6 .formulario form .name {
        width: 100%; }
        main .main-div6 .formulario form .name input {
          width: 49%; }
      main .main-div6 .formulario form input {
        width: 100%; } }
@media (max-width: 980px) {
  header .header-div2 {
    width: 5vw; }
    header .header-div2 nav {
      display: none; }
    header .header-div2 .header-menu-h {
      display: flex; }

  main .main-div4 {
    height: 170vh;
    display: flex;
    flex-direction: column; }
    main .main-div4 .div1, main .main-div4 .div2 {
      width: 100%;
      height: 50%; }
    main .main-div4 .div1 {
      padding: 0 15vh 0 15vh; } }
@media (max-width: 880px) {
  main .main-div2 .main-div2-2 {
    padding: 0 10vh 0 10vh; }

  footer .footer-div1 .header-2 {
    display: none; }
    footer .footer-div1 .header-2 nav {
      display: none; }
  footer .footer-div1 .num {
    width: 30vw; }
  footer .footer-div1 .logo {
    width: 30vw; }
  footer .footer-div2 {
    text-align: center; } }
@media (max-width: 855px) {
  header .header-div1 {
    width: 50%; }

  main .main-div5 {
    height: 200vh; }
    main .main-div5 .div1 {
      display: flex;
      flex-direction: column;
      height: 100%; }
      main .main-div5 .div1 .lista, main .main-div5 .div1 .imagem {
        width: 100%;
        height: 50%; }
  main .main-div6 {
    height: 100vh; } }
@media (max-width: 680px) {
  header .header-div1 {
    width: 60%; }

  main .main-div4 .div1 {
    padding: 5vh; } }
@media (max-width: 600px) {
  main .main-div1 span h1 {
    font-size: 30pt; } }
@media (max-width: 570px) {
  header .header-div1 a img {
    width: 50px; }
  header .header-div1 a h1 {
    font-size: 18pt; }

  main .main-div6 .div1 div {
    width: 100%;
    padding: 1vh; } }

/*# sourceMappingURL=style.css.map */
