@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;1,400;1,700&display=swap");
:root {
  --blue: #254374;
  --light_blue: #7898ff;
  --green: #00d499;
  --red: #e65e5d;
  --orange: #ef8d4c;
  --alt_blue: #7898ff;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

html {
  box-sizing: border-box;
  scroll-behavior: smooth;
}

*, *:before, *:after {
  box-sizing: inherit;
}

* {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
}

body {
  display: block;
  font-size: 18px;
  color: #000;
  width: 100%;
  background: #FFF;
  font-family: Ariel, sans-serif;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  background: #FAFAFA;
}

body:not(#login){
  min-width: 1080px;  
}

body * {
  font-size: 1rem;
  color: #3a3a3a;
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: normal;
}

body * em {
  font-size: inherit;
  font-weight: inherit;
  font-style: italic;
  color: inherit;
  font-family: inherit;
}

body * strong {
  font-size: inherit;
  font-weight: 700;
  font-style: inherit;
  color: inherit;
  font-family: inherit;
}

body * span {
  font-size: inherit;
  font-weight: inherit;
  font-style: inherit;
  color: inherit;
  font-family: inherit;
}

body * a {
  font-size: inherit;
  font-weight: inherit;
  font-style: inherit;
  font-family: inherit;
  text-decoration: none;
}

@media screen and (min-width: 820px) {
  body * a:hover {
    text-decoration: underline;
  }
}
#wrapper {
  width: 100%;
  padding: 0 0 40px 0;
  background: #FFF;
}

h1 {
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1.3em;
  padding-bottom: 20px;
}

h2 {
  font-size: 1.4rem;
  line-height: 1.3em;
  padding-bottom: 12px;
  font-weight: 700;
}

h2.title {
  padding: 20px 5% 16px 5%;
  display: block;
  clear: both;
}

h3 {
  font-size: 1.1rem;
  font-weight: 700;
  color: #2c518a;
  padding: 16px 5% 12px 5%;
}

p {
  font-size: 1rem;
  line-height: 1.4;
  padding-bottom: 9px;
}

p.error, p.success, p.information {
  font-size: 1rem;
  position: relative;
  width: 100%;
  color: #FFF !important;
  padding: 12px 20px 12px;
  margin-bottom: 20px;
  display: inline-block;
}

p.error a, p.success a, p.information a {
  color: #FFF;
  font-weight: 600;
}

p.error {
  background: #e65e5d;
}

p.success {
  background: #00d499;
}

p.information {
  background: #ef8d4c;
}

p.emph {
  font-size: 1.4rem;
  line-height: 1.3em;
  padding-bottom: 12px;
  font-weight: 700;
  padding: 20px 5% 16px 5%;
  display: block;
  clear: both;
}

p.emph + p {
  display: none;
}

.powered_by_wrapper {
  width: 100%;
  height: auto;
  display: inline-block;
}

.powered_by_badge {
  width: 180px;
  height: auto;
  display: block;
  margin: 12px auto 0;
}

.powered_by_badge img {
  width: 100%;
  height: auto;
}

body#login.help #wrapper .page {
  height: auto;
  overflow: hidden;
}

body#login.help #wrapper {
  overflow: visible !important;
}

body#login .powered_by_wrapper {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 10px;
}

/* Nav */
#header {
  width: 100%;
  height: 90px;
  background: #FFF;
  padding: 0 2.5%;
  position: relative;
}

#header #site_select_form {
  width: 25%;
  display: inline-block;
  float: left;
  margin-bottom: 0;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

#header #site_select_form label {
  padding-bottom: 3px;
  font-size: 0.9rem;
  opacity: 0.6;
}

#header #site_select_form select {
  margin-bottom: 0;
  padding: 0 40px 0 0;
  height: auto;
  line-height: 1;
  border: none;
  font-size: 1.1rem;
}

#header h1.logo {
  padding-bottom: 0;
  width: 50%;
  height: 90px;
  display: inline-block;
  float: left;
}

#header h1.logo a {
  width: 100%;
  height: 90px;
  background: url(../../admin/editable/media/images/logo.svg);
  background-size: auto 50px;
  background-repeat: no-repeat;
  background-position: center;
  text-indent: -9999px;
  display: inline-block;
}

#header .logout {
  float: right;
  background: #234374;
  display: inline-block;
  width: auto;
  height: 40px;
  line-height: 38px;
  padding: 0 30px 0 50px;
  font-size: 0.9rem;
  color: #FFF;
  font-weight: bold;
  background-image: url(../../admin/core/media/images/logout.svg);
  background-size: 20px;
  background-position: left 16px center;
  background-repeat: no-repeat;
  margin-top: 25px;
  text-decoration: none !important;
  transition: background 300ms ease;
  border-radius: 3px;
  margin-right: 5%;
}

@media screen and (max-width: 1440px) {
  #header .logout {
    margin-right: 7%;
  }
}
#header .logout:hover {
  background-color: #2c518a;
}

ul.nav {
  width: 100%;
  height: 80px;
  overflow: hidden;
  background: #234374;
  position: relative;
  padding: 0 2.5%;
  text-align: right;
  display: flex;
}

ul.nav.site_downloads {
  padding-left: 16%;
}

ul.nav .site_downloads {
  width: 12.5%;
  position: absolute;
  left: 2.5%;
  top: 0;
}

ul.nav .site_downloads .site_map, ul.nav .site_downloads .inclusion_list {
  width: 47.5%;
  height: 60px;
  display: inline-block;
  background: #2c518a;
  float: left;
  text-align: center;
  margin: 10px 0 10px 5%;
  color: #FFF;
  font-size: 0.66rem;
  margin-top: 10px;
  border-radius: 3px;
  background-size: 20px;
  background-position: center top 12px;
  background-repeat: no-repeat;
  padding-top: 40px;
  font-weight: 700;
  text-decoration: none !important;
}

ul.nav .site_downloads .site_map {
  background-image: url(../images/icons/map.svg);
  margin-left: 0;
}

ul.nav .site_downloads .inclusion_list {
  background-image: url(../images/icons/inclusion_list.svg);
  background-position: center top 14px;
}

ul.nav li:not(.site_downloads) {
  background-position: center top 14px;
  background-size: 32px;
  background-repeat: no-repeat;
  display: inline-block;
  flex-basis: 9%;
  flex-grow: 1;
  width: auto;
  height: 80px;
  border-right: 1px solid #2c518a;
  text-align: center;
  position: relative;
  margin-right: -5px;
  transition: background-color 300ms ease;
}

ul.nav li:not(.site_downloads):first-of-type {
  border-left: 1px solid #2c518a;
}

ul.nav li:not(.site_downloads) a {
  text-decoration: none !important;
}

ul.nav li:not(.site_downloads):hover {
  background-color: #2c518a;
}

ul.nav li:not(.site_downloads).logout {
  background-image: url(../../admin/core/media/images/logout.svg);
}

ul.nav li:not(.site_downloads).change_password {
  background-image: url(../../admin/core/media/images/admin.svg);
}

ul.nav li:not(.site_downloads).profile {
  background-image: url(../../admin/core/media/images/customers.svg);
}

ul.nav li:not(.site_downloads).profiles {
  background-image: url(../../admin/core/media/images/users.svg);
}

ul.nav li:not(.site_downloads).materials {
  background-image: url(../../admin/core/media/images/ordering.svg);
  background-size: 26px;
  background-position: center top 16px;
}

ul.nav li:not(.site_downloads).nhbc {
  background-image: url(../../admin/core/media/images/nhbc.svg);
  background-size: 32px;
  background-position: center top 14px;
}

ul.nav li:not(.site_downloads).cc {
  background-image: url(../../admin/core/media/images/customer_care.svg);
}

ul.nav li:not(.site_downloads).certificates {
  background-image: url(../../admin/core/media/images/certificates.svg);
}

ul.nav li:not(.site_downloads).documents {
  background-image: url(../images/icons/document.svg);
}

ul.nav li:not(.site_downloads).wages {
  background-image: url(../../admin/core/media/images/wages.svg);
}

ul.nav li:not(.site_downloads).issues {
  background-image: url(../../admin/core/media/images/issues.svg);
  background-size: 30px;
}

ul.nav li:not(.site_downloads).inspections {
  background-image: url(../../admin/core/media/images/search_white.svg);
  background-size: 34px;
}

ul.nav li:not(.site_downloads).contra-charges {
  background-image: url(../images/icons/contra.svg);
  background-size: 28px;
  background-position: center top 16px;
}

ul.nav li:not(.site_downloads).site {
  background-image: url(../images/icons/sitemap@2x.png);
  background-size: 30px;
}

ul.nav li:not(.site_downloads).cv {
  background-image: url(../../admin/core/media/images/variations.svg);
}

ul.nav li:not(.site_downloads).site_map {
  background-image: url(../images/icons/map.svg);
  background-size: 24px;
  background-position: center top 18px;
}

ul.nav li:not(.site_downloads).inclusion_list {
  background-image: url(../images/icons/inclusion_list.svg);
  background-size: 24px;
  background-position: center top 20px;
}

ul.nav li:not(.site_downloads) a {
  padding: 54px 0 0 0;
  display: inline-block;
  width: 100%;
  height: 80px;
  font-size: 0.8rem;
  color: #FFF;
  font-weight: 300;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

@media screen and (max-width: 1500px) {
  ul.nav li:not(.site_downloads) a {
    font-size: 0.8rem;
  }
}
@media screen and (max-width: 1180px) {
  ul.nav li:not(.site_downloads) a {
    font-size: 0.7rem;
    padding-top: 55px;
  }
}
ul.nav li:not(.site_downloads) a span {
  position: absolute;
  left: 60%;
  top: 8px;
  margin: auto;
  width: auto;
  min-width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  font-size: 0.66rem;
  border-radius: 50%;
  background: #e65e5d;
  color: #FFF;
  font-weight: 700;
  padding: 0 2px;
}

ul.nav li:not(.site_downloads).active {
  background-color: #2c518a;
}

.page_nav,
.module_nav,
#module_nav {
  width: 100%;
  height: auto;
  overflow: hidden;
  background: #2c518a;
  margin-bottom: 20px;
  padding: 1% 2.5%;
}

.page_nav li a,
.module_nav li a,
#module_nav li a {
  display: inline-block;
  width: 18.4%;
  margin-right: 2%;
  float: left;
  background: #FFF;
  padding: 12px 0 13px;
  text-align: center;
  color: #2c518a;
  font-weight: 700;
  font-size: 0.8rem;
  position: relative;
  margin-bottom: -2px;
}

.page_nav li a span,
.module_nav li a span,
#module_nav li a span {
  position: absolute;
  top: -10px;
  right: -10px;
  width: auto;
  min-width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #e65e5d;
  line-height: 19px;
  text-align: center;
  color: #FFF;
  font-size: 0.66rem;
  padding: 0 4px;
}

.page_nav li a:after,
.module_nav li a:after,
#module_nav li a:after {
  content: "";
  background: #FFF;
  height: 2000%;
  width: 100%;
  position: absolute;
  top: 100%;
  margin-top: -2px;
  left: 0;
  right: 0;
  z-index: 999;
  opacity: 0;
}

.page_nav li a.active,
.module_nav li a.active,
#module_nav li a.active {
  background: #FFF;
}

.page_nav li a.active:after,
.module_nav li a.active:after,
#module_nav li a.active:after {
  opacity: 1;
}

.page_nav li:nth-of-type(5n) a,
.module_nav li:nth-of-type(5n) a,
#module_nav li:nth-of-type(5n) a {
  margin-right: 0;
}

.page_nav li.search form,
.module_nav li.search form,
#module_nav li.search form {
  width: 40%;
  float: right;
  position: relative;
}

.page_nav li.search form label,
.module_nav li.search form label,
#module_nav li.search form label {
  display: inline-block;
  width: auto;
  float: left;
  font-size: 0.9rem;
  color: #FFF;
  line-height: 40px;
  width: auto;
  margin-right: 20px;
  padding-bottom: 0;
}

.page_nav li.search form input,
.module_nav li.search form input,
#module_nav li.search form input {
  width: 80%;
  display: inline-block;
  float: left;
  margin-right: 2%;
  margin-bottom: 0;
  border: none;
}

.page_nav li.search form button,
.module_nav li.search form button,
#module_nav li.search form button {
  width: 18%;
  margin-top: 0;
  float: left;
  background: #234374 !important;
}

.page_nav + h2.title,
.module_nav + h2.title,
#module_nav + h2.title,
.page_nav + p.emph,
.module_nav + p.emph,
#module_nav + p.emph {
  padding-top: 0;
}

.page_nav + a.back,
.module_nav + a.back,
#module_nav + a.back {
  width: 200px;
  height: 40px;
  margin-left: 5%;
  background: #2c518a;
  display: inline-block;
  text-align: center;
  line-height: 40px;
  color: #FFF;
  font-weight: 700;
  font-size: 0.9rem;
  border-radius: 5px;
}

ul.page_sub_nav {
  float: left;
  width: 100%;
  padding: 0 2.5%;
  margin-bottom: 30px;
}

ul.page_sub_nav li a {
  float: left;
  width: 18.4%;
  margin-right: 2%;
  color: #FFF;
  padding: 12px 0 13px;
  text-align: center;
  display: inline-block;
  font-size: 0.8rem;
  position: relative;
  background: #2c518a;
  /*	border-right: 2px solid #FFF;*/
  text-decoration: none !important;
}

ul.page_sub_nav li a span{
  position: absolute;
  top: -10px;
  right: -10px;
  width: auto;
  min-width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #e65e5d;
  line-height: 19px;
  text-align: center;
  color: #FFF;
  font-size: 0.66rem;
  padding: 0 4px;
}

ul.page_sub_nav li:nth-of-type(5) a {
  margin-right: 0;
}

ul.page_sub_nav li a.active {
  background: #7898ff;
  position: relative;
}

ul.page_sub_nav:not(:last-of-type) li a.active:after {
  content: "";
  width: 100%;
  height: 20px;
  position: absolute;
  top: 100%;
  left: 0;
  background: #7898ff;
}

ul.page_sub_nav.sub_sub_nav {
  background: #7898ff;
  padding-top: 1%;
  padding-bottom: 1%;
  margin-top: -10px;
  overflow: hidden;
}

ul.page_sub_nav.sub_sub_nav li a {
  background: #FFF;
  color: #2c518a;
  position: relative;
}

ul.page_sub_nav.sub_sub_nav li a.active:after {
  content: "";
  width: 100%;
  height: 60px;
  position: absolute;
  top: 100%;
  left: 0;
  background: #FFFFFF;
}

/* Forms */
form {
  width: 100%;
  height: auto;
  display: inline-block;
}

form:not(:last-child) {
  margin-bottom: 26px;
}

form p, form h2, form legend {
  font-size: 1.3rem;
  padding-bottom: 18px;
  width: 100%;
  display: inline-block;
}

form legend {
  display: none;
}

@media screen and (max-width: 1180px) {
  form p, form h2, form legend {
    padding-bottom: 8px;
  }
}
form p.error, form h2.error, form legend.error {
  color: #e65e5d;
}

form p.success, form h2.success, form legend.success {
  color: #00d499;
}

form h3 {
  padding-left: 0;
  padding-right: 0;
}

form p {
  font-size: 1rem;
  padding-bottom: 14px;
}

form ol li {
  position: relative;
  display: inline-block;
  width: 100%;
}

form li.quarter {
  width: 23.5%;
  display: inline-block;
  float: left;
  margin-right: 2%;
}

form li.quarter:nth-of-type(4n) {
  margin-right: 0;
}

form li.half {
  width: 49%;
  display: inline-block;
  float: left;
  margin-right: 2%;
}

form li.half:nth-of-type(2n) {
  margin-right: 0;
}

form li.hidden {
  display: none;
}

form label,
form fieldset + h3 {
  font-size: 0.9rem;
  display: inline-block;
  width: 100%;
  padding-bottom: 8px;
  line-height: 1.3;
}

@media screen and (max-width: 1180px) {
  form label,
  form fieldset + h3 {
    font-size: 0.8rem;
  }
}
form label.checkbox-style,
form fieldset + h3.checkbox-style {
  margin-bottom: 18px;
  padding-left: 46px;
  padding-top: 5px;
  padding-bottom: 0;
  min-height: 30px;
  position: relative;
}

form label.checkbox-style:before,
form fieldset + h3.checkbox-style:before {
  content: "";
  width: 30px;
  height: 30px;
  border: 1px solid #d2d2d2;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  border-radius: 5px;
}

form label.checkbox-style:after,
form fieldset + h3.checkbox-style:after {
  content: "✔";
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  position: absolute;
  font-size: 1.2rem;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  color: #234374;
  opacity: 0;
  transition: opacity 100ms ease;
}

form label.checkbox-style.checked:after,
form fieldset + h3.checkbox-style.checked:after {
  opacity: 1;
}

form label.radio-style,
form fieldset + h3.radio-style {
  margin-bottom: 18px;
  padding-left: 46px;
  padding-top: 5px;
  padding-bottom: 0;
  min-height: 30px;
  position: relative;
}

form label.radio-style:before,
form fieldset + h3.radio-style:before {
  content: "";
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid #d2d2d2;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}

form label.radio-style:after,
form fieldset + h3.radio-style:after {
  content: "";
  width: 20px;
  height: 20px;
  text-align: center;
  position: absolute;
  font-size: 1.2rem;
  top: 0;
  bottom: 0;
  left: 5px;
  border-radius: 50%;
  margin: auto;
  background: #234374;
  opacity: 0;
  transition: opacity 300ms ease;
}

form label.radio-style.checked:after,
form fieldset + h3.radio-style.checked:after {
  opacity: 1;
}

form input.radio {
  margin: 0 8px;
  width: 1.6em;
  height: 1.6em;
}

form li.warning label {
  display: none;
}

form span.warning,
form fieldset + h3 span.warning,
form span.alert,
form fieldset + h3 span.alert {
  width: 100%;
  height: auto;
  color: #e65e5d;
  padding: 2px 0 10px 28px;
  display: inline-block;
  width: 100%;
  font-size: 0.9rem;
  margin-top: 0;
  margin-bottom: 0;
  background-image: url(../../admin/core/media/images/warning.svg) !important;
  background-repeat: no-repeat !important;
  background-size: 20px !important;
  background-position: left top 0;
}

form span.alert,
form fieldset + h3 span.alert {
  color: #ef8d4c;
  background-image: url(../../admin/core/media/images/alert.svg) !important;
}

form span.auth_alert {
  display: none;
  float: left;
  clear: left;
  margin-top: 8px !important;
}

form input:not([type=checkbox]):not([type=radio]),
form select,
form textarea,
form fieldset + h3 + p {
  width: 100%;
  height: 40px;
  padding: 0 20px;
  border: 1px solid #d2d2d2;
  line-height: 38px;
  border-radius: 0;
  margin-bottom: 12px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: #FFF;
  font-size: 1rem;
  border-radius: 3px;
}

@media screen and (max-width: 1180px) {
  form input:not([type=checkbox]):not([type=radio]),
  form select,
  form textarea,
  form fieldset + h3 + p {
    padding: 0 12px;
    font-size: 0.8rem;
  }
}
form select {
  background-image: url(../../admin/core/media/images/dropdown.svg);
  background-repeat: no-repeat;
  background-size: 12px;
  background-position: right 14px center;
  padding-right: 40px;
}

form select option.title {
  background: #7898ff;
  color: #FFF;
  padding: 4px;
}

form textarea {
  height: 160px;
  padding: 20px;
  resize: vertical;
  line-height: 1.3;
}

form input[disabled=disabled], form input[disabled],
form select[disabled=disabled], form select[disabled],
form textarea[disabled=disabled], form textarea[disabled] {
  background: #eee !important;
  opacity: 1;
}

@media screen and (max-width: 1180px) {
  form textarea {
    padding: 12px;
  }
}
form fieldset + h3 + p {
  background-color: #EEE;
}

form button {
  width: 100%;
  height: 40px;
  background: #234374;
  color: #FFF;
  font-size: 0.9rem;
  font-weight: 700;
  margin-top: 8px;
  cursor: pointer;
  border-radius: 3px;
  transition: background 300ms ease;
}

form button:hover {
  background: #2c518a;
}

form button.error {
  background: #e65e5d;
}

form button.success {
  background: var(--green);
}

@media screen and (max-width: 1180px) {
  form button {
    font-size: 0.8rem;
  }
}
form dl.inputgroup {
  margin-top: 8px;
}

form li.hide_label label {
  display: none;
}

form .inline {
  display: inline-block;
  font-size: 0.9rem;
  margin: 6px 0 18px;
}

form .dp-choose-date {
  width: 40px !important;
  height: 40px !important;
  bottom: 12px !important;
}

form .custom_upload {
  cursor: pointer;
  width: 70px;
  height: 50px;
  border: 1px solid #d2d2d2;
  display: inline-block;
  border-radius: 3px;
  margin-bottom: 12px;
  background: #FFF url(../images/icons/camera_blue.svg);
  background-size: 32px;
  background-position: center;
  background-repeat: no-repeat;
  transition: background 300ms ease;
}

form .custom_upload.file_upload {
  background-size: 36px;
  background-image: url(../images/icons/document_blue.svg);
}

form [disabled] + .custom_upload.file_upload {
  background-color: #eeeeee;
}

form .upload a {
  display: inline-block;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

form .upload a img {
  display: inline-block;
  float: left;
  margin-right: 16px;
}

form .custom_upload.active {
  background-color: #00d499;
  border: 1px solid #00d499;
  background-image: url(../images/icons/camera.svg);
}

form .custom_upload.active.file_upload {
  background-image: url(../images/icons/document.svg);
}

div.cv form .custom_upload {
  margin-bottom: 8px;
}

div.cv button.saved {
  background: #00d499 !important;
}

div.cv button.error {
  background: #e65e5d !important;
}

div.cv button[name=save_cv] {
  width: 200px;
  float: right;
}

div.cv td.copy a {
  background-image: url(../images/icons/copy.svg);
  background-size: 22px;
  background-position: center;
  background-repeat: no-repeat;
  width: 36px;
  height: 36px;
  display: inline-block;
  text-indent: -9999px;
}

div.cv #fk_plot_id[multiple=multiple] {
  height: 200px;
  padding: 12px 20px;
}

div.cv #fk_plot_id[multiple=multiple] option:first-of-type:not([disabled]) {
  display: none;
}

div.cv button {
  /*	width: 49%;*/
  float: left;
}

div.cv button[name=duplicate] {
  float: right;
}

div.cv td.delete button {
  float: none;
}

div.cv form div.upload {
  width: 100%;
  padding: 12px 20px;
  border: 1px solid #d2d2d2;
  border-radius: 3px;
  margin-bottom: 14px;
}

div.cv form div.upload a {
  margin-bottom: 0;
  width: 49%;
}

div.cv label[for=remove_instruction_file],
div.cv label[for=remove_applied_file] {
  position: relative;
  top: -48px;
  left: 51%;
  float: right;
  margin-bottom: -56px;
}

