*{
   margin: 0;
   padding: 0;
}

body{
   font-family: "Roboto", sans-serif;
}

html {
  scroll-behavior: smooth;
}

::selection {
  background-color: #ad9966;
  color: white;
}




/* cabeçalho */

#cabeçalho {
   background-color: white;
   position: sticky;
   top: 0;
   left: 0;
   width: 100%;
   z-index: 1000;
   padding: 10px 0 10px 0;
   box-shadow: -21.213px 21.213px 30px 0px rgba(158, 158, 158, 0.3);
}

a{
   text-decoration: none;
   font-size: 13px;
   color: black;
   font-weight: 500;
   outline: none;
   letter-spacing: 2px;
}

#cabeçalho a{
   transition: color 0.3s ease;
}

#cabeçalho a:hover{
   color: #ad9966;
}

#letrinha_colorida{
   color: #ad9966;
}

li{
   width: 4.8%;
   display: inline-block;
   position: relative;
}

ul{
   list-style: none;
   padding: 0;
   text-align: center;
}

#logo{
   width: 20%;
   vertical-align: middle;
   height: 79.38px;
}

#logo img{
   height: 79.38px;
   width: 66.81px;
}

.setinha:after {
    content: '\25BE';
    font-size: 10px;
    margin-left: 5px;
}

#pages-div, #blog-div{
    width: 165px;
    height: 105px;
    position: absolute;
    top: 100%;
    background-color: white;
    padding-top: 30px;

    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease-in;
}

li:hover #pages-div, li:hover #blog-div{
    opacity: 1;
    visibility: visible;
}

#pages-div a, #blog-div a{
    display: block;
    text-align: left;
    margin: 24px 0px 0px 24px;
}




/* imagem principal */

#culinaria{
   min-height: 400px;
   max-width: 1520px;
   width: 100%;
   margin: auto;
   position: relative;
   background-image: url(culinaria2.png);
   background-repeat: no-repeat;
   background-size: auto;
   background-size: cover;
   background-position: center;
   text-align: center;
   z-index: 1;
}

#texto-centro{
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%,-52.4%);
   text-transform: uppercase
}

#texto-centro h1{
   font-family: "Playfair Display", serif;
   font-size: 48px;
   font-weight: 400;
   color: white;
   letter-spacing: 8.8px;
   line-height: 1.5;
}

hr{
   width: 400px;
   border: none;
   height: 1px;
   border-top: 1px solid rgba(255, 255, 255, 0.4);
   margin: 16px 0px 16px 0px;
}

#texto-centro p{
   padding-top: 11px;
   margin-bottom: 11px;
}

#texto-centro a{
   color: white;
   font-size: 18px;
   font-weight: 400;
   letter-spacing: 0px;
   margin: 0px 12px;
   transition: color 0.3s ease;
}

#texto-centro a:hover{
   color: #ad9966;
}

#culinaria span{
   position: relative;
   margin: 0px 10px;
}

#culinaria span svg{
   position: absolute;
   top: -25%;
   transform: translateX(-58%);
   width: 22px;
}




/* tela1 */

#tela1{
   max-width: 1140px;
   margin: auto;
   font-size: 0;
}

/* esquerda */

#divisão_esquerda{
   display: inline-block;
   vertical-align: middle;
   width: 35%;
   padding: 0px 76px 30px 15px;
}

#Daily{
   font-family: "Playfair Display", serif;
   font-size: 48px;
   font-weight: 400;
   color: black;
   line-height: 1.5;
   margin-bottom: 20px;
   letter-spacing: 7.2px;
}

#divisão_esquerda p{
   font-size: 15px;
   margin-bottom: 51px;
   line-height: 30px;
   color: #777777;
}

#divisão_esquerda a{
   font-size: 15px;
   font-weight: 400;
   line-height: 48px;
   padding: 15px 30px 15px 30px;
   color: white;
   border: 1px solid #ad9966;
   background-color: #ad9966;
   letter-spacing: 2px;
   transition: background-color 0.3s ease;
}

