@import url('https://fonts.googleapis.com/css?family=Syncopate');                         /*BOTÓN*/
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700;900&family=Playfair:ital,opsz,wght@0,5..1200,300..900;1,5..1200,300..900&family=Viaoda+Libre&display=swap');/*Leyendas*/



/*********GUÍA DE COLORES
161f16 - Verde de fondo------------------
855a25 - Caqui/Dorado de letras----------133 90 37
e1e1e0 - Crema letras-------------------- 
a8926c - Caqui detalles------------------168 146 108
*/

*{
 margin: 0;
 padding: 0;
 box-sizing: border-box;}

body{
 background: #161f16;      /*FONDO GENERAL - 1e1e1e*/
 font-family: "Viaoda Libre", serif;
  font-weight: 400;
  font-style: normal;
 /*font-family: 'Roboto', sans-serif;*/}

header{                     /*BARRA SUPERIOR: MENÚ*/
 width: 100%;
 height: 80px;
 background: #161f16;       /*Color del todo el encabezado - 1e1e1e*/
 position: fixed;           /*para que se quede pegado*/
 top: 0;
 left: 0;
 z-index: 100;              /*para que esté por encima de los demás elementos*/
}

.contenedor{
 width: 98%;
 margin: auto;}

header .contenedor{
 display: table;}

 section{
  width: 100%;
  margin-bottom: 25px;}

   /*LEYENDAS*****************************************************************************************************/
#leyenda .contenedorLeyenda{        
 width: 90%;
 height: 5%;
 left: 5%;
 position: absolute;
 color: #fff; 
 text-align: center;
 font-family: "Viaoda Libre", serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 10px;
}

#leyenda a{
 font-size: 50px;
}

.leyendaP{
   font-size: 23px;
}

/****************************BOTÓN****************************/
.boton a{                                       
 height: 80px;
 display: block;
 color: #fff;
 text-decoration: none;
 text-align: center;
 padding: 10px;
 margin: 30px auto;
 border: 4px solid #855a25;
 font-family: 'Syncopate', sans-serif;}

.boton a:hover{
background: rgba(212,175,55,0.9);}



  /***********************FOOTER*********************************/
footer{
 border:  1px solid #333;
 height: 50px;
 margin-top: 60%;
}

.sociales{
 display: flex;
 flex-wrap: wrap;
 width: 100%;
 justify-content: center;
 text-align: center;
 font-size: 25px;
 padding-bottom: 25px;
 margin-top: 5px;}


.sociales a{
 color: #855a25;
 text-decoration: none;
 margin: 10px;}

.sociales a:hover{
 color: #e1e1e0;}



  /******************************RESPONSIVE*************************************/
@media(min-width:480px){
 .boton a{ width: 280px; }
}/*480*/

@media (min-width:1024px){
 .sociales{ font-size: 30px }
 .boton a{ width: 380px; }
 }