div.cv table.pricing tr:nth-of-type(2n - 1) td {
  /*	border-bottom: none;*/
  padding-bottom: 0;
}

div.cv table.pricing tr:nth-of-type(2n - 1) td input, div.cv table.pricing tr:nth-of-type(2n - 1) td select {
  margin-bottom: 0;
}

div.cv form select#select_rate {
  float: left;
  margin-bottom: 12px;
}

div.cv form select#select_rate option.hidden {
  display: none;
}

div.cv form th {
  width: 10%;
}

div.cv form th.left {
  width: 30%;
}

div.cv form th.quantity {
  width: 20%;
}

div.cv form td.quantity input,
div.cv form td.quantity span,
div.cv form td.quantity select {
  width: 29% !important;
}

div.cv form td.quantity span {
  display: inline-block;
  padding: 20px 0 0 20px;
  text-align: left;
}

div.cv form td.quantity select,
div.cv form td.quantity span {
  margin-left: 2%;
  width: 69% !important;
}

div.cv form.table input.checkbox {
  display: block !important;
  float: left;
  width: 15px;
  margin-top: 18px;
}

div.cv form.table label {
  float: left;
  width: 15%;
  text-align: left;
  padding: 15px 5px 0;
}

div.cv form.table span.checked {
  float: right;
  clear: right;
}

div.cv form.table textarea {
  float: right;
  width: 100%;
  height: 66px;
  overflow: hidden;
}

div.cv form tr.misc td button {
  margin-top: -12px;
}

div.cv form tr.total td input,
div.cv form tr.total td button {
  float: right;
  width: 8% !important;
}

div.cv form tr.total td button {
  margin-left: 2%;
}

div.cv form tr.total td button.saved {
  background-color: #39A751;
}

div.cv form table {
  width: 100%;
  margin-bottom: 30px;
}

div.staff-account.cv .cv_product_search {
  padding: 0 2.5%;
}

div.staff-account.cv .cv_product_search table {
  table-layout: auto;
}

div.staff-account.cv form.table td button {
  float: right;
}

div.staff-account.cv form.table tr.last td button {
  width: 200px;
}

div.staff-account.cv button.send_variation {
  height: 40px;
  background: #234374;
  color: #FFF;
  font-size: 0.9rem;
  font-weight: 700;
  margin-top: 8px;
  cursor: pointer;
  border-radius: 3px;
  transition: background 300ms ease;
  padding: 0 26px;
  float: none;
}

div.staff-account.cv form.table tr.last td {
  border-bottom: none;
}

div.cv div.cv_product_search form.table input.checkbox {
  margin-top: 0;
  float: none;
  display: inline-block !important;
  width: 40px;
  height: 40px;
}

div.cv form.export button[name=import_products],
div.cv form.export button[name=export_template] {
  width: 47.5%;
}

div.cv form.export button[name=import_products] {
  margin-right: 5%;
}

div.cv table td.authorised {
  background: #00d499;
  color: #FFF;
}

div.cv table td.draft {
  background: #d1d1d1;
  /*	color: #FFF;*/
}

div.cv table td.awaiting_authorisation {
  background: #ef8d4c;
  color: #FFF;
}

div.cv table td.declined,
div.cv table td.cancelled {
  background: #e65e5d;
  color: #FFF;
}

div.cv input.negative {
  color: var(--red);
}

#dp-popup {
  margin-left: -272px;
  border-radius: 5px;
}

#dp-popup .dp-nav-prev a,
#dp-popup .dp-nav-next a {
  line-height: 46px;
  width: 36px;
  margin: 0 !important;
  text-align: center;
  padding: 0;
}

#dp-popup .dp-nav-prev {
  left: 5px;
}

#dp-popup .dp-nav-next {
  right: 5px;
}

#dp-popup table.jCalendar {
  border-radius: 0 0 5px 5px;
}

#dp-popup table.jCalendar td {
  line-height: 1 !important;
  padding: 14px 0 !important;
}

.staff-account {
  min-height: 100vh;
  min-height: calc(100vh - 280px);
  margin-bottom: 30px;
}

.staff-account > form {
  padding: 0 2.5%;
  max-width: 50%;
}

.staff-account > form.table {
  max-width: 100%;
}

.staff-account > p,
.staff-account > h1,
.staff-account > h2,
.staff-account > h3 {
  padding-left: 2.5%;
  padding-right: 2.5%;
}

.staff-account > form:first-child {
  padding-top: 20px;
}

#helper {
  display: none;
}

/* Tables */
table {
  width: 95%;
  margin: auto;
  table-layout: fixed;
}

table.half {
  width: 46.25%;
  margin-right: 2.5%;
  float: left;
}

table.half:nth-of-type(2n - 1) {
  margin-left: 2.5%;
}

table.half:nth-of-type(2n) {
  margin-right: 0;
}

table thead, table tbody {
  width: 100%;
}

table thead tr, table tbody tr {
  width: 100%;
}

table thead tr.sign form, table tbody tr.sign form {
  width: 100%;
  padding: 0;
  position: relative;
}

table thead tr.sign form canvas, table tbody tr.sign form canvas {
  border: 1px solid #d2d2d2;
  border-radius: 5px;
  display: block;
  margin: 14px auto;
}

table thead tr.sign form button, table tbody tr.sign form button {
  width: 302px;
  margin-top: 0;
  margin-bottom: 12px;
}

table thead tr.sign form .clearButton,
table tbody tr.sign form .clearButton {
  position: absolute;
  display: inline-block;
  text-indent: -9999px;
  top: 14px;
  left: 50%;
  margin-left: 121px;
  width: 30px;
  height: 30px;
  border: 1px solid #d2d2d2;
  border-radius: 0 5px 0 0;
  background: #FFF;
}

table thead tr.sign form .clearButton:after,
table thead tr.sign form .clearButton:before,
table tbody tr.sign form .clearButton:after,
table tbody tr.sign form .clearButton:before,
div.signature .clearButton:after,
div.signature .clearButton:before {
  content: "";
  width: 16px;
  height: 2px;
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  background: #e65e5d;
  transform: rotate(45deg);
}

table thead tr.sign form .clearButton:after,
table tbody tr.sign form .clearButton:after,
div.signature .clearButton:after {
  transform: rotate(-45deg);
}

table thead th, table thead td, table tbody th, table tbody td {
  padding: 10px 12px;
  line-height: 1.2;
  text-align: center;
  vertical-align: middle;
  font-size: 0.9rem;
}

@media screen and (max-width: 1180px) {
  table thead th, table thead td, table tbody th, table tbody td {
    font-size: 0.8rem;
  }
}
table thead th.left, table thead td.left, table tbody th.left, table tbody td.left {
  text-align: left;
}

table thead th.center, table thead td.center, table tbody th.center, table tbody td.center {
  text-align: center;
}

table thead th.right, table thead td.right, table tbody th.right, table tbody td.right {
  text-align: right;
}

table thead th.enabled, table thead th.active, table thead th.disabled, table thead th.expired, table thead td.enabled, table thead td.active, table thead td.disabled, table thead td.expired, table tbody th.enabled, table tbody th.active, table tbody th.disabled, table tbody th.expired, table tbody td.enabled, table tbody td.active, table tbody td.disabled, table tbody td.expired {
  position: relative;
  min-height: 26px;
  text-indent: -9999px;
}

table thead th.enabled:after, table thead th.active:after, table thead th.disabled:after, table thead th.expired:after, table thead td.enabled:after, table thead td.active:after, table thead td.disabled:after, table thead td.expired:after, table tbody th.enabled:after, table tbody th.active:after, table tbody th.disabled:after, table tbody th.expired:after, table tbody td.enabled:after, table tbody td.active:after, table tbody td.disabled:after, table tbody td.expired:after {
  content: "";
  width: 26px;
  height: 26px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border-radius: 50%;
  background: #00d499;
}

table thead th.edit a, table thead th.delete a, table thead td.edit a, table thead td.delete a, table tbody th.edit a, table tbody th.delete a, table tbody td.edit a, table tbody td.delete a, table tbody td.expand a {
  width: 36px;
  height: 36px;
  display: inline-block;
  text-indent: -99999px;
  background: url(../images/icons/edit.svg);
  background-size: 26px;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

table thead th.delete a, table thead td.delete a, table tbody th.delete a, table tbody td.delete a {
  background-image: url(../images/icons/delete.svg);
}

table tbody td.expand a {
  background-image: url(../images/icons/expand.png);
}

table tbody td.expand a.active {
  background-image: url(../images/icons/expand-active.png);
}

table thead th.disabled:after, table thead th.expired:after, table thead td.disabled:after, table thead td.expired:after, table tbody th.disabled:after, table tbody th.expired:after, table tbody td.disabled:after, table tbody td.expired:after {
  background: #e65e5d;
}

table td.shown, table td.resolved, table td.staff.accepted, table td.charged, table td.no.charge {
  background: #00d499;
  color: #FFF;
}

table td.shown *, table td.resolved *, table td.staff.accepted *, table td.charged *, table td.no.charge * {
  color: #FFF;
}

table td.awaiting.review, table td.pending {
  background: #ef8d4c;
  color: #FFF;
}

table td.awaiting.review *, table td.pending * {
  color: #FFF;
}

table td.hidden, table td.awaiting.resolution, table td.user.disputed, table td.staff.disputed, table td.cancelled {
  background: #e65e5d;
  color: #FFF;
}

table td.hidden *, table td.awaiting.resolution *, table td.user.disputed *, table td.staff.disputed *, table td.cancelled * {
  color: #FFF;
}

table td.hidden input, table td.hidden textarea, table td.hidden select,
table td.awaiting.resolution input, table td.awaiting.resolution textarea, table td.awaiting.resolution select,
table td.user.disputed input, table td.user.disputed textarea, table td.user.disputed select,
table td.staff.disputed input, table td.staff.disputed textarea, table td.staff.disputed select,
table td.cancelled input, table td.cancelled textarea, table td.cancelled select {
  color: #3a3a3a;
}

table thead th .view,
table thead th .sign,
table thead th .complete,
table thead td .view,
table thead td .sign,
table thead td .complete,
table tbody th .view,
table tbody th .sign,
table tbody th .complete,
table tbody td .view,
table tbody td .sign,
table tbody td .complete {
  width: 40px;
  height: 40px;
  display: inline-block;
  text-indent: -99999px;
  background: url(../images/icons/view.svg);
  background-size: 26px;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

table thead th .sign,
table thead td .sign,
table tbody th .sign,
table tbody td .sign {
  background-image: url(../images/icons/edit.svg);
  background-size: 30px;
}

table thead th .sign.disabled,
table thead td .sign.disabled,
table tbody th .sign.disabled,
table tbody td .sign.disabled {
  opacity: 0.4;
}

table thead th .sign.active, table thead td .sign.active, table tbody th .sign.active, table tbody td .sign.active {
  background: url(../images/icons/close.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 32px;
}

table thead th .complete, table thead td .complete, table tbody th .complete, table tbody td .complete {
  background-image: url(../images/icons/tick.svg);
  background-size: 34px;
}

table thead th .complete.active, table thead td .complete.active, table tbody th .complete.active, table tbody td .complete.active {
  background-color: transparent;
  border-radius: 0;
  background: url(../images/icons/close.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 32px;
}

table tbody td a.button {
  background: #234374;
  color: #fff;
  padding: 10px 14px;
  font-weight: bold;
  text-decoration: none;
  border-radius: 3px;
  white-space: nowrap;
  transition: background 300ms ease;
}

table tbody td a.button:hover {
  background: #2c518a;
}

table tbody td a.download {
  width: 40px;
  height: auto;
  display: inline-block;
}

table tbody td a.download.img {
  width: 60px;
}

table tbody td a.download img {
  width: 100%;
  height: auto;
}

table tbody td a.download {
  width: 40px;
}

table thead th p.active,
table thead th p.alert,
table thead th p.expired,
table thead td p.active,
table thead td p.alert,
table thead td p.expired,
table tbody th p.active,
table tbody th p.alert,
table tbody th p.expired,
table tbody td p.active,
table tbody td p.alert,
table tbody td p.expired {
  width: 26px;
  height: 26px;
  display: inline-block;
  margin: auto;
  text-indent: -9999px;
  border-radius: 50%;
  background: #00d499;
}

table thead th p.alert, table thead td p.alert, table tbody th p.alert, table tbody td p.alert {
  background: #f69836;
}

table thead th p.expired, table thead td p.expired, table tbody th p.expired, table tbody td p.expired {
  background: #e65e5d;
}

table thead th small, table thead td small, table tbody th small, table tbody td small {
  font-size: 0.8rem;
  color: #b2b2b2;
}

table thead th small.deleted, table thead td small.deleted, table tbody th small.deleted, table tbody td small.deleted {
  font-size: 1em;
  color: #e65e5d;
}

@media screen and (max-width: 1180px) {
  table thead th small, table thead td small, table tbody th small, table tbody td small {
    font-size: 0.6rem;
  }
}
table thead th,
table tbody th,
.results div.left table tbody tr.header td,
.results div.right table tbody tr.header td {
  background: #234374;
  color: #FFF;
  font-weight: 700;
  font-size: 0.9rem;
}

@media screen and (max-width: 1180px) {
  table thead th, table tbody th {
    font-size: 0.8rem;
  }
}
table thead td, table tbody td {
  border-bottom: 1px solid #dadada;
}

table.documents tr td:last-child, table.documents tr td:nth-last-child(2), table.documents tr th:last-child, table.documents tr th:nth-last-child(2) {
  width: 100px;
}

/* Confirmation */
div.confirm {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 999999;
}

div.confirm form.confirm {
  width: 480px;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  text-align: center;
  transform: translate(-50%, -50%);
  background: #FFF;
  padding: 40px;
}

div.confirm form.confirm p {
  padding-bottom: 6px;
  font-size: 1rem;
}

div.confirm form.confirm button {
  width: 47.5%;
  float: left;
}

div.confirm form.confirm button:first-of-type {
  margin-right: 5%;
}

div.confirm form.confirm button:last-of-type {
  background: #ec4950;
}

/* Login */
body#login #wrapper {
  width: 100%;
  max-width: 540px;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 20px 30px 40px;
}

body#login h1 {
  width: 380px;
  height: 80px;
  margin-bottom: 20px;
  padding-bottom: 0;
  background: url(../../admin/editable/media/images/logo.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: left center;
  text-indent: -9999px;
}

body#login form {
  margin-bottom: 0;
}

body#login .login_issue a {
  display: inline-block;
  float: left;
  clear: left;
  line-height: 30px;
  padding-left: 36px;
  margin-bottom: 4px;
}

body#login .login_issue a.email {
  background-image: url(../images/icons/email_blue.svg);
  background-size: 22px;
  background-position: left center;
  background-repeat: no-repeat;
}

body#login .login_issue a.phone {
  background-image: url(../images/icons/phone_blue.svg);
  background-size: 22px;
  background-position: left center;
  background-repeat: no-repeat;
}

a.help {
  position: absolute;
  top: 30px;
  right: 20px;
  width: 60px;
  height: 80px;
  background: url(../../admin/core/media/images/help.svg);
  background-size: contain;
  background-repeat: no-repeat;
  text-align: center;
  padding-top: 60px;
  font-size: 0.9rem;
  text-decoration: none !important;
  opacity: 0.25;
  font-weight: 700;
  transition: opacity 300ms ease;
}

a.help:hover {
  opacity: 0.5;
}

a.help.tablet {
  top: 5px;
  right: 2.5%;
}

body#login.help #wrapper,
body#account_home.help #content {
  width: 540px;
  max-width: none;
  margin: 10% auto;
  position: relative;
  top: auto;
  left: auto;
  padding: 40px;
  transform: translate(0, 0);
  overflow: hidden;
}

body#login.help h1 {
  width: 100%;
  height: 80px;
  margin-bottom: 0;
  background: url(../../admin/editable/media/images/logo.svg);
  background-size: auto 46px;
  background-repeat: no-repeat;
  background-position: left center;
  text-indent: -9999px;
}

body#login.help a.help {
  top: 10px;
}

body#login.help h2 {
  border-top: 1px solid #D3D3D3;
  padding-top: 20px;
  font-weight: normal;
}

div.help_item {
  float: left;
  width: 100%;
  height: auto;
  border-bottom: 1px solid #D3D3D3;
  margin: 0 0 10px;
  padding-bottom: 10px;
}

div.help_item h3 {
  color: #234374;
  padding: 5px 0;
}

div.inline_media,
div.inline_media iframe {
  float: left;
  width: 180px;
  height: 110px;
  margin: 0 10px 0 0;
}

body#account_home.help #content,
body#login.help #wrapper {
  margin: 0 auto;
  width: 100%;
  padding: 1% 2.5%;
}

body#account_home.help #content div.help_item,
body#login.help #wrapper div.help_item {
  width: 23.125%;
  display: inline-block;
  float: left;
  margin-right: 2.5%;
  margin-bottom: 26px;
  border-bottom: none;
}

body#account_home.help #content div.help_item:nth-of-type(4n),
body#login.help #wrapper div.help_item:nth-of-type(4n) {
  margin-right: 0;
}

@media screen and (max-width: 800px) {
  body#account_home.help #content div.help_item,
  body#login.help #wrapper div.help_item {
    width: 48.75%;
  }

  body#account_home.help #content div.help_item:nth-of-type(2n),
  body#login.help #wrapper div.help_item:nth-of-type(2n) {
    margin-right: 0;
  }

}

body#account_home.help #content div.help_item div.inline_media,
body#account_home.help #content div.help_item div.inline_media iframe,
body#login.help #wrapper div.help_item div.inline_media,
body#login.help #wrapper div.help_item div.inline_media iframe {
  width: 100%;
  height: 250px;
}

body#account_home.help #content div.help_item h3,
body#login.help #wrapper div.help_item h3 {
  font-size: 1rem;
  text-align: center;
  width: 100%;
  padding: 10px 0 0;
  color: #3a3a3a;
  display: inline-block;
}

a.help_back {
  float: left;
  width: 100%;
  height: 40px;
  background: #234374;
  color: #FFF;
  font-size: 0.9rem;
  font-weight: 700;
  text-align: center;
  padding: 12px 0 0;
  border-radius: 5px;
  margin: 8px 0 26px;
  text-decoration: none !important;
  transition: background 300ms ease;
}

a.help_back:hover {
  background: #2c518a;
}

/* Home */
body#account_home .staff-account h1 {
  display: none;
}

/* Documents */
table.documents td:last-child,
table.documents td:nth-last-child(2),
table.documents th:last-child,
table.documents th:nth-last-child(2) {
  padding: 12px 0;
  width: 60px;
}

/* Inspections */
.staff-account.inspections form,
.staff-account.issues form,
.staff-account.contra-charges form {
  width: 100%;
  max-width: 100%;
  position: relative;
}

.staff-account.inspections form button,
.staff-account.issues form button,
.staff-account.contra-charges form button {
  margin-top: 30px;
  width: 21.875%;
}

.staff-account.inspections form button.prepare_send{
  float: right;
}

.staff-account.inspections form.search.issue fieldset,
.staff-account.issues form.search.issue fieldset {
  width: 50%;
  display: inline-block;
  float: left;
}

.staff-account.inspections form.search.issue fieldset:last-of-type,
.staff-account.issues form.search.issue fieldset:last-of-type {
  width: 100%;
}

.staff-account.issues form p.success,
.staff-account.issues form p.error {
  width: 100%;
}

.staff-account.inspections form.search.issue ol li,
.staff-account.issues form.search.issue ol li {
  width: 50%;
  display: inline-block;
  float: left;
  margin-right: 0;
}

.staff-account.inspections form.search.issue ol li.hidden {
  display: none;
}

.staff-account.inspections form.search.issue ol li input,
.staff-account.inspections form.search.issue ol li select,
.staff-account.inspections form.search.issue ol li textarea,
.staff-account.inspections form.search.issue ol li label,
.staff-account.issues form.search.issue ol li input,
.staff-account.issues form.search.issue ol li select,
.staff-account.issues form.search.issue ol li textarea,
.staff-account.issues form.search.issue ol li label {
  width: 95%;
}

.staff-account.inspections form.search.issue ol li.issue_detail,
.staff-account.issues form.search.issue ol li.issue_detail {
  clear: left;
  width: 100%;
}
.staff-account.inspections form.search.issue ol li.issue_detail textarea,
.staff-account.issues form.search.issue ol li.issue_detail textarea {
  width: 97.5%;
}

.staff-account.inspections form.search.issue ol li.date_identified,
.staff-account.issues form.search.issue ol li.date_identified {
  /*width: 21%;*/
}

.staff-account.inspections form.search.issue ol li.notes,
.staff-account.issues form.search.issue ol li.notes,
.staff-account.inspections form ol li.full_width,
.staff-account.issues form ol li.full_width {
  width: 100%;
}

.staff-account.inspections form.search.issue table,
.staff-account.issues form.search.issue table {
  width: 100%;
}

.staff-account.inspections form.search.issue ol li.date_identified .dp-choose-date,
.staff-account.issues form.search.issue ol li.date_identified .dp-choose-date {
  right: 5% !important;
}

.staff-account.inspections form.search button {
  position: static !important;
  float: right !important;
  margin-top: 26px;
}

.staff-account.inspections table td a[title="View Inspection"] img,
.staff-account.issues table td a[title="View Inspection"] img {
  width: 32px;
}

.staff-account.inspections #inspection_form a.existing_image{
  position: relative;
}

.staff-account.inspections #inspection_form button.delete_inspection_upload{
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  height: 56px;
  width: 56px;
  background-color: transparent !important;
  background-image: url(../../admin/core/media/images/delete.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 18px;
  padding: 0;
  text-indent: -99999px;
  opacity: 0.6;
  transition: opacity 400ms ease;
}

.staff-account.inspections #inspection_form button.delete_inspection_upload:hover{
  opacity: 1;
}

.staff-account.inspections form .upload{
  border: 1px solid #d2d2d2;
  position: relative;
  border-radius: 3px;
}

.staff-account.inspections form .upload a{
  margin: 10px 20px;
}

/* Wages */
div.staff-account.wages div.table_scroll_right table td div.plot_type,
div.staff-account.wages div.table_fixed_left table td div.plot_type {
  height: 50px;
  line-height: 50px;
}

div.staff-account.wages div.table_scroll_right table td a,
div.staff-account.wages div.table_scroll_right table td span,
div.staff-account.wages div.table_fixed_left table td a,
div.staff-account.wages div.table_fixed_left table td span {
  height: 50px;
  display: inline-block;
  float: left;
  text-align: center;
  overflow: hidden;
  padding-top: 8px;
  font-size: 0.8rem;
}

div.staff-account.wages div.table_scroll_right table td span:not(.download),
div.staff-account.wages div.table_fixed_left table td span:not(.download) {
  width: 100%;
  background: #FFF;
  border: 1px solid #DDD;
  text-indent: -9999px;
}

div.staff-account.wages div.table_scroll_right table td span.checked {
  float: right;
  width: 75%;
  border-width: 0;
  text-indent: 0;
  text-transform: none;
  text-align: right;
  margin: 0;
  padding: 2px 10px 0 20px;
}

