.intro {
  width: 90%; }

#nav {
  width: 90%;
  padding: 10px;
  font-weight: bold; }

.sticky {
  position: fixed;
  top: 0;
  margin-bottom: 20px; }

.hide {
  visibility: hidden; }

.container {
  padding-top: 20px;
  width: 90%; }

.sticky + .container {
  padding-top: 60px; }

.candidate-question {
  text-align: center; }

.row {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
  padding-bottom: 50px;
  border-bottom: 3px solid black; }
  .row .candidate {
    margin-top: 30px;
    flex-basis: 50%;
    text-align: center; }
    .row .candidate .candidate-pic {
      width: 100px;
      border-radius: 50%; }
    .row .candidate h4, .row .candidate h3 {
      font-weight: normal;
      margin: 0; }
    .row .candidate .candidate-name {
      font-weight: bold;
      margin-top: 10px; }
    .row .candidate .candidate-answer {
      font-weight: bold;
      color: white;
      width: 100px;
      margin: 0 auto;
      margin-top: 5px; }
    .row .candidate .Yes {
      background-color: green; }
    .row .candidate .No {
      background-color: black; }
    .row .candidate .Democrat {
      background-color: blue; }
    .row .candidate .Republican {
      background-color: red; }
  .row .text {
    display: none;
    width: 100%; }

@media only screen and (max-width: 500px) {
  .row .candidate {
    flex-basis: 100%;
    margin-bottom: 1rem; } }