.header {
  display: block;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 75px;
  position: fixed;
  background-color: #295B18;
  border: 1px solid #888;
  font-size: 4em;
  text-align: center;
}

.stmt {
  display: block;
  background-color: #CF9D15;
  color: #295B18;
  top: 75px;
  position: fixed;
}

nav {
  width: 25%;
  height: 100%;
  float: left;
  display: block;
  margin: 0;
  padding: 0;
  margin-right: 10px;
  top: 76px;
  left: 0px;
  position: fixed;
  border: 1px solid #888;
  background-color: #CF9D15;
  overflow-y: auto;
}

ul {
  padding-left: 5px;
  list-style-type: none;
}

li {
  margin-left: 0px;
  padding-bottom: 7px;
}

.unchosen {
  background-color: #295B18;
  color: white;
}

.chosen {
  background-color: #F4D43F;
}

.undrawn {
  background-color: #295B18;
  color: #295B18;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
 -o-user-select: none;
}

.undrawn::selection {
  background-color: #295B18;
  color: #295B18;
}

.undrawn::-moz-selection {
  background-color: #295B18;
  color: #295B18;
}

.drawn {
  background-color: #F4D43F;
}

body {
  font-family: Arial, Helvetica, sans-serif;
}

.link {
  cursor: pointer;
  color: blue;
  text-decoration: underline;
}

#divGender {
  display: block;
  top: 76px;
  /* left: calc on form load */
  width: 75%;
  height: 100%;
  position: fixed;
  /* border: 1px solid #888; */
  visibility: hidden;
}

#divRetreat {
  display: block;
  top: 76px;
  /* left: calc on form load */
  width: 75%;
  height: 100%;
  position: fixed;
  /* border: 1px solid #888; */
  visibility: hidden;
}

#divCore {
  display: block;
  top: 76px;
  /* left: calc on form load */
  width: 75%;
  height: 100%;
  position: fixed;
  /* border: 1px solid #888; */
  visibility: hidden;
}

#divRetreatants {
  display: block;
  top: 76px;
  /* left: calc on form load */
  width: 75%;
  height: 100%;
  position: fixed;
  /* border: 1px solid #888; */
  visibility: hidden;
}

#divTeam {
  display: block;
  top: 76px;
  /* left: calc on form load */
  width: 75%;
  height: 100%;
  position: fixed;
  /* border: 1px solid #888; */
  visibility: hidden;
}

#eligibleTable {
  display: block;
  top: 76px;
  /* left: calc on form load */
  width: 75%;
  height: 100%;
  position: fixed;
  /* border: 1px solid #888; */
  visibility: hidden;
  overflow: scroll;
}

#zero {
  float: left;
  width: 32%;
}

#onetwo {
  float: left;
  width: 32%;
}

#three {
  float: left;
  width: 32%;
}

.gap {
  float: left;
  width: 10px;
}

h2 {
  text-align: center;
}

.elevated {
  visibility: hidden;
}

.instruction {
  color: Red;
  font-size: x-small;
  text-indent: 15px;
}

@media screen and (max-width: 960px) {
  .header {
      font-size: 3em;
      height: 55px;
  }
  nav {
      top: 56px;
  }
  #divform {
    top: 56px;
  }
}

@media screen and (max-width: 720px) {
  .header {
      font-size: 2em;
      height: 35px;
  }
  nav {
      top: 36px;
  }
  #divform {
    top: 36px;
  }
}

@media screen and (max-width: 490px) {
  .header {
      font-size: 1em;
      height: 15px;
  }
  nav {
      top: 16px;
  }
  #divform {
    top: 16px;
  }
}