:root {

  --font-familia: 'Ubuntu', sans-serif;
  --h1-h2-family: 'Old Standard TT', serif;
  --font-size: 18px;
}

body {
  font-family: var(--font-familia);
  font-size: var(--font-size);

}

header {

  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../img/photo.png");
  height: 80vh;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  color: #fff;
}

.navbar-dark .navbar-toggler {
  border-color: #f9fafb;
}

.nav-pills .nav-link.active {
  opacity: 0.8;
  cursor: pointer;
  background-color: #333;
}



.nav-pills .nav-link.active:hover {
  opacity: 1;

}


h1, h2, h3 {
  font-family: var(--h1-h2-family);
}

.margin-top {
  margin-top: 15vh;
  ;
}

footer {
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../img/photo.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 80vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.footer {
  border-top: 1px solid #fff;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  color: #fff;
  position: relative;
  top: 20%;
}
.card{
  max-width: 57rem;
  padding: 4rem;
}

.color-white{
  color:#fff;
}


@media all and (max-width: 800px) {
  .flx-row {
    display: flex;
    flex-direction: row !important;
  }

  .flx-center{
    justify-content: center;
    align-items: center;
    padding-top: 1rem;
  }
}