div.staff-account.wages div.table_scroll_right table td span.checked:first-child {
  background: transparent url("../images/icons/tick_white@2x.png") 52% 4px no-repeat;
  background-size: 12px;
}

div.staff-account.wages div.table_scroll_right table td a,
div.staff-account.wages div.table_fixed_left table td a {
  width: 50%;
  color: #FFF;
  text-transform: uppercase;
  background-size: 30px;
  background-position: center;
  background-repeat: no-repeat;
  cursor: default;
  overflow: hidden;
  text-decoration: none;
}

div.staff-account.wages div.table_scroll_right table td a,
div.staff-account.wages div.table_fixed_left table td a {
  text-indent: 0;
  cursor: pointer;
}

div.staff-account.wages div.table_scroll_right table td a:hover,
div.staff-account.wages div.table_fixed_left table td a:hover {
  text-decoration: underline;
}

div.staff-account.wages div.table_scroll_right table td a.not_started,
div.staff-account.wages div.table_fixed_left table td a.not_started {
  background-color: #DDD;
}

div.staff-account.wages div.table_scroll_right table td a.released,
div.staff-account.wages div.table_fixed_left table td a.released {
  background-color: #0AB5CD;
}

div.staff-account.wages div.table_scroll_right table td a.not_authorised,
div.staff-account.wages div.table_fixed_left table td a.not_authorised {
  background-color: #DD0000;
}

div.staff-account.wages div.table_scroll_right table td a.checked,
div.staff-account.wages div.table_fixed_left table td a.checked {
  background-color: #F29E3B;
}

div.staff-account.wages div.table_scroll_right table td a.booked,
div.staff-account.wages div.table_fixed_left table td a.booked {
  background-color: #6CD173;
}

div.staff-account.wages div.table_scroll_right table td a.completed,
div.staff-account.wages div.table_fixed_left table td a.completed {
  background-color: #282828;
}

div.staff-account.wages div.table_scroll_right table td a:first-child,
div.staff-account.wages div.table_fixed_left table td a:first-child {
  border-right: 2px solid #FFF;
  text-indent: -9999px;
  text-align: left;
  background-image: url(../images/icons/profile@2x.png);
}

div.staff-account.wages div.table_scroll_right table td a.checked:first-child,
div.staff-account.wages div.table_fixed_left table td a.checked:first-child {
  background-position: 15px 10px;
}

div.staff-account.wages div.table_scroll_right table td a:last-child,
div.staff-account.wages div.table_fixed_left table td a:last-child {
  border-left: 2.5px solid #FFF;
}

div.staff-account.wages div.table_scroll_right table th {
  min-width: 360px !important;
  width: 360px !important;
}

div.staff-account.wages div.table_scroll_right table td {
  min-width: 360px !important;
  width: 360px !important;
}

div.staff-account.wages ul.key {
  width: 100%;
  padding: 20px 5% 30px;
  display: inline-block;
}

div.staff-account.wages ul.key li {
  display: inline-block;
  float: left;
  margin-right: 30px;
  line-height: 20px;
  position: relative;
  padding-left: 44px;
}

div.staff-account.wages ul.key li:before {
  content: "";
  width: 30px;
  height: 20px;
  display: inline-block;
  position: absolute;
  left: 0;
  top: 0;
}

div.staff-account.wages ul.key li:first-of-type {
  font-weight: bold;
  padding-left: 0;
}

div.staff-account.wages ul.key li:first-of-type:before {
  display: none;
}

div.staff-account.wages ul.key li.not_started:before {
  background: #DDD;
}

div.staff-account.wages ul.key li.released:before {
  background: #0AB5CD;
}

div.staff-account.wages ul.key li.checked:before {
  background: #F29E3B;
}

div.staff-account.wages ul.key li.part_booked:before {
  background: #FFEA01;
}

div.staff-account.wages ul.key li.fully_booked:before {
  background: #6CD173;
}

div.staff-account.wages ul.key li.not_authorised:before {
  background: #DD0000;
}

div.staff-account.wages ul.key li.completed:before {
  background: #282828;
}

div.staff-account.wages form.application {
  position: relative;
  max-width: 100%;
}

div.staff-account.documents form.search {
  max-width: 100% !important;
}

div.staff-account.wages form.application li,
div.staff-account.cv form.search li {
  width: 15.8% !important;
  margin-right: 1% !important;
  position: relative;
  float: left;
}

div.staff-account.wages form.application li {
  width: 13.42% !important;
}

div.staff-account.documents form.search li {
  width: 15.8% !important;
  margin-right: 1% !important;
  position: relative;
}

div.staff-account.wages form.application li:nth-of-type(7),
div.staff-account.wages form.application li:last-of-type {
  margin-right: 0 !important;
}

div.staff-account.wages form.application li:last-of-type {
  float: right;
}

div.staff-account.wages form.application button,
div.staff-account.cv form.search button {
  margin-top: 26px;
}

div.staff-account.cv form.search button,
div.staff-account.documents form.search button {
  width: 15.8% !important;
  float: right;
}

div.staff-account.documents form.search button {
  margin-top: -52px;
}

div.staff-account.wages form.application p.error {
  margin-top: 26px;
}

div.staff-account.wages div.table_scroll {
  width: 95%;
  height: 80vh;
  display: inline-block;
  margin-left: 2.5% !important;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
  position: relative;
  padding-bottom: 30px;
}

div.staff-account.wages div.table_scroll table {
  width: 100%;
}

@media screen and (max-width: 1800px) {
  div.staff-account.wages div.table_scroll table {
    width: 1700px;
  }
}
div.staff-account.wages div.table_scroll table thead {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 500;
}

div.staff-account.wages div.table_scroll table tr th {
  height: 80px;
}

div.staff-account.wages div.table_scroll table tr td {
  /*	background: #E6FFE3;*/
}

div.staff-account.wages div.table_scroll table tr.highlight td,
div.staff-account.wages div.table_scroll table tr.budget_highlight td {
  background: #FFE8E8;
}

div.staff-account.wages div.table_scroll table tr.unconfirmed td,
div.staff-account.wages div.table_scroll table tr.total td {
  background: #FFF;
}

div.staff-account.wages div.table_scroll table tr td:nth-of-type(13) input, div.staff-account.wages div.table_scroll table tr th:nth-of-type(13) {
  width: 80px;
}

div.staff-account.wages div.table_scroll table tr td:nth-of-type(6), div.staff-account.wages div.table_scroll table tr td:nth-of-type(7),
div.staff-account.wages div.table_scroll table tr th:nth-of-type(6), div.staff-account.wages div.table_scroll table tr th:nth-of-type(7) {
  font-weight: bold;
}

div.staff-account.wages div.table_scroll table tr td:nth-of-type(6), div.staff-account.wages div.table_scroll table tr td:nth-of-type(7), div.staff-account.wages div.table_scroll table tr td:nth-of-type(8),
div.staff-account.wages div.table_scroll table tr th:nth-of-type(6), div.staff-account.wages div.table_scroll table tr th:nth-of-type(7), div.staff-account.wages div.table_scroll table tr th:nth-of-type(8) {
  width: 120px;
}

div.staff-account.wages div.table_scroll table tr td:nth-of-type(8) input, div.staff-account.wages div.table_scroll table tr th:nth-of-type(8) input {
  color: #000000;
  font-weight: bold;
  font-size: 0.9rem;
}

div.staff-account.wages div.table_scroll table .download, div.staff-account.wages div.table_scroll table .view_images {
  width: 40px;
  height: 40px;
  display: inline-block;
  background-color: #00d499;
  text-indent: -9999px;
  text-align: left;
  float: left;
  margin-right: 5px;
  border-radius: 5px;
}

div.staff-account.wages div.table_scroll table .view_images {
  background: transparent;
  cursor: default;
  display: none;
}

div.staff-account.wages div.table_scroll table .view_images.active {
  background-color: #00d499;
  color: #FFF;
  text-indent: 0 !important;
  text-align: center;
  cursor: pointer;
  display: inline-block;
}

div.staff-account.wages div.table_scroll table .download.error,
div.staff-account.wages div.table_scroll table .view_images.error {
  background-color: #e65e5d;
  background-image: url(../images/icons/error@2x.png);
  background-size: 24px;
  background-position: center;
  background-repeat: no-repeat;
}

div.staff-account.wages div.table_scroll table span.download {
  display: none;
}

div.staff-account.wages div.table_scroll table a.download {
  background-image: url(../images/icons/download@2x.png);
  background-size: 22px;
  background-position: center;
  background-repeat: no-repeat;
  display: inline-block;
}

div.staff-account.wages div.table_scroll table input:not([type=file]) {
  width: 100%;
  height: 40px;
  text-align: center;
  border: 1px solid #d2d2d2;
  border-radius: 5px;
  padding: 0 10px;
}

div.staff-account.wages div.table_scroll table td.right input:not([type=file]){
  text-align: right;
}

div.staff-account.wages div.table_scroll table input:not([type=file])[disabled=disabled] {
  background: #EEE;
}

div.staff-account.wages div.table_scroll table input:not([type=file]).error {
  border: 2px solid #234374;
  color: #234374;
}

div.staff-account.wages div.table_scroll table form.cs_handover,
div.staff-account.wages div.table_scroll table form.cs_instruction,
div.staff-account.wages div.table_scroll table form.application_images {
  width: auto;
  height: 40px;
  white-space: nowrap;
}

div.staff-account.wages div.table_scroll table .custom_upload {
  width: 40px;
  height: 40px;
  display: inline-block;
  /*	float: left;*/
  background-size: 26px;
  margin-bottom: 0;
}

div.staff-account.wages div.table_scroll table button {
  cursor: pointer;
  margin-top: 0;
}

div.staff-account.wages div.table_scroll table button.authorise {
  background: #234374;
}

div.staff-account.wages div.table_scroll table button.authorised {
  background: #00d499;
}

div.staff-account.wages div.table_scroll table span.budget {
  color: #00d499;
  /*	font-weight: bold;*/
}

div.staff-account.wages div.table_scroll table span.budget.error {
  color: #e65e5d;
}

div.staff-account.wages div.table_scroll table span.budget.quantity_budget {
  color: #3a3a3a;
}

div.staff-account.wages div.table_scroll table span.budget.quantity_budget small {
  color: #00d499;
}

div.staff-account.wages div.table_scroll table span.budget.quantity_budget small.error {
  color: #e65e5d;
}

div.staff-account.wages div.table_scroll table a.checked {
  float: left;
  width: 106px;
  padding: 10px;
  margin-left: -10px;
  background-color: #00d499;
  border: 1px solid #00d499;
  border-radius: 5px;
  color: #FFF;
  font-weight: bold;
}

div.staff-account.wages div.table_scroll table a.checked:hover {
  text-decoration: none;
}

div.staff-account.wages div.table_scroll table a.checked.not {
  background-color: #234374;
  border-color: #234374;
}

a.back_button {
  display: block;
  width: 160px;
  background: #2c518a;
  color: #FFF;
  padding: 10px 10px 10px 0;
  margin: 10px 5% 20px;
  text-align: center;
  border: 1px solid #2c518a;
  border-radius: 5px;
}

div.staff-account.wages div.table_scroll table span.issues,
div.staff-account.wages div.table_scroll table a.issues,
div.staff-account.cv table a.variation_items,
div.staff-account.cv table a.variation_products,
div.staff-account.cv table span.sent_variation_history,
div.staff-account table a.item_count,
div.staff-account.wages div.table_scroll table a.billing_notes,
div.staff-account.inspections table span.send_log,
div.staff-account.inspections table span.show_inspections,
div.staff-account.nhbc table a.show_sent_details {
  width: 40px;
  height: 40px;
  line-height: 40px;
  background: #00d499;
  border-radius: 5px;
  display: inline-block;
  color: #FFF;
  font-weight: bold;
  text-decoration: none !important;
  cursor: pointer;
  font-size: 0.9rem;
}

div.staff-account.wages div.table_scroll table a.issues,
div.staff-account.cv table a.variation_items,
div.staff-account.cv table a.variation_products,
div.staff-account.cv table span.sent_variation_history,
div.staff-account table a.item_count,
div.staff-account.inspections table span.send_log,
div.staff-account.nhbc table a.show_sent_details {
  background: #234374;
}

div.staff-account.wages div.table_scroll table a.billing_notes
{
  background: var(--blue);
}

div.staff-account.wages div.table_scroll table a.billing_notes.query {
  background: #e65e5d;
}

div.staff-account.wages div.table_scroll table a.issues:not(.no_issues) {
  background: #e65e5d;
}

div.staff-account.wages form.staff_handover {
  width: 680px !important;
  margin-top: 30px;
}

div.staff-account.wages form.staff_handover fieldset {
  position: relative;
  height: auto;
  width: 100%;
  overflow: hidden;
  padding-top: 20px;
  padding-top: 0;
}

div.staff-account.wages form.staff_handover fieldset ol {
  display: inline-block;
  width: 100%;
}

div.staff-account.wages form.staff_handover fieldset ol li {
  width: 49%;
  margin-right: 2%;
  margin-bottom: 2%;
  display: inline-block;
  float: left;
}

div.staff-account.wages form.staff_handover fieldset ol li label {
  display: none;
}

div.staff-account.wages form.staff_handover fieldset ol li .custom_upload {
  width: 100%;
  background: #C6C6C6 url(../images/icons/camera-white@2x.png);
  background-size: 32px;
  background-position: center;
  background-repeat: no-repeat;
  transition: background 300ms ease;
  border: none;
}

div.staff-account.wages form.staff_handover fieldset ol li .custom_upload.active {
  background-color: #00d499;
}

div.staff-account.wages form.staff_handover .handover_document,
div.staff-account.wages form.staff_handover .back,
div.staff-account.wages form.staff_handover .resolve {
  width: 49%;
  height: 50px;
  margin-right: 2%;
  margin-bottom: 2%;
  display: inline-block;
  border-radius: 5px;
  background: #C6C6C6;
  float: left;
  color: #FFF;
  font-weight: 700;
  text-align: center;
  line-height: 50px;
}

div.staff-account.wages form.staff_handover .handover_document,
div.staff-account.wages form.staff_handover .resolve {
  margin-right: 0;
}

div.staff-account.wages form.staff_handover .handover_document {
  background: #00d499;
}

div.staff-account.wages form.staff_handover .handover_document.no_document {
  background: #C6C6C6;
}

div.staff-account.wages form.staff_handover .back {
  background: #0ab5cd;
}

div.staff-account.wages form.staff_handover .resolve {
  background: #234374;
}

div.staff-account.wages form.staff_handover .resolve.resolved {
  background: #00d499;
}

div.staff-account.wages form.crossref {
  position: relative;
  max-width: 100%;
}

div.staff-account.wages form.crossref ol {
  float: left;
  width: 75%;
  margin-right: 1.75%;
}

div.staff-account.wages form.crossref button {
  float: left;
  width: 23.125%;
  margin-top: 26px;
}

#content div.popup_container,
#content div.file_upload_overlay,
#content div.popup_overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
  opacity: 1;
  cursor: zoom-out;
  background-image: url(../images/icons/close.svg);
  background-repeat: no-repeat;
  background-position: right 1vw top 1vw !important;
  background-size: 42px;
  z-index: 8000;
}

#content div.file_upload_overlay {
  z-index: 9998;
}

#content div.popup_info {
  position: fixed;
  top: 2%;
  left: 50%;
  z-index: 9999;
  width: 90%;
  max-width: 920px;
  padding: 20px 40px;
  font-size: 1.2em;
  font-weight: bold;
  background: #FFF;
  border-bottom: 1px solid #CCC;
  transform: translate(-50%, 0);
}

#content div.popup, #content div.file_upload_message {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 90%;
  max-width: 920px;
  height: auto;
  max-height: 90%;
  background: #FFF;
  padding: 40px 2.5%;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
  z-index: 9999;
  transform: translate(-50%, -50%);
  box-shadow: 0px 0px 15px 2px rgba(0, 0, 0, 0.4);
}

#content div.file_upload_message {
  top: 50%;
  transform: translate(-50%, -50%);
}

#content div.file_upload_message p {
  text-align: center;
  font-size: 1.2rem;
  font-weight: 700;
  padding-top: 12px;
  padding-bottom: 40px;
}

#content div.file_upload_message .lds-ellipsis {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 40px;
  position: absolute;
  left: 50%;
  bottom: 20px;
  transform: translateX(-50%);
}

#content div.file_upload_message .lds-ellipsis div {
  position: absolute;
  top: 0;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #234374;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

#content div.file_upload_message .lds-ellipsis div:nth-child(1) {
  left: 8px;
  animation: lds-ellipsis1 0.6s infinite;
}

#content div.file_upload_message .lds-ellipsis div:nth-child(2) {
  left: 8px;
  animation: lds-ellipsis2 0.6s infinite;
}

#content div.file_upload_message .lds-ellipsis div:nth-child(3) {
  left: 32px;
  animation: lds-ellipsis2 0.6s infinite;
}

#content div.file_upload_message .lds-ellipsis div:nth-child(4) {
  left: 56px;
  animation: lds-ellipsis3 0.6s infinite;
}

@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(24px, 0);
  }
}
#content div.popup div.half {
  width: 47.5%;
  margin-right: 5%;
  display: inline-block;
  float: left;
  position: relative;
  padding-bottom: 20px;
}

#content div.popup div.half:before {
  content: "";
  width: 1px;
  height: 100%;
  background: #EEE;
  position: absolute;
  top: 0;
  left: 105%;
  bottom: 0;
}

#content div.popup div.half:nth-of-type(2n) {
  margin-right: 0;
}

#content div.popup div.half:nth-of-type(2n):before {
  left: auto;
  right: 105%;
  margin-right: 2px;
}

#content div.popup div.half:not(:nth-of-type(1)):not(:nth-of-type(2)) {
  margin-top: 20px;
}

#content div.popup div.half span.checked,
#content div.popup div.half span.not_checked {
  float: left;
  width: 96%;
  padding: 6px 0 20px 40px;
  margin-bottom: 20px;
  background: url("../images/icons/checked-no.png") left top no-repeat;
  background-size: 30px;
  border-bottom: 1px solid #EEE;
  font-size: 0.9em;
}

#content div.popup div.half span.checked {
  background: url("../images/icons/checked-yes.png") left top no-repeat;
  background-size: 30px;
}

#content div.popup div.half li {
  display: inline-block;
  float: left;
  width: 100%;
}

#content div.popup div.half li label {
  font-size: 0.9rem;
  display: inline-block;
  width: 100%;
  padding-bottom: 8px;
  line-height: 1.3;
}

#content div.popup div.half li input {
  width: 100%;
  height: 40px;
  padding: 0 20px;
  border: 1px solid #d2d2d2;
  line-height: 38px;
  border-radius: 5px;
  margin-bottom: 12px;
  -moz-appearance: none;
  appearance: none;
  -webkit-appearance: none;
  background: #FFF;
  font-size: 1rem;
  opacity: 1 !important;
}

#content div.popup div.half li input[disabled=disabled] {
  background: #EEE;
}

#content div.popup div.half li input.paid {
  background: #00d499;
  color: #FFF !important;
  text-align: center;
}

#content div.popup div.half li button {
  color: #FFF !important;
}

#content div.popup div.half li.half {
  width: 47.5%;
  margin-right: 5%;
}

#content div.popup div.half li.half:nth-of-type(2n) {
  margin-right: 0;
}

#content div.popup div.half li.half:nth-of-type(2n + 1) {
  clear: left;
}

#content div.popup div.half li.half input {
  text-align: center;
}

#content div.popup div.half li.third {
  width: 31.66%;
  margin-right: 2.5%;
}

#content div.popup div.half li.third:nth-of-type(3n + 1) {
  margin-right: 0;
}

#content div.popup div.half li.third input.staff {
  font-size: 0.7rem;
  text-align: left !important;
}

#content div.popup div.half li.third input {
  text-align: center;
}

#content div.popup div.half li:first-child:not(.half):not(.third) input {
  text-align: center;
  background: none;
}

#content div.popup div.half li:first-child:not(.half):not(.third) input[value=Unequal] {
  color: #234374;
}

#content div.popup div.half ul {
  margin-top: 30px;
}

#content div.popup div.half ul li.split {
  margin-top: -36px;
}

#content div.popup div.half:nth-of-type(2n - 1) ul {
  margin-top: 20px;
}

#content div.popup div.half:nth-of-type(2n - 1) ul span, #content div.popup div.half:nth-of-type(2n - 1) ul a {
  width: 100%;
  height: 40px;
  display: inline-block;
  background: #EEE;
  text-align: center;
  margin-bottom: 12px;
  line-height: 40px;
  border-radius: 5px;
}

#content div.popup div.half:nth-of-type(2n - 1) ul a {
  background: #00d499;
  color: #FFF;
}

#content div.popup div.half:nth-of-type(2n - 1) ul a.issues.active_issue,
#content div.popup div.half:nth-of-type(2n - 1) ul a.checked.not {
  background: #234374;
}

#content div.popup div.half:nth-of-type(2n - 1) ul a.images {
  text-indent: -9999px;
  text-align: left;
  background-image: url(../images/icons/camera-white@2x.png);
  background-size: 28px;
  background-position: center;
  background-repeat: no-repeat;
}

#content div.popup img {
  max-width: 95%;
}

/* Issues */
div.staff-account.issues form.search:not(.issue),
div.staff-account.contra-charges form.search,
div.staff-account.cv form.search,
div.staff-account.profiles form.search,
div.staff-account.materials form.search,
div.staff-account.inspections form.search,
div.staff-account.cv form.cv_product_search {
  width: 100%;
  max-width: 100%;
}

div.staff-account.issues form.search:not(.issue) fieldset,
div.staff-account.contra-charges form.search fieldset,
div.staff-account.cv form.search fieldset,
div.staff-account.profiles form.search fieldset,
div.staff-account.materials form.search fieldset,
div.staff-account.inspections form.search fieldset,
div.staff-account.cv form.cv_product_search fieldset {
  width: 100%;
  position: relative;
}

div.staff-account.issues form.search:not(.issue) ol li,
div.staff-account.contra-charges form.search ol li,
div.staff-account.cv form.search ol li,
div.staff-account.profiles form.search ol li,
div.staff-account.materials form.search ol li,
div.staff-account.inspections form.search ol li,
div.staff-account.cv form.cv_product_search ol li {
  width: 23.5%;
  margin-right: 2%;
  display: inline-block;
  float: left;
}

div.staff-account.issues form.search:not(.issue) ol li:nth-of-type(4n),
div.staff-account.contra-charges form.search ol li:nth-of-type(4n),
div.staff-account.cv form.search ol li:nth-of-type(4n),
div.staff-account.profiles form.search ol li:nth-of-type(4n),
div.staff-account.materials form.search ol li:nth-of-type(4n),
div.staff-account.inspections form.search ol li:nth-of-type(4n) {
  margin-right: 0;
}

