*{
   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;
}

#imagem-sec{
    width: 100%;
    height: 1000px;
    margin: auto;
    margin-top: 120px;
    margin-bottom: 120px;
}

.imagem{
    width: 100%;
    height: 100px;
}




/* imagens */

#imagens{
   max-width: 1140px;
   margin: 235px auto 105px auto;
   font-size: 0;
}

#coluna1, #coluna2{
   display: inline-block;
   width: 50%;
   vertical-align: top;
   margin-top: -130px;
   text-align: right;
}

#coluna2{
   margin-top: 240px;
   text-align: left;
}

.container_foto {
   display: inline-block;
   position: relative;
   overflow: hidden;
   margin: 15px;
}

.container_foto img {
   width: 99%;
   transition: transform 0.4s ease;
}

.container_foto:hover img {
   transform: scale(1.2);
}

.container_foto .mais {
   background-color: rgba(0, 0, 0, 0.5);
   text-align: center;
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   opacity: 0;
   transition: opacity 0.4s ease;
}

.container_foto .mais a {
   color: white;
   font-size: 65px;
   font-weight: 100;
   position: absolute;
   top: 50%;
   left: 50%;
   cursor: pointer;
   transform: translate(-50%, -300%) rotate(-90deg);
   transition: transform 0.4s;
}

.container_foto:hover .mais a{
   transform: rotate(0deg) translate(-50%, -50%);
}

.container_foto:hover .mais {
   opacity: 1;
}



/* 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;
}