/* Container layout styles */

body > div.container {
  margin-top: 70px;
}

h3 {
  margin-top: 30px;
}

div.sublead {
  margin-top: -8px;
}

div.container > form {
  width: 60%;
  border: 1px solid black;
  padding: 0.4em;
  margin-top: 1em;
}

td > img.gravatar, p > img.gravatar {
  vertical-align: middle;
  margin-right: 6px;
}

.table tbody > tr > td {
  vertical-align: middle;
}

.table thead > tr > th {
  text-align: center;
}

.multi-line-text {
  display: block;
  line-height: 150%;
}

.td-notes {
  max-width: 250px;
}

#submission-options {
  width: 65%;
}

.link-tag {
  margin-left: 5px;
}

p {
  margin-top:5px;
  line-height: 1.2em;
}

.card {
  border: 1px solid #ccc;
  padding: 20px;
}

.noresize {
  resize: none;
}

h3>.badge {
  vertical-align:middle;
  margin-top: -0.1em;
  font-size:0.7em;
  margin-left: 5px;
}

.info-text {
  color: #0066FF;
}

.label.large {
  font-size: 1em;
}

.mb-2 {
  margin-bottom: 1.5em;
}

/* Small text styling */

strong.warn {
  color: #d9534f;
  font-size: 1.1em;
}

/* Table styles */
div.copyable { overflow: scroll; }
div.copyable table { white-space: nowrap; }
div.copyable table td { padding: 0px 5px; }

/* Set separate background color for grading columns */
.table-striped>tbody>tr>td.grade-cell, .grade-header {
  background-color: rgba(179, 218, 255, 0.5);
}

.panel-heading .accordion-toggle:after {
    /* symbol for "opening" panels */
    font-family: 'Glyphicons Halflings';  /* essential for enabling glyphicon */
    content: "\e114";    /* adjust as needed, taken from bootstrap.css */
    float: right;        /* adjust as needed */
    color: grey;         /* adjust as needed */
}
.panel-heading .accordion-toggle.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\e080";    /* adjust as needed, taken from bootstrap.css */
}

/* Submission listing page */

.table tbody > tr > td.td-notes {
  overflow: hidden;
}

div.dataTables_info {
  display: none;
}

#submissions-listing h3 {
  margin-bottom: 1em;
}

/* Submission detail page */

.top-row {
  margin-top: 10px;
}

.submitter-header {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}

.submitter-info-header {
  margin-top: 5px;
  margin-bottom: 0px;
  font-size: 16px;
}

.submission-info-header {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  margin-top: 0px;
  -webkit-margin-before: 0em;
  line-height: 1em;
}

.submission-info {
  margin-top:0;
  line-height: 1.2em;
  font-size: 16px;
}

.submission-field {
  color: #757575;
  font-size: 20px;
  padding-top: 15px;
  padding-bottom: 15px;
}

.submission-data {
  color: #757575;
  font-size: 18px;
  padding-top: 15px;
  padding-bottom: 15px;
}

.submission-info-details {
  margin-top: 5px;
  font-size: 20px;
  font-weight: 400;
}

.submission-row {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.gif-row {
  padding-left: 15px;
  margin-top: 30px;
  margin-bottom: 30px;
}

.sublead.location {
  font-weight: 200;
  font-size: 16px;
}

/* report grade colour coding */
.bg-blue {
  color: #000;
  background-color: #85D5EC;
  padding: 5px;
  border-radius: 7px;
}
.bg-dark-green {
  color: #000;
  background-color: #8ABF96;
  padding: 5px;
  border-radius: 7px;
}
.bg-light-green {
  color: #000;
  background-color: #B9E0A2;
  padding: 5px;
  border-radius: 7px;
}
.bg-orange {
  color: #000;
  background-color: #FEAA75;
  padding: 5px;
  border-radius: 7px;
}
.bg-yellow {
  color: #000;
  background-color: #FFF9B5;
  padding: 5px;
  border-radius: 7px;
}
.bg-red {
  color: #000;
  background-color: #FE757C;
  padding: 5px;
  border-radius: 7px;
}
.bg-missing {
  padding: 5px;
}

/* Panel Styles */

.panel-body {
  position: relative;
}

.panel-loading {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 1000;
  font-size: 46px;
  color: #fff;
  text-align: center;
  align-content: center;
}