#divisão_esquerda a:hover{
   background-color: #ffffff;
   color: #ad9966;
   border-color: #ad9966;
}

/* direita */

#divisão_direita{
   display: inline-block;
   vertical-align: middle;
   width: 54%;
   background: #faf5f0;
   text-align: center;
   padding-top: 121px;
   padding-bottom: 120px;
   padding-left: 10px;
   padding-right: 10px;
}

#divisão_direita h3{
   font-family: "Playfair Display", serif;
   font-size: 21px;
   font-style: italic;
   font-weight: normal;
   text-transform: uppercase;
   line-height: 1.5em;
   margin-bottom: 70px;

   text-decoration: underline;
   text-decoration-color: rgba(0, 0, 0, 0.1);
   text-decoration-thickness: 1.5px;
   text-underline-offset: 10px;
}

#divisão_direita p{
   font-family: "Roboto", sans-serif;
   line-height: 1.7;
   font-size: 15px;
}

.h3_margin{
   margin-top: 80px;
}

.principal{
   font-weight: bold;
   margin-bottom: 10px;
   font-weight: 500;
}

.descrição{
   color: #777777;
   margin-bottom: 35px;
   font-weight: normal;
}

.final{
   color: #777777;
   margin-bottom: 0px;
   font-weight: normal;
}




/* tela3 */

#tela3{
   max-width: 1140px;
   min-height: 658px;
   font-size: 0;
   margin: auto;
}

#tela3 #esquerda{
   display: inline-block;
   width: 50%;
   vertical-align: middle;
}

#tela3 #esquerda img{
   width: 540px;
   margin: 0px 15px;
   margin-top: -15%;
}

#tela3 #direita{
   display: inline-block;
   width: 50%;
   text-align: left;
   vertical-align: middle;
}

#tela3 #direita-div{
   margin: 0px 15px 0px 110px;
}

#tela3 #direita h1{
   font-family: "Playfair Display", serif;
   font-size: 48px;
   font-weight: 400;
   text-transform: uppercase;
   color: black;
   line-height: 1.5;
   margin-bottom: 20px;
   letter-spacing: 7.2px;
}

#tela3 #direita p{
   font-size: 15px;
   margin-bottom: 50px;
   line-height: 30px;
   color: #777777;
}




/* tela4 */

#tela4{
   max-width: 1140px;
   min-height: 450px;
   background-image: url(prato.jpg);
   background-repeat: no-repeat;
   background-position: center;
   position: relative;
   margin: auto;
   margin-top: 120px;
   margin-bottom: 120px;
}

#texto_centro3{
   text-align: center;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%,-50%);
   background-color: rgba(255, 255, 255, 0.9);
   width: 473px;
   height: 97px;
   padding: 33px 20px 33px 20px;
}

#texto_centro3 h3{
   font-family: "Playfair Display", serif;
   font-size: 21px;
   font-style: italic;
   font-weight: normal;
   text-transform: uppercase;
   line-height: 1.5em;
   margin-bottom: 40px;

   text-decoration: underline;
   text-decoration-color: rgba(0, 0, 0, 0.2);
   text-decoration-thickness: 1px;
   text-underline-offset: 15px;
}

#texto_centro3 p{
   color: #777777;
   font-family: "Roboto", sans-serif;
   line-height: 1.7;
   font-weight: 500;
   font-size: 15px;
}

#setas{
   width: 115%;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   z-index: 3;
}

#seta-esquerda, #seta-direita{
   background: none;
   border: none;
   cursor: pointer;
   outline: inherit;
}

#seta-esquerda img, #seta-direita img{
   opacity: 0.2;
   transition: opacity 0.4s ease;
}

#seta-esquerda:hover img, #seta-direita:hover img{
   opacity: 1;
}

#seta-direita{
   float: right;
}




/* rodapé */

footer{
   background-color: #04091e;
   font-size: 0;
   text-align: center;
   width: 100%;
   padding: 120px 0px;
}

/* rodapé de cima */

#rodape_cima{
   width: 100%;
   max-width: 1110px;
   display: block;
   margin: auto;
   font-size: 0;
   padding:  0px 15px 0px 15px;
}

