@import url('https://fonts.googleapis.com/css2?family=Cascadia+Mono:ital,wght@0,200..700;1,200..700&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cascadia+Mono:ital,wght@0,200..700;1,200..700&family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');


* {
   margin: 0;
   box-sizing: border-box; 
}
   
a:hover {
   color: #AD9966;
}

::selection {
   background-color: #AD9966;
   color: #fff;
}

header li {
    display: inline-block;
    width: 4.5%;
}

ul {
    font-weight: 500;
    text-transform: uppercase;
    font-size: 13px;
    padding: 2px;
    letter-spacing: 2px;
}

header {
    text-align: center;
    background-color: white;
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: -21.213px 21.213px 30px 0px rgba(158, 158, 158, 0.3);
}

.header_logo {
    width: 21%;
    vertical-align: middle;
    padding: 10px;
}

.header_logo img {
    width: 66.81px;
    height: 79.88px;

}

a {
   text-decoration: none;
   color: #000;
   font: 13px Roboto, sans-serif;
   display: block;
}

#banner_home {
   background-image: url('fundo_home.png');
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
   height: 78vh;
   display: flex;
   justify-content: center;
   align-items: center;
   text-align: center;
   font-weight: lighter;
}

#banner_home h1 {
   font-family: Playfair Display, sans-serif;
   font-size: 72px;
   line-height: 1.5em;
   text-transform: uppercase;
   letter-spacing: 10.8px;
   font-weight: lighter;
   color: #fff;
   vertical-align: middle;
}

#banner_home hr {
   width: 27rem;
   margin-top: 1rem;
   margin-bottom: 1rem;
   border: 0;
   border-top: 1px solid #fff;
}

#banner_home p {
   color: #fff;
   font-family: Roboto, sans-serif;
   text-transform: uppercase;
   margin-bottom: 50px;
   line-height: 30px;
   padding-top: 8px;
}

.caixa_introducao {
   display: inline;
   align-items: center;
   justify-items: center;
   padding-right: 15px;
   padding-left: 15px;
   margin-left: auto;
   margin-right: auto;
}

.pentagono_esquerdo {
   background-image: url(view-menu-bg.png);
   position: fixed;
   height: 180px;
   width: 92px;
   left: 0;
   top: 44%;
}

.pentagono_esquerdo a {
   font-family: Roboto, sans-serif;
   font-size: 10px;
   text-transform: uppercase;
   text-align: center;
   letter-spacing: 2px;
   margin-top: 80px;
}

.pentagono_direito {
   background-image: url(book-table-bg.png);
   position: fixed;
   height: 180px;
   width: 92px;
   right: 0.5px;
   top: 44%;
}

.pentagono_direito a:hover {
   color: black;
}

.pentagono_direito a {
   font-family: Roboto, sans-serif;
   color: #fff;
   font-size: 10px;
   text-transform: uppercase;
   align-items: center;
   justify-content: center;
   text-align: center;
   letter-spacing: 2px;
   margin-top: 80px;
}

#secao_menu {
   width: 67%;
   margin: auto;
}

.esquerda {
   display: inline-block;
   width: 474.98px;
   height: 516.98px;
}

.esquerda h1 {
   margin-bottom: 20px;
   font-size: 48px;
   letter-spacing: 7.2px;
   text-transform: uppercase;
   font-family: Playfair Display, sans-serif;
   font-weight: normal;
}

.esquerda p {
   font-size: 13px;
   letter-spacing: 2px;
   font-family: Roboto, sans-serif;
   color: #777;
   margin-bottom: 50px;
   line-height: 30px;
}

/* fazer a transição do botão */

.esquerda a {
   letter-spacing: 2px;
   border-radius: 0px;
   border: 1px solid #AD9966;
   display: inline-block;
   font-weight: normal;
   position: relative;
   padding: 0 30px;
   line-height: 48px;
   color: #fff;
   background-color: #AD9966;
   text-transform: uppercase;
   text-decoration: none;
   outline: 0;
   font-family: Roboto, sans-serif;
}