div.staff-account.issues form.search:not(.issue) button,
div.staff-account.contra-charges form.search button,
div.staff-account.cv form.search button,
div.staff-account.profiles form.search button,
div.staff-account.materials form.search button,
div.staff-account.inspections form.search button,
div.staff-account.cv form.cv_product_search button {
  display: inline-block;
  float: left;
  width: 23.5%;
  position: absolute;
  right: 0;
  bottom: 12px;
}

div.staff-account.cv form.search:not(.issue) button {
  float: right;
}

div.staff-account.contra-charges form.search:not(.issue) button {
  position: static;
  float: right;
  margin-top: 12px;
}

.results {
  margin: 0 2.5%;
  width: 95%;
  display: inline-block;
  margin-bottom: 40px;
  overflow: scroll;
  position: relative;
  top: 0;
  max-height: 90vh;
}

.results table {
  width: 100%;
  table-layout: auto;
  border-collapse: separate;
}

.results table tr td,
.results table tr th {
  padding: 0;
  border-right: 5px solid #FFF;
  border-bottom: 5px solid #FFF;
  vertical-align: middle;
}

.results table tr td {
  background: #EEEEEE;
  position: relative;
}

.results table tr td.no_issues,
.results table tr td.active_issues {
  width: 120px;
  height: 40px;
}

.results table tr td.active_issues {
  background: #ef8d4c;
}

.results table tr th,
.results table tr.header td {
  padding: 12px 8px;
}

.results table div,
.results table button,
.results table a {
  display: inline-block;
  height: 40px;
  width: 120px;
  text-align: center;
  float: left;
  line-height: 40px;
  white-space: nowrap;
  text-align: center;
  font-size: 0.9rem;
  overflow: hidden;
}

.results table a {
  position: absolute;
  top: 0;
  left: 50%;
  right: 2px;
  width: auto;
  text-align: center;
  font-weight: 600;
  color: #FFF;
  text-decoration: none;
}

@media screen and (max-width: 1180px) {
  .results table div,
  .results table button {
    font-size: 0.8rem;
  }
}
.results table div.plot,
.results table div.plot_type,
.results table button.plot,
.results table button.plot_type {
  width: 100%;
  min-width: 0;
}

.results table div.plot_type,
.results table button.plot_type {
  padding: 0;
  text-align: left;
}

.results table button {
  background: transparent;
  padding-left: 50%;
  color: #FFF;
  font-weight: 700;
  position: relative;
  overflow: visible;
}

.results table button:after {
  content: "";
  position: absolute;
  top: 0;
  left: 2px;
  right: 50%;
  bottom: 0;
  margin: auto;
  background: transparent url(../../admin/core/media/images/issues.svg);
  background-size: 26px;
  background-position: center;
  background-repeat: no-repeat;
  border-right: 2px solid #FFF;
}

.results table td.active_issues {
  background: #234374;
}

.results table td.resolved {
  background: #00d499;
}

.results table td.no_issues {
  background: #aeaeae;
}

.results table tr td:first-of-type,
.results table tr th:first-of-type {
  width: 120px;
  min-width: 120px;
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  z-index: 1000;
}

.results table tr td:first-of-type div,
.results table tr th:first-of-type div {
  font-weight: 700;
}

.results table tr td:nth-of-type(2),
.results table tr th:nth-of-type(2) {
  padding: 0 16px;
  min-width: 360px;
  position: -webkit-sticky;
  position: sticky;
  left: 120px;
  z-index: 1000;
}

.results table tr th:first-of-type,
.results table tr th:nth-of-type(2) {
  z-index: 2000;
}

.results table tr th:nth-of-type(n + 3) {
  width: 140px;
}

.results table th {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 999;
}

#add_issue_popup {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.8);
  z-index: 8888;
  display: none;
}

#add_issue_popup form {
  width: 90vw;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  display: block;
  margin: auto;
  max-width: 90vw;
  padding: 40px;
  background: #FFF;
  position: relative;
  height: auto;
  box-shadow: 0px 0px 15px 2px rgba(0, 0, 0, 0.4);
  overflow: hidden;
  min-height: 80vh;
  max-height: 90vh;
}

#add_issue_popup form fieldset {
  width: 50%;
  display: inline-block;
  float: left;
}

#add_issue_popup form fieldset:first-of-type, #add_issue_popup form fieldset:last-of-type {
  width: 100%;
}

#add_issue_popup form fieldset li {
  width: 47.5%;
  margin-right: 2%;
}

#add_issue_popup form fieldset li:nth-of-type(2n) {
  margin-right: 0;
}

#add_issue_popup form fieldset li:nth-of-type(2n + 1) {
  clear: left;
}

#add_issue_popup form fieldset textarea {
  height: 198px;
}

#add_issue_popup .close_issue_popup {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  margin-top: 0;
  background: url(../images/icons/close.svg);
  background-repeat: no-repeat;
  background-position: right 1vw top 1vw !important;
  background-size: 42px;
  text-indent: -9999px;
  text-align: left;
  cursor: zoom-out;
}

#add_issue_popup form button[type=submit] {
  width: 200px;
  margin-top: 20px;
  float: right;
}

#add_issue_popup form .view_issues {
  width: 200px;
  height: 40px;
  background: #2c518a;
  color: #FFF;
  font-size: 0.9rem;
  font-weight: 700;
  border-radius: 3px;
  display: inline-block;
  float: left;
  line-height: 40px;
  text-align: center;
  margin-top: 30px;
  text-decoration: none;
  transition: background 300ms ease;
}

#add_issue_popup form .view_issues:hover {
  background: #2c518a;
}

/* Issues */
h2 span.plot {
  font-size: 0.9rem;
  display: block;
  line-height: 1.2;
}

.issue_images {
  height: auto;
  display: block;
  vertical-align: middle;
  position: relative;
  overflow: hidden;
  width: 90%;
  margin-left: 5%;
  max-width: 560px;
  margin-top: 10px;
}

.issue_images .slick-arrow {
  width: 60px;
  height: 60px;
  position: absolute;
  left: -30px;
  top: 0;
  bottom: 0;
  margin: auto;
  border-radius: 50%;
  background: rgba(10, 181, 205, 0.8);
  background-size: 20px;
  background-position: left 5px center;
  background-repeat: no-repeat;
  text-indent: -99999px;
  z-index: 9999;
}

.issue_images .slick-arrow:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../images/icons/arrow.png);
  background-size: 20px;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  left: 10px;
  top: 0;
  bottom: 0;
  margin: auto;
}

.issue_images .slick-arrow.slick-next {
  left: auto;
  right: -30px;
}

.issue_images .slick-arrow.slick-prev:after {
  left: auto;
  right: 10px;
  transform: rotate(-180deg);
}

.issue_images .slick-list {
  vertical-align: middle;
}

.issue_images a {
  display: inline-block;
}

.issue_images img {
  width: 100%;
  height: auto;
  display: inline-block;
  vertical-align: middle;
}

#content div.site div.table_fixed_left,
#content div.site div.table_scroll_right {
  float: left;
  width: 18.8%;
  margin-left: 5%;
}

#content div.site div.table_scroll_right {
  width: 75%;
  overflow: auto;
  margin-left: 0;
}

#content div.site div.table_fixed_left table,
#content div.site div.table_scroll_right table {
  width: 102%;
  margin: 0;
  table-layout: fixed;
}

#content div.site div.table_scroll_right table {
  display: none;
}

#content div.site div.table_fixed_left table td,
#content div.site div.table_scroll_right table td {
  padding: 0;
  width: 98%;
  height: 72px;
  table-layout: fixed;
}

#content div.site div.table_fixed_left table th,
#content div.site div.table_fixed_left table td {
  padding: 10px !important;
  text-align: left !important;
}

#content div.site div.table_fixed_left table td small {
  display: inline-block;
  font-size: 0.7em;
  line-height: 1.2em;
  padding: 5px;
}

#content div.site div.table_fixed_left table td span {
  float: left;
  width: 100%;
  height: 100%;
  padding-top: 20px;
  font-size: 0.8em;
  background: #DDD;
}

#content div.site div.table_fixed_left table thead tr th {
  font-size: 12px;
  text-transform: uppercase;
  padding: 0;
  height: 74px;
  border: 2px solid #FFF;
}

#content div.site div.table_scroll_right table td a small {
  position: relative;
  top: -2px;
  background: #333;
  padding: 0 5px 2px;
  border-radius: 10px;
  font-weight: normal;
  font-size: 0.7em;
  margin-left: 3px;
}

#content div.site div.table_scroll_right table thead {
  background: #FFF;
}

#content div.site div.table_scroll_right table tr th {
  border-color: #FFF;
  text-align: left;
  border: 2px solid #FFF;
}

#content div.site div.table_scroll_right table tr td {
  border-color: #FFF;
  border-width: 2px 10px;
}

#content div.site div.table_scroll_right table tr td a,
#content div.site div.table_scroll_right table tr td span {
  float: right;
  position: relative;
  width: 50%;
  height: 100%;
  padding: 0;
  color: #FFF;
  text-transform: uppercase;
}

#content div.site div.table_scroll_right table tr td a.double {
  padding-top: 10px;
}

#content div.site div.table_scroll_right table tr td a:nth-of-type(2):before {
  font-family: FontAwesome;
  font-size: 2em;
  content: "\f044";
  text-align: right;
  position: absolute;
  top: 25%;
  right: 8px;
}

#content div.site div.table_scroll_right table tr td a:hover {
  text-decoration: none;
}

#content div.site div.table_scroll_right table tr td a.draft {
  background: #7898ff;
}

#content div.site div.table_scroll_right table tr td a.pre-order {
  background: #f778db;
}

#content div.site div.table_scroll_right table tr td a.ordered {
  background: #65AE46;
}

#content div.site div.table_scroll_right table tr td a.awaiting-delivery {
  background: #F58120;
}

#content div.site div.table_scroll_right table tr td a.delivered {
  background: #28407F;
}

#content div.site div.table_scroll_right table tr td span {
  float: left;
  width: 100%;
  /*text-indent: -99999px;*/
  background: #DDD;
}

#content table.tick {
  table-layout: fixed;
  display: table !important;
}

#content table.tick tr td,
#content table.tick tr th {
  table-layout: fixed;
  width: 160px;
  height: 74px;
  padding: 0 !important;
}

#content table.tick.right tr td,
#content table.tick.right tr th {
  overflow: hidden;
}

#content table.tick tr th,
#content table.tick tr td.header {
  font-size: 0.8em !important;
  text-transform: uppercase;
  text-align: center !important;
  overflow: hidden;
}

#content table.tick tr td.header {
  font-weight: bold;
  background: #2c518a;
  color: #FFF;
}

#content table.tick.left td:first-of-type,
#content table.tick.left th:first-of-type {
  font-size: 0.9em;
}

#content table.tick td a,
#content table.tick td span {
  width: 99% !important;
  height: 100% !important;
  display: inline-block !important;
  border: none;
  float: none !important;
  box-sizing: border-box;
}

#content table.tick td a strong,
#content table.tick td span strong {
  display: inline-block;
  padding: 10px 0 0;
}

#content table.tick td.na {
  background: #E3E3E3;
}

#content table.tick td.applied span {
  background: #444 !important;
  color: #FFF !important;
  width: 158px !important;
}

#content table.tick td.applied a {
  background: #d75252;
  background: #444;
}

#content table.tick td.ready_to_scaffold a {
  background: #3689ef;
}

#content table.tick td.in_progress a {
  background: #ffb23c;
}

#content table.tick td.not_needed a {
  background: #ef5536;
}

#content table.tick td.completed a {
  background: #95d752;
}

#content table.tick td.credited a,
#content table.tick td.to_be_credited a {
  background: #9152d7;
}

#content table.tick td.not_started a {
  background: #FFF;
  border: 1px solid #d0d0d0;
}

/*
#content table.tick.right tr td:first-of-type a {
	width: 158px !important;
	font-weight: bold;
}
*/
#content a.excel-export {
  float: right;
  padding: 9px 40px 10px 0;
  margin: -60px 30px 0 0;
  background: url("../../admin/core/media/images/excel-icon.png") right top no-repeat;
  background-size: 32px;
}

#content table.tick.right tr td br + a {
  background: none !important;
  position: absolute !important;
  left: 0;
}

#content table.tick.right td.progress,
#content table.tick.right td.dismantle,
#content table.tick.right td.na {
  position: relative;
}

#content table.tick.right td.progress {
  background: #ffb23c;
}

#content table.tick.right td.dismantle {
  background: #ef5536;
  color: #fff;
}

#content table.tick.right td.progress div,
#content table.tick.right td.dismantle div,
#content table.tick.right td.na div {
  position: absolute;
  top: 5px;
  left: 5px;
  font-size: 0.7em;
  line-height: 1.4em;
  text-align: left;
  height: 85%;
  width: 95%;
  overflow: auto;
  color: #fff;
}

#content table.tick.right td.na div {
  color: #3a3a3a;
}

#content table.tick.right td.progress div span,
#content table.tick.right td.dismantle div span,
#content table.tick.right td.na div span {
  height: auto !important;
  background: transparent !important;
  text-transform: none;
}

#content table.tick.right td.progress div span,
#content table.tick.right td.na div span {
  color: #e12c2c !important;
}

#content table.ancillary td.add a,
#content table.ancillary td.add span {
  display: block;
  width: 20px;
  height: 20px;
  background: url("../images/icons/add.png") left top no-repeat;
  background-size: 20px;
  text-indent: -9999px;
  margin: 0 auto;
}

#content table.ancillary td.add span {
  opacity: 0.2;
}

#content div.site span.alert {
  position: absolute;
  right: 1.5%;
  font-size: 1.5em;
  padding: 30px 0 0;
}

#content div.site .key {
  width: auto;
  float: right;
  margin-right: 2.5%;
  padding: 30px 0 0 0;
  height: auto;
  display: inline-block;
  text-align: right;
  padding-right: 15px;
}

#content div.site .key li {
  display: inline-block;
  float: left;
  padding-left: 30px;
  line-height: 20px;
  margin-left: 40px;
  position: relative;
}

#content div.site .key li:after {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 0;
  left: 0;
  background: #CCC;
  content: "";
}

#content div.site .key li.na:after {
  background: #CCC;
}

#content div.site .key li.completed:after {
  background: #95d752;
}

#content div.site .key li.to_be_credited:after {
  background: #9152d7;
}

#content div.site .key li.ready:after {
  background: #3689ef;
}

#content div.site .key li.in_progress:after {
  background: #ffb23c;
}

#content div.site .key li.not_needed:after {
  background: #ef5536;
}

#content div.site .key li.not_started:after {
  background: #FFF;
  border: 1px solid #e2e2e2;
}

#content div.site .key li.applied:after {
  background: #444;
}

#content div.site a.sign_send,
#content div.site a.send_email,
#content div.site a.download {
  float: right;
  padding: 20px 30px 20px 70px;
  background-color: #0ab5cd;
  background-image: url(../images/icons/pdf-white.png);
  background-size: 30px;
  background-position: left 20px center;
  background-repeat: no-repeat;
  color: #FFF !important;
  display: inline-block;
  margin-right: 5%;
  margin-top: 30px !important;
  text-decoration: none;
  font-weight: bold;
}

#content div.site a.send_email,
#content div.site a.download {
  margin-right: 30px;
}

#content div.site a.sign_send {
  background-image: url(../images/icons/edit.svg);
  background-size: 26px;
  padding-left: 65px;
}

#content div.site a.send_email {
  background-image: url(../images/icons/email.png);
  background-size: 26px;
  padding-left: 65px;
}

div.send_email,
div.sign_send {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 800px;
  height: 660px;
  background: #FFF;
  z-index: 9999;
  box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0.5);
  box-shadow: 0px 0px 0px 100vw rgba(0, 0, 0, 0.5);
  display: none;
}

div.send_email h2,
div.sign_send h2 {
  font-size: 1.6rem;
  font-weight: bold;
  color: #2c518a !important;
  padding: 30px 40px;
  background: transparent !important;
}

div.send_email h2 a,
div.sign_send h2 a {
  text-indent: -9999px;
  background: #2c518a url(../images/icons/close.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 32px;
  width: 40px;
  height: 40px;
  position: absolute;
  top: 15px;
  right: 15px;
  float: right;
  position: absolute;
  color: #FFF;
  border-radius: 30px;
  padding: 5px 10px;
}

div.send_email form,
div.sign_send form {
  width: 90%;
  width: calc(100% - 100px);
  margin-left: 5%;
  margin-left: 50px;
  margin-top: 5%;
  margin-top: 50px;
  overflow: hidden;
}

div.send_email form label,
div.sign_send form label {
  width: 100%;
}

div.sign_send form canvas {
  border: 1px solid #e2e2e2;
  width: 100%;
  height: 150px;
  margin-bottom: 15px;
}

div.sign_send form a.clearButton {
  float: right;
  width: 20px;
  height: 20px;
  background: none !important;
  background-image: url(../images/icons/cross-red.png) !important;
  background-position: center;
  background-size: contain !important;
  background-repeat: no-repeat;
  text-indent: -9999px;
}

div.send_email form label em,
div.sign_send form label em {
  font-size: 0.9em;
}

div.sign_send form label span.warning,
div.sign_send form p.signature_warning {
  color: #CB0000 !important;
  background: transparent !important;
  padding: 0;
}

div.sign_send form p.signature_warning {
  position: absolute;
  margin: 9px 0 0 78px !important;
  width: auto;
}

div.send_email form button,
div.sign_send form button {
  display: inline-block;
  clear: both;
  float: right;
  padding: 20px 30px 20px 70px;
  background-size: 30px;
  background-position: left 20px center;
  background-repeat: no-repeat;
  color: #FFF;
  display: inline-block;
  margin-right: 5px;
  margin-top: 0 !important;
  text-decoration: none;
  height: auto !important;
  line-height: 1em !important;
  margin-top: 10px !important;
  margin-right: 0 !important;
}

div#content form fieldset ol li a.multiSelect {
  width: 100% !important;
  color: #3a3a3a !important;
  font-size: 1em;
}

div#content form fieldset ol li div.multiSelectOptions {
  width: 130% !important;
}

div#content form fieldset ol li div.multiSelectOptions input {
  width: 6%;
  margin-top: 5px;
}

div#content form fieldset ol li div.multiSelectOptions label {
  font-weight: normal;
  font-style: normal;
  color: #3a3a3a !important;
}

div#content form a.multiSelect {
  width: 200px !important;
  height: 40px;
  line-height: 40px;
  background: #FFF url(../images/icons/select@2x.png) right 20px center no-repeat !important;
  background-size: 15px !important;
  border: 1px solid #d2d2d2;
  border-radius: 5px;
  padding: 0 20px 0 15px;
  margin-right: 10px !important;
  margin-bottom: 5px !important;
  position: relative;
  cursor: default;
  text-decoration: none;
  display: -moz-inline-stack;
  display: inline-block;
  color: #3a3a3a !important;
}

div#content form a.multiSelect:link,
div#content form a.multiSelect:visited,
div#content form a.multiSelect:hover,
div#content form a.multiSelect:active {
  text-decoration: none;
}

div#content form a.multiSelect span {
  margin: 0;
  overflow: hidden;
  display: -moz-inline-stack;
  display: inline-block;
  white-space: nowrap;
  font-weight: normal;
  width: 100% !important;
}

div#content form div.multiSelectOptions {
  width: 200px !important;
  padding: 10px 10px 0 10px;
  overflow-y: auto;
  overflow-x: hidden;
  border: solid 1px #e2e2e2;
  background: #FFF;
  box-shadow: 0px 0px 5px 0px rgba(168, 168, 168, 0.2);
}

div#content form div.multiSelectOptions label {
  float: left;
  clear: both;
  width: 90%;
  color: #222;
  font-weight: normal;
  padding: 0 0 10px 0;
  height: auto;
  line-height: 1.4em;
}

div#content form div.multiSelectOptions label.optGroup {
  font-weight: 600;
}

div#content form div.multiSelectOptions .optGroupContainer label {
  padding-left: 10px;
}

div#content form div.multiSelectOptions.optGroupHasCheckboxes .optGroupContainer label {
  padding-left: 18px;
}

div#content form div.multiSelectOptions input {
  float: left;
  width: 15px;
  margin: 3px 6px 0 0;
  height: auto;
}

div#content form div.multiSelectOptions label.selectAll {
  border-bottom: dotted 1px #CCC;
}

#content table tr td img.files {
  width: 30px;
}

#content table tr td img.files.active {
  cursor: pointer;
}

#content table.latest_application td.handover img {
  width: 30px;
}

form div.toggle_password {
  width: 40px;
  height: 40px;
  display: inline-block;
  position: absolute;
  bottom: 12px;
  right: 0;
  border-radius: 0 3px 3px 0;
  background: #234374;
  background-image: url(../images/icons/visibility.svg);
  background-size: 22px;
  background-repeat: no-repeat;
  background-position: center;
  text-indent: -99999px;
}

form div.toggle_password.shown {
  background-image: url(../images/icons/visibility_off.svg);
}

.staff-account.documents label span.signed {
  float: none;
  padding-left: 32px;
  font-size: 0.7rem;
  font-weight: 300;
  position: relative;
}

.staff-account.documents label span.signed:before {
  content: "";
  width: 18px;
  height: 18px;
  background: #00d499;
  background-image: url("../../admin/core/media/images/tick_white.svg") !important;
  background-size: 14px;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  top: 50%;
  left: 6px;
  border-radius: 50%;
  transform: translateY(-50%);
}

.staff-account #add_issue_popup h2 span {
  width: 50%;
  display: inline-block;
}

.staff-account #add_issue_popup .contra_items {
  float: right;
  max-height: 70vh;
  overflow-y: scroll;
  overflow-x: hidden;
  padding-bottom: 40px;
}

.staff-account #add_issue_popup .contra_items table {
  width: 100%;
  margin-top: 26px;
}

p.emph span.half {
  width: 47.5%;
  display: inline-block;
}

p.emph span.half:last-of-type {
  float: right;
}

.staff-account form.issue:not(.search),
.staff-account form.contra_charge {
  width: 50%;
  float: left;
  display: inline-block;
  padding: 0 2.5%;
}

.staff-account form.issue:not(.search) table,
.staff-account form.contra_charge table {
  width: 100%;
}

.staff-account form.issue:not(.search) li.issue_detail,
.staff-account form.issue:not(.search) li.date_identified,
.staff-account form.contra_charge li.issue_detail,
.staff-account form.contra_charge li.date_identified {
  clear: left;
  margin-right: 2%;
}

.staff-account form.issue:not(.search) li.issue_action,
.staff-account form.issue:not(.search) li.date_identified + li,
.staff-account form.contra_charge li.issue_action,
.staff-account form.contra_charge li.date_identified + li {
  margin-right: 0;
}

.staff-account form.issue:not(.search) li.third,
.staff-account form.contra_charge li.third {
  width: 32%;
  display: inline-block;
  float: left;
  margin-right: 2%;
}

.staff-account form.issue:not(.search) li.third:nth-of-type(3n),
.staff-account form.contra_charge li.third:nth-of-type(3n) {
  margin-right: 0;
}