#rodape_cima ul {
   list-style: none;
}

#rodape_cima li {
   text-align: left;
   width: 100%;
   display: block;
   margin-bottom: 10px;
}

#rodape_cima h4{
   color: white;
   font-family: "Playfair Display", serif;
   text-transform: uppercase;
   font-weight: 400;
   font-size: 18px;
   margin-bottom: 27px;
}

#rodape_cima a, #cima_divisão2 p, #enter_digitar, #rodape_baixo p{
   color: #777777;
   font-size: 15px;
   font-family: "Roboto", sans-serif;
   font-weight: 400;
   line-height: 1.7;
   letter-spacing: normal;
}

#rodape_cima a{
   transition: all 0.4s ease;
}

#rodape_cima a:hover{
   color: #ad9966;
}

/* divisão1 */

#cima_divisão1{
   display: inline-block;
   width: 68%;
   font-size: 0;
}

.cima_divisão1_div{
   display: inline-block;
   vertical-align: top;
   font-size: 14px;
   text-align: left;
   width: 25%;
}

/* divisão2 */

#cima_divisão2{
   display: inline-block;
   vertical-align: top;
   font-size: 14px;
   text-align: left;
   width: 32%;
}

#cima_divisão2 p{
   margin-bottom: 16px;
}

#enter{
   font-size: 0;
}

#enter input{
   width: 75%;
   height: 38px;
   display: inline-block;
   vertical-align: middle;
   color: white;
   border: solid 1px rgba(255, 255, 255, 0.1);
   background-color: #04091e;
   padding: 0px 20px;
}

#enter input::placeholder{
   color: rgba(145, 145, 145, 0.5);
   font-family: "Roboto", sans-serif;
   font-size: 13px;
   font-weight: 400;
}

#enter input:focus{
   outline: none;
}

#enter_botao{
   width: 40px;
   height: 40px;
   display: inline-block;
   position: relative;
   vertical-align: middle;
   background-color: #ad9966;
   color: white;
   border: none;
   cursor: pointer;
}

#enter_botao svg{
   width: 40%;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}

#enter_botao path{
   fill: white;
   stroke: #ad9966;
   stroke-width: 30px;
}

#submitting{
   display: none;
   color: white;
   font-size: 12px;
   margin-top: 30px;
   font-weight: 400;
}

#enter_botao:focus + #submitting{
   display: block;
}

/* rodapé de baixo */

#rodape_baixo{
   width: 100%;
   max-width: 1110px;
   display: block;
   margin: auto;
   font-size: 0;
   padding:  50px 15px 0px 15px;
}

#rodape_baixo #esquerda, #rodape_baixo #direita{
   display: inline-block;
   width: 50%;
   vertical-align: middle;
}

/* rodapé de baixo esquerda */

#rodape_baixo #esquerda{
   text-align: left;
}

#rodape_baixo #esquerda a{
   color: #ad9966;
   font-size: 15px;
   font-family: "Roboto", sans-serif;
   font-weight: 400;
   letter-spacing: 0px;
}

#rodape_baixo #esquerda svg{
   width: 20px;
   transform: translateY(16%);
}

#rodape_baixo #esquerda path {
  fill: #ad9966;
  stroke: #04091e;
  stroke-width: 20px;
}

/* rodapé de baixo direita */

#rodape_baixo #direita{
   text-align: right;
}

#rodape_baixo #direita a{
   color: #ad9966;
   background: rgba(255, 255, 255, 0.1);
   font-size: 12px;
   transition: background-color 0.4s ease;

   position: relative;
   display: inline-block;
   width: 20px;
   height: 20px;
   padding: 5px;
   margin: 0px 2px 0px 2px;
}

#rodape_baixo #direita a:hover{
   background-color: #ad9966;
}

#rodape_baixo #direita a svg{
   position: absolute;
   width: 60%;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}

#rodape_baixo #direita a path{
   transition: fill 0.4s ease;
}
#rodape_baixo #direita a:hover path{
   fill: white;
}