/* 
	Standard layout definitions 
*/
/* darker blue */
/* website text blue */
/* gray */
/* orange */
/* darker gray */
/* gray */
/* light gray */
/* small device width */
/* website styles */
/* orange text background (used for BETA) */
/* text styles */
.text-style-small {
  font-size: 1.2em;
  line-height: 1.5em;
  letter-spacing: 0.03125em;
}
.text-style-standard {
  font-size: 1.6em;
  line-height: 1.5em;
  letter-spacing: 0.03125em;
}
.text-style-large {
  font-size: 2.8em;
  line-height: 1.18em;
}
/*
 *  Font Awesome 3.2.1
 *  the iconic font designed for Bootstrap
 *  ------------------------------------------------------------------------------
 *  The full suite of pictographic icons, examples, and documentation can be
 *  found at http://fontawesome.io.  Stay up to date on Twitter at
 *  http://twitter.com/fontawesome.
 *
 *  License
 *  ------------------------------------------------------------------------------
 *  - The Font Awesome font is licensed under SIL OFL 1.1 -
 *    http://scripts.sil.org/OFL
 *  - Font Awesome CSS, LESS, and SASS files are licensed under MIT License -
 *    http://opensource.org/licenses/mit-license.html
 *  - Font Awesome documentation licensed under CC BY 3.0 -
 *    http://creativecommons.org/licenses/by/3.0/
 *  - Attribution is no longer required in Font Awesome 3.0, but much appreciated:
 *    "Font Awesome by Dave Gandy - http://fontawesome.io"
 *
 *  Author - Dave Gandy
 *  ------------------------------------------------------------------------------
 *  Email: dave@fontawesome.io
 *  Twitter: http://twitter.com/davegandy
 *  Work: Lead Product Designer @ Kyruus - http://kyruus.com
 */
/*
@import "awesome/mixins.less";
*/
/* FONT PATH
 * -------------------------- */