.staff-account form.issue:not(.search) button,
.staff-account form.contra_charge button {
  margin-top: 0;
}

.staff-account form.contra_charge {
  padding: 0 2.5% 40px 2.5%;
}

.staff-account form.contra_charge + h2 {
  width: 50%;
  display: inline-block;
  float: right;
  padding: 0 5% 16px 0;
}

.staff-account form.contra_charge + h2 + .existing_contras {
  width: 50%;
  display: inline-block;
  float: right;
  padding: 0 5% 16px 0;
}

.staff-account form.contra_charge + h2 + .existing_contras table {
  width: 100%;
}

form.table table {
  width: 100%;
}

.staff-account.wages table.site_budgets span.budget_ok {
  color: #4ac76b;
}

.staff-account.wages table.site_budgets span.budget_alert {
  color: #e87474;
}

.site_budgets_key {
  width: 100%;
  padding: 0 2.5%;
}

.site_budgets_key p {
  display: inline-block;
  float: left;
  margin-right: 50px !important;
  padding-left: 42px;
  line-height: 20px !important;
  position: relative;
  margin-bottom: 10px !important;
}

.site_budgets_key p:before {
  content: "";
  width: 30px;
  height: 20px;
  position: absolute;
  top: 0;
  left: 0;
  background: #e4e4e4;
}

.site_budgets_key p.highlight_released:before {
  background: var(--alt_blue);
}

.site_budgets_key p.highlight_part_applied:before {
  background: var(--orange);
}

.site_budgets_key p.highlight_completed:before {
  background: var(--green);
}

.site_budgets_key p.highlight_over_budget:before {
  background: var(--red);
}

.site_budgets_key p.highlight_locked:before {
  background: #333;
}

.site_budgets_view{
  width: auto;
  display: inline-block;
  float: right;
  padding: 0 2.5%;
}

.site_budgets_view + .site_budgets_view{
  padding-right: 0;
}

.site_budgets_view a{
  display: inline-block;
  float: left;
  padding: 6px 14px;
  height: auto;
  background: #f5f5f5;
  border: 1px solid #e0e0e0;
  text-decoration: none !important;
  transition: background 300ms ease, color 300ms ease;
}

.site_budgets_view a.active{
  background: var(--light_blue);
  color: #FFF !important;
}

.site_budgets_view a:hover{
  background: var(--light_blue);
  color: #FFF !important;
}

.site_budgets_view a:first-of-type{
  padding-left: 14px;
  border-radius: 5px 0 0 5px;
}

.site_budgets_view a:last-of-type{
  padding-right: 14px;
  border-radius: 0 5px 5px 0;
}

table.site_budgets td.highlight_completed,
table.site_budgets td.highlight_part_applied,
table.site_budgets td.highlight_not_started,
table.site_budgets td.highlight_released,
table.site_budgets td.highlight_locked {
  position: relative;
}

table.site_budgets td.highlight_completed:after,
table.site_budgets td.highlight_part_applied:after,
table.site_budgets td.highlight_not_started:after,
table.site_budgets td.highlight_released:after,
table.site_budgets td.highlight_locked:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 10px;
  height: 100%;
  background: #e4e4e4;
}

table.site_budgets td.highlight_completed:after {
  background: var(--green);
}

table.site_budgets td.highlight_part_applied:after {
  background: var(--orange);
}

table.site_budgets td.highlight_released:after {
  background: var(--alt_blue);
}

table.site_budgets td.highlight_locked:after {
  background: #333;
}

.staff-account.wages .site_budgets_wrapper {
  width: 95vw;
  margin-left: 2.5vw;
  height: 90vh;
  overflow: scroll;
  margin-top: 12px;
  display: inline-block;
  border: 1px solid #e2e2e2;
  border-radius: 3px;
}

.staff-account.wages .site_budgets_wrapper #hdtbl-1 {
  display: none !important;
}

.staff-account.wages table.site_budgets {
  width: 100% !important;
  table-layout: auto;
  border-collapse: separate;
  margin-top: 0;
  border: none;
}

.staff-account.wages table.site_budgets td,
.staff-account.wages table.site_budgets th {
  min-width: 200px;
  padding: 12px 20px !important;
  overflow: hidden;
  background: #FFF;
  position: relative;
  border-right: 1px solid #e4e4e4;
}

.staff-account.wages table.site_budgets td.right,
.staff-account.wages table.site_budgets th.right {
  padding-right: 24px !important;
}

.staff-account.wages table.site_budgets td div,
.staff-account.wages table.site_budgets th div {
  font-size: 0.9rem;
}

.staff-account.wages table.site_budgets td:nth-of-type(1),
.staff-account.wages table.site_budgets tr:nth-of-type(1) th:nth-of-type(1) {
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  min-width: 120px;
  z-index: 20;
}

.staff-account.wages table.site_budgets tr:nth-of-type(1) th{
  border-bottom: 1px solid #FFF;
}

.staff-account.wages table.site_budgets td:nth-of-type(2),
.staff-account.wages table.site_budgets th:nth-of-type(2) {
  position: -webkit-sticky;
  position: sticky;
  left: 120px;
  min-width: 200px;
  border-right: 1px solid #e2e2e2;
  z-index: 20;
}

.staff-account.wages table.site_budgets td:nth-of-type(5),
.staff-account.wages table.site_budgets th:nth-of-type(5) {
  border-right: 1px solid #e2e2e2;
}

.budget_breakdown {
  cursor: pointer;
  font-weight: bold;
}

div.budget_breakdown span.completion_bar{
  position: absolute;
  display: inline-block;
  top: 0;
  left: 0;
  bottom: 0;
  height: 100%;
  background: #000;
  z-index: 1;
}

div.budget_breakdown span.completion_bar_overlay{
  position: absolute;
  display: inline-block;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  height: 100%;
  width: 100%;
  background: #000;
  z-index: 3;
  mix-blend-mode: screen;
}

div.budget_breakdown span.completion_bar_overlay.not_started{
  background: #717171;
}

div.budget_breakdown span.completion_bar_overlay.part_applied{
  background: var(--orange);
}

div.budget_breakdown span.completion_bar_overlay.completed{
  background: var(--green);
}

div.budget_breakdown span.completion_bar_overlay.over_budget{
  background: var(--red);
}

div.budget_breakdown  span.completion{
  position: relative;
  z-index: 2;
  font-size: 1.4rem;
  mix-blend-mode: difference;
  color: white;
  line-height: 1;
  top: 2px;
}

div.budget_breakdown span.completion small{
  font-size: 0.8rem;
  position: relative;
  top: -3px;
  line-height: 1;
}

.staff-account.wages table.site_budgets thead {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  left: 0;
  z-index: 50;
}

.staff-account.wages table.site_budgets thead th {
  background: #234374;
}

.staff-account.wages .popup_content table {
  table-layout: fixed;
}

div#content .staff-account.wages .popup_content table td:last-child,
div#content .staff-account.wages .popup_content table th:last-child,
div#content .staff-account.contra-charges .popup_content table td:last-child,
div#content .staff-account.contra-charges .popup_content table th:last-child {
  padding: 12px 16px 12px 0;
  width: 260px;
}

div#content .staff-account.wages .popup_content table td:last-child p,
div#content .staff-account.wages .popup_content table th:last-child p,
div#content .staff-account.contra-charges .popup_content table td:last-child p,
div#content .staff-account.contra-charges .popup_content table th:last-child p {
  display: inline-block;
  float: right;
  font-size: 1rem;
  padding-bottom: 0;
  line-height: 1.3;
}

div#content .staff-account.wages .popup_content table td:last-child p.single_line,
div#content .staff-account.wages .popup_content table th:last-child p.single_line,
div#content .staff-account.contra-charges .popup_content table td:last-child p.single_line,
div#content .staff-account.contra-charges .popup_content table th:last-child p.single_line {
  margin-top: 10px;
}

div#content .staff-account.wages .popup_content table td:last-child a,
div#content .staff-account.wages .popup_content table th:last-child a,
div#content .staff-account.contra-charges .popup_content table td:last-child a,
div#content .staff-account.contra-charges .popup_content table th:last-child a {
  display: inline-block;
  width: 40px;
  height: 40px;
  text-align: center;
  line-height: 40px;
  padding: 0;
  margin-left: 20px;
  float: right;
}

div#content .staff-account.wages .popup_content table td:last-child a span,
div#content .staff-account.wages .popup_content table th:last-child a span,
div#content .staff-account.contra-charges .popup_content table td:last-child a span,
div#content .staff-account.contra-charges .popup_content table th:last-child a span {
  transition: transform 300ms ease;
  display: inline-block;
  font-size: 1.4rem;
}

div#content .staff-account.wages .popup_content table td:last-child a.open span,
div#content .staff-account.wages .popup_content table th:last-child a.open span,
div#content .staff-account.contra-charges .popup_content table td:last-child a.open span,
div#content .staff-account.contra-charges .popup_content table th:last-child a.open span {
  transform: rotate(45deg);
}

div#content .staff-account.wages .popup_content table td:last-child .contra_charge_details,
div#content .staff-account.wages .popup_content table th:last-child .contra_charge_details,
div#content .staff-account.contra-charges .popup_content table td:last-child .contra_charge_details,
div#content .staff-account.contra-charges .popup_content table th:last-child .contra_charge_details {
  text-align: left;
  display: inline-block;
  width: 100%;
  display: none;
}

div#content .staff-account.wages .popup_content table td:last-child .contra_charge_details textarea,
div#content .staff-account.wages .popup_content table th:last-child .contra_charge_details textarea,
div#content .staff-account.contra-charges .popup_content table td:last-child .contra_charge_details textarea,
div#content .staff-account.contra-charges .popup_content table th:last-child .contra_charge_details textarea {
  height: 80px;
}

div#content .staff-account.wages .popup_content table td:last-child .contra_charge_details form,
div#content .staff-account.wages .popup_content table th:last-child .contra_charge_details form,
div#content .staff-account.contra-charges .popup_content table td:last-child .contra_charge_details form,
div#content .staff-account.contra-charges .popup_content table th:last-child .contra_charge_details form {
  display: inline-block;
  padding-top: 10px;
}

div#content .staff-account.wages .popup_content table td:last-child .contra_charge_details form p.error,
div#content .staff-account.wages .popup_content table th:last-child .contra_charge_details form p.error,
div#content .staff-account.contra-charges .popup_content table td:last-child .contra_charge_details form p.error,
div#content .staff-account.contra-charges .popup_content table th:last-child .contra_charge_details form p.error {
  font-size: 1rem !important;
  margin: 10px 0;
}

div#content .staff-account.wages .popup_content table td:last-child .contra_charge_details form span.warning,
div#content .staff-account.wages .popup_content table th:last-child .contra_charge_details form span.warning,
div#content .staff-account.contra-charges .popup_content table td:last-child .contra_charge_details form span.warning,
div#content .staff-account.contra-charges .popup_content table th:last-child .contra_charge_details form span.warning {
  margin-top: 10px;
}

div#content .staff-account.wages .popup_content table td:last-child .contra_charge_details form button,
div#content .staff-account.wages .popup_content table th:last-child .contra_charge_details form button,
div#content .staff-account.contra-charges .popup_content table td:last-child .contra_charge_details form button,
div#content .staff-account.contra-charges .popup_content table th:last-child .contra_charge_details form button {
  margin-bottom: 12px;
  margin-top: 0;
}

div#content .staff-account.wages .popup_content table td:last-child .contra_charge_details form label,
div#content .staff-account.wages .popup_content table th:last-child .contra_charge_details form label,
div#content .staff-account.contra-charges .popup_content table td:last-child .contra_charge_details form label,
div#content .staff-account.contra-charges .popup_content table th:last-child .contra_charge_details form label {
  text-align: right;
}

div#content .staff-account.wages .popup_overlay,
div#content .staff-account.contra-charges .popup_overlay,
div#content .staff-account.nhbc .popup_overlay,
div#content .staff-account.issues .popup_overlay {
  position: fixed;
  display: inline-block;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.8);
  z-index: 5000;
  opacity: 0;
  visibility: hidden;
  background-image: url(../images/icons/close.svg);
  background-size: 42px;
  background-position: right 1vw top 1vw !important;
  background-repeat: no-repeat !important;
  transition: opacity 600ms ease 0ms, visibility 0ms ease 600ms;
  cursor: zoom-out;
}

div#content .staff-account.wages .popup_overlay.shown,
div#content .staff-account.contra-charges .popup_overlay.shown,
div#content .staff-account.nhbc .popup_overlay.shown,
div#content .staff-account.issues .popup_overlay.shown {
  opacity: 1;
  visibility: visible;
  transition: opacity 600ms ease 0ms, visibility 0ms ease 0ms;
}

div#content .staff-account.wages .popup,
div#content .staff-account.contra-charges .popup,
div#content .staff-account.nhbc .popup,
div#content .staff-account.issues .popup {
  position: fixed;
  background: #FFF;
  height: auto;
  box-shadow: 0px 0px 15px 2px rgba(0, 0, 0, 0.4);
  opacity: 0;
  visibility: hidden;
  text-align: center;
  z-index: 9000;
  bottom: auto;
  top: 50%;
  width: 90vw;
  max-width: 90vw;
  left: 5vw;
  transform: translateY(-50%);
  padding: 40px 30px;
  text-align: left;
  max-height: 90vh;
  overflow: scroll;
  display: inline-block;
  transition: opacity 600ms ease 0ms, visibility 0ms ease 600ms;
}

div#content .staff-account.issues .popup {
  min-height: 90vh;
}

div#content .staff-account.wages .popup .close_popup,
div#content .staff-account.contra-charges .popup .close_popup,
div#content .staff-account.nhbc .popup .close_popup,
div#content .staff-account.issues .popup .close_popup {
  width: 40px;
  height: 40px;
  padding: 0 !important;
  margin: 0 !important;
  position: absolute;
  top: 10px;
  right: 10px;
  text-indent: -9999px;
  background: transparent url("../../admin/core/media/images/close.svg") !important;
  background-size: 16px;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

div#content .staff-account.wages .popup p.error,
div#content .staff-account.contra-charges .popup p.error,
div#content .staff-account.nhbc .popup p.error,
div#content .staff-account.issues .popup p.error {
  background: transparent !important;
  padding: 0 !important;
  color: #e65e5d !important;
  font-size: 1.1rem !important;
}

div#content .staff-account.wages .popup table,
div#content .staff-account.contra-charges .popup table,
div#content .staff-account.nhbc .popup table,
div#content .staff-account.issues .popup table {
  width: 100% !important;
  margin-top: 14px;
}

div#content .staff-account.wages .popup button,
div#content .staff-account.contra-charges .popup button,
div#content .staff-account.nhbc .popup button,
div#content .staff-account.issues .popup button {
  float: none;
  display: inline-block;
}

div#content .staff-account.wages .popup.shown,
div#content .staff-account.contra-charges .popup.shown,
div#content .staff-account.nhbc .popup.shown,
div#content .staff-account.issues .popup.shown {
  opacity: 1;
  visibility: visible;
  transition: opacity 600ms ease 0ms, visibility 0ms ease 0ms;
}

div#content .staff-account.issues table td input,
div#content .staff-account.issues table td select,
div#content .staff-account.issues table td textarea {
  margin-bottom: 0;
}

div.signature {
  width: 638px;
  height: auto;
  display: inline-block;
  overflow: hidden;
  position: relative;
}

div.signature canvas {
  border: 1px solid #d2d2d2;
  border-radius: 3px;
  display: inline-block;
  float: left;
  margin-bottom: 10px;
}

table thead tr.sign form .clearButton,
table tbody tr.sign form .clearButton,
div.signature .clearButton {
  position: absolute;
  display: inline-block;
  text-indent: -9999px;
  top: 14px;
  left: 50%;
  margin-left: 111px;
  width: 40px;
  height: 40px;
  border: 1px solid #d2d2d2;
  border-radius: 0 3px 0 0;
  background: #FFF;
  background-size: 24px;
  background-position: center;
  background-repeat: no-repeat;
}

div.signature .clearButton {
  top: auto;
  left: auto;
  right: 0;
  bottom: 92px;
  margin: 0;
}

.signature_warning {
  height: auto;
  color: #e65e5d;
  padding: 4px 0 8px 28px;
  display: inline-block;
  width: 100%;
  font-size: 0.9rem;
  margin-top: 0;
  margin-bottom: 8px;
  line-height: 1;
  background-image: url(../../admin/core/media/images/warning.svg) !important;
  background-repeat: no-repeat !important;
  background-size: 20px !important;
  background-position: left top 2px;
}

.staff-account.inspections #fk_plot_id[multiple] {
  height: 232px;
}

.staff-account.inspections #fk_plot_id[multiple] option:first-of-type:not([disabled]) {
  display: none;
}

.staff-account.inspections #fk_plot_id:not([multiple]) option:not([disabled])[value=null] + option:not([disabled])[value=null] {
  display: none;
}

.staff-account.inspections #fk_plot_id:not([multiple]) option:not([disabled])[value=all] + option:not([disabled])[value=null] {
  display: none;
}

.staff-account.inspections table td.add a {
  width: 40px;
  height: 40px;
  display: inline-block;
  text-indent: -99999px;
  background: url(../../admin/core/media/images/add.svg);
  background-size: 22px;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

.staff-account.inspections table td input {
  display: inline-block !important;
  width: 40px;
  height: 40px;
}

.staff-account.inspections form.table button {
  float: right;
}

.staff-account.inspections .inspection_questions {
  display: inline-block;
  overflow: hidden;
  width: 100%;
  height: auto;
}

.staff-account.inspections dl.inspection_question {
  background: none;
  padding: 0;
  border: 0;
  margin-top: 0;
}

.staff-account.inspections dl.inspection_question dt {
  display: none;
}

.staff-account.inspections dl.inspection_question dd {
  display: inline-block;
  float: left;
  width: 31.66%;
  margin: 0 2.5% 20px 0;
  display: inline-block;
}

.staff-account.inspections dl.inspection_question dd:last-of-type {
  margin-right: 0;
}

.staff-account.inspections dl.inspection_question dd label {
  display: inline-block;
  width: 100%;
  text-align: center;
  padding: 20px 0;
  background: #f5f5f5 !important;
  border: 1px solid #e2e2e2;
  cursor: pointer;
  transition: background 300ms ease, color 300ms ease;
}

.staff-account.inspections dl.inspection_question dd label.checked {
  background: #919191 !important;
  color: #FFF !important;
}

.staff-account.inspections dl.inspection_question dd label.checked.pass {
  background: #00d499 !important;
}

.staff-account.inspections dl.inspection_question dd label.checked.fail {
  background: #e65e5d !important;
}

.staff-account.inspections dl.inspection_question dd label.checkbox {
  padding: 0;
  width: auto;
  background: transparent !important;
  border: none !important;
  padding-left: 46px;
  position: relative;
  padding-top: 4px;
  min-height: 30px;
  text-align: left;
}

.staff-account.inspections dl.inspection_question dd label.checkbox:before {
  content: "";
  display: inline-block;
  width: 30px;
  height: 30px;
  background: #FFF !important;
  border: 1px solid #e2e2e2;
  border-radius: 3px;
  position: absolute;
  left: 0;
  top: 0;
}

.staff-account.inspections dl.inspection_question dd label.checkbox:after {
  content: "✔";
  display: inline-block;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  position: absolute;
  font-size: 1.2rem;
  color: #2c518a;
  left: 0;
  top: 0;
  opacity: 0;
  transform: scale(0.5);
  transition: opacity 300ms ease, transform 300ms ease;
}

.staff-account.inspections dl.inspection_question dd label.checkbox.ticked:after {
  opacity: 1;
  transform: scale(1);
}

.staff-account.inspections h2 + span.warning {
  margin-top: -6px !important;
}

.staff-account.inspections li.warning .custom_upload {
  border: 1px solid #e65e5d;
}

.staff-account.inspections .custom_upload p {
  display: none;
}

.staff-account.inspections li textarea {
  height: 138px;
}

.staff-account.inspections a.existing_image, .staff-account.inspections a.gps_location {
  width: 100%;
  height: auto;
  display: inline-block;
  border: 1px solid #e2e2e2;
  margin-top: 0;
  border-radius: 3px;
  padding: 16px;
}

.staff-account.inspections a.existing_image img, .staff-account.inspections a.gps_location img {
  width: auto;
  height: auto;
  max-height: 400px;
  max-width: 100%;
  display: block;
  margin: 0 auto 0;
  float: none;
}

.staff-account.inspections a.gps_location {
  text-align: center;
  font-weight: 400;
  margin-top: -4px;
  padding: 12px;
  background: #FFF;
}

.staff-account.inspections a.gps_location:before {
  content: "";
  width: 26px;
  height: 26px;
  display: inline-block;
  background: url(../../admin/core/media/images/location.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 6px;
  position: relative;
  margin-bottom: -26px;
  bottom: 18px;
  opacity: 0.5;
  transition: opacity 300ms ease;
}

.staff-account.inspections a.gps_location:hover:before {
  opacity: 1;
}

.staff-account.inspections hr {
  display: inline-block;
  width: 100%;
  margin: 26px 0;
  border-bottom: 1px solid #e2e2e2;
}

.staff-account.inspections .export_inspection_pdf,
.staff-account.nhbc .pdf_export a {
  width: 40px !important;
  height: 40px !important;
  display: inline-block;
  background-color: transparent !important;
  background-image: url(../../admin/core/media/images/pdf-icon.svg);
  background-size: 22px;
  background-repeat: no-repeat;
  background-position: center;
  margin: 0;
  padding: 0;
  text-indent: -999999px;
  transition: opacity 300ms ease !important;
}

/***** Materials *****/
#content div.table_fixed_left,
#content div.table_scroll_right {
  float: left;
  width: 20%;
  margin-left: 2.5%;
}

#content div.table_scroll_right {
  width: 75%;
  overflow: auto;
  margin-left: 0;
}

#content div.table_fixed_left table,
#content div.table_scroll_right table {
  width: 100%;
  margin: 0;
  table-layout: fixed;
}

#content div.table_scroll_right table {
  display: none;
}

#content div.table_fixed_left table td,
#content div.table_scroll_right table td {
  padding: 0 !important;
  width: 200px;
  height: 74px;
  table-layout: fixed;
  font-weight: 400;
}

#content div.table_fixed_left table td small {
  display: inline-block;
  font-size: 0.7em;
  line-height: 1.2em;
  padding: 5px 0 0 0;
}

#content div.table_fixed_left table td span {
  float: left;
  width: 100%;
  height: 100%;
  padding-top: 20px;
  font-size: 0.8em;
  background: #DDD;
  font-weight: 400;
}

#content div.table_fixed_left table thead tr th {
  font-size: 12px;
  text-transform: uppercase;
  padding: 0;
  height: 74px;
  border: 2px solid #FFF;
  border-width: 2px 0;
}