.direita {
   display: inline-block;
   width: 635px;
   height: 1175px;
   vertical-align: middle;
   background-color: #faf5f0;
   padding: 120px 0 120px 0;
}

.menu_item {
   margin-bottom: 10px;
   color: black;
}

.div_lista_appetizer {
   align-items: center;
   justify-content: center;
   text-align: center;
   margin-bottom: 80px;
}

.div_lista_appetizer h3 {
   font-size: 21px;
   font-family: Playfair Display, sans-serif;
   color: #000;
   font-weight: normal;
   margin-bottom: 50px;
   padding-bottom: 20px;
   line-height: 1.5em;
   font-style: italic;
   text-transform: uppercase;
   text-align: center;
}

.div_lista_appetizer ul {
   list-style: none;
}

.div_lista_appetizer ul li {
   font-family: Roboto, sans-serif;
   color: #777;
   font-size: 14px;
   letter-spacing: 1px;
   margin-bottom: 10px;
   text-transform: none;
}

.div_lista_coures {
   align-items: center;
   justify-content: center;
   text-align: center;
   margin-bottom: 80px;
}

.div_lista_coures h3 {
   font-size: 21px;
   font-family: Playfair Display, sans-serif;
   color: #000;
   font-weight: normal;
   margin-bottom: 50px;
   padding-bottom: 20px;
   line-height: 1.5em;
   font-style: italic;
   text-transform: uppercase;
   text-align: center;
}

.div_lista_coures ul {
   list-style: none;
}

.div_lista_coures ul li {
   font-family: Roboto, sans-serif;
   color: #777;
   font-size: 14px;
   letter-spacing: 1px;
   margin-bottom: 10px;
   text-transform: none;
}

.div_lista_drinks {
   align-items: center;
   justify-content: center;
   text-align: center;
   margin-bottom: 80px;
}

.div_lista_drinks h3 {
   font-size: 21px;
   font-family: Playfair Display, sans-serif;
   color: #000;
   font-weight: normal;
   margin-bottom: 50px;
   padding-bottom: 20px;
   line-height: 1.5em;
   font-style: italic;
   text-transform: uppercase;
   text-align: center;
}

.div_lista_drinks ul {
   list-style: none;
}

.div_lista_drinks ul li {
   font-family: Roboto, sans-serif;
   color: #777;
   font-size: 14px;
   letter-spacing: 1px;
   margin-bottom: 10px;
   text-transform: none;
}

.fotos_pratos {
   width: 67%;
   margin: auto;
}

.img1 {
   display: inline-block;
   position: relative;
   top: -170px;
   left: 50px;
   overflow: hidden;
}

.img2 {
   display: inline-block;
   position: relative;
   top: -30px;
   left: 75px;
   overflow: hidden;
}

.img3 {
   display: inline-block;
   position: relative;
   top: -170px;
   left: 150px;
   overflow: hidden;
}

.img4 {
   display: inline-block;
   position: relative;
   left: 175px;
   overflow: hidden;
}

.img1:hover img {
   transform: scale(1.3);
   filter: brightness(30%)
}

.img2:hover img {
   transform: scale(1.3);
   filter: brightness(30%)
}

.img3:hover img {
   transform: scale(1.3);
   filter: brightness(30%)
}

.img4:hover img {
   transform: scale(1.3);
   filter: brightness(30%)
}

#formulário_reserva {
   width: 67%;
   margin: auto;
}

.caixa_formularioReserva_titulo {
   display: inline-block;
}

.centralizar_formlário {
   display: inline-block;
}

.form {
   display: inline-block;
   width: 635px;
   height: 982px;
   background-color: #faf5f0;
}

.texto_formulario {
   display: inline-block;
}

.texto_formulario h1 {
   margin-bottom: 20px;
   font-size: 48px;
   letter-spacing: 7.2px;
   text-transform: uppercase;
   font-family: Playfair Display, sans-serif;
   font-weight: normal;
}

.texto_formulario p {
   font-size: 16px;
   letter-spacing: 2px;
   font-family: Roboto, sans-serif;
   color: #777;
   margin-bottom: 50px;
   line-height: 30px;
}