@import url('https://fonts.googleapis.com/css?family=Vollkorn|Roboto+Condensed|Roboto:300,700&display=swap');

/* Shared
–––––––––––––––––––––––––––––––––––––––––––––––––– */
body {
  font-family: 'Roboto', sans-serif;
  font-size:1.25rem;
  font-weight: 300;
  color: #210;
}
#contentspc {
  color:#fff;
  font-family: 'Vollkorn', serif;
  font-weight: 300;
  font-size:1.5rem;
  visibility:hidden;
}
a {
  color: #000;
  background-color: #fff;
  border-color: #fff;
  display:block;
  margin-top:0.75rem;
  text-align:center;
  text-decoration:none;
  text-transform:uppercase;
  border-radius: 100px;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 1.15rem;
  font-weight:900;
  padding:1rem;
}
a:hover {
  color: #FFF;
  background-color: #900;
  border-color: #900;
}

/* Sections
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.section {
  color: #FFF;
  background-color: #000;
  border-color: #000;
  padding:1rem;
  text-align: center;
  border-radius: 24px;
  min-height:20rem;
}
.hidden {
  display:none;
}
.tall .section {
  text-align: left;
  padding: 2rem 0 2rem 0;
}
.tall .hidden {
  display:block;
}

/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.logo {
  margin-top:8rem;
  letter-spacing:-0.6em;
  padding-right: 0.6em;
  color:#fff;
}
.logo::after {
  content: "△△";
}
.tall .logo {
  color:#fff !important;
  margin-top:1rem;
}

/* Modal styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.vv-modal .logo, .vv-modal #contentspc, .vv-modal .section {
  color: #321;
}
.vv-modal .section {
  background-color: #fff;
  border-color: transparent;
}