:root{
  --dorado: #af9463;
  --gris-claro: #EEEEEE;
  --negro: #333333;
  --texto-ficha: 12px;
  --gris: #797979;
  --gris-oscuro: #575757;
}

body{
  margin: 0;
  font-family: Roboto, Arial, helvetica;
}
a{
  text-decoration: none;
  transition: all 0.6s;
}
a i{
  transition: all 0.6s;
}
a:hover i{
  color: var(--gris-oscuro);
}
header{
  background-color: #af9463;
  background-size: auto 100%;
  background-position: center center;
  padding: 30px 0;
  text-align: center;
}
/*.logo{
  background-color: #000000;
  padding: 15px;
  display: inline-block;
}*/
.logo img{
  
  max-width: 250px;
  transition: all 0.6s;
}
.logo:hover img{
  border-color: #f5d59a;
}
.contenedor{
  display: flex;
  flex-direction: column;
  align-items: center;
}
.contenedor section{
  max-width: 600px;
  width: 100%;
  margin-top: 80px;
  align-items: stretch;
}
.contenedor section div{
  flex-grow: 1;
}

h1{
  font-weight: 300;
  text-transform: uppercase;
  color: var(--dorado);
  letter-spacing: 2px;
  text-align: center;
  font-size: 40px;
}
h1 strong{
  font-weight: 600;
}
h3{
  text-align: center;
  color: var(--dorado);
  font-size: 25px;
  font-weight: 400;
}

p{
  color: var(--gris);
  text-align: center;
  font-size: 18px;
  font-weight: 300;
}

.ficha{
  display: flex;
  flex-direction: row;
  border-top: 2px solid var(--dorado);
  padding-top: 30px;
  padding-bottom: 30px;
}
.ficha img{
  display: block;
  flex-grow: 0;
  width: 128px;
  margin-right: 20px;
  align-self: flex-start;
}
.ficha h2{
  color: var(--dorado);
  text-transform: uppercase;
  font-weight: 400;
  letter-spacing: 1px;
  margin-top: 0;
}
.ficha table{
  border-top: 1px solid var(--gris-claro);
  width: 100%;
  border-spacing: 0;
  margin-bottom: 20px;
}
.ficha table tr{
}
.ficha table th{
  text-align: left;
  border-bottom: 1px solid var(--gris-claro);
  margin: 0;
  text-transform: uppercase;
  font-weight: 300;
  font-size: var(--texto-ficha);
  padding: 10px 0;
  color: var(--negro);
}
.ficha table td{
  text-align: right;
  border-bottom: 1px solid var(--gris-claro);
  margin: 0;
  color: var(--dorado);
  font-family: Lora;
}
.ficha table td sub{
  font-size: 10px;
}
.ficha .una-fila{
  margin-top: 55px;
}
.ficha i {
  color: var(--dorado);
}
.ficha .masinfo{
  font-size: 10px;
  text-transform: uppercase;
  color: var(--negro);
}
.ficha .boton1{
  background-color: var(--dorado);
  color: #FFFFFF;
  text-transform: uppercase;
  font-size: var(--texto-ficha);
  width: 100px;
  padding: 10px 0;
  text-align: center;
  display: block;
  float: right;
  text-decoration: none;
}

.ficha .boton1:hover{
  background-color: var(--gris-oscuro);
}

.pre-footer{
  text-align: center;
  color: var(--negro);
  font-size: 12px;
}
.pre-footer a{
  color: var(--negro);
  text-decoration: none;
}
.pre-footer .masinfo{
  text-transform: uppercase;
  color: var(--dorado);
  font-size: 12px;
  font-weight: 500;
  margin-bottom: 5px;
  display: inline-block;
}
.pre-footer .masinfo:hover{
  color: var(--gris-oscuro);
}
.pre-footer i{
  color: var(--gris);
  margin: 10px 5px 0;
}
.pre-footer a:hover i{
  color: var(--dorado);
}
footer{
  background-color: #000000;
  width: 100%;
  text-align: center;
  margin-top: 20px;
}
footer hr{
  border-color: var(--dorado);
  border-style: solid;
  border-width: 1px 0 0 0;
}
footer a{
  color: var(--dorado);
  text-transform: uppercase;
  font-weight: 600;
  font-size: 12px;
  margin: 10px 0 20px;
  display: inline-block;
}
footer a:hover{
  color: #FFFFFF;
}

@media (max-width: 576px){
  .logo img{
    max-width: 100%;
  }
  .logo{
    max-width: 80%;
  }
  .ficha{
    flex-direction: column;
    padding-left: 20px;
    padding-right: 20px;
  }
  .ficha img{
    width: 100%;
    margin: 0 auto 20px;
  }
  .ficha div{
    margin: 0;
  }
  p{
    padding-left: 20px;
    padding-right: 20px;
  }
}