#content div.table_scroll_right table td a small {
  position: absolute;
  top: 10px;
  right: 10px;
  background: #e65e5d;
  padding: 0 0;
  line-height: 26px;
  width: auto;
  min-width: 26px;
  border-radius: 50%;
  font-weight: 300;
  font-size: 0.8em;
  margin-left: 3px;
  text-align: center;
  color: #FFF;
}

#content div.table_scroll_right table thead {
  background: #FFF;
}

#content div.table_scroll_right table tr th,
#content div.table_scroll_right table tr td {
  border: 1px solid #FFF;
  border-width: 2px;
  text-align: center;
}

#content div.table_scroll_right table tr td a,
#content div.table_scroll_right table tr td span {
  float: right;
  position: relative;
  width: 49.5%;
  height: 100%;
  padding: 28px 25px 0 0;
  color: #FFF;
  font-weight: 400;
  text-transform: uppercase;
}

#content div.table_scroll_right table tr td span {
  padding: 28px 0 0;
}

#content div.table_scroll_right table tr td a:nth-of-type(2):before {
  content: "";
  -webkit-mask: url(../images/icons/view.svg) no-repeat 50% 50%;
  mask: url(../images/icons/view.svg) no-repeat 50% 50%;
  -webkit-mask-size: cover;
  mask-size: cover;
  background-color: #FFF;
  text-align: right;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 10px;
  width: 20px;
  height: 20px;
}

#content div.table_scroll_right table tr td a:first-child {
  float: left;
  padding-right: 0;
}

#content div.table_scroll_right table tr td a.double {
  padding-top: 18px;
}

#content div.table_scroll_right table tr td a:hover {
  text-decoration: none;
}

#content div.table_scroll_right table tr td a.multiple {
  background: #aaa;
}

#content div.table_scroll_right table tr td a.draft {
  background: #7898ff !important;
}

#content div.table_scroll_right table tr td a.pre-order {
  background: #f778db !important;
}

#content div.table_scroll_right table tr td a.ordered {
  background: #ef8d4c !important;
}

#content div.table_scroll_right table tr td a.awaiting-delivery {
  background: #F58120 !important;
}

#content div.table_scroll_right table tr td a.delivered {
  background: #00d499 !important;
}

#content div.table_scroll_right table tr td a.cancelled {
  background: #e65e5d !important;
}

#content div.table_scroll_right table tr td span {
  float: left;
  width: 100%;
  background: #DDD;
}

#content div.popup a.close {
  float: right;
  color: #FFF;
  background: #508CC4;
  padding: 5px 10px;
  font-weight: bold;
}

#content div.popup a.close:hover {
  text-decoration: none;
}

#content div.popup li.delivery_image,
#content div.popup input.file {
  display: none;
}

#content div.popup div.image_upload_button {
  width: 40px;
  height: 30px;
  background: #508cc4 url(../images/icons/camera.svg) no-repeat;
  background-size: auto 80%;
  background-position: center;
  display: inline-block;
  clear: left;
  float: left;
  margin-top: 5px;
  cursor: pointer;
  transition: background 300ms;
}

#content div.popup div.image_upload_button:hover {
  background: #28407f url(../images/icons/camera.svg) no-repeat;
  background-size: auto 80%;
  background-position: center;
  transition: background 300ms;
}

#content div.popup div.image_upload_button.error {
  background-color: #e65e5d;
}

#content div.popup div.image_upload_file {
  display: inline-block;
  float: left;
  padding-left: 54px;
  position: relative;
  cursor: pointer;
}

#content div.popup div.image_upload_file:before {
  content: "";
  width: 40px;
  height: 40px;
  position: absolute;
  top: 0;
  left: 0;
  background: #508cc4 url(../images/icons/camera.svg) no-repeat;
  background-size: auto 60%;
  background-position: center;
  transition: background 300ms;
}

#content div.popup div.image_upload_file:hover:before {
  background-color: #28407f;
}

#content div.popup div.image_upload_file.error:before {
  background-color: #e65e5d;
}

#content div.popup div.image_upload_file p {
  line-height: 40px;
  display: inline-block;
}

#content div.popup a.thumb {
  width: 49%;
  display: inline-block;
  float: left;
}

#content div.popup a.thumb img,
#content div.popup a.thumb span,
#content div.popup ol li.group input,
#content div.popup ol li.group label {
  float: left;
  max-width: 100%;
}

#content div.popup a.thumb img {
  width: 300px;
}

#content div.popup a.thumb span {
  padding: 10px 0 0 0;
  font-size: 0.8rem;
  clear: both;
}

#content div.popup ol li.group input {
  width: 40px;
  margin: 0 0 0 -8px;
  height: 20px;
}

#content div.popup ol li.group label {
  width: 90%;
  padding-top: 2px;
}

#content div.popup p.product,
#content div.popup form.message,
#content div.popup p.message {
  padding: 10px 0;
  border: 1px solid #e2e2e2;
  border-width: 0 0 1px;
}

#content div.popup p.product + h2 {
  margin-top: 16px;
}

#content div.popup form.message {
  margin-bottom: 0;
  width: 112%;
  position: relative;
  left: -6%;
  padding: 40px 5.55%;
  background: #eee;
  margin-top: 14px;
  margin-bottom: -40px;
}

#content div.popup p.message {
  position: relative;
  overflow: hidden;
}

#content div.popup p.message small {
  font-size: 0.8rem;
  opacity: 0.8;
}

#content div.popup p.message a.message_file {
  width: 120px;
  height: auto;
  float: right;
  display: inline-block;
  margin-top: -30px;
}

#content div.popup p.message a.message_file img {
  display: inline-block;
  float: left;
}

#content div.popup p.message a.message_file.view {
  text-indent: -99999px;
  background: url(../../admin/core/media/images/pdf-icon.png);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

#content div.popup .multi_order {
  width: 31.66%;
  height: 90px;
  display: inline-block;
  float: left;
  margin: 0 2.5% 20px 0;
}

#content div.popup .multi_order:nth-of-type(3n) {
  margin-right: 0;
}

#content div.popup .multi_order a {
  width: 100%;
  display: inline-block;
  float: left;
  background: #508CC4;
  height: 100px;
  text-align: center;
  color: #FFF;
  padding: 14px 0;
  text-transform: uppercase;
  line-height: 1.2;
  font-size: 0.9rem;
  position: relative;
  text-decoration: none;
}

#content div.popup .multi_order a span {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
}

#content div.popup .multi_order a:first-of-type {
  border-right: 2px solid #FFF;
}

#content div.popup .multi_order a.pre-order {
  background: #f778db;
}

#content div.popup .multi_order a.ordered {
  background: #ef8d4c;
}

#content div.popup .multi_order a.cancelled {
  background: #e65e5d;
}

#content div.popup .multi_order a.delivered {
  background: #00d499;
}

#content div.popup .multi_order a small {
  position: absolute;
  top: 10px;
  right: 10px;
  background: #e65e5d;
  padding: 0 0;
  line-height: 26px;
  width: auto;
  min-width: 26px;
  border-radius: 50%;
  font-weight: 300;
  font-size: 0.8em;
  margin-left: 3px;
  text-align: center;
  color: #FFF;
}

div#content a.prev {
  background: transparent;
  left: 2.5%;
  margin-left: 10px;
}

div#content a.next {
  background: transparent;
  left: auto;
  right: 2.5%;
}

div#content table.calendar td {
  background: none;
}

table.calendar {
  clear: left;
}

table.calendar td {
  border: none !important;
  border-bottom: 1px solid #dadada !important;
  height: auto !important;
  position: relative;
}

table.calendar td p {
  padding: 16px 20px;
}

table.calendar td .info {
  position: absolute;
  top: 0;
  left: 0;
  background: #FFF;
  z-index: 9999;
  margin-bottom: 30px;
  padding: 30px 30px 24px 30px;
  width: 500px;
  max-height: 400px;
  overflow: scroll;
  box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.4);
}

table.calendar td .info p {
  padding: 0 0 6px 0;
  text-align: left;
  font-size: 0.9rem;
  white-space: nowrap;
}

table.calendar td .info p strong {
  display: inline-block;
  width: 150px;
  text-align: left;
}

table.calendar td .info .close_info {
  position: absolute;
  top: 0;
  right: 0;
  width: 40px;
  height: 40px;
  text-indent: -9999px;
  background: url(../images/icons/close.svg);
  background-size: 24px;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
}

table.calendar td .info h2 {
  text-align: left;
  font-size: 1.1rem;
  padding-top: 12px;
  border-top: 1px solid #d2d2d2;
  cursor: pointer;
  position: relative;
}

table.calendar td .info h2:after, table.calendar td .info h2:before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 2px;
  background: #234374;
  position: absolute;
  top: 50%;
  right: 0;
  transition: transform 300ms ease;
}

table.calendar td .info h2:after {
  transform: rotate(90deg);
}

table.calendar td .info h2:first-of-type {
  border-top: none;
}

table.calendar td .info h2.open:before {
  transform: rotate(45deg);
}

table.calendar td .info h2.open:after {
  transform: rotate(135deg);
}

table.calendar td .info .order_details {
  display: none;
  padding-bottom: 10px;
}

table.calendar td:last-child .info {
  left: auto;
  right: 0;
}

#content .staff-account.materials .table_scroll_right {
  position: relative;
  width: 95%;
  margin-left: 2.5%;
  max-height: 90vh;
  display: inline-block;
  overflow: scroll;
  margin-bottom: 5vh;
}

#content .staff-account.materials .table_scroll_right table {
  position: relative;
}

#content .staff-account.materials .table_scroll_right tr td, #content .staff-account.materials .table_scroll_right tr th {
  width: 100px;
}

#content .staff-account.materials .table_scroll_right tr td a, #content .staff-account.materials .table_scroll_right tr td span, #content .staff-account.materials .table_scroll_right tr th a, #content .staff-account.materials .table_scroll_right tr th span {
  width: 100%;
  position: relative;
  height: 100px;
}

#content .staff-account.materials .table_scroll_right tr td a span, #content .staff-account.materials .table_scroll_right tr td span span, #content .staff-account.materials .table_scroll_right tr th a span, #content .staff-account.materials .table_scroll_right tr th span span {
  background: transparent;
  padding: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  height: auto;
  transform: translate(-50%, -50%);
}

#content .staff-account.materials .table_scroll_right tr td:first-of-type, #content .staff-account.materials .table_scroll_right tr th:first-of-type {
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  z-index: 6666;
  border-left: none;
}

#content .staff-account.materials .table_scroll_right tr td:first-of-type:after, #content .staff-account.materials .table_scroll_right tr th:first-of-type:after {
  content: "";
  width: 2px;
  height: 100%;
  background: #FFF;
  position: absolute;
  top: 0;
  left: 100%;
  bottom: 0;
}

#content .staff-account.materials .table_scroll_right tr td:first-of-type {
  background: #FFF;
}

#content .staff-account.materials .table_scroll_right tr td:first-of-type:before {
  content: "";
  width: 100%;
  height: 1px;
  background: #dadada;
  position: absolute;
  top: 100%;
  left: 0;
}

#content .staff-account.materials .table_scroll_right tr th:first-of-type {
  z-index: 7777;
}

#content .staff-account.materials .table_scroll_right tr th:first-of-type:before {
  height: 1px !important;
}

#content .staff-account.materials .table_scroll_right thead {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 8888;
}

#content .staff-account.materials .table_scroll_right thead th {
  border-top: none;
  border-bottom: none;
}

#content .staff-account.materials .table_scroll_right thead th:before {
  content: "";
  width: 100%;
  height: 2px;
  background: white;
  position: absolute;
  bottom: 0;
  left: 0;
}

table#smp_calendar{
  table-layout: fixed;
  vertical-align: top;
}

table#smp_calendar tr td{
  vertical-align: top;
  border: 1px solid #e0e0e0;
  position: relative;
  background: #FFF;
}

table#smp_calendar tr td.weekend{
  background: #eee;
}

table#smp_calendar tr td div.calendar_cell{
  min-height: 130px;
  padding: 0 !important;
}

table#smp_calendar tr td div.calendar_cell a,
table#smp_calendar tr td div.calendar_cell .calendar_event{
  text-align: left;
  margin-bottom: 8px;
  font-weight: 300;
  width: 100%;
  display: inline-block;
  padding: 2px 0;
  padding-left: 14px;
  position: relative;
  font-size: 0.9rem;
  text-decoration: none;
  transition: opacity 300ms ease;
}

table#smp_calendar tr td div.calendar_cell .calendar_event{
  position: relative;
  transition: opacity 300ms ease;
  cursor: pointer;
}

table#smp_calendar tr td div.calendar_cell .calendar_event strong{
  display: inline-block;
  width: 100%;
  padding-right: 36px;
}

table#smp_calendar tr td div.calendar_cell .day_view{
  cursor: pointer;
}

table#smp_calendar tr td div.calendar_cell .calendar_event span.time{
  position: absolute;
  top: 2px;
  right: 0;
  opacity: 0.7;
}

table#smp_calendar tr td div.calendar_cell .calendar_event .actions{
  width: auto;
  background: rgba(255,255,255,0.8);
  position: absolute;
  top: 100%;
  right: 0;
  opacity: 0;
  z-index: 500;
  visibility: hidden;
  transition: opacity 300ms ease, visibility 0ms ease 300ms;
}

table#smp_calendar tr td div.calendar_cell .calendar_event .actions button{
  margin: 0;
  padding: 0;
  width: 40px;
  height: 40px;
  display: inline-block;
  float: right;
  clear: none;
  text-indent: -9999px;
  background-color: transparent !important;
  background-image: url(../../../core/media/images/edit.svg);
  background-size: 22px;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0.6;
  transition: opacity 300ms ease;
}

table#smp_calendar tr td div.calendar_cell .calendar_event .actions button.delete_appointment{
  background-image: url(../../../core/media/images/delete.svg);
  background-size: 14px;
  margin-left: 10px;
}

table#smp_calendar tr td div.calendar_cell .calendar_event .actions button.delete_appointment:first-of-type{
  margin-left: 0;
}

table#smp_calendar tr td div.calendar_cell .calendar_event .actions button:hover{
  opacity: 1;
}

table#smp_calendar tr td div.calendar_cell:hover a,
table#smp_calendar tr td div.calendar_cell:hover .calendar_event{
  opacity: 0.4;
}

table#smp_calendar tr td div.calendar_cell:hover .billing_event:hover a,
table#smp_calendar tr td div.calendar_cell:hover a:hover,
table#smp_calendar tr td div.calendar_cell:hover .calendar_event:hover{
  opacity: 1;
}

table#smp_calendar tr td div.calendar_cell .calendar_event:hover .actions{
  opacity: 1;
  visibility: visible;
  transition: opacity 300ms ease, visibility 0ms ease 0ms;
}

table#smp_calendar tr td div.calendar_cell span.key{
  width: 5px;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
}

table#smp_calendar tr td div.calendar_cell a .value{
  font-weight: 400;
  display: block;
}

table#smp_calendar tr td p.date{
  width: 100%;
  color: #d5d5d5;
  display: inline-block;
  text-align: right;
  font-size: 1.2rem;
  line-height: 30px;
  position: relative;
  margin-bottom: 10px !important;
}

table#smp_calendar tr td.month p.date{
  color: #707070;
}

table#smp_calendar tr td.today p.date{
  color: var(--alt_blue); !important;
  font-weight: 700;
  margin-bottom: 0 !important;
}

table#smp_calendar tr td p.date button{
  float: left;
  margin: 0;
  background: transparent !important;
  color: #2c518a;
  padding: 0;
  line-height: 1;
  font-size: 1.4rem;
  font-weight: 300;
  position: absolute;
  height: auto;
  top: 0;
  left: 0;
  width: 30px;
  bottom: 0;
  text-align: left;
  opacity: 0.4;
  transition: opacity 300ms ease;
}

table#smp_calendar tr td p.date button:hover{
  opacity: 1;
}

.popup.calendar_appointment{
  width: 720px;
  text-align: left;
}

.popup.calendar_day_view{
  width: 90vw;
}

.popup.calendar_appointment form{
  width: 100%;
  border-radius: 0;
}

.popup.calendar_appointment form p{
  margin-bottom: 0;
}

.popup.calendar_appointment form p strong{
  font-weight: 500;
}

.popup.calendar_appointment form input[type="color"]{
  padding: 0 !important;
}

.popup.calendar_appointment form button{
  clear: none;
  float: right;
  margin-bottom: 15px;
}

.popup.calendar_appointment form button.delete_appointment{
  float: left;
  background-color: transparent;
  padding: 0;
  text-indent: -999999px;
  width: 46px;
  background-color: transparent !important;
  background-image: url(../../../core/media/images/delete.svg);
  background-size: 20px;
  background-repeat: no-repeat;
  background-position: left center;
  opacity: 0.6;
  transition: opacity 300ms ease;
}

.popup.calendar_appointment form button.delete_appointment:hover{
  opacity: 1;
}

.staff-account.materials table.delivery_calendar td .info {
  position: absolute;
  top: 0;
  left: 0;
  background: #FFF;
  z-index: 9999;
  margin-bottom: 30px;
  max-height: 400px;
  min-width: 500px;
  overflow-Y: scroll;
  width: auto;
  white-space: nowrap;
  cursor: default;
  padding: 40px 40px 34px 40px;
  box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.4);
}

.staff-account.materials table.delivery_calendar td:nth-of-type(n + 4) .info{
  left: auto;
  right: 0;
}

.staff-account.materials table.delivery_calendar td .info div {
  padding: 0;
  width: auto;
  overflow: hidden;
  display: inline-block;
  float: left;
  clear: both;
  padding-bottom: 20px;
}

.staff-account.materials table.delivery_calendar td .info div.hidden{
  display: none;
}

.staff-account.materials table.delivery_calendar td .info .close_info {
  width: 36px;
  height: 36px;
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  background-image: url(../../admin/core/media/images/close.svg);
  background-size: 26px;
  background-position: center;
  background-repeat: no-repeat;
  text-indent: -99999px;
  padding: 0;
  min-width: 0;
  cursor: pointer;
  background-color: transparent !important;
}
.staff-account.materials table.delivery_calendar td .info h2 {
  color: #303030;
  float: left;
  clear: both;
  width: 100%;
  padding: 0 0 10px 0;
  border-bottom: 1px solid #e0e0e0;
  font-size: 1.2rem;
  margin-bottom: 15px;
  display: block;
  text-align: left;
  display: inline-block;
  padding-right: 40px;
  font-size: 1rem;
  position: relative;
  cursor: pointer;
}

.staff-account.materials table.delivery_calendar td .info h2:after, 
.staff-account.materials table.delivery_calendar td .info h2:before {
  content: "";
  width: 16px;
  height: 2px;
  background: #2c518a;
  position: absolute;
  top: 10px;
  right: 0;
  transition: transform 300ms ease;
}

.staff-account.materials table.delivery_calendar td .info h2:after {
  transform: rotate(90deg);
}

.staff-account.materials table.delivery_calendar td .info h2.open:before {
  transform: rotate(45deg);
}

.staff-account.materials table.delivery_calendar td .info h2.open:after {
  transform: rotate(135deg);
}

.staff-account.materials table.delivery_calendar td .info p {
  padding: 0 0 6px 0;
  text-align: left;
  font-size: 0.9rem;
  overflow: hidden;
  position: relative;
  padding-left: 150px;
}
.staff-account.materials table.delivery_calendar td .info p strong {
  display: inline-block;
  width: 140px;
  text-align: left;
  position: absolute;
  top: 0;
  left: 0;
}

.staff-account.materials table.delivery_calendar td .info p a{
  padding: 0 !important;
  opacity: 1 !important;
  margin-bottom: 0 !important;
}

.staff-account.materials table.delivery_calendar td:last-child .info {
  left: auto;
  right: 0;
}

.staff-account.materials table.delivery_calendar td div {
  padding: 15px 20px;
}

.staff-account.materials table.delivery_calendar td div p {
  margin-bottom: 0 !important;
}

.staff-account.affiliate li {
  width: 100%;
}

.staff-account.affiliate .share_link {
  width: 100%;
  background-color: #7898ff;
  border: 1px solid #d2d2d2;
  padding: 0 60px 0 20px !important;
  line-height: 46px !important;
  margin-bottom: 30px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  color: #FFF;
}

