#cabecera {
  /* background-color: gray; */
  color: darkblue;
  height: 15%;
  text-align: center;
  padding: 1rem;
}

#cuerpo {
  /* background-color: blanchedalmond; */
  color: brown;
  height: 70%;
}

#pie {
  /* background-color: lightgray; */
  color: white;
  height: 15%;
  padding: 1.2rem;
}

#fotoCabecera {
  height: 50%;
  border-radius: 50%;
}

#titulo {
  display: inline-block;
}

#menu {
  display: inline-block;
  margin-left: 1rem;
}

.principales {
  width: 100%;
}

/* DE ESTE MODO CREAMOS UN COMPONENTE PROPIO */
.tarjeta {
  width: 42%;
  height: 42%;
  background-color: white;
  border: 1px solid gray;
  border-radius: 25px;
  box-shadow: 5px 6px 5px 5px lightgrey;
  margin: 1.2rem 0.5rem 1.2rem 2rem;
  display: inline-block;
  padding: 0.5rem;
}

.marco {
  margin-top: 1rem;
  width: 100%;
  height: 50%;

}

.foto {
  width: 18%;
  height: 90%;
  border-radius: 50%;
}

.separaItems {
  margin: 0 5rem;
}