@font-face {
  font-family: 'FontAwesome';
src: url('../fonts/awesome/fontawesome-webfont.eot?v=3.2.1');
src: url('../fonts/awesome/fontawesome-webfont.eot?#iefix&v=3.2.1') format('embedded-opentype'), url('../fonts/awesome/fontawesome-webfont.woff?v=3.2.1') format('woff'), url('../fonts/awesome/fontawesome-webfont.ttf?v=3.2.1') format('truetype'), url('../fonts/awesome/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1') format('svg');
font-weight: normal;
font-style: normal;
}
/*
@import "awesome/core.less";
@import "awesome/bootstrap.less";
@import "awesome/extras.less";
@import "awesome/icons.less";
*/.damage-row-flex-wrapper {
  display: flex;
  justify-content: space-between;
}
.damage-row-flex-wrapper > div {
  flex-basis: 33%;
}
.damage-row-flex-wrapper .damage-column-1st {
  flex-basis: 34%;
}
.toggle-row-header {
  font-size: 1.6em;
  line-height: 1.5em;
  letter-spacing: .03125em;
  color: #000;
  background: #deebf2;
  min-height: 1.5em;
  padding: 0.75em;
  margin: 0;
  cursor: pointer;
}
.toggle-row-header:hover {
  background: #acd9ee;
}
.toggle-row-left {
  font-weight: normal;
  display: flex;
}
.damage-header-date {
  width: 6em;
}
.toggle-row-header-nav {
  color: #2064a0;
}
.toggle-row-nav {
  font-family: 'FontAwesome';
}
.damage-content {
  border: 0 !important;
}
.damage-row {
  margin: 0.3em 0;
  break-inside: avoid;
}
.damage-row-content {
  background: #fbfbfb;
  padding: 1.6em;
}
.severity-qualification {
  font-size: 1em;
}
.damage-row-block {
  margin-bottom: 1em;
}
.damage-row-block > ul {
  margin-left: 1em;
  font-size: 1.6em;
  margin-top: 0.5em;
  line-height: 1.4em;
}
.damage-row-block > h2 {
  color: #4d4d4d;
  font-weight: bold;
  margin-bottom: 0.4em;
  font-size: 1.6em;
}
.damage-row-block > h2:after {
  content: ":";
}
.damage-row-block > span.damage-content-text {
  font-weight: normal;
  color: black;
  font-size: 1.6em;
}
@media only screen and (min-width: 741px) {
  .damage-column-2nd {
  border-width: 0 0 0 thin;
  border-radius: 0.2em;
  padding-left: 2em;
}
.damage-column-3rd {
  border-style: solid;
  border-width: 0 0 0 thin;
  border-color: #deebf2;
  border-radius: 0.2em;
  padding-left: 2em;
}

}
.damage-glossary-row-hidden {
  display: none;
}
.damage-glossary-content {
  background: #fbfbfb;
  padding: 1em;
}
.damage-glossary-content .damage-glossary-wrapper {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}
.damage-glossary-content .damage-glossary-entry {
  margin: 0.5em 0;
}
.damage-glossary-content dt.damage-glossary {
  font-size: 1.6em;
  line-height: 1.5em;
  letter-spacing: 0.03125em;
  font-weight: bold;
  color: #4d4d4d;
}
.damage-glossary-content dd.damage-glossary {
  font-size: 1.6em;
  line-height: 1.5em;
  letter-spacing: 0.03125em;
  padding-bottom: 0.2em;
  color: #888888;
}
div.car-svg.left_rear_area .poi-rect.left_rear,
div.car-svg.left_area .poi-rect.left,
div.car-svg.left_front_area .poi-rect.left_front,
div.car-svg.right_rear_area .poi-rect.right_rear,
div.car-svg.right_area .poi-rect.right,
div.car-svg.right_front_area .poi-rect.right_front,
div.car-svg.rear_area .poi-rect.rear,
div.car-svg.front_area .poi-rect.front,
div.car-svg.roof_area .poi-rect.roof,
div.car-svg.vehicle_damaged_on_all_sides .poi-rect.all_sides {
  fill: #deebf2;
  stroke: #5995ba;
}
div.car-svg.left_rear_area .poi-arrow.left_rear,
div.car-svg.left_area .poi-arrow.left,
div.car-svg.left_front_area .poi-arrow.left_front,
div.car-svg.right_rear_area .poi-arrow.right_rear,
div.car-svg.right_area .poi-arrow.right,
div.car-svg.right_front_area .poi-arrow.right_front,
div.car-svg.rear_area .poi-arrow.rear,
div.car-svg.front_area .poi-arrow.front,
div.car-svg.roof_area .poi-arrow.roof,
div.car-svg.vehicle_damaged_on_all_sides .poi-arrow.all_sides {
  fill: #4d4d4d;
}
.car-svg {
  background-color: #ffffff;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-content: center;
  justify-content: center;
  align-items: center;
  min-width: 212px;
}
.car-label {
  font-size: 1.2em;
}
.car-label.full-width {
  width: 100%;
  text-align: center;
}
.car-label.top-label {
  margin-bottom: 0.5rem;
}
.car-label.bottom-label {
  margin-top: 0.5rem;
}
.car-label-rotated.right-label {
  margin-left: 0.4rem;
}
.car-label-rotated.left-label {
  margin-right: 0.4rem;
}
.car-label-rotated {
  transform: rotate(180deg);
  writing-mode: tb-rl;
  white-space: nowrap;
}
div.help.severity {
  color: #0b64a0;
  cursor: help;
  float: left;
}
div.mo.severity {
  width: 25em;
}
.damage-severity-popup-title {
  text-transform: capitalize;
  font-size: 1em;
}
.damage-row-frame-visual-element {
  border-color: #deebf2;
  border-width: 1px;
  border-style: solid;
  margin: 0 0.5em 0.8em;
  padding: 1em;
}
.severity-bar {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-content: center;
  justify-content: center;
  align-items: center;
  background-color: #ffffff;
}
.severity-bar-svg {
  margin-top: 1em;
  margin-bottom: 0.8em;
}
.severity-bar-svg.minor .minor,
.severity-bar-svg.minor_moderate .minor_moderate,
.severity-bar-svg.moderate .moderate,
.severity-bar-svg.moderate_severe .moderate_severe,
.severity-bar-svg.severe .severe {
  fill: #000;
}
.damage-frame-header {
  font-size: 1.3em;
  text-transform: uppercase;
  color: #4d4d4d;
  margin-bottom: 0.5rem;
  font-weight: bold;
}
.details-timeout-wrapper {
  display: grid;
  grid-template-columns: 6% 1fr;
  grid-template-rows: 1fr 1.2fr 1fr 1fr;
  border: #e10000 solid 0.15em;
  padding: 0.625em;
  font-size: 1.6em;
  line-height: 1.5em;
}
.details-timeout-wrapper > .timeout-icon-info {
  margin: auto;
  color: #e10000;
  font-size: 0.9em;
  grid-area: 1 / 1 / 2 / 2;;
}
.details-timeout-wrapper .details-timeout-header {
  margin: auto 0;
  font-weight: 600;
  color: #4d4d4d;
  grid-area: 1 / 2 / 2 / 3;
}
.details-timeout-wrapper .details-timeout-description {
  grid-area: 2 / 2 / 3 / 3;
}
.details-timeout-wrapper .details-timeout-reload {
  grid-area: 3 / 2 / 4 / 3;
}
.details-timeout-wrapper .details-timeout-reload span {
  font-weight: 600;
  color: #4d4d4d;
  line-height: 2em;
}
.details-timeout-wrapper .details-timeout-reload-button {
  grid-area: 4 / 2 / 5 / 3;
  padding: 1em 0;
}
.details-timeout-wrapper .details-timeout-reload-button a {
  color: #fbfbfb;
  background-color: #0b64a0;
  border-radius: 28px;
  cursor: pointer;
  padding: 0.8em 3em;
  text-decoration: none;
}
.details-timeout-wrapper .details-timeout-reload-button a:hover {
  background-color: #003f75;
}
.details-timeout-wrapper .details-timeout-reload-button a:visited {
  color: #fbfbfb;
}
.details-loading-bar {
  position: relative;
  width: 100%;
  height: 1em;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  overflow: hidden;
}
.details-loading-bar:after {
  content: '';
  background: #5995ba;
  position: absolute;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  width: 0;
  height: 100%;
  animation: load 30s 1;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
}
@keyframes load {
 from {
  width: 0;
}
to {
  width: 100%;
}

}
.damage-column-2nd {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
@media only screen and (max-width: 740px) {
  .damage-row-flex-wrapper {
  flex-direction: column;
}
.damage-column-2nd,
.damage-column-3rd {
  border-width: thin 0 0 0;
  padding-left: 0;
}
.details-timeout-wrapper {
  flex-direction: column;
}
.details-timeout-reload {
  align-items: center;
}

}
@media only screen and (min-width: 792px) {
  .damage-column-2nd,
.damage-column-3rd {
  margin-left: 2em;
}

}
#severity-scale-specific-help-qualification {
  margin-top: 3.5em;
}
#severity-scale-help-popup {
  margin-top: 1em;
}
.severity-bar-legend {
  display: flex;
  justify-content: space-between;
}
.severity-bar-column {
  font-size: 1.2em;
}
.severity-info-icon {
  font-size: 1em;
  position: relative;
}
.severity-bar-header-info-icon {
  font-size: 1em;
  position: relative;
  bottom: 3px;
  left: 4px;
}
.damage-placeholder-background {
  background-color: #ffffff;
}
div.help.repair-cost {
  color: #0b64a0;
  cursor: help;
  float: left;
  font-weight: bold;
  font-size: 1.6em;
  margin-bottom: 0.4em;
  width: 100%;
}
div.mo.repair-cost {
  width: 25em;
}
.append-colon:after {
  content: ":";
}
.damage-data-survey-thumbs {
  padding-top: 0.3em;
}
.damage-data-survey-thumbs p {
  display: inline;
}
.damage-data-survey-thumbs svg {
  position: relative;
  top: 0.28em;
}
.damage-data-survey {
  font-family: Roboto, Arial, Helvetica, sans-serif;
  color: black;
  font-size: 1.6em;
  text-align: left;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
  border-left: 0.7em solid #f2b608;
  justify-content: center;
  z-index: 150;
  background-color: white;
}
.survey-apply-spacing {
  padding: 0.7em;
  margin: 1em;
}
.damage-survey-flex-container {
  display: flex;
}
.damage-survey-flex-container input,
.damage-survey-flex-container label {
  cursor: pointer;
}
.damage-survey-flex-container .damage-survey-title {
  font-weight: bold;
}
.damage-survey-flex-container .damage-survey-flex-container-thumb {
  display: inline-block;
  flex-direction: row;
  flex-basis: 50%;
}
.damage-survey-flex-container .damage-survey-flex-container-left-bar {
  flex-basis: 92%;
}
.damage-survey-flex-container .damage-survey-flex-container-right-bar {
  flex-basis: 8%;
  position: relative;
}
.damage-survey-flex-container .damage-survey-flex-container-right-bar .submit {
  position: absolute;
  color: grey;
  bottom: 0.6em;
  right: 0.6em;
}
.damage-survey-flex-container .damage-survey-flex-container-right-bar .submit.enabled {
  color: #0b6496;
}
.damage-survey-cursor {
  cursor: pointer;
  color: #0b6496;
}
.damage-data-survey-input {
  display: flex;
  justify-content: space-between;
  flex-direction: row;
}
.damage-data-survey-input input[type="checkbox"]:checked:before {
  content: "✔";
  color: #FFFFFF;
  background-color: #0B64A0;
  border-radius: 2px;
  display: inline-block;
  width: 100%;
  height: 100%;
  text-align: center;
  line-height: 1;
  position: relative;
  top: -1px;
  padding-bottom: 0.5px;
}
.damage-data-survey-input-questions {
  margin-bottom: 0.6em;
}
.damage-data-survey-input-questions input {
  margin-right: 0.5em;
}
.damage-data-survey-thank-you {
  color: black;
  font-size: 16px;
  position: relative;
  top: -0.2em;
}
.damage-data-survey-thank-you svg {
  position: relative;
  top: 0.28em;
}
.damage-data-survey-thank-you p {
  display: inline;
}
.damage-data-survey-input button {
  margin-top: 10px;
  padding: 5px 10px;
  border: none;
  background-color: lightblue;
  color: black;
  border-radius: 5px;
  cursor: pointer;
}
.damage-data-survey-input input {
  margin-top: 10px;
  padding: 5px;
  border: 1px solid #ccc;
  border-radius: 5px;
}
.damage-data-survey-close-button {
  position: absolute;
  top: 0px;
  right: 0px;
  cursor: pointer;
}
.damage-survey-hidden-animation {
  opacity: 0;
  height: 0;
  overflow: hidden;
  transition: opacity 0.7s ease, height 0.7s ease;
}
.damage-survey-show-animation {
  opacity: 1;
  height: auto;
}
.no-damage-message-box-parent {
  border-left: 4px solid #3ba52b;
}
.no-damage-message-box-child {
  font-size: 1.6em;
  line-height: 1.5em;
  letter-spacing: 0.03125em;
  border-right: 1px solid #b4b4b4;
  border-top: 1px solid #b4b4b4;
  border-bottom: 1px solid #b4b4b4;
}
.no-damage-message-box-child .no-damage-message {
  padding: 16px 16px 16px 12px;
  display: flex;
}
.no-damage-message-box-child div {
  padding: 0;
}
.no-damage-message-box-child div span {
  color: #4d4d4d;
}
.no-damage-message-box-child div span.status {
  font-weight: bold;
}
.no-damage-message-box-child div.icon {
  padding-right: 8px;
  white-space: nowrap;
  width: 20px;
}
.no-damage-message-box-child div.icon span.fa {
  line-height: 24px;
  font-size: 24px;
  color: #3ba52b;
}