.staff-account.affiliate .share_link:after {
  content: "";
  position: absolute;
  top: 0;
  right: 20px;
  bottom: 0;
  width: 20px;
  display: inline-block;
  background-image: url(../../admin/core/media/images/share.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 16px;
  z-index: 5;
  filter: grayscale(100%) brightness(5);
}

.staff-account.affiliate .share_link span {
  overflow: scroll;
  display: inline-block;
  float: left;
  width: 100%;
}

.staff-account.affiliate .share_link + p.success {
  top: -30px;
  margin-bottom: -10px;
}

.staff-account.affiliate form p {
  padding-bottom: 10px;
  margin-top: -10px;
}

.staff-account.affiliate form p a {
  font-weight: 600;
  color: #7898ff;
}

.staff-account.affiliate form label a {
  font-weight: 600;
  color: #7898ff;
}

.staff-account.affiliate .affiliate_programme {
  padding: 20px 2.5vw 0;
  max-width: 50%;
}

.staff-account.affiliate .affiliate_programme .read_more_content {
  display: none;
}

.staff-account.affiliate .affiliate_programme .button {
  background: #234374;
  line-height: 44px;
  display: inline-block;
  color: #FFF;
  font-size: 0.9rem;
  padding: 0 20px;
  border-radius: 3px;
}

.staff-account.affiliate .affiliate_programme .read_more {
  background: none;
  display: block;
  text-align: center;
  margin: 20px auto 30px;
  color: #234374;
  font-weight: 600;
  cursor: pointer;
}

.staff-account.affiliate .affiliate_programme .read_more.active:after {
  content: "";
  width: 20px;
  height: 20px;
  display: inline-block;
  background: url(../../admin/core/media/images/close.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-left: 12px;
  position: relative;
  top: -4px;
  margin: -10px 0;
}

.staff-account.affiliate .affiliate_programme p {
  font-size: 1rem;
  line-height: 1.4;
  padding-bottom: 16px;
}

.staff-account.affiliate .affiliate_programme p a {
  color: #234374;
  font-weight: 600;
}

.staff-account.affiliate .affiliate_programme h1 {
  display: block !important;
  font-size: 1.6rem;
  font-weight: 300;
}

.staff-account.affiliate .affiliate_programme h2 {
  font-weight: 300;
  padding-bottom: 22px;
}

.staff-account.affiliate .affiliate_programme h3 {
  font-size: 1.2rem;
  padding-bottom: 20px;
  line-height: 1.3;
  color: #7898ff;
}

.staff-account.affiliate .affiliate_programme h3 a {
  color: inherit;
}

.staff-account.affiliate .affiliate_programme h4 {
  font-size: 1.1rem;
  padding-bottom: 20px;
  line-height: 1.3;
}

.staff-account.affiliate .affiliate_programme hr {
  width: 100%;
  height: 1px;
  border-bottom: 1px solid #CCC;
  margin-top: 12px;
  display: inline-block;
  margin-bottom: 22px;
  margin-bottom: 26px;
  margin-top: 6px;
}

.staff-account.affiliate .affiliate_programme a:not([href]) {
  display: inline-block;
  padding-top: 40px;
  margin-top: -40px;
  text-decoration: none !important;
}

.staff-account.affiliate .affiliate_programme ul:not(.slick-dots), .staff-account.affiliate .affiliate_programme ol {
  margin-bottom: 1.2rem;
  padding-top: 6px;
}

.staff-account.affiliate .affiliate_programme ul:not(.slick-dots) li, .staff-account.affiliate .affiliate_programme ol li {
  font-size: 1rem;
  padding: 11px 0;
  line-height: 1.4;
}

.staff-account.affiliate .affiliate_programme ul:not(.slick-dots) li {
  padding-left: 40px;
  position: relative;
}

.staff-account.affiliate .affiliate_programme ul:not(.slick-dots) li:before {
  content: "";
  display: inline-block;
  width: 26px;
  height: 26px;
  background-image: url(https://www.sitemanagerpro.co.uk/media/images/icons/tick_blue.svg);
  background-size: 26px;
  background-position: center;
  background-repeat: no-repeat;
  margin-right: 14px;
  position: relative;
  top: 6px;
  left: -40px;
  margin-right: -26px;
  position: absolute;
  left: 0;
  top: 8px;
}

.staff-account.affiliate .affiliate_programme ol {
  counter-reset: list;
}

.staff-account.affiliate .affiliate_programme ol li {
  counter-increment: list;
}

.staff-account.affiliate .affiliate_programme ol li:before {
  content: counter(list) ".";
  font-weight: 700;
  color: #7898ff;
  font-size: 1.2rem;
  margin-right: 6px;
}

.staff-account.affiliate .affiliate_programme .inline_index {
  height: auto;
  overflow: hidden;
  background: #FFF;
  z-index: 9999;
  top: 0;
  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.13);
  width: auto;
  display: inline-block;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  padding: 30px 30px 12px 30px;
  margin-bottom: 30px;
  text-align: center;
}

.staff-account.affiliate .affiliate_programme .inline_index.inline p.index_heading {
  text-align: center;
}

.staff-account.affiliate .affiliate_programme .inline_index.inline a {
  text-align: left;
}

.staff-account.affiliate .affiliate_programme .inline_index.inline .expand_contents {
  padding: 16px 56px 14px 30px;
}

.staff-account.affiliate .affiliate_programme .inline_index.inline .expand_contents:after {
  transform: rotate(-45deg);
}

.staff-account.affiliate .affiliate_programme .inline_index.inline .expand_contents:before {
  transform: rotate(45deg);
  right: 25px;
}

.staff-account.affiliate .affiliate_programme .inline_index.inline .expand_contents.open:before {
  right: 16px;
}

.staff-account.affiliate .affiliate_programme .inline_index p.index_heading {
  font-size: 1.2rem;
  display: inline-block;
  width: 100%;
  padding-bottom: 8px;
  margin-bottom: 20px;
  font-weight: 300;
  border-bottom: 1px solid #dcdcdc;
}

.staff-account.affiliate .affiliate_programme .inline_index a {
  display: inline-block;
  width: auto;
  float: left;
  clear: left;
  padding: 0 0 3px 0;
  font-size: 0.9rem;
  background: linear-gradient(#234374, #234374) left bottom no-repeat;
  background-size: 0% 2px;
  transition: background 400ms;
  margin: 0 0 12px !important;
  line-height: 1.3;
  text-decoration: none;
  text-align: left;
}

.staff-account.affiliate .affiliate_programme .inline_index a:last-child {
  padding-bottom: 0;
}

.staff-account.affiliate .affiliate_programme .loader {
  width: 200px;
  height: 80px;
  display: inline-block;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

.staff-account.affiliate .affiliate_programme .loader:before {
  content: "";
  display: inline-block;
  height: 10px;
  width: 130px;
  --c:no-repeat linear-gradient(#7898ff 0 0);
  background: var(--c), var(--c), #ddd;
  background-size: 60% 100%;
  border-radius: 6px;
  animation: loading 1.5s infinite;
  animation-timing-function: ease-in-out;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: relative;
}

.staff-account.affiliate .affiliate_programme .loader span {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #FFF;
  opacity: 0;
  transition: opacity 300ms ease;
}

.staff-account.affiliate .affiliate_programme .loader span .checkmark__circle {
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
  stroke-width: 2;
  stroke-miterlimit: 10;
  stroke: #00d499;
  fill: none;
}

.staff-account.affiliate .affiliate_programme .loader span .checkmark {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: block;
  stroke-width: 2;
  stroke: #fff;
  stroke-miterlimit: 10;
  margin: 10px auto;
  box-shadow: inset 0px 0px 0px #00d499;
}

.staff-account.affiliate .affiliate_programme .loader span .checkmark__check {
  transform-origin: 50% 50%;
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
}

.staff-account.affiliate .affiliate_programme .loader.done span {
  opacity: 1;
}

.staff-account.affiliate .affiliate_programme .loader.done span .checkmark__circle {
  animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) 0.4s forwards;
}

.staff-account.affiliate .affiliate_programme .loader.done span .checkmark {
  animation: fill 0.4s ease-in-out 0.8s forwards, scale 0.3s ease-in-out 1.3s both;
}

.staff-account.affiliate .affiliate_programme .loader.done span .checkmark__check {
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 1.2s forwards;
}

@keyframes loading {
  0% {
    background-position: -150% 0, -150% 0;
  }
  100% {
    background-position: 250% 0, 250% 0;
  }
}
@keyframes stroke {
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes scale {
  0%, 100% {
    transform: none;
  }
  50% {
    transform: scale3d(1.1, 1.1, 1);
  }
}
@keyframes fill {
  100% {
    box-shadow: inset 0px 0px 0px 30px #00d499;
  }
}
div#content .staff-account.nhbc form.search {
  width: 100%;
  max-width: 100%;
}

div#content .staff-account.nhbc form.search li, div#content .staff-account.nhbc form.search button {
  width: 14.44%;
  margin-right: 2.5%;
  position: relative;
}

div#content .staff-account.nhbc form.search li:nth-of-type(6n), div#content .staff-account.nhbc form.search button:nth-of-type(6n) {
  margin-right: 0;
}

div#content .staff-account.nhbc form.search button {
  float: right;
  margin-right: 0;
}

div#content .staff-account.nhbc table td.received {
  background: #F6F66E;
  font-weight: 400;
}

div#content .staff-account.nhbc table td.investigating {
  background: #7898ff;
  color: #FFF;
  font-weight: 400;
}

div#content .staff-account.nhbc table td.resolving {
  background: #ef8d4c;
  color: #FFF;
  font-weight: 400;
}

div#content .staff-account.nhbc table td.completed {
  background: #00d499;
  color: #FFF;
  font-weight: 400;
}

div#content .staff-account.nhbc table input[type=checkbox] {
  display: inline-block !important;
  width: 40px;
  height: 40px;
}

div#content .staff-account.nhbc form:not(.search) button {
  margin-top: 30px;
  width: 21.875%;
  float: right;
  background: var(--light_blue);
}

div#content .staff-account.nhbc .popup {
  max-width: 800px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

div.staff-account.cc form.search.planner {
  max-width: 100%;
}

div.staff-account.cc form.search.planner fieldset {
  float: left;
  width: 10%;
}

div.staff-account.cc form.search.planner fieldset:first-child {
  width: 90%;
}

div.staff-account.cc form.search.planner fieldset ol,
div.staff-account.cc form.search.planner button {
  width: 100%;
}

div.staff-account.cc form.search.planner fieldset ol li {
  width: 19.8%;
  padding-top: 7px;
}

div.staff-account.cc form.search.planner fieldset ol li label {
  display: none;
}

div.staff-account.cc a.button {
  float: left;
  padding: 10px;
  margin: 0 0 5px 2.5%;
  width: 24.6%;
  background: #234374;
  color: #FFF;
}

div.staff-account.cc a.button:hover {
  background: #2c518a;
  border-color: #2c518a;
  text-decoration: none;
}

div.staff-account.cc a.button.right {
  float: right;
  text-align: right;
  margin-right: 2.5%;
}

div.staff-account.cc table.planner {
  border-width: 1px 1px 0;
}

div.staff-account.cc table.planner tr td {
  height: 60px;
}

div.staff-account.cc table.planner tr:hover td {
  background: #fff;
}

div.staff-account.cc table.planner .staff {
  width: 240px;
  min-width: 200px;
  border: 1px solid #ddd;
  border-width: 0 1px 1px 0;
  text-align: left;
}

div.staff-account.cc table.planner th.staff {
  padding-left: 10px !important;
}

div.staff-account.cc table.planner th.staff form {
  width: 100%;
  padding: 0;
  border-width: 0;
}

div.staff-account.cc table.planner .day {
  width: 48px;
  min-width: 24px;
  padding: 6px;
  border: 1px solid #ddd;
  border-width: 0 1px 1px 0;
  font-size: 0.7em;
}

div.staff-account.cc table.planner .day.drop {
  background: #ace3a6;
}

div.staff-account.cc table.planner .day.error {
  background: #fcd6d5;
}

div.staff-account.cc table.planner tr.disabled td {
  background: #f4f4f4;
}

div.staff-account.cc table.planner .jobs {
  width: 300px;
  min-width: 200px;
  border: 1px solid #ddd;
  border-width: 0 0 1px 0;
  text-align: left;
  overflow: auto;
  padding-right: 0;
}

div.staff-account.cc table.planner td a {
  padding: 5px 10px;
  background: #234374;
  color: #FFF;
  border: 1px solid #234374;
  border-radius: 5px;
}

div.staff-account.cc table.planner td a:hover {
  background: #2c518a;
  border-color: #2c518a;
  color: #fff !important;
  text-decoration: none;
}

div.staff-account.cc table.planner td a.completed {
  background: #3d9745;
  border-color: #3d9745;
}

div.staff-account.cc table.planner td a.completed:hover {
  background: #36a941;
  border-color: #36a941;
}

div.staff-account.cc table.planner td a.empty,
div.staff-account.cc table.planner td a.empty:hover {
  background: transparent;
  border: none;
  padding: 7px 12px;
}

div.staff-account.cc table.planner .jobs {
  vertical-align: top;
}

div.staff-account.cc table.planner .jobs div {
  float: left;
  width: 100%;
  overflow: auto;
  padding-right: 10px;
  max-height: 68vh;
}

div.staff-account.cc table.planner .jobs ul {
  float: left;
  clear: left;
  width: 100%;
  margin: 0 0 5px;
  color: #222;
  transition: opacity 300ms ease;
  font-size: 1.1em;
}

div.staff-account.cc table.planner .jobs ul.draggable {
  cursor: grab;
}

div.staff-account.cc table.planner .jobs ul.drag {
  opacity: 0.1;
}

div.staff-account.cc table.planner .jobs ul.active {
  cursor: grabbing;
}

div.staff-account.cc table.planner .jobs ul li {
  position: relative;
  float: left;
  clear: both;
  width: 100%;
}

div.staff-account.cc table.planner .jobs ul li h2,
div.staff-account.cc table.planner .jobs ul li label {
  position: relative;
  float: left;
  clear: both;
  width: 100%;
  font-size: 1em;
  margin: 0 -5px 5px 0;
  padding: 5px;
  background: #234374;
  color: #FFF;
  border: 1px solid #234374;
}

div.staff-account.cc table.planner .jobs ul li label {
  padding-left: 30px;
}

div.staff-account.cc table.planner .jobs ul li input {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 999;
}

div.staff-account.cc table.planner .jobs ul li {
  font-size: 0.7em;
  font-weight: 600;
  line-height: 1.3em;
  margin: 0 0 5px !important;
}

div.staff-account.cc table.planner .jobs ul li span {
  padding-left: 5px;
  font-weight: 200;
}

div#content div.staff-account.cc .popup_overlay,
div#content div.staff-account.cc .popup {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0ms ease 0ms, visibility 0ms ease 0ms;
}

div#content div.staff-account.cc .popup_overlay {
  position: fixed;
  display: inline-block;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.8);
  z-index: 8000;
  opacity: 0;
  visibility: hidden;
  background-image: url("../../admin/core/media/images/close.svg") !important;
  background-size: 36px;
  background-position: right 1vw top 1vw !important;
  background-repeat: no-repeat !important;
  transition: opacity 600ms ease 0ms, visibility 0ms ease 600ms;
  cursor: zoom-out;
}

div#content div.staff-account.cc .popup_overlay.shown {
  opacity: 1;
  visibility: visible;
  transition: opacity 600ms ease 0ms, visibility 0ms ease 0ms;
}

div#content div.staff-account.cc .popup {
  display: none;
  position: fixed;
  bottom: 5vh;
  left: 50vw;
  background: #FFF;
  width: 60vw;
  max-width: 60vw;
  height: auto;
  z-index: 9000;
  padding: 20px 5vw;
  box-shadow: 0px 0px 15px 2px rgba(0, 0, 0, 0.4);
  opacity: 0;
  visibility: hidden;
  text-align: center;
  z-index: 9000;
  transform: translateX(-50%);
  transition: opacity 600ms ease 0ms, visibility 0ms ease 600ms;
  overflow: auto;
}

div#content div.staff-account.cc .popup .close_popup {
  width: 40px;
  height: 40px;
  padding: 0 !important;
  margin: 0 !important;
  position: absolute;
  top: 10px;
  right: 10px;
  text-indent: -9999px;
  background: transparent url("../../admin/core/media/images/close.svg") !important;
  background-size: 16px;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

div#content div.staff-account.cc .popup.centered {
  bottom: auto;
  top: 50vh;
  transform: translate(-50%, -50%);
  padding: 30px;
}

div#content div.staff-account.cc .popup.centered h2 {
  text-align: left;
}

div#content div.staff-account.cc .popup button {
  float: none;
  display: inline-block;
}

div#content div.staff-account.cc .popup.shown {
  display: inline-block !important;
  opacity: 1;
  visibility: visible;
  transition: opacity 600ms ease 0ms, visibility 0ms ease 0ms;
}

div.staff-account.cc .popup ul.nav,
div.staff-account.cc .popup ul.nav li {
  padding: 0;
  height: auto;
  overflow: visible;
  background: #234374;
  margin-bottom: 20px;
}

div.staff-account.cc .popup ul.nav li {
  margin: 0;
}

div.staff-account.cc .popup ul.nav li a {
  position: relative;
  padding: 10px 0 5px;
  height: auto;
}

div.staff-account.cc .popup ul.nav li a:hover {
  background: #234374;
}

div.staff-account.cc .popup ul.nav li a.active {
  font-weight: bold;
}

div.staff-account.cc .popup a.add,
div.staff-account.cc .popup a.back {
  float: left;
  padding: 10px;
  margin: 0 0 5px 25%;
  width: 50%;
  background: #234374;
  color: #FFF;
}

div.staff-account.cc .popup a.add:hover,
div.staff-account.cc .popup a.back:hover {
  background: #2c518a;
  border-color: #2c518a;
  text-decoration: none;
}

div.staff-account.cc .popup form {
  padding: 0;
  border: none;
  float: none;
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 60%;
}

div.staff-account.cc .popup form li label {
  text-align: left;
}

div.staff-account.cc .popup form select.multiple {
  background: none !important;
  height: 120px;
}

div.staff-account.cc .popup form .appt_times li {
  float: left;
  width: 30%;
  margin-right: 3.33%;
}

div.staff-account.cc .popup form .appt_times li.time {
  width: 15%;
}

div.staff-account.cc .popup form .appt_times li.time:last-child {
  margin-right: 0;
}

div.staff-account.cc .popup form .appt_times li input {
  padding: 0 5px;
}

div.popup.billing_notes h2 {
  padding-bottom: 0;
}

div.popup.billing_notes .column {
  width: 22.5% !important;
  display: inline-block;
  float: left;
}

div.popup.billing_notes .column:nth-of-type(2) {
  width: 75% !important;
  margin-left: 2.5%;
}

div.popup.billing_notes table {
  table-layout: auto;
}

div.popup.billing_notes .note_content {
  max-width: 540px;
  display: inline-block;
}

#content form#inspections_export button {
  display: inline-block;
  float: right;
  clear: none;
  margin-left: 20px;
}

#content form#inspections_export button.prepare_send{
  background: var(--light_blue);
}

#content .popup.send_inspections select#recipients,
#content .send_inspections #message,
#content #variation_send select#recipients,
#content #variation_send #message,
#content .send_nhbc select#recipients,
#content .send_nhbc #message {
  height: 220px;
  padding: 14px 20px;
}

#content .popup.send_history {
  width: 95vw !important;
  max-width: 1300px !important;
}

#content .popup.send_history table {
  table-layout: auto;
  width: 100%;
}

#content .popup.send_history table tr.inspections.hidden {
  display: none;
}

#content .popup.send_history table tr.inspections td {
  background: #FFF !important;
}

#content .popup.send_history table tr.inspections > td {
  padding: 0 !important;
}

#content .popup.send_history table tr.inspections td table tr:hover td {
  background: #eee !important;
}

div.staff-account.inspections table span.show_inspections {
  background: #7898ff;
}

#content .popup.send_history table tr.inspections td table th {
  background: #7898ff;
  color: #FFF;
  border-radius: 0;
}

.staff-account.home .site_dashboard {
  width: 100%;
  padding: 60px 2.5%;
  display: grid;
  -moz-column-gap: 30px;
       column-gap: 30px;
  row-gap: 30px;
  grid-template-columns: auto auto auto;
  grid-template-columns: calc(33.33% - 20px) calc(33.33% - 20px) calc(33.33% - 20px);
}

.staff-account.home .site_dashboard .site {
  background: #f5f5f5;
  text-align: center;
  position: relative;
  padding-bottom: 60px;
  border-radius: 5px;
  border: 1px solid #d2d2d2;
}

.staff-account.home .site_dashboard .site:nth-of-type(4n) {
  margin-right: 0;
}

.staff-account.home .site_dashboard .site:nth-of-type(4n + 1) {
  clear: left;
}

.staff-account.home .site_dashboard .site h2 {
  color: #FFF;
  padding: 30px 40px;
  color: var(--blue);
}
.staff-account.home .site_dashboard .site h2 small {
  opacity: 0.6;
}

.staff-account.home .site_dashboard .site .quick_links {
  width: 100%;
  display: flex;
  position: absolute;
  bottom: 0;
  left: 0;
}

.staff-account.home .site_dashboard .site .quick_links a {
  height: 60px;
  flex-grow: 1;
  border-top: 2px solid #FFF;
  border-right: 1px solid #FFF;
  border-left: 1px solid #FFF;
  position: relative;
  text-indent: -9999px;
  background-size: 26px;
  background-position: center;
  background-repeat: no-repeat;
  background-color: var(--blue);
}

.staff-account.home .site_dashboard .site .quick_links a.inspections {
  background-image: url(../../admin/core/media/images/search_white.svg);
  background-size: 36px;
}

.staff-account.home .site_dashboard .site .quick_links a.materials {
  background-image: url(../../admin/core/media/images/ordering.svg);
}

.staff-account.home .site_dashboard .site .quick_links a.issues {
  background-image: url(../../admin/core/media/images/issues.svg);
  background-size: 32px;
}

.staff-account.home .site_dashboard .site .quick_links a.ris {
  background-image: url(../../admin/core/media/images/nhbc.svg);
  background-size: 38px;
}

.staff-account.home .site_dashboard .site .quick_links a.wages {
  background-image: url(../../admin/core/media/images/wages.svg);
  background-size: 32px;
}

.staff-account.home .site_dashboard .site .quick_links a:first-of-type {
  border-left: none;
}

.staff-account.home .site_dashboard .site .quick_links a:last-of-type {
  border-right: none;
}

.staff-account.home .site_dashboard .site .quick_links a span {
  position: absolute;
  left: 62%;
  top: 8px;
  margin: auto;
  width: auto;
  min-width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  font-size: 0.66rem;
  border-radius: 50%;
  background: #e65e5d;
  color: #FFF;
  font-weight: 700;
  padding: 0 2px;
  text-indent: 0;
}

#content .popup.noscroll {
  overflow: hidden !important;
}

#content .popup_content .issue_dashboard {
  display: grid;
  -moz-column-gap: 30px;
       column-gap: 30px;
  row-gap: 30px;
  grid-template-columns: auto auto;
  grid-template-columns: calc(50% - 30px) calc(50% - 30px);
}
#content .popup_content .issue_dashboard .issue_tile {
  border: 1px solid #d2d2d2;
  padding: 20px;
  padding-bottom: 80px;
  position: relative;
  border-radius: 5px;
}
#content .popup_content .issue_dashboard .issue_tile .issue_details button {
  margin-top: 0;
}
#content .popup_content .issue_dashboard .issue_tile .issue_actions {
  float: right;
}
#content .popup_content .issue_dashboard .issue_tile .issue_actions a {
  width: 40px;
  height: 40px;
  display: inline-block;
  float: left;
  margin-left: 10px;
  background: var(--blue);
  border-radius: 3px;
  text-indent: -99999px;
  position: relative;
}
#content .popup_content .issue_dashboard .issue_tile .issue_actions a span {
  position: absolute;
  right: -6px;
  top: -6px;
  margin: auto;
  width: auto;
  min-width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  font-size: 0.66rem;
  border-radius: 50%;
  background: #e65e5d;
  color: #FFF;
  font-weight: 700;
  padding: 0 4px;
  text-indent: 0;
  z-index: 5;
}
#content .popup_content .issue_dashboard .issue_tile .issue_actions a:after {
  content: "";
  width: 40px;
  height: 40px;
  position: absolute;
  left: 0;
  top: 0;
  filter: grayscale(100%) brightness(5);
  background-size: 24px;
  background-repeat: no-repeat;
  background-position: center;
}
#content .popup_content .issue_dashboard .issue_tile .issue_actions a.edit_issue:after {
  background-image: url(../images/icons/edit.svg);
}
#content .popup_content .issue_dashboard .issue_tile .issue_actions a.issue_notes:after {
  background-image: url(../../admin/core/media/images/note.svg);
  background-size: 22px;
}
#content .popup_content .issue_dashboard .issue_tile .issue_actions a.issue_contra:after {
  background-image: url(../images/icons/contra.svg);
  background-size: 24px;
}
#content .popup_content .issue_dashboard .issue_tile .issue_actions a.delete_issue {
  background: var(--red);
}
#content .popup_content .issue_dashboard .issue_tile .issue_actions a.delete_issue:after {
  background-size: 28px;
  background-image: url(../images/icons/delete.svg);
}
#content .popup_content .issue_dashboard .issue_tile .issue_status_error {
  margin-bottom: 0;
  margin-top: 20px;
}
#content .popup_content .issue_dashboard .issue_tile .issue_status {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
}
#content .popup_content .issue_dashboard .issue_tile .issue_status button {
  flex-grow: 1;
  height: 60px;
  border-right: 1px solid #FFF;
  border-left: 1px solid #FFF;
  opacity: 0.4;
  transition: opacity 300ms ease;
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 700;
}
#content .popup_content .issue_dashboard .issue_tile .issue_status button.awaiting_resolution {
  background: #e65e5d;
  color: #FFF;
}
#content .popup_content .issue_dashboard .issue_tile .issue_status button.awaiting_review {
  background: #ef8d4c;
  color: #FFF;
}
#content .popup_content .issue_dashboard .issue_tile .issue_status button.resolved {
  background: #00d499;
  color: #FFF;
}
#content .popup_content .issue_dashboard .issue_tile .issue_status button.user_disputed {
  background: #8e0aaa;
  color: #FFF;
}
#content .popup_content .issue_dashboard .issue_tile .issue_status button.cancelled {
  background: #7a7070;
  color: #FFF;
}
#content .popup_content .issue_dashboard .issue_tile .issue_status button:hover {
  opacity: 1;
}
#content .popup_content .issue_dashboard .issue_tile.awaiting_resolution {
  border-top: 10px solid #e65e5d;
}
#content .popup_content .issue_dashboard .issue_tile.awaiting_resolution .issue_status button.awaiting_resolution {
  opacity: 1;
}
#content .popup_content .issue_dashboard .issue_tile.awaiting_review {
  border-top: 10px solid #ef8d4c;
}
#content .popup_content .issue_dashboard .issue_tile.awaiting_review .issue_status button.awaiting_review {
  opacity: 1;
}
#content .popup_content .issue_dashboard .issue_tile.resolved {
  border-top: 10px solid #00d499;
}
#content .popup_content .issue_dashboard .issue_tile.resolved .issue_status button.resolved {
  opacity: 1;
}
#content .popup_content .issue_dashboard .issue_tile.user_disputed {
  border-top: 10px solid #8e0aaa;
}
#content .popup_content .issue_dashboard .issue_tile.user_disputed .issue_status button.user_disputed {
  opacity: 1;
}
#content .popup_content .issue_dashboard .issue_tile.cancelled {
  border-top: 10px solid #7a7070;
}
#content .popup_content .issue_dashboard .issue_tile.cancelled .issue_status button.cancelled {
  opacity: 1;
}

