/* fix to prevent progress page labels from overlapping side bar dropdowns */
.menu.transition.visible {
  z-index: 111;
}

/* this is to fix semantic ui 2.3 bug where modal doesn't center */
.ui.basic.modal.transition.visible.active {
  margin-top: 20% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* this is to fix semantic ui 2.3 bug where modal doesn't center */
.ui.modal.transition.visible.active {
  margin-top: 10% !important;
  margin-left: 20% !important;
  margin-right: auto !important;
}

.burger {
  position: absolute;
  x: -10px;
  y: -10px;
  z-index: 99;
}
.reportTitle {
  padding-left: 20px;
  font-size: 14px;
}

.mainContainer {
  position: relative;
  width: 900px;
}

.numbered textarea {
  background: url(http://i.imgur.com/2cOaJ.png) !important;
  background-attachment: local !important;
  background-repeat: no-repeat !important;
  font-size: 13px !important;
  padding-left: 35px !important;
  padding-top: 10px !important;
  border-color: #ccc !important;
  overflow-y: scroll !important;
  resize: none !important;
}

.landing-image {
  background: url('/images/lp-bg-image.jpg') no-repeat center center fixed;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  /* Set a specific height */
  height: 100%;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: absolute;
  /* Position and center the image to scale nicely on all screens */
  /* background-position: center;
  background-repeat: no-repeat;
  position: relative; */
}

.logo-reversed {
  /*background-image: url('/images/Logo-Reversed.svg') !important;*/
  /*background-size: cover !important;*/

  /* Set a specific height */
  height: 100%;

  /* Position and center the image to scale nicely on all screens */
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}

.student-list {
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: top;
  align-items: top;
  -webkit-justify-content: left space-between;
  justify-content: left space-between;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  -webkit-align-content: flex-end;
  align-content: flex-end;
  padding: 5px;
  width: 90%;
}

.student-label {
  margin: 10px !important;
  padding: 15px;
  white-space: nowrap;
  font-size: 12px;
  min-width: 120px;
  text-align: center;
}

.student-label-sm {
  margin: 2px;
  padding: 0px;
  white-space: nowrap;
  font-size: 10px;
  width: 120px;
  height: 20px;
}

.student-label-obscure {
  padding: 0px;
  border: none;
  background: transparent;
  color: #969d9c;
  white-space: nowrap;
  /*    -webkit-appearance: none;
*/
  margin: 5px;
  font-size: 12px;
  width: 190px;
  height: 25px;
}

.trustedTable th {
  padding: 15px;
  font-weight: bold;
}

.trustedTable td {
  padding: 2px;
  margin: 2px;
  text-align: center;
}

.trustedTable td.enemies {
  padding: 2px;
  margin: 2px;
  color: red;
}

.enemiesTable {
  padding: 2px;
  margin: 2px;
  border: 0;
  width: 700px;
}

.enemiesTable tr {
  padding: 2px;
  margin: 5px;
  border-top: 1px solid #606060;
}

.enemiesTable td {
  padding: 2px;
  margin: 2px;
  text-align: left;
}

.enemiesTable td.enemies {
  padding: 2px;
  margin: 2px;
  color: red;
  width: 70%;
}

.quadLine {
  stroke: #a0a0a0;
  stroke-width: 1;
  fill: none;
}

/* Override */
.ui.menu {
  opacity: 1;
  z-index: 1;
}
.scaling-svg-container {
  position: relative;
  height: 0;
  width: 100%;
  padding: 0;
  padding-bottom: 100%;
  /* over-ride this inline for aspect ratio other than square */
}
.scaling-svg {
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0;
  top: 100;
}

svg .hoverBar {
  fill: rgb(191, 226, 236);
  opacity: 0;
  stroke: 1;
  border-radius: 5px;
  z-index: 99;
}

svg .hoverBar:hover {
  opacity: 0.3;
  stroke: 1;
  z-index: 99;
}

svg .hoveredBar {
  fill: rgb(191, 226, 236);
  opacity: 0.3;
  stroke: 1;
  border-radius: 5px;
  z-index: 99;
}

svg .hoveredName {
  fill: #4332d8;
  /* stroke: #0d86a8; */
}

cancelled: {
  color: red;
}

.response-icon {
  height: 10px;
  width: 10px;
  border-radius: 50%;
  margin-right: 0.5em;
}

#legend {
  display: flex;
  flex: 1;
  justify-content: flex-end;
  align-items: center;
}

#legend p {
  padding-right: 2em;
}

.ui.modal > .content {
  width: 95%;
}

.rt-th {
  text-align: left;
}