#content #add_issue_popup .add_issue_images h2 {
  padding-bottom: 0;
}

#content #add_issue_popup .add_issue_images + fieldset {
  float: right !important;
}

#content .popup_content .issue_dashboard .issue_notes_overlay,
#content .popup_content .issue_dashboard .issue_image_overlay,
#content .add_issue_images .issue_image_overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 1px;
  background: #FFF;
  display: none;
  z-index: 6666;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .issue_notes_wrapper,
#content .popup_content .issue_dashboard .issue_image_overlay .issue_notes_wrapper,
#content .add_issue_images .issue_image_overlay .issue_notes_wrapper {
  overflow: auto;
  width: inline-block;
  height: auto;
  position: absolute;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 30px;
  z-index: 6666;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .close_issue_notes,
#content .popup_content .issue_dashboard .issue_notes_overlay .close_issue_images,
#content .popup_content .issue_dashboard .issue_image_overlay .close_issue_notes,
#content .popup_content .issue_dashboard .issue_image_overlay .close_issue_images,
#content .add_issue_images .issue_image_overlay .close_issue_notes,
#content .add_issue_images .issue_image_overlay .close_issue_images {
  width: 40px;
  height: 40px;
  position: fixed;
  top: 20px;
  right: 20px;
  background: url(../images/icons/close.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 42px;
  text-indent: -9999px;
  cursor: pointer;
  background-color: #FFF;
  border-radius: 3px;
  z-index: 7777;
  margin-top: 0 !important;
}
#content .popup_content .issue_dashboard .issue_notes_overlay table td:first-of-type,
#content .popup_content .issue_dashboard .issue_notes_overlay table th:first-of-type,
#content .popup_content .issue_dashboard .issue_image_overlay table td:first-of-type,
#content .popup_content .issue_dashboard .issue_image_overlay table th:first-of-type,
#content .add_issue_images .issue_image_overlay table td:first-of-type,
#content .add_issue_images .issue_image_overlay table th:first-of-type {
  width: 60%;
  position: relative;
  padding-left: 18px;
}
#content .popup_content .issue_dashboard .issue_notes_overlay table td:first-of-type:before,
#content .popup_content .issue_dashboard .issue_notes_overlay table th:first-of-type:before,
#content .popup_content .issue_dashboard .issue_image_overlay table td:first-of-type:before,
#content .popup_content .issue_dashboard .issue_image_overlay table th:first-of-type:before,
#content .add_issue_images .issue_image_overlay table td:first-of-type:before,
#content .add_issue_images .issue_image_overlay table th:first-of-type:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
}
#content .popup_content .issue_dashboard .issue_notes_overlay table td:first-of-type.awaiting_resolution:before,
#content .popup_content .issue_dashboard .issue_notes_overlay table th:first-of-type.awaiting_resolution:before,
#content .popup_content .issue_dashboard .issue_image_overlay table td:first-of-type.awaiting_resolution:before,
#content .popup_content .issue_dashboard .issue_image_overlay table th:first-of-type.awaiting_resolution:before,
#content .add_issue_images .issue_image_overlay table td:first-of-type.awaiting_resolution:before,
#content .add_issue_images .issue_image_overlay table th:first-of-type.awaiting_resolution:before {
  background: #e65e5d;
}
#content .popup_content .issue_dashboard .issue_notes_overlay table td:first-of-type.awaiting_review:before,
#content .popup_content .issue_dashboard .issue_notes_overlay table th:first-of-type.awaiting_review:before,
#content .popup_content .issue_dashboard .issue_image_overlay table td:first-of-type.awaiting_review:before,
#content .popup_content .issue_dashboard .issue_image_overlay table th:first-of-type.awaiting_review:before,
#content .add_issue_images .issue_image_overlay table td:first-of-type.awaiting_review:before,
#content .add_issue_images .issue_image_overlay table th:first-of-type.awaiting_review:before {
  background: #ef8d4c;
}
#content .popup_content .issue_dashboard .issue_notes_overlay table td:first-of-type.resolved:before,
#content .popup_content .issue_dashboard .issue_notes_overlay table th:first-of-type.resolved:before,
#content .popup_content .issue_dashboard .issue_image_overlay table td:first-of-type.resolved:before,
#content .popup_content .issue_dashboard .issue_image_overlay table th:first-of-type.resolved:before,
#content .add_issue_images .issue_image_overlay table td:first-of-type.resolved:before,
#content .add_issue_images .issue_image_overlay table th:first-of-type.resolved:before {
  background: #00d499;
}
#content .popup_content .issue_dashboard .issue_notes_overlay table td:first-of-type.user_disputed:before,
#content .popup_content .issue_dashboard .issue_notes_overlay table th:first-of-type.user_disputed:before,
#content .popup_content .issue_dashboard .issue_image_overlay table td:first-of-type.user_disputed:before,
#content .popup_content .issue_dashboard .issue_image_overlay table th:first-of-type.user_disputed:before,
#content .add_issue_images .issue_image_overlay table td:first-of-type.user_disputed:before,
#content .add_issue_images .issue_image_overlay table th:first-of-type.user_disputed:before {
  background: #8e0aaa;
}
#content .popup_content .issue_dashboard .issue_notes_overlay table td:first-of-type.cancelled:before,
#content .popup_content .issue_dashboard .issue_notes_overlay table th:first-of-type.cancelled:before,
#content .popup_content .issue_dashboard .issue_image_overlay table td:first-of-type.cancelled:before,
#content .popup_content .issue_dashboard .issue_image_overlay table th:first-of-type.cancelled:before,
#content .add_issue_images .issue_image_overlay table td:first-of-type.cancelled:before,
#content .add_issue_images .issue_image_overlay table th:first-of-type.cancelled:before {
  background: #7a7070;
}
#content .popup_content .issue_dashboard .issue_notes_overlay table td:first-of-type,
#content .popup_content .issue_dashboard .issue_image_overlay table td:first-of-type,
#content .add_issue_images .issue_image_overlay table td:first-of-type {
  background: none !important;
  color: #3a3a3a !important;
}
#content .popup_content .issue_dashboard .issue_notes_overlay table td:last-of-type,
#content .popup_content .issue_dashboard .issue_notes_overlay table th:last-of-type,
#content .popup_content .issue_dashboard .issue_image_overlay table td:last-of-type,
#content .popup_content .issue_dashboard .issue_image_overlay table th:last-of-type,
#content .add_issue_images .issue_image_overlay table td:last-of-type,
#content .add_issue_images .issue_image_overlay table th:last-of-type {
  width: 100px;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .save_issue_note,
#content .popup_content .issue_dashboard .issue_image_overlay .save_issue_note,
#content .add_issue_images .issue_image_overlay .save_issue_note {
  margin-top: 0;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .issue_image_wrapper,
#content .popup_content .issue_dashboard .issue_image_overlay .issue_image_wrapper,
#content .add_issue_images .issue_image_overlay .issue_image_wrapper {
  width: 90%;
  height: auto;
  position: relative;
  border: 1px solid #d2d2d2;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .issue_image_wrapper.portrait,
#content .popup_content .issue_dashboard .issue_image_overlay .issue_image_wrapper.portrait,
#content .add_issue_images .issue_image_overlay .issue_image_wrapper.portrait {
  width: 65%;
  margin-left: 20%;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .issue_image_wrapper img,
#content .popup_content .issue_dashboard .issue_image_overlay .issue_image_wrapper img,
#content .add_issue_images .issue_image_overlay .issue_image_wrapper img {
  width: 100%;
  max-width: 100%;
  display: inline-block;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .issue_image_wrapper canvas,
#content .popup_content .issue_dashboard .issue_image_overlay .issue_image_wrapper canvas,
#content .add_issue_images .issue_image_overlay .issue_image_wrapper canvas {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .controls,
#content .popup_content .issue_dashboard .issue_image_overlay .controls,
#content .add_issue_images .issue_image_overlay .controls {
  width: auto;
  text-align: center;
  display: inline-block;
  position: fixed;
  right: 20px;
  top: 100px;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .controls button, #content .popup_content .issue_dashboard .issue_notes_overlay .controls input,
#content .popup_content .issue_dashboard .issue_image_overlay .controls button,
#content .popup_content .issue_dashboard .issue_image_overlay .controls input,
#content .add_issue_images .issue_image_overlay .controls button,
#content .add_issue_images .issue_image_overlay .controls input {
  width: 40px;
  height: 40px;
  display: inline-block;
  float: right !important;
  clear: both;
  background: var(--blue);
  border-radius: 3px;
  text-indent: -99999px;
  position: relative;
  cursor: pointer;
  margin: 8px 0;
  transition: background 300ms ease;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .controls button:after, #content .popup_content .issue_dashboard .issue_notes_overlay .controls input:after,
#content .popup_content .issue_dashboard .issue_image_overlay .controls button:after,
#content .popup_content .issue_dashboard .issue_image_overlay .controls input:after,
#content .add_issue_images .issue_image_overlay .controls button:after,
#content .add_issue_images .issue_image_overlay .controls input:after {
  content: "";
  width: 40px;
  height: 40px;
  position: absolute;
  left: 0;
  top: 0;
  filter: grayscale(100%) brightness(5);
  background-size: 24px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 28px;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .controls button.save_issue_image_edit, #content .popup_content .issue_dashboard .issue_notes_overlay .controls input.save_issue_image_edit,
#content .popup_content .issue_dashboard .issue_image_overlay .controls button.save_issue_image_edit,
#content .popup_content .issue_dashboard .issue_image_overlay .controls input.save_issue_image_edit,
#content .add_issue_images .issue_image_overlay .controls button.save_issue_image_edit,
#content .add_issue_images .issue_image_overlay .controls input.save_issue_image_edit {
  text-indent: 0;
  width: auto;
  color: #FFF;
  padding: 0 20px;
  font-size: 0.9rem;
  font-weight: 700;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .controls button.save_issue_image_edit.success, #content .popup_content .issue_dashboard .issue_notes_overlay .controls input.save_issue_image_edit.success,
#content .popup_content .issue_dashboard .issue_image_overlay .controls button.save_issue_image_edit.success,
#content .popup_content .issue_dashboard .issue_image_overlay .controls input.save_issue_image_edit.success,
#content .add_issue_images .issue_image_overlay .controls button.save_issue_image_edit.success,
#content .add_issue_images .issue_image_overlay .controls input.save_issue_image_edit.success {
  background: var(--green);
}
#content .popup_content .issue_dashboard .issue_notes_overlay .controls button.save_issue_image_edit.error, #content .popup_content .issue_dashboard .issue_notes_overlay .controls input.save_issue_image_edit.error,
#content .popup_content .issue_dashboard .issue_image_overlay .controls button.save_issue_image_edit.error,
#content .popup_content .issue_dashboard .issue_image_overlay .controls input.save_issue_image_edit.error,
#content .add_issue_images .issue_image_overlay .controls button.save_issue_image_edit.error,
#content .add_issue_images .issue_image_overlay .controls input.save_issue_image_edit.error {
  background: var(--red);
}
#content .popup_content .issue_dashboard .issue_notes_overlay .controls button.delete_issue_image, #content .popup_content .issue_dashboard .issue_notes_overlay .controls input.delete_issue_image,
#content .popup_content .issue_dashboard .issue_image_overlay .controls button.delete_issue_image,
#content .popup_content .issue_dashboard .issue_image_overlay .controls input.delete_issue_image,
#content .add_issue_images .issue_image_overlay .controls button.delete_issue_image,
#content .add_issue_images .issue_image_overlay .controls input.delete_issue_image {
  background: var(--red);
}
#content .popup_content .issue_dashboard .issue_notes_overlay .controls button.delete_issue_image:after, #content .popup_content .issue_dashboard .issue_notes_overlay .controls input.delete_issue_image:after,
#content .popup_content .issue_dashboard .issue_image_overlay .controls button.delete_issue_image:after,
#content .popup_content .issue_dashboard .issue_image_overlay .controls input.delete_issue_image:after,
#content .add_issue_images .issue_image_overlay .controls button.delete_issue_image:after,
#content .add_issue_images .issue_image_overlay .controls input.delete_issue_image:after {
  background-image: url(../images/icons/delete.svg);
}
#content .popup_content .issue_dashboard .issue_notes_overlay .controls button.pickcolour_button, #content .popup_content .issue_dashboard .issue_notes_overlay .controls input.pickcolour_button,
#content .popup_content .issue_dashboard .issue_image_overlay .controls button.pickcolour_button,
#content .popup_content .issue_dashboard .issue_image_overlay .controls input.pickcolour_button,
#content .add_issue_images .issue_image_overlay .controls button.pickcolour_button,
#content .add_issue_images .issue_image_overlay .controls input.pickcolour_button {
  position: relative;
  background: #edefed;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .controls button.pickcolour_button span, #content .popup_content .issue_dashboard .issue_notes_overlay .controls input.pickcolour_button span,
#content .popup_content .issue_dashboard .issue_image_overlay .controls button.pickcolour_button span,
#content .popup_content .issue_dashboard .issue_image_overlay .controls input.pickcolour_button span,
#content .add_issue_images .issue_image_overlay .controls button.pickcolour_button span,
#content .add_issue_images .issue_image_overlay .controls input.pickcolour_button span {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
}
#content .popup_content .issue_dashboard .issue_notes_overlay .controls button.restore_issue_image, #content .popup_content .issue_dashboard .issue_notes_overlay .controls input.restore_issue_image,
#content .popup_content .issue_dashboard .issue_image_overlay .controls button.restore_issue_image,
#content .popup_content .issue_dashboard .issue_image_overlay .controls input.restore_issue_image,
#content .add_issue_images .issue_image_overlay .controls button.restore_issue_image,
#content .add_issue_images .issue_image_overlay .controls input.restore_issue_image {
  background: var(--red);
}
#content .popup_content .issue_dashboard .issue_notes_overlay .controls button.restore_issue_image:after, #content .popup_content .issue_dashboard .issue_notes_overlay .controls input.restore_issue_image:after,
#content .popup_content .issue_dashboard .issue_image_overlay .controls button.restore_issue_image:after,
#content .popup_content .issue_dashboard .issue_image_overlay .controls input.restore_issue_image:after,
#content .add_issue_images .issue_image_overlay .controls button.restore_issue_image:after,
#content .add_issue_images .issue_image_overlay .controls input.restore_issue_image:after {
  background-image: url(../images/icons/clear_drawing.svg);
}
#content .popup_content .issue_dashboard .issue_notes_overlay .controls input,
#content .popup_content .issue_dashboard .issue_image_overlay .controls input,
#content .add_issue_images .issue_image_overlay .controls input {
  background: none;
  width: 0;
  height: 0;
  opacity: 0;
}

.popup_content .add_issue_images .close_issue_images {
  display: none !important;
}

#content .popup_content .issue_dashboard .issue_image_overlay,
#content .add_issue_images .issue_image_overlay {
  padding: 30px;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

#content .add_issue_images .issue_image_overlay {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  border: 1px solid #d2d2d2;
}

#content .popup_content .issue_dashboard .issue_tile .image_wrapper,
#content .add_issue_images .image_wrapper {
  width: 100%;
  height: auto;
}
#content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image,
#content .add_issue_images .image_wrapper .issue_image {
  width: 30%;
  margin-right: 5%;
  margin-bottom: 5%;
  display: inline-block;
  float: left;
  height: auto;
  position: relative;
  border-radius: 3px;
  overflow: hidden;
}
#content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image:nth-last-of-type(1), #content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image:nth-last-of-type(2), #content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image:nth-last-of-type(3),
#content .add_issue_images .image_wrapper .issue_image:nth-last-of-type(1),
#content .add_issue_images .image_wrapper .issue_image:nth-last-of-type(2),
#content .add_issue_images .image_wrapper .issue_image:nth-last-of-type(3) {
  margin-bottom: 30px;
}
#content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image:nth-of-type(3n),
#content .add_issue_images .image_wrapper .issue_image:nth-of-type(3n) {
  margin-right: 0;
}
#content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image:nth-of-type(3n + 1),
#content .add_issue_images .image_wrapper .issue_image:nth-of-type(3n + 1) {
  clear: left;
}
#content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image .delete_issue_image,
#content .add_issue_images .image_wrapper .issue_image .delete_issue_image {
  width: 40px;
  height: 40px;
  display: inline-block;
  float: left;
  margin-left: 10px;
  background: var(--red);
  border-radius: 3px;
  text-indent: -99999px;
  position: absolute;
  bottom: 4px;
  right: 4px;
  cursor: pointer;
}
#content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image .delete_issue_image:after,
#content .add_issue_images .image_wrapper .issue_image .delete_issue_image:after {
  content: "";
  width: 40px;
  height: 40px;
  position: absolute;
  left: 0;
  top: 0;
  filter: grayscale(100%) brightness(5);
  background-size: 24px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 28px;
  background-image: url(../images/icons/delete.svg);
}
#content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image.placeholder,
#content .add_issue_images .image_wrapper .issue_image.placeholder {
  text-align: center;
  width: 100%;
  margin-right: 0;
}
#content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image.placeholder p,
#content .add_issue_images .image_wrapper .issue_image.placeholder p {
  position: absolute;
  top: 50%;
  left: 50%;
  font-weight: 700;
  line-height: 1.3;
  font-size: 1rem;
  width: 80%;
  transform: translate(-50%, -50%);
}
#content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image.placeholder p span,
#content .add_issue_images .image_wrapper .issue_image.placeholder p span {
  color: var(--light_blue);
  margin-top: 12px;
  display: inline-block;
  cursor: pointer;
}
#content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image.placeholder p span:hover,
#content .add_issue_images .image_wrapper .issue_image.placeholder p span:hover {
  text-decoration: underline;
}
#content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image a,
#content .add_issue_images .image_wrapper .issue_image a {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
#content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image img,
#content .add_issue_images .image_wrapper .issue_image img {
  width: 100%;
  max-width: 100% !important;
  height: auto;
  position: static;
}
@media screen and (min-width: 1366px) {
  #content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image,
  #content .add_issue_images .image_wrapper .issue_image {
    width: 21.25%;
    clear: none !important;
    margin-right: 5% !important;
  }
  #content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image:nth-last-of-type(1), #content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image:nth-last-of-type(2), #content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image:nth-last-of-type(3), #content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image:nth-last-of-type(4),
  #content .add_issue_images .image_wrapper .issue_image:nth-last-of-type(1),
  #content .add_issue_images .image_wrapper .issue_image:nth-last-of-type(2),
  #content .add_issue_images .image_wrapper .issue_image:nth-last-of-type(3),
  #content .add_issue_images .image_wrapper .issue_image:nth-last-of-type(4) {
    margin-bottom: 30px;
  }
  #content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image:nth-of-type(4n),
  #content .add_issue_images .image_wrapper .issue_image:nth-of-type(4n) {
    margin-right: 0 !important;
  }
  #content .popup_content .issue_dashboard .issue_tile .image_wrapper .issue_image:nth-of-type(4n + 1),
  #content .add_issue_images .image_wrapper .issue_image:nth-of-type(4n + 1) {
    clear: left !important;
  }
}
#content .popup_content .issue_dashboard .issue_tile .image_wrapper form input,
#content .add_issue_images .image_wrapper form input {
  display: none;
}

#content .add_issue_images .image_wrapper {
  display: inline-block;
  width: 100%;
  height: auto;
}
#content .add_issue_images .image_wrapper .issue_image:nth-of-type(1),
#content .add_issue_images .image_wrapper .issue_image:nth-of-type(2),
#content .add_issue_images .image_wrapper .issue_image:nth-of-type(3),
#content .add_issue_images .image_wrapper .issue_image:nth-of-type(4) {
  margin-top: 14px;
}

#content #add_issue_popup li.issue_detail {
  width: 97%;
}

#content #add_issue_popup fieldset:last-of-type {
  width: 48.5%;
  float: left;
  clear: left;
}

.staff-account.issues table.issue_notes td:first-of-type {
  background: none !important;
  color: #3a3a3a !important;
  font-weight: 300;
  position: relative;
}

.staff-account.issues table.issue_notes td:first-of-type:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
}

.staff-account.issues table.issue_notes td.awaiting_resolution:before {
  background: #e65e5d;
}

.staff-account.issues table.issue_notes td.awaiting_review:before {
  background: #ef8d4c;
}

.staff-account.issues table.issue_notes td.resolved:before {
  background: #00d499;
}

.staff-account.issues table.issue_notes td.user_disputed:before {
  background: #8e0aaa;
}

.staff-account.issues table.issue_notes td.cancelled:before {
  background: #7a7070;
}

#user_site_access table td.setup{
  background: #999999;
  color: #FFF;
} 

#user_site_access table td.in-progress{
  background: var(--orange);
  color: #FFF;
}

#user_site_access input[type="checkbox"]{
  display: inline-block !!important;
}

#user_site_access label.checkbox-style{
  width: 30px;
  height: 40px;
  padding-left: 0;
  margin-bottom: 0;
}

#user_site_access button{
  width: auto;
  float: right;
  padding: 0 26px;
}