@charset "UTF-8";
/*! CSS Document
System CSS style sheet for Battersea Systems
© 2025 Idaho Design and Communication Pty Ltd 10/10/2025 | Author: David Haworth david@idahodesign.com */
/***  Primary Variables updated 11/9/2024 */
/***  Battersea-Variables updated 6/12/2024 */
/****************************************** web parts *******************************/
.box.iconheader .front-face, .iconheader-box {
  text-align: center;
  aspect-ratio: 7/8;
  display: grid;
  grid-gap: 0;
  align-content: center;
  justify-content: center;
  position: relative;
  margin: 0 auto !important;
}
.box.iconheader .front-face > *, .iconheader-box > * {
  padding: 0;
  color: #000000;
}
.box.iconheader [class*=icon-].front-face > *:before, [class*=icon-].iconheader-box > *:before {
  content: "";
  display: block;
  background-position: 50%;
  background-size: contain;
  background-repeat: no-repeat;
}

/* Font-face CSS style sheet for Battersea Systems | Changed: 7/6/2022 */
/**************************************** Glyphicons Font Face *************************/
@font-face {
  font-family: "Glyphicons Regular";
  src: url("../fonts/glyphicons-regular.eot");
  src: url("../fonts/glyphicons-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/glyphicons-regular.woff2") format("woff2"), url("../fonts/glyphicons-regular.woff") format("woff"), url("../fonts/glyphicons-regular.ttf") format("truetype"), url("../fonts/glyphicons-regular.svg#glyphiconsregular") format("svg");
}
/**************************************** Glyphicons - filetypes Font Face *************************/
@font-face {
  font-family: "Glyphicons Filetypes";
  src: url("../fonts/glyphicons-filetypes-regular.eot");
  src: url("../fonts/glyphicons-filetypes-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/glyphicons-filetypes-regular.woff2") format("woff2"), url("../fonts/glyphicons-filetypes-regular.woff") format("woff"), url("../fonts/glyphicons-filetypes-regular.ttf") format("truetype"), url("../fonts/glyphicons-filetypes-regular.svg#glyphicons_filetypesregular") format("svg");
}
/*! Foundations style sheet for Battersea Systems 1/10/2025 */
@viewport {
  width: device-width;
}
:root {
  font-size: 14px; /* Fallback font-size */
  font-feature-settings: "kern", "liga", "clig", "calt", "onum", "pnum";
}

:root.wf-active {
  font-size: 14px;
}

@supports (font-kerning: normal) and (font-variant-ligatures: common-ligatures contextual) and (font-variant-numeric: oldstyle-nums proportional-nums) {
  :root {
    font-kerning: normal;
    font-variant-ligatures: common-ligatures contextual;
    font-variant-numeric: oldstyle-nums proportional-nums;
    font-feature-settings: normal;
  }
}
body, html {
  color: #3e3b3f;
  height: 100%;
  padding: 0;
  margin: 0;
  font-family: "Helvetica", Helvetica, Arial, sans-serif;
  font-weight: 400;
  line-height: 1.5;
  -webkit-hyphens: none;
  hyphens: none;
}

html.admin-login {
  color: #3e3b3f;
}

body {
  background: rgba(255, 255, 255, 0.98);
  position: relative;
  line-height: 1.6;
  font-size: 1em;
  scroll-behavior: smooth;
}
.full-screen body {
  line-height: 1.5;
}
@media only screen and (min-width: 768px) {
  .full-screen body {
    font-size: 1.1em;
  }
}
body > .container {
  padding-bottom: 0px;
  max-width: 1170px;
}
@media only screen and (min-width: 768px) {
  body > .container {
    padding-top: 220px;
    width: auto;
  }
}
@media only screen and (min-width: 1056px) {
  body > .container {
    width: 90%;
  }
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) body.student-dashboard .main-content {
  padding: 0;
}
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) body.student-dashboard .page-content {
  padding: 0 !important;
}
@media only screen and (min-width: 768px) {
  html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) body.student-dashboard .page-content > div.row > div.col-xs-12 {
    padding: 0;
  }
}
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) body.student-dashboard .page-content .page-content {
  padding: 0 !important;
}
body.student-dashboard .page-content > .row {
  margin: 0 !important;
}
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) body.student-dashboard.module-test .page-content {
  padding: 30px 50px !important;
}
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) body.student-dashboard.module-test .page-content .page-content {
  padding: 0px !important;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) body.module-home .main-content {
  padding: 0;
  max-width: none;
}
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) body.module-home .page-content {
  padding: 0 !important;
}
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) body.module-home .page-content > div.row > div.col-xs-12 {
  padding: 0;
}
body.module-home .page-content > .row {
  margin: 0;
}
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) body.module-home .page-content .page-content {
  padding: 0;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) body.training-content div#main-container.main-container {
  padding-top: 0;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) body.training-content .navbar {
  min-height: 0;
  height: 0;
}
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) body.training-content .user-name {
  display: none;
}
body.training-content .progress-area h2 {
  font-size: 1rem;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) body.training-content .main-content {
  padding: 40px 0 0 0 !important;
  min-height: calc(100vh - 10px);
}
@media only screen and (min-width: 768px) {
  html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) body.training-content .page-content {
    padding: 0 15px 0 !important;
  }
}
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) body.training-content .page-content .page-content {
  padding: 0 !important;
}
@media only screen and (max-width: 767px) {
  html:not(.SuperAdministrator):not(.HRManager):not(.admin-login):not(.full-screen) body.training-content .page-content .page-content {
    margin: 0 15px;
  }
}
body.training-content .training-footer {
  margin: 30px 0 0;
}
body.training-content footer {
  display: none;
}
.admin-login body {
  color: #3e3b3f;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) body {
  background: transparent;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) body.training-content .main-content {
  padding: 40px 0 0 0 !important;
  min-height: calc(100vh - 10px);
}
body.training-content footer {
  display: none;
}

/**************************** Foundation - Main-container */
div#main-container.main-container {
  padding-top: 45px;
}
@media only screen and (min-width: 768px) {
  div#main-container.main-container {
    padding-top: 117px;
  }
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) div#main-container.main-container {
  padding-top: 45px;
}
@media only screen and (min-width: 768px) {
  html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) div#main-container.main-container {
    padding-top: 140px;
  }
}

.main-container:after {
  background-color: transparent;
}
.main-container-inner {
  background-color: #f7f7f7;
}
.main-container > .main-container-inner {
  position: static;
}
.full-screen .main-container {
  min-height: 0;
}
@media only screen and (min-width: 570px) {
  .full-screen .main-container {
    min-height: 100vh;
  }
}

/**************************** Foundation - Main content */
@media only screen and (min-width: 768px) {
  .main-content {
    margin-left: 0;
  }
}
.HRManager .main-content {
  margin-left: 0px;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) .main-content {
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  padding: 0;
}
@media only screen and (min-width: 768px) {
  html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) .main-content {
    padding: 0 10px;
  }
}

.full-screen .main-container-inner {
  min-height: 100vh;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  position: relative;
  background: transparent !important;
  padding: 0 !important;
}
.full-screen .main-container-inner > * {
  width: 100%;
}
@media only screen and (min-width: 768px) {
  .full-screen .main-container-inner {
    align-content: center;
  }
}

/**************************** Foundation - Outer */
div.outer {
  background: url("/content/Customer_battersea/media/OC-training-header2.jpg");
  background-position: top;
  background-repeat: no-repeat;
  background-size: 100%;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) div.outer {
  background: transparent;
  background-repeat: no-repeat;
  background-size: 100% auto;
  min-height: 45px;
}
@media only screen and (min-width: 768px) {
  html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) div.outer {
    min-height: 140px;
    background-size: 100% auto;
  }
}
html.full-screen div.outer {
  background-image: none !important;
}

/******************************** Foundation - Hides ************/
html:not(.SuperAdministrator) .super-only {
  display: none;
}
html:not(.SuperAdministrator):not(.Administrator):not(.admin-login) .system-admin-only {
  display: none;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager) .hradmin-only {
  display: none;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) .admin-only {
  display: none;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) .hradmin-only {
  display: none;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) .ResellerLogo {
  display: none !important;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) #menu-toggler {
  display: none;
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) #sidebar {
  display: none;
}
html:not(.User) .student-only {
  display: none;
}

.User #ace-settings-container {
  display: none;
}
.User .page-header {
  display: none;
}

.Instructor .page-header {
  display: none;
}

@media only screen and (max-width: 1055px) {
  .hide-on-mobile {
    display: none;
  }
}

@media only screen and (max-width: 1055px) {
  .desktop-only {
    display: none !important;
  }
}

@media only screen and (min-width: 1056px) {
  .mobile-only {
    display: none !important;
  }
}

.hide-me, .hide {
  display: none !important;
}

/**************************** Foundations - Page content */
.page-content {
  background: transparent;
  padding-bottom: 10px !important;
}
@media only screen and (max-width: 767px) {
  .page-content {
    padding-left: 0;
    padding-right: 0;
  }
}
@media only screen and (max-width: 767px) {
  .page-content > .row {
    margin-right: 0;
    margin-left: 0;
  }
}
.page-content > .row > div {
  padding: 0;
  /*@media only screen and (max-width: $width-tablet - 1) {
  	padding-left: 10px;
  	padding-right: 10px;
  }*/
}
.page-content > .row > div div {
  /*&.col-sm-12 {
  	@media only screen and (max-width: $width-tablet - 1) {
  		padding-left: 0px;
  		padding-right: 0px;
  	}
  }*/
}
.page-content > .row > div div.col-xs-12 {
  /*@media only screen and (max-width: $width-tablet - 1) {
  	padding-left: 0px;
  	padding-right: 0px;
  }*/
}
@media only screen and (max-width: 767px) {
  .page-content > .row > div div.col-xs-12.training-content {
    padding-left: 15px;
    padding-right: 15px;
  }
}

html.full-screen.User .training-content .page-content .row {
  margin-right: 0; /* needed for training on a phone*/
  margin-left: 0; /* needed for training on a phone*/
}

@media only screen and (min-width: 768px) {
  html:not(.full-screen).User .training-content .page-content .row {
    margin-right: -15px;
    margin-left: -15px;
  }
}

html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) .page-content {
  padding-top: 5px;
}
@media only screen and (min-width: 768px) {
  html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) .page-content {
    padding-top: 10px;
  }
}
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) .page-content .page-content {
  padding-top: 0;
}

/**************************** Foundations - Page Header */
.page-header {
  margin: 40px 0 20px;
}
@media only screen and (min-width: 768px) {
  .page-header {
    margin: 0px 0 20px;
  }
}

/******************************** Foundations - Placement ************/
.clear-both {
  clear: both;
}

@media only screen and (max-width: 679px) {
  .pull-left {
    float: none !important;
    margin: 5px 0 24px;
  }
}
@media only screen and (min-width: 680px) {
  .pull-left {
    margin-right: 30px;
  }
}

@media only screen and (max-width: 679px) {
  .pull-right {
    float: none !important;
    margin: 5px 0 24px;
  }
}
@media only screen and (min-width: 680px) {
  .pull-right {
    margin-left: 30px;
  }
}

.no-padding {
  padding: 0 !important;
}

.no-margin {
  margin: 0 !important;
}

/******************************** Foundations - Printing ************/
@media print {
  .no-print {
    display: none !important;
  }
}

@media print {
  .no-print * {
    display: none !important;
  }
}

/*! Grid style sheet for Battersea Systems 17/10/2022 */
.grid-me {
  display: grid !important;
}

.contents-grid {
  display: flex;
  flex-wrap: wrap;
}

/******************************** Grid - Columns ************/
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-s7m-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xs, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xl-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
  width: 100%;
  min-height: 1px;
  float: none;
}

@media only screen and (min-width: 430px) {
  .col-xs-1 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 8.33333333%;
    flex: 0 0 8.33333333%;
    max-width: 8.33333333%;
  }
  .col-xs-2 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 16.66666667%;
    flex: 0 0 16.66666667%;
    max-width: 16.66666667%;
  }
  .col-xs-3 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-xs-4 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.33333333%;
    flex: 0 0 33.33333333%;
    max-width: 33.33333333%;
  }
  .col-xs-5 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 41.66666667%;
    flex: 0 0 41.66666667%;
    max-width: 41.66666667%;
  }
  .col-xs-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-xs-7 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 58.33333333%;
    flex: 0 0 58.33333333%;
    max-width: 58.33333333%;
  }
  .col-xs-8 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 66.66666667%;
    flex: 0 0 66.66666667%;
    max-width: 66.66666667%;
  }
  .col-xs-9 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-xs-10 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 83.33333333%;
    flex: 0 0 83.33333333%;
    max-width: 83.33333333%;
  }
  .col-xs-11 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 91.66666667%;
    flex: 0 0 91.66666667%;
    max-width: 91.66666667%;
  }
  .col-xs-12 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}

@media only screen and (min-width: 768px) {
  .col-sm-1 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 8.33333333%;
    flex: 0 0 8.33333333%;
    max-width: 8.33333333%;
  }
  .col-sm-2 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 16.66666667%;
    flex: 0 0 16.66666667%;
    max-width: 16.66666667%;
  }
  .col-sm-3 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-sm-4 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.33333333%;
    flex: 0 0 33.33333333%;
    max-width: 33.33333333%;
  }
  .col-sm-5 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 41.66666667%;
    flex: 0 0 41.66666667%;
    max-width: 41.66666667%;
  }
  .col-sm-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-sm-7 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 58.33333333%;
    flex: 0 0 58.33333333%;
    max-width: 58.33333333%;
  }
  .col-sm-8 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 66.66666667%;
    flex: 0 0 66.66666667%;
    max-width: 66.66666667%;
  }
  .col-sm-9 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-sm-10 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 83.33333333%;
    flex: 0 0 83.33333333%;
    max-width: 83.33333333%;
  }
  .col-sm-11 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 91.66666667%;
    flex: 0 0 91.66666667%;
    max-width: 91.66666667%;
  }
  .col-sm-12 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}

@media only screen and (min-width: 992px) {
  .col-md-1 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 8.33333333%;
    flex: 0 0 8.33333333%;
    max-width: 8.33333333%;
  }
  .col-md-2 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 16.66666667%;
    flex: 0 0 16.66666667%;
    max-width: 16.66666667%;
  }
  .col-md-3 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-md-4 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.33333333%;
    flex: 0 0 33.33333333%;
    max-width: 33.33333333%;
  }
  .col-md-5 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 41.66666667%;
    flex: 0 0 41.66666667%;
    max-width: 41.66666667%;
  }
  .col-md-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-md-7 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 58.33333333%;
    flex: 0 0 58.33333333%;
    max-width: 58.33333333%;
  }
  .col-md-8 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 66.66666667%;
    flex: 0 0 66.66666667%;
    max-width: 66.66666667%;
  }
  .col-md-9 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-md-10 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 83.33333333%;
    flex: 0 0 83.33333333%;
    max-width: 83.33333333%;
  }
  .col-md-11 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 91.66666667%;
    flex: 0 0 91.66666667%;
    max-width: 91.66666667%;
  }
  .col-md-12 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}

@media only screen and (min-width: 430px) {
  .offset-xs-1 {
    margin-left: 8.33333333% !important;
  }
  .offset-xs-2 {
    margin-left: 16.66666667% !important;
  }
  .offset-xs-3 {
    margin-left: 25% !important;
  }
  .offset-xs-4 {
    margin-left: 33.33333333% !important;
  }
  .offset-xs-5 {
    margin-left: 41.66666667% !important;
  }
  .offset-xs-6 {
    margin-left: 50% !important;
  }
  .offset-xs-7 {
    margin-left: 58.33333333% !important;
  }
  .offset-xs-8 {
    margin-left: 66.66666667% !important;
  }
  .offset-xs-9 {
    margin-left: 75% !important;
  }
  .offset-xs-10 {
    margin-left: 83.33333333% !important;
  }
  .offset-xs-11 {
    margin-left: 91.66666667% !important;
  }
}

@media only screen and (min-width: 768px) {
  .offset-sm-1 {
    margin-left: 8.33333333% !important;
  }
  .offset-sm-2 {
    margin-left: 16.66666667% !important;
  }
  .offset-sm-3 {
    margin-left: 25% !important;
  }
  .offset-sm-4 {
    margin-left: 33.33333333% !important;
  }
  .offset-sm-5 {
    margin-left: 41.66666667% !important;
  }
  .offset-sm-6 {
    margin-left: 50% !important;
  }
  .offset-sm-7 {
    margin-left: 58.33333333% !important;
  }
  .offset-sm-8 {
    margin-left: 66.66666667% !important;
  }
  .offset-sm-9 {
    margin-left: 75% !important;
  }
  .offset-sm-10 {
    margin-left: 83.33333333% !important;
  }
  .offset-sm-11 {
    margin-left: 91.66666667% !important;
  }
}

@media only screen and (min-width: 992px) {
  .offset-md-1 {
    margin-left: 8.33333333% !important;
  }
  .offset-md-2 {
    margin-left: 16.66666667% !important;
  }
  .offset-md-3 {
    margin-left: 25% !important;
  }
  .offset-md-4 {
    margin-left: 33.33333333% !important;
  }
  .offset-md-5 {
    margin-left: 41.66666667% !important;
  }
  .offset-md-6 {
    margin-left: 50% !important;
  }
  .offset-md-7 {
    margin-left: 58.33333333% !important;
  }
  .offset-md-8 {
    margin-left: 66.66666667% !important;
  }
  .offset-md-9 {
    margin-left: 75% !important;
  }
  .offset-md-10 {
    margin-left: 83.33333333% !important;
  }
  .offset-md-11 {
    margin-left: 91.66666667% !important;
  }
}

/******************************** Grid - Areas ************/
.area-a {
  grid-area: a;
}

.area-b {
  grid-area: b;
}

.area-c {
  grid-area: c;
}

.area-d {
  grid-area: d;
}

.area-e {
  grid-area: e;
}

.area-f {
  grid-area: f;
}

.area-g {
  grid-area: g;
}

/******************************** Grid - Area spans ************/
.area-span-2 {
  grid-column: auto/span 2;
}

.area-span-3 {
  grid-column: auto/span 3;
}

.area-span-4 {
  grid-column: auto/span 4;
}

@media only screen and (min-width: 768px) {
  .column-span-2 {
    grid-column: auto/span 2;
  }
}

@media only screen and (min-width: 768px) {
  .column-span-3 {
    grid-column: auto/span 3;
  }
}

@media only screen and (min-width: 768px) {
  .column-span-4 {
    grid-column: auto/span 4;
  }
}

.row-span-2 {
  grid-row: auto/span 2;
}

.row-span-3 {
  grid-row: auto/span 3;
}

.row-span-4 {
  grid-row: auto/span 4;
}

/******************************** Grid - Div Rows ************/
.div-row {
  margin-bottom: 5px;
  font-size: 90%;
}

.list-group-item.div-row {
  margin-bottom: -1px;
}
.list-group-item.div-row:last-child {
  margin-bottom: 0;
}

/******************************** Grid - Form ************/
.form-horizontal .form-group:before {
  display: none;
}

.form-horizontal .form-group:after {
  display: none;
}

/******************************** Grid - rows ************/
.row, .form-group {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.row {
  margin-right: -15px;
  margin-left: -15px;
}
.row > div {
  padding-left: 15px;
  padding-right: 15px;
}
@media only screen and (min-width: 430px) {
  .row > div {
    padding-left: 15px;
    padding-right: 15px;
    margin-right: 0; /* Issue with dashboard row not being full length. */
    margin-left: 0; /* Issue with dashboard row not being full length. */
  }
}
.row > div.ng-scope {
  width: 100%;
}
.full-screen .row {
  display: grid;
  grid-gap: 0.5rem;
  width: 100% !important;
  margin: 0;
}
.admin-login .row {
  margin-right: 0; /* Issue with dashboard row not being full length. */
  margin-left: 0; /* Issue with dashboard row not being full length. */
}
.row:before {
  display: none;
}
.row:after {
  display: none;
}
.row[class*=columns-] {
  display: grid;
}

.admin-login .container .row {
  display: grid;
  align-content: center;
  justify-content: center;
  height: 100%;
  min-height: 100vh;
}

/******************************** grid-squares ************/
.grid-portrait, .grid-landscape, .grid-squares {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(7rem, 1fr));
  grid-auto-rows: 1fr;
  grid-gap: 0.5em;
}
@media only screen and (min-width: 768px) {
  .grid-portrait, .grid-landscape, .grid-squares {
    grid-gap: 2em;
  }
}
@media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {
  .grid-portrait > *, .grid-landscape > *, .grid-squares > * {
    /*display: grid;*/
  }
}

.grid-squares.result-container, .grid-squares.choice-container {
  margin: 0;
  grid-template-columns: repeat(auto-fill, minmax(calc(50% - 2rem), 1fr));
  grid-gap: 1rem;
  padding: 1rem;
  height: fit-content;
  min-height: 290px;
}
.grid-squares.result-container > *, .grid-squares.choice-container > * {
  position: relative;
  width: 100% !important;
  height: 100% !important;
  max-height: 290px !important;
  max-width: 290px;
}

.grid-squares {
  grid-gap: 0;
}
.grid-squares:before {
  content: "";
  width: 0;
  padding-bottom: 100%;
  grid-row: 1/1;
  grid-column: 1/1;
}
.grid-squares > *:first-child {
  grid-row: 1/1;
  grid-column: 1/1;
}
.grid-squares.click-through {
  grid-template-columns: repeat(auto-fill, minmax(9em, 1fr));
  grid-auto-rows: 1fr;
  grid-gap: 1rem;
}
.grid-landscape {
  grid-gap: 0;
}
.grid-landscape:before {
  content: "";
  width: 0;
  padding-bottom: 100%;
  grid-row: 1/1;
  grid-column: 1/2;
}
.grid-landscape > *:first-child {
  grid-row: 1/1;
  grid-column: 1/2;
}

.grid-portrait {
  grid-gap: 0;
}
.grid-portrait:before {
  content: "";
  width: 0;
  padding-bottom: 100%;
  grid-row: 1/2;
  grid-column: 1/1;
}
.grid-portrait > *:first-child {
  grid-row: 1/2;
  grid-column: 1/1;
}

/*! Accordions style sheet for Battersea Systems 22/10/2024 */
div[id^=accordion_].panel-group .panel .panel-heading.panel-flags, div[id^=accordion_].panel-group .panel .panel-heading.panel-answer-no, div[id^=accordion_].panel-group .panel .panel-heading.panel-answer-yes, div[id^=accordion_].panel-group .panel .panel-heading.panel-question, div[id^=accordion_].panel-group .panel .panel-heading.panel-incorrect, div[id^=accordion_].panel-group .panel .panel-heading.panel-correct, div[id^=accordion_].panel-group .panel .panel-heading.panel-important, div[id^=accordion_].panel-group .panel .panel-heading.panel-information, div[id^=accordion_].panel-group .panel .panel-heading.panel-example {
  padding-left: 4em;
  border-radius: 2px 0 0 2px;
}

div[id^=accordion_].panel-group .panel .panel-heading.panel-question:before, div[id^=accordion_].panel-group .panel .panel-heading.panel-incorrect:before, div[id^=accordion_].panel-group .panel .panel-heading.panel-correct:before, div[id^=accordion_].panel-group .panel .panel-heading.panel-important:before, div[id^=accordion_].panel-group .panel .panel-heading.panel-information:before, div[id^=accordion_].panel-group .panel .panel-heading.panel-example:before {
  top: 0;
  left: 0;
  position: absolute;
  line-height: normal;
  text-align: center;
  font-weight: normal;
  border: none;
  border-radius: 2px;
  font-size: 2em;
  width: 50px !important;
  height: 100% !important;
  box-shadow: none;
  line-height: 0.8em;
  padding: 0;
}

.modal-panel.panel-answer-no, .modal-panel.panel-answer-yes, div[id^=accordion_].panel-group .panel .panel-heading.panel-answer-no + .panel-collapse .panel-body, div[id^=accordion_].panel-group .panel .panel-heading.panel-answer-yes + .panel-collapse .panel-body {
  background-color: #f7f7f7;
  position: relative;
  padding-left: 5em;
}
.modal-panel.panel-answer-no:before, .modal-panel.panel-answer-yes:before, div[id^=accordion_].panel-group .panel .panel-heading.panel-answer-no + .panel-collapse .panel-body:before, div[id^=accordion_].panel-group .panel .panel-heading.panel-answer-yes + .panel-collapse .panel-body:before {
  position: absolute;
  font-family: "Glyphicons Regular";
  left: 0.75em;
  top: 1em;
  font-size: 1.5em;
}

.accordion-status.glyphicons {
  margin-left: 10px;
}

.panel-heading a[data-toggle=collapse] i.accordion-status {
  position: absolute;
  right: 4px;
  top: 0.55em;
  margin: 0;
}
.panel-heading a[data-toggle=collapse].collapsed > i.accordion-status {
  top: 0.45em;
  transform: rotate(0deg);
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
}
.panel-heading a[data-toggle=collapse] > i.accordion-status {
  transform: rotate(45deg);
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
  vertical-align: middle;
}

div[id^=accordion_].panel-group .panel {
  margin-bottom: 2px;
}
div[id^=accordion_].panel-group .panel .panel-heading {
  padding: 0.07em 1em 0.5em 0.5em;
  border-radius: 0;
  border-left: none;
  border-right: none;
  position: relative;
  border-top: 1px solid #CCCCCC;
  border-color: #CCCCCC;
}
div[id^=accordion_].panel-group .panel .panel-heading.panel-flags .panel-title {
  margin: 0 20px 0 0;
  line-height: 1;
}
div[id^=accordion_].panel-group .panel .panel-heading.panel-answer-yes {
  border-radius: 2px;
  border-color: #CCCCCC !important;
}
div[id^=accordion_].panel-group .panel .panel-heading.panel-answer-yes + .panel-collapse .panel-body {
  color: #0a6242;
}
div[id^=accordion_].panel-group .panel .panel-heading.panel-answer-yes + .panel-collapse .panel-body:before {
  left: 0.75em;
  top: 0.35em;
  font-size: 2em;
  content: "\e207";
}
div[id^=accordion_].panel-group .panel .panel-heading.panel-answer-no {
  border-radius: 2px;
  border-color: #CCCCCC !important;
}
div[id^=accordion_].panel-group .panel .panel-heading.panel-answer-no + .panel-collapse .panel-body {
  color: #a94442;
}
div[id^=accordion_].panel-group .panel .panel-heading.panel-answer-no + .panel-collapse .panel-body:before {
  left: 0.75em;
  top: 0.35em;
  font-size: 2em;
  content: "\e208";
}
div[id^=accordion_].panel-group .panel .panel-heading + .panel-collapse .panel-body {
  background-color: #f7f7f7;
  border-color: #999999;
  margin: 0;
  border-bottom: 1px solid #CCCCCC;
  width: 100%;
  border-radius: 0;
  border-top: none;
  width: 100%;
  padding: 1em 2em;
}
div[id^=accordion_].panel-group .panel .panel-heading .panel-title {
  font-weight: 600;
  font-size: 1.1em;
  padding: 0;
}
div[id^=accordion_].panel-group .panel .panel-heading .panel-title a > i.accordion-status:before {
  content: "\e433" !important;
  font-size: 0.9em;
}
div[id^=accordion_] + div[id^=accordion_].panel-group .panel .panel-heading {
  border-top: none;
}

.hide-reveal {
  display: none;
}
.hide-reveal:hover {
  display: inline-block;
  padding: 0 5px;
  vertical-align: middle;
}

.panel-collapse > form {
  padding: 0;
}
.panel-collapse form .form-group.in-line-items.select-file {
  margin: 26px 0 19px;
}

/*! Alerts style sheet for Battersea Systems 14/2/2024 */
.alerts-formatting-before {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 50%;
  content: "";
  display: block;
  width: 2em;
  height: 2em;
  margin-top: -0.25em;
}

span.field-validation-error, div[class*=alert], div[class^=alert], p[class*=alert], p[class^=alert] {
  padding: 15px 15px 15px 50px !important;
  position: relative;
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.3) 0 0 6px 0;
  margin: 20px 50px;
}
@media only screen and (min-width: 768px) {
  span.field-validation-error, div[class*=alert], div[class^=alert], p[class*=alert], p[class^=alert] {
    padding: 15px 40px 15px 50px !important;
  }
}
.full-screen span.field-validation-error, .full-screen div[class*=alert], .full-screen div[class^=alert], .full-screen p[class*=alert], .full-screen p[class^=alert] {
  margin: 1rem 0;
  border-radius: 0;
  box-shadow: none;
}

p[class^=alert] {
  margin-bottom: 10px;
}
p[class*=alert] {
  margin-bottom: 10px;
}

div[class^=alert] > p {
  margin-top: 0;
}
div[class^=alert] > p:first-child {
  margin-top: 0;
}
form div[class^=alert] {
  margin: 20px 0;
}
.admin-group div[class^=alert] {
  margin: 10px 10px 20px;
  clear: left;
}
div[class*=alert] > p {
  margin-top: 0;
}
div[class*=alert] > p:first-child {
  margin-top: 0;
}
form div[class*=alert] {
  margin: 20px 0;
}
.admin-group div[class*=alert] {
  margin: 10px 10px 20px;
  clear: left;
}
div.did-you-know {
  margin: 20px 0;
}
div.did-you-know > p:first-child {
  margin-top: 0;
}
.admin-group div.did-you-know {
  margin: 10px 10px 20px;
  clear: left;
}
div.Did-you-know {
  margin: 20px 0;
}
div.Did-you-know > p:first-child {
  margin-top: 0;
}
.admin-group div.Did-you-know {
  margin: 10px 10px 20px;
  clear: left;
}

div.row > * > p[class^=alert] {
  margin: 20px 0px;
}
div.row > * > p[class*=alert] {
  margin: 20px 0px;
}
div.row > * > div[class^=alert] {
  margin: 20px 0px;
}
div.row > * > div[class*=alert] {
  margin: 20px 0px;
}
div.row > * > span.field-validation-error {
  margin: 20px 0px;
}

span.field-validation-error:before, .alert-important:before, .alert-information:before, .alert-danger:before, .alert-warning:before, .alert-info:before, .alert-success:before, .alert-default:before {
  position: absolute;
  font-family: "Glyphicons Regular";
  left: 14px;
  top: 8px;
  font-size: 25px;
}

.alert-default {
  color: rgb(63.6651162791, 111.9627906977, 172.3348837209);
  background-color: rgb(192.2, 209.8, 231.8);
  border-color: #628ec5;
}
.alert-default:before {
  content: "\e170";
}
.alert-success {
  color: rgb(8, 78.4, 52.8);
  background-color: rgb(109.0888888889, 240.1111111111, 192.4666666667);
  border-color: #0a6242;
}
.alert-success:before {
  content: "\e199";
}
.alert-info {
  color: rgb(54.4, 86.4, 135.2);
  background-color: rgb(177.1316455696, 195.5620253165, 223.6683544304);
  border-color: #446ca9;
}
.alert-info:before {
  content: "\e196";
}
.alert-warning {
  color: rgb(222.5756097561, 146.4, 21.4243902439);
  background-color: rgb(247.8, 222.2, 180.2);
  border-color: #EDAD44;
}
.alert-warning:before {
  content: "\e079";
}
.alert-danger {
  color: rgb(135.2, 54.4, 52.8);
  background-color: rgb(224.1063829787, 176.829787234, 175.8936170213);
  border-color: #a94442;
}
.alert-danger:before {
  content: "\e200";
}
.alert-information {
  color: rgb(54.4, 86.4, 135.2);
  background-color: rgb(177.1316455696, 195.5620253165, 223.6683544304);
  border-color: #446ca9;
}
.alert-information:before {
  content: "\e196";
}
.alert-important {
  color: rgb(135.2, 54.4, 52.8);
  background-color: rgb(224.1063829787, 176.829787234, 175.8936170213);
  border-color: #a94442;
}
.alert-important:before {
  content: "\e200";
}
.alert-tip:before {
  position: absolute;
  display: block;
  left: 10px;
  top: 12px;
  width: 30px;
  font-weight: 600;
  height: 30px;
  line-height: 29px;
  border-radius: 30px;
  box-shadow: rgba(0, 0, 0, 0.3) 0 0 3px 0;
  background-color: #00AAE7;
  border-color: #00AAE7;
  content: "Tip";
  text-align: center;
  font-size: 0.9em;
  font-style: italic;
  color: #ffffff;
}
.alert-example {
  position: absolute;
  left: 18px;
  top: 18px;
  width: 20px;
  height: 20px;
  line-height: 13px;
  text-align: center;
  border-radius: 10px;
  font-size: 19px;
  font-weight: 600;
  margin: 20px;
  padding: 15px;
  box-shadow: none !important;
  color: #628ec5;
  color: #628ec5;
  border: 1px solid;
  border-color: #628ec5;
}
.alert-example:before {
  content: "e";
  background-color: #628ec5;
  border-color: #628ec5;
}
.alert-case {
  position: absolute;
  left: 18px;
  top: 18px;
  width: 20px;
  height: 20px;
  line-height: 13px;
  text-align: center;
  border-radius: 10px;
  font-size: 19px;
  font-weight: 600;
  margin: 20px;
  padding: 15px;
  box-shadow: none !important;
  color: #8a6d3b;
  border: 1px solid #8a6d3b;
}
.alert-case:before {
  content: "c";
  background-color: #8a6d3b;
  border-color: #8a6d3b;
}

span.field-validation-error:before {
  content: "\e079";
}

.Did-you-know, .did-you-know {
  color: #666666;
  position: relative;
  border: 1px solid #f0c105;
  padding: 10px 15px 10px 50px;
  font-weight: 300;
  border-radius: 5px;
}
@media only screen and (min-width: 680px) {
  .Did-you-know, .did-you-know {
    padding: 10px 50px;
  }
}
.Did-you-know:before, .did-you-know:before {
  content: "";
  background-image: url(../images/icons/bulb_white.svg);
  background-position: 50% 50%;
  background-color: #f0c105;
  background-repeat: no-repeat;
  background-size: 18px 19px;
  height: 25px;
  width: 20px;
  border-radius: 3px;
  position: absolute;
  top: 9px;
  left: 11px;
}

/****************************************************************************** Alerts - Boxes */
p[class^=icon-text-box], p[class*=icon-text-box], div[class^=icon-text-box], div[class*=icon-text-box] {
  position: relative;
  border: 1px solid #628ec5;
  padding: 4rem 2rem 2rem;
  font-weight: 600;
  background-color: #ffffff;
  margin: 1rem;
  box-shadow: 0px 5px 19px rgba(0, 0, 0, 0.4);
  text-align: center;
  border-color: #628ec5;
}
p[class^=icon-text-box]:before, p[class*=icon-text-box]:before, div[class^=icon-text-box]:before, div[class*=icon-text-box]:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  font-size: 1rem;
  background-color: #628ec5;
  color: #ffffff;
  text-transform: uppercase;
  font-weight: 300;
  padding: 0.5rem 2em;
}

.icon-text-box-action {
  border-color: #628ec5 !important;
  color: #628ec5 !important;
}
.icon-text-box-action:before {
  background-color: #628ec5 !important;
  content: "Action" !important;
}
.icon-text-box-danger {
  border-color: #a94442 !important;
  color: #a94442 !important;
}
.icon-text-box-danger:before {
  background-color: #a94442 !important;
  content: "Alert" !important;
}
.icon-text-box-example {
  border-color: #628ec5 !important;
  color: #628ec5 !important;
}
.icon-text-box-example:before {
  background-color: #628ec5 !important;
  content: "Example" !important;
}
.icon-text-box-case {
  border-color: #8a6d3b !important;
  color: #8a6d3b !important;
}
.icon-text-box-case:before {
  background-color: #8a6d3b !important;
  content: "Case" !important;
}
.icon-text-box-information {
  border-color: #446ca9 !important;
  color: #446ca9 !important;
}
.icon-text-box-information:before {
  background-color: #446ca9 !important;
  content: "Information" !important;
}
.icon-text-box-warning {
  border-color: #EDAD44 !important;
  color: #EDAD44 !important;
}
.icon-text-box-warning:before {
  background-color: #EDAD44 !important;
  content: "Warning" !important;
}

/*! Animation style sheet for Battersea Systems 18/12/2023 */
/******************************* spin */
@-moz-keyframes spin {
  from {
    -moz-transform: rotate(0deg);
  }
  to {
    -moz-transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.spin {
  -webkit-animation: spin 2s infinite linear;
  -moz-animation: spin 2s infinite linear;
  -o-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
}

.fade-me.in {
  opacity: 1;
  -moz-transition: display 1200ms ease-in;
  -webkit-transition: display 1200ms ease-in;
  -o-transition: display 1200ms ease-in;
  transition: display 1200ms ease-in;
}
.fade-me.already-visible {
  opacity: 1;
  -moz-transition: opacity 1200ms ease-in;
  -webkit-transition: opacity 1200ms ease-in;
  -o-transition: opacity 1200ms ease-in;
  transition: opacity 1200ms ease-in;
}
.fade-me.come-in {
  opacity: 1;
  -moz-transition: opacity 1200ms ease-in;
  -webkit-transition: opacity 1200ms ease-in;
  -o-transition: opacity 1200ms ease-in;
  transition: opacity 1200ms ease-in;
}

.fade-me-in {
  opacity: 0;
}
.fade-me-in.already-visible {
  opacity: 1;
  -moz-transition: opacity 1200ms ease-in;
  -webkit-transition: opacity 1200ms ease-in;
  -o-transition: opacity 1200ms ease-in;
  transition: opacity 1200ms ease-in;
}
.fade-me-in.come-in {
  opacity: 1;
  -moz-transition: opacity 1200ms ease-in;
  -webkit-transition: opacity 1200ms ease-in;
  -o-transition: opacity 1200ms ease-in;
  transition: opacity 1200ms ease-in;
}
.fade-me-in.in {
  opacity: 1;
  -moz-transition: opacity 1200ms ease-in;
  -webkit-transition: opacity 1200ms ease-in;
  -o-transition: opacity 1200ms ease-in;
  transition: opacity 1200ms ease-in;
}
.fade-me-in.delay-me-01 {
  transition-delay: 100ms;
}
.fade-me-in.delay-me-1 {
  transition-delay: 800ms;
}
.fade-me-in.delay-me-2 {
  transition-delay: 1200ms;
}
.fade-me-in.delay-me-3 {
  transition-delay: 1600ms;
}
.fade-me-in.delay-me-4 {
  transition-delay: 2000ms;
}
.fade-me-in.delay-me-5 {
  transition-delay: 2400ms;
}
.fade-me-in.delay-me-6 {
  transition-delay: 2800ms;
}
.fade-me-in.delay-me-7 {
  transition-delay: 3200ms;
}
.fade-me-in.delay-me-8 {
  transition-delay: 3600ms;
}
.fade-me-in.delay-me-9 {
  transition-delay: 4000ms;
}
.fade-me-in.delay-me-10 {
  transition-delay: 4400ms;
}
.fade-me-in.trans-speed-1 {
  transition-duration: 200ms !important;
}
.fade-me-in.trans-speed-2 {
  transition-duration: 400ms !important;
}
.fade-me-in.trans-speed-3 {
  transition-duration: 600ms !important;
}
.fade-me-in.trans-speed-4 {
  transition-duration: 800ms !important;
}
.fade-me-in.trans-speed-5 {
  transition-duration: 1000ms !important;
}
.fade-me-in.trans-speed-6 {
  transition-duration: 1200ms !important;
}
.fade-me-in.trans-speed-7 {
  transition-duration: 1400ms !important;
}
.fade-me-in.trans-speed-8 {
  transition-duration: 1600ms !important;
}
.fade-me-in.trans-speed-9 {
  transition-duration: 1800ms !important;
}
.fade-me-in.trans-speed-10 {
  transition-duration: 2000ms !important;
}

/*! Audio style sheet for Battersea Systems 9/12/2024 */
.audio-player {
  padding: 5px;
}
.audio-player.sticky.fixed {
  position: fixed;
  top: 0;
}
.audio-player.sticky.fixed .player-controls-outer {
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
}
.audio-player .player-controls-outer {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  grid-gap: 1em;
  background-color: #f7f7f7;
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0);
}
.audio-player .player-controls-outer .btn-icon {
  background-size: 60%;
  background-repeat: no-repeat;
  background-position: 50%;
  border: none;
  height: 4em;
  aspect-ratio: 1/1;
  width: auto !important;
  -moz-transition: background-color 0.35s ease;
  -webkit-transition: background-color 0.35s ease;
  -o-transition: background-color 0.35s ease;
  transition: background-color 0.35s ease;
  /*margin-left: 1em;*/
}
.audio-player .player-controls-outer .btn-icon:not(:hover) {
  background-color: transparent !important;
}
.audio-player .player-controls-outer .btn-icon:hover {
  background-color: #CCCCCC !important;
}
.audio-player .player-controls-outer .btn-icon.icon-play {
  background-image: url("/content/images/icons/icon-play.svg") !important;
}
.audio-player .player-controls-outer .btn-icon.icon-play:before {
  display: none;
}
.audio-player .player-controls-outer .btn-icon.icon-play.pause {
  background-image: url("/content/images/icons/icon-pause.svg") !important;
}
.audio-player .player-controls-outer .btn-icon.icon-play.pause:hover {
  background-image: url("/content/images/icons/icon-pause-white.svg") !important;
}
.audio-player .player-controls-outer .btn-icon.icon-play:hover {
  background-image: url("/content/images/icons/icon-play-white.svg") !important;
}
.student-dashboard .audio-player .player-controls-outer .btn-icon {
  padding: 1em;
  background-size: 75%;
}
.audio-player .player-controls-outer .player-controls .audio-title {
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  white-space: nowrap;
}
.audio-player .player-controls-outer .player-controls .audio-info progress {
  width: 100%;
}
.audio-player .player-controls-outer .player-controls .audio-info progress::-webkit-progress-value {
  background-color: #666666;
}
.audio-player .player-controls-outer .player-controls .audio-info .end-time {
  font-size: 0.8em;
  color: #999999;
  margin-left: auto;
  display: block;
  width: fit-content;
}
.audio-player .player-controls-outer .audio-image {
  background-image: url("/Content/images/Battersea/bat-audio-default.jpg");
  background-size: contain;
  background-position: 50%;
  background-repeat: no-repeat;
  height: 100%;
  min-height: 100px;
  aspect-ratio: 1/1;
  border-radius: 2px;
}
.audio-player.mini .player-controls-outer .btn-icon {
  padding: 1em;
  background-size: 75%;
  height: 1.2em;
}
.audio-player.mini .player-controls-outer .player-controls .audio-info .end-time {
  display: none;
}
.audio-player.mini .player-controls-outer .player-controls .audio-title {
  display: none;
}
.audio-player.mini .player-controls-outer .audio-image {
  min-height: 40px;
}

body:not(.training-content) .audio-player .player-controls-outer .btn-icon {
  height: 100%;
  margin-left: 0;
}
body:not(.training-content) .audio-player .player-controls-outer .player-controls .audio-info .end-time {
  display: none;
}
body:not(.training-content) .audio-player .player-controls-outer .player-controls .audio-title {
  display: none;
}
body:not(.training-content) .audio-player .player-controls-outer .audio-image {
  min-height: 40px;
}

/*! Boxes style sheet for Battersea Systems 29/11/2024 */
/**************************** Text-Icon Boxes */
.text-icon-box {
  background-colour: #999999;
  border-radius: 2rem;
  position: relative;
  border: none;
  padding: 4em 2em 2em 2em;
  max-width: 500px;
}
.text-icon-box:before {
  content: "";
  position: absolute;
  top: -0.5em;
  right: -0.5em;
  background-color: #ffffff;
  width: 5em;
  height: 5em;
  border-radius: 5em;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3);
}
.text-icon-box.back-blue {
  background-color: #628ec5 !important;
}
.text-icon-box.back-blue:before {
  background-color: #628ec5;
}
.text-icon-box.back-lime {
  background-color: #ABC059;
}
.text-icon-box.back-lime:before {
  background-color: #ABC059;
}
.text-icon-box.back-cyan {
  background-color: #01c1d0;
}
.text-icon-box.back-cyan:before {
  background-color: #01c1d0;
}
.text-icon-box.back-lavender {
  background-color: #A5ABCD;
}
.text-icon-box.back-lavender:before {
  background-color: #A5ABCD;
}
.text-icon-box.back-sea {
  background-color: #242657;
}
.text-icon-box.back-sea:before {
  background-color: #242657;
}
.text-icon-box.back-apricot {
  background-color: #f3ae53;
}
.text-icon-box.back-apricot:before {
  background-color: #f3ae53;
}
.text-icon-box.back-purple {
  background-color: #5D4786 !important;
}
.text-icon-box.back-purple:before {
  background-color: #5D4786;
}
.text-icon-box.back-primary1 {
  background-color: #010101;
}
.text-icon-box.back-primary1:before {
  background-color: #010101;
}
.text-icon-box.back-primary2 {
  background-color: #00AAE7;
}
.text-icon-box.back-primary2:before {
  background-color: #00AAE7;
}
.text-icon-box.back-primary3 {
  background-color: #3363AF;
}
.text-icon-box.back-primary3:before {
  background-color: #3363AF;
}
.text-icon-box.back-primary4 {
  background-color: #B4BBC9;
}
.text-icon-box.back-primary4:before {
  background-color: #B4BBC9;
}
.text-icon-box.back-secondary1 {
  background-color: #9B4F9F;
}
.text-icon-box.back-secondary1:before {
  background-color: #9B4F9F;
}
.text-icon-box.back-secondary2 {
  background-color: #F26A21;
}
.text-icon-box.back-secondary2:before {
  background-color: #F26A21;
}
.text-icon-box.back-secondary3 {
  background-color: #6FC9C6;
}
.text-icon-box.back-secondary3:before {
  background-color: #6FC9C6;
}
.text-icon-box.back-secondary4 {
  background-color: #69C073;
}
.text-icon-box.back-secondary4:before {
  background-color: #69C073;
}

/**************************** Highlight Boxes */
.highlight-box {
  padding: 1em;
  border-radius: 2px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}

/**************************** Icon Heading Boxes */
.iconheader-box {
  width: 275px;
  border-radius: 2em;
  align-content: flex-start;
  justify-content: center;
  padding: 4em 2em 2em;
}
.iconheader-box:before {
  content: "";
  border-radius: 1em;
  border: 2px solid #000000;
  position: absolute;
  top: 1em;
  right: 1em;
  bottom: 1em;
  left: 1em;
}
.iconheader-box[class*=icon-] > *:before {
  margin: 0 auto 0.35em;
  width: 3.5em;
  height: 3.5em;
}
.iconheader-box.dark:before {
  border-color: #ffffff;
}

/**************************** Senario Boxes */
.box-scenario {
  margin: 2em;
  font-size: 1.1em;
  border-width: 2px !important;
  overflow: hidden;
}
.box-scenario .box-scenario-inner {
  padding: 1.5em 3em;
}
.box-scenario.image {
  display: grid;
  grid-gap: 1.5em;
}
@media only screen and (min-width: 992px) {
  .box-scenario.image {
    grid-gap: 3em;
    grid-template-columns: auto 1fr;
  }
}
.box-scenario.image .box-scenario-inner {
  padding-top: 0;
  padding-bottom: 1.5em;
}
@media only screen and (max-width: 991px) {
  .box-scenario.image .box-scenario-inner {
    grid-row: 2;
  }
}
@media only screen and (min-width: 992px) {
  .box-scenario.image .box-scenario-inner {
    padding-right: 0;
    padding-top: 1.5em;
  }
}
.box-scenario.image > div.back-image {
  height: 400px;
}
@media only screen and (min-width: 992px) {
  .box-scenario.image > div.back-image {
    width: 400px;
    height: auto;
  }
}
@media only screen and (min-width: 992px) {
  .box-scenario.image > div.back-image + .box-scenario-inner {
    padding-top: 1.5em;
    padding-right: 3em;
    padding-left: 0;
  }
}

/**************************** Example Boxes */
.case-box, .example-box {
  border: 2px solid #CCCCCC;
  margin: 1.5em 3em 3em;
  border-radius: 2px;
}
.case-box > .inner, .example-box > .inner {
  font-size: 1.1em;
  position: relative;
  padding: 1.5em;
}
.case-box > .inner:before, .example-box > .inner:before {
  display: block;
  background-size: contain;
  background-position: left center;
  background-repeat: no-repeat;
  font-size: 1.5em;
  padding: 0.45em;
  line-height: 1.5em;
  padding-left: 3em;
  margin-bottom: 0.75em;
  margin-left: -0.2em;
}

.example-box {
  border-color: #628ec5;
}
.example-box > .inner:before {
  content: "Example";
  background-image: url("../images/icons/icon-example.svg");
  color: #628ec5;
}
.example-box.dark > .inner:before {
  background-image: url("../images/icons/icon-example-white.svg");
  color: #ffffff;
}

.case-box {
  border-color: #8a6d3b;
}
.case-box > .inner:before {
  content: "Case Study";
  background-image: url("../images/icons/icon-case.svg");
  color: #8a6d3b;
}
.case-box.dark > .inner:before {
  background-image: url("../images/icons/icon-case-white.svg");
  color: #ffffff;
}

.radius-small {
  border-radius: 9px !important;
  overflow: hidden;
}

.radius-medium {
  border-radius: 18px !important;
  overflow: hidden;
}

.radius-large {
  border-radius: 36px !important;
  overflow: hidden;
}

/*! Branding style sheet for Battersea Systems  2/9/2021 */
/**************************************************  Header - Branding */
.navbar-brand {
  background-repeat: no-repeat;
  background-size: contain;
  width: 250px;
}
.navbar .navbar-brand {
  color: initial;
  font-size: initial;
  padding: 0;
}

.ResellerLogo {
  display: block;
  height: 30px;
  width: 23px;
  margin: 0;
  position: absolute;
  top: 5px;
  right: 55px;
  transition: 0.2s ease-out, right 0.2s ease-out;
  -moz-transition: 0.2s ease-out, right 0.2s ease-out;
  -webkit-transition: 0.2s ease-out, right 0.2s ease-out;
}
@media only screen and (max-width: 767px) {
  .admin-login .ResellerLogo {
    right: 0;
  }
}
@media only screen and (min-width: 768px) {
  .ResellerLogo {
    width: 255px;
    height: 38px;
    margin: 0;
    top: 10px;
  }
  .admin-login .ResellerLogo {
    top: 31px;
  }
}
.navbar.navbar-default.shrink .ResellerLogo {
  top: 50px;
  min-width: 0 !important;
  width: 200px !important;
}

.ClientLogo {
  background-image: url("/content/Customer_battersea/media/battersea-pagecurl.svg");
  float: none;
  display: block;
  position: absolute;
  left: 4%;
}
@media only screen and (min-width: 768px) {
  .ClientLogo {
    background-image: url("/content/Customer_battersea/media/BatterseaSystems_Logo.svg");
    width: 210px;
    height: 38px;
    top: 10px;
  }
}
.navbar.navbar-default.shrink .ClientLogo {
  top: 8px !important;
  height: 40px !important;
}

.Header-colour h2 {
  margin: 0;
  padding: 0;
}

/**************************************************  Footer - Branding */
footer .reseller-logo {
  background-repeat: no-repeat;
  background-size: contain;
  display: block;
  height: 28px;
  width: auto;
  margin: 5px auto;
  background-position: center;
}
@media (min-width: 768px) {
  footer .reseller-logo {
    background-size: 300px;
    width: 300px;
    background-position: initial;
  }
}
footer .ResellerLogo .img-responsive {
  margin: 0 auto;
}
footer .navbar-brand {
  float: none;
  padding: 0;
}
@media (min-width: 768px) {
  footer a.reseller-logo {
    display: none !important;
  }
}
@media (min-width: 768px) {
  html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) footer a.reseller-logo {
    display: block !important;
    background-size: contain;
    width: 220px;
    float: left;
  }
}
footer a.powered-by-logo {
  background-image: url("../images/Battersea/Branding/Battersea-powered-by-white.svg");
  background-repeat: no-repeat;
  background-size: contain;
  display: block;
  height: 20px;
  width: 70px;
  margin: 10px auto;
}
@media (min-width: 768px) {
  footer a.powered-by-logo {
    display: inline-block;
    vertical-align: middle;
    margin: 0 0 0 10px;
  }
}

html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) a.powered-by-logo {
  background-image: url("../images/Battersea/Branding/Battersea-powered-by.svg");
}

/**************************************************  Product - Branding */
.full-screen .product-logo {
  display: block;
  background-size: contain;
  background-position: 50%;
  background-repeat: no-repeat;
  background-image: url("/content/Customer_battersea/media/battersea-systems.svg");
  width: 30px;
  height: 10px;
  align-self: flex-end;
  margin: 0;
}
@media (min-width: 768px) {
  .full-screen .product-logo {
    margin-top: 5px;
  }
}

/*! Breadcrumbs style sheet for Battersea Systems 24/7/2021 */
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) #breadcrumbs {
  display: none;
}

.breadcrumbs {
  display: none;
  margin-left: 45px;
}
@media only screen and (min-width: 768px) {
  .breadcrumbs {
    display: block;
    border-bottom: none;
    background-color: transparent;
  }
}

.breadcrumb {
  background-color: transparent;
  margin-bottom: 0;
}
.breadcrumb .home-icon {
  color: #010101;
}

/* Buttons style sheet for Battersea Systems 27/7/2021 */
button {
  -webkit-hyphens: none;
  hyphens: none;
}
button.btn:active {
  top: -1px;
  left: 0;
  border-width: 2px;
}
button.btn-major {
  display: block;
  margin: 0 auto;
  font-size: 1.8rem;
  width: 50%;
  min-width: 300px;
}

/****************************  Buttons - Classes */
.btn {
  text-shadow: none !important;
  -webkit-hyphens: none;
  hyphens: none;
}
.btn:hover {
  opacity: 0.8;
}
.btn.active:after {
  border-bottom: none;
}
.btn-row {
  margin: 5px 0;
}
.btn-primary {
  background-color: #010101 !important;
}
.btn-primary:focus {
  background-color: #010101 !important;
}
.btn-primary:hover {
  background-color: #010101 !important;
}
.btn-primary.active {
  background-color: rgb(0.6, 0.6, 0.6) !important;
}
.open .btn-primary.dropdown-toggle {
  background-color: rgb(0.6, 0.6, 0.6) !important;
}
.btn-default {
  background-color: #628ec5 !important;
}
.btn-default:focus {
  background-color: #628ec5 !important;
}
.btn-default:hover {
  background-color: #628ec5 !important;
}
.btn-default:active:hover {
  color: #666666 !important;
}
.btn-default:active:focus {
  color: #666666 !important;
}
.btn-default:active.focus {
  color: #666666 !important;
}
.btn-default.active {
  background-color: rgb(47.7488372093, 83.9720930233, 129.2511627907) !important;
}
.btn-default.active:hover {
  color: #666666 !important;
}
.btn-default.active:focus {
  color: #666666 !important;
}
.btn-default.active.focus {
  color: #666666 !important;
}
.open .btn-default.dropdown-toggle {
  background-color: rgb(47.7488372093, 83.9720930233, 129.2511627907) !important;
}
.btn-info {
  background-color: #446ca9 !important;
}
.btn-info:focus {
  background-color: #446ca9 !important;
}
.btn-info:hover {
  background-color: #446ca9 !important;
}
.btn-info.active {
  background-color: rgb(40.8, 64.8, 101.4) !important;
}
.open .btn-info.dropdown-toggle {
  background-color: rgb(40.8, 64.8, 101.4) !important;
}
.btn-warning {
  background-color: #EDAD44 !important;
}
.btn-warning:focus {
  background-color: #EDAD44 !important;
}
.btn-warning:hover {
  background-color: #EDAD44 !important;
}
.btn-warning.active {
  background-color: rgb(166.9317073171, 109.8, 16.0682926829) !important;
}
.open .btn-warning.dropdown-toggle {
  background-color: rgb(166.9317073171, 109.8, 16.0682926829) !important;
}
.btn-danger {
  background-color: #a94442 !important;
}
.btn-danger:focus {
  background-color: #a94442 !important;
}
.btn-danger:hover {
  background-color: #a94442 !important;
}
.btn-danger.active {
  background-color: rgb(101.4, 40.8, 39.6) !important;
}
.open .btn-danger.dropdown-toggle {
  background-color: rgb(101.4, 40.8, 39.6) !important;
}
.btn-module {
  padding: 0 0 10px;
  margin: 0 0 10px 0;
  text-decoration: none;
  font-size: 0.9em;
  border-bottom: 1px solid #f7f7f7;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.btn-module:hover {
  text-decoration: none;
  background-color: #f7f7f7;
}
.btn-module:focus {
  text-decoration: none;
  background-color: #f7f7f7;
}
.btn-module:active {
  text-decoration: none;
  background-color: #f7f7f7;
}
.btn-group > .btn {
  border-width: 1px;
  border-radius: 10px !important;
  margin-left: 5px !important;
  padding: 3px 11px;
}
.btn-group + .btn {
  border-width: 1px;
  border-radius: 10px !important;
  margin-left: 5px !important;
  padding: 3px 11px;
}
.btn > [class*=icon-] {
  display: inline;
  margin-right: 0;
}

.open > .dropdown-toggle.btn-default:hover {
  color: #666666 !important;
}
.open > .dropdown-toggle.btn-default:focus {
  color: #666666 !important;
}
.open > .dropdown-toggle.btn-default.focus {
  color: #666666 !important;
}

.pull-right.btn-group {
  margin-top: 0;
  margin-left: 0;
  margin-bottom: 0;
}
@media only screen and (max-width: 569px) {
  .pull-right.btn-group {
    float: none !important;
    margin-top: 5px;
  }
}

a.btn-major {
  display: block;
  margin: 0 auto;
  font-size: 1.8rem;
  width: 50%;
  min-width: 300px;
}

/*! Carousel style sheet for Battersea Systems 30/7/2021 */
@media all and (transform-3d), (-webkit-transform-3d) {
  .carousel-fade .carousel-inner > .item.active.left, .carousel-fade .carousel-inner > .item.active.right, .carousel-fade .carousel-inner > .item.active, .carousel-fade .carousel-inner > .item.prev.right, .carousel-fade .carousel-inner > .item.prev, .carousel-fade .carousel-inner > .item.next.left, .carousel-fade .carousel-inner > .item.next {
    webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.carousel {
  position: relative;
  height: auto;
  overflow: hidden;
  -webkit-box-shadow: none;
  box-shadow: none;
  padding: 0 !important;
  margin-bottom: 10px;
}

.carousel-fade .carousel-inner .item {
  opacity: 0;
  -webkit-transition-property: opacity;
  transition-property: opacity;
}
@media all and (transform-3d), (-webkit-transform-3d) {
  .carousel-fade .carousel-inner > .item.next.left {
    opacity: 1;
  }
}
@media all and (transform-3d), (-webkit-transform-3d) {
  .carousel-fade .carousel-inner > .item.prev.right {
    opacity: 1;
  }
}
@media all and (transform-3d), (-webkit-transform-3d) {
  .carousel-fade .carousel-inner > .item.active {
    opacity: 1;
  }
}
.carousel-fade .carousel-inner .active {
  opacity: 1;
}
.carousel-fade .carousel-inner .active.left {
  left: 0;
  opacity: 0;
  z-index: 1;
}
.carousel-fade .carousel-inner .active.right {
  opacity: 0;
  z-index: 1;
}
.carousel-fade .carousel-inner .next.left {
  opacity: 1;
}
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}
.carousel-fade .carousel-inner .carousel-control {
  z-index: 2;
}

.left.carousel-control, .right.carousel-control {
  display: none;
}

.carousel-inner {
  height: 100%;
}
.carousel-inner .item {
  height: 100%;
  background-position: 0% 50%;
  background-size: cover !important;
}

.carousel-caption {
  left: 50px;
  right: initial;
  width: 450px;
  padding-bottom: 30px;
  bottom: initial;
  top: 0px;
  text-align: left;
}
.carousel-caption h3 {
  color: #ffffff;
  font-weight: 700;
  font-size: 1.1em;
  margin-bottom: 5px;
}
.carousel-caption p {
  font-weight: 400;
  font-size: 1rem;
}

.carousel-indicators {
  bottom: 0;
  left: 6.5%;
}

/****************************************************************************** Carousel */
.thumbnail > img, .in-line .carousel-inner > .item > a > img, .in-line .carousel-inner > .item > img, .in-line .thumbnail a > img, .in-line .img-responsive {
  max-height: none;
}
@media all and (min-width: 768px) {
  .thumbnail > img, .in-line .carousel-inner > .item > a > img, .in-line .carousel-inner > .item > img, .in-line .thumbnail a > img, .in-line .img-responsive {
    max-width: 66.667%;
    display: inline-block;
    vertical-align: top;
  }
}

.in-line .carousel-inner .item {
  background-color: #010101;
}
.in-line .carousel-caption {
  position: static;
  display: inline-block;
  padding: 0.5em 1em 3em;
  text-align: left;
  font-size: 1.1em;
  background-color: #010101;
}
@media all and (min-width: 768px) {
  .in-line .carousel-caption {
    width: 33.333%;
    padding: 0.5em 1em;
  }
}
.in-line .carousel-indicators {
  width: auto;
  left: 2em;
  bottom: 1em;
  margin: 0;
}

/* Content Well style sheet for Battersea Systems 15/11/2021 */
.content-well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f7f7f7;
  border: 1px solid #f7f7f7;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}

.well {
  background-colour: #f7f7f7;
}
.well hr {
  border-top: 1px solid #999999;
}

/* ! CSS Document
     Deflex Sass style sheet for BatterseaSystems
     © 2019 Idaho Design and Communication Pty Ltd 16/11/21 | Author: David Haworth david@idahodesign.com */
div[class^=defex-] {
  border: 1px solid #ffffff;
  padding: 1rem 2.5rem 1rem 120px;
  border-radius: 0.5rem;
  box-shadow: 0 15px 25px rgba(0, 0, 0, 0.3);
  max-width: 550px;
  position: relative;
  margin: 2.5rem auto 1.5rem;
  width: 95%;
}
div[class^=defex-]:before {
  content: "";
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 50%;
  background-image: url("/content/images/defex_images/defex-bubbles.jpg");
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 95px;
  border-radius: 0.5rem 0 0 0.5rem;
}
div[class^=defex-] > h3 {
  font-weight: 700;
  font-size: 1.7rem;
}
div[class^=defex-] > .Heading30 {
  font-weight: 700;
  font-size: 1.7rem !important;
}
div[class^=defex-] p {
  font-family: "Helvetica", Helvetica, Arial, sans-serif !important;
  font-weight: 600;
  line-height: 1.3em;
  font-size: 1.2rem;
  letter-spacing: normal;
}
div[class^=defex-] hr {
  margin-top: 15px;
  margin-bottom: 12px;
  border: 0;
  border-top: 1px solid #CCCCCC;
}
div[class^=defex-] .example {
  margin: 0 1em;
}
div[class^=defex-] .example > h4 {
  font-family: "Helvetica", Helvetica, Arial, sans-serif !important;
  font-weight: 700;
  font-size: 1.4rem;
}
div[class^=defex-] .example p {
  font-family: "Helvetica", Helvetica, Arial, sans-serif !important;
  font-weight: 400;
  font-style: normal;
}

div.defex-boxes:before {
  background-image: url("content/images/defex_images/defex-boxes.jpg");
}
div.defex-bubbles:before {
  background-image: url("/content/images/defex_images/defex-bubbles.jpg");
}
div.defex-cubes:before {
  background-image: url("/content/images/defex_images/defex-cubes.jpg");
}
div.defex-feather:before {
  background-image: url("/content/images/defex_images/defex-feather.jpg");
}
div.defex-geometric:before {
  background-image: url("/content/images/defex_images/defex-geometric.jpg");
}
div.defex-gold:before {
  background-image: url("/content/images/defex_images/defex-gold.jpg");
}
div.defex-honey:before {
  background-image: url("/content/images/defex_images/defex-honey.jpg");
}
div.defex-lattice:before {
  background-image: url("/content/images/defex_images/defex-lattice.jpg");
}
div.defex-leaf:before {
  background-image: url("/content/images/defex_images/defex-leaf.jpg");
}
div.defex-spiral:before {
  background-image: url("/content/images/defex_images/defex-spiral.jpg");
}
div.defex-steel:before {
  background-image: url("/content/images/defex_images/defex-steel.jpg");
}
div.defex-tube:before {
  background-image: url("/content/images/defex_images/defex-tube.jpg");
}
div.defex-blue-leaf:before {
  background-image: url("/content/images/defex_images/defex-blue-leaf.jpg");
}
div.defex-black-vortex:before {
  background-image: url("/content/images/defex_images/defex_black_vortex.jpg");
}
div.defex-blue-dots:before {
  background-image: url("/content/images/defex_images/defex_bluedots.jpg");
}
div.defex-blur-light:before {
  background-image: url("/content/images/defex_images/defex_blur_light.jpg");
}
div.defex-cityscape:before {
  background-image: url("/content/images/defex_images/defex_cityscape.jpg");
}
div.defex-glass:before {
  background-image: url("/content/images/defex_images/defex_glass.jpg");
}
div.defex-gold-bubbles:before {
  background-image: url("/content/images/defex_images/defex_gold_bubbles.jpg");
}
div.defex-pink-swirl:before {
  background-image: url("/content/images/defex_images/defex_pink_swirl.jpg");
}
div.defex-pink:before {
  background-image: url("/content/images/defex_images/defex_pink.jpg");
}
div.defex-red-panels:before {
  background-image: url("/content/images/defex_images/defex_red_panels.jpg");
}
div.defex-tech:before {
  background-image: url("/content/images/defex_images/defex_tech.jpg");
}

div.defex-icon {
  position: absolute;
  background-repeat: no-repeat;
  background-size: 84%;
  background-position: 50% 50%;
  background-image: url("/content/images/defex_images/icon-claims.svg");
  left: 5px;
  top: 5px;
  height: 80px;
  width: 85px;
  margin: 0;
  padding: 0;
  box-shadow: none;
  border-radius: 0;
  border: none;
}
div.defex-icon:before {
  display: none;
}
div.defex-icon.claims {
  background-image: url(/content/images/defex_images/icon-claims.svg);
}
div.defex-icon.compare {
  background-image: url(/content/images/defex_images/icon-compare.svg);
}
div.defex-icon.conditions {
  background-image: url(/content/images/defex_images/icon-conditions.svg);
}
div.defex-icon.disclaim {
  background-image: url(/content/images/defex_images/icon-disclaim.svg);
}
div.defex-icon.lock {
  background-image: url(/content/images/defex_images/icon-lock.svg);
}
div.defex-icon.price {
  background-image: url(/content/images/defex_images/icon-price.svg);
}
div.defex-icon.testimonial {
  background-image: url(/content/images/defex_images/icon-testimonial.svg);
}

/*! Drag and Drop style sheet for Battersea Systems 20/03/2023 */
/**************************** Drag and Drop - Handles */
.drag-item, .drag-handle, table:not(.ui-datepicker-calendar) td.drag-handle {
  padding-left: 36px !important;
  position: relative;
}
.drag-item:before, .drag-handle:before, table:not(.ui-datepicker-calendar) td.drag-handle:before {
  display: block !important;
  touch-action: none;
  content: "";
  position: absolute;
  top: 6px;
  left: 6px;
  width: 20px;
  height: 20px;
  background-size: contain;
  background-position: 50%;
  background-repeat: no-repeat;
  background-image: url("/Content/images/Icons/drag-handle.svg");
  opacity: 0.6;
  -moz-transition: opacity 0.3s ease-out;
  -webkit-transition: opacity 0.3s ease-out;
  -o-transition: opacity 0.3s ease-out;
  transition: opacity 0.3s ease-out;
}
.drag-item:before:hover:before, .drag-handle:before:hover:before {
  opacity: 1;
}

/**************************** Drag and Drop - Item/handle */
.drag-drop {
  margin: 2rem 0;
}
.drag-drop.grid-squares {
  grid-gap: 2rem;
  grid-template-columns: repeat(auto-fill, minmax(25rem, 1fr));
}

/**************************** Drag and Drop - Item/handle */
.drag-item {
  border: 1px solid #CCCCCC;
  padding: 0.5rem 1rem;
  border-radius: 0.2rem;
  -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  background-color: rgba(255, 255, 255, 0.3);
  -moz-transition: box-shadow 0.3s ease;
  -webkit-transition: box-shadow 0.3s ease;
  -o-transition: box-shadow 0.3s ease;
  transition: box-shadow 0.3s ease;
  -moz-transition: border-color 0.3s ease;
  -webkit-transition: border-color 0.3s ease;
  -o-transition: border-color 0.3s ease;
  transition: border-color 0.3s ease;
  z-index: 100;
  cursor: grab;
}
.drag-item:not(.back-image) {
  margin: 0.25em;
  min-width: 300px;
}
.drag-item.graphic {
  min-width: 100px;
}

.dd-handle {
  padding: 0.1rem 0.2rem 0 2.5rem;
}
.dd-handle a.glyphicon {
  text-decoration: none;
  display: inline-block;
}
.dd-handle a.glyphicons {
  text-decoration: none;
  display: inline-block;
}
.dd-handle a.filetypes {
  text-decoration: none;
  display: inline-block;
}

/**************************** Drag and Drop - graphics */
.drag-item.graphic {
  padding: 0 !important;
  max-width: 80px;
  border: none;
  background-color: rgba(255, 255, 255, 0.2);
  flex: 0 0 100px;
}
.drag-item.graphic:before {
  display: none;
}
.drag-item.graphic p {
  padding: 0;
}
.drag-item.graphic p img {
  padding: 0;
}

/**************************** Drag and Drop - Images */
.drag-item.image {
  padding: 0;
  background-color: rgba(0, 0, 0, 0.3);
  padding-left: 0 !important;
}

.drag-item.image p {
  margin: 0;
}

.drag-item.image img {
  margin: 0;
  padding: 0.3rem;
  width: auto;
  max-height: none;
}

/**************************** Drag and Drop - Testing */
.answer-group, .question-group {
  margin-top: 0;
  padding: 5px !important;
  min-height: 15px;
  background: #f7f7f7;
  border: 1px solid #CCCCCC;
}
@media only screen and (min-width: 768px) {
  .answer-group, .question-group {
    min-height: 30px;
  }
}

.answer-group {
  background: #ffffff;
  position: relative;
  justify-content: center;
}
.answer-group:before {
  content: attr(data-title);
  position: absolute;
  font-size: 1.3em;
  color: lightgrey;
  font-weight: 600;
  width: calc(100% - 10px);
  text-align: center;
  padding: 0.5em 2em;
  line-height: 1.2;
}
@media only screen and (min-width: 768px) {
  .answer-group:before {
    font-size: 2em;
  }
}

.nestedSortable-list {
  /*display: block;*/
  position: relative;
  margin: 0px;
  padding: 0px;
  list-style: none;
}
.nestedSortable-handle {
  cursor: move;
  display: block;
  min-height: 38px;
  margin: 3px;
  padding: 5px 12px;
  background: #f8faff;
  border: 1px solid #dae2ea;
  color: #3e3b3f;
  text-decoration: none;
  font-weight: 700;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.nestedSortable-handle:hover {
  background: #f4f6f7;
  border-color: #dce2e8;
}
.nestedSortable-handle p {
  margin: 4px 0;
}
.nestedSortable-drag {
  position: absolute;
  pointer-events: none;
  z-index: 999;
  opacity: 0.8;
}
.module-test .nestedSortable-item {
  border: dashed 1px #bed2db;
  margin: 1px 0 !important;
}
.nestedSortable-item > td {
  vertical-align: middle !important;
}
.nestedSortable-item:nth-child(2) .nestedSortable-handle {
  /*margin-top: 0;*/
}
.nestedSortable-item:last-child .nestedSortable-handle {
  /*margin-bottom: 0;*/
}
.nestedSortable-placeholder {
  margin: 5px 0;
  padding: 0;
  min-height: 30px;
  background: #f0f9ff;
  border: 2px dashed #bed2db;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

tbody.nestedSortable-list {
  display: table-header-group;
}

tr.nestedSortable-item {
  display: table-row;
}

td.nestedSortable-handle {
  align-content: center;
  justify-content: center;
  display: block !important;
}

.nestedSortable-item, .nestedSortable-placeholder {
  /*display: block;*/
  position: relative;
  margin: 0px;
  padding: 0px;
  min-height: 20px;
  line-height: 20px;
}

/* Flags style sheet for Battersea Systems 22/10/2024 */
/**************************** Flags in divs */
.panel-flags, .Flags, .flags {
  position: relative;
  padding-left: 85px !important;
  text-align: left !important;
}
.panel-flags:before, .Flags:before, .flags:before {
  content: "";
  position: absolute;
  display: block;
  width: 75px;
  height: 100%;
  max-height: 45px;
  left: 0;
  top: 0;
  background-size: contain;
  background-position: 0 0;
  background-repeat: no-repeat;
}

.Flags, .flags {
  padding-left: 90px !important;
  padding-top: 0 !important;
  min-height: 3.5em;
}
.Flags:before, .flags:before {
  top: 0.25em;
}

/**************************** Flags on panels */
/**************************** Flags Countries */
.Abkhazia:before, .abkhazia:before {
  background-image: url("/content/images/flags/abkhazia.svg");
}

.Adygea:before, .adygea:before {
  background-image: url("/content/images/flags/adygea.svg");
}

.Afganistan:before, .afganistan:before {
  background-image: url("/content/images/flags/afganistan.svg");
}

.Ajaria:before, .ajaria:before {
  background-image: url("/content/images/flags/ajaria.svg");
}

.Aland:before, .aland:before {
  background-image: url("/content/images/flags/Aland.svg");
}

.Albania:before, .albania:before {
  background-image: url("/content/images/flags/albania.svg");
}

.Alderney:before, .alderney:before {
  background-image: url("/content/images/flags/alderney.svg");
}

.Algeria:before, .algeria:before {
  background-image: url("/content/images/flags/algeria.svg");
}

.Altai-republic:before, .altai-republic:before {
  background-image: url("/content/images/flags/altai-republic.svg");
}

.American-samoa:before, .american-samoa:before {
  background-image: url("/content/images/flags/american-samoa.svg");
}

.Andorra:before, .andorra:before {
  background-image: url("/content/images/flags/andorra.svg");
}

.Angola:before, .angola:before {
  background-image: url("/content/images/flags/angola.svg");
}

.Anguilla:before, .anguilla:before {
  background-image: url("/content/images/flags/anguilla.svg");
}

.Antarctica:before, .antarctica:before {
  background-image: url("/content/images/flags/antarctica.svg");
}

.Antigua-and-barbuda:before, .antigua-and-barbuda:before {
  background-image: url("/content/images/flags/antigua-and-barbuda.svg");
}

.Argentina:before, .argentina:before {
  background-image: url("/content/images/flags/argentina.svg");
}

.Armenia:before, .armenia:before {
  background-image: url("/content/images/flags/armenia.svg");
}

.Aruba:before, .aruba:before {
  background-image: url("/content/images/flags/aruba.svg");
}

.Australia:before, .australia:before {
  background-image: url("/content/images/flags/australia.svg");
}

.Austria:before, .austria:before {
  background-image: url("/content/images/flags/austria.svg");
}

.Azerbaijan:before, .azerbaijan:before {
  background-image: url("/content/images/flags/azerbaijan.svg");
}

.Bahamas:before, .bahamas:before {
  background-image: url("/content/images/flags/Bahamas.svg");
}

.Bahrain:before, .bahrain:before {
  background-image: url("/content/images/flags/bahrain.svg");
}

.Bangladesh:before, .bangladesh:before {
  background-image: url("/content/images/flags/bangladesh.svg");
}

.Barbados:before, .barbados:before {
  background-image: url("/content/images/flags/barbados.svg");
}

.Bashkortostan:before, .bashkortostan:before {
  background-image: url("/content/images/flags/bashkortostan.svg");
}

.Belarus:before, .belarus:before {
  background-image: url("/content/images/flags/belarus.svg");
}

.Belgium:before, .belgium:before {
  background-image: url("/content/images/flags/belgium.svg");
}

.Belize:before, .belize:before {
  background-image: url("/content/images/flags/belize.svg");
}

.Benin:before, .benin:before {
  background-image: url("/content/images/flags/benin.svg");
}

.Bikini-atol:before, .bikini-atol:before {
  background-image: url("/content/images/flags/bikini-atol.svg");
}

.Bolivia:before, .bolivia:before {
  background-image: url("/content/images/flags/bolivia.svg");
}

.Botswana:before, .botswana:before {
  background-image: url("/content/images/flags/botswana.svg");
}

.Federation-of-boznia-and-herzegovia:before, .federation-of-boznia-and-herzegovia:before {
  background-image: url("/content/images/flags/boznia-and-herzegovia-federation-of.svg");
}

.Boznia-and-herzegovia:before, .boznia-and-herzegovia:before {
  background-image: url("/content/images/flags/boznia-and-herzegovia.svg");
}

.Brazil:before, .brazil:before {
  background-image: url("/content/images/flags/brazil.svg");
}

.British-antartic-territory:before, .british-antartic-territory:before {
  background-image: url("/content/images/flags/british-antartic-territory.svg");
}

.British-indian-ocean-territory:before, .british-indian-ocean-territory:before {
  background-image: url("/content/images/flags/british-indian-ocean-territory.svg");
}

.Brittany:before, .brittany:before {
  background-image: url("/content/images/flags/brittany.svg");
}

.Brunei:before, .brunei:before {
  background-image: url("/content/images/flags/brunei.svg");
}

.Bulgaria:before, .bulgaria:before {
  background-image: url("/content/images/flags/bulgaria.svg");
}

.Burkina-faso:before, .burkina-faso:before {
  background-image: url("/content/images/flags/burkina-faso.svg");
}

.Burmuda:before, .burmuda:before {
  background-image: url("/content/images/flags/burmuda.svg");
}

.Burundi:before, .burundi:before {
  background-image: url("/content/images/flags/burundi.svg");
}

.Buryatia:before, .Buryatia:before {
  background-image: url("/content/images/flags/buryatia.svg");
}

.Butan:before, .butan:before {
  background-image: url("/content/images/flags/butan.svg");
}

.Cambodia:before, .cambodia:before {
  background-image: url("/content/images/flags/cambodia.svg");
}

.Cameroon:before, .cameroon:before {
  background-image: url("/content/images/flags/cameroon.svg");
}

.Canada:before, .canada:before {
  background-image: url("/content/images/flags/canada.svg");
}

.Cape-verde:before, .cape-verde:before {
  background-image: url("/content/images/flags/cape-verde.svg");
}

.Cayman-islands:before, .cayman-islands:before {
  background-image: url("/content/images/flags/cayman-islands.svg");
}

.Central-african-republic:before, .central-african-republic:before {
  background-image: url("/content/images/flags/central-african-republic.svg");
}

.Chad:before, .chad:before {
  background-image: url("/content/images/flags/chad.svg");
}

.Chechan-republic-of-ichkeria:before, .chechan-republic-of-ichkeria:before {
  background-image: url("/content/images/flags/chechan-republic-of-ichkeria.svg");
}

.Chechan-republic:before, .chechan-republic:before {
  background-image: url("/content/images/flags/chechan-republic.svg");
}

.Chile:before, .chile:before {
  background-image: url("/content/images/flags/chile.svg");
}

.China:before, .china:before {
  background-image: url("/content/images/flags/china.svg");
}

.Christmas-island:before, .christmas-island:before {
  background-image: url("/content/images/flags/christmas-island.svg");
}

.Chuvashia:before, .chuvashia:before {
  background-image: url("/content/images/flags/chuvashia.svg");
}

.Comoros:before, .comoros:before {
  background-image: url("/content/images/flags/comoros.svg");
}

.Congo-democratic-republic:before, .congo-democratic-republic:before {
  background-image: url("/content/images/flags/congo-democratic-republic-of-the.svg");
}

.Congo-republic:before, .congo-republic:before {
  background-image: url("/content/images/flags/congo-republic-of-the.svg");
}

.Cook-islands:before, .cook-islands:before {
  background-image: url("/content/images/flags/cook-islands.svg");
}

.Costa-rica:before, .costa-rica:before {
  background-image: url("/content/images/flags/costa-rica.svg");
}

.Cote-d-ivoire:before, .cote-d-ivoire:before {
  background-image: url("/content/images/flags/cote-d-ivoire.svg");
}

.Crimea:before, .crimea:before {
  background-image: url("/content/images/flags/crimea.svg");
}

.Croatia:before, .croatia:before {
  background-image: url("/content/images/flags/croatia.svg");
}

.Cuba:before, .cuba:before {
  background-image: url("/content/images/flags/cuba.svg");
}

.Cyprus:before, .cyprus:before {
  background-image: url("/content/images/flags/cyprus.svg");
}

.Czech-republic:before, .czech-republic:before {
  background-image: url("/content/images/flags/czech-republic.svg");
}

.Dagestan:before, .dagestan:before {
  background-image: url("/content/images/flags/dagestan.svg");
}

.Denmark:before, .denmark:before {
  background-image: url("/content/images/flags/denmark.svg");
}

.Djibouti:before, .djibouti:before {
  background-image: url("/content/images/flags/djibouti.svg");
}

.Dominica:before, .dominica:before {
  background-image: url("/content/images/flags/dominica.svg");
}

.Dominican-republic:before, .dominican-republic:before {
  background-image: url("/content/images/flags/dominican-republic.svg");
}

.East-timor:before, .east-timor:before {
  background-image: url("/content/images/flags/east-timor.svg");
}

.Easter-island-rapa-nui:before, .easter-island-rapa-nui:before {
  background-image: url("/content/images/flags/easter-island-rapa-nui.svg");
}

.Ecuador:before, .ecuador:before {
  background-image: url("/content/images/flags/ecuador.svg");
}

.Egypt:before, .egypt:before {
  background-image: url("/content/images/flags/egypt.svg");
}

.El-salvador:before, .el-salvador:before {
  background-image: url("/content/images/flags/el-salvador.svg");
}

.England:before, .england:before {
  background-image: url("/content/images/flags/england.svg");
}

.Equatorial-guinea:before, .equatorial-guinea:before {
  background-image: url("/content/images/flags/equatorial-guinea.svg");
}

.Eritrea:before, .Eritrea:before {
  background-image: url("/content/images/flags/eritrea.svg");
}

.Estonia:before, .estonia:before {
  background-image: url("/content/images/flags/estonia.svg");
}

.Ethiopia:before, .ethiopia:before {
  background-image: url("/content/images/flags/ethiopia.svg");
}

.European-union:before, .european-union:before {
  background-image: url("/content/images/flags/european-union.svg");
}

.Falkland-islands:before, .falkland-islands:before {
  background-image: url("/content/images/flags/falkland-islands.svg");
}

.Faroe-islands:before, .faroe-islands:before {
  background-image: url("/content/images/flags/faroe-islands.svg");
}

.Fiji:before, .fiji:before {
  background-image: url("/content/images/flags/fiji.svg");
}

.Finland:before, .finland:before {
  background-image: url("/content/images/flags/finland.svg");
}

.France:before, .france:before {
  background-image: url("/content/images/flags/france.svg");
}

.French-polynesia:before, .french-polynesia:before {
  background-image: url("/content/images/flags/french-polynesia.svg");
}

.French-southern-antartic-lands:before, .french-southern-antartic-lands:before {
  background-image: url("/content/images/flags/french-southern-antartic-lands.svg");
}

.Gabon:before, .gabon:before {
  background-image: url("/content/images/flags/gabon.svg");
}

.Gambia:before, .gambia:before {
  background-image: url("/content/images/flags/gambia.svg");
}

.Georgia:before, .georgia:before {
  background-image: url("/content/images/flags/georgia.svg");
}

.Germany:before, .germany:before {
  background-image: url("/content/images/flags/germany.svg");
}

.Ghana:before, .ghana:before {
  background-image: url("/content/images/flags/ghana.svg");
}

.Gibraltar:before, .gibraltar:before {
  background-image: url("/content/images/flags/gibraltar.svg");
}

.Greece:before, .greece:before {
  background-image: url("/content/images/flags/greece.svg");
}

.Greenland:before, .greenland:before {
  background-image: url("/content/images/flags/greenland.svg");
}

.Grenada:before, .grenada:before {
  background-image: url("/content/images/flags/grenada.svg");
}

.Guam:before, .guam:before {
  background-image: url("/content/images/flags/guam.svg");
}

.Guatemala:before, .guatemala:before {
  background-image: url("/content/images/flags/guatemala.svg");
}

.Guernsey:before, .guernsey:before {
  background-image: url("/content/images/flags/guernsey.svg");
}

.Guinea-bissau:before, .guinea-bissau:before {
  background-image: url("/content/images/flags/guinea-bissau.svg");
}

.Guinea:before, .guinea:before {
  background-image: url("/content/images/flags/guinea.svg");
}

.Guyana:before, .guyana:before {
  background-image: url("/content/images/flags/guyana.svg");
}

.Haiti:before, .Haiti:before {
  background-image: url("/content/images/flags/haiti.svg");
}

.Herm:before, .herm:before {
  background-image: url("/content/images/flags/herm.svg");
}

.Honduras:before, .honduras:before {
  background-image: url("/content/images/flags/honduras.svg");
}

.HongKong:before, .Hong.Kong:before, .hong-kong:before {
  background-image: url("/content/images/flags/hongkong.svg");
}

.Hungary:before, .hungary:before {
  background-image: url("/content/images/flags/hungary.svg");
}

.Iceland:before, .iceland:before {
  background-image: url("/content/images/flags/iceland.svg");
}

.India:before, .india:before {
  background-image: url("/content/images/flags/india.svg");
}

.Indonesia:before, .indonesia:before {
  background-image: url("/content/images/flags/indonesia.svg");
}

.Ingusheta:before, .ingusheta:before {
  background-image: url("/content/images/flags/ingusheta.svg");
}

.Iran:before, .iran:before {
  background-image: url("/content/images/flags/iran.svg");
}

.Iraq:before, .iraq:before {
  background-image: url("/content/images/flags/iraq.svg");
}

.Ireland:before, .ireland:before {
  background-image: url("/content/images/flags/ireland.svg");
}

.Isle-of-man:before, .isle-of-man:before {
  background-image: url("/content/images/flags/isle-of-man.svg");
}

.Israel:before, .israel:before {
  background-image: url("/content/images/flags/israel.svg");
}

.Italy:before, .italy:before {
  background-image: url("/content/images/flags/italy.svg");
}

.Jamaica:before, .jamaica:before {
  background-image: url("/content/images/flags/jamaica.svg");
}

.Japan:before, .japan:before {
  background-image: url("/content/images/flags/japan.svg");
}

.Jersey:before, .jersey:before {
  background-image: url("/content/images/flags/jersey.svg");
}

.Jordan:before, .jordan:before {
  background-image: url("/content/images/flags/jordan.svg");
}

.Kalmykia:before, .kalmykia:before {
  background-image: url("/content/images/flags/kalmykia.svg");
}

.Karachay-cherkessia:before, .karachay-cherkessia:before {
  background-image: url("/content/images/flags/karachay-cherkessia.svg");
}

.Karakalpakstan:before, .karakalpakstan:before {
  background-image: url("/content/images/flags/karakalpakstan.svg");
}

.Karbardino-balkaria:before, .karbardino-balkaria:before {
  background-image: url("/content/images/flags/karbardino-balkaria.svg");
}

.Karelia:before, .karelia:before {
  background-image: url("/content/images/flags/karelia.svg");
}

.Kazakhstan:before, .kazakhstan:before {
  background-image: url("/content/images/flags/kazakhstan.svg");
}

.Kenya:before, .Kkenya:before {
  background-image: url("/content/images/flags/kenya.svg");
}

.Kharkassia:before, .kharkassia:before {
  background-image: url("/content/images/flags/kharkassia.svg");
}

.Kirlbati:before, .kirlbati:before {
  background-image: url("/content/images/flags/kirlbati.svg");
}

.Komi:before, .komi:before {
  background-image: url("/content/images/flags/komi.svg");
}

.Korea-north:before, .korea-north:before {
  background-image: url("/content/images/flags/korea-north.svg");
}

.Korea-south:before, .korea-south:before {
  background-image: url("/content/images/flags/korea-south.svg");
}

.Kosovo:before, .kosovo:before {
  background-image: url("/content/images/flags/kosovo.svg");
}

.Kuban-peoples-republic:before, .kuban-peoples-republic:before {
  background-image: url("/content/images/flags/kuban-peoples-republic.svg");
}

.Kuwait:before, .kuwait:before {
  background-image: url("/content/images/flags/kuwait.svg");
}

.Kyrgyzstan:before, .kyrgyzstan:before {
  background-image: url("/content/images/flags/kyrgyzstan.svg");
}

.Ladonia:before, .ladonia:before {
  background-image: url("/content/images/flags/ladonia.svg");
}

.Laos:before, .laos:before {
  background-image: url("/content/images/flags/laos.svg");
}

.Latvia:before, .latvia:before {
  background-image: url("/content/images/flags/latvia.svg");
}

.Lebanon:before, .lebanon:before {
  background-image: url("/content/images/flags/lebanon.svg");
}

.Lesotho:before, .lesotho:before {
  background-image: url("/content/images/flags/lesotho.svg");
}

.Liberia:before, .liberia:before {
  background-image: url("/content/images/flags/liberia.svg");
}

.Libya:before, .libya:before {
  background-image: url("/content/images/flags/libya.svg");
}

.Liechtenstein:before, .liechtenstein:before {
  background-image: url("/content/images/flags/liechtenstein.svg");
}

.Lithuania:before, .lithuania:before {
  background-image: url("/content/images/flags/lithuania.svg");
}

.Los-altos:before, .los-altos:before {
  background-image: url("/content/images/flags/los-altos.svg");
}

.Luxembourg:before, .luxembourg:before {
  background-image: url("/content/images/flags/luxembourg.svg");
}

.Macau:before, .macau:before {
  background-image: url("/content/images/flags/macau.svg");
}

.Macedonia:before, .macedonia:before {
  background-image: url("/content/images/flags/macedonia.svg");
}

.Madagascar:before, .madagascar:before {
  background-image: url("/content/images/flags/madagascar.svg");
}

.Malawi:before, .malawi:before {
  background-image: url("/content/images/flags/malawi.svg");
}

.Malaysia:before, .malaysia:before {
  background-image: url("/content/images/flags/malaysia.svg");
}

.Maldives:before, .maldives:before {
  background-image: url("/content/images/flags/maldives.svg");
}

.Mali:before, .mali:before {
  background-image: url("/content/images/flags/mali.svg");
}

.Malta:before, .malta:before {
  background-image: url("/content/images/flags/malta.svg");
}

.Mari-el:before, .mari-el:before {
  background-image: url("/content/images/flags/mari-el.svg");
}

.Marshall-islands:before, .marshall-islands:before {
  background-image: url("/content/images/flags/marshall-islands.svg");
}

.Mauritania:before {
  background-image: url("/content/images/flags/mauritania.svg");
}

.Mauritius:before, .mauritius:before {
  background-image: url("/content/images/flags/mauritius.svg");
}

.Mexico:before, .mexico:before {
  background-image: url("/content/images/flags/mexico.svg");
}

.Micronesia:before, .micronesia:before {
  background-image: url("/content/images/flags/micronesia-federated-states.svg");
}

.Moldova:before, .moldova:before {
  background-image: url("/content/images/flags/moldova.svg");
}

.Monaco:before, .monaco:before {
  background-image: url("/content/images/flags/monaco.svg");
}

.Mongolia:before, .mongolia:before {
  background-image: url("/content/images/flags/mongolia.svg");
}

.Montenegro:before, .montenegro:before {
  background-image: url("/content/images/flags/montenegro.svg");
}

.Montserrat:before, .montserrat:before {
  background-image: url("/content/images/flags/montserrat.svg");
}

.Mordovia:before, .mordovia:before {
  background-image: url("/content/images/flags/mordovia.svg");
}

.Morocco:before, .morocco:before {
  background-image: url("/content/images/flags/morocco.svg");
}

.Mozambique:before, .mozambique:before {
  background-image: url("/content/images/flags/mozambique.svg");
}

.Myanmar-burma:before, .myanmar-burma:before {
  background-image: url("/content/images/flags/myanmar-burma.svg");
}

.Nagorno-karabakh-republic:before, .nagorno-karabakh-republic:before {
  background-image: url("/content/images/flags/nagorno-karabakh-republic.svg");
}

.Nambia:before, .nambia:before {
  background-image: url("/content/images/flags/nambia.svg");
}

.Nauru:before, .nauru:before {
  background-image: url("/content/images/flags/nauru.svg");
}

.Nepal:before, .nepal:before {
  background-image: url("/content/images/flags/nepal.svg");
}

.Netherlands:before, .netherlands:before {
  background-image: url("/content/images/flags/netherlands.svg");
}

.NZ:before, .nz:before {
  background-image: url("/content/images/flags/new-zealand.svg");
}

.Nicaragua:before, .nicaragua:before {
  background-image: url("/content/images/flags/nicaragua.svg");
}

.Niger:before, .niger:before {
  background-image: url("/content/images/flags/niger.svg");
}

.Nigeria:before, .nigeria:before {
  background-image: url("/content/images/flags/nigeria.svg");
}

.Niue:before, .niue:before {
  background-image: url("/content/images/flags/niue.svg");
}

.Norfolk-island:before, .norfolk-island:before {
  background-image: url("/content/images/flags/norfolk-island.svg");
}

.North-antilles:before, .north-antilles:before {
  background-image: url("/content/images/flags/north-antilles.svg");
}

.North-mariana-islands:before, .north-mariana-islands:before {
  background-image: url("/content/images/flags/north-mariana-islands.svg");
}

.North-ossetia:before, .north-ossetia:before {
  background-image: url("/content/images/flags/north-ossetia.svg");
}

.Norway:before, .norway:before {
  background-image: url("/content/images/flags/norway.svg");
}

.Oman:before, .oman:before {
  background-image: url("/content/images/flags/oman.svg");
}

.Pakistan:before, .pakistan:before {
  background-image: url("/content/images/flags/pakistan.svg");
}

.Palau:before, .palau:before {
  background-image: url("/content/images/flags/palau.svg");
}

.Palestine:before, .palestine:before {
  background-image: url("/content/images/flags/palestine.svg");
}

.Papua-new-guinea:before, .papua-new-guinea:before {
  background-image: url("/content/images/flags/papua-new-guinea.svg");
}

.Paraguay:before, .paraguay:before {
  background-image: url("/content/images/flags/paraguay.svg");
}

.Peru:before, .peru:before {
  background-image: url("/content/images/flags/peru.svg");
}

.Philippines:before, .philippines:before {
  background-image: url("/content/images/flags/philippines.svg");
}

.Pitcaim-isands:before, .pitcaim-isands:before {
  background-image: url("/content/images/flags/pitcaim-isands.svg");
}

.Poland:before, .poland:before {
  background-image: url("/content/images/flags/poland.svg");
}

.Portugal:before, .portugal:before {
  background-image: url("/content/images/flags/portugal.svg");
}

.Puerto-rico:before, .puerto-rico:before {
  background-image: url("/content/images/flags/puerto-rico.svg");
}

.Qatar:before, .qatar:before {
  background-image: url("/content/images/flags/qatar.svg");
}

.Russia:before, .russia:before {
  background-image: url("/content/images/flags/russia.svg");
}

.Rwanda:before, .rwanda:before {
  background-image: url("/content/images/flags/rwanda.svg");
}

.Saba:before, .saba:before {
  background-image: url("/content/images/flags/saba.svg");
}

.Saint-helena:before, .saint-helena:before {
  background-image: url("/content/images/flags/saint-helena.svg");
}

.Saint-kitts-and-nevis:before, .saint-kitts-and-nevis:before {
  background-image: url("/content/images/flags/saint-kitts-and-nevis.svg");
}

.Saint-lucia:before, .saint-lucia:before {
  background-image: url("/content/images/flags/saint-lucia.svg");
}

.Saint-perrie-and-miquelon:before, .saint-perrie-and-miquelon:before {
  background-image: url("/content/images/flags/saint-perrie-and-miquelon.svg");
}

.Saint-vincent-and-the-grenadines:before, .saint-vincent-and-the-grenadines:before {
  background-image: url("/content/images/flags/saint-vincent-and-the-grenadines.svg");
}

.Sakha-republic:before, .sakha-republic:before {
  background-image: url("/content/images/flags/sakha-republic.svg");
}

.Samoa:before, .samoa:before {
  background-image: url("/content/images/flags/samoa.svg");
}

.San-marino:before, .san-marino:before {
  background-image: url("/content/images/flags/san-marino.svg");
}

.Sao-thoem-and-principe:before, .sao-thoem-and-principe:before {
  background-image: url("/content/images/flags/sao-thoem-and-principe.svg");
}

.Sark:before, .sark:before {
  background-image: url("/content/images/flags/sark.svg");
}

.Saudi-arabia:before, .saudi-arabia:before {
  background-image: url("/content/images/flags/saudi-arabia.svg");
}

.Singapore:before, .singapore:before {
  background-image: url("/content/images/flags/singapore.svg");
}

.South-Africa:before, .south-africa:before {
  background-image: url("/content/images/flags/southafrica.svg");
}

.South-Korea:before, .south-korea:before {
  background-image: url("/content/images/flags/southkorea.svg");
}

.Taiwan:before, .taiwan:before {
  background-image: url("/content/images/flags/taiwan.svg");
}

.Thailand:before, .thailand:before {
  background-image: url("/content/images/flags/thailand.svg");
}

.UK:before, .uk:before {
  background-image: url("/content/images/flags/uk.svg");
}

.USA:before, .usa:before {
  background-image: url("/content/images/flags/usa.svg");
}

.Vietnam:before, .vietnam:before {
  background-image: url("/content/images/flags/vietnam.svg");
}

/*! Flip boxes style sheet for Battersea Systems 17/10/2024 */
.flip-container {
  width: 100%;
  height: 400px;
  max-width: 400px;
  position: relative;
  -webkit-perspective: 800px;
  -ms-perspective: 800px;
  perspective: 800px;
  border-radius: 4px;
  margin: 0 auto 25px;
}

.flip-card {
  width: 100%;
  height: 100%;
  position: absolute;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  transition: -webkit-transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  border-radius: 6px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
  cursor: pointer;
}
.flip-card div {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  border-radius: 6px;
  background-color: #ffffff;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  -o-box-pack: center;
  justify-content: center;
  -o-box-align: center;
  align-items: center;
  font: 16px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  color: #666666;
  overflow: hidden;
}
.flip-card div.flip-front {
  background-color: #666666;
  flex-direction: column;
  flex-wrap: nowrap;
}
.flip-card div.flip-front img {
  padding: 0;
  object-fit: cover;
  height: 100%;
  width: 100%;
  max-height: none;
}
.flip-card div.flip-front p {
  display: contents;
}
.flip-container.flipped .flip-card {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}
.flip-card .flip-back {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
  padding: 10px;
  text-align: center;
  overflow-y: auto;
}
.horizontal-flip .flip-card .flip-back {
  -webkit-transform: rotateX(180deg);
  transform: rotateX(180deg);
}
.flip-container.horizontal-flip.flipped .flip-card {
  -webkit-transform: rotateX(180deg);
  transform: rotateX(180deg);
}
.flip-card .flip-front .text-overlay > * {
  padding: 5px 15px 11px;
  margin: 0;
}

.flipped .flip-front .text-overlay {
  display: none !important;
}

.flip-front h3 {
  padding: 1rem;
  font-size: 1.6rem;
  position: absolute;
  width: 100%;
  text-align: center;
  bottom: 0;
  background-color: #666666;
  color: #ffffff;
  font-size: 1.6rem;
}
.flip-front h2 {
  color: #ffffff;
  padding: 1rem;
  font-size: 1.6rem;
  position: absolute;
  width: 100%;
  text-align: center;
  bottom: 0;
  background-color: #666666;
}

/****************************************************************************** New Flip boxes  */
.box {
  width: 100%;
  margin: 0 auto;
  position: relative;
  perspective: 1000px;
  max-width: 400px;
}
.box .front-face {
  transition: all 0.5s ease;
  position: relative;
}
.box .back-face {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  opacity: 0;
  display: flex;
  flex-direction: column;
  transform-style: preserve-3d;
  backface-visibility: hidden;
  background-color: #f7f7f7;
  transform: translateY(110px) rotateX(-90deg);
  transition: all 0.5s ease;
}
.box:not(.iconheader) .front-face {
  background-color: #f7f7f7;
  min-height: 220px;
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.box:not(.iconheader) .front-face img {
  padding: 0;
  max-height: none !important;
}
.box:not(.iconheader) .front-face p {
  margin: 0;
}
.box:not(.iconheader) .front-face h3 {
  position: absolute;
  width: 100%;
  font-size: 1.75rem;
  -webkit-text-shadow: 0 0 19px rgba(0, 0, 0, 0.4);
  -moz-text-shadow: 0 0 19px rgba(0, 0, 0, 0.4);
  text-shadow: 0 0 19px rgba(0, 0, 0, 0.4);
  bottom: 0;
  width: 100%;
  padding: 0.3rem;
  background-color: rgba(0, 0, 0, 0.6);
}
.box:not(.iconheader) .front-face h4 {
  position: absolute;
  width: 100%;
  font-size: 1.5rem;
  -webkit-text-shadow: 0 0 19px rgba(0, 0, 0, 0.4);
  -moz-text-shadow: 0 0 19px rgba(0, 0, 0, 0.4);
  text-shadow: 0 0 19px rgba(0, 0, 0, 0.4);
  bottom: 0;
  width: 100%;
  padding: 0.3rem;
  background-color: rgba(0, 0, 0, 0.6);
}
.box:not(.iconheader) .front-face h5 {
  position: absolute;
  width: 100%;
  font-size: 1.5em;
  text-transform: uppercase;
  padding: 1em 0.5em;
  -webkit-text-shadow: 0 0 19px rgba(0, 0, 0, 0.4);
  -moz-text-shadow: 0 0 19px rgba(0, 0, 0, 0.4);
  text-shadow: 0 0 19px rgba(0, 0, 0, 0.4);
}
.box:not(.iconheader) .front-face h6 {
  position: absolute;
  width: 100%;
  font-size: 1em;
  text-transform: uppercase;
  padding: 1em 0.5em;
  -webkit-text-shadow: 0 0 19px rgba(0, 0, 0, 0.4);
  -moz-text-shadow: 0 0 19px rgba(0, 0, 0, 0.4);
  text-shadow: 0 0 19px rgba(0, 0, 0, 0.4);
}
.box:not(.iconheader) .back-face {
  width: 100%;
  padding: 1em;
  max-height: 320px;
  justify-content: flex-start;
  overflow: auto;
}
.box.iconheader {
  max-width: 325px;
  aspect-ratio: 7/8;
}
.box.iconheader .front-face {
  width: 100%;
  height: 100%;
  align-content: center !important;
  border-radius: 3em;
  box-shadow: 0 1em 2em rgba(0, 0, 0, 0.4);
  padding: 2em 2em 3em !important;
}
.box.iconheader .front-face > * {
  font-size: 1.75em;
}
.box.iconheader .front-face > *:before {
  margin: 0 auto 0.5em;
  width: 4em;
  height: 4em;
}
.box.iconheader .back-face {
  width: 100%;
  height: 100%;
  border-radius: 3em;
  padding: 2em;
}
.box.iconheader .back-face .content {
  overflow: auto;
}

.box:hover .back-face {
  opacity: 1;
  transform: rotateX(0deg);
}

.box:hover .front-face {
  opacity: 0;
  transform: translateY(-110px) rotateX(90deg);
}

/*! Footer style sheet for Battersea Systems 24/7/2021 */
footer {
  margin-top: 0;
  padding-top: 5px;
  border-top: 2px solid #010101;
  bottom: 0;
  width: 100%;
  z-index: 20;
  background: rgba(102, 102, 102, 0.98);
}
html.SuperAdministrator footer {
  color: #ffffff !important;
}
html.Administrator footer {
  color: #ffffff !important;
}
html.HRManager footer {
  color: #ffffff !important;
}
html.SuperAdministrator footer a {
  color: #ffffff !important;
}
html.Administrator footer a {
  color: #ffffff !important;
}
html.HRManager footer a {
  color: #ffffff !important;
}
.admin-login footer a {
  color: #ffffff;
  text-decoration: underline;
  white-space: nowrap;
}
@media only screen and (min-width: 768px) {
  .admin-login footer a {
    color: #ffffff;
    text-decoration: underline;
    display: inline-block;
  }
}
.admin-login footer {
  background-color: rgba(0, 0, 0, 0.3) !important;
}
@media only screen and (max-width: 767px) {
  .admin-login footer {
    background-color: rgba(0, 0, 0, 0.6) !important;
  }
}
@media only screen and (min-width: 768px) {
  .admin-login footer {
    position: fixed;
  }
}
footer > div.row {
  margin-left: 0;
  margin-right: 0;
}
footer .row > div.col-md-12 {
  float: none;
}
@media only screen and (max-width: 767px) {
  footer .pull-right {
    float: none !important;
    text-align: center;
    white-space: normal;
    margin-left: 0;
  }
}
@media only screen and (max-width: 767px) {
  footer .pull-left {
    float: none !important;
    text-align: center;
    white-space: normal;
  }
}
footer div.footer-text {
  text-align: center;
  margin: 0px 0 5px;
  display: block;
  font-size: 0.5em;
}
@media only screen and (min-width: 768px) {
  footer div.footer-text {
    text-align: right;
    display: block;
    vertical-align: middle;
    padding-top: 5px;
  }
}
@media only screen and (min-width: 992px) {
  footer div.footer-text {
    font-size: 0.7em;
  }
}

/* Forms style sheet for Battersea Systems 6/12/2022 */
/**************************** Forms - admin */
.form-group select, .form-group textarea, .form-group input[type=text], .form-group input[type=password], .form-group input[type=datetime], .form-group input[type=datetime-local], .form-group input[type=date], .form-group input[type=month], .form-group input[type=time], .form-group input[type=week], .form-group input[type=number], .form-group input[type=email], .form-group input[type=url], .form-group input[type=search], .form-group input[type=tel], .form-group input[type=color] {
  width: 100%;
}

/**************************** Forms - Controllers */
.form-control {
  -webkit-box-shadow: none;
  box-shadow: none;
}

/**************************** Forms - Div Tables */
.cell-title {
  width: 40%;
}
.cell-check {
  width: 7%;
}
.cell-check .form-group {
  margin: 0;
}
.cell-button {
  width: 9%;
}
.cell-percent {
  width: 7%;
}
.cell-questions {
  width: 7%;
}
.cell-active {
  width: 7%;
}

/**************************** Forms - Dates */
#ui-datepicker-div {
  z-index: 15 !important;
}

/**************************** Forms - Email */
.email-form .help-block {
  margin-bottom: 0px;
}
.email-form .help-block .btn {
  margin-top: 20px;
}

/**************************** Forms - Groups */
.form-group-title {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 5px;
  font-weight: 700;
}
.form-group-title label {
  font-weight: normal;
}
.form-group .disabled label {
  color: #CCCCCC;
}
*:not(.full-screen) .form-group > *:not[type=radio]:not[type=checkbox] {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}
.admin-dashboard .form-group > *:not[type=radio]:not[type=checkbox] {
  margin-left: 0;
  margin-right: 0;
}

.radio.form-group > * {
  display: block;
}

/**************************** Forms - horizontal */
form.form-horizontal {
  padding: 0 20px;
}

.form-horizontal .form-group {
  margin-top: 15px;
}
.form-horizontal .form-group.col-sm-6 {
  padding-right: 30px;
}
.form-horizontal .form-group.col-sm-6:nth-child(even) {
  padding-right: 0;
}
.panel-collapse .form-horizontal .form-group {
  margin-left: 15px;
  margin-right: 15px;
}
.form-horizontal .form-group p {
  margin-top: 0;
  margin-bottom: 0;
}
@media only screen and (min-width: 768px) {
  .form-horizontal .control-label {
    text-align: left;
    padding-top: 0;
  }
}
@media only screen and (min-width: 992px) {
  .form-horizontal .control-label {
    text-align: right;
  }
}

/**************************** Forms - Import */
.import-form input[type=file] {
  display: inline-block;
}

/**************************** Forms - inputs */
.form-inline {
  margin: 20px 15% 10px 0;
}
.form-inline .form-group {
  margin-top: 0px;
}

/**************************** Forms - inputs */
.input-group {
  width: 100%;
}
.input-group-addon {
  width: 30px;
}

input[type=color] {
  padding: 0;
  width: 100%;
}
input[type=number] {
  width: 100%;
}
input[type=radio] {
  margin: 4px 0.3rem 0;
}
input[type=radio] + [type=radio] {
  margin-left: 1rem;
}
input[type=radio] + [type=checkbox] {
  margin-left: 1rem;
}
input[type=checkbox] {
  margin-right: 10px;
}
.checkbox input[type=checkbox] {
  margin-left: -30px;
  margin-top: 5px;
}
.checkbox-inline input[type=checkbox] {
  margin-left: -30px;
  margin-top: 5px;
}

.text-area.editable, textarea {
  display: block;
  width: 100%;
  margin: 10px 0 20px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #999999;
  background-color: #ffffff;
  background-image: none;
  border: 1px solid #999999;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

.text-area.editable {
  height: 400px;
  overflow: auto;
}

.company-structure .form-control {
  padding: 1px 2px;
  font-size: 0.9em;
  height: 2.2em;
}
.company-structure select.form-control {
  padding: 4px 6px;
  height: 2.2em;
}
.company-structure input[type=radio] {
  height: 1.3em;
}
.company-structure input[type=checkbox] {
  height: 1.3em;
}

/**************************** Forms - Labels */
label + small {
  display: block;
}
div[class^=col-md] label {
  display: block;
}
div.col-md-12 label {
  text-align: left;
}
@media only screen and (max-width: 767px) {
  div[class^=col-sm] label.align-right {
    text-align: unset !important;
  }
}
@media only screen and (max-width: 991px) {
  div[class^=col-md] label.align-right {
    text-align: unset !important;
  }
}
.radio label {
  padding-left: 40px;
}
.checkbox label {
  padding-left: 40px;
}

/**************************** Forms - Login */
.loginform input[type=password], .loginform input[type=text] {
  background-color: rgba(255, 255, 255, 0.9);
  text-align: center;
  font-size: 1.4rem;
  height: 2.8rem;
  border-radius: 5px;
  width: 80% !important;
  margin: 0 auto;
  border: 2px solid #ffffff;
  padding: 0;
}
@media only screen and (min-width: 768px) {
  .loginform input[type=password], .loginform input[type=text] {
    font-size: 1.4rem;
    height: 2.6rem;
  }
}
@media only screen and (min-width: 1056px) {
  .loginform input[type=password], .loginform input[type=text] {
    font-size: 2rem;
    height: 3.6rem;
  }
}

.loginform p.small {
  font-size: 1rem;
}
.loginform a {
  color: #ffffff !important;
  font-weight: 700;
}
.loginform a:hover {
  color: #ffffff !important;
  text-decoration: underline;
}
.loginform button {
  background-color: rgba(255, 255, 255, 0.7) !important;
  color: #ffffff;
  text-align: center;
  padding: 0 0 0.2rem;
  line-height: 2.7rem;
  font-size: 1.5rem;
  height: 3rem;
  border: 2px solid #ffffff;
  border-radius: 5px;
  width: 80% !important;
}
@media only screen and (min-width: 768px) {
  .loginform button {
    margin-top: 5px;
    font-size: 1.4rem;
    height: 2.6rem;
    height: 2.3rem;
  }
}
@media only screen and (min-width: 1056px) {
  .loginform button {
    margin-top: 20px;
    font-size: 1.9rem;
    height: 3.5rem;
    line-height: 3.3rem;
  }
}
.loginform button:hover {
  background-color: rgba(255, 255, 255, 0.9) !important;
  color: #ffffff !important;
}

/**************************** Forms - Rows */
form.row {
  border-bottom: 1px solid #f7f7f7;
  margin: 0 10px;
  font-size: 90%;
}
form.row.header-row {
  font-weight: 700;
  border-bottom: 1px solid #CCCCCC;
}
form.row > div {
  vertical-align: middle;
  display: inline-block;
  padding: 0;
}
form.row div[class^=cell] {
  margin-left: 2%;
}
form.row div[class^=cell]:first-of-type {
  margin-left: 0;
}
form.row div[class*=cell] {
  margin-left: 2%;
}
form.row div[class*=cell] *:first-of-type {
  margin-left: 0;
}

/**************************** Forms - Profile item */
.profile-item {
  padding: 15px 0 0 0;
}
.profile-item form {
  padding: 0;
}
.profile-item form .profile-username {
  padding-left: 15px;
}

.profile-item .form-actions {
  margin-bottom: 0;
  border-radius: 0 4px 4px 0;
  padding: 10px 20px;
}

/*! Gaps style sheet for Battersea Systems 21/7/2021 */
.gap-5 {
  height: 0.5rem;
}
.gap-10 {
  height: 1rem;
}
.gap-15 {
  height: 1.5rem;
}
.gap-20 {
  height: 2rem;
}
.gap-25 {
  height: 2.5rem;
}
.gap-30 {
  height: 3rem;
}
.gap-35 {
  height: 3.5rem;
}
.gap-40 {
  height: 4rem;
}
.gap-45 {
  height: 4.5rem;
}
.gap-50 {
  height: 5rem;
}
.gap-55 {
  height: 5.5rem;
}
.gap-60 {
  height: 6rem;
}
.gap-65 {
  height: 6.5rem;
}
.gap-70 {
  height: 7rem;
}
.gap-75 {
  height: 7.5rem;
}
.gap-80 {
  height: 8rem;
}
.gap-85 {
  height: 8.5rem;
}
.gap-90 {
  height: 9rem;
}
.gap-95 {
  height: 6.5rem;
}
.gap-100 {
  height: 10rem;
}

/*! Graphs style sheet for Battersea Systems 5/1/2024 */
.graphs-outer {
  justify-items: center;
}

.graph-outer {
  position: relative;
  display: flex;
  width: 100%;
  padding: 0;
  overflow: hidden;
  background-size: contain;
  background-position: 50%;
  background-repeat: no-repeat;
  background-repeat: no-repeat;
  align-items: center;
  justify-content: center;
}
.graph-outer:before {
  display: block;
  content: "";
  padding-top: 100%;
}
.graph-outer.graph-status {
  background-image: url("/content/images/Status-master.svg");
}
.graph-outer.graph-progress {
  background-image: url("/content/images/Progress-master.svg");
}
.graph-outer.graph-progress .progress-percent {
  font-weight: 800;
  font-size: 1.25em;
  margin-bottom: 0.25em;
  color: #00588A;
}

.graph-title {
  text-align: center;
  margin: 0;
  font-size: 1.3em;
  font-weight: 600;
}

.graph-icon {
  width: 2em;
  height: 2em;
}

/*! Groups style sheet for Battersea Systems 17/8/2021 */
div[class*=-group] .icon {
  background-color: #999999;
  min-height: 10rem;
  min-width: 10rem;
  border-radius: 10px 10px 0 0;
  text-align: center;
  background-repeat: no-repeat;
  background-size: auto 80%;
  background-position: 50%;
  flex: 1;
}
@media only screen and (min-width: 768px) {
  div[class*=-group] .icon {
    min-height: 15rem;
    max-width: 15rem;
    background-color: #999999;
    border-radius: 10px 0 0 10px;
    background-size: 80% auto;
    flex: 1;
  }
}
div[class*=-group] .icon + .copy {
  border-radius: 0 0 10px 10px;
  border: 4px solid #999999;
  border-top: none;
  flex: auto;
}
@media only screen and (min-width: 768px) {
  div[class*=-group] .icon + .copy {
    border-radius: 0 10px 10px 0;
    border-top: 4px solid #999999;
    border-left: none;
    padding: 2rem 2.5rem;
    flex: 5;
    text-align: left;
  }
}

.dont-group, .do-group {
  padding: 1.5rem 2.5rem;
  font-weight: 700;
  margin-bottom: 1rem;
  display: flex !important;
  grid-gap: 0 !important;
}

.do-group .icon {
  background-color: #0a6242 !important;
  background-image: url("https://battersea-power.com/Content/Customer_Apex_Motors/media/sign-do.svg");
}
.do-group .copy {
  border-color: #0a6242 !important;
}

.dont-group .icon {
  background-color: #a94442 !important;
  background-image: url("https://battersea-power.com/Content/Customer_Apex_Motors/media/sign-dont.svg");
}
.dont-group .copy {
  border-color: #a94442 !important;
}

/*! Header style sheet for Battersea Systems 21/7/2021 */
/**************************************************  Header  ************/
/*! Heights style sheet for Battersea Systems 3/11/2021 */
.full-screen *[class*=height-] {
  height: auto !important;
}

div.height-5 {
  height: 5px;
}
div.height-10 {
  height: 10px;
}
div.height-15 {
  height: 15px;
}
div.height-20 {
  height: 20px;
}
div.height-25 {
  height: 25px;
}
div.height-30 {
  height: 30px;
}
div.height-35 {
  height: 35px;
}
div.height-40 {
  height: 40px;
}
div.height-45 {
  height: 45px;
}
div.height-50 {
  height: 50px;
}
div.height-75 {
  height: 75px;
}
div.height-100 {
  height: 100px;
}
div.height-150 {
  height: 150px;
}
div.height-200 {
  height: 200px;
}
div.height-250 {
  height: 250px;
}
div.height-300 {
  height: 300px;
}
div.height-350 {
  height: 350px;
}
div.height-400 {
  height: 400px;
}
div.height-450 {
  height: 450px;
}
div.height-500 {
  height: 500px;
}
div.height-550 {
  height: 550px;
}
div.height-600 {
  height: 600px;
}

.height-auto {
  min-height: auto;
}
.height-25vh {
  min-height: 25vh;
}
.height-50vh {
  min-height: 50vh;
}
.height-75vh {
  min-height: 75vh;
}
.height-100vh {
  min-height: 100vh;
}

.full-height {
  min-height: 100vh;
}

/**************************** Heights - Based on Browser */
@media only screen and (min-width: 768px) {
  .screen-full {
    min-height: 100vh !important;
  }
  .screen-half {
    min-height: 50vh !important;
  }
  .screen-quarter {
    min-height: 25vh !important;
  }
  .screen-threequarters {
    min-height: 75vh !important;
  }
  .screen-5 {
    min-height: 5vh !important;
  }
  .screen-10 {
    min-height: 10vh !important;
  }
  .screen-15 {
    min-height: 15vh !important;
  }
  .screen-20 {
    min-height: 20vh !important;
  }
  .screen-25 {
    min-height: 25vh !important;
  }
  .screen-30 {
    min-height: 30vh !important;
  }
  .screen-35 {
    min-height: 35vh !important;
  }
  .screen-40 {
    min-height: 40vh !important;
  }
  .screen-45 {
    min-height: 45vh !important;
  }
  .screen-50 {
    min-height: 50vh !important;
  }
  .screen-55 {
    min-height: 55vh !important;
  }
  .screen-60 {
    min-height: 60vh !important;
  }
  .screen-65 {
    min-height: 65vh !important;
  }
  .screen-70 {
    min-height: 70vh !important;
  }
  .screen-75 {
    min-height: 75vh !important;
  }
  .screen-80 {
    min-height: 80vh !important;
  }
  .screen-85 {
    min-height: 85vh !important;
  }
  .screen-90 {
    min-height: 90vh !important;
  }
  .screen-95 {
    min-height: 95vh !important;
  }
  .screen-100 {
    min-height: 100vh !important;
  }
}

@media only screen and (min-width: 768px) {
  .image-container.screen-full {
    max-height: 100vh !important;
  }
  .image-container.screen-half {
    max-height: 50vh !important;
  }
  .image-container.screen-quarter {
    max-height: 25vh !important;
  }
  .image-container.screen-threequarters {
    max-height: 75vh !important;
  }
  .image-container.screen-5 {
    max-height: 5vh !important;
  }
  .image-container.screen-10 {
    max-height: 10vh !important;
  }
  .image-container.screen-15 {
    max-height: 15vh !important;
  }
  .image-container.screen-20 {
    max-height: 20vh !important;
  }
  .image-container.screen-25 {
    max-height: 25vh !important;
  }
  .image-container.screen-30 {
    max-height: 30vh !important;
  }
  .image-container.screen-35 {
    max-height: 35vh !important;
  }
  .image-container.screen-40 {
    max-height: 40vh !important;
  }
  .image-container.screen-45 {
    max-height: 45vh !important;
  }
  .image-container.screen-50 {
    max-height: 50vh !important;
  }
  .image-container.screen-55 {
    max-height: 55vh !important;
  }
  .image-container.screen-60 {
    max-height: 60vh !important;
  }
  .image-container.screen-65 {
    max-height: 65vh !important;
  }
  .image-container.screen-70 {
    max-height: 70vh !important;
  }
  .image-container.screen-75 {
    max-height: 75vh !important;
  }
  .image-container.screen-80 {
    max-height: 80vh !important;
  }
  .image-container.screen-85 {
    max-height: 85vh !important;
  }
  .image-container.screen-90 {
    max-height: 90vh !important;
  }
  .image-container.screen-95 {
    max-height: 95vh !important;
  }
  .image-container.screen-100 {
    man-height: 100vh !important;
  }
}

@media only screen and (min-width: 768px) {
  .full-screen {
    min-height: 100vh;
  }
  .half-screen {
    min-height: 50vh;
  }
  .quarter-screen {
    min-height: 25vh;
  }
}
/*! HTML Editor style sheet for Battersea Systems 21/7/2021 */
.cke_contents {
  height: 250px !important;
}

/*! Icons style sheet for Battersea Systems 29/11/2024 */
.filetypes, .glyphicons, .glyphicon {
  vertical-align: initial;
  top: 1px;
  margin-right: 0;
  position: relative;
  width: 1.2em;
}
@media only screen and (min-width: 1056px) {
  .filetypes, .glyphicons, .glyphicon {
    margin-right: 5px;
  }
}
.icon-only .filetypes, .icon-only .glyphicons, .icon-only .glyphicon {
  margin: 0;
}
.btn-icon .filetypes, .btn-icon .glyphicons, .btn-icon .glyphicon {
  margin: 0;
}
.input-group-addon > .filetypes, .input-group-addon > .glyphicons, .input-group-addon > .glyphicon {
  margin-right: 0;
}
.user-menu .filetypes, .user-menu .glyphicons, .user-menu .glyphicon {
  margin-left: 10px;
}
.filetypes + .glyphicon, .glyphicons + .glyphicon, .glyphicon + .glyphicon {
  margin-left: 0.5em;
  margin-right: 0;
}
.filetypes + .glyphicons, .glyphicons + .glyphicons, .glyphicon + .glyphicons {
  margin-left: 0.5em;
  margin-right: 0;
}
.filetypes + .filetypes, .glyphicons + .filetypes, .glyphicon + .filetypes {
  margin-left: 0.5em;
  margin-right: 0;
}

.glyphicon + h3 {
  display: inline-block;
  margin-right: 20px;
}
.glyphicon.disabled {
  opacity: 0.2;
}

a.glyphicon {
  text-decoration: none;
}
a.glyphicon-edit:before {
  font-size: 120%;
}

.glyphicons + h3 {
  display: inline-block;
  margin-right: 20px;
}
.glyphicons.disabled {
  opacity: 0.2;
}

a.glyphicons {
  text-decoration: none;
}
a.glyphicons-edit:before {
  font-size: 120%;
}

.filetypes {
  font-size: 1.3rem;
}

a.filetypes {
  text-decoration: none;
}

a.icon-only, button.icon-only, a.btn-icon, button.btn-icon {
  padding: 3px 0.4rem 5px !important;
  width: 30px;
}

/**************************** Icons - Help me */
.help-me {
  color: #5bc0de;
  font-size: 80%;
  top: -4px;
}

/**************************** Icons - Comments */
.comment-attachment {
  display: inline-block;
  padding-left: 5px;
  vertical-align: top;
}
.comment-attachment > * {
  display: inline-block;
  vertical-align: middle;
}
.comment-attachment * .btn-xs {
  padding: 1px 1px 1px 5px;
  font-size: 10px;
}

/**************************** Icons - Branding */
.icon-reseller:before {
  content: "";
  background-repeat: no-repeat;
  background-size: contain;
  width: 20px;
  background-image: url("/content/Customer_battersea/media/battersea-pagecurl.svg");
  height: 28px;
  vertical-align: top;
}
.icon-battersea:before {
  content: "";
  background-repeat: no-repeat;
  background-size: contain;
  width: 20px;
  height: 20px;
  background-image: url("../images/icons/battersea.svg");
}

/**************************** Icons - Link */
.training-content div[class*=panel_]:before, .training-content div[class^=panel_]:before, .training-content button[class*=panel_]:before, .training-content a[class*=panel_]:before, .training-content a[class^=panel_]:before {
  position: absolute;
  left: 10px;
  top: 8px;
  width: 25px;
  height: 25px;
  line-height: 20px;
  text-align: center;
  border-radius: 15px;
  font-size: 22px;
  font-weight: 700;
}

.training-content .panel-group {
  margin: 5px 0;
  clear: both;
}
@media only screen and (min-width: 768px) {
  .training-content .panel-group {
    margin: 10px;
  }
}
.training-content a[class^=panel_] {
  display: block;
}
.training-content a[class*=panel_] {
  display: block;
}
.training-content button[class*=panel_] {
  display: block;
}
.training-content button[class*=panel_] {
  display: block;
}
.training-content .panel_information:before {
  content: " i";
  color: #446ca9;
  border: 2px solid #446ca9;
}
.training-content .panel_information:before:hover:before {
  color: #ffffff;
  background-color: #446ca9;
}
.training-content .panel_alert:before {
  content: "!";
  color: #a94442;
  border: 2px solid #a94442;
}
.training-content .panel_alert:before:hover:before {
  color: #ffffff;
  background-color: #a94442;
}
.training-content .panel_example:before {
  content: "e";
  color: #628ec5;
  border: 2px solid #628ec5;
  line-height: 16px !important;
  font-size: 22px !important;
}
.training-content .panel_example:before:hover:before {
  color: #ffffff;
  background-color: #628ec5;
}
.training-content .panel_case:before {
  content: "c";
  color: #8a6d3b;
  border: 2px solid #8a6d3b;
  line-height: 16px !important;
  font-size: 22px !important;
}
.training-content .panel_case:before:hover:before {
  color: #ffffff;
  background-color: #8a6d3b;
}
.training-content .panel_add:before {
  content: "+";
  font-family: "Glyphicons Regular";
  color: rgb(17.4444444444, 170.9555555556, 115.1333333333);
  line-height: 22px !important;
  font-size: 15px !important;
}
.training-content .panel_add:before:hover:before {
  color: #0a6242;
}
.training-content .panel_minus:before {
  content: "−";
  font-family: "Glyphicons Regular";
  color: rgb(240.6, 189.4, 105.4);
  line-height: 22px !important;
  font-size: 15px !important;
}
.training-content .panel_minus:before:hover:before {
  color: #EDAD44;
}

/**************************** Icons - list */
.list-counter, .list-arrow, p.qaanswer, .qaanswer, p.qaquestion, .qaquestion, div[class*=icon-list], div[class^=icon-list], p[class*=icon-list], p[class^=icon-list] {
  position: relative;
  border-radius: 5px;
  margin: 20px !important;
  padding: 10px 10px 10px 42px;
  font-weight: bold;
  font-family: inherit;
  display: block;
  text-align: left;
  line-height: 1.4;
}
@media only screen and (min-width: 768px) {
  .list-counter, .list-arrow, p.qaanswer, .qaanswer, p.qaquestion, .qaquestion, div[class*=icon-list], div[class^=icon-list], p[class*=icon-list], p[class^=icon-list] {
    padding: 10px 40px 10px 42px;
  }
}

div[class*=icon-list]:before, div[class^=icon-list]:before, p[class*=icon-list]:before, p[class^=icon-list]:before {
  position: absolute;
  left: 10px;
  top: 10px;
  width: 20px;
  height: 20px;
  line-height: 12px;
  text-align: center;
  border-radius: 10px;
  font-size: 19px;
  color: #ffffff;
  font-weight: normal;
}

.qaquestion:before {
  background-image: url("../images/icons/question-icon.svg");
  background-size: 85%;
}

.qaanswer:before {
  background-image: url("../images/icons/answer-icon.svg");
}

p.icon-list-cross:before, p.icon-list-tick:before, .icon-list-cross:before, .icon-list-tick:before {
  font-family: "Glyphicons Regular";
  font-size: 1.2rem;
}

p.icon-list-example, .icon-list-example {
  color: #628ec5;
  border: 1px solid #628ec5;
}
.icon-list-example:before {
  content: "e";
  color: #ffffff;
  background-color: #628ec5;
  border: 1px solid #628ec5;
}

p.icon-list-case, .icon-list-case {
  color: #8a6d3b;
  border: 1px solid #8a6d3b;
}
.icon-list-case:before {
  content: "c";
  background-color: #8a6d3b;
  border: 1px solid #8a6d3b;
}

p.icon-list-tick, .icon-list-tick {
  color: #0a6242;
  border: 1px solid #0a6242;
}
.icon-list-tick:before {
  top: 14px;
  font-weight: normal;
}

.icon-list-tick:before {
  content: "\e199";
  color: #0a6242;
}

p.icon-list-tick:before {
  content: "\e199";
  color: #0a6242;
}

p.icon-list-cross, .icon-list-cross {
  color: #a94442;
  border: 1px solid #a94442;
}
.icon-list-cross:before {
  top: 14px;
  font-weight: normal;
}

.icon-list-cross:before {
  content: "\e198";
  color: #a94442;
}

p.icon-list-cross:before {
  content: "\e198";
  color: #a94442;
}

.qaanswer:before, .qaquestion:before {
  position: absolute;
  top: 10px;
  left: 6px;
  width: 30px;
  height: 20px;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 77%;
  content: "";
}

p.qaquestion, .qaquestion {
  border: 1px solid #f0c105;
  color: #f0c105;
}
.qaquestion:before {
  background-image: url("../images/icons/question-icon.svg");
}

p.qaanswer, .qaanswer {
  border: 1px solid #0a6242;
  color: #0a6242;
}
.qaanswer:before {
  background-image: url("../images/icons/answer-icon.svg");
  left: 11px;
}

.module-icon {
  width: 100px;
  height: 100px;
  background-size: contain !important;
  margin: 5% auto 0;
  position: relative;
}
@media only screen and (min-width: 768px) {
  .module-icon {
    width: 200px;
    height: 200px;
  }
}

/********************************** General icons ***/
a.icon-alert:before {
  background-image: url("../images/icons/icon-alert-black.svg");
}
.dark a.icon-alert:before {
  background-image: url("../images/icons/icon-alert-white.svg");
}
a.icon-audit:before {
  background-image: url("../images/icons/icon-audit-black.svg");
}
.dark a.icon-audit:before {
  background-image: url("../images/icons/icon-audit-white.svg");
}
a.icon-board:before {
  background-image: url("../images/icons/icon-board-black.svg");
}
.dark a.icon-board:before {
  background-image: url("../images/icons/icon-board-white.svg");
}
a.icon-care:before {
  background-image: url("../images/icons/icon-care-black.svg");
}
.dark a.icon-care:before {
  background-image: url("../images/icons/icon-care-white.svg");
}
a.icon-cart:before {
  background-image: url("../images/icons/icon-cart-black.svg");
}
.dark a.icon-cart:before {
  background-image: url("../images/icons/icon-cart-white.svg");
}
a.icon-cash-register:before {
  background-image: url("../images/icons/icon-cash-register-black.svg");
}
.dark a.icon-cash-register:before {
  background-image: url("../images/icons/icon-cash-register-white.svg");
}
a.icon-chat:before {
  background-image: url("../images/icons/icon-chat-black.svg");
}
.dark a.icon-chat:before {
  background-image: url("../images/icons/icon-chat-white.svg");
}
a.icon-confidential:before {
  background-image: url("../images/icons/icon-confidential-black.svg");
}
.dark a.icon-confidential:before {
  background-image: url("../images/icons/icon-confidential-white.svg");
}
a.icon-cross:before {
  background-image: url("../images/icons/icon-cross-black.svg");
}
.dark a.icon-cross:before {
  background-image: url("../images/icons/icon-cross-white.svg");
}
a.icon-cuffs:before {
  background-image: url("../images/icons/icon-cuffs-black.svg");
}
.dark a.icon-cuffs:before {
  background-image: url("../images/icons/icon-cuffs-white.svg");
}
a.icon-delivery:before {
  background-image: url("../images/icons/icon-delivery-black.svg");
}
.dark a.icon-delivery:before {
  background-image: url("../images/icons/icon-delivery-white.svg");
}
a.icon-disability:before {
  background-image: url("../images/icons/icon-disability-black.svg");
}
.dark a.icon-disability:before {
  background-image: url("../images/icons/icon-disability-white.svg");
}
a.icon-diversity:before {
  background-image: url("../images/icons/icon-diversity-black.svg");
}
.dark a.icon-diversity:before {
  background-image: url("../images/icons/icon-diversity-white.svg");
}
a.icon-document:before {
  background-image: url("../images/icons/icon-document-black.svg");
}
.dark a.icon-document:before {
  background-image: url("../images/icons/icon-document-white.svg");
}
a.icon-email:before {
  background-image: url("../images/icons/icon-email-black.svg");
}
.dark a.icon-email:before {
  background-image: url("../images/icons/icon-email-white.svg");
}
a.icon-exclaim:before {
  background-image: url("../images/icons/icon-alert-black.svg");
}
.dark a.icon-exclaim:before {
  background-image: url("../images/icons/icon-alert-white.svg");
}
a.icon-eye:before {
  background-image: url("../images/icons/icon-eye-black.svg");
}
.dark a.icon-eye:before {
  background-image: url("../images/icons/icon-eye-white.svg");
}
a.icon-guilt:before {
  background-image: url("../images/icons/icon-person-guilt-black.svg");
}
.dark a.icon-guilt:before {
  background-image: url("../images/icons/icon-person-guilt-white.svg");
}
a.icon-handshake:before {
  background-image: url("../images/icons/icon-handshake-black.svg");
}
.dark a.icon-handshake:before {
  background-image: url("../images/icons/icon-handshake-white.svg");
}
a.icon-hack:before {
  background-image: url("../images/icons/icon-hack-black.svg");
}
.dark a.icon-hack:before {
  background-image: url("../images/icons/icon-hack-white.svg");
}
a.icon-harassment:before {
  background-image: url("../images/icons/icon-harassment-black.svg");
}
.dark a.icon-harassment:before {
  background-image: url("../images/icons/icon-harassment-white.svg");
}
a.icon-healthcare:before {
  background-image: url("../images/icons/icon-healthcare-black.svg");
}
.dark a.icon-healthcare:before {
  background-image: url("../images/icons/icon-healthcare-white.svg");
}
a.icon-hear:before {
  background-image: url("../images/icons/icon-hear-black.svg");
}
.dark a.icon-hear:before {
  background-image: url("../images/icons/icon-hear-white.svg");
}
a.icon-idea:before {
  background-image: url("../images/icons/icon-idea-black.svg");
}
.dark a.icon-idea:before {
  background-image: url("../images/icons/icon-idea-white.svg");
}
a.icon-information:before {
  background-image: url("../images/icons/icon-information-black.svg");
}
.dark a.icon-information:before {
  background-image: url("../images/icons/icon-information-white.svg");
}
a.icon-internet:before {
  background-image: url("../images/icons/icon-internet-black.svg");
}
.dark a.icon-internet:before {
  background-image: url("../images/icons/icon-internet-white.svg");
}
a.icon-invisible:before {
  background-image: url("../images/icons/icon-invisible-black.svg");
}
.dark a.icon-invisible:before {
  background-image: url("../images/icons/icon-invisible-white.svg");
}
a.icon-listen:before {
  background-image: url("../images/icons/icon-hear-black.svg");
}
.dark a.icon-listen:before {
  background-image: url("../images/icons/icon-hear-white.svg");
}
a.icon-lock:before {
  background-image: url("../images/icons/icon-lock-black.svg");
}
.dark a.icon-lock:before {
  background-image: url("../images/icons/icon-lock-white.svg");
}
a.icon-magnify:before {
  background-image: url("../images/icons/icon-magnify-glass-black.svg");
}
.dark a.icon-magnify:before {
  background-image: url("../images/icons/icon-magnify-glass-white.svg");
}
a.icon-money:before {
  background-image: url("../images/icons/icon-money-black.svg");
}
.dark a.icon-money:before {
  background-image: url("../images/icons/icon-money-white.svg");
}
a.icon-online-training:before {
  background-image: url("../images/icons/icon-online-training-black.svg");
}
.dark a.icon-online-training:before {
  background-image: url("../images/icons/icon-online-training-white.svg");
}
a.icon-people:before {
  background-image: url("../images/icons/icon-people-black.svg");
}
.dark a.icon-people:before {
  background-image: url("../images/icons/icon-people-white.svg");
}
a.icon-performance:before {
  background-image: url("../images/icons/icon-performance-black.svg");
}
.dark a.icon-performance:before {
  background-image: url("../images/icons/icon-performance-white.svg");
}
a.icon-person-cross:before {
  background-image: url("../images/icons/icon-person-cross-black.svg");
}
.dark a.icon-person-cross:before {
  background-image: url("../images/icons/icon-person-cross-white.svg");
}
a.icon-person-tick:before {
  background-image: url("../images/icons/icon-person-tick-black.svg");
}
.dark a.icon-person-tick:before {
  background-image: url("../images/icons/icon-person-tick-white.svg");
}
a.icon-price:before {
  background-image: url("../images/icons/icon-price-black.svg");
}
.dark a.icon-price:before {
  background-image: url("../images/icons/icon-price-white.svg");
}
a.icon-privacy:before {
  background-image: url("../images/icons/icon-privacy-black.svg");
}
.dark a.icon-privacy:before {
  background-image: url("../images/icons/icon-privacy-white.svg");
}
a.icon-punch:before {
  background-image: url("../images/icons/icon-punch-black.svg");
}
.dark a.icon-punch:before {
  background-image: url("../images/icons/icon-punch-white.svg");
}
a.icon-question:before {
  background-image: url("../images/icons/icon-question-black.svg");
}
.dark a.icon-question:before {
  background-image: url("../images/icons/icon-question-white.svg");
}
a.icon-recycle:before {
  background-image: url("../images/icons/icon-recycle-black.svg");
}
.dark a.icon-recycle:before {
  background-image: url("../images/icons/icon-recycle-white.svg");
}
a.icon-regulator:before {
  background-image: url("../images/icons/icon-regulator-black.svg");
}
.dark a.icon-regulator:before {
  background-image: url("../images/icons/icon-regulator-white.svg");
}
a.icon-secret:before {
  background-image: url("../images/icons/icon-secret-black.svg");
}
.dark a.icon-secret:before {
  background-image: url("../images/icons/icon-secret-white.svg");
}
a.icon-solution:before {
  background-image: url("../images/icons/icon-solution-black.svg");
}
.dark a.icon-solution:before {
  background-image: url("../images/icons/icon-solution-white.svg");
}
a.icon-star:before {
  background-image: url("../images/icons/icon-star-black.svg");
}
.dark a.icon-star:before {
  background-image: url("../images/icons/icon-star-white.svg");
}
a.icon-store:before {
  background-image: url("../images/icons/icon-shop-black.svg");
}
.dark a.icon-store:before {
  background-image: url("../images/icons/icon-shop-white.svg");
}
a.icon-stop:before {
  background-image: url("../images/icons/icon-stop-black.svg");
}
.dark a.icon-stop:before {
  background-image: url("../images/icons/icon-stop-white.svg");
}
a.icon-target:before {
  background-image: url("../images/icons/icon-target-black.svg");
}
.dark a.icon-target:before {
  background-image: url("../images/icons/icon-target-white.svg");
}
a.icon-tick:before {
  background-image: url("../images/icons/icon-tick-black.svg");
}
.dark a.icon-tick:before {
  background-image: url("../images/icons/icon-tick-white.svg");
}
a.icon-target-arrow:before {
  background-image: url("../images/icons/icon-target-arrow-black.svg");
}
.dark a.icon-target-arrow:before {
  background-image: url("../images/icons/icon-target-arrow-white.svg");
}
a.icon-tick-shield:before {
  background-image: url("../images/icons/icon-shield-tick-black.svg");
}
.dark a.icon-tick-shield:before {
  background-image: url("../images/icons/icon-shield-tick-white.svg");
}

/********************************** Icon + Titles **/
.iconheader-box.icon-alert > *:before {
  background-image: url("../images/icons/icon-alert-black.svg");
}
.dark .iconheader-box.icon-alert > *:before {
  background-image: url("../images/icons/icon-alert-white.svg");
}
.iconheader-box.icon-alert.dark > *:before {
  background-image: url("../images/icons/icon-alert-white.svg");
}
.iconheader-box.icon-audit > *:before {
  background-image: url("../images/icons/icon-audit-black.svg");
}
.dark .iconheader-box.icon-audit > *:before {
  background-image: url("../images/icons/icon-audit-white.svg");
}
.iconheader-box.icon-audit.dark > *:before {
  background-image: url("../images/icons/icon-audit-white.svg");
}
.iconheader-box.icon-board > *:before {
  background-image: url("../images/icons/icon-board-black.svg");
}
.dark .iconheader-box.icon-board > *:before {
  background-image: url("../images/icons/icon-board-white.svg");
}
.iconheader-box.icon-board.dark > *:before {
  background-image: url("../images/icons/icon-board-white.svg");
}
.iconheader-box.icon-cash-register > *:before {
  background-image: url("../images/icons/icon-cash-register-black.svg");
}
.dark .iconheader-box.icon-cash-register > *:before {
  background-image: url("../images/icons/icon-cash-register-white.svg");
}
.iconheader-box.icon-cash-register.dark > *:before {
  background-image: url("../images/icons/icon-cash-register-white.svg");
}
.iconheader-box.icon-care > *:before {
  background-image: url("../images/icons/icon-care-black.svg");
}
.dark .iconheader-box.icon-care > *:before {
  background-image: url("../images/icons/icon-care-white.svg");
}
.iconheader-box.icon-care.dark > *:before {
  background-image: url("../images/icons/icon-care-white.svg");
}
.iconheader-box.icon-cart > *:before {
  background-image: url("../images/icons/icon-cart-black.svg");
}
.dark .iconheader-box.icon-cart > *:before {
  background-image: url("../images/icons/icon-cart-white.svg");
}
.iconheader-box.icon-cart.dark > *:before {
  background-image: url("../images/icons/icon-cart-white.svg");
}
.iconheader-box.icon-chat > *:before {
  background-image: url("../images/icons/icon-chat-black.svg");
}
.dark .iconheader-box.icon-chat > *:before {
  background-image: url("../images/icons/icon-chat-white.svg");
}
.iconheader-box.icon-chat.dark > *:before {
  background-image: url("../images/icons/icon-chat-white.svg");
}
.iconheader-box.icon-confidential > *:before {
  background-image: url("../images/icons/icon-confidential-black.svg");
}
.dark .iconheader-box.icon-confidential > *:before {
  background-image: url("../images/icons/icon-confidential-white.svg");
}
.iconheader-box.icon-confidential.dark > *:before {
  background-image: url("../images/icons/icon-confidential-white.svg");
}
.iconheader-box.icon-cross > *:before {
  background-image: url("../images/icons/icon-cross-black.svg");
}
.dark .iconheader-box.icon-cross > *:before {
  background-image: url("../images/icons/icon-cross-white.svg");
}
.iconheader-box.icon-cross.dark > *:before {
  background-image: url("../images/icons/icon-cross-white.svg");
}
.iconheader-box.icon-cuffs > *:before {
  background-image: url("../images/icons/icon-cuffs-black.svg");
}
.dark .iconheader-box.icon-cuffs > *:before {
  background-image: url("../images/icons/icon-cuffs-white.svg");
}
.iconheader-box.icon-cuffs.dark > *:before {
  background-image: url("../images/icons/icon-cuffs-white.svg");
}
.iconheader-box.icon-delivery > *:before {
  background-image: url("../images/icons/icon-delivery-black.svg");
}
.dark .iconheader-box.icon-delivery > *:before {
  background-image: url("../images/icons/icon-delivery-white.svg");
}
.iconheader-box.icon-delivery.dark > *:before {
  background-image: url("../images/icons/icon-delivery-white.svg");
}
.iconheader-box.icon-disability > *:before {
  background-image: url("../images/icons/icon-disability-black.svg");
}
.dark .iconheader-box.icon-disability > *:before {
  background-image: url("../images/icons/icon-disability-white.svg");
}
.iconheader-box.icon-disability.dark > *:before {
  background-image: url("../images/icons/icon-disability-white.svg");
}
.iconheader-box.icon-diversity > *:before {
  background-image: url("../images/icons/icon-diversity-black.svg");
}
.dark .iconheader-box.icon-diversity > *:before {
  background-image: url("../images/icons/icon-diversity-white.svg");
}
.iconheader-box.icon-diversity.dark > *:before {
  background-image: url("../images/icons/icon-diversity-white.svg");
}
.iconheader-box.icon-document > *:before {
  background-image: url("../images/icons/icon-document-black.svg");
}
.dark .iconheader-box.icon-document > *:before {
  background-image: url("../images/icons/icon-document-white.svg");
}
.iconheader-box.icon-document.dark > *:before {
  background-image: url("../images/icons/icon-document-white.svg");
}
.iconheader-box.icon-email > *:before {
  background-image: url("../images/icons/icon-email-black.svg");
}
.dark .iconheader-box.icon-email > *:before {
  background-image: url("../images/icons/icon-email-white.svg");
}
.iconheader-box.icon-email.dark > *:before {
  background-image: url("../images/icons/icon-email-white.svg");
}
.iconheader-box.icon-exclaim > *:before {
  background-image: url("../images/icons/icon-alert-black.svg");
}
.dark .iconheader-box.icon-exclaim > *:before {
  background-image: url("../images/icons/icon-alert-white.svg");
}
.iconheader-box.icon-exclaim.dark > *:before {
  background-image: url("../images/icons/icon-alert-white.svg");
}
.iconheader-box.icon-eye > *:before {
  background-image: url("../images/icons/icon-eye-black.svg");
}
.dark .iconheader-box.icon-eye > *:before {
  background-image: url("../images/icons/icon-eye-white.svg");
}
.iconheader-box.icon-eye.dark > *:before {
  background-image: url("../images/icons/icon-alert-white.svg");
}
.iconheader-box.icon-guilt > *:before {
  background-image: url("../images/icons/icon-person-guilt-black.svg");
}
.dark .iconheader-box.icon-guilt > *:before {
  background-image: url("../images/icons/icon-person-guilt-white.svg");
}
.iconheader-box.icon-guilt.dark > *:before {
  background-image: url("../images/icons/icon-person-guilt-white.svg");
}
.iconheader-box.icon-hack > *:before {
  background-image: url("../images/icons/icon-hack-black.svg");
}
.dark .iconheader-box.icon-hack > *:before {
  background-image: url("../images/icons/icon-hack-white.svg");
}
.iconheader-box.icon-hack.dark > *:before {
  background-image: url("../images/icons/icon-hack-white.svg");
}
.iconheader-box.icon-harassment > *:before {
  background-image: url("../images/icons/icon-harassment-black.svg");
}
.dark .iconheader-box.icon-harassment > *:before {
  background-image: url("../images/icons/icon-harassment-white.svg");
}
.iconheader-box.icon-harassment.dark > *:before {
  background-image: url("../images/icons/icon-harassment-white.svg");
}
.iconheader-box.icon-healthcare > *:before {
  background-image: url("../images/icons/icon-healthcare-black.svg");
}
.dark .iconheader-box.icon-healthcare > *:before {
  background-image: url("../images/icons/icon-healthcare-white.svg");
}
.iconheader-box.icon-healthcare.dark > *:before {
  background-image: url("../images/icons/icon-healthcare-white.svg");
}
.iconheader-box.icon-handshake > *:before {
  background-image: url("../images/icons/icon-handshake-black.svg");
}
.dark .iconheader-box.icon-handshake > *:before {
  background-image: url("../images/icons/icon-handshake-white.svg");
}
.iconheader-box.icon-handshake.dark > *:before {
  background-image: url("../images/icons/icon-handshake-white.svg");
}
.iconheader-box.icon-hear > *:before {
  background-image: url("../images/icons/icon-hear-black.svg");
}
.dark .iconheader-box.icon-hear > *:before {
  background-image: url("../images/icons/icon-hear-white.svg");
}
.iconheader-box.icon-hear.dark > *:before {
  background-image: url("../images/icons/icon-hear-white.svg");
}
.iconheader-box.icon-idea > *:before {
  background-image: url("../images/icons/icon-idea-black.svg");
}
.dark .iconheader-box.icon-idea > *:before {
  background-image: url("../images/icons/icon-idea-white.svg");
}
.iconheader-box.icon-idea.dark > *:before {
  background-image: url("../images/icons/icon-idea-white.svg");
}
.iconheader-box.icon-information > *:before {
  background-image: url("../images/icons/icon-information-black.svg");
}
.dark .iconheader-box.icon-information > *:before {
  background-image: url("../images/icons/icon-information-white.svg");
}
.iconheader-box.icon-information.dark > *:before {
  background-image: url("../images/icons/icon-internet-white.svg");
}
.iconheader-box.icon-internet > *:before {
  background-image: url("../images/icons/icon-internet-black.svg");
}
.dark .iconheader-box.icon-internet > *:before {
  background-image: url("../images/icons/icon-internet-white.svg");
}
.iconheader-box.icon-internet.dark > *:before {
  background-image: url("../images/icons/icon-internet-white.svg");
}
.iconheader-box.icon-invisible > *:before {
  background-image: url("../images/icons/icon-invisible-black.svg");
}
.dark .iconheader-box.icon-invisible > *:before {
  background-image: url("../images/icons/icon-invisible-white.svg");
}
.iconheader-box.icon-invisible.dark > *:before {
  background-image: url("../images/icons/icon-internet-white.svg");
}
.iconheader-box.icon-listen > *:before {
  background-image: url("../images/icons/icon-hear-black.svg");
}
.dark .iconheader-box.icon-listen > *:before {
  background-image: url("../images/icons/icon-hear-white.svg");
}
.iconheader-box.icon-listen.dark > *:before {
  background-image: url("../images/icons/icon-hear-white.svg");
}
.iconheader-box.icon-lock > *:before {
  background-image: url("../images/icons/icon-lock-black.svg");
}
.dark .iconheader-box.icon-lock > *:before {
  background-image: url("../images/icons/icon-lock-white.svg");
}
.iconheader-box.icon-lock.dark > *:before {
  background-image: url("../images/icons/icon-lock-white.svg");
}
.iconheader-box.icon-magnify > *:before {
  background-image: url("../images/icons/icon-magnify-glass-black.svg");
}
.dark .iconheader-box.icon-magnify > *:before {
  background-image: url("../images/icons/icon-magnify-glass-white.svg");
}
.iconheader-box.icon-magnify.dark > *:before {
  background-image: url("../images/icons/icon-magnify-glass-white.svg");
}
.iconheader-box.icon-money > *:before {
  background-image: url("../images/icons/icon-money-black.svg");
}
.dark .iconheader-box.icon-money > *:before {
  background-image: url("../images/icons/icon-money-white.svg");
}
.iconheader-box.icon-money.dark > *:before {
  background-image: url("../images/icons/icon-money-white.svg");
}
.iconheader-box.icon-online-training > *:before {
  background-image: url("../images/icons/icon-online-training-black.svg");
}
.dark .iconheader-box.icon-online-training > *:before {
  background-image: url("../images/icons/icon-online-training-white.svg");
}
.iconheader-box.icon-online-training.dark > *:before {
  background-image: url("../images/icons/icon-online-training-white.svg");
}
.iconheader-box.icon-people > *:before {
  background-image: url("../images/icons/icon-people-black.svg");
}
.dark .iconheader-box.icon-people > *:before {
  background-image: url("../images/icons/icon-people-white.svg");
}
.iconheader-box.icon-people.dark > *:before {
  background-image: url("../images/icons/icon-people-white.svg");
}
.iconheader-box.icon-performance > *:before {
  background-image: url("../images/icons/icon-performance-black.svg");
}
.dark .iconheader-box.icon-performance > *:before {
  background-image: url("../images/icons/icon-performance-white.svg");
}
.iconheader-box.icon-performance.dark > *:before {
  background-image: url("../images/icons/icon-performance-white.svg");
}
.iconheader-box.icon-person-cross > *:before {
  background-image: url("../images/icons/icon-person-cross-black.svg");
}
.dark .iconheader-box.icon-person-cross > *:before {
  background-image: url("../images/icons/icon-person-cross-white.svg");
}
.iconheader-box.icon-person-cross.dark > *:before {
  background-image: url("../images/icons/icon-person-cross-white.svg");
}
.iconheader-box.icon-person-tick > *:before {
  background-image: url("../images/icons/icon-person-tick-black.svg");
}
.dark .iconheader-box.icon-person-tick > *:before {
  background-image: url("../images/icons/icon-person-tick-white.svg");
}
.iconheader-box.icon-person-tick.dark > *:before {
  background-image: url("../images/icons/icon-person-tick-white.svg");
}
.iconheader-box.icon-price > *:before {
  background-image: url("../images/icons/icon-price-black.svg");
}
.dark .iconheader-box.icon-price > *:before {
  background-image: url("../images/icons/icon-price-white.svg");
}
.iconheader-box.icon-price.dark > *:before {
  background-image: url("../images/icons/icon-price-white.svg");
}
.iconheader-box.icon-privacy > *:before {
  background-image: url("../images/icons/icon-privacy-black.svg");
}
.dark .iconheader-box.icon-privacy > *:before {
  background-image: url("../images/icons/icon-privacy-white.svg");
}
.iconheader-box.icon-privacy.dark > *:before {
  background-image: url("../images/icons/icon-privacy-white.svg");
}
.iconheader-box.icon-punch > *:before {
  background-image: url("../images/icons/icon-punch-black.svg");
}
.dark .iconheader-box.icon-punch > *:before {
  background-image: url("../images/icons/icon-punch-white.svg");
}
.iconheader-box.icon-punch.dark > *:before {
  background-image: url("../images/icons/icon-punch-white.svg");
}
.iconheader-box.icon-question > *:before {
  background-image: url("../images/icons/icon-question-black.svg");
}
.dark .iconheader-box.icon-question > *:before {
  background-image: url("../images/icons/icon-question-white.svg");
}
.iconheader-box.icon-question.dark > *:before {
  background-image: url("../images/icons/icon-punch-white.svg");
}
.iconheader-box.icon-regulator > *:before {
  background-image: url("../images/icons/icon-regulator-black.svg");
}
.dark .iconheader-box.icon-regulator > *:before {
  background-image: url("../images/icons/icon-regulator-white.svg");
}
.iconheader-box.icon-regulator.dark > *:before {
  background-image: url("../images/icons/icon-question-white.svg");
}
.iconheader-box.icon-recycle > *:before {
  background-image: url("../images/icons/icon-recycle-black.svg");
}
.dark .iconheader-box.icon-recycle > *:before {
  background-image: url("../images/icons/icon-recycle-white.svg");
}
.iconheader-box.icon-recycle.dark > *:before {
  background-image: url("../images/icons/icon-punch-white.svg");
}
.iconheader-box.icon-secret > *:before {
  background-image: url("../images/icons/icon-secret-black.svg");
}
.dark .iconheader-box.icon-secret > *:before {
  background-image: url("../images/icons/icon-secret-white.svg");
}
.iconheader-box.icon-secret.dark > *:before {
  background-image: url("../images/icons/icon-secret-white.svg");
}
.iconheader-box.icon-solution > *:before {
  background-image: url("../images/icons/icon-solution-black.svg");
}
.dark .iconheader-box.icon-solution > *:before {
  background-image: url("../images/icons/icon-solution-white.svg");
}
.iconheader-box.icon-solution.dark > *:before {
  background-image: url("../images/icons/icon-solution-white.svg");
}
.iconheader-box.icon-star > *:before {
  background-image: url("../images/icons/icon-star-black.svg");
}
.dark .iconheader-box.icon-star > *:before {
  background-image: url("../images/icons/icon-star-white.svg");
}
.iconheader-box.icon-star.dark > *:before {
  background-image: url("../images/icons/icon-star-white.svg");
}
.iconheader-box.icon-store > *:before {
  background-image: url("../images/icons/icon-shop-black.svg");
}
.dark .iconheader-box.icon-store > *:before {
  background-image: url("../images/icons/icon-shop-white.svg");
}
.iconheader-box.icon-store.dark > *:before {
  background-image: url("../images/icons/icon-shop-white.svg");
}
.iconheader-box.icon-stop > *:before {
  background-image: url("../images/icons/icon-stop-black.svg");
}
.dark .iconheader-box.icon-stop > *:before {
  background-image: url("../images/icons/icon-stop-white.svg");
}
.iconheader-box.icon-stop.dark > *:before {
  background-image: url("../images/icons/icon-stop-white.svg");
}
.iconheader-box.icon-target > *:before {
  background-image: url("../images/icons/icon-target-black.svg");
}
.dark .iconheader-box.icon-target > *:before {
  background-image: url("../images/icons/icon-target-white.svg");
}
.iconheader-box.icon-target.dark > *:before {
  background-image: url("../images/icons/icon-target-white.svg");
}
.iconheader-box.icon-tick > *:before {
  background-image: url("../images/icons/icon-tick-black.svg");
}
.dark .iconheader-box.icon-tick > *:before {
  background-image: url("../images/icons/icon-tick-white.svg");
}
.iconheader-box.icon-tick.dark > *:before {
  background-image: url("../images/icons/icon-tick-white.svg");
}
.iconheader-box.icon-target-arrow > *:before {
  background-image: url("../images/icons/icon-target-arrow-black.svg");
}
.dark .iconheader-box.icon-target-arrow > *:before {
  background-image: url("../images/icons/icon-target-arrow-white.svg");
}
.iconheader-box.icon-target-arrow.dark > *:before {
  background-image: url("../images/icons/icon-target-arrow-white.svg");
}
.iconheader-box.icon-tick-shield > *:before {
  background-image: url("../images/icons/icon-shield-tick-black.svg");
}
.dark .iconheader-box.icon-tick-shield > *:before {
  background-image: url("../images/icons/icon-shield-tick-white.svg");
}
.iconheader-box.icon-tick-shield.dark > *:before {
  background-image: url("../images/icons/icon-shield-tick-white.svg");
}

.box.iconheader > .icon-alert > *:before {
  background-image: url("../images/icons/icon-alert-black.svg");
}
.dark .box.iconheader > .icon-alert > *:before {
  background-image: url("../images/icons/icon-alert-white.svg");
}
.box.iconheader > .icon-alert.dark > *:before {
  background-image: url("../images/icons/icon-alert-white.svg");
}
.box.iconheader > .icon-audit > *:before {
  background-image: url("../images/icons/icon-audit-black.svg");
}
.dark .box.iconheader > .icon-audit > *:before {
  background-image: url("../images/icons/icon-audit-white.svg");
}
.box.iconheader > .icon-audit.dark > *:before {
  background-image: url("../images/icons/icon-audit-white.svg");
}
.box.iconheader > .icon-board > *:before {
  background-image: url("../images/icons/icon-board-black.svg");
}
.dark .box.iconheader > .icon-board > *:before {
  background-image: url("../images/icons/icon-board-white.svg");
}
.box.iconheader > .icon-board.dark > *:before {
  background-image: url("../images/icons/icon-board-white.svg");
}
.box.iconheader > .icon-cash-register > *:before {
  background-image: url("../images/icons/icon-cash-register-black.svg");
}
.dark .box.iconheader > .icon-cash-register > *:before {
  background-image: url("../images/icons/icon-cash-register-white.svg");
}
.box.iconheader > .icon-cash-register.dark > *:before {
  background-image: url("../images/icons/icon-cash-register-white.svg");
}
.box.iconheader > .icon-care > *:before {
  background-image: url("../images/icons/icon-care-black.svg");
}
.dark .box.iconheader > .icon-care > *:before {
  background-image: url("../images/icons/icon-care-white.svg");
}
.box.iconheader > .icon-care.dark > *:before {
  background-image: url("../images/icons/icon-care-white.svg");
}
.box.iconheader > .icon-cart > *:before {
  background-image: url("../images/icons/icon-cart-black.svg");
}
.dark .box.iconheader > .icon-cart > *:before {
  background-image: url("../images/icons/icon-cart-white.svg");
}
.box.iconheader > .icon-cart.dark > *:before {
  background-image: url("../images/icons/icon-cart-white.svg");
}
.box.iconheader > .icon-chat > *:before {
  background-image: url("../images/icons/icon-chat-black.svg");
}
.dark .box.iconheader > .icon-chat > *:before {
  background-image: url("../images/icons/icon-chat-white.svg");
}
.box.iconheader > .icon-chat.dark > *:before {
  background-image: url("../images/icons/icon-chat-white.svg");
}
.box.iconheader > .icon-confidential > *:before {
  background-image: url("../images/icons/icon-confidential-black.svg");
}
.dark .box.iconheader > .icon-confidential > *:before {
  background-image: url("../images/icons/icon-confidential-white.svg");
}
.box.iconheader > .icon-confidential.dark > *:before {
  background-image: url("../images/icons/icon-confidential-white.svg");
}
.box.iconheader > .icon-cross > *:before {
  background-image: url("../images/icons/icon-cross-black.svg");
}
.dark .box.iconheader > .icon-cross > *:before {
  background-image: url("../images/icons/icon-cross-white.svg");
}
.box.iconheader > .icon-cross.dark > *:before {
  background-image: url("../images/icons/icon-cross-white.svg");
}
.box.iconheader > .icon-cuffs > *:before {
  background-image: url("../images/icons/icon-cuffs-black.svg");
}
.dark .box.iconheader > .icon-cuffs > *:before {
  background-image: url("../images/icons/icon-cuffs-white.svg");
}
.box.iconheader > .icon-cuffs.dark > *:before {
  background-image: url("../images/icons/icon-cuffs-white.svg");
}
.box.iconheader > .icon-delivery > *:before {
  background-image: url("../images/icons/icon-delivery-black.svg");
}
.dark .box.iconheader > .icon-delivery > *:before {
  background-image: url("../images/icons/icon-delivery-white.svg");
}
.box.iconheader > .icon-delivery.dark > *:before {
  background-image: url("../images/icons/icon-delivery-white.svg");
}
.box.iconheader > .icon-disability > *:before {
  background-image: url("../images/icons/icon-disability-black.svg");
}
.dark .box.iconheader > .icon-disability > *:before {
  background-image: url("../images/icons/icon-disability-white.svg");
}
.box.iconheader > .icon-disability.dark > *:before {
  background-image: url("../images/icons/icon-disability-white.svg");
}
.box.iconheader > .icon-diversity > *:before {
  background-image: url("../images/icons/icon-diversity-black.svg");
}
.dark .box.iconheader > .icon-diversity > *:before {
  background-image: url("../images/icons/icon-diversity-white.svg");
}
.box.iconheader > .icon-diversity.dark > *:before {
  background-image: url("../images/icons/icon-diversity-white.svg");
}
.box.iconheader > .icon-document > *:before {
  background-image: url("../images/icons/icon-document-black.svg");
}
.dark .box.iconheader > .icon-document > *:before {
  background-image: url("../images/icons/icon-document-white.svg");
}
.box.iconheader > .icon-document.dark > *:before {
  background-image: url("../images/icons/icon-document-white.svg");
}
.box.iconheader > .icon-email > *:before {
  background-image: url("../images/icons/icon-email-black.svg");
}
.dark .box.iconheader > .icon-email > *:before {
  background-image: url("../images/icons/icon-email-white.svg");
}
.box.iconheader > .icon-email.dark > *:before {
  background-image: url("../images/icons/icon-email-white.svg");
}
.box.iconheader > .icon-exclaim > *:before {
  background-image: url("../images/icons/icon-alert-black.svg");
}
.dark .box.iconheader > .icon-exclaim > *:before {
  background-image: url("../images/icons/icon-alert-white.svg");
}
.box.iconheader > .icon-exclaim.dark > *:before {
  background-image: url("../images/icons/icon-alert-white.svg");
}
.box.iconheader > .icon-eye > *:before {
  background-image: url("../images/icons/icon-eye-black.svg");
}
.dark .box.iconheader > .icon-eye > *:before {
  background-image: url("../images/icons/icon-eye-white.svg");
}
.box.iconheader > .icon-eye.dark > *:before {
  background-image: url("../images/icons/icon-alert-white.svg");
}
.box.iconheader > .icon-guilt > *:before {
  background-image: url("../images/icons/icon-person-guilt-black.svg");
}
.dark .box.iconheader > .icon-guilt > *:before {
  background-image: url("../images/icons/icon-person-guilt-white.svg");
}
.box.iconheader > .icon-guilt.dark > *:before {
  background-image: url("../images/icons/icon-person-guilt-white.svg");
}
.box.iconheader > .icon-hack > *:before {
  background-image: url("../images/icons/icon-hack-black.svg");
}
.dark .box.iconheader > .icon-hack > *:before {
  background-image: url("../images/icons/icon-hack-white.svg");
}
.box.iconheader > .icon-hack.dark > *:before {
  background-image: url("../images/icons/icon-hack-white.svg");
}
.box.iconheader > .icon-harassment > *:before {
  background-image: url("../images/icons/icon-harassment-black.svg");
}
.dark .box.iconheader > .icon-harassment > *:before {
  background-image: url("../images/icons/icon-harassment-white.svg");
}
.box.iconheader > .icon-harassment.dark > *:before {
  background-image: url("../images/icons/icon-harassment-white.svg");
}
.box.iconheader > .icon-healthcare > *:before {
  background-image: url("../images/icons/icon-healthcare-black.svg");
}
.dark .box.iconheader > .icon-healthcare > *:before {
  background-image: url("../images/icons/icon-healthcare-white.svg");
}
.box.iconheader > .icon-healthcare.dark > *:before {
  background-image: url("../images/icons/icon-healthcare-white.svg");
}
.box.iconheader > .icon-handshake > *:before {
  background-image: url("../images/icons/icon-handshake-black.svg");
}
.dark .box.iconheader > .icon-handshake > *:before {
  background-image: url("../images/icons/icon-handshake-white.svg");
}
.box.iconheader > .icon-handshake.dark > *:before {
  background-image: url("../images/icons/icon-handshake-white.svg");
}
.box.iconheader > .icon-hear > *:before {
  background-image: url("../images/icons/icon-hear-black.svg");
}
.dark .box.iconheader > .icon-hear > *:before {
  background-image: url("../images/icons/icon-hear-white.svg");
}
.box.iconheader > .icon-hear.dark > *:before {
  background-image: url("../images/icons/icon-hear-white.svg");
}
.box.iconheader > .icon-idea > *:before {
  background-image: url("../images/icons/icon-idea-black.svg");
}
.dark .box.iconheader > .icon-idea > *:before {
  background-image: url("../images/icons/icon-idea-white.svg");
}
.box.iconheader > .icon-idea.dark > *:before {
  background-image: url("../images/icons/icon-idea-white.svg");
}
.box.iconheader > .icon-information > *:before {
  background-image: url("../images/icons/icon-information-black.svg");
}
.dark .box.iconheader > .icon-information > *:before {
  background-image: url("../images/icons/icon-information-white.svg");
}
.box.iconheader > .icon-information.dark > *:before {
  background-image: url("../images/icons/icon-idea-white.svg");
}
.box.iconheader > .icon-internet > *:before {
  background-image: url("../images/icons/icon-internet-black.svg");
}
.dark .box.iconheader > .icon-internet > *:before {
  background-image: url("../images/icons/icon-internet-white.svg");
}
.box.iconheader > .icon-internet.dark > *:before {
  background-image: url("../images/icons/icon-internet-white.svg");
}
.box.iconheader > .icon-invisible > *:before {
  background-image: url("../images/icons/icon-invisible-black.svg");
}
.dark .box.iconheader > .icon-invisible > *:before {
  background-image: url("../images/icons/icon-invisible-white.svg");
}
.box.iconheader > .icon-invisible.dark > *:before {
  background-image: url("../images/icons/icon-invisible-white.svg");
}
.box.iconheader > .icon-listen > *:before {
  background-image: url("../images/icons/icon-hear-black.svg");
}
.dark .box.iconheader > .icon-listen > *:before {
  background-image: url("../images/icons/icon-hear-white.svg");
}
.box.iconheader > .icon-listen.dark > *:before {
  background-image: url("../images/icons/icon-hear-white.svg");
}
.box.iconheader > .icon-lock > *:before {
  background-image: url("../images/icons/icon-lock-black.svg");
}
.dark .box.iconheader > .icon-lock > *:before {
  background-image: url("../images/icons/icon-lock-white.svg");
}
.box.iconheader > .icon-lock.dark > *:before {
  background-image: url("../images/icons/icon-lock-white.svg");
}
.box.iconheader > .icon-magnify > *:before {
  background-image: url("../images/icons/icon-magnify-glass-black.svg");
}
.dark .box.iconheader > .icon-magnify > *:before {
  background-image: url("../images/icons/icon-magnify-glass-white.svg");
}
.box.iconheader > .icon-magnify.dark > *:before {
  background-image: url("../images/icons/icon-magnify-glass-white.svg");
}
.box.iconheader > .icon-money > *:before {
  background-image: url("../images/icons/icon-money-black.svg");
}
.dark .box.iconheader > .icon-money > *:before {
  background-image: url("../images/icons/icon-money-white.svg");
}
.box.iconheader > .icon-money.dark > *:before {
  background-image: url("../images/icons/icon-money-white.svg");
}
.box.iconheader > .icon-online-training > *:before {
  background-image: url("../images/icons/icon-online-training-black.svg");
}
.dark .box.iconheader > .icon-online-training > *:before {
  background-image: url("../images/icons/icon-online-training-white.svg");
}
.box.iconheader > .icon-online-training.dark > *:before {
  background-image: url("../images/icons/icon-online-training-white.svg");
}
.box.iconheader > .icon-people > *:before {
  background-image: url("../images/icons/icon-people-black.svg");
}
.dark .box.iconheader > .icon-people > *:before {
  background-image: url("../images/icons/icon-people-white.svg");
}
.box.iconheader > .icon-people.dark > *:before {
  background-image: url("../images/icons/icon-people-white.svg");
}
.box.iconheader > .icon-performance > *:before {
  background-image: url("../images/icons/icon-performance-black.svg");
}
.dark .box.iconheader > .icon-performance > *:before {
  background-image: url("../images/icons/icon-performance-white.svg");
}
.box.iconheader > .icon-performance.dark > *:before {
  background-image: url("../images/icons/icon-performance-white.svg");
}
.box.iconheader > .icon-person-cross > *:before {
  background-image: url("../images/icons/icon-person-cross-black.svg");
}
.dark .box.iconheader > .icon-person-cross > *:before {
  background-image: url("../images/icons/icon-person-cross-white.svg");
}
.box.iconheader > .icon-person-cross.dark > *:before {
  background-image: url("../images/icons/icon-person-cross-white.svg");
}
.box.iconheader > .icon-person-tick > *:before {
  background-image: url("../images/icons/icon-person-tick-black.svg");
}
.dark .box.iconheader > .icon-person-tick > *:before {
  background-image: url("../images/icons/icon-person-tick-white.svg");
}
.box.iconheader > .icon-person-tick.dark > *:before {
  background-image: url("../images/icons/icon-person-tick-white.svg");
}
.box.iconheader > .icon-price > *:before {
  background-image: url("../images/icons/icon-price-black.svg");
}
.dark .box.iconheader > .icon-price > *:before {
  background-image: url("../images/icons/icon-price-white.svg");
}
.box.iconheader > .icon-price.dark > *:before {
  background-image: url("../images/icons/icon-price-white.svg");
}
.box.iconheader > .icon-privacy > *:before {
  background-image: url("../images/icons/icon-privacy-black.svg");
}
.dark .box.iconheader > .icon-privacy > *:before {
  background-image: url("../images/icons/icon-privacy-white.svg");
}
.box.iconheader > .icon-privacy.dark > *:before {
  background-image: url("../images/icons/icon-privacy-white.svg");
}
.box.iconheader > .icon-punch > *:before {
  background-image: url("../images/icons/icon-punch-black.svg");
}
.dark .box.iconheader > .icon-punch > *:before {
  background-image: url("../images/icons/icon-punch-white.svg");
}
.box.iconheader > .icon-punch.dark > *:before {
  background-image: url("../images/icons/icon-punch-white.svg");
}
.box.iconheader > .icon-question > *:before {
  background-image: url("../images/icons/icon-question-black.svg");
}
.dark .box.iconheader > .icon-question > *:before {
  background-image: url("../images/icons/icon-question-white.svg");
}
.box.iconheader > .icon-question.dark > *:before {
  background-image: url("../images/icons/icon-punch-white.svg");
}
.box.iconheader > .icon-regulator:before {
  background-image: url("../images/icons/icon-regulator-black.svg");
}
.dark .box.iconheader > .icon-regulator:before {
  background-image: url("../images/icons/icon-regulator-white.svg");
}
.box.iconheader > .icon-recycle > *:before {
  background-image: url("../images/icons/icon-recycle-black.svg");
}
.dark .box.iconheader > .icon-recycle > *:before {
  background-image: url("../images/icons/icon-recycle-white.svg");
}
.box.iconheader > .icon-recycle.dark > *:before {
  background-image: url("../images/icons/icon-punch-white.svg");
}
.box.iconheader > .icon-secret > *:before {
  background-image: url("../images/icons/icon-secret-black.svg");
}
.dark .box.iconheader > .icon-secret > *:before {
  background-image: url("../images/icons/icon-secret-white.svg");
}
.box.iconheader > .icon-secret.dark > *:before {
  background-image: url("../images/icons/icon-secret-white.svg");
}
.box.iconheader > .icon-solution > *:before {
  background-image: url("../images/icons/icon-solution-black.svg");
}
.dark .box.iconheader > .icon-solution > *:before {
  background-image: url("../images/icons/icon-solution-white.svg");
}
.box.iconheader > .icon-solution.dark > *:before {
  background-image: url("../images/icons/icon-solution-white.svg");
}
.box.iconheader > .icon-star > *:before {
  background-image: url("../images/icons/icon-star-black.svg");
}
.dark .box.iconheader > .icon-star > *:before {
  background-image: url("../images/icons/icon-star-white.svg");
}
.box.iconheader > .icon-star.dark > *:before {
  background-image: url("../images/icons/icon-star-white.svg");
}
.box.iconheader > .icon-store > *:before {
  background-image: url("../images/icons/icon-shop-black.svg");
}
.dark .box.iconheader > .icon-store > *:before {
  background-image: url("../images/icons/icon-shop-white.svg");
}
.box.iconheader > .icon-store.dark > *:before {
  background-image: url("../images/icons/icon-shop-white.svg");
}
.box.iconheader > .icon-stop > *:before {
  background-image: url("../images/icons/icon-stop-black.svg");
}
.dark .box.iconheader > .icon-stop > *:before {
  background-image: url("../images/icons/icon-stop-white.svg");
}
.box.iconheader > .icon-stop.dark > *:before {
  background-image: url("../images/icons/icon-stop-white.svg");
}
.box.iconheader > .icon-target > *:before {
  background-image: url("../images/icons/icon-target-black.svg");
}
.dark .box.iconheader > .icon-target > *:before {
  background-image: url("../images/icons/icon-target-white.svg");
}
.box.iconheader > .icon-target.dark > *:before {
  background-image: url("../images/icons/icon-target-white.svg");
}
.box.iconheader > .icon-tick > *:before {
  background-image: url("../images/icons/icon-tick-black.svg");
}
.dark .box.iconheader > .icon-tick > *:before {
  background-image: url("../images/icons/icon-tick-white.svg");
}
.box.iconheader > .icon-tick.dark > *:before {
  background-image: url("../images/icons/icon-tick-white.svg");
}
.box.iconheader > .icon-target-arrow > *:before {
  background-image: url("../images/icons/icon-target-arrow-black.svg");
}
.dark .box.iconheader > .icon-target-arrow > *:before {
  background-image: url("../images/icons/icon-target-arrow-white.svg");
}
.box.iconheader > .icon-target-arrow.dark > *:before {
  background-image: url("../images/icons/icon-target-arrow-white.svg");
}
.box.iconheader > .icon-tick-shield > *:before {
  background-image: url("../images/icons/icon-shield-tick-black.svg");
}
.dark .box.iconheader > .icon-tick-shield > *:before {
  background-image: url("../images/icons/icon-shield-tick-white.svg");
}
.box.iconheader > .icon-tick-shield.dark > *:before {
  background-image: url("../images/icons/icon-shield-tick-white.svg");
}

/**********************************Text Icon Box **/
.icon-badge:before {
  background-size: 90%;
  background-position: 50%;
  background-repeat: no-repeat;
}
.icon-badge.icon-alert:before {
  background-image: url("../images/icons/icon-alert-infograph.svg");
}
.icon-badge.icon-audit:before {
  background-image: url("../images/icons/icon-audit-infograph.svg");
}
.icon-badge.icon-board:before {
  background-image: url("../images/icons/icon-board-infograph.svg");
}
.icon-badge.icon-cash-register:before {
  background-image: url("../images/icons/icon-cash-register-infograph.svg");
}
.icon-badge.icon-care:before {
  background-image: url("../images/icons/icon-care-infograph.svg");
}
.icon-badge.icon-cart:before {
  background-image: url("../images/icons/icon-cart-infograph.svg");
}
.icon-badge.icon-chat:before {
  background-image: url("../images/icons/icon-chat-infograph.svg");
}
.icon-badge.icon-confidential:before {
  background-image: url("../images/icons/icon-confidential-infograph.svg");
}
.icon-badge.icon-cross:before {
  background-image: url("../images/icons/icon-cross-infograph.svg");
}
.icon-badge.icon-cuffs:before {
  background-image: url("../images/icons/icon-cuffs-infograph.svg");
}
.icon-badge.icon-delivery:before {
  background-image: url("../images/icons/icon-delivery-infograph.svg");
}
.icon-badge.icon-disability:before {
  background-image: url("../images/icons/icon-disability-infograph.svg");
}
.icon-badge.icon-diversity:before {
  background-image: url("../images/icons/icon-diversity-infograph.svg");
}
.icon-badge.icon-document:before {
  background-image: url("../images/icons/icon-document-infograph.svg");
}
.icon-badge.icon-email:before {
  background-image: url("../images/icons/icon-email-infograph.svg");
}
.icon-badge.icon-exclaim:before {
  background-image: url("../images/icons/icon-alert-infograph.svg");
}
.icon-badge.icon-eye:before {
  background-image: url("../images/icons/icon-eye-infograph.svg");
}
.icon-badge.icon-exclaim-cross:before {
  background-image: url("../images/icons/icon-alert-infograph.svg");
}
.icon-badge.icon-guilt:before {
  background-image: url("../images/icons/icon-person-guilt-infograph.svg");
}
.icon-badge.icon-hack:before {
  background-image: url("../images/icons/icon-hack-infograph.svg");
}
.icon-badge.icon-harassment:before {
  background-image: url("../images/icons/icon-harassment-infograph.svg");
}
.icon-badge.icon-healthcare:before {
  background-image: url("../images/icons/icon-healthcare-infograph.svg");
}
.icon-badge.icon-handshake:before {
  background-image: url("../images/icons/icon-handshake-infograph.svg");
}
.icon-badge.icon-hear:before {
  background-image: url("../images/icons/icon-hear-infograph.svg");
}
.icon-badge.icon-idea:before {
  background-image: url("../images/icons/icon-idea-infograph.svg");
}
.icon-badge.icon-information:before {
  background-image: url("../images/icons/icon-information-infograph.svg");
}
.icon-badge.icon-internet:before {
  background-image: url("../images/icons/icon-internet-infograph.svg");
}
.icon-badge.icon-invisible:before {
  background-image: url("../images/icons/icon-invisible-infograph.svg");
}
.icon-badge.icon-listen:before {
  background-image: url("../images/icons/icon-hear-infograph.svg");
}
.icon-badge.icon-lock:before {
  background-image: url("../images/icons/icon-lock-infograph.svg");
}
.icon-badge.icon-magnify:before {
  background-image: url("../images/icons/icon-magnify-glass-infograph.svg");
}
.icon-badge.icon-money:before {
  background-image: url("../images/icons/icon-money-infograph.svg");
}
.icon-badge.icon-online-training:before {
  background-image: url("../images/icons/icon-online-training-infograph.svg");
}
.icon-badge.icon-people:before {
  background-image: url("../images/icons/icon-people-infograph.svg");
}
.icon-badge.icon-performance:before {
  background-image: url("../images/icons/icon-performance-infograph.svg");
}
.icon-badge.icon-person-cross:before {
  background-image: url("../images/icons/icon-person-cross-infograph.svg");
}
.icon-badge.icon-person-tick:before {
  background-image: url("../images/icons/icon-person-tick-infograph.svg");
}
.icon-badge.icon-price:before {
  background-image: url("../images/icons/icon-price-infograph.svg");
}
.icon-badge.icon-privacy:before {
  background-image: url("../images/icons/icon-privacy-infograph.svg");
}
.icon-badge.icon-punch:before {
  background-image: url("../images/icons/icon-punch-infograph.svg");
}
.icon-badge.icon-question:before {
  background-image: url("../images/icons/icon-question-infograph.svg");
}
.icon-badge.icon-recycle:before {
  background-image: url("../images/icons/icon-recycle-infograph.svg");
}
.icon-badge.icon-regulator:before {
  background-image: url("../images/icons/icon-regulator-infograph.svg");
}
.icon-badge.icon-secret:before {
  background-image: url("../images/icons/icon-secret-infograph.svg");
}
.icon-badge.icon-solution:before {
  background-image: url("../images/icons/icon-solution-infograph.svg");
}
.icon-badge.icon-star:before {
  background-image: url("../images/icons/icon-star-infograph.svg");
}
.icon-badge.icon-store:before {
  background-image: url("../images/icons/icon-shop-infograph.svg");
}
.icon-badge.icon-stop:before {
  background-image: url("../images/icons/icon-stop-infograph.svg");
}
.icon-badge.icon-stop-sign:before {
  background-image: url("../images/icons/icon-stop-infograph.svg");
}
.icon-badge.icon-target:before {
  background-image: url("../images/icons/icon-target-infograph.svg");
}
.icon-badge.icon-tick:before {
  background-image: url("../images/icons/icon-tick-infograph.svg");
}
.icon-badge.icon-target-arrow:before {
  background-image: url("../images/icons/icon-target-arrow-infograph.svg");
}
.icon-badge.icon-tick-shield:before {
  background-image: url("../images/icons/icon-shield-tick-infograph.svg");
}

/*! iFrames style sheet for Battersea Systems 14/9/2022 */
.iframe-container {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  overflow: hidden;
}
.iframe-container:before {
  display: block;
  content: "";
  padding-top: 56.25%;
}
.iframe-container.limited-width {
  max-width: 800px !important;
  width: 100%;
}
.iframe-container iframe {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.iframe-container.vimeo-video:before {
  padding-top: 56.25%;
}
.iframe-container.ratio-1by1:before {
  padding-top: 100%;
}
.iframe-container.ratio-4by3:before {
  padding-top: 75%;
}
.iframe-container.ratio-16by9:before {
  padding-top: 56.25%;
}
.iframe-container.ratio-21by9:before {
  padding-top: 42.857143%;
}

.background-video {
  overflow: hidden;
  padding: 0 !important;
}
.background-video .iframe-container {
  width: 100vw;
  height: 100vh;
}
.background-video .iframe-container iframe {
  top: 50%;
  left: 50%;
  width: 100vw;
  height: 100vh;
  transform: translate(-50%, -50%);
}
@media only screen and (min-aspect-ratio: 16/9) {
  .background-video .iframe-container iframe {
    height: 56.25vw;
  }
}
@media only screen and (max-aspect-ratio: 16/9) {
  .background-video .iframe-container iframe {
    width: 177.78vh;
  }
}

/*! Images style sheet for Battersea Systems 09/8/20245 */
p img {
  padding: 5px 0 20px;
  max-width: 100%;
}
@media only screen and (min-width: 768px) {
  p img {
    padding: 5px 20px 20px;
  }
}
.no-padding p img {
  padding: 0 !important;
}
.no-max-width p img {
  max-width: none;
}

.testing img {
  max-width: 100%;
  max-height: 600px;
}

.results-question-summary img {
  max-width: 100%;
  max-height: 600px;
}

.training-content .full-image-height img {
  max-height: none !important;
}

/**************************** Captions */
.figcaption {
  margin-top: 5px;
  font-size: 0.8rem;
  border-bottom: 1px solid #f7f7f7;
}

/**************************** Image Columns */
.image-column {
  padding: 0 !important;
  margin: 0 auto !important;
}
.image-column p {
  margin: 0;
}
.image-column p img {
  padding: 0;
}
.image-column.full-size p img {
  max-height: none !important;
}

/**************************** Image Containers */
.image-then-text {
  margin-bottom: 1em;
  border-top: 1px solid #CCCCCC;
  border-bottom: 1px solid #CCCCCC;
}

.image-container, .column-image {
  position: relative;
}
@media only screen and (min-width: 768px) {
  .image-container, .column-image {
    overflow: hidden;
    min-height: 350px;
  }
}
@media only screen and (min-width: 768px) {
  .image-then-text .image-container, .image-then-text .column-image {
    min-height: 0;
  }
}
.image-container:before, .column-image:before {
  content: "";
  display: block;
  position: absolute;
}
.image-container > p, .column-image > p {
  margin: 0;
  padding: 0;
}
.image-container *.Caption, .column-image *.Caption {
  /*margin: 0.5em;*/
}
.image-container *.caption, .column-image *.caption {
  /*margin: 0.5em;*/
}

@media only screen and (min-width: 768px) {
  .image-container img {
    position: absolute !important;
    top: 50%;
    left: 50%;
    max-height: 100% !important;
    transform: translate(-50%, -50%) !important;
    padding: 0 !important;
    object-fit: cover !important;
  }
}
@media only screen and (min-width: 768px) {
  .image-container.portrait img {
    width: 100%;
    height: 100% !important;
  }
}
.image-container:not(.overlay).ratio-1by1:before {
  aspect-ratio: 1/1;
}
.image-container:not(.overlay).ratio-3by1:before {
  aspect-ratio: 3/1;
}
.image-container:not(.overlay).ratio-2by1:before {
  aspect-ratio: 2/1;
}
.image-container:not(.overlay).ratio-4by3:before {
  aspect-ratio: 4/3;
}
.image-container:not(.overlay).ratio-3by4:before {
  aspect-ratio: 3/4;
}
.image-container:not(.overlay).ratio-16by9:before {
  aspect-ratio: 16/9;
}
.image-container:not(.overlay).ratio-21by9:before {
  aspect-ratio: 21/9;
}
.image-container.square {
  min-height: 0;
  padding: 0;
}
.image-container.square:before {
  padding-top: 100%;
}
.image-container.square p {
  margin: 0;
  padding: 0;
}
.image-container p img {
  padding: 0;
}
@media only screen and (max-width: 767px) {
  .image-container img {
    position: static;
    transform: translate(0, 0);
  }
}

@media only screen and (min-width: 768px) {
  *[class*=screen-].image-container:before {
    padding-top: 0 !important;
  }
}

.back-image > p.caption, .back-image > p.Caption, .column-image *.Caption, .column-image *.caption, .image-container *.Caption, .image-container *.caption {
  position: absolute;
  width: 100%;
  padding: 1rem;
  background-color: rgba(255, 255, 255, 0.7);
  bottom: 0;
  left: 0;
  margin-bottom: 0;
  text-align: center;
}

.row > *.image-container {
  align-self: unset;
  padding: 0;
}
.row > *.image-container.square *.Caption {
  margin: 0;
}
.row > *.image-container img {
  height: 100% !important;
  max-height: none !important;
}

@media only screen and (max-width: 679px) {
  .img-box > img {
    height: auto !important;
    max-width: 100% !important;
  }
}
@media only screen and (min-width: 680px) {
  .img-box > img {
    max-height: 280px !important;
    width: auto !important;
  }
}

.centre-image.img-big {
  max-width: 1000px !important;
}

.image-full-height img, .image-full-height p img {
  max-height: none !important;
  padding: 0;
}

/****************************************************************************** Images - Background */
.background-container {
  position: absolute;
  z-index: 0;
}
.background-container + * {
  z-index: 1;
}

.back-image {
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .back-image:not(.text-banner) {
    min-height: 15vh;
  }
}
.back-image:not(.overlay):before {
  content: "";
  display: block;
}
.back-image:not(.overlay).ratio-1by1:before {
  aspect-ratio: 1/1;
}
.back-image:not(.overlay).ratio-3by1:before {
  aspect-ratio: 3/1;
}
.back-image:not(.overlay).ratio-2by1:before {
  aspect-ratio: 2/1;
}
.back-image:not(.overlay).ratio-4by3:before {
  aspect-ratio: 4/3;
}
.back-image:not(.overlay).ratio-3by4:before {
  aspect-ratio: 3/4;
}
.back-image:not(.overlay).ratio-16by9:before {
  aspect-ratio: 16/9;
}
.back-image:not(.overlay).ratio-21by9:before {
  aspect-ratio: 21/9;
}

.image-cover {
  background-size: cover !important;
}

.image-contain {
  background-size: contain !important;
}

.image-top-left {
  background-position: 0 0 !important;
}

.image-top {
  background-position: 50% 0 !important;
}

.image-top-right {
  background-position: 100% 0 !important;
}

.image-left {
  background-position: 0 50% !important;
}

.image-centre {
  background-position: 50% 50% !important;
}

.image-right {
  background-position: 100% 50% !important;
}

.image-bottom-left {
  background-position: 0% 100% !important;
}

.image-bottom {
  background-position: 50% 100% !important;
}

.image-bottom-right {
  background-position: 100% 100% !important;
}

@media only screen and (min-width: 768px) {
  *[class*=screen-].back-image:before {
    padding-top: 0 !important;
  }
}

/**************************** Image Positioning */
.pull-left > img, .pull-right > img, img.pull-left, img.pull-right {
  box-shadow: rgba(0, 0, 0, 0.3) 0 0 6px 0;
  padding: 0;
}

nav .pull-left > img, nav .pull-right > img, nav img.pull-left, nav img.pull-right {
  box-shadow: none;
}

@media only screen and (min-width: 768px) {
  img.center-me, img.centre-me {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}

/*! Interaction style sheet for Battersea Systems 3/8/2022 */
.result-container, .choice-container {
  min-height: 8em;
  position: relative;
  min-width: 250px;
  padding: 0.5rem 1rem;
  margin: 0;
}

/****************************************************************************** Choice Containers */
.choice-container {
  border: 1px solid #3363AF;
  border-radius: 0 0 0.5rem 0.5rem;
}
.choice-container.drag-item:hover {
  border-colour: #999999;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
}
.choice-container.container-row:before {
  display: none;
}
.choice-container.container-row:after {
  display: none;
}
.choice-container.container-row > * {
  max-width: 300px;
}
.choice-container.row:before {
  display: none;
}
.choice-container.row:after {
  display: none;
}

.container-row.choice-container {
  margin: 0 1.5em;
}
.container-row.choice-container.graphic-grid {
  display: flex;
  flex: 1 1 100px;
  flex-wrap: wrap;
  justify-content: center;
  grid-gap: 0.5rem;
}
.container-row.result-container {
  margin: 0 1.5em;
}

/****************************************************************************** Chosen Answers */
.chosen-answers {
  background-color: rgba(255, 255, 255, 0.7);
  padding: 0.5em 1em;
  border-radius: 0.3em;
  border: 1px solid #010101;
  font-weight: 600;
  font-size: 1.3rem;
  margin: 3px 0;
}
.chosen-answers:before {
  border-radius: 0.3em;
}

/****************************************************************************** Selection Containers */
.selection-container {
  padding: 0.5rem 1.5rem;
  border: 1px solid #B4BBC9;
  border-top: none;
  border-radius: 0 0 0.5em 0.5em;
}
.selection-container:before {
  border-radius: 0 0 0.5em 0.5em;
}

/****************************************************************************** Result Containers */
.result-container {
  border: 1px solid #B4BBC9;
  border-radius: 0.5em;
}
.result-container:before {
  border-radius: 0.5em;
}
.result-container .drag-item {
  background-color: rgba(255, 255, 255, 0.9);
  padding: 0.2em 1em 0.4rem 2em !important;
  font-size: 1.2em;
  margin: 0.25em 0 0.25em;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1) 0;
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1) 0;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1) 0;
}
.result-container .drag-item:before {
  display: none;
}
.result-container .drag-item.image {
  position: relative;
  overflow: hidden;
  min-height: 350px;
  width: 100%;
  height: 100%;
  background: transparent;
  box-shadow: none;
  margin: 0 auto;
  padding: 0 !important;
  border: none;
}
.result-container .drag-item.image img {
  position: absolute;
  top: 50%;
  left: 50%;
  max-height: 100%;
  transform: translate(-50%, -50%);
  padding: 0;
  object-fit: cover;
  width: 100%;
  height: 100%;
  border-radius: 0.5rem;
}
.result-container .drag-item.graphic {
  padding: 0.4rem !important;
}
.result-container.back-image {
  padding: 0;
}
.result-container.back-image > p:first-child {
  display: none;
}
.result-container.back-image > *:not(.drag-item) {
  position: absolute;
  width: calc(100% - 2rem);
  background: rgba(255, 255, 255, 0.9);
  padding: 0.5rem 1rem;
  text-align: center;
  margin: 0;
  border-radius: 0.3em;
  z-index: 5;
  bottom: 1rem;
  left: 1rem;
}
.result-container.back-image > *.drag-item.back-image {
  position: absolute;
}
.result-container.back-image *:not(div).drag-item {
  margin: 0.25em 1em 0.25em;
}

.container-row.result-container.graphic-grid {
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  grid-gap: 0.5rem;
  flex-direction: initial;
  display: flex;
  align-content: center;
  justify-content: center;
  align-self: auto;
}
.container-row.result-container:before {
  border-radius: 0.3em;
}
.container-row.image-grid {
  grid-template-columns: repeat(auto-fit, minmax(182px, 1fr));
  grid-gap: 0.5rem;
  justify-items: center;
}
.container-row.image-grid > *.people-pool {
  max-width: 200px;
  max-height: 200px;
}
.full-screen .container-row.image-grid {
  grid-template-columns: repeat(auto-fit, minmax(182px, 1fr));
}

/****************************************************************************** Result Item */
.result-item {
  background-color: #CCCCCC;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1) 0;
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1) 0;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1) 0;
}
.result-item > * {
  padding: 0.4rem 1rem;
  font-size: 1.2rem;
  margin: 0;
}

/****************************************************************************** Save Result */
.full-screen .save-result {
  display: none;
}

/* Jumbotron style sheet for Battersea Systems 26/7/2021 */
.jumbotron {
  padding-left: 30px;
  padding-right: 30px;
  border-radius: 30px;
  margin: 0.3rem 1rem 2rem;
}
.jumbotron h2 {
  font-weight: 200;
  text-transform: uppercase;
  font-size: 1.6rem;
  margin-top: 0;
}
.jumbotron p {
  font-size: 1.3rem !important;
}
.jumbotron .modal-content h2 {
  font-weight: 700;
  text-transform: uppercase;
  font-size: 140%;
  margin-top: 0;
}
.jumbotron .modal-content p {
  font-size: 100%;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .report.report-generation .jumbotron {
    padding-top: 25px;
    padding-bottom: 25px;
  }
}
.report.report-generation .jumbotron p {
  margin-bottom: 5px;
  font-size: 15px;
  font-weight: 200;
}

/*! Labels style sheet for Battersea Systems 15/11/2021 */
span[class*=label-], div[class*=label], div[class^=label], p[class*=label], p[class^=label] {
  display: inline !important;
  padding: 0.2em 0.6em 0 0;
  font-weight: 600;
  color: #ffffff;
  text-align: left;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: 0.25em;
  font-family: inherit;
  line-height: inherit;
  font-size: 0.9rem;
  margin: 0 2px;
}
.dark-skin span[class*=label-], .dark-skin div[class*=label], .dark-skin div[class^=label], .dark-skin p[class*=label], .dark-skin p[class^=label] {
  color: #ffffff !important;
}
.dark span[class*=label-], .dark div[class*=label], .dark div[class^=label], .dark p[class*=label], .dark p[class^=label] {
  color: #ffffff !important;
}
.col-xs-12 span[class*=label-]:not(.ng-scope), .col-xs-12 div[class*=label]:not(.ng-scope), .col-xs-12 div[class^=label]:not(.ng-scope), .col-xs-12 p[class*=label]:not(.ng-scope), .col-xs-12 p[class^=label]:not(.ng-scope) {
  text-align: right;
}
.col-sm-12 span[class*=label-]:not(.ng-scope), .col-sm-12 div[class*=label]:not(.ng-scope), .col-sm-12 div[class^=label]:not(.ng-scope), .col-sm-12 p[class*=label]:not(.ng-scope), .col-sm-12 p[class^=label]:not(.ng-scope) {
  text-align: right;
}
span.ng-scope[class*=label-], div.ng-scope[class*=label], div.ng-scope[class^=label], p.ng-scope[class*=label], p.ng-scope[class^=label] {
  text-align: center;
}

.module.module-testing .table-responsive p[class^=label] {
  margin: 5px 25%;
  display: inline-block !important;
  width: 50%;
}
.module.module-testing .table-responsive p[class*=label] {
  margin: 5px 25%;
  display: inline-block !important;
  width: 50%;
}

span[class*=label-] {
  padding: 3px 10px 3px;
  border-radius: 4px;
  margin: 0 5px;
}

.label {
  height: auto;
  font-size: 0.8rem;
}
.widget-box.section-assign .label {
  color: #ffffff;
  display: block;
  line-height: 1.5em;
}
.label-info {
  background-color: #446ca9 !important;
}
.label-danger {
  cbackground-olor: #a94442 !important;
}
.label-fail {
  background-color: #a94442 !important;
  background-color: #ffffff;
}

/**************************** Labels - Tickets */
.Ticket-list .label {
  width: 100%;
  display: block;
  padding-top: 0.3em;
  border-radius: 10px;
  line-height: 1.1em;
}
.Ticket-list .label-danger {
  border: 1px solid rgb(135.2, 54.4, 52.8);
  background-color: #a94442 !important;
}
.Ticket-list .label-warning {
  background-color: #EDAD44 !important;
  border: 1px solid #CCCCCC;
}
.Ticket-list .label-info {
  background-color: #446ca9 !important;
  border: 1px solid #CCCCCC;
}
.Ticket-list .label-default {
  background-color: #628ec5 !important;
  border: 1px solid #CCCCCC;
  color: #666666;
}

/*! Layouts style sheet for Battersea Systems 12/10/2023 */
/******************************** Layout - Container row ************/
.container-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  grid-gap: 0.5rem;
}
.full-screen .container-row {
  grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
}
@media only screen and (min-width: 768px) {
  .full-screen .container-row {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  }
}
@media only screen and (min-width: 768px) {
  .container-row {
    grid-gap: 2rem;
  }
}
.container-row > * {
  -ms-flex: 1 0 170px;
  Flex: 1 0 170px;
  margin: 0 10px 20px;
  display: flex;
  align-self: stretch;
  flex-direction: column;
}
@media only screen and (max-width: 767px) {
  .container-row > * {
    margin: 0 0 20px;
  }
}
@media only screen and (min-width: 768px) {
  .container-row > * {
    margin: 0;
  }
}
@media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {
  .container-row > * {
    /*display: grid;*/
  }
}

/******************************** Layout - Containers ************/
.container {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}
@media only screen and (max-width: 429px) {
  section > .container {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media only screen and (min-width: 768px) {
  .container {
    max-width: 768px;
  }
}
@media only screen and (min-width: 992px) {
  .container {
    max-width: 992px;
  }
}
@media only screen and (min-width: 1056px) {
  .container {
    max-width: 1056px;
  }
}
@media only screen and (min-width: 1140px) {
  .container {
    max-width: 1140px;
  }
}
.container-row.indent {
  margin: 0 2rem;
  width: calc(100% - 4rem);
}
@media only screen and (max-width: 429px) {
  section > .container-row {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.container-fluid {
  padding: 0;
}

/******************************** Layout - Columns ************/
.columns-1-1 {
  grid-template-columns: 1fr !important;
}

.columns-1-2 {
  grid-template-columns: 1fr !important;
}

.columns-2-1 {
  grid-template-columns: 1fr !important;
}

.columns-2-3 {
  grid-template-columns: 1fr !important;
}

.columns-1-3 {
  grid-template-columns: 1fr !important;
}

.columns-3-1 {
  grid-template-columns: 1fr !important;
}

.columns-3-2 {
  grid-template-columns: 1fr !important;
}

.columns-1-4 {
  grid-template-columns: 1fr !important;
}

.columns-4-1 {
  grid-template-columns: 1fr !important;
}

.columns-4 {
  grid-template-columns: 1fr !important;
}

.columns-6 {
  grid-template-columns: 1fr !important;
}

.columns-1-1-1 {
  grid-template-columns: 1fr !important;
}

.columns-3 {
  grid-template-columns: 1fr !important;
}

.columns-4 {
  grid-template-columns: 1fr !important;
}

.columns-6 {
  grid-template-columns: 1fr !important;
}

@media only screen and (min-width: 430px) {
  .columns-6 {
    grid-template-columns: 1fr 1fr !important;
  }
}
@media only screen and (min-width: 570px) {
  .columns-4 {
    grid-template-columns: 1fr 1fr !important;
  }
  .columns-4 > * {
    min-width: 150px;
  }
  .columns-6 {
    grid-template-columns: 1fr 1fr 1fr !important;
  }
}
@media only screen and (min-width: 768px) {
  .columns-1-1 {
    grid-template-columns: 1fr 1fr !important;
  }
  .columns-1-2 {
    grid-template-columns: 1fr 2fr !important;
  }
  .columns-2-1 {
    grid-template-columns: 2fr 1fr !important;
  }
  .columns-2-3 {
    grid-template-columns: 2fr 3fr !important;
  }
  .columns-3-2 {
    grid-template-columns: 3fr 2fr !important;
  }
  .columns-1-3 {
    grid-template-columns: 1fr 3fr !important;
  }
  .columns-3-1 {
    grid-template-columns: 3fr 1fr !important;
  }
  .columns-1-4 {
    grid-template-columns: 1fr 4fr !important;
  }
  .columns-4-1 {
    grid-template-columns: 4fr 1fr !important;
  }
  .columns-4 {
    grid-template-columns: 1fr 1fr !important;
  }
  .columns-6 {
    grid-template-columns: 1fr 1fr 1fr !important;
  }
  .columns-1-1-1 {
    grid-template-columns: 1fr 1fr 1fr !important;
  }
  .columns-3 {
    grid-template-columns: 1fr 1fr 1fr !important;
  }
}
@media only screen and (min-width: 992px) {
  .columns-4 {
    grid-template-columns: 1fr 1fr 1fr 1fr !important;
  }
  .columns-4 > * {
    min-width: 150px;
  }
  .columns-6 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr !important;
  }
}
@media only screen and (max-width: 767px) {
  .columns-1-1 .swap-me-mobile {
    order: 2;
  }
  .columns-2-1 .swap-me-mobile {
    order: 2;
  }
  .columns-1-2 .swap-me-mobile {
    order: 2;
  }
  .columns-2-3 .swap-me-mobile {
    order: 2;
  }
  .columns-1-3 .swap-me-mobile {
    order: 2;
  }
  .columns-3-1 .swap-me-mobile {
    order: 2;
  }
  .columns-3-2 .swap-me-mobile {
    order: 2;
  }
  .columns-1-4 .swap-me-mobile {
    order: 2;
  }
  .columns-4-1 .swap-me-mobile {
    order: 2;
  }
  .container-row .swap-me-mobile {
    order: 2;
  }
}

/******************************** Layout - Grid - Gaps ************/
.grid-gap-1px {
  grid-gap: 1px !important;
}
@media only screen and (min-width: 570px) {
  .grid-gap-5 {
    grid-gap: 0.5rem !important;
  }
  .grid-gap-10 {
    grid-gap: 1rem !important;
  }
  .grid-gap-20 {
    grid-gap: 2rem !important;
  }
  .grid-gap-30 {
    grid-gap: 3rem !important;
  }
  .grid-gap-40 {
    grid-gap: 4rem !important;
  }
  .grid-gap-50 {
    grid-gap: 5rem !important;
  }
  .grid-gap-60 {
    grid-gap: 6rem !important;
  }
  .grid-gap-70 {
    grid-gap: 7rem !important;
  }
  .grid-gap-80 {
    grid-gap: 8rem !important;
  }
  .grid-gap-90 {
    grid-gap: 9rem !important;
  }
  .grid-gap-100 {
    grid-gap: 10rem !important;
  }
}

.no-grip-gap, .no-grid-gap {
  grid-gap: 0 !important;
}
@media only screen and (min-width: 768px) {
  .no-grip-gap > div:not(.text-box), .no-grid-gap > div:not(.text-box) {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/******************************** Layout - LAYOUTS ************/
/********************************* Introduction ********/
@media only screen and (max-width: 569px) {
  .layout-intro-01 .back-image {
    min-height: 25vh !important;
  }
}
.layout-intro-01 h2 {
  font-size: 2.5rem;
}
.layout-intro-02 h2 {
  font-size: 2.2rem;
}
.layout-intro-03 h2 {
  font-size: 2.5rem;
}
.layout-intro-04 h2 {
  font-size: 3rem;
}
.layout-intro-05 h2 {
  font-size: 3rem;
}
.layout-intro-06 h2 {
  font-size: 4rem;
}

.layout-intro-2 div.module-title, .layout-intro-1 div.module-title {
  border-bottom: 1px solid #00AAE7;
  padding: 0em 1em 1em;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .layout-intro-2 div.module-title, .layout-intro-1 div.module-title {
    display: flex;
    align-self: stretch;
    align-items: center;
    justify-content: center;
  }
}
@media only screen and (min-width: 768px) {
  .layout-intro-2 div.module-title, .layout-intro-1 div.module-title {
    padding: 1em 1em 1em 0;
    border-bottom: none;
    border-right: 1px solid #00AAE7;
    justify-content: center;
    text-align: right;
    display: grid;
    flex-wrap: wrap;
    align-content: center;
  }
}

.layout-intro-2 div.introduction, .layout-intro-1 div.introduction {
  padding: 0.5em 0;
  font-size: 1.2em;
  line-height: 1.6;
  text-align: left;
}
@media only screen and (max-width: 767px) {
  .layout-intro-2 div.introduction, .layout-intro-1 div.introduction {
    display: flex;
    align-self: stretch;
    align-items: center;
  }
}
@media only screen and (min-width: 768px) {
  .layout-intro-2 div.introduction, .layout-intro-1 div.introduction {
    padding: 1em 2em;
  }
}
.layout-intro-2 div.introduction p.introduction, .layout-intro-1 div.introduction p.introduction {
  line-height: 1.3;
}

/******************************** INTRO 1 */
.layout-intro-1 .module-title.tagline > * {
  margin: 0 !important;
}

/******************************** INTRO 2 */
.layout-intro-2 .module-title.tagline > * {
  margin: 0 !important;
}
.layout-intro-2 .back-image {
  z-index: -1;
}

/******************************** Titles */
@media only screen and (max-width: 569px) {
  .intro-panel, .intro-row {
    margin: 0 2rem;
  }
}
.intro-panel div.tagline, .intro-row div.tagline {
  border-bottom: 1px solid #010101;
  padding: 0em 1em 1em;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .intro-panel div.tagline, .intro-row div.tagline {
    padding: 1em 1em 1em 0;
    border-bottom: none !important;
    border-right: 1px solid #010101;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-content: center;
    text-align: right;
  }
}
.intro-panel p.Tagline, .intro-row p.Tagline {
  margin-bottom: 0;
}

.intro-panel {
  padding: 2em 6% !important;
  box-shadow: 0px 26px 26px 0px rgba(0, 0, 0, 0.2);
  border-radius: 0.3em;
}
@media only screen and (max-width: 767px) {
  .intro-panel {
    margin: 2em 0.5em !important;
    width: calc(100% - 1em) !important;
  }
}

.intro-outer {
  padding: 2em 6% !important;
  box-shadow: 0px 26px 26px 0px rgba(0, 0, 0, 0.2);
  border-radius: 5px;
}
.intro-outer > * {
  flex-direction: column;
}
@media only screen and (max-width: 767px) {
  .intro-outer {
    margin: 1em 0 3em !important;
  }
}

/******************************** Text-7 */
.text-7 {
  grid-template-columns: repeat(1, 1fr);
  grid-template-areas: "a" "b" "c" "d" "e" "f" "g";
}
@media only screen and (min-width: 570px) {
  .text-7 {
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas: "a a" "b c" "d e" "f g";
  }
}
@media only screen and (min-width: 768px) {
  .text-7 {
    grid-template-columns: repeat(4, 1fr);
    grid-template-areas: "a a b c" "d e f g";
  }
}

/******************************** Text-8 */
.text-8 {
  grid-template-columns: repeat(1, 1fr);
  grid-template-areas: "a" "b" "c" "d" "e";
}
@media only screen and (min-width: 570px) {
  .text-8 {
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas: "a a" "b c" "d e";
  }
}
@media only screen and (min-width: 768px) {
  .text-8 {
    grid-template-columns: repeat(3, 1fr);
    grid-template-areas: "a a b" "c d e";
  }
}

/******************************** Text-9 */
.text-9 {
  grid-template-columns: repeat(1, 1fr);
  grid-template-areas: "a" "b" "c" "d" "e" "f" "g" "h" "i";
}
@media only screen and (min-width: 570px) {
  .text-9 {
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas: "a a" "b c" "d e" "f g" "h i";
  }
}
@media only screen and (min-width: 768px) {
  .text-9 {
    grid-template-columns: repeat(5, 1fr);
    grid-template-areas: "a a b c d" "e f g h i";
  }
}

/******************************** Text-10 */
.text-10 {
  grid-template-columns: repeat(1, 1fr);
  grid-template-areas: "a" "b" "c" "d" "e" "f";
}
@media only screen and (min-width: 570px) {
  .text-10 {
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas: "a b" "c d" "e rf";
  }
}
@media only screen and (min-width: 768px) {
  .text-10 {
    grid-template-columns: repeat(3, 1fr);
    grid-template-areas: "a b c" "d e f";
  }
}

/******************************** Text-11 */
.text-11 {
  grid-template-columns: repeat(1, 1fr);
  grid-template-areas: "a" "b" "c" "d" "e";
}
@media only screen and (min-width: 570px) {
  .text-11 {
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas: "a a" "b c" "d e";
  }
}
@media only screen and (min-width: 768px) {
  .text-11 {
    grid-template-columns: repeat(3, 1fr);
    grid-template-areas: "a b c" "a d e";
  }
}

/***************************** Image Content Grid ***************/
.full-screen .training-content .image-content-grid {
  grid-gap: 0;
  align-content: stretch;
  -webkit-box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.6);
  box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.6);
}
@media only screen and (max-width: 767px) {
  .full-screen .training-content .image-content-grid {
    margin: 0 10px !important;
  }
}
@media only screen and (max-width: 767px) {
  .full-screen .training-content .image-content-grid .area-span-2 {
    grid-column: auto;
  }
}
@media only screen and (max-width: 767px) {
  .full-screen .training-content .image-content-grid .area-span-3 {
    grid-column: auto;
  }
}
@media only screen and (max-width: 767px) {
  .full-screen .training-content .image-content-grid .area-span-4 {
    grid-column: auto;
  }
}
@media only screen and (max-width: 767px) {
  .full-screen .training-content .image-content-grid .row-span-2 {
    grid-row: auto;
  }
}
@media only screen and (max-width: 767px) {
  .full-screen .training-content .image-content-grid .row-span-3 {
    grid-row: auto;
  }
}
@media only screen and (max-width: 767px) {
  .full-screen .training-content .image-content-grid .row-span-4 {
    grid-row: auto;
  }
}
@media only screen and (max-width: 767px) {
  .full-screen .training-content .image-content-grid.container-row {
    margin: 0 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .full-screen .training-content .image-content-grid .container-row > * {
    margin: 0 0 0;
  }
}
.full-screen .training-content .image-content-grid > div {
  min-height: 15vh;
  grid-template-rows: 1fr;
  align-self: stretch;
}
@media only screen and (max-width: 767px) {
  .full-screen .training-content .image-content-grid > div {
    margin: 0;
  }
}
.full-screen .training-content .image-content-grid > div .image-container {
  min-height: 250px;
}
.full-screen .training-content .image-content-grid > div img {
  width: 100%;
  height: 100%;
}
.full-screen .training-content .image-content-grid > div.vertical {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
@media only screen and (min-width: 768px) {
  .full-screen .training-content .image-content-grid > div.vertical {
    grid-template-columns: 1fr;
  }
}
.full-screen .training-content .image-content-grid > div.vertical .image-container {
  min-height: 100px;
  height: 40%;
}
.full-screen .training-content .image-content-grid > div.vertical img {
  width: 100%;
  height: auto;
}
@media only screen and (max-width: 430px) {
  .full-screen .training-content .image-content-grid > div.columns-1-1 {
    grid-template-columns: 1fr !important;
  }
}
@media only screen and (max-width: 768px) {
  .full-screen .training-content .image-content-grid > div.columns-1-1 {
    grid-template-columns: 1fr 1fr !important;
  }
}
@media only screen and (max-width: 430px) {
  .full-screen .training-content .image-content-grid > div.columns-1-2 {
    grid-template-columns: 1fr !important;
  }
}
@media only screen and (max-width: 768px) {
  .full-screen .training-content .image-content-grid > div.columns-1-2 {
    grid-template-columns: 1fr 1fr !important;
  }
}
@media only screen and (max-width: 430px) {
  .full-screen .training-content .image-content-grid > div.columns-1-3 {
    grid-template-columns: 1fr !important;
  }
}
@media only screen and (max-width: 768px) {
  .full-screen .training-content .image-content-grid > div.columns-1-3 {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* Positions style sheet for Battersea Systems 16/3/2022 */
hr {
  width: 100%;
}

/****************************** lines */
.line-top {
  border-top: 1px solid #000000;
}
.line-left {
  border-left: 1px solid #000000;
}
.line-bottom {
  border-bottom: 1px solid #000000;
}
.line-right {
  border-right: 1px solid #000000;
}
.line-all {
  border: 1px solid #000000;
}
.line-white {
  border-color: #ffffff;
}
.line-black {
  border-color: #000000;
}
.line-0 {
  border-width: 0px;
}
.line-1 {
  border-width: 1px;
}
.line-2 {
  border-width: 2px;
}
.line-3 {
  border-width: 3px;
}
.line-4 {
  border-width: 4px;
}
.line-5 {
  border-width: 5px;
}
.line-6 {
  border-width: 6px;
}
.line-7 {
  border-width: 7px;
}
.line-8 {
  border-width: 8px;
}
.line-9 {
  border-width: 9px;
}
.line-10 {
  border-width: 10px;
}

/*! Lists style sheet for Battersea Systems 2/2/2024 */
ol.no-bullets, ul.no-bullets {
  list-style: none;
  padding: 0 !important;
  margin: 0 !important;
}

.list-counter, .list-arrow, p[class^=icon-list], p[class*=icon-list], div[class^=icon-list], div[class*=icon-list], .qaquestion, p.qaquestion, .qaanswer, p.qaanswer {
  position: relative;
  padding-left: 54px;
  font-weight: 700;
  line-height: 20px;
}
.list-counter:before, .list-arrow:before, p[class^=icon-list]:before, p[class*=icon-list]:before, div[class^=icon-list]:before, div[class*=icon-list]:before, .qaquestion:before, .qaanswer:before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 45px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 50% 0%;
}

ul#moduleTree {
  margin: 0;
}

ol.no-bullets li {
  margin-bottom: 0;
}
ol#moduleTree {
  margin: 0;
}
ol#moduleTree li {
  margin-bottom: 0;
}

.list-arrow:before {
  content: "";
  height: 25px;
  background-image: url(../images/icons/arrow.svg);
}

.list-counter {
  padding-top: 6px;
  padding-bottom: 7px;
}
.list-counter:before {
  content: "";
  height: 40px;
  background-image: url(../images/icons/Counter-01.svg);
}
.list-counter + .list-counter:before {
  background-image: url(../images/icons/Counter-02.svg);
}
.list-counter + .list-counter + .list-counter:before {
  background-image: url(../images/icons/Counter-03.svg);
}
.list-counter + .list-counter + .list-counter + .list-counter:before {
  background-image: url(../images/icons/Counter-04.svg);
}
.list-counter + .list-counter + .list-counter + .list-counter + .list-counter:before {
  background-image: url(../images/icons/Counter-05.svg);
}
.list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter:before {
  background-image: url(../images/icons/Counter-06.svg);
}
.list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter:before {
  background-image: url(../images/icons/Counter-07.svg);
}
.list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter:before {
  background-image: url(../images/icons/Counter-08.svg);
}
.list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter:before {
  background-image: url(../images/icons/Counter-09.svg);
}
.list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter:before {
  background-image: url(../images/icons/Counter-10.svg);
}
.list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter:before {
  background-image: url(../images/icons/Counter-11.svg);
}
.list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter + .list-counter:before {
  background-image: url(../images/icons/Counter-12.svg);
}

/*! Media style sheet for Battersea Systems 19/8/2021 */
/**************************************************  Media previews  ************/
div.media-preview {
  clear: both;
  max-width: 320px;
  width: 100%;
  border: 1px solid #f7f7f7;
  padding: 3px;
  margin: 5px 0 10px;
}

.media-preview .navbar-brand {
  float: none;
}
.media-preview .container-center-me {
  height: 100%;
  min-height: 120px;
}
.media-preview .client-logo {
  display: block;
}
.media-preview .client-logo-mobile {
  display: block;
}
.media-preview .login-outer {
  height: 100px;
  width: 100%;
  background-size: cover;
}
.media-preview .admin-header {
  height: 100px;
  width: 100%;
  background-size: cover;
}
.media-preview .training-header {
  height: 100px;
  width: 100%;
  background-size: cover;
}
.media-preview .training-certificate {
  height: 250px;
  width: 100%;
  background-size: contain;
  background-image: url("http://battersea-power.com/Content/Customer_battersea/media/Batt-Certificate.svg");
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

/* Modals style sheet for Battersea Systems 14/5/2022 */
.modal {
  max-height: 90vh;
  margin: 5vh auto;
  max-width: 90vw;
}

@media only screen and (min-width: 768px) {
  .modal-dialog {
    max-width: 600px;
    width: auto;
    margin: 0;
  }
}
@media only screen and (min-width: 992px) {
  .modal-lg {
    width: auto;
    max-width: none;
  }
}
.modal[aria-hidden=false] {
  display: grid !important;
  justify-content: center;
  align-content: start; /* issues with long examples means you cannot use centre.*/
}

/**************************** Modal Header */
.modal-header .form-horizontal {
  padding-right: 0;
  padding-left: 0;
}

/**************************** Modal Panels */
.modal-panel {
  padding: 8px 15px 10px 44px;
  border: 1px solid #999999;
  border-radius: 3px;
  position: relative;
  margin: 20px 2%;
  box-shadow: rgba(0, 0, 0, 0.3) 0 0 6px 0;
  display: block !important;
  width: 96%;
  text-align: left;
  font-weight: 700;
  font-size: 1.1em;
}
.modal-panel.panel-image {
  background-color: transparent;
  padding: 0;
  border: none;
  border-radius: 0;
  position: relative;
  box-shadow: none !important;
  text-align: center;
}
.modal-panel.panel-image:hover {
  background-color: transparent !important;
}

/**************************** Modal Panels */
@media only screen and (min-width: 768px) {
  div.modal-content {
    padding: 20px 50px;
  }
}

/**************************** Modal footer */
.modal-footer {
  background: transparent;
}

/*! Navigation style sheet for Battersea Systems 30/7/2024 */
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) #defaultNavbar1 {
  display: none !important;
}
@media only screen and (min-width: 768px) {
  nav #defaultNavbar1 .collapse.navbar-collapse {
    position: absolute;
    right: 1%;
    top: 0;
  }
}

html.SuperAdministrator #defaultNavbar2 {
  display: none !important;
}
html.HRManager #defaultNavbar2 {
  display: none !important;
}
html.admin-login #defaultNavbar2 {
  display: none !important;
}
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) #defaultNavbar2.in {
  display: block !important;
}
#defaultNavbar2 .nav > li {
  position: static;
}
#defaultNavbar2 .nav .dropdown-menu {
  min-width: 0;
}
#defaultNavbar2 .nav li.dropdown {
  position: relative !important;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#defaultNavbar2 .nav li.dropdown li {
  position: static;
}

.navbar .navbar-nav > li > a:focus, .navbar .navbar-nav > li > a:hover, .navbar .navbar-nav > li > a {
  font-size: 1.1rem;
  font-weight: 400;
  color: #666666;
}
.navbar .navbar-nav > li > a:hover {
  color: #3D3D3D !important;
}

.navbar {
  background-color: rgba(255, 255, 255, 0.9) !important;
  position: relative;
  margin-bottom: 0;
  height: 60px;
  min-height: 0;
  -moz-transition: height 0.6s ease;
  -webkit-transition: height 0.6s ease;
  -o-transition: height 0.6s ease;
  transition: height 0.6s ease;
}
@media only screen and (min-width: 768px) {
  .navbar {
    height: 90px;
    position: fixed;
    width: 100%;
    z-index: 20;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
    -moz-transition: height 0.6s ease;
    -webkit-transition: height 0.6s ease;
    -o-transition: height 0.6s ease;
    transition: height 0.6s ease;
    background-size: 100% auto;
    min-height: 0;
  }
}
html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) .navbar {
  background-size: cover;
  background-repeat: no-repeat;
  position: initial;
  margin: 0;
}
@media only screen and (min-width: 768px) {
  html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) .navbar {
    position: fixed;
  }
}
.navbar-default {
  border: none;
}
.navbar-nav {
  margin-bottom: 10px;
}
.navbar-toggle {
  position: absolute;
  top: 10px;
  right: 10px;
  margin: 0;
  z-index: 3;
}
.admin-login .navbar-toggle {
  display: none;
}
.navbar-collapse {
  position: absolute;
  z-index: 1;
  top: 50px;
  right: 0;
  border: none;
}
@media only screen and (min-width: 768px) {
  .navbar-collapse {
    position: static;
  }
}
.navbar.nav-bar-header {
  margin: 10px 0 0 0 !important;
}
@media only screen and (min-width: 768px) {
  .navbar.nav-bar-header {
    margin: 0 !important;
  }
}
.navbar.navbar-default > .container-fluid {
  padding: 0;
}
@media only screen and (min-width: 768px) {
  .navbar.navbar-default > .container-fluid {
    padding-right: 15px;
    padding-left: 15px;
  }
}
.navbar.navbar-default > .container-fluid > .navbar-header {
  margin-right: 0;
  margin-left: 0;
}
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) .navbar.navbar-default.shrink .user-name {
  bottom: -25px;
}
.navbar.shrink {
  height: 50px !important;
  min-height: 0;
}
html:not(.SuperAdministrator):not(.HRManager) .navbar.shrink {
  height: 50px !important;
  min-height: 0;
}
.navbar.training.main-menu > a span.badge {
  margin: 0 0 1.6em 2px;
  font-size: 10px;
  padding: 1px 3px 3px;
}
.navbar .dropdown-menu {
  min-width: 0;
}
.navbar .dropdown-menu .divider {
  margin: 5px 0;
  background-color: #CCCCCC;
}
.nav > li > a {
  padding: 7px 10px 5px !important;
  line-height: 1.8;
}
.tabbable .nav > li > a {
  line-height: 1.8 !important;
}
.nav > li > a.glyphicons-log-out:before {
  font-size: 17px;
}
.nav > li > a.glyphicons-log-out:hover:before {
  color: rgb(193.2127659574, 98.6595744681, 96.7872340426);
}
.nav > li > a > span.badge {
  position: absolute;
  left: 50px;
  top: 11px;
  font-size: 0.8rem;
  padding: 3px 0;
  background-color: rgba(204, 204, 204, 0.98) !important;
  width: 15px;
  height: 15px;
  font-family: "Helvetica", Helvetica, Arial, sans-serif;
}
@media only screen and (min-width: 768px) {
  .nav > li > a > span.badge {
    margin-left: 2px;
    margin-top: -4px;
    line-height: 0.6rem;
    background-color: rgba(204, 204, 204, 0.98) !important;
    vertical-align: top;
    position: static;
  }
}
@media only screen and (min-width: 768px) {
  .nav li a {
    display: inline-block;
    vertical-align: middle;
  }
}
.nav li a .badge {
  display: inline-block;
  vertical-align: middle;
}

.admin-login nav .collapse.navbar-collapse {
  display: none !important;
}

.outer > nav .nav.navbar-nav a {
  width: auto;
  transition: width 600ms ease-in 600ms, width 600ms;
  display: block;
  height: 30px;
}
@media only screen and (min-width: 768px) {
  .outer > nav .nav.navbar-nav a {
    height: auto;
    margin: 0;
  }
}
@media only screen and (min-width: 768px) {
  .outer > nav .nav.navbar-nav li {
    border-left: 1px solid #f7f7f7;
  }
}
.outer > nav .nav.navbar-nav li:first-child {
  border-left: none;
}
.outer > nav .nav.navbar-nav li:hover a {
  -moz-transition: width 600ms ease-in 0.3s ease;
  -webkit-transition: width 600ms ease-in 0.3s ease;
  -o-transition: width 600ms ease-in 0.3s ease;
  transition: width 600ms ease-in 0.3s ease;
}
.outer > nav .nav.navbar-nav li:hover a span.hide-reveal {
  display: inline-block !important;
  padding-left: 5px;
  font-size: 80%;
  line-height: 1;
}

@media only screen and (min-width: 768px) {
  ul.nav.navbar-nav {
    background-color: white;
    border-radius: 0 0 3px 3px;
    position: absolute;
    top: 0;
    right: 50px;
    float: none !important;
  }
}
body.training-content ul.nav.navbar-nav {
  right: 25px;
  box-shadow: 0 2px 7px rgba(0, 0, 0, 0.2);
}

@media only screen and (max-width: 767px) {
  .navbar-collapse {
    width: 90px;
    position: absolute;
    right: 0px;
    height: auto !important;
  }
  .navbar-collapse.collapse {
    -webkit-transform: translateX(90px);
    -ms-transform: translateX(90px);
    transform: translateX(90px);
    transition: 0.5s ease-in-out;
  }
  .navbar-collapse.collapsing {
    -webkit-transform: translateX(90px);
    -ms-transform: translateX(90px);
    transform: translateX(90px);
    transition: 0.5s ease-in-out;
  }
  .navbar-collapse.in {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    transition: 0.5s ease-in-out;
  }
}

@media only screen and (max-width: 767px) {
  ul.nav.navbar-nav {
    background-color: white;
    width: 90px;
    border-radius: 10px 0 0 10px;
    box-shadow: rgba(0, 0, 0, 0.3) 0 0 6px 0;
    padding-bottom: 28px;
    border: 1px solid #ccc;
    border-right: none;
  }
  ul.nav.navbar-nav .glyphicon {
    padding-left: 50px;
  }
  ul.nav.navbar-nav .glyphicon:before {
    position: absolute;
    top: 12px;
    left: 50%;
    margin-left: -8px;
  }
  ul.nav.navbar-nav .glyphicons {
    padding-left: 50px;
  }
  ul.nav.navbar-nav .glyphicons:before {
    position: absolute;
    top: 12px;
    left: 50%;
    margin-left: -8px;
  }
}

html:not(.SuperAdministrator):not(.Administrator):not(.HRManager):not(.admin-login) nav .navbar-container {
  padding: 0;
}

.full-screen .training-navbar.navbar-default .navbar-collapse.in {
  overflow: visible;
}
@media only screen and (max-width: 767px) {
  .full-screen .training-navbar.navbar-default .navbar-collapse.in {
    padding: 0;
    margin: 0;
    width: 45px;
    right: 10px;
  }
}
.full-screen .training-navbar.navbar-default ul.nav.navbar-nav {
  margin: 7.5px 11px;
  box-shadow: none;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 5px;
  border: 1px solid #ffffff;
  overflow: visible;
  justify-content: center;
  padding: 0 0.5em;
}
@media only screen and (max-width: 767px) {
  .full-screen .training-navbar.navbar-default ul.nav.navbar-nav {
    width: 45px;
    margin: 0;
    padding: 0.5em 0;
    display: grid;
  }
}
.full-screen .training-navbar.navbar-default ul.nav.navbar-nav .glyphicons:before {
  margin-left: 0;
}
@media only screen and (max-width: 767px) {
  .full-screen .training-navbar.navbar-default ul.nav.navbar-nav .glyphicons:before {
    position: static;
  }
}
.full-screen .training-navbar.navbar-default ul.nav.navbar-nav > li {
  text-align: center;
  margin: 2px 0;
}
.full-screen .training-navbar.navbar-default ul.nav.navbar-nav > li > a {
  font-size: 1em;
  color: #ffffff;
  text-shadow: 0 2px 7px rgba(0, 0, 0, 0.75);
  padding: 0 !important;
  line-height: 1.4;
}
@media only screen and (min-width: 768px) {
  .full-screen .training-navbar.navbar-default ul.nav.navbar-nav > li > a {
    height: 1.6em;
    display: block;
  }
}
.full-screen .training-navbar.navbar-default ul.nav.navbar-nav > li > a > span.badge {
  line-height: 9px;
  left: 11px;
  top: -5px;
}
@media only screen and (min-width: 768px) {
  .full-screen .training-navbar.navbar-default ul.nav.navbar-nav > li > a > span.badge {
    margin-left: 10px;
    margin-top: -31px;
  }
}
.full-screen .training-navbar.navbar-default ul.nav.navbar-nav > li.dropdown {
  display: grid !important;
}
.full-screen .training-navbar.navbar-default ul.nav.navbar-nav > li.divider {
  margin: 6px 0px;
  height: 1px;
  overflow: hidden;
  background-color: #e5e5e5;
}
.full-screen .training-navbar.navbar-default ul.nav.navbar-nav > .open > a {
  background-color: transparent;
}
.full-screen .training-navbar.navbar-default ul.nav.navbar-nav > .open .dropdown-menu {
  display: grid;
  justify-content: center;
}
@media only screen and (min-width: 768px) {
  .full-screen .training-navbar.navbar-default ul.nav.navbar-nav > .open .dropdown-menu {
    width: 27px;
    left: -4px;
    top: 1.95em;
    background-color: rgba(0, 0, 0, 0.5);
    border: 1px solid #ffffff;
  }
}
.full-screen .training-navbar.navbar-default ul.nav.navbar-nav > .open .dropdown-menu > li {
  text-align: center;
  margin: 4px 0;
}
.full-screen .training-navbar.navbar-default ul.nav.navbar-nav > .open .dropdown-menu > li > a {
  padding: 0;
  line-height: 14px;
  color: #ffffff;
  width: auto;
  text-shadow: 0 2px 7px rgba(0, 0, 0, 0.75);
  width: 100%;
  margin: 0;
}
.full-screen .training-navbar.navbar-default ul.nav.navbar-nav > .open .dropdown-menu > li > a:hover {
  background-color: transparent;
}
.full-screen .training-navbar.navbar-default ul.nav.navbar-nav > .open .dropdown-menu > li.divider {
  margin: 6px 0px;
}

/**************************** Tabs */
.nav-tabs > li > a:hover {
  border-color: transparent;
}

/**************************** Sidebar */
.sidebar {
  display: block;
  float: none;
  position: absolute;
  z-index: 15;
  left: -225px;
  bottom: auto;
  top: auto !important;
  margin-top: 36px;
  border: none;
  border-left-width: 0;
  box-shadow: 2px 1px 2px 0 rgba(0, 0, 0, 0.2);
  transition: 1s;
  width: 221px;
}
.sidebar:before {
  background-color: transparent;
  border: none;
}
@media only screen and (min-width: 768px) {
  .sidebar {
    /*left: -210px;*/
  }
}
.sidebar.display {
  left: 0;
  transition: 1s;
}
.sidebar .open {
  background-color: transparent;
}
.sidebar ul.nav.nav-list {
  /*padding-top: 10px;*/
  margin-left: 0;
}
.sidebar ul.nav.nav-list > li.active {
  background-color: transparent;
  border: none;
}
.sidebar ul.nav.nav-list > li.active:first-child > a i:before {
  content: "" !important;
  background-image: url("../images/battersea/branding/battersea-peel.svg");
  height: 20px;
  width: 20px;
  margin: 5px 0 0 0;
}
.sidebar .nav > li > a {
  padding: 7px 10px 5px 40px !important;
  line-height: 1.7;
  background: transparent;
  font-size: 0.95rem;
}

.menu-toggler:after, .menu-toggler:before {
  content: "";
  border-top: unset;
  border-bottom: unset;
  height: unset;
  width: unset;
  position: unset;
  z-index: unset;
  top: unset;
  left: unset;
  -webkit-transition: unset;
  transition: unset;
  -o-transition: unset;
  -webkit-box-sizing: unset;
  -moz-box-sizing: unset;
  box-sizing: unset;
}

@media only screen and (min-width: 768px) {
  div.navbar-header {
    float: left;
  }
}

.menu-toggler {
  position: absolute;
  display: block;
  width: 61px;
  text-align: center;
  left: 0;
  z-index: 16;
  height: 1.6rem;
  margin-right: 2px;
  line-height: normal;
  padding: 7px 0px;
  font-size: 0.9rem;
  line-height: 1.7;
  font-weight: 700;
  font-family: "Helvetica", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  background-color: #f7f7f7;
}
@media only screen and (max-width: 991px) {
  .menu-toggler {
    background-color: #f7f7f7;
  }
}
.menu-toggler:after {
  display: block;
  position: absolute;
  bottom: -12px;
  left: 0;
  border: 1px solid transparent;
  border-width: 12px 35px 1px 29px;
  border-top-color: #f7f7f7;
}
@media only screen and (max-width: 991px) {
  .menu-toggler:after {
    border-top-color: #f7f7f7;
  }
}
.menu-toggler > span {
  display: block;
  align-self: center;
  width: 100%;
}
.menu-toggler > .menu-text {
  display: block;
  position: absolute;
  bottom: -12px;
  left: 0;
  border: 1px solid transparent;
  border-width: 12px 35px 1px 29px;
  border-top-color: #f7f7f7;
}
.menu-toggler > .menu-text:after {
  color: #666666;
  display: block;
  content: "MENU";
  position: absolute;
  left: -19px;
  top: -40px;
}

.nav-list > li.active > a:active, .nav-list > li.active > a:focus, .nav-list > li.active > a:hover {
  background-color: transparent;
  color: #010101;
  font-weight: 700;
  font-size: 0.95rem;
  position: relative;
}

.nav-list > li {
  border: none;
}
.nav-list > li.active > a:hover {
  text-decoration: underline;
}
.nav-list > li.active > a:active:after {
  top: 0px;
  border: none;
}
.nav-list > li.active > a.active {
  background-color: transparent;
}
.nav-list > li.active > a.open {
  border-bottom: 1px solid #999999;
}
.nav-list > li.active > a > [class*=icon-]:first-child {
  position: absolute;
  left: 5px;
  top: 4px;
}
.nav-list > li.active > .submenu:before {
  border: none;
}
.nav-list > li.active:after {
  border: none;
}
.nav-list > li:last-child {
  margin-bottom: 2px;
}
.nav-list > li .submenu {
  border: none;
}
.nav-list > li .submenu:before {
  border: none;
}
.nav-list > li .submenu > li:before {
  border: none;
}
.nav-list > li .submenu > li i:before {
  display: none;
}
.nav-list > li .submenu > li > a {
  border-top: 1px solid #CCCCCC;
  padding-left: 57px;
  background: transparent;
  position: relative;
}
.nav-list > li .submenu > li > a:before {
  display: block;
  font-style: normal;
  font-weight: 400;
  content: "\e224";
  margin-right: 3px;
  position: absolute;
  left: 40px;
  top: 9px;
  font-size: 0.9rem;
}
.nav-list > li .submenu > li > [class*=icon-]:first-child {
  display: none !important;
}
.nav-list > li .submenu > li:first-child > a {
  border-top: 1px solid #f7f7f7;
}

/**************************** Student - Menu */
div.user-menu {
  position: absolute;
  right: 18px;
  top: 150px;
  text-align: right;
}
div.user-menu + h1 {
  width: 75%;
}
div.user-menu h3 {
  font-weight: 400;
  font-size: 14px;
}
@media only screen and (min-width: 768px) {
  div.user-menu h3 {
    font-size: 80%;
    margin-top: 35px;
  }
}
div.user-menu a {
  color: #999999;
  font-weight: 400;
  font-size: 14px;
}
div.user-menu a:hover {
  text-decoration: none;
}
div.user-menu a:focus {
  text-decoration: none;
}

.training.student-menu, .training.main-menu {
  text-align: center;
  position: absolute;
  padding: 0;
  width: 120px;
}
.training.student-menu > a, .training.main-menu > a {
  width: 100%;
  height: 20%;
  min-height: 46px;
  line-height: 46px;
  margin: 0;
}

.training.main-menu {
  left: 0;
}
.training.main-menu > a:hover span.hide-reveal {
  display: inline-block;
  padding: 0 5px;
  vertical-align: middle;
}
.training.main-menu > a:hover:nth-child(even) {
  background-color: rgba(153, 153, 153, 0.8);
}
.training.main-menu > a*:nth-child(even) {
  background-color: #999999;
}
.training.student-menu {
  right: 0;
}
.training.student-menu > a:hover span.hide-reveal {
  display: inline-block;
  padding: 0 5px;
  vertical-align: middle;
}
.training.student-menu > a:hover:nth-child(even) {
  background-color: rgba(153, 153, 153, 0.8);
}
/****************************************************************************** Buttons */
.btn.icon, .inTraining-nav {
  position: relative;
  display: block;
  width: 1.9em;
  height: 1.9em;
}
.training-content .btn.icon, .training-content .inTraining-nav {
  border-color: transparent;
  background-color: transparent;
}
.btn.icon:before, .inTraining-nav:before {
  position: absolute;
  content: "";
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50% 50%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.btn.icon:focus, .inTraining-nav:focus {
  outline: none;
}
.btn.icon:active, .inTraining-nav:active {
  -webkit-box-shadow: none;
  box-shadow: none;
}
.arrow-down.btn.icon, .arrow-down.inTraining-nav {
  -moz-transition: transform 0.3s ease-in;
  -webkit-transition: transform 0.3s ease-in;
  -o-transition: transform 0.3s ease-in;
  transition: transform 0.3s ease-in;
}
.arrow-down.btn.icon:before, .arrow-down.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-down-red.svg");
}
.dark .arrow-down.btn.icon:before, .dark .arrow-down.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-down-white.svg");
}
.arrow-down.btn.icon:hover, .arrow-down.inTraining-nav:hover {
  transform: translatey(0.3rem);
}
.arrow-up.btn.icon, .arrow-up.inTraining-nav {
  -moz-transition: transform 0.3s ease-in;
  -webkit-transition: transform 0.3s ease-in;
  -o-transition: transform 0.3s ease-in;
  transition: transform 0.3s ease-in;
}
.arrow-up.btn.icon:before, .arrow-up.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-up-red.svg");
}
.dark .arrow-up.btn.icon:before, .dark .arrow-up.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-up-white.svg");
}
.arrow-up.btn.icon:hover, .arrow-up.inTraining-nav:hover {
  transform: translatey(-0.3rem);
}
.arrow-left.btn.icon, .arrow-left.inTraining-nav {
  -moz-transition: transform 0.3s ease-in;
  -webkit-transition: transform 0.3s ease-in;
  -o-transition: transform 0.3s ease-in;
  transition: transform 0.3s ease-in;
}
.arrow-left.btn.icon:before, .arrow-left.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-left-red.svg");
}
.dark .arrow-left.btn.icon:before, .dark .arrow-left.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-left-white.svg");
}
.arrow-left.btn.icon:hover, .arrow-left.inTraining-nav:hover {
  transform: translatex(-0.3rem);
}
.nav-back.btn.icon, .nav-back.inTraining-nav {
  -moz-transition: transform 0.3s ease-in;
  -webkit-transition: transform 0.3s ease-in;
  -o-transition: transform 0.3s ease-in;
  transition: transform 0.3s ease-in;
}
.nav-back.btn.icon:before, .nav-back.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-left-red.svg");
}
.dark .nav-back.btn.icon:before, .dark .nav-back.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-left-white.svg");
}
.nav-back.btn.icon:hover, .nav-back.inTraining-nav:hover {
  transform: translatex(-0.3rem);
}
.arrow-right.btn.icon, .arrow-right.inTraining-nav {
  -moz-transition: transform 0.3s ease-in;
  -webkit-transition: transform 0.3s ease-in;
  -o-transition: transform 0.3s ease-in;
  transition: transform 0.3s ease-in;
}
.arrow-right.btn.icon:before, .arrow-right.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-right-red.svg");
}
.dark .arrow-right.btn.icon:before, .dark .arrow-right.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-right-white.svg");
}
.arrow-right.btn.icon:hover, .arrow-right.inTraining-nav:hover {
  transform: translatex(0.3rem);
}
.nav-to.btn.icon, .nav-to.inTraining-nav {
  -moz-transition: transform 0.3s ease-in;
  -webkit-transition: transform 0.3s ease-in;
  -o-transition: transform 0.3s ease-in;
  transition: transform 0.3s ease-in;
}
.nav-to.btn.icon:before, .nav-to.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-right-red.svg");
}
.dark .nav-to.btn.icon:before, .dark .nav-to.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-right-white.svg");
}
.nav-to.btn.icon:hover, .nav-to.inTraining-nav:hover {
  transform: translatex(0.3rem);
}
.nav-test.btn.icon, .nav-test.inTraining-nav {
  -moz-transition: transform 0.3s ease-in;
  -webkit-transition: transform 0.3s ease-in;
  -o-transition: transform 0.3s ease-in;
  transition: transform 0.3s ease-in;
}
.nav-test.btn.icon:before, .nav-test.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-right-red.svg");
}
.dark .nav-test.btn.icon:before, .dark .nav-test.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-right-white.svg");
}
.nav-test.btn.icon:hover, .nav-test.inTraining-nav:hover {
  transform: translatex(0.3rem);
}
.nav-toc.btn.icon:before, .nav-toc.inTraining-nav:before {
  background-image: url("/Content/images/Icons/toc-red.svg");
}
.dark .nav-toc.btn.icon:before, .dark .nav-toc.inTraining-nav:before {
  background-image: url("/Content/images/Icons/toc-white.svg");
}
.save-result.btn.icon, .save-result.inTraining-nav {
  /*width: 1.4em;
  height: 1.4em;*/
  -moz-transition: transform 0.3s ease-in;
  -webkit-transition: transform 0.3s ease-in;
  -o-transition: transform 0.3s ease-in;
  transition: transform 0.3s ease-in;
}
.save-result.btn.icon:before, .save-result.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-right-red.svg");
}
.dark .save-result.btn.icon:before, .dark .save-result.inTraining-nav:before {
  background-image: url("/Content/images/Icons/arrow-right-white.svg");
}
.save-result.btn.icon:hover, .save-result.inTraining-nav:hover {
  transform: translatex(-0.3rem);
}
.btn.icon span.button-label, .inTraining-nav span.button-label {
  display: none;
}

.inTraining-nav.save-result {
  display: block;
}

.training-navigation .btn.btn-default {
  color: #ffffff !important;
}

.training-nav {
  font-size: 14px;
}
.training-nav.in-line {
  display: flex;
  align-items: center;
  justify-content: center;
  grid-gap: 1em;
  width: fit-content;
  flex-direction: row;
}
.training-nav.in-line > * {
  margin: 0 8px;
}

/*! Overlays style sheet for Battersea Systems 21/7/2021 */
/**************************************************  Overlay - Text ************/
.text-overlay {
  display: block !important;
  height: auto !important;
  position: absolute !important;
  z-index: 5;
  text-align: center;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.8) !important;
}
.text-overlay.dark {
  background-color: rgba(0, 0, 0, 0.8) !important;
}
/****************************** Overlays - Transparency */
.overlay {
  position: relative;
}
.overlay > * {
  z-index: 1;
}
.overlay:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  opacity: 0.8;
  z-index: 0;
}
.overlay-opacity-10:before {
  opacity: 0.1;
}
.overlay-opacity-20:before {
  opacity: 0.2;
}
.overlay-opacity-30:before {
  opacity: 0.3;
}
.overlay-opacity-40:before {
  opacity: 0.4;
}
.overlay-opacity-50:before {
  opacity: 0.5;
}
.overlay-opacity-60:before {
  opacity: 0.6;
}
.overlay-opacity-70:before {
  opacity: 0.7;
}
.overlay-opacity-80:before {
  opacity: 0.8;
}
.overlay-opacity-90:before {
  opacity: 0.9;
}
.overlay-opacity-95:before {
  opacity: 0.95;
}
.overlay-solid:before {
  opacity: 1;
}

.opacity-0 {
  opacity: 0;
}
.opacity-5 {
  opacity: 0.05;
}
.opacity-10 {
  opacity: 0.1;
}
.opacity-15 {
  opacity: 0.15;
}
.opacity-20 {
  opacity: 0.2;
}
.opacity-25 {
  opacity: 0.25;
}
.opacity-30 {
  opacity: 0.3;
}
.opacity-35 {
  opacity: 0.35;
}
.opacity-40 {
  opacity: 0.4;
}
.opacity-45 {
  opacity: 0.45;
}
.opacity-50 {
  opacity: 0.5;
}
.opacity-55 {
  opacity: 0.55;
}
.opacity-60 {
  opacity: 0.6;
}
.opacity-65 {
  opacity: 0.65;
}
.opacity-70 {
  opacity: 0.7;
}
.opacity-75 {
  opacity: 0.75;
}
.opacity-80 {
  opacity: 0.8;
}
.opacity-85 {
  opacity: 0.85;
}
.opacity-90 {
  opacity: 0.9;
}
.opacity-95 {
  opacity: 0.95;
}
.opacity-100 {
  opacity: 1;
}

/**************************************************** PAGES ****/
/*! Pages: Administration style sheet for Battersea Systems 21/7/2021 */
.admin-group .panel-title {
  line-height: 1.5em;
}

.page-order {
  float: right;
}

/*! Pages: Certificate style sheet for Battersea Systems 30/11/2022 */
.certificate-container-span {
  position: relative;
  width: 800px;
}
.certificate-container-span:before {
  content: "";
  padding-top: 141.143%; /* A4 Portrait Paper*/
  display: block;
}
.certificate-container-span a.btn {
  margin: 30px auto;
  text-align: left;
  display: block;
  width: 20%;
  font-size: 1.2rem;
  position: absolute;
  bottom: 180px;
  left: 40%;
  padding: 0.2em 1rem 0.3em;
}
.certificate-container-span a.btn .filetypes {
  font-size: 1rem;
}
.certificate-image {
  position: absolute;
  top: 30px;
  left: 46px;
  height: calc(100% - 80px);
}
.certificate_inner {
  text-align: center;
  padding: 275px 105px 10px;
  position: absolute;
  top: 0;
  width: 100%;
}
.certificate_inner h2 {
  font-size: 3rem;
  margin: 3rem 0;
}
.certificate_inner h3 {
  font-weight: 300;
  font-size: 1.9em;
  margin: 0;
}
.certificate_inner h4 {
  font-size: 1.2em;
  font-weight: 700;
  padding: 0.7em 0;
}
.certificate-message {
  font-size: 2rem;
}
.certificate-title {
  font-size: 3.5em;
  font-weight: 600;
  margin-bottom: 0;
}

/*! Pages: Dashboards style sheet for Battersea Systems 15/11/2022 */
.nestedSortable-handle {
  display: flex !important;
  align-content: center;
  flex-wrap: wrap;
  justify-content: space-between;
}

img.centre-me.course-image, .module-image img {
  width: 100%;
  object-fit: cover;
  position: static;
  top: unset;
  left: unset;
  bottom: unset;
  transform: none;
}

.module-image {
  text-align: center;
  padding: 0 !important;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 100px;
  flex: 1 1 136px;
}
.row.training-module-intro .training-image {
  padding: 0;
  position: relative;
  background-color: #f7f7f7;
}
.training-image > h1 {
  display: none;
}
.training-image > h1 svg {
  display: inline-block;
  vertical-align: middle;
  width: 28px;
}
@media only screen and (min-width: 768px) {
  .row.training-module-intro .training-image > div {
    height: 100%;
    min-height: 300px;
  }
}
.row.training-module-intro .training-image img {
  width: 100%;
}

.div-cell.module-title {
  width: 45%;
}
@media only screen and (min-width: 550px) {
  .div-cell.module-title {
    width: 50%;
  }
}
.div-cell.module-info button.btn.btn-sm.collapsed {
  background-color: transparent;
  border-color: silver;
}

.module-information {
  border: 1px solid #f7f7f7;
  margin: 5px;
  padding: 10px 20px;
  line-height: 1.3em;
}
@media only screen and (min-width: 768px) {
  .module-information {
    margin: 0 5px 5px;
  }
}
.module-information .btn {
  margin: 10px 0 15px;
}
.module-information h3 {
  background-color: #f7f7f7;
  border-radius: 10px;
  padding: 5px 10px;
  font-weight: 300;
  margin: 10px 0 15px;
  font-size: 1.3rem;
}
@media only screen and (min-width: 768px) {
  .module-information h3 {
    font-size: 1.5rem;
  }
}
.module-information .panel-title small {
  margin-top: 10px;
  display: block;
}
.module-information > .panel-body {
  padding: 0;
  border: none !important;
}
.module-information > .panel-body > div {
  text-align: center;
}
.module-information .row > .module-title {
  font-weight: 600;
  margin-bottom: 0;
  width: 100% !important;
  text-align: center;
}
@media only screen and (min-width: 1080px) {
  .module-information .row > .module-title {
    font-size: 24px;
  }
}
.module-information .row > .module-date {
  font-weight: 200;
  text-align: center;
  opacity: 0.5;
  font-size: 15px;
  width: 100% !important;
  margin-bottom: 10px;
}
.module-information .panel-title small {
  margin-top: 10px;
  display: block;
}
.module-information .panel-collapse .row {
  margin-left: 0;
  margin-right: 0;
}
.module-information label {
  font-weight: 200;
  font-size: 14px;
  color: #999999;
  line-height: 1;
}
.module-information span.label {
  font-size: 1.6rem;
}
@media only screen and (max-width: 1024px) {
  .module-information .col-sm-4.test-score {
    width: 49%;
    display: inline-block;
    padding-left: 2%;
    padding-right: 2%;
  }
}
@media only screen and (max-width: 1024px) {
  .module-information .col-sm-4.test-attempts {
    width: 49%;
    display: inline-block;
    padding-left: 2%;
    padding-right: 2%;
  }
}
@media only screen and (max-width: 1024px) {
  .module-information .col-sm-4.test-status {
    float: none;
    width: 100%;
  }
}
.module-information .test-score small {
  font-size: 50%;
}
.module-information .test-status span.label {
  font-weight: 600;
}
.module-information span.label .label-success {
  color: #0a6242;
}
.module-information span.label.label-warning {
  color: #EDAD44;
}
.module-information span.label.label-danger {
  color: #a94442;
}

.module-information span.label .label-success, .module-information span.label.label-warning, .module-information span.label.label-danger {
  background-color: transparent;
  padding: 0;
}

.module-test-back, .module-company-back, .module-intro-back {
  padding: 2px;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  background-image: url("https://battersea-power.com/Content/images/backgrounds/training.jpg");
}

.module-test-content, .module-company-content, .module-intro-content {
  color: #ffffff;
  background-color: rgba(0, 0, 0, 0.6);
  margin-top: 0;
  padding: 10px 20px;
  font-size: 1.1em;
}
@media only screen and (min-width: 768px) {
  .module-test-content, .module-company-content, .module-intro-content {
    margin-top: 0;
    margin-left: 35%;
    padding: 20px 50px;
  }
}
@media only screen and (min-width: 950px) {
  .module-test-content, .module-company-content, .module-intro-content {
    margin-left: 50%;
  }
}
.module-test-content div.panel-heading + .panel-collapse .panel-body, .module-company-content div.panel-heading + .panel-collapse .panel-body, .module-intro-content div.panel-heading + .panel-collapse .panel-body {
  color: initial;
}

.module-test-content .modal-body, .module-company-content .modal-body, .module-intro-content .modal-body {
  color: initial;
}

.module-company-content {
  margin-left: 0%;
  margin-right: 50%;
}
.row.training-module-intro {
  margin: 10px 0 0;
  max-width: 1140px;
  margin: 0 auto;
}
.row.training-module-intro .training-module-title h1 {
  margin: 8px 0;
}
.row.training-module-intro + .row.training-module-intro {
  margin-top: 10px;
}
.row.training-module-intro .training-status {
  padding: 0;
}

.training-module-intro .training-button .btn.cell-button {
  background-color: #00AAE7 !important;
}

.module-details {
  font-weight: 300;
  text-transform: uppercase;
  color: #3363AF;
  -webkit-box-flex: 2;
  -ms-flex: 2 2 250px;
  flex: 2 2 180px;
}
.module-details .test-title {
  margin-top: 5px;
}
.module-details .test-title svg {
  width: 20px;
  margin-left: 5px;
  display: inline-block;
  vertical-align: middle;
}
.module-details .cell-status {
  display: inline-block;
  max-width: 65%;
  vertical-align: middle;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.module-details .cell-status.no-tests {
  background-color: #6c8498;
}
.module-details .cell-status.cell-RSVP {
  background-color: #516192;
}
.module-details .cell-status.cell-accepted {
  background-color: #0a6242;
}
.module-details .cell-status.cell-seats {
  background-color: #00b0cd;
}
.module-details .cell-status.cell-closed {
  background-color: #EDAD44;
}
.module-details .test-score {
  display: inline-block;
  max-width: 33%;
  vertical-align: middle;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.training-offline-buttons.btn.cell-button.cell-seats {
  background-color: #00b0cd;
  color: #fff;
}
.training-offline-buttons.btn.cell-button.cell-closed {
  background-color: #EDAD44;
  color: #fff;
}

.col-sm-9.training.training-module-title {
  padding-left: 0;
}

div.module-contents {
  padding: 0 0 0 40px;
}

.module-contents ul {
  list-style-type: none;
}
.module-contents li {
  font-weight: 300;
  font-size: 1.2rem;
  position: relative;
}
.module-contents li:before {
  position: absolute;
  font-family: "Glyphicons Halflings";
  content: "\e250";
  left: 0;
  top: 5px;
  color: #010101;
  font-size: 75%;
  -webkit-transform: translateX(-24px);
  -ms-transform: translateX(-24px);
  transform: translateX(-24px);
  transition: 0.3s ease-out;
}
.module-contents li:hover:before {
  -webkit-transform: translateX(-20px);
  -ms-transform: translateX(-20px);
  transform: translateX(-20px);
  transition: 0.3s ease-out;
}
.module-contents li li {
  font-weight: 200;
  font-size: 100%;
}
.module-contents li a {
  color: #999999;
}

h3.contents-heading {
  background-color: #010101;
  display: inline-block;
  color: #ffffff;
  padding: 5px 20px 5px 10px;
  border-radius: 0 20px 20px 0;
  font-size: 1.2rem;
}
@media only screen and (min-width: 768px) {
  h3.contents-heading {
    font-size: 1.5rem;
  }
}
@media only screen and (min-width: 992px) {
  h3.contents-heading {
    margin-left: -15px;
  }
}

#moduleTree .dd-list .dd-handle a:before, #moduleTree .action-buttons a:before {
  font-family: "Glyphicons Regular";
  content: "\e224";
  font-style: normal;
  font-weight: normal;
  line-height: 1.2;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: block;
  position: absolute;
  left: -10px;
  -webkit-transition: 0.2s ease 0s;
  -o-transition: 0.2s ease 0s;
  transition: 0.2s ease 0s;
}

#moduleTree .dd-list .dd-handle:hover a:before, #moduleTree .action-buttons a:hover:before {
  left: -5px;
  -webkit-transition: 0.2s ease 0s;
  -o-transition: 0.2s ease 0s;
  transition: 0.2s ease 0s;
}

#moduleTree {
  list-style-type: none;
  margin-left: 0;
}
#moduleTree .module-division {
  text-transform: uppercase;
  font-weight: 700;
}
#moduleTree .action-buttons a {
  font-weight: 400;
  text-transform: initial;
  font-size: 1.1rem;
  margin: 0 3px;
  position: relative;
  padding: 5px 12px 5px 13px;
  line-height: 1;
}
@media only screen and (min-width: 768px) {
  #moduleTree .action-buttons a {
    font-size: 1.2em;
    margin: 2px 3px;
    line-height: 1.2em;
  }
}
#moduleTree .action-buttons a:hover {
  transform: none;
}
#moduleTree .dd-handle {
  background: transparent;
  border: none;
  color: inherit;
  margin: 0;
  padding: 5px 12px 5px 13px;
  min-height: 0;
  font-size: 1.1rem;
  line-height: 1.2em;
  position: relative;
}
#moduleTree .dd-list {
  margin-left: 40px;
  margin-bottom: 15px;
  text-transform: none;
}
#moduleTree .dd-list .dd-handle {
  font-weight: 400;
}
#moduleTree .dd-item {
  min-height: 0;
  line-height: 0;
  padding: 5px 12px 5px 25px;
}
#moduleTree .dd-empty {
  min-height: 0;
  line-height: 0;
  padding: 5px 12px 5px 25px;
}
#moduleTree .dd-placeholder {
  min-height: 0;
  line-height: 0;
  padding: 5px 12px 5px 25px;
}

div .training-alert-notifications:before {
  background-image: url(../images/Icons/notifications-white.svg);
}
div .training-alert-courses:before {
  background-image: url(../images/Icons/courses-white.svg);
}
div .training-alert-modules:before {
  background-image: url(../images/Icons/completed-white.svg);
}
div .training-alert-score:before {
  background-image: url(../images/Icons/score-white.svg);
}

.module-score:before {
  background-image: url(../images/Icons/score-white.svg);
}

.module-score:before {
  background-image: url(../images/Icons/score-white.svg);
}
.module-score > div {
  background-color: #ffffff;
  color: #3363AF;
  font-size: 1.5rem;
  border-color: #CCCCCC;
  margin-top: 20px;
}

.back-gradient, div[class*=training-alert].back-gradient {
  background: rgb(225, 227.8, 233.4);
}

.row.training.training-callouts > div {
  padding: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.row > div.training-callouts {
  border-radius: 0;
  border: none;
  background: #ffffff;
  background: -moz-linear-gradient(right, #CCCCCC 0%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%);
  background: -webkit-linear-gradient(right, #CCCCCC 0%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%);
  background: linear-gradient(to left, #CCCCCC 0%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#e4e4e4", endColorstr="#e4e4e4",GradientType=1 );
}
.row > div.training-callouts + .training {
  background-color: #f7f7f7 !important;
  padding: 0;
}
.row.training-details > div:last-child {
  border-radius: 0;
  border: none;
  background: #ffffff;
  background: -moz-linear-gradient(right, #CCCCCC 0%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%);
  background: -webkit-linear-gradient(right, #CCCCCC 0%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%);
  background: linear-gradient(to left, #CCCCCC 0%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#e4e4e4", endColorstr="#e4e4e4",GradientType=1 );
}

.training-module-intro .training-certificate, div[class*=training-alert], .module-score {
  text-align: center;
  text-transform: uppercase;
  position: relative;
  padding: 100px 0 0 !important;
  font-weight: 300;
  font-size: 1.1rem !important;
  color: #ffffff !important;
}

.training-module-intro .training-certificate i, div[class*=training-alert]:before, .module-score:before {
  position: absolute;
  display: block;
  content: "";
  width: 30%;
  height: 70px;
  margin: 0 10px;
  background-size: contain;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  top: 15px;
  left: calc(35% - 10px);
}

.module-score {
  background-color: #f7f7f7 !important;
  font-size: 1.2em;
}
div[class*=training-alert] {
  background-color: #f7f7f7 !important;
  border-radius: 0;
  box-shadow: none;
  margin: 20px 0 0;
}
div[class*=training-alert] > div {
  font-size: 1.2rem;
  background-color: #ffffff;
  color: #3363AF;
  font-size: 1.5rem;
  border: 1px solid #CCCCCC;
  margin-top: 20px;
}

.training-module-intro .training-certificate {
  background-color: #999999 !important;
  padding: 10px 20px !important;
  text-align: left;
}
.training-module-intro .training-certificate i {
  background-image: url(../images/Icons/certificate-white.svg);
  position: static !important;
  display: inline-block !important;
  margin: 0 5px 0 0 !important;
  width: 25% !important;
  vertical-align: middle;
}
.training-module-intro .training-certificate a.certificate-button {
  display: inline-block;
  width: 70%;
  vertical-align: middle;
  color: #ffffff;
}

.training-contact a {
  font-weight: 600;
  color: #666666;
  border-bottom: #010101 3px solid;
  text-decoration: none;
  position: relative;
  margin-left: 30px;
  font-size: 85%;
}
.training-contact a:before {
  position: absolute;
  font-family: "Glyphicons Halflings";
  content: "✉";
  left: -28px;
  top: -2px;
  color: #666666;
}
.training-contact a:hover {
  color: #666666;
}
.training-contact a:hover:before {
  background-color: #010101;
}
.training-contact a:focus {
  color: #666666;
}

.training-module-courses {
  margin: 20px 0 0;
  padding: 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
@media only screen and (min-width: 1175px) {
  .training-module-courses {
    margin: 20px -10px 0;
  }
}
.training-module-courses > .card.card-course > .container-centre-me {
  max-height: 300px;
}

.card.card-course {
  margin: 0 10px 10px;
  background-color: #ffffff;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 350px;
  flex: 1 1 356px;
  max-width: none;
}
.card.card-course .status.course-results > .course-status > .course-title {
  max-width: 55%;
}
@media only screen and (min-width: 1018px) {
  .card.card-course .status.course-results > .course-status > .course-title .card.card-course .status.course-results > .course-status > .course-title {
    max-width: 55%;
  }
}
@media only screen and (min-width: 768px) {
  .card.card-course .card-body {
    padding: 5%;
  }
}

.status.course-results {
  font-size: 0.9em;
  padding: 2px 10px;
  font-weight: 300;
  text-transform: uppercase;
  position: relative;
  text-align: right;
  color: #3363AF;
  color: #3363AF;
  border: 1px solid #CCCCCC;
  border-radius: 0 20px 20px 0;
}
.status.course-results > .course-status {
  border: 1px solid #CCCCCC;
  border-radius: 0 20px 20px 0;
  background-color: #00AAE7;
  color: #ffffff;
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100% - 56px);
  text-align: right;
  z-index: 2;
  padding: 2px 15px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  padding: 1px 10px 4px;
}
.status.course-results > .course-status > .course-title {
  color: #ffffff;
  background-color: #010101;
  padding: 2px 15px;
  border-radius: 0 20px 20px 0;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  text-align: left;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  padding: 1px 10px 4px;
}

.test-score, .cell-status, .test-attempts {
  display: inline-block;
  border: 1px solid #CCCCCC;
  padding: 2px 12px;
  border-radius: 20px;
  margin: 5px 0;
  vertical-align: middle;
  background-color: #ffffff;
}

.cell-status {
  color: #ffffff;
  display: block;
  text-transform: uppercase;
  text-align: center;
}

.test-score {
  float: right;
}

.training-dashboard {
  position: relative;
}
@media only screen and (min-width: 550px) {
  .training-dashboard {
    min-height: 500px;
  }
}
.training-dashboard .training-list {
  width: 100%;
  padding-bottom: 20px;
}
@media only screen and (min-width: 768px) {
  .training-dashboard .training-list {
    padding-right: 15px;
    width: 60%;
  }
}
@media only screen and (min-width: 1056px) {
  .training-dashboard .training-list {
    width: 50%;
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media only screen and (min-width: 600px) {
  .training-dashboard .training-list .data-row .div-cell {
    font-size: 17px;
  }
}
.training-dashboard .module-information {
  width: 100%;
}
@media only screen and (min-width: 768px) {
  .training-dashboard .module-information {
    width: 40%;
    position: absolute;
    top: 60px;
    right: 0;
  }
}
@media only screen and (min-width: 1056px) {
  .training-dashboard .module-information {
    width: 50%;
    padding-left: 15px;
    padding-right: 15px;
    position: absolute;
    top: 20px;
    right: 0;
  }
}
@media only screen and (min-width: 768px) {
  .training-dashboard .module-information div.well {
    max-height: 460px;
    overflow: auto;
    margin-left: 2%;
  }
}
@media only screen and (min-width: 1170px) {
  .training-dashboard .module-information div.well {
    margin-left: 0;
  }
}
.training-dashboard .training-status {
  width: 100%;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #CCCCCC;
}
@media only screen and (min-width: 768px) {
  .training-dashboard .training-status {
    width: 60%;
  }
}
@media only screen and (min-width: 1056px) {
  .training-dashboard .training-status {
    width: 50%;
    padding-left: 15px;
    padding-right: 15px;
  }
}
.training-dashboard .training-status > div {
  padding-bottom: 10px;
  width: 100%;
  text-align: center;
  color: #999999;
  border-bottom: 1px solid #CCCCCC;
  display: block !important;
}
@media only screen and (min-width: 550px) {
  .training-dashboard .training-status > div {
    width: 49%;
    border-bottom: none;
    border-right: 1px solid #CCCCCC;
    display: inline-block !important;
    vertical-align: top;
  }
}
.training-dashboard .training-status > div:last-child {
  border-bottom: none;
}
.training-dashboard .training-status > div:first-child {
  font-weight: 200;
}
.training-dashboard .training-status > div:first-child div:first-child {
  font-size: 1.2rem;
}
@media only screen and (min-width: 1170px) {
  .training-dashboard .training-status > div:first-child div:first-child {
    font-size: 1.6rem;
  }
}
.training-dashboard .training-status > div:first-child span.label {
  font-weight: 600;
  line-height: initial;
}
.training-dashboard .training-status > div:first-child:last-child {
  border-right: none;
  width: 100%;
  text-align: left;
  padding-left: 0;
}
@media only screen and (min-width: 550px) {
  .training-dashboard .training-status > div:first-child:last-child {
    width: auto;
    max-width: 48%;
    padding-left: 2%;
  }
}
.training-dashboard .training-status > div:first-child:last-child div {
  display: block;
}
@media only screen and (min-width: 550px) {
  .training-dashboard .training-status > div:first-child:last-child div {
    display: inline-block;
    vertical-align: middle;
  }
}
.training-dashboard .training-status div.overall-training-score {
  text-align: center;
}
@media only screen and (min-width: 550px) {
  .training-dashboard .training-status div.overall-training-score {
    border: 3px solid #f7f7f7;
    border-radius: 50px;
    height: 100px;
    width: 100px;
  }
}
@media only screen and (min-width: 1200px) {
  .training-dashboard .training-status div.overall-training-score {
    border-radius: 65px;
    height: 120px;
    width: 120px;
  }
}
.training-dashboard .training-status div.overall-training-score + div {
  font-size: 1.2rem;
  width: 100%;
  line-height: 1em;
  margin-left: 0;
  color: #999999;
  font-weight: 200;
  text-align: center;
}
@media only screen and (min-width: 550px) {
  .training-dashboard .training-status div.overall-training-score + div {
    font-size: 1.2rem;
    width: auto;
    max-width: 43%;
    line-height: 1.2em;
    margin-left: 2%;
    font-weight: 200;
    text-align: left;
  }
}
@media only screen and (min-width: 1200px) {
  .training-dashboard .training-status div.overall-training-score + div {
    font-size: 1.63rem;
  }
}
@media only screen and (min-width: 550px) {
  .training-dashboard .training-status div.overall-training-score span {
    display: inline-block;
    line-height: 1.5;
    font-weight: 400;
    font-size: 350%;
  }
}
@media only screen and (min-width: 1200px) {
  .training-dashboard .training-status div.overall-training-score span {
    line-height: 1.9;
  }
}
.training-dashboard .training-status div.overall-training-score span span.label small {
  font-size: 50%;
}
.training-dashboard .training-status span.label {
  font-size: 200%;
  font-weight: 200;
  background: transparent;
  padding: 10px;
  display: block;
}
@media only screen and (min-width: 1200px) {
  .training-dashboard .training-status span.label {
    font-size: 260%;
    line-height: 110px;
    display: inline;
  }
}
.training-dashboard .training-status span.label .label-success {
  color: #0a6242;
}
.training-dashboard .training-status span.label.label-warning {
  color: #EDAD44;
}
.training-dashboard .training-status span.label.label-danger {
  color: #a94442;
}
.training-dashboard-banner {
  position: relative !important;
  padding: 0;
  height: 231px;
}

.training.main-menu {
  height: 231px;
}
.student-dashboard .training.training-module-page-title {
  text-align: center;
  margin-top: -0.9em;
  position: relative;
}
.student-dashboard .training.training-module-page-title > span {
  color: #ffffff;
  background-color: #010101;
  padding: 7px 40px;
  border-radius: 30px;
  font-size: 1.2em;
  font-weight: 300;
  text-transform: uppercase;
}
.training.training-module-intro {
  max-width: 1140px;
  margin: 0 auto;
}
.training .div-cell.module-status.cell-Incomplete:before {
  background-color: #EDAD44;
}
.training .training-intro {
  background-color: #f7f7f7;
  margin-bottom: 0;
  padding: 10px 15px;
  font-size: 1rem;
}
@media only screen and (min-width: 768px) {
  .training .training-intro {
    font-size: 1.2rem;
    padding: 20px 40px;
  }
}
.student-dashboard .training .training-intro {
  background-color: #00AAE7;
  color: #ffffff;
}

.training-details > div {
  border: 1px solid #CCCCCC;
  padding: 0;
  margin: 0;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}
@media only screen and (min-width: 768px) {
  .training-details > div {
    padding: 15px;
  }
}
.training-details > div:first-child {
  border-radius: 6px 6px 0 0;
  border-bottom: none;
}
.training-details > div:last-child {
  border-radius: 0 0 6px 6px;
  border-top: none;
}
@media only screen and (max-width: 767px) {
  .training-details > div.training-callouts {
    width: 100%;
  }
}
.training-details-outer {
  background-color: #f7f7f7;
}

div.training-details h2 {
  font-weight: 200;
  margin: 0 0 15px;
}

.row.training.training-details {
  max-width: 1140px;
  margin: 1rem auto 1.5rem;
}
.row.training.training-details > div:first-child {
  border-radius: 0;
  background-color: transparent;
  border: none;
}

.training-list > h3 {
  font-weight: 200;
  font-size: 160%;
  padding-top: 0;
}

.offline-map .container-centre-me {
  width: 100%;
  height: 160px;
  overflow: hidden;
}

.training-offline-info {
  background-color: #6fc9c7;
  color: #ffffff;
  font-weight: 700;
  padding: 10px 50px;
}
@media only screen and (min-width: 430px) {
  .training-offline-info {
    padding: 10px 50px;
  }
}
.training-offline-info .glyphicons {
  margin: 0 0.3rem 0 0.7rem;
  font-size: 1.2rem;
  vertical-align: text-top;
}
.training-offline-info-row {
  margin: 0;
}
.training-offline-info-buttons {
  padding: 0 !important;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.training-offline-info a.btn {
  font-size: 1rem;
  color: #ffffff;
  font-weight: 400;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
}
@media only screen and (min-width: 430px) {
  .training-offline-info a.btn {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
}
.training-offline-info a.btn small {
  font-size: 70%;
}
.training-offline-info a.btn.cell-cancel {
  background-color: #a94442 !important;
  width: 100%;
}

.offline-training-details-outer {
  margin-top: 20px;
  padding-left: 50px;
  padding-right: 50px;
}
.Instructor .offline-training-details-outer {
  padding-left: 10px;
  padding-right: 10px;
}

.training-test-details .offline-map {
  margin-top: 20px;
}

ul.offline-details {
  margin: 20px 0;
  font-weight: 400;
  list-style-type: none;
  line-height: 1.6rem;
}
ul.offline-details li {
  position: relative;
  padding-left: 1.7rem;
  margin-bottom: 5px;
}
ul.offline-details li span.glyphicons {
  position: absolute;
  left: 0;
  top: 3px;
}

a.btn.cell-accept {
  color: #0a6242 !important;
}
a.btn.cell-decline {
  color: #EDAD44 !important;
}

#map {
  width: 100%;
  height: 100%;
}

.training-notice {
  border: 1px solid #ffffff;
  padding: 0.5rem 1rem;
  background-color: #f7f7f7;
  margin: 10px 0 0 0;
}
.training-notice > h3 {
  margin-top: 0.5rem;
}

.progress-area h5 {
  font-size: 1rem;
  margin-bottom: 5px;
}

.training-test-results div.div-row {
  padding-bottom: 10px;
  margin-bottom: 10px;
  font-size: 90%;
  border-bottom: 1px solid #f7f7f7;
}
.training-test-results div.div-row-cell {
  font-size: 90%;
  vertical-align: top;
}
.training-test-results div.div-row-cell.test-title {
  width: 75%;
  margin-right: 4%;
}
.training-test-results div.div-row-cell.test-score {
  width: 19%;
  text-align: right;
}
.training-test-results div.div-row-cell a {
  color: #666666;
  line-height: 1.5;
  font-weight: 600;
}
.training-test-results div.div-row-cell .label {
  font-size: 100%;
  margin-top: 5px;
  display: block;
}

.module-final-results .training-test-results div.div-cell {
  font-size: 100%;
}

div.training-status > div.div-cell {
  width: 49%;
  text-align: center;
  border-left: 1px solid #CCCCCC;
  vertical-align: top;
}
div.training-status > div.div-cell:first-child {
  border: none;
}

.training-status > div.div-cell .label {
  background: transparent;
  font-weight: 200;
  font-size: 30px;
  display: block;
  padding: 0;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  border-radius: 0;
}
.training-status > div.div-cell .label.label-success {
  color: #0a6242;
}
.training-status > div.div-cell .label.label-warning {
  color: #EDAD44;
}
.training-status > div.div-cell .label.label-danger {
  color: #a94442;
}
.student-dashboard .training-status .status.training-overall {
  margin: 10px 20px;
}

.status.training-overall {
  background-color: #EDAD44;
  color: #ffffff;
  text-transform: uppercase;
  text-align: center;
  border-radius: 75px;
  font-weight: 300;
  line-height: 1em;
  padding: 5px;
}
.status.training-overall.score-pass {
  background-color: #0a6242;
  color: #ffffff;
  border-color: rgb(6, 58.8, 39.6);
}
.status.training-overall.score-fail {
  background-color: #a94442;
  color: #ffffff;
  border-color: rgb(101.4, 40.8, 39.6);
}
.status.training-overall.score-Incomplete {
  background-color: #EDAD44;
}
.status.training-overall span.training-period {
  font-size: 75%;
  letter-spacing: initial;
  padding-top: 0;
  margin-top: 3px;
  display: block;
}

.div-row.data-row:not(.group-heading).div-cell.module-status.cell-pass:before {
  background-color: #0a6242;
  color: #ffffff;
}
.div-row.data-row:not(.group-heading).div-cell.module-status.cell-fail:before {
  background-color: #a94442;
  color: #ffffff;
}
.div-row.data-row:not(.group-heading).div-cell.module-status.cell-incomplete:before {
  background-color: #EDAD44;
  color: #ffffff;
}
.div-row.data-row:not(.group-heading).div-cell.module-score.module-Incomplete {
  background-color: #EDAD44;
}

div.data-header div.div-cell {
  font-size: 100%;
  font-weight: 400;
  border-bottom: 1px solid #CCCCCC !important;
  margin: 0;
  vertical-align: bottom;
  white-space: nowrap;
}
div.div-cell.cell-pass {
  text-align: center;
  background-color: #0a6242;
  color: #ffffff;
}
div.div-cell.cell-Pass {
  text-align: center;
  background-color: #0a6242;
  color: #ffffff;
}
div.div-cell.cell-fail {
  text-align: center;
  background-color: #a94442;
  color: #ffffff;
}
div.div-cell.cell-Fail {
  text-align: center;
  background-color: #a94442;
  color: #ffffff;
}
div.div-cell.cell-incomplete {
  text-align: center;
  background-color: #EDAD44;
}
div.div-cell .cell-Incomplete {
  text-align: center;
  background-color: #EDAD44;
}
div.div-cell.cell-score {
  text-align: right;
}

.training-test-details .div-row.data-row:not(.group-heading) {
  background-color: #e4dfe9;
}
.training-test-details .div-row.data-row:nth-child(odd) {
  background-color: #e3e0d9;
}
.training-test-details .div-row .div-cell {
  font-size: 1.3rem;
  padding: 3px 5px;
  border-bottom: 1px solid #CCCCCC;
}
.training-test-details.div-cell.test-score {
  font-weight: 600;
  text-align: right;
}
.training-test-details .test-row {
  padding: 10px;
  border-bottom: 1px solid #CCCCCC;
}
.training-test-details .test-row:last-child {
  border-bottom: none;
}

.test-title a {
  color: #3e3b3f !important;
  text-decoration: none;
  font-weight: 400;
}

.panel.training-module-group {
  border-radius: 0;
  border: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.panel-default.training-module-group > .panel-heading {
  background-color: transparent;
  border: none;
  padding: 0;
  border-radius: 0;
}

/*! Pages: Offline style sheet for Battersea Systems 21/7/2021 */
.row.formatting-example {
  margin-bottom: 2rem;
  border-top: 1px solid #CCCCCC;
  padding-top: 1rem;
}

/*! Pages: Login style sheet for Battersea Systems 1/10/2025 */
.admin-login div.outer {
  position: relative;
  background: url("/content/images/login-steel-geometric.jpg");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  min-height: 100%;
  background-position-x: 100%;
}
.admin-login .modal-open .modal.show {
  display: grid !important;
  align-content: center;
  justify-content: center;
}
.admin-login .modal-dialog .modal-content {
  padding: 0;
}
.admin-login .modal-dialog .modal-header {
  flex-direction: row-reverse;
  align-items: center;
}
.admin-login .modal-dialog * .modal-header *.modal-title {
  padding: 0;
}
.admin-login .modal-dialog .modal-body {
  padding: 1rem 2rem;
}

.introduction button.navbar-toggle.collapsed {
  display: none;
}
.introduction body > .container {
  padding-top: 120px;
  padding-bottom: 100px;
}
@media only screen and (min-width: 768px) {
  .introduction body > .container {
    padding-top: 140px;
  }
}
@media only screen and (min-width: 768px) {
  .introduction .ResellerLogo {
    display: block;
  }
}
@media only screen and (min-width: 768px) {
  .introduction .navbar.shrink .ResellerLogo {
    margin-top: 0;
    padding: 0px;
    margin: 10px 0;
    height: 25px;
    width: 260px;
    background-size: 260px;
  }
}

.introbox p, .introbox h6, .introbox h5, .introbox h4, .introbox h3, .introbox h2, .introbox h1 {
  font-family: "Helvetica", Helvetica, Arial, sans-serif;
  color: #ffffff;
  text-align: center;
}

.introbox {
  position: relative;
  background-color: rgba(102, 102, 102, 0.4);
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0;
  margin: 42px 0;
  max-width: none !important;
  flex: none !important;
}
@media only screen and (min-width: 768px) {
  .introbox {
    background-color: rgba(102, 102, 102, 0.5);
    max-width: 500px;
    height: auto;
    text-align: center;
    border-radius: 50px 0px;
    margin: 130px 0;
  }
}
@media only screen and (min-width: 1056px) {
  .introbox {
    width: 700px;
  }
}
.introbox h1:first-of-type {
  font-size: 24px;
  top: 5px;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .introbox h1:first-of-type {
    margin-top: 10px;
    font-size: 2rem;
    position: static;
    text-align: inherit;
    width: auto;
  }
}
@media only screen and (min-width: 1056px) {
  .introbox h1:first-of-type {
    font-size: 3rem;
    margin-top: 5px;
    text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.71);
  }
}
.introbox h1 + * {
  font-size: 1.4rem;
}
@media only screen and (min-width: 1056px) {
  .introbox h1 + * {
    font-size: 2rem;
    text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.71);
  }
}
.introbox p {
  font-size: 1.3rem;
}
@media only screen and (min-width: 1056px) {
  .introbox p {
    font-size: 1.8rem;
    text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.71);
  }
}
@media only screen and (min-width: 768px) {
  .introbox .loginform {
    position: static;
    margin-top: 20px;
  }
}
@media only screen and (min-width: 1056px) {
  .introbox .loginform {
    margin-top: 18px;
  }
}
.introbox .loginform .form-group {
  justify-content: center;
}
.introbox form .btn {
  width: 80%;
}
@media only screen and (min-width: 768px) {
  .introbox form .btn {
    width: 80%;
  }
}
.introbox .alert-warning p {
  color: #EDAD44;
  font-size: initial;
  text-align: left;
  text-shadow: none;
}
.introbox .panel-heading {
  text-align: left !important;
}
.introbox .panel-title {
  color: #666666;
  padding-top: 0.4rem;
}
.introbox form .panel-heading .btn {
  width: auto;
}
.introbox div[class*=alert] {
  margin: 10px auto;
  padding: 10px 20px 10px 40px !important;
  font-size: 0.8rem;
  text-align: left;
  max-width: 80%;
}
.introbox div[class*=alert]:before {
  font-size: 20px;
}
@media only screen and (min-width: 1056px) {
  .introbox div[class*=alert] {
    margin: 20px auto;
    padding: 15px 40px 15px 70px !important;
    font-size: 1rem;
  }
  .introbox div[class*=alert]:before {
    font-size: 40px;
  }
}

@media only screen and (min-width: 430px) {
  .row > div.introbox {
    padding-top: 19px;
  }
}
@media only screen and (min-width: 992px) {
  .ceo-in-text {
    display: none;
  }
}
.second-authentication {
  display: grid;
  justify-content: center;
  align-content: center;
  min-height: 100vh;
  height: 100%;
}
.second-authentication.manage-number {
  position: static;
}
@media only screen and (min-width: 768px) {
  .second-authentication.manage-number label {
    margin-right: 10px;
  }
}
.second-authentication .auth-code {
  background: rgba(255, 255, 255, 0.8);
  border-radius: 1em;
  padding: 1em 2em;
}
.second-authentication .auth-code .checkbox input[type=checkbox] {
  margin-left: 0px;
}

.user-profile .second-authentication {
  min-height: 0;
  height: auto;
}

/*! Pages: Offline style sheet for Battersea Systems 22/7/2021 */
/**************************** Instructor Adjustments - Offline Module page */
.row.training-offline-attendee-row {
  border-bottom: 1px solid #CCCCCC;
  margin: 0;
  line-height: 2.5em;
}
.row:hover .training-offline-attendee-name {
  background-color: #CCCCCC;
}

.training-offline-attendee-toggle {
  text-align: center;
  color: #ffffff;
  opacity: 0.8;
}
.training-offline-attendee-toggle:hover {
  text-align: center;
  color: #ffffff;
  opacity: 1;
}
.training-offline-attendee-toggle i.glyphicons {
  margin: 0 !important;
}
.training-offline-attendee-toggle.absent {
  background-color: #bbddd8;
}
.training-offline-attendee-toggle.attending {
  background-color: #0a6242;
}

/*! Pages: Reports style sheet for Battersea Systems 11/8/2021 */
.reports-group {
  margin: 0 0 20px 0;
  padding: 20px;
  background-color: #f7f7f7;
  border: 1px solid #CCCCCC;
  border-radius: 10px;
}
.reports-group h3 {
  margin-top: 0;
}

.report-applied-filter-group {
  background: rgba(0, 0, 0, 0.1);
  padding: 2rem 3rem;
  border-radius: 4px;
}

.report-applied-filter-row, p[ng-bind-html=AppliedFilter] {
  background-color: rgba(0, 0, 0, 0.6);
  padding: 0.2em 0.2em 0.2em 0.8em;
  border-radius: 1em;
  margin-right: 1em;
  white-space: nowrap;
}

.report-filter-item.filter-item {
  display: inline-block;
  color: #ffffff;
  font-weight: 400;
  margin-right: 0.5em;
  border: none;
}
.report-filter-item.filter-function {
  display: inline-block;
  background-color: #ffffff;
  border: none;
  text-align: center;
  border-radius: 1em;
  width: 1.6em;
  cursor: pointer;
}
.report-filter-item.filter-function .glyphicons {
  margin-right: 0;
  font-size: 1.2rem;
}
.report-filter-item.filter-function:hover {
  background: #a94442;
  border: none;
}
.report-filter-item.filter-function:hover .glyphicons {
  color: #ffffff;
  border: none;
}

p[ng-bind-html=AppliedFilter] {
  display: inline-block;
  color: #ffffff;
  border: 1px solid;
  font-weight: 700 !important;
  padding: 0.05em 0.8em 0.2em;
}

.report-applied-filter-row.ng-scope {
  display: inline-flex;
}

.applied-filter {
  background-color: #f7f7f7;
  border: 1px solid;
  padding: 0 5px 2px 8px;
  border-radius: 15px;
  margin-right: 10px;
}

.remove-filter {
  background-color: rgb(193.2127659574, 98.6595744681, 96.7872340426);
  display: inline-block;
  height: 1.2em;
  line-height: 1em;
  color: #ffffff;
  border: 1px solid;
  padding: 0 5px;
  border-radius: 9px;
}
.remove-filter:hover {
  background-color: rgb(101.4, 40.8, 39.6);
}

/*! Pages: Results style sheet for Battersea Systems 4/1/2024 */
.panel.training-results {
  margin: 2em 15px 1em;
  width: calc(100% - 30px);
}
@media only screen and (min-width: 768px) {
  .panel.training-results {
    margin: 2em 2em 1em;
    width: calc(100% - 4em);
  }
}
.panel.training-results .your-answers {
  grid-gap: 0;
}

.results.question-test {
  font-weight: 600;
}

.results-question-summary {
  margin: 1em 0;
  font-size: 1.1em;
  padding: 0;
}
@media only screen and (min-width: 768px) {
  .results-question-summary {
    padding: 0.5em 1em 1em;
  }
}
.results-question-summary .dashboard-title h4 {
  font-weight: 600;
  font-size: 1.2em;
  margin: 0.5em 0;
}

.training.results-question-summary {
  border-top: 1px solid #999999;
  margin-bottom: 1em;
}
.training.results-question-summary .col-sm-6 {
  padding-left: 0;
  padding-right: 0;
}
.training.navigation {
  margin-top: 0.5em;
}
@media only screen and (min-width: 768px) {
  .training.navigation {
    margin: 0.5em 1.5em;
  }
}
.training.test-summary {
  font-size: 1.2em;
  border-top: 1px solid #999999;
  border-bottom: 1px solid #999999;
}
@media only screen and (min-width: 768px) {
  .training.test-summary {
    margin: 0.5em 1.5em;
  }
}
.training.test-summary > div {
  padding: 1em;
}

.question.answer-summary {
  margin: 15px 0;
}
.question.answer-title {
  color: #ffffff;
  padding: 5px 1em;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 0.25em;
  background-color: #00AAE7;
}
@media only screen and (min-width: 768px) {
  .question.answer-title {
    margin-bottom: 0.75em;
  }
}
.question.correct-summary {
  margin: 0.75em 0;
}
.question.correct-title {
  color: #ffffff;
  padding: 5px 1em;
  font-weight: 600;
  text-transform: uppercase;
  background-color: #0a6242;
  margin-bottom: 5px;
}
@media only screen and (min-width: 768px) {
  .question.correct-title {
    margin-bottom: 0.75em;
  }
}
.question-results.summary-answer {
  padding: 10px 1em;
  background-color: transparent !important;
  position: relative;
  padding: 0.5em 1em 0.5em 3em;
}
.question-results.summary-answer:before {
  position: absolute;
  top: 12px;
  left: 5px;
  font-size: 1.5rem;
  font-family: "Glyphicons Regular";
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  vertical-align: top;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.question-results.summary-answer.status-pass:before {
  content: "\e207";
  color: #0a6242;
}
.question-results.summary-answer.status-fail:before {
  content: "\e208";
  color: #a94442;
}
.question-correct.summary-answer {
  padding: 0.5em 1em;
  color: #ffffff;
}
.question.why-summary {
  background-color: #f7f7f7;
  margin-top: 5px;
}
.question.why-summary > div {
  padding: 0.5em 1em;
}

.status-default {
  background-color: #628ec5 !important;
}

.why.summary-title {
  vertical-align: top;
  font-weight: 600;
  font-size: 1.2em;
  width: 100%;
  min-width: 120px;
}
@media only screen and (min-width: 768px) {
  .why.summary-title {
    width: 15%;
  }
}

/*! Pages: Module Results Overview style sheet for Battersea Systems 29/7/2021 */
.testing.summary-title {
  margin: 0 15px;
}

.training.training-module-summary {
  margin-top: 40px;
}
.training.training-summary {
  border: 1px solid rgba(0, 0, 0, 0.1);
  padding: 15px 30px;
  margin: 0 15px;
}
.training.training-module-certificate {
  text-align: center;
}
.training.navigation.training-module-navigation {
  text-align: center;
}
.training.navigation.training-module-navigation > a {
  border-radius: 50px;
  padding: 7px;
  font-size: 1.3rem;
  line-height: 1rem;
}
.training.navigation.training-module-navigation .glyphicons {
  margin-right: 0;
}

.training-summary .div-table.data-table {
  display: inline-table;
  width: 100%;
}
.training-summary .div-row.data-row {
  display: table-row;
}
.training-summary .div-row .div-cell {
  display: table-cell;
}
.training-summary div.data-header div.div-cell {
  font-size: 120%;
  font-weight: 700;
  border-bottom: 1px solid #CCCCCC !important;
}
.training-summary div.div-cell.test-pass {
  width: 15%;
  text-align: center;
}
.training-summary div.div-cell.test-score {
  border-radius: 0;
  float: none;
  border: none;
  width: 15%;
  text-align: center;
  padding: 0;
}
.training-summary div.div-cell.test-title {
  width: 50%;
}
.training-summary div.div-cell.module-pass {
  width: 15%;
  text-align: center;
}
.training-summary div.div-cell.module-score {
  width: 15%;
  text-align: center;
}
.training-summary div.div-cell.module-title {
  width: 50%;
}
.training-summary .module-score {
  background: transparent;
  color: #666666 !important;
  text-transform: none;
  font-size: 120% !important;
  padding: 0 !important;
}
.training-summary .module-score:before {
  display: none;
}
.training-summary .cell-status {
  font-size: 0.8rem;
}

/*! Pages: Search style sheet for Battersea Systems 21/7/2021 */
.searchResults, .search-form {
  margin: 0 0 10px 0;
  padding: 20px;
  background-color: #f7f7f7;
  border-color: #CCCCCC;
  border-radius: 10px;
}

.search-form {
  margin-top: 25px;
}
.search-form .form-group {
  margin-top: 0;
  margin-left: 0;
}

.searchResults h4 {
  margin-top: 0;
  margin-left: 0;
}
.searchResults .small {
  font-size: 70%;
}
.searchResults .has-search {
  background-color: rgb(102.6, 102.6, 102.6);
  padding-left: 5px;
  padding-right: 5px;
  color: #ffffff;
  padding-bottom: 4px;
  border-radius: 5px;
  margin: 0 5px;
}

/*! Pages: Support style sheet for Battersea Systems 10/8/2021 */
/**************************************************  Support Tickets  ************/
.ticket div.comments {
  margin: -15px;
}
.ticket div.comments > .dialogs {
  margin-left: 15px;
}
.ticket div.comments > .dialogs:first-child {
  margin-top: 15px;
}
.ticket .user.circle {
  border: 2px solid #000000;
  top: -4px;
}
.ticket .user.circle > .user-info {
  line-height: 2.7rem;
  font-size: 1.3rem;
  text-transform: uppercase;
  color: #000000;
}

/**************************************************  Help page  ************/
.help.help-manual {
  display: none;
}

/*! Pages: Testing style sheet for Battersea Systems 15/11/2022 */
.module-final-results, .module-test-question-results, .module-test-question, .email-form {
  margin: 0 0 20px 0;
  padding: 20px;
  background-colour: #f7f7f7;
  border: 1px solid #CCCCCC;
  border-radius: 10px;
}

div.module-test-results {
  margin-left: 0;
  margin-right: 0;
  margin-top: 20px;
}
@media only screen and (min-width: 768px) {
  div.module-test-results {
    margin-right: 15%;
  }
}

.module-test form.form-horizontal {
  padding: 0 20px;
}
.module-test-question-results .test-question div h3 {
  margin-top: 0;
}
.module-test-question *:first-child {
  margin-top: 0;
}
.module-test-results > .training-status {
  border-bottom: 1px solid #CCCCCC;
  padding-bottom: 20px;
}
.module-results .training-test-results h2 {
  margin-top: 0;
}
.module-results .training-test-results h2 div.div-row:first-of-type {
  margin-top: 20px;
}
.module-results .training-test-results h2 * > .training-status h2 {
  margin-top: 10px;
}
.module-results .training-test-results h2 > .training-status h2 {
  margin-top: 10px;
}

.test-question {
  font-weight: 700;
}

.testing-title .group-heading h3 {
  font-weight: 300;
  margin-left: 20px;
}
.testing-title .dashboard-title h4 {
  font-weight: 300;
  margin-left: 20px;
}
.testing-title .dashboard-title h4 span.test-question-number {
  float: right;
}
.testing.test-scene {
  background-color: #ebebeb;
  margin: 20px 0;
  padding: 10px 20px 20px;
  font-size: 1.1rem;
}

.review-content, .btn-results, .btn-toc, a.next-section, a.next-question, button.next-question {
  padding: 0;
  border-radius: 17px;
  line-height: 20px;
  width: 30px;
  text-align: center;
}
@media (min-width: 768px) {
  .review-content, .btn-results, .btn-toc, a.next-section, a.next-question, button.next-question {
    padding: 0 15px;
    width: auto;
  }
}

a.next-section i.glyphicons, a.next-question i.glyphicons, button.next-question i.glyphicons {
  margin-right: 0;
  left: 1px;
  top: 2px;
}

.question-answer input[type=radio], .question-answer input[type=checkbox] {
  position: absolute;
  top: -9999px;
  left: -9999px;
}
.question-answer input[type=radio] + label, .question-answer input[type=checkbox] + label {
  font-weight: normal;
  text-align: center;
  display: block;
  border: 1px solid #CCCCCC;
  line-height: 1.4em;
  border-radius: 6px;
  margin: 2px 0 10px;
  position: relative;
  padding: 0.5em 2em;
  min-width: 300px;
  min-width: 0;
  width: 100%;
}
@media only screen and (min-width: 768px) {
  .question-answer input[type=radio] + label, .question-answer input[type=checkbox] + label {
    min-width: 300px;
    width: 75%;
    margin: 2px 0 10px;
  }
}
.question-answer input[type=radio] + label > p:first-child, .question-answer input[type=checkbox] + label > p:first-child {
  margin-top: 0;
}
.question-answer input[type=radio] + label:before, .question-answer input[type=checkbox] + label:before {
  position: absolute;
  display: block;
  font-family: "Glyphicons Regular";
  font-style: normal;
  font-weight: 400;
  content: "\e433";
  line-height: 1.1;
  color: #CCCCCC;
  left: 5px;
  font-size: 1.3rem;
}
.question-answer input[type=radio]:checked + label, .question-answer input[type=checkbox]:checked + label {
  color: #ffffff;
  background-color: #628ec5;
  border-color: #628ec5;
}
.question-answer input[type=radio]:checked + label:before, .question-answer input[type=checkbox]:checked + label:before {
  content: "\e208";
  color: #ffffff;
}

.question-answer {
  margin-top: 20px;
}
.module-test .row.ng-scope {
  margin-left: 0;
  margin-right: 0;
}

/*! Pages: Training style sheet for Battersea Systems 14/9/2021 */
/**************************** Training Content */
.training-content .container {
  padding-right: 0;
  padding-left: 0;
}
@media only screen and (min-width: 768px) {
  .training-content .container {
    padding-right: 15px;
    padding-left: 15px;
    width: auto;
  }
}
.training-content .navbar-header {
  display: none;
}
.training-content div.outer {
  background-image: none !important;
}
.training-content img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 350px;
}
.training-content .img-big img {
  max-height: none !important;
}
.training-content-outer > br {
  display: none;
}
.training-content-outer > p {
  display: none;
}

div.text-box {
  padding: 1em 2em;
}

/**************************** Training Full Screen */
.full-screen .container {
  padding-right: 15px;
  padding-left: 15px;
}
.full-screen .training-navigation .btn-group {
  display: none;
}
.full-screen .training-header {
  display: none;
  position: absolute;
  top: 0;
}
.full-screen .content-pagetitle {
  display: none;
}
.full-screen .training-content img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 350px;
}
.full-screen .training-content .content-image img {
  max-height: none;
}
@media only screen and (min-width: 768px) {
  .full-screen ul.nav.navbar-nav {
    z-index: 100;
  }
}
.full-screen .container-row.image-grid {
  grid-template-columns: repeat(auto-fit, minmax(178px, 1fr));
}
.full-screen .training-footer {
  width: 100%;
  margin: 0 !important;
  padding: 0.5em 1em 0;
  background-color: rgba(255, 255, 255, 0.4);
  z-index: 1;
  grid-template-columns: repeat(2, 1fr) !important;
  grid-template-areas: "a a" "b c";
  padding-top: 0;
}
@media only screen and (min-width: 768px) {
  .full-screen .training-footer {
    position: sticky;
    bottom: 0;
    grid-template-columns: repeat(3, 1fr) !important;
    grid-template-areas: "a b c";
  }
}
.full-screen .training-footer > * {
  margin-bottom: 0em;
}
.full-screen .training-footer > .training-version {
  width: auto !important;
  display: flex !important;
  justify-content: center;
  grid-area: a;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .full-screen .training-footer > .training-version {
    text-align: left;
    padding-top: 0.3em;
  }
}
.full-screen .training-footer > .training-navigation {
  width: auto !important;
  /*display: flex!important;*/
  justify-content: center;
  grid-area: c;
  text-align: right;
}
.full-screen .training-footer > .training-page {
  width: auto !important;
  display: flex !important;
  justify-content: center;
  grid-area: b;
  text-align: left;
}
@media only screen and (min-width: 768px) {
  .full-screen .training-footer > .training-page {
    text-align: center;
  }
}

/**************************  Training Footer */
.training-footer {
  margin-top: 15px;
}
@media only screen and (min-width: 768px) {
  .training-footer {
    margin-top: 30px;
  }
}
.training-footer > div {
  display: inline-block;
}
@media only screen and (min-width: 768px) {
  .training-footer > div {
    float: left;
  }
}
.training-footer > div.training-version {
  display: none !important;
}
@media only screen and (min-width: 768px) {
  .training-footer > div.training-version {
    text-align: left;
    display: inline-block !important;
    width: 36% !important;
  }
}
.training-footer > div.training-version small {
  font-size: 55%;
}
.training-footer > div.training-navigation {
  text-align: right;
  width: 50%;
}
@media only screen and (min-width: 768px) {
  .training-footer > div.training-navigation {
    width: 50% !important;
  }
}
.training-footer > div.training-page {
  text-align: left;
  width: 50%;
}
@media only screen and (min-width: 768px) {
  .training-footer > div.training-page {
    width: 14% !important;
    text-align: center;
  }
}
.training-footer > .training-navigation:first-child {
  float: right;
}

/*! Pages: Welcome style sheet for Battersea Systems 20/7/2021 */
html.HRManager div.welcome-image {
  max-width: 1000px;
  margin: 0 auto;
}

/*! Pagination style sheet for Battersea Systems 14/9/2022 */
.pagination > li > span, .pagination > li > a {
  font-weight: 600;
  padding: 0;
  height: 30px;
  line-height: 26px !important;
  width: 30px;
  text-align: center;
  position: relative;
  border-radius: 15px !important;
}

.pagination {
  font-size: 0.8em;
}
.pagination > li {
  display: inline-block;
  margin-right: 5px;
  margin-bottom: 0;
  vertical-align: middle;
}
.pagination > li:first-child > a {
  width: auto;
  padding: 0 10px;
}
.pagination > li:first-child > span {
  width: auto;
  padding: 0 10px;
}
.pagination > li:last-child {
  margin-bottom: 0;
  margin-right: 0;
}
.pagination > li.PagedList-pageCountAndLocation > a {
  width: auto;
  padding: 0 10px;
}
.pagination > li.PagedList-pageCountAndLocation > span {
  width: auto;
  padding: 0 10px;
}
.panel-footer .pagination {
  margin: 0;
}

.vertical-pagination {
  display: inline-block;
  margin-right: 5px;
}

/*! Panels style sheet for Battersea Systems 22/10/2024 */
/**************************** Panels - Action */
.action-panel a.btn + a.btn,
button + a.btn,
.action-panel button + button,
a.btn + button {
  margin-left: 10px;
}

/**************************** Panels - Content */
div.content-test > div > div:not(.ng-scope), div.content-pages > div > div:not(.ng-scope), div.company-department > div > div.ng-scope, div.company-division > div > div:not(.ng-scope), div.content-divider > div > div:not(.ng-scope) {
  padding: 2px 5px 2px;
  border-radius: 2px;
  border: 1px solid transparent;
  margin-bottom: 2px;
  font-size: 13px;
}
div.content-test > div > div:not(.ng-scope) > div, div.content-pages > div > div:not(.ng-scope) > div, div.company-department > div > div.ng-scope > div, div.company-division > div > div:not(.ng-scope) > div, div.content-divider > div > div:not(.ng-scope) > div {
  display: inline-block;
  vertical-align: middle;
}

.content {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.company-st {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

div.content-divider {
  width: 100%;
}
div.content-divider > div > div:not(.ng-scope) {
  background-color: #dff0d8;
  border-color: #c7d7c1 !important;
}
div.content-divider .action-panel {
  float: right;
}

div.company-division {
  width: 100%;
}
div.company-division > div > div:not(.ng-scope) {
  background-color: #dff0d8;
  border-color: #c7d7c1 !important;
}
div.company-division .action-panel {
  float: right;
}

div.company-department > div > div.ng-scope {
  background-color: #d9edf7;
  border-color: #c5d7e0 !important;
}
div.company-department .action-panel {
  float: right;
}

div.content-pages > div > div:not(.ng-scope) {
  background-color: #d9edf7;
  border-color: #c5d7e0 !important;
}
div.content-pages .action-panel {
  float: right;
}

div.content-test > div > div:not(.ng-scope) {
  background-color: #fcf8e3;
  border-color: #e3dfcc !important;
}
div.content-test .action-panel {
  float: right;
}

/******************************** Panels - forms ************/
.panel .panel {
  margin-bottom: 20px;
}
.panel-body .form-inline {
  margin: 0 0 10px 0;
}
.panel-heading {
  position: relative;
  padding: 3px 15px 11px;
}
.panel-heading form.action-panel {
  display: inline-block;
  vertical-align: middle;
  margin: 0;
}
@media only screen and (min-width: 768px) {
  .panel-heading form.action-panel {
    display: inline-block;
    vertical-align: middle;
    margin: 0 0 0 5px;
  }
}
.panel-heading form.action-panel > * {
  display: inline-block;
}
.panel-feedback .panel-heading form.action-panel {
  padding-top: 5px;
}
.panel-heading input[type=search] {
  width: 200px;
}
.panel-heading select {
  height: 24px;
  font-size: 0.8em;
}
.panel-heading + form.form-horizontal {
  padding: 0;
  position: relative;
  padding: 3px 15px 11px;
}
.panel.panel-low .panel-heading {
  border-bottom: 1px solid #0a6242;
}
.panel.panel-medium .panel-heading {
  border-bottom: 1px solid #446ca9;
}
.panel.panel-high .panel-heading {
  border-bottom: 1px solid #EDAD44;
}
.panel.panel-very-high .panel-heading {
  border-bottom: 1px solid #a94442;
}
.ticket .panel-heading {
  background-color: #f7f7f7 !important;
}
.panel-group .panel-heading {
  border-bottom: 1px solid #CCCCCC;
}
.panel-heading input[type=search] {
  height: 24px;
  font-size: 0.8em;
  line-height: 2em;
}
.panel-heading .btn {
  padding: 4px 12px 6px;
  line-height: 1;
  vertical-align: top;
  font-size: 12px;
}
.panel-heading.panel-information {
  padding: 1px 15px 11px 43px;
}
.panel-heading.panel-example {
  padding: 1px 15px 11px 43px;
}
.panel-heading.panel-case {
  padding: 1px 15px 11px 43px;
}
.panel-heading.panel-question {
  padding: 1px 15px 11px 52px;
}
.panel-heading.panel-question + .panel-collapse .panel-body {
  padding: 1px 50px 11px 66px;
  position: relative;
}
.panel-heading.panel-answer {
  padding: 1px 15px 11px 52px;
  position: relative;
}
.panel-heading .panel-title {
  margin-right: 20px;
  -webkit-hyphens: none;
  hyphens: none;
  display: inline-block;
  vertical-align: middle;
}
@media only screen and (min-width: 768px) {
  .panel-heading .panel-title {
    /*margin-right: 10px;*/
  }
}
.panel-heading.action-panel {
  display: inline-block;
  vertical-align: middle;
}
.panel-heading div.action-panel {
  margin: 5px 5px 0 0;
}
@media only screen and (min-width: 768px) {
  .panel-heading div.action-panel {
    margin: 5px 0 0 5px;
    float: right;
  }
}
.panel-footer nav {
  line-height: 0;
}
.panel-group > .panel {
  background-color: transparent;
  border: none;
  box-shadow: none;
}
html.Admininstrator .panel-group .panel {
  margin-bottom: 20px;
}
.training-content .panel-group .panel {
  margin-bottom: 20px;
}

form.panel {
  padding: 0;
}
form.action-panel {
  margin-top: 0;
}

/**************************** Panels - Module/Company */
.module-structure .row, .company-structure .row {
  margin: 0;
}

/**************************** Panels - Outer */
.panel-outer {
  padding: 15px 30px;
}

/******************************** Panels - Specials ************/
.modal-panel.panel-case:before, .modal-panel.panel-example:before, .modal-panel.panel-information:before, .panel-heading.panel-answer-no:before, .panel-heading.panel-answer-yes:before, .panel-heading.panel-incorrect:before, .panel-heading.panel-correct:before, .panel-heading.panel-important:before, .panel-heading.panel-question:before, .panel-heading.panel-example:before, .panel-heading.panel-information:before {
  position: absolute;
  left: 7px;
  top: 7px;
  width: 25px;
  height: 25px;
  line-height: 17px;
  text-align: center;
  border-radius: 15px;
  font-size: 20px;
  color: #ffffff;
  font-weight: 400;
  box-shadow: rgba(0, 0, 0, 0.3) 0 0 3px 0;
}

.modal-panel.panel-answer:before, .modal-panel.panel-question:before, .panel-heading.panel-answer:before {
  position: absolute;
  content: "";
  background-repeat: no-repeat;
  background-position: 50% 50%;
  border-radius: 0;
  box-shadow: none;
  height: 40px;
  width: 37px;
  top: -1px;
  left: 6px;
}

.panel-heading.panel-information:before {
  content: "";
  background-color: #446ca9;
  border: none;
  background-image: url("../images/icons/icon-information-white.svg");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 60%;
}
.panel-heading.panel-example:before {
  content: "e";
  background-color: #628ec5;
  border: 1px solid #628ec5;
}
.panel-heading.panel-question:before {
  content: "";
  background-color: #EDAD44;
  border: none;
  background-image: url("../images/icons/icon-question-white.svg");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 60%;
}
.panel-heading.panel-important:before {
  content: "";
  background-color: #a94442;
  border: none;
  background-image: url("../images/icons/icon-alert-white.svg");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 60%;
}
.panel-heading.panel-correct .panel-title > a {
  color: #0a6242;
}
.panel-heading.panel-correct:before {
  content: "";
  background-color: #0a6242;
  border: none;
  background-image: url("../images/icons/icon-tick-white.svg");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 60%;
}
.panel-heading.panel-incorrect .panel-title > a {
  color: #a94442;
}
.panel-heading.panel-incorrect:before {
  content: "";
  background-color: #a94442;
  border: none;
  background-image: url("../images/icons/icon-cross-white.svg");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 60%;
}
.panel-heading.panel-answer:before {
  background-image: url("../images/icons/question-icon.svg");
  background-size: 91%;
}
.panel-heading.panel-answer-yes:before {
  content: "";
  background-color: #EDAD44;
  border: none;
  background-image: url("../images/icons/icon-question-white.svg");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 60%;
}
.panel-heading.panel-answer-no:before {
  content: "";
  background-color: #EDAD44;
  border: none;
  background-image: url("../images/icons/icon-question-white.svg");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 60%;
}

.modal-panel.panel-information:before {
  top: 9px;
  line-height: 20px;
  content: "i";
  background-color: #446ca9;
  border: 1px solid #446ca9;
}
.modal-panel.panel-example:before {
  top: 9px;
  content: "e";
  background-color: #628ec5;
  border: 1px solid #628ec5;
}
.modal-panel.panel-case:before {
  top: 9px;
  content: "c";
  background-color: #8a6d3b;
  border: 1px solid #8a6d3b;
}
.modal-panel.panel-question:before {
  background-image: url("../images/icons/question-icon.svg");
  background-size: 1.75em;
}
@media only screen and (min-width: 768px) {
  .modal-panel.panel-question:before {
    background-size: 85%;
  }
}
.modal-panel.panel-answer:before {
  background-image: url("../images/icons/answer-icon.svg");
  background-size: 1.75em;
}
@media only screen and (min-width: 768px) {
  .modal-panel.panel-answer:before {
    background-size: 85%;
  }
}
.modal-panel.panel-answer-yes {
  color: #0a6242;
}
.modal-panel.panel-answer-yes:before {
  content: "\e207";
}
.modal-panel.panel-answer-no {
  color: #a94442;
}
.modal-panel.panel-answer-no:before {
  content: "\e208";
}

/**************************** Panels - Tables */
.panel-body > .table-responsive > .table {
  margin-bottom: 0;
}

.panel th {
  padding: 4px !important;
  background-color: #f7f7f7;
}

/**************************** Panels - Titles */
h6.panel-title, h5.panel-title, h4.panel-title, h3.panel-title, h2.panel-title {
  font-weight: 600;
}

.panel-title {
  vertical-align: middle;
  margin-top: 5px;
  padding-top: 0.25em;
}
@media only screen and (min-width: 768px) {
  .panel-title {
    display: inline-block;
  }
}

/**************************** Panels -  Training dashboard module status */
.training.training-dashboard-module-status .panel-heading .panel-title a + a.btn-inline {
  font-size: 0.7em;
  padding: 3px 5px 5px;
  opacity: 0.75;
}
.training.training-dashboard-module-status .panel-heading .panel-title a + a.btn-inline:hover {
  opacity: 1;
}
.training.training-dashboard-module-status .panel-heading .panel-title a + a.btn-inline .glyphicons {
  margin-right: 0;
}

/**************************** Panels - Effects */
.shadow-me {
  -webkit-box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.6);
  box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.6);
  z-index: 2;
}

/*! Parallaxing style sheet for Battersea Systems 23/7/2021 */
.parallax-mirror {
  z-index: 1 !important;
}
.parallax-mirror > img {
  max-height: none !important;
}
.parallax-container {
  min-height: 30vh;
  display: flex;
  margin: 0;
}
.parallax-container * > * {
  position: relative;
  z-index: 2;
  width: 100%;
}
.parallax-container * > *:not(.inner-parallax) {
  display: flex;
}
.parallax-container .inner-parallax {
  max-width: 1080px;
  margin: 4rem auto;
  padding: 1rem 3rem;
  width: 100%;
  align-self: center;
}
.parallax-container.dark-mode > div {
  background: rgba(0, 0, 0, 0.5);
}

/* Positions style sheet for Battersea Systems 03/08/2022 */
.not-absolute {
  position: static;
}

/**************************** Padded */
@media only screen and (min-width: 768px) {
  .padded-top {
    padding-top: 2em;
  }
}

@media only screen and (min-width: 768px) {
  .padded-left {
    padding-left: 2em;
  }
}

@media only screen and (min-width: 768px) {
  .padded-right {
    padding-right: 2em;
  }
}

@media only screen and (min-width: 768px) {
  .padded-bottom {
    padding-top: 2em;
  }
}

/**************************** margined */
@media only screen and (min-width: 768px) {
  .margined-top {
    margined-top: 2em;
  }
}

@media only screen and (min-width: 768px) {
  .margined-left {
    margined-left: 2em;
  }
}

@media only screen and (min-width: 768px) {
  .margined-right {
    margined-right: 2em;
  }
}

@media only screen and (min-width: 768px) {
  .margined-bottom {
    margined-top: 2em;
  }
}

/**************************** Containers */
@media only screen and (min-width: 768px) {
  .container-centre-me, .container-center-me {
    position: relative;
    overflow: hidden;
  }
}

/**************************** Horzontal */
.left-me {
  margin-left: 0 !important;
  margin-right: auto !important;
}

.center-me {
  margin-left: auto !important;
  margin-right: auto !important;
}
.center-me > .row {
  justify-content: center;
}

.centre-me {
  margin-left: auto !important;
  margin-right: auto !important;
  justify-content: center;
}
.centre-me > .row {
  justify-content: center;
}

@media only screen and (max-width: 767px) {
  .container.intro-panel.centre-me {
    margin: 15px !important;
  }
}

.right-me {
  margin-right: 0 !important;
  margin-left: auto !important;
}

/**************************** Vertical */
.contents-top {
  display: grid;
  flex-wrap: wrap;
  align-content: flex-start;
}

.contents-middle {
  display: grid;
  flex-wrap: wrap;
  align-content: center;
}
.contents-middle > * {
  align-self: center;
}

.contents-bottom {
  display: grid;
  flex-wrap: wrap;
  align-content: flex-end;
}
.contents-bottom > * {
  align-self: end;
}

.top-me {
  align-self: flex-start;
}

.middle-me {
  align-self: center;
}

.bottom-me {
  align-self: flex-end;
}

/***************************************** Text */
.text-left {
  text-align: left !important;
}
.text-centre {
  text-align: center !important;
}
.text-right {
  text-align: right !important;
}
.text-align-left {
  text-align: left !important;
}
.text-align-centre {
  text-align: center !important;
}
.text-align-right {
  text-align: right !important;
}

/***************************************** Absolute */
.top-right:not(.back-image) {
  top: 0;
  right: 0;
}

.top-right.back-image {
  background-position: top right;
}

.right-middle:not(.back-image) {
  top: 50%;
  right: 0;
}

.right-middle.back-image {
  background-position: right middle;
}

.top-centre:not(.back-image) {
  top: 0;
  left: 50%;
}

.top-centre.back-image {
  background-position: top center;
}

.top-left:not(.back-image) {
  top: 0;
  left: 0;
}

.top-left.back-image {
  background-position: top left;
}

.left-middle:not(.back-image) {
  top: 50%;
  left: 0;
}

.left-middle.back-image {
  background-position: left middle;
}

.bottom-right:not(.back-image) {
  bottom: 0;
  right: 0;
}

.bottom-right.back-image {
  background-position: bottom right;
}

.bottom-centre:not(.back-image) {
  bottom: 0;
  left: 50%;
}

.bottom-centre.back-image {
  background-position: bottom center;
}

.bottom-left:not(.back-image) {
  bottom: 0;
  left: 0;
}

.bottom-left.back-image {
  background-position: bottom left;
}

.center:not(.back-image) {
  bottom: 50%;
  left: 50%;
}

.center.back-image {
  background-position: center middle;
}

/****************************************************************************** Offset */
div[class*=offset-up-], div[class*=offset-right-], div[class*=offset-left-], div[class*=offset-down-] {
  z-index: 1;
  position: relative;
}

@media only screen and (min-width: 768px) {
  .offset-up-5 {
    transform: translatey(-5%);
  }
  .offset-up-10 {
    transform: translatey(-10%);
  }
  .offset-up-15 {
    transform: translatey(-15%);
  }
  .offset-up-20 {
    transform: translatey(-20%);
  }
  .offset-up-25 {
    transform: translatey(-25%);
  }
  .offset-up-30 {
    transform: translatey(-30%);
  }
  .offset-up-35 {
    transform: translatey(-35%);
  }
  .offset-up-40 {
    transform: translatey(-40%);
  }
  .offset-up-45 {
    transform: translatey(-45%);
  }
  .offset-up-50 {
    transform: translatey(-50%);
  }
  .offset-up-55 {
    transform: translatey(-55%);
  }
  .offset-up-60 {
    transform: translatey(-60%);
  }
  .offset-up-65 {
    transform: translatey(-65%);
  }
  .offset-up-70 {
    transform: translatey(-70%);
  }
  .offset-up-75 {
    transform: translatey(-75%);
  }
  .offset-up-80 {
    transform: translatey(-80%);
  }
  .offset-up-85 {
    transform: translatey(-85%);
  }
  .offset-up-90 {
    transform: translatey(-90%);
  }
  .offset-up-95 {
    transform: translatey(-95%);
  }
  .offset-up-100 {
    transform: translatey(-100%);
  }
}
@media only screen and (min-width: 768px) {
  .offset-down-5 {
    transform: translatey(5%);
  }
  .offset-down-10 {
    transform: translatey(10%);
  }
  .offset-down-15 {
    transform: translatey(15%);
  }
  .offset-down-20 {
    transform: translatey(20%);
  }
  .offset-down-25 {
    transform: translatey(25%);
  }
  .offset-down-30 {
    transform: translatey(30%);
  }
  .offset-down-35 {
    transform: translatey(35%);
  }
  .offset-down-40 {
    transform: translatey(40%);
  }
  .offset-down-45 {
    transform: translatey(45%);
  }
  .offset-down-50 {
    transform: translatey(50%);
  }
  .offset-down-55 {
    transform: translatey(55%);
  }
  .offset-down-60 {
    transform: translatey(60%);
  }
  .offset-down-65 {
    transform: translatey(65%);
  }
  .offset-down-70 {
    transform: translatey(70%);
  }
  .offset-down-75 {
    transform: translatey(75%);
  }
  .offset-down-80 {
    transform: translatey(80%);
  }
  .offset-down-85 {
    transform: translatey(85%);
  }
  .offset-down-90 {
    transform: translatey(90%);
  }
  .offset-down-95 {
    transform: translatey(95%);
  }
  .offset-down-100 {
    transform: translatey(100%);
  }
}
@media only screen and (min-width: 768px) {
  .offset-left-5 {
    transform: translatex(-5%);
  }
  .offset-left-10 {
    transform: translatex(-10%);
  }
  .offset-left-15 {
    transform: translatex(-15%);
  }
  .offset-left-20 {
    transform: translatex(-20%);
  }
  .offset-left-25 {
    transform: translatex(-25%);
  }
  .offset-left-30 {
    transform: translatex(-30%);
  }
  .offset-left-35 {
    transform: translatex(-35%);
  }
  .offset-left-40 {
    transform: translatex(-40%);
  }
  .offset-left-45 {
    transform: translatex(-45%);
  }
  .offset-left-50 {
    transform: translatex(-50%);
  }
  .offset-left-55 {
    transform: translatex(-55%);
  }
  .offset-left-60 {
    transform: translatex(-60%);
  }
  .offset-left-65 {
    transform: translatex(-65%);
  }
  .offset-left-70 {
    transform: translatex(-70%);
  }
  .offset-left-75 {
    transform: translatex(-75%);
  }
  .offset-left-80 {
    transform: translatex(-80%);
  }
  .offset-left-85 {
    transform: translatex(-85%);
  }
  .offset-left-90 {
    transform: translatex(-90%);
  }
  .offset-left-95 {
    transform: translatex(-95%);
  }
  .offset-left-100 {
    transform: translatex(-100%);
  }
}
@media only screen and (min-width: 768px) {
  .offset-right-5 {
    transform: translatex(5%);
  }
  .offset-right-10 {
    transform: translatex(10%);
  }
  .offset-right-15 {
    transform: translatex(15%);
  }
  .offset-right-20 {
    transform: translatex(20%);
  }
  .offset-right-25 {
    transform: translatex(25%);
  }
  .offset-right-30 {
    transform: translatex(30%);
  }
  .offset-right-35 {
    transform: translatex(35%);
  }
  .offset-right-40 {
    transform: translatex(40%);
  }
  .offset-right-45 {
    transform: translatex(45%);
  }
  .offset-right-50 {
    transform: translatex(50%);
  }
  .offset-right55 {
    transform: translatex(55%);
  }
  .offset-right-60 {
    transform: translatex(60%);
  }
  .offset-right-65 {
    transform: translatex(65%);
  }
  .offset-right-70 {
    transform: translatex(70%);
  }
  .offset-right-75 {
    transform: translatex(75%);
  }
  .offset-right-80 {
    transform: translatex(80%);
  }
  .offset-right-85 {
    transform: translatex(85%);
  }
  .offset-right-90 {
    transform: translatex(90%);
  }
  .offset-right-95 {
    transform: translatex(95%);
  }
  .offset-right-100 {
    transform: translatex(100%);
  }
}

.full-screen .training-content-outer > p {
  margin: 0;
}

/* Quotes stylesheet for Battersea Systems 10/4/2021 */
.Quote {
  padding: 17px 10px 0px 25px;
  font-style: italic;
  margin: 10px 20px;
  position: relative;
  line-height: 1.2;
}
@media only screen and (min-width: 768px) {
  .Quote {
    padding: 30px 60px 0px 49px;
    margin: 10px 20px;
    line-height: 1.3;
  }
}
.Quote:before {
  position: absolute;
  left: 0;
  top: 15px;
  height: 22px;
  width: 22px;
  display: block;
  font-size: 1em;
  background-image: url("../images/icons/text-quote.svg");
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  opacity: 0.6;
}
@media only screen and (min-width: 768px) {
  .Quote:before {
    top: 12px;
    height: 40px;
    width: 40px;
    font-size: 1.5em;
  }
}

.quote-cite {
  opacity: 0.8;
  font-size: 1.2em !important;
  padding: 0;
  margin: 0 20px 10px 30px;
}
@media only screen and (min-width: 768px) {
  .quote-cite {
    font-size: 1.2em !important;
    margin: 0 20px 10px 70px;
  }
}
.quote-cite:before {
  display: inline-block;
  content: "–";
  padding-right: 5px;
}

/*! Scrolling style sheet for Battersea Systems 21/7/2021 */
/****************************  Scrolling - Vertical */
.scroll-indicator-controller {
  position: fixed;
  top: 50vh;
  transform: translate(0, -50%);
  right: 20px;
  z-index: 999;
}
@media only screen and (max-width: 1024px) {
  .scroll-indicator-controller .scroll-indicator-controller {
    right: 10px;
  }
}
.scroll-indicator-controller > div {
  width: 10px;
  height: 10px;
  position: relative;
  border-radius: 50%;
  border: 1px solid #CCCCCC;
  background: rgba(255, 255, 255, 0.3);
  margin: 0 0 10px 0;
  cursor: pointer;
  transition: background 0.4s ease;
  will-change: transition;
  box-shadow: 0 1px 5px rgba(61, 61, 61, 0.5);
}
.scroll-indicator-controller > div span {
  position: absolute;
  right: calc(100% + 8px);
  white-space: nowrap;
  top: -0.7rem;
  font-size: 1.1rem;
  line-height: 1.1rem;
  width: 0;
  overflow: hidden;
  opacity: 0;
  transform: translateX(10px);
  transition: all 0.4s ease;
  will-change: transition;
  color: #ffffff;
  font-weight: 400;
  background: rgba(1, 1, 1, 0.7);
  padding: 5px;
}
.scroll-indicator-controller > div span:after {
  content: "-----";
  padding-left: 5px;
  letter-spacing: -2px;
  font-family: "Helvetica", Helvetica, Arial, sans-serif;
  vertical-align: bottom;
  font-weight: 400;
}
@media only screen and (hover: none) {
  .scroll-indicator-controller > div span {
    display: none;
  }
}
@supports (-ms-ime-align: auto) {
  .scroll-indicator-controller > div span {
    transition: opacity 0.4s ease;
  }
}
@media only screen and (hover: hover) {
  .scroll-indicator-controller > div:hover span {
    width: auto;
    opacity: 1;
    overflow: visible;
    transform: translateX(0px);
  }
}
@media all and (-ms-high-contrast: none) {
  .scroll-indicator-controller > div:hover span {
    width: auto;
    opacity: 1;
    overflow: visible;
    transform: translateX(0px);
  }
}
@media all and (-ms-high-contrast: active) {
  .scroll-indicator-controller > div:hover span {
    width: auto;
    opacity: 1;
    overflow: visible;
    transform: translateX(0px);
  }
}
.scroll-indicator-controller > div.active {
  background-colour: #ffffff;
  border-colour: #CCCCCC;
}
.scroll-indicator-controller .indi-mobile > div span {
  display: none;
}

/*! Sections style sheet for Battersea Systems 17/9/2021 */
/****************************** Sections ***********************/
section {
  position: relative;
  height: auto;
  -moz-transition: height 0.5s ease;
  -webkit-transition: height 0.5s ease;
  -o-transition: height 0.5s ease;
  transition: height 0.5s ease;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
}
section.contents-top {
  align-content: flex-start;
}
section.contents-middle {
  align-content: center;
}
section.contents-bottom {
  align-content: flex-end;
}
section.contents-even {
  align-content: space-between;
}
section > * {
  width: 100%;
}
@media only screen and (min-width: 1140px) {
  section.section-left > .container {
    margin-left: 0;
    padding-left: 0;
    max-width: calc(1140px + (100% - 1140px) / 2);
  }
}
@media only screen and (min-width: 1140px) {
  section.section-right > .container {
    margin-right: 0;
    padding-right: 0;
    max-width: calc(1140px + (100% - 1140px) / 2);
  }
}
section > .intro-panel {
  width: auto;
}

@media only screen and (max-width: 767px) {
  .full-screen .content-pagetitle + section > *:first-child {
    padding-top: 4rem;
  }
}

/*! Skins style sheet for Battersea Systems 16/3/2022 */
body.dark, html.dark, .dark .training-content .training-content .btn button, .dark .training-content .training-content .btn, .dark .student-dashboard .training .training-intro, .dark .ticket .user.circle > .user-info, .dark .panel-title > .small > a, .dark .panel-title > small > a, .dark .panel-title > .small, .dark .panel-title > small, .dark .panel-title > a, .dark td, .dark li, .dark a:not(.btn):focus, .dark a:not(.btn):hover, .dark a:not(.btn), .dark span.user-counter, .dark span.page-subheading, .dark .Heading6, .dark .h6, .dark h6, .dark .Heading5, .dark .h5, .dark h5, .dark .Heading4, .dark .h4, .dark h4, .dark .Heading3, .dark .h3, .dark h3, .dark .Heading2, .dark .h2, .dark h2, .dark .Heading1, .dark .h1, .dark h1, .dark .breadcrumb > li.active, .dark .breadcrumb > li, .dark.nav-list > li .submenu > li > a, .dark.nav-list > li .submenu:before, .dark.nav-list > li .submenu, .dark .sidebar, .dark .navbar-default .navbar-nav > li > a:focus, .dark .navbar-default .navbar-nav > li > a:hover, .dark .navbar-default .navbar-nav > li > a, .dark * {
  color: #ffffff !important;
}

.dark.nav-list > li .submenu > li > a, .dark.nav-list > li .submenu:before, .dark.nav-list > li .submenu, .dark .sidebar, .dark ul.nav.navbar-nav {
  background-color: rgba(255, 255, 255, 0.2);
}

body.light, html.light, .light * {
  color: #3e3b3f !important;
}

.dark .navbar-default .navbar-collapse {
  border-color: rgba(255, 255, 255, 0.5);
}
.dark .navbar-default .navbar-form {
  border-color: rgba(255, 255, 255, 0.5);
}
.dark .navbar {
  background-color: rgba(255, 255, 255, 0.9) !important;
}
.dark .sidebar {
  box-shadow: none;
}
.dark.nav-list > li .submenu {
  border-top-color: rgba(255, 255, 255, 0.5);
}
.dark.nav-list > li .submenu > li:first-child > a {
  border-top-color: rgba(255, 255, 255, 0.5);
}
.dark.nav-list > li .submenu > li > a[class*=icon-]:first-child {
  background-color: transparent;
}
.dark .outer > nav .nav.navbar-nav li {
  border-left-color: rgba(255, 255, 255, 0.5);
}
.dark .menu-toggler {
  background-color: rgba(255, 255, 255, 0.7);
}
.dark .menu-toggler > .menu-text {
  border-top-color: rgba(255, 255, 255, 0.5);
}
.dark .menu-toggler > .menu-text:after {
  color: rgba(255, 255, 255, 0.5);
}
.dark .page-header {
  border-bottom-color: rgba(255, 255, 255, 0.5);
}
.dark hr {
  border-top-color: rgba(255, 255, 255, 0.5) !important;
}

html.dark .navbar {
  background-color: rgba(255, 255, 255, 0.9) !important;
}
body.dark {
  background-color: #000000;
}
body.dark .navbar {
  background-color: rgba(255, 255, 255, 0.9) !important;
}
/*! Tables style sheet for Battersea Systems 3/8/2021 */
table tr:nth-child(even) {
  background-color: rgba(0, 0, 0, 0.05);
}
table td.extract-only p {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 450px;
}
table td p {
  margin: 0.2rem 0 0.4rem !important;
}
.training-content table td {
  vertical-align: top;
}
table:not(.ui-datepicker-calendar) td {
  border: none !important;
  padding: 0.3em 0.6em 0.5em !important;
  background-color: transparent;
  /*width: initial !important;*/
  /*commencted becasue of issue with column widths related to admin area.*/
}
table:not(.ui-datepicker-calendar) th {
  border: none !important;
  padding: 0.3em 0.6em 0.5em !important;
  background-color: transparent;
  /*width: initial !important;*/
  /*commencted becasue of issue with column widths related to admin area.*/
}
.training-content table li {
  margin-left: 1.03rem;
  padding-left: 1.03rem;
  text-indent: -1.26rem;
}
.training-content table ul > li {
  margin-left: 0;
  padding-left: 0;
  text-indent: 0;
}
.training-content table ol > li {
  margin-left: 0;
  padding-left: 0;
  text-indent: 0;
}

td.icon-cell {
  display: table-cell;
  white-space: nowrap;
}

/**************************************************  Tables - Div  ************/
/******************************* Rows  ************/
.div-row.data-row {
  margin-bottom: 15px;
  width: 100%;
}
.div-row:last-child {
  margin-bottom: 0;
}
.div-row:last-child {
  margin-bottom: 0;
}
.div-row .div-cell {
  font-weight: 400;
}

.data-row .div-cell {
  font-weight: 300;
  font-size: 0.9rem;
}
@media only screen and (min-width: 768px) {
  .data-row .div-cell {
    font-size: 1rem;
  }
}

/******************************* Cells  ************/
.cell-answer {
  width: 29%;
}
.cell-why {
  width: 29%;
}
@media only screen and (min-width: 768px) {
  .cell-width-10 {
    width: 10%;
  }
  .cell-width-20 {
    width: 20%;
  }
  .cell-width-30 {
    width: 30%;
  }
  .cell-width-40 {
    width: 40%;
  }
  .cell-width-50 {
    width: 50%;
  }
  .cell-width-60 {
    width: 60%;
  }
  .cell-width-70 {
    width: 70%;
  }
}
.cell-width-80 {
  width: 80%;
}
.cell-width-85 {
  width: 85%;
}
.cell-width-90 {
  width: 90%;
}
.cell-width-95 {
  width: 95%;
}
.cell-button {
  width: 100%;
  font-size: 1em;
  padding: 10px 0;
  text-transform: uppercase;
  font-weight: 200;
  border-radius: 0;
  opacity: 1;
  white-space: normal;
}
@media only screen and (min-width: 768px) {
  .cell-button {
    font-size: 1.2rem;
  }
}
.cell-button:hover {
  opacity: 0.8;
}

.answer-admin div [class^=cell] {
  vertical-align: top;
}
.answer-admin div[class*=cell] {
  vertical-align: top;
}
div-cell {
  display: block;
  padding-left: 0;
}
@media only screen and (min-width: 768px) {
  div-cell {
    display: inline-block;
    padding-left: 1%;
    vertical-align: middle;
  }
}
div-cell:first-child {
  padding-left: 0;
}
div-cell.cell-status {
  color: #ffffff;
  text-transform: uppercase;
}
div.icon-cell {
  white-space: nowrap;
}

@media only screen and (min-width: 768px) {
  .box-table {
    display: inline-table;
    width: 100%;
  }
}
@media only screen and (min-width: 768px) {
  .box-row {
    display: table-row;
  }
}
@media only screen and (min-width: 768px) {
  .box-cell {
    display: table-cell;
    vertical-align: middle;
    padding: 10px 20px;
  }
}

.test-pass, .test-score, .module-pass, .module-score {
  text-align: right;
}

.test-status, .module-status {
  text-align: center;
}

/**************************************************  Tables - Header  ************/
.centre-table-headers {
  text-align: center;
}

.right-table-headers {
  text-align: right;
}

/**************************************************  Tables - Responsive  ************/
.table-responsive {
  width: 100%;
  overflow-y: hidden;
}
.table-responsive > p {
  margin: 0;
}

/**************************************************  Tables - Batttersea  ************/
table .batterseaTable {
  margin: 2em 0;
}
table .batterseaTable tr:last-child td {
  border-bottom: 1px solid #666666 !important;
}

/**************************************************  Tables - Comparison*/
.table-compare table {
  width: 100%;
  text-align: center;
}
.table-compare table tr th {
  border: 1px solid #CCCCCC !important;
  padding: 1rem 2rem !important;
  empty-cells: show;
  vertical-align: middle;
}
.table-compare table tr td {
  border: 1px solid #CCCCCC !important;
  padding: 1rem 2rem !important;
  empty-cells: show;
  vertical-align: middle;
}
@media only screen and (max-width: 767px) {
  .table-compare table th {
    border: none !important;
  }
  .table-compare table th:first-child {
    width: 100%;
    flex: 1 0 100%;
  }
  .table-compare table td {
    border: none !important;
  }
  .table-compare table td:first-child {
    width: 100%;
    flex: 1 0 100%;
  }
}
.table-compare tr:nth-child(even) {
  background-color: transparent;
}
.table-compare tr:first-child th {
  font-weight: 700;
  border-top: 3px solid #CCCCCC !important;
  background: #f7f7f7;
}
.table-compare tr:first-child th:first-child {
  text-transform: uppercase;
  background: #ffffff;
}
.table-compare tr:first-child td {
  font-weight: 700;
  border-top: 3px solid #CCCCCC !important;
  background: #f7f7f7;
}
.table-compare tr:first-child td:first-child {
  text-transform: uppercase;
  background: #ffffff;
}
.table-compare tr td:first-child {
  text-align: left;
}
.table-compare tr:not(:first-child) td:not(:first-child) p {
  padding: 0;
}
.table-compare td:not(:first-child) img {
  padding: 0;
  max-width: 40px;
}
@media only screen and (max-width: 767px) {
  .table-compare {
    border: 1px solid #CCCCCC !important;
  }
  .table-compare tr {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
  }
  .table-compare tr:not(:first-child) td:first-child {
    padding-top: 2rem !important;
  }
  .table-compare tr:not(:first-child) td:not(:first-child) {
    border-bottom: 2px solid #CCCCCC !important;
    border-top: 1px solid #f7f7f7 !important;
  }
  .table-compare tr:not(:first-child):first-child td:not(:first-child) {
    border-bottom: 1px solid #CCCCCC !important;
  }
  .table-compare tr td:not(:first-child) {
    border-right: 1px solid #CCCCCC !important;
  }
  .table-compare tr td:last-child {
    border-right: none !important;
  }
  .table-compare th {
    display: block;
    flex-grow: 1;
  }
  .table-compare td {
    display: block;
    flex-grow: 1;
  }
}

/*! Tabs style sheet for Battersea Systems 21/12/2023 */
.nav-tabs > li.active > a {
  line-height: 1.9;
  border-radius: 3px 3px 0 0 !important;
}
.nav-tabs > li.active > a:hover {
  line-height: 1.9;
  border-radius: 3px 3px 0 0 !important;
}
.nav-tabs > li.active > a:focus {
  line-height: 1.9;
  border-radius: 3px 3px 0 0 !important;
}

/**************************** Tabs - Panel */
/*.tabbable {
	width: 100%;
	& > .tab-content {
		border: 1px solid $white;
		background-color: $white;
		padding: 0 0 10px;
	}
}
.panel > div.tab-content {
	border-width: 1px 0 0 0;
}*/
/*! Tool tips style sheet for Battersea Systems 9/2/2024 */
.tooltip {
  min-width: 10em;
}

/* Typography style sheet for Battersea Systems 13/3/2025 */
/**************************** Special ACE */
.blue {
  color: #628ec5 !important;
}

/**************************** Headers */
.glyphicons .badge, .Heading6, .h6, h6, .Heading5, .h5, h5, .Heading4, .h4, h4, .Heading3, .h3, h3, .Heading2, .h2, h2, .Heading1, .h1, h1 {
  font-family: "Helvetica", Helvetica, Arial, sans-serif;
  font-weight: 700;
  line-height: 1.2;
  color: inherit;
  margin-bottom: 0.8rem;
  -webkit-hyphens: none;
  hyphens: none;
  /*margin-top: 1em;*/
  margin: 0;
  padding: 1em 0 0.2em;
}
.glyphicons .panel-title.badge, .panel-title.Heading6, .panel-title.h6, h6.panel-title, .panel-title.Heading5, .panel-title.h5, h5.panel-title, .panel-title.Heading4, .panel-title.h4, h4.panel-title, .panel-title.Heading3, .panel-title.h3, h3.panel-title, .panel-title.Heading2, .panel-title.h2, h2.panel-title, .panel-title.Heading1, .panel-title.h1, h1.panel-title {
  font-weight: 600 !important;
}

.Heading1, .h1, h1 {
  font-size: 2em;
  margin-top: 1.4em;
  font-weight: 700;
}
@media only screen and (min-width: 1170px) {
  .Heading1, .h1, h1 {
    font-size: 1.8em;
  }
}

h1 {
  /*html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) & {
  	font-weight: $f-normal;
  	color: $headings;
  	font-size: 1.3rem;
  }*/
}
body.training-content .training-module-title h1 {
  border-bottom: 1px solid #CCCCCC;
  padding-bottom: 6px;
  margin: 40px 0 0;
  padding: 0 0 0 1em;
  font-size: 1.2em;
}
.training-module-title h1 {
  font-weight: 400;
  color: #010101;
  font-size: 1.3em;
}
@media only screen and (min-width: 768px) {
  .training-module-title h1 {
    font-size: 1.6em;
  }
}
@media only screen and (min-width: 768px) {
  .page-header h1 {
    font-size: 1.6em;
  }
}

.Heading2, .h2, h2 {
  font-size: 1.8em;
}
.introduction .Heading2, .introduction .h2, .introduction h2 {
  font-size: 2rem;
  margin: 0.5em 0;
  padding: 0;
}

.Header-colour h2 {
  margin: 0;
  padding: 0;
}

.Heading3, .h3, h3 {
  font-size: 1.7em;
}
.introduction .Heading3, .introduction .h3, .introduction h3 {
  font-size: 1.9rem;
  margin: 0.5em 0;
  padding: 0;
}

.Heading4, .h4, h4 {
  font-size: 1.6em;
  /*margin-top: 0.6em;*/
}
.introduction .Heading4, .introduction .h4, .introduction h4 {
  font-size: 1.7rem;
  margin: 0.5em 0;
  padding: 0;
}

.Heading5, .h5, h5 {
  font-size: 1.4em;
  /*margin-top: 0.6em;*/
}
.introduction .Heading5, .introduction .h5, .introduction h5 {
  font-size: 1.6rem;
  margin: 0.5em 0;
  padding: 0;
}

.Heading6, .h6, h6 {
  font-size: 1.2em;
  /*margin-top: 0.6em;*/
}
.introduction .Heading6, .introduction .h6, .introduction h6 {
  font-size: 1.4rem;
  margin: 0.5em 0;
  padding: 0;
}

/**************************** Paragraph */
ol li.Introduction, ul li.Introduction, ol li.introduction, ul li.introduction, p.Introduction, p.introduction {
  font-size: 1.3em;
  margin-bottom: 0.5em;
  color: #F26A21;
}
.dark ol li.Introduction, .dark ul li.Introduction, ol .dark li.Introduction, ul .dark li.Introduction, .dark ol li.introduction, .dark ul li.introduction, ol .dark li.introduction, ul .dark li.introduction, .dark p.Introduction, .dark p.introduction {
  color: #ffffff !important;
}

p {
  margin-top: 10px;
}
h* + p {
  margin-top: 0;
}
p [align=both] {
  text-align: justify;
}
p.tagline {
  font-weight: 200 !important;
  text-transform: uppercase !important;
  font-size: 1.3em !important;
}
p.Tagline {
  font-weight: 200 !important;
  text-transform: uppercase !important;
  font-size: 1.3em !important;
}

@media only screen and (min-width: 570px) {
  .text-2-columns {
    column-count: 2;
    column-gap: 3em;
    column-rule: 1px solid #010101;
  }
  .text-2-columns > *:first-child {
    margin-top: 0;
    padding-top: 0;
  }
}

b, strong {
  font-weight: 700;
}

/************************ Links */
a {
  color: #00AAE7;
  -moz-transition: all 0.15s ease;
  -webkit-transition: all 0.15s ease;
  -o-transition: all 0.15s ease;
  transition: all 0.15s ease;
}
a:hover {
  color: #3363AF;
  -moz-transition: all 0.15s ease;
  -webkit-transition: all 0.15s ease;
  -o-transition: all 0.15s ease;
  transition: all 0.15s ease;
  text-decoration: none;
}
a:focus {
  color: #3363AF;
  -moz-transition: all 0.15s ease;
  -webkit-transition: all 0.15s ease;
  -o-transition: all 0.15s ease;
  transition: all 0.15s ease;
}
.panel-breadcrumbs a {
  text-decoration: underline;
}
.panel-breadcrumbs a:hover {
  text-decoration: underline;
  opacity: 0.8;
}

/************************ List */
body:not(.training-content) ol, body:not(.training-content) ul {
  margin: 0 0 0 30px;
}
h1 + ol, h1 + ul {
  padding-top: 0.5em;
}
h2 + ol, h2 + ul {
  padding-top: 0.5em;
}
h3 + ol, h3 + ul {
  padding-top: 0.5em;
}
h4 + ol, h4 + ul {
  padding-top: 0.5em;
}
h5 + ol, h5 + ul {
  padding-top: 0.5em;
}
h6 + ol, h6 + ul {
  padding-top: 0.5em;
}
ol li, ul li {
  margin-bottom: 0.3em;
  line-height: 1.4em;
}
ul {
  list-style-type: disc;
}
ul.circle {
  list-style-type: circle;
}
ul.square {
  list-style-type: square;
}
.text-centre ul {
  list-style-position: inside;
}

ol {
  list-style-type: decimal;
}
ol.lowerLetter {
  list-style-type: lower-alpha;
}
ol.upperLetter {
  list-style-type: upper-alpha;
}
ol.lowerRoman {
  list-style-type: lower-roman;
}
ol.upperRoman {
  list-style-type: upper-roman;
}
ol.decimal-leading-zero {
  list-style-type: decimal-leading-zero;
}
.text-centre ol {
  list-style-position: inside;
}

.list-group-item.div-row {
  margin-bottom: -1px;
}
.list-group-item.div-row:last-child {
  margin-bottom: 0;
}

/**************************** Text Highlighing */
span[class^=text-highlight] {
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 4px;
  margin: 0 1px;
  border-radius: 2px;
  background-color: #628ec5;
  color: #ffffff;
}
.sub-text span[class^=text-highlight] {
  padding-bottom: 2px;
}

/**************************** Alignment */
.align-centre, .centered, .centred {
  text-align: center !important;
}
.align-centre > button, .centered > button, .centred > button {
  margin: 0 auto;
}

.text-right {
  text-align: right;
}
.text-left {
  text-align: left;
}
.text-centre {
  text-align: center;
}
.text-center {
  text-align: center;
}

/**************************** Sizing */
small {
  font-size: 0.7em;
}

.sub-text {
  font-size: 0.7em;
}

.text-small {
  font-size: 0.7em;
}

/**************************** Text Notations */
.notation, .Notation {
  font-size: 0.7em !important;
  line-height: normal;
  -webkit-hyphens: none;
  hyphens: none;
}

/**************************** Icons */
/**************************** Banner */
.text-banner {
  font-size: 1.5em;
  padding: 2em 3em;
}
.text-banner .banner-text {
  font-size: 1em;
  line-height: 1.1;
  letter-spacing: 0.025em;
  padding: 0;
  margin: 0;
  z-index: 1;
  position: relative;
}
.text-banner .banner-text strong {
  text-shadow: 0 2px 11px #000000;
  font-size: 1.2em;
}
@media only screen and (min-width: 768px) {
  .text-banner {
    font-size: 2.25em;
  }
}
@media only screen and (min-width: 1400px) {
  .text-banner {
    text-align: center;
  }
}

/**************************** Articles */
.article-headline {
  font-family: "Georgia", Georgia, serif;
  font-weight: 700;
  font-size: 1.2em;
  text-transform: uppercase;
}
.article-copy {
  font-family: "Georgia", Georgia, serif;
}
.article-published {
  font-family: "Georgia", Georgia, serif;
  colour: #999999;
  font-size: 0.85em;
}

/**************************** Captions */
.figcaption {
  margin-top: 5px;
  font-size: 80%;
  border-bottom: 1px solid #999999;
}

/**************************** Footnote */
.footnote {
  opacity: 0.8;
  font-size: 90%;
}

/**************************** Tagline */
*.tagline, .tagline > *, .tagline, .Tagline {
  font-weight: 200 !important;
  text-transform: uppercase !important;
  font-size: 1em !important;
  margin-bottom: 0;
}

/**************************** Typography - dashboard specials */
.PageTitle {
  margin-top: 20px !important;
  margin-bottom: 10px !important;
  font-size: 2rem !important;
}

div.user-menu + h1 {
  width: 75%;
}

span.page-subheading, span span.user-counter {
  color: #999999;
  font-size: 1em;
  font-weight: 600;
}
span.user-counter {
  display: block;
  margin-top: 15px;
  font-size: 0.8em;
}
span.user-counter small {
  font-size: 0.7em;
}
@media only screen and (min-width: 768px) {
  span.user-counter {
    display: inline;
  }
}

.text-ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/**************************** weights */
.weight-light {
  font-weight: 200 !important;
}

.weight-book {
  font-weight: 300 !important;
}

.weight-normal {
  font-weight: 400 !important;
}

.weight-medium {
  font-weight: 500 !important;
}

.weight-semi-bold {
  font-weight: 600 !important;
}

.weight-bold {
  font-weight: 700 !important;
}

.weight-heavy {
  font-weight: 800 !important;
}

/**************************** colours */
/*! User Info style sheet for Battersea Systems 24/7/2021 */
.user-name {
  position: absolute;
  bottom: -25px;
  left: calc(50% - 25px);
  background-color: #f7f7f7;
  width: 50px;
  height: 50px;
  border: 2px solid #00AAE7;
  overflow: hidden;
  border-radius: 50%;
  font-size: 20px;
  padding: 0;
  text-align: center;
  line-height: 42px;
  font-weight: 200;
}
@media only screen and (max-width: 767px) {
  .user-name {
    display: none;
  }
}
html:not(.SuperAdministrator):not(.HRManager):not(.admin-login) .user-name {
  bottom: -30px;
  -moz-transition: bottom 0.5s ease;
  -webkit-transition: bottom 0.5s ease;
  -o-transition: bottom 0.5s ease;
  transition: bottom 0.5s ease;
}
.user-info {
  line-height: 3.2rem;
  position: static;
  top: 0;
}

.person-name {
  margin-bottom: 5px;
  font-weight: 700;
}
.person-title {
  margin-bottom: 30px;
  font-weight: 400 !important;
}

/*! Video style sheet for Battersea Systems 28/2/2022 */
video {
  max-width: 100%;
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.3);
  background-color: #ffffff;
}
.layout-video-02 video {
  max-width: 800px !important;
  width: 100%;
}
video.limited-width {
  max-width: 800px !important;
  width: 100%;
}

.background-video {
  overflow: hidden;
  padding: 0 !important;
}
.background-video video {
  object-fit: cover;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
}

/**************************************************  Video Popup  ************/
.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background-color: #3D3D3D;
  opacity: 0.8;
  filter: alpha(opacity=80);
}
.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1043;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.mfp-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  min-width: 300px;
  left: 0;
  top: 0;
  padding: 0 8px;
  box-sizing: border-box;
}
.mfp-container:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}
.mfp-align-top .mfp-container:before {
  display: none;
}
.mfp-container-content {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 1045;
}
@media all and (max-width: 900px) {
  .mfp-container {
    padding-left: 6px;
    padding-right: 6px;
  }
}
.mfp-inline-holder .mfp-content {
  width: 100%;
  cursor: auto;
}
.mfp-ajax-holder .mfp-content {
  width: 100%;
  cursor: auto;
}
.mfp-ajax-cur {
  cursor: progress;
}
.mfp-zoom-out-cur {
  cursor: -webkit-zoom-out;
  cursor: zoom-out;
}
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: -webkit-zoom-out;
  cursor: zoom-out;
}
.mfp-zoom {
  cursor: -webkit-zoom-in;
  cursor: zoom-in;
}
.mfp-auto-cursor .mfp-content {
  cursor: auto;
}
.mfp-close {
  @exend %mfp-select;
}
.mfp-arrow {
  @exend %mfp-select;
}
.mfp-preloader {
  @exend %mfp-select;
}
.mfp-counter {
  @exend %mfp-select;
}
.mfp-loading.mfp-figure {
  display: none;
}
.mfp-hide {
  display: none !important;
}
.mfp-preloader {
  color: #999999;
  position: absolute;
  top: 50%;
  width: auto;
  text-align: center;
  margin-top: -0.8em;
  left: 8px;
  right: 8px;
  z-index: 1044;
}
.mfp-preloader a {
  color: #999999;
}
.mfp-preloader a:hover {
  color: #ffffff;
}
.mfp-s-ready .mfp-preloader a {
  display: none;
}
.mfp-s-error .mfp-content {
  display: none;
}

button.mfp-arrow, button.mfp-close {
  overflow: visible;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  box-shadow: none;
}

button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

.mfp-close {
  width: 44px;
  height: 44px;
  line-height: 44px;
  position: absolute;
  right: 0;
  top: 0;
  text-decoration: none;
  text-align: center;
  opacity: 0.65;
  filter: alpha(opacity=65);
  padding: 0 0 18px 10px;
  color: #ffffff;
  font-style: normal;
  font-size: 28px;
  font-family: "Helvetica", Helvetica, Arial, sans-serif;
}
.mfp-close:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}
.mfp-close:focus {
  opacity: 1;
  filter: alpha(opacity=100);
}
.mfp-close:active {
  top: 1px;
}
.mfp-close-btn-in .mfp-close {
  color: #666666;
}
.mfp-image-holder .mfp-close {
  color: #ffffff;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%;
}
.mfp-iframe-holder .mfp-close {
  color: #ffffff;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%;
}

.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  color: #666666;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
}

.mfp-arrow {
  position: absolute;
  opacity: 0.65;
  filter: alpha(opacity=65);
  margin: 0;
  top: 50%;
  margin-top: -55px;
  padding: 0;
  width: 90px;
  height: 110px;
  -webkit-tap-highlight-color: transparent;
}
.mfp-arrow:active {
  margin-top: -54px;
}
.mfp-arrow:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}
.mfp-arrow:focus {
  opacity: 1;
  filter: alpha(opacity=100);
}

.mfp-arrow .mfp-b, .mfp-arrow .mfp-a, .mfp-arrow:after, .mfp-arrow:before {
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 35px;
  margin-left: 35px;
  border: medium inset transparent;
}

.mfp-arrow:before {
  border-top-width: 21px;
  border-bottom-width: 21px;
  opacity: 0.7;
}
.mfp-arrow:after {
  border-top-width: 13px;
  border-bottom-width: 13px;
  top: 8px;
}
.mfp-arrow .mfp-a {
  border-top-width: 13px;
  border-bottom-width: 13px;
  top: 8px;
}
.mfp-arrow .mfp-b {
  border-top-width: 21px;
  border-bottom-width: 21px;
  opacity: 0.7;
}
.mfp-arrow-left {
  left: 0;
}
.mfp-arrow-left:after {
  border-right: 17px solid #ffffff;
  margin-left: 31px;
}
.mfp-arrow-left .mfp-a {
  border-right: 17px solid #ffffff;
  margin-left: 31px;
}
.mfp-arrow-left:before {
  margin-left: 25px;
  border-left: 27px solid #f7f7f7;
}
.mfp-arrow-left .mfp-b {
  margin-left: 25px;
  border-left: 27px solid #f7f7f7;
}
@media all and (max-width: 900px) {
  .mfp-arrow-left {
    -webkit-transform-origin: 0;
    -ms-transform-origin: 0;
    transform-origin: 0;
  }
}
.mfp-arrow-right {
  right: 0;
}
.mfp-arrow-right:after {
  border-right: 17px solid #ffffff;
  margin-left: 39px;
}
.mfp-arrow-right .mfp-a {
  border-right: 17px solid #ffffff;
  margin-left: 39px;
}
.mfp-arrow-right:before {
  border-left: 27px solid #f7f7f7;
}
.mfp-arrow-right .mfp-b {
  border-left: 27px solid #f7f7f7;
}
@media all and (max-width: 900px) {
  .mfp-arrow-right {
    -webkit-transform-origin: 100%;
    -ms-transform-origin: 100%;
    transform-origin: 100%;
  }
}
@media all and (max-width: 900px) {
  .mfp-arrow {
    -webkit-transform: scale(0.75);
    -ms-transform: scale(0.75);
    transform: scale(0.75);
  }
}

.mfp-iframe-holder {
  padding-top: 40px;
  padding-bottom: 40px;
}
.mfp-iframe-holder .mfp-content {
  line-height: 0;
  width: 100%;
  max-width: 900px;
}
.mfp-iframe-holder .mfp-close {
  top: -40px;
}
.mfp-iframe-scaler {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-top: 56.25%;
}
.mfp-iframe-scaler iframe {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background-color: #000000;
}

img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  box-sizing: border-box;
  padding: 40px 0 40px;
  margin: 0 auto;
}

.mfp-figure {
  line-height: 0;
}
.mfp-figure:after {
  content: "";
  position: absolute;
  left: 0;
  top: 40px;
  bottom: 40px;
  display: block;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #444;
}
.mfp-figure small {
  color: #BDBDBD;
  display: block;
  font-size: 12px;
  line-height: 14px;
}
.mfp-figure figure {
  margin: 0;
}

.mfp-bottom-bar {
  margin-top: -36px;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  cursor: auto;
}

.mfp-title {
  text-align: left;
  line-height: 18px;
  color: #F3F3F3;
  word-wrap: break-word;
  padding-right: 36px;
}

.mfp-image-holder .mfp-content {
  max-width: 100%;
}
.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer;
}

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
  .mfp-img-mobile .mfp-image-holder {
    padding-left: 0;
    padding-right: 0;
  }
  .mfp-img-mobile img.mfp-img {
    padding: 0;
  }
  .mfp-img-mobile .mfp-figure:after {
    top: 0;
    bottom: 0;
  }
  .mfp-img-mobile .mfp-figure small {
    display: inline;
    margin-left: 5px;
  }
  .mfp-img-mobile .mfp-bottom-bar {
    background: rgba(0, 0, 0, 0.6);
    bottom: 0;
    margin: 0;
    top: auto;
    padding: 3px 5px;
    position: fixed;
    box-sizing: border-box;
  }
  .mfp-img-mobile .mfp-bottom-bar:empty {
    padding: 0;
  }
  .mfp-img-mobile .mfp-counter {
    right: 5px;
    top: 3px;
  }
  .mfp-img-mobile .mfp-close {
    top: 0;
    right: 0;
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    text-align: center;
    padding: 0;
  }
}

.mfp-ie7 .mfp-img {
  padding: 0;
}
.mfp-ie7 .mfp-bottom-bar {
  width: 600px;
  left: 50%;
  margin-left: -300px;
  margin-top: 5px;
  padding-bottom: 5px;
}
.mfp-ie7 .mfp-container {
  padding: 0;
}
.mfp-ie7 .mfp-content {
  padding-top: 44px;
}
.mfp-ie7 .mfp-close {
  top: 0;
  right: 0;
  padding-top: 0;
}

a.video-popup {
  position: relative;
  text-align: center;
  display: block;
}
a.video-popup img {
  max-width: 600px;
  height: auto;
  max-height: none;
  box-shadow: rgba(0, 0, 0, 0.3) 0 0 6px 0;
  padding: 0;
}
a.video-popup:before {
  display: block;
  height: 100%;
  width: 100%;
  font-family: "Glyphicons Regular";
  content: "\e221";
  font-style: normal;
  font-weight: 400;
  color: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: absolute;
  top: calc(50% - 82px);
  font-size: 6em;
  opacity: 0.6;
  transition: opacity 0.25s ease-in-out;
  -moz-transition: opacity 0.25s ease-in-out;
  -webkit-transition: opacity 0.25s ease-in-out;
}
a.video-popup:hover:before {
  opacity: 0.8;
}

/*! Widths style sheet for Battersea Systems 23/1/2024 */
.full-screen *[class*=width-] {
  max-width: none !important;
}

@media only screen and (min-width: 768px) {
  .width-5 {
    width: 5% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-10 {
    width: 10% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-15 {
    width: 15% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-20 {
    width: 20% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-25 {
    width: 25% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-30 {
    width: 30% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-30 {
    width: 35% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-40 {
    width: 40% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-45 {
    width: 45% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-50 {
    width: 50% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-55 {
    width: 55% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-60 {
    width: 60% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-65 {
    width: 65% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-70 {
    width: 70% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

@media only screen and (min-width: 768px) {
  .width-75 {
    width: 75% !important;
  }
}

@media only screen and (min-width: 768px) {
  .width-80 {
    width: 80% !important;
  }
}

@media only screen and (min-width: 768px) {
  .width-85 {
    width: 85% !important;
  }
}

@media only screen and (min-width: 768px) {
  .width-90 {
    width: 90% !important;
  }
}

@media only screen and (min-width: 768px) {
  .width-95 {
    width: 95% !important;
  }
}

.width-100 {
  width: 100% !important;
}

.p-width-5 {
  width: 5px;
}

.p-width-10 {
  width: 10px;
}

.p-width-15 {
  width: 15px;
}

.p-width-20 {
  width: 20px;
}

.p-width-25 {
  width: 25px;
}

.p-width-30 {
  width: 30px;
}

.p-width-35 {
  width: 35px;
}

.p-width-40 {
  width: 40px;
}

.p-width-45 {
  width: 45px;
}

.p-width-50 {
  width: 50px;
}

.width-75 {
  margin-left: auto;
  margin-right: auto;
}

.width-80 {
  margin-left: auto;
  margin-right: auto;
}

.width-85 {
  margin-left: auto;
  margin-right: auto;
}

.width-90 {
  margin-left: auto;
  margin-right: auto;
}

.width-95 {
  margin-left: auto;
  margin-right: auto;
}

.width-auto {
  min-width: auto;
}

.width-25vw {
  min-width: 25vw;
}

.width-50vw {
  min-width: 50vw;
}

.width-75vw {
  min-width: 75vw;
}

.width-100vw, .full-width {
  min-width: 100vw;
}

/************************************** Type and Colours ****/
/*! Content Colours style sheet for Battersea Systems 11/9/2024 */
.background-incomplete {
  background-color: #EDAD44;
}
.background-Incomplete {
  background-color: #EDAD44;
}
.background-fail {
  background-color: #a94442;
}
.background-Fail {
  background-color: #a94442;
}
.background-Pass {
  background-color: #0a6242;
}
.background-pass {
  background-color: #0a6242;
}
.background-rsvp {
  background-color: #6FC9C6;
}
.background-no-test {
  background-color: #F26A21;
}
.background-accepted {
  background-color: #69C073;
}
.back-primary1-90 {
  background-color: rgba(1, 1, 1, 0.9);
}
.back-primary1-80 {
  background-color: rgba(1, 1, 1, 0.8);
}
.back-primary1-70 {
  background-color: rgba(1, 1, 1, 0.7);
}
.back-primary1-60 {
  background-color: rgba(1, 1, 1, 0.6);
}
.back-primary1-50 {
  background-color: rgba(1, 1, 1, 0.5);
}
.back-primary2-90 {
  background-color: rgba(0, 170, 231, 0.9);
}
.back-primary2-80 {
  background-color: rgba(0, 170, 231, 0.8);
}
.back-primary2-70 {
  background-color: rgba(0, 170, 231, 0.7);
}
.back-primary2-60 {
  background-color: rgba(0, 170, 231, 0.6);
}
.back-primary2-50 {
  background-color: rgba(0, 170, 231, 0.5);
}
.back-primary3-90 {
  background-color: rgba(51, 99, 175, 0.9);
}
.back-primary3-80 {
  background-color: rgba(51, 99, 175, 0.8);
}
.back-primary3-70 {
  background-color: rgba(51, 99, 175, 0.7);
}
.back-primary3-60 {
  background-color: rgba(51, 99, 175, 0.6);
}
.back-primary3-50 {
  background-color: rgba(51, 99, 175, 0.5);
}
.back-primary4-90 {
  background-color: rgba(180, 187, 201, 0.9);
}
.back-primary4-80 {
  background-color: rgba(180, 187, 201, 0.8);
}
.back-primary4-70 {
  background-color: rgba(180, 187, 201, 0.7);
}
.back-primary4-60 {
  background-color: rgba(180, 187, 201, 0.6);
}
.back-primary4-50 {
  background-color: rgba(180, 187, 201, 0.5);
}
.back-secondary1-90 {
  background-color: rgba(155, 79, 159, 0.9);
}
.back-secondary2-90 {
  background-color: rgba(242, 106, 33, 0.9);
}
.back-secondary2-80 {
  background-color: rgba(242, 106, 33, 0.8);
}
.back-secondary2-70 {
  background-color: rgba(242, 106, 33, 0.7);
}
.back-secondary2-60 {
  background-color: rgba(242, 106, 33, 0.6);
}
.back-secondary2-50 {
  background-color: rgba(242, 106, 33, 0.5);
}
.back-secondary3-90 {
  background-color: rgba(111, 201, 198, 0.9);
}
.back-secondary3-80 {
  background-color: rgba(111, 201, 198, 0.8);
}
.back-secondary3-70 {
  background-color: rgba(111, 201, 198, 0.7);
}
.back-secondary3-60 {
  background-color: rgba(111, 201, 198, 0.6);
}
.back-secondary3-50 {
  background-color: rgba(111, 201, 198, 0.5);
}
.back-secondary4-90 {
  background-color: rgba(105, 192, 115, 0.9);
}
.back-secondary4-80 {
  background-color: rgba(105, 192, 115, 0.8);
}
.back-secondary4-70 {
  background-color: rgba(105, 192, 115, 0.7);
}
.back-secondary4-60 {
  background-color: rgba(105, 192, 115, 0.6);
}
.back-secondary4-50 {
  background-color: rgba(105, 192, 115, 0.5);
}
.back-black-90 {
  background-color: rgba(0, 0, 0, 0.9);
}
.back-black-80 {
  background-color: rgba(0, 0, 0, 0.8);
}
.back-black-70 {
  background-color: rgba(0, 0, 0, 0.7);
}
.back-black-60 {
  background-color: rgba(0, 0, 0, 0.6);
}
.back-black-50 {
  background-color: rgba(0, 0, 0, 0.5);
}
.back-black-grey-90 {
  background-color: rgba(61, 61, 61, 0.9);
}
.back-black-grey-80 {
  background-color: rgba(61, 61, 61, 0.8);
}
.back-black-grey-70 {
  background-color: rgba(61, 61, 61, 0.7);
}
.back-black-grey-60 {
  background-color: rgba(61, 61, 61, 0.6);
}
.back-black-grey-50 {
  background-color: rgba(61, 61, 61, 0.5);
}
.back-dark-grey-90 {
  background-color: rgba(102, 102, 102, 0.9);
}
.back-dark-grey-80 {
  background-color: rgba(102, 102, 102, 0.8);
}
.back-dark-grey-70 {
  background-color: rgba(102, 102, 102, 0.7);
}
.back-dark-grey-60 {
  background-color: rgba(102, 102, 102, 0.6);
}
.back-dark-grey-50 {
  background-color: rgba(102, 102, 102, 0.5);
}
.back-mid-grey-90 {
  background-color: rgba(153, 153, 153, 0.9);
}
.back-mid-grey-80 {
  background-color: rgba(153, 153, 153, 0.8);
}
.back-mid-grey-70 {
  background-color: rgba(153, 153, 153, 0.7);
}
.back-mid-grey-60 {
  background-color: rgba(153, 153, 153, 0.6);
}
.back-mid-grey-50 {
  background-color: rgba(153, 153, 153, 0.5);
}
.back-grey-90 {
  background-color: rgba(153, 153, 153, 0.9);
}
.back-grey-80 {
  background-color: rgba(153, 153, 153, 0.8);
}
.back-grey-70 {
  background-color: rgba(153, 153, 153, 0.7);
}
.back-grey-60 {
  background-color: rgba(153, 153, 153, 0.6);
}
.back-grey-50 {
  background-color: rgba(153, 153, 153, 0.5);
}
.back-light-grey-90 {
  background-color: rgba(204, 204, 204, 0.9);
}
.back-light-grey-80 {
  background-color: rgba(204, 204, 204, 0.8);
}
.back-light-grey-70 {
  background-color: rgba(204, 204, 204, 0.7);
}
.back-light-grey-60 {
  background-color: rgba(204, 204, 204, 0.6);
}
.back-light-grey-50 {
  background-color: rgba(204, 204, 204, 0.5);
}
.back-white-grey-90 {
  background-color: rgba(247, 247, 247, 0.9);
}
.back-white-grey-80 {
  background-color: rgba(247, 247, 247, 0.8);
}
.back-white-grey-70 {
  background-color: rgba(247, 247, 247, 0.7);
}
.back-white-grey-60 {
  background-color: rgba(247, 247, 247, 0.6);
}
.back-white-grey-50 {
  background-color: rgba(247, 247, 247, 0.5);
}
.back-white-90 {
  background-color: rgba(255, 255, 255, 0.9);
}
.back-white-80 {
  background-color: rgba(255, 255, 255, 0.8);
}
.back-white-70 {
  background-color: rgba(255, 255, 255, 0.7);
}
.back-white-60 {
  background-color: rgba(255, 255, 255, 0.6);
}
.back-white-50 {
  background-color: rgba(255, 255, 255, 0.5);
}
.back-default-90 {
  background-color: rgba(98, 142, 197, 0.9);
}
.back-default-80 {
  background-color: rgba(98, 142, 197, 0.8);
}
.back-default-70 {
  background-color: rgba(98, 142, 197, 0.7);
}
.back-default-60 {
  background-color: rgba(98, 142, 197, 0.6);
}
.back-default-50 {
  background-color: rgba(98, 142, 197, 0.5);
}
.back-success-90 {
  background-color: rgba(10, 98, 66, 0.9);
}
.back-success-80 {
  background-color: rgba(10, 98, 66, 0.8);
}
.back-success-70 {
  background-color: rgba(10, 98, 66, 0.7);
}
.back-success-60 {
  background-color: rgba(10, 98, 66, 0.6);
}
.back-success-50 {
  background-color: rgba(10, 98, 66, 0.5);
}
.back-information-90 {
  background-color: rgba(68, 108, 169, 0.9);
}
.back-information-80 {
  background-color: rgba(68, 108, 169, 0.8);
}
.back-information-70 {
  background-color: rgba(68, 108, 169, 0.7);
}
.back-information-60 {
  background-color: rgba(68, 108, 169, 0.6);
}
.back-information-50 {
  background-color: rgba(68, 108, 169, 0.5);
}
.back-warning-90 {
  background-color: rgba(237, 173, 68, 0.9);
}
.back-warning-80 {
  background-color: rgba(237, 173, 68, 0.8);
}
.back-warning-70 {
  background-color: rgba(237, 173, 68, 0.7);
}
.back-warning-60 {
  background-color: rgba(237, 173, 68, 0.6);
}
.back-warning-50 {
  background-color: rgba(237, 173, 68, 0.5);
}
.back-danger-90 {
  background-color: rgba(169, 68, 66, 0.9);
}
.back-danger-80 {
  background-color: rgba(169, 68, 66, 0.8);
}
.back-danger-70 {
  background-color: rgba(169, 68, 66, 0.7);
}
.back-danger-60 {
  background-color: rgba(169, 68, 66, 0.6);
}
.back-danger-50 {
  background-color: rgba(169, 68, 66, 0.5);
}
.back-important-90 {
  background-color: rgba(169, 68, 66, 0.9);
}
.back-important-80 {
  background-color: rgba(169, 68, 66, 0.8);
}
.back-important-70 {
  background-color: rgba(169, 68, 66, 0.7);
}
.back-important-60 {
  background-color: rgba(169, 68, 66, 0.6);
}
.back-important-50 {
  background-color: rgba(169, 68, 66, 0.5);
}
.back-blue-90 {
  background-color: rgba(98, 142, 197, 0.9);
}
.back-blue-80 {
  background-color: rgba(98, 142, 197, 0.8);
}
.back-blue-70 {
  background-color: rgba(98, 142, 197, 0.7);
}
.back-blue-60 {
  background-color: rgba(98, 142, 197, 0.6);
}
.back-blue-50 {
  background-color: rgba(98, 142, 197, 0.5);
}
.back-example-90 {
  background-color: rgba(98, 142, 197, 0.9);
}
.back-example-80 {
  background-color: rgba(98, 142, 197, 0.8);
}
.back-example-70 {
  background-color: rgba(98, 142, 197, 0.7);
}
.back-example-60 {
  background-color: rgba(98, 142, 197, 0.6);
}
.back-example-50 {
  background-color: rgba(98, 142, 197, 0.5);
}
.back-case-90 {
  background-color: rgba(138, 109, 59, 0.9);
}
.back-case-80 {
  background-color: rgba(138, 109, 59, 0.8);
}
.back-case-70 {
  background-color: rgba(138, 109, 59, 0.7);
}
.back-case-60 {
  background-color: rgba(138, 109, 59, 0.6);
}
.back-case-50 {
  background-color: rgba(138, 109, 59, 0.5);
}
.back-did-you-know-90 {
  background-color: rgba(240, 193, 5, 0.9);
}
.back-did-you-know-80 {
  background-color: rgba(240, 193, 5, 0.8);
}
.back-did-you-know-70 {
  background-color: rgba(240, 193, 5, 0.7);
}
.back-did-you-know-60 {
  background-color: rgba(240, 193, 5, 0.6);
}
.back-did-you-know-50 {
  background-color: rgba(240, 193, 5, 0.5);
}
.back-incomplete {
  background-color: #EDAD44;
}
.back-Incomplete {
  background-color: #EDAD44;
}
.back-fail {
  background-color: #a94442;
}
.back-Fail {
  background-color: #a94442;
}
.back-Pass {
  background-color: #0a6242;
}
.back-pass {
  background-color: #0a6242;
}
.back-rsvp {
  background-color: #6FC9C6;
}
.back-no-test {
  background-color: #F26A21;
}
.back-accepted {
  background-color: #69C073;
}
.colour-background-incomplete {
  background-color: #EDAD44;
}
.colour-background-Incomplete {
  background-color: #EDAD44;
}
.colour-background-fail {
  background-color: #a94442;
}
.colour-background-Fail {
  background-color: #a94442;
}
.colour-background-Pass {
  background-color: #0a6242;
}
.colour-background-pass {
  background-color: #0a6242;
}
.colour-background-rsvp {
  background-color: #6FC9C6;
}
.colour-background-no-test {
  background-color: #F26A21;
}
.colour-background-accepted {
  background-color: #69C073;
}
/****************************** Text colours */
/****************************** Overlay colours */
/****************************** Text highlighting */
/****************************** Labels */
/****************************** Lines */
/****************************** Panels */
.panel.panel-low {
  border: 2px solid transparent;
}
.panel.panel-low > .panel-header {
  border-bottom: 1px solid #628ec5;
}
.panel.panel-low > .panel-footer {
  border-top-color: #628ec5;
}
.panel.panel-medium {
  border: 2px solid transparent;
}
.panel.panel-medium > .panel-header {
  border-bottom: 1px solid #446ca9;
}
.panel.panel-medium > .panel-footer {
  border-top-color: #446ca9;
}
.panel.panel-high {
  border: 2px solid transparent;
}
.panel.panel-high > .panel-header {
  border-bottom: 1px solid #EDAD44;
}
.panel.panel-high > .panel-footer {
  border-top-color: #EDAD44;
}
.panel.panel-very-high {
  border: 2px solid transparent;
}
.panel.panel-very-high > .panel-header {
  border-bottom: 1px solid #a94442;
}
.panel.panel-very-high > .panel-footer {
  border-top-color: #a94442;
}

/****************************** Icon-boxes */
.text-icon-box.back-blue {
  background-color: #628ec5 !important;
}
.text-icon-box.back-blue:before {
  background-color: #628ec5;
}
.text-icon-box.back-lime {
  background-color: #ABC059;
}
.text-icon-box.back-lime:before {
  background-color: #ABC059;
}
.text-icon-box.back-cyan {
  background-color: #01c1d0;
}
.text-icon-box.back-cyan:before {
  background-color: #01c1d0;
}
.text-icon-box.back-lavender {
  background-color: #A5ABCD;
}
.text-icon-box.back-lavender:before {
  background-color: #A5ABCD;
}
.text-icon-box.back-sea {
  background-color: #242657;
}
.text-icon-box.back-sea:before {
  background-color: #242657;
}
.text-icon-box.back-apricot {
  background-color: #f3ae53;
}
.text-icon-box.back-apricot:before {
  background-color: #f3ae53;
}
.text-icon-box.back-purple {
  background-color: #5D4786 !important;
}
.text-icon-box.back-purple:before {
  background-color: #5D4786;
}
.text-icon-box.back-primary1 {
  background-color: #010101;
}
.text-icon-box.back-primary1:before {
  background-color: #010101;
}
.text-icon-box.back-primary2 {
  background-color: #00AAE7;
}
.text-icon-box.back-primary2:before {
  background-color: #00AAE7;
}
.text-icon-box.back-primary3 {
  background-color: #3363AF;
}
.text-icon-box.back-primary3:before {
  background-color: #3363AF;
}
.text-icon-box.back-primary4 {
  background-color: #B4BBC9;
}
.text-icon-box.back-primary4:before {
  background-color: #B4BBC9;
}
.text-icon-box.back-secondary1 {
  background-color: #9B4F9F;
}
.text-icon-box.back-secondary1:before {
  background-color: #9B4F9F;
}
.text-icon-box.back-secondary2 {
  background-color: #F26A21;
}
.text-icon-box.back-secondary2:before {
  background-color: #F26A21;
}
.text-icon-box.back-secondary3 {
  background-color: #6FC9C6;
}
.text-icon-box.back-secondary3:before {
  background-color: #6FC9C6;
}
.text-icon-box.back-secondary4 {
  background-color: #69C073;
}
.text-icon-box.back-secondary4:before {
  background-color: #69C073;
}

/*! Customer Colour style sheet for Battersea Systems 1/10/2025 */
/****************************** Text colour groups*/
/********************* Text colour Primary 1 */
.color-primary1 {
  color: #010101;
}

/********************* Text colour Primary 2 */
html.admin-login .modal-header h1, html.admin-login .modal-header h2, html.admin-login .modal-header h3, .color-primary2 {
  color: #00AAE7 !important;
}

/********************* Text colour Primary 3 */
.color-primary3 {
  color: #3363AF !important;
}

/********************* Text colour Primary 4 */
.color-primary4 {
  color: #B4BBC9 !important;
}

/********************* Text colour Secondary 1*/
.color-secondary1 {
  color: #9B4F9F !important;
}

/********************* Text colour Secondary 2*/
.color-secondary2 {
  color: #F26A21;
}

/********************* Text colour Secondary 3*/
.color-secondary3 {
  color: #6FC9C6;
}

/********************* Text colour Secondary 4*/
.color-secondary4 {
  color: #69C073;
}

/********************* Text colour Black*/
.nav-list > li .submenu > li > a:hover {
  color: #000000;
}

.text-overlay > *, .color-black {
  color: #000000 !important;
}

/********************* Text colour Black Grey*/
.color-black-grey {
  color: #3D3D3D !important;
}

/********************* Text colour Dark Grey*/
div.user-menu a:hover, div.user-menu a:focus {
  color: #666666;
}

.color-dark-grey {
  color: #666666 !important;
}

/********************* Text colour Grey*/
.modal-panel, div.user-menu a {
  color: #999999;
}

.color-grey {
  color: #999999 !important;
}

/********************* Text colour Light Grey*/
.color-light-grey {
  color: #CCCCCC !important;
}

/********************* Text colour White Grey*/
div.user-menu h3 {
  color: #f7f7f7 !important;
}

.color-white-grey {
  color: #f7f7f7 !important;
}

/********************* Text colour White*/
.training.main-menu > a, .training.student-menu > a {
  color: #ffffff;
}

.training-navigation .btn.btn-default, .text-overlay.dark > *, .color-white, .color-white h1 {
  color: #ffffff !important;
}

/********************* Text colour text*/
/********************* Text colour link*/
/********************* Text colour Heading*/
/********************* Text colour default*/
.color-default {
  color: #628ec5;
}

/********************* Text colour success*/
.color-success {
  color: #0a6242;
}

/********************* Text colour information*/
.color-information, .color-info {
  color: #446ca9;
}

/********************* Text colour warning*/
.color-warning {
  color: #EDAD44;
}

/********************* Text colour danger*/
.color-danger {
  color: #a94442;
}

/********************* Text colour case*/
/********************* Text colour example*/
.alert-example {
  color: #628ec5;
}

/********************* Text colour important*/
.color-important {
  color: #a94442;
}

/********************* Text colour correct*/
/********************* Text colour incorrect*/
/********************* Text colour yes*/
/********************* Text colour no*/
/********************* Text colour did-you-know*/
/********************* Text colour Blue*/
.colour-blue, .color-blue {
  color: #229DF5;
}

/****************************** Background colour groups */
/********************* Background colour Black*/
.background-black, .overlay-colour-black:before {
  background-color: #000000;
}

.back-black, .colour-background-black {
  background-color: #000000 !important;
}

/********************* Background colour black-grey*/
.background-black-grey, .overlay-colour-black-grey:before {
  background-color: #3D3D3D;
}

.back-black-grey, .colour-background-black-grey {
  background-color: #3D3D3D !important;
}

/********************* Background colour dark-grey*/
.training.main-menu > a, .training.main-menu > a:hover, .training.student-menu > a, .training.student-menu > a:hover, .training.student-menu > a*:nth-child(even), .background-dark-grey, .overlay-colour-dark-grey:before {
  background-color: #666666;
}

.back-dark-grey, .colour-background-dark-grey {
  background-color: #666666 !important;
}

/********************* Background colour grey*/
div[class*=-group] .icon, .nav-list > li .submenu:before, .training.main-menu > a*:nth-child(even), .module-test-item, .background-grey, .overlay-colour-mid-grey:before, .overlay-colour-grey:before {
  background-color: #999999;
}

.back-mid-grey, .back-grey, .colour-background-mid-grey, .colour-background-grey {
  background-color: #999999 !important;
}

/********************* Background colour light-grey*/
.background-light-grey, .overlay-colour-light-grey:before {
  background-color: #CCCCCC;
}

.back-light-grey, .colour-background-light-grey {
  background-color: #CCCCCC !important;
}

/********************* Background colour white-grey*/
.modal-panel, .nav-list > li .submenu, .background-white-grey, .overlay-colour-white-grey:before {
  background-color: #f7f7f7;
}

.back-white-grey, .colour-background-white-grey {
  background-color: #f7f7f7 !important;
}

/********************* Background colour white*/
.panel-collapse .jumbotron, .background-white, .overlay-colour-white:before {
  background-color: #ffffff;
}

.back-white, .colour-background-white {
  background-color: #ffffff !important;
}

/********************* Background colour primary1*/
.background-primary1, .overlay-colour-primary1:before {
  background-color: #010101;
}

.back-primary1, .colour-background-primary-1, .text-highlight-primary, .label-primary, .label-reopen, .label-inactive {
  background-color: #010101 !important;
}

/********************* Background colour primary2*/
.background-primary2, .overlay-colour-primary2:before {
  background-color: #00AAE7;
}

.back-primary2, .colour-background-primary-2 {
  background-color: #00AAE7 !important;
}

/********************* Background colour primary3*/
.background-primary3, .overlay-colour-primary3:before {
  background-color: #3363AF;
}

.back-primary3, .colour-background-primary-3 {
  background-color: #3363AF !important;
}

/********************* Background colour primary4*/
.background-primary4, .overlay-colour-primary4:before {
  background-color: #B4BBC9;
}

.back-primary4, .colour-background-primary-4 {
  background-color: #B4BBC9 !important;
}

/********************* Background colour secondary1*/
.background-secondary1, .overlay-colour-secondary1:before {
  background-color: #9B4F9F;
}

.back-secondary1, .colour-background-secondary-1 {
  background-color: #9B4F9F !important;
}

/********************* Background colour secondary2*/
.background-secondary2, .overlay-colour-secondary2:before {
  background-color: #F26A21;
}

.back-secondary2, .colour-background-secondary-2 {
  background-color: #F26A21 !important;
}

/********************* Background colour secondary3*/
.background-secondary3, .overlay-colour-secondary3:before {
  background-color: #6FC9C6;
}

.back-secondary3, .colour-background-secondary-3 {
  background-color: #6FC9C6 !important;
}

/********************* Background colour secondary4*/
.background-secondary4, .overlay-colour-secondary4:before {
  background-color: #69C073;
}

.back-secondary4, .colour-background-secondary-4 {
  background-color: #69C073 !important;
}

/********************* Background colour success*/
.background-success, .overlay-colour-success:before {
  background-color: #0a6242;
}

.do-group .icon, .back-success, .colour-background-success, .text-highlight-success, .text-highlight-Completed, .label-success, .label-solved, .label-low {
  background-color: #0a6242 !important;
}

/********************* Background colour information*/
.background-information, .background-info, .overlay-colour-info:before, .overlay-colour-information:before {
  background-color: #446ca9;
}

.back-information, .colour-background-information, .text-highlight-info, .label-information, .label-info, .label-medium {
  background-color: #446ca9 !important;
}

/********************* Background colour warning*/
.background-warning {
  background-color: #EDAD44;
}

.back-warning, .colour-background-warning, .text-highlight-warning, .label-warning, .label-high {
  background-color: #EDAD44 !important;
}

/********************* Background colour danger*/
.background-danger, .overlay-colour-important:before, .overlay-colour-danger:before {
  background-color: #a94442;
}

.dont-group .icon, .back-danger, .colour-background-danger, .label-danger, .label-very-high {
  background-color: #a94442 !important;
}

/********************* Background colour important*/
.background-important, .overlay-colour-warning:before {
  background-color: #a94442;
}

.back-important, .colour-background-important, .text-highlight-important, .label-important {
  background-color: #a94442 !important;
}

/********************* Background colour default*/
.background-default, .overlay-colour-default:before {
  background-color: #628ec5;
}

.back-default, .colour-background-default, .label-default {
  background-color: #628ec5 !important;
}

/********************* Background colour case*/
.back-case, .colour-background-case {
  background-color: #8a6d3b !important;
}

/********************* Background colour example*/
.background-example {
  background-color: #628ec5;
}

.back-example, .colour-background-example {
  background-color: #628ec5 !important;
}

/********************* Background colour did-you-know*/
.back-did-you-know, .colour-background-did-you-know {
  background-color: #f0c105 !important;
}

/********************* Back colour correct */
.text-highlight-Pass {
  background-color: #0a6242 !important;
}

/********************* Back colour incorrect */
.text-highlight-Fail {
  background-color: #a94442 !important;
}

/********************* Back colour incomplete */
.text-highlight-Incomplete {
  background-color: #EDAD44 !important;
}

/********************* Back colour draft */
.label-Draft, .label-pending {
  background-color: #b2a798 !important;
}

/********************* Back colour administration */
.label-Administration {
  background-color: #a7b9c9 !important;
}

/********************* Back colour Active */
.label-Active, .label-active {
  background-color: #399ecc !important;
}

/********************* Back colour expired */
.label-Expired {
  background-color: #cc7d8c !important;
}

/********************* Back colour closed */
.label-closed {
  background-color: #cc7d8c !important;
}

/********************* Back colour archived */
.label-Archived {
  background-color: #c6ccb5 !important;
}

/********************* Back colour apricot */
.overlay-colour-apricot, .label-apricot {
  background-color: #f3ae53;
}

.background-apricot, .back-apricot, .colour-background-apricot {
  background-color: #f3ae53 !important;
}

/********************* Background colour blue*/
.background-blue, .overlay-colour-blue:before {
  background-color: #628ec5;
}

.back-blue, .colour-background-blue, .label-in-progress, .label-blue {
  background-color: #628ec5 !important;
}

/********************* Background colour cyan*/
.overlay-colour-cyan, .label-cyan {
  background-color: #01c1d0;
}

.background-cyan, .back-cyan, .colour-background-cyan {
  background-color: #01c1d0 !important;
}

/********************* Back colour lavender */
.overlay-colour-lavender, .label-lavender {
  background-color: #A5ABCD;
}

.background-lavender, .back-lavender, .colour-background-lavender {
  background-color: #A5ABCD !important;
}

/********************* Back colour lime */
.overlay-colour-lime, .label-lime {
  background-color: #ABC059;
}

.background-lime, .back-lime, .colour-background-lime {
  background-color: #ABC059 !important;
}

/********************* Back colour purple */
.overlay-colour-purple, .label-purple {
  background-color: #5D4786;
}

.background-purple, .back-purple, .colour-background-purple {
  background-color: #5D4786 !important;
}

/********************* Back colour sea */
.overlay-colour-sea, .label-sea {
  background-color: #242657;
}

.background-sea, .back-sea, .colour-background-sea {
  background-color: #242657 !important;
}

/****************************** Border colour groups */
/********************* Border colour Black*/
.line-black {
  border-color: #000000;
}

/********************* Border colour black-grey*/
.line-black-grey {
  border-color: #3D3D3D !important;
}

/********************* Border colour dark-grey*/
.line-dark-grey {
  border-color: #666666 !important;
}

/********************* Border colour grey*/
.modal-panel {
  border-color: #999999;
}

.line-mid-grey, .line-grey {
  border-color: #999999 !important;
}

/********************* Border colour light-grey*/
.line-light-grey {
  border-color: #CCCCCC !important;
}

/********************* Border colour white-grey*/
div.media-preview {
  border-color: #f7f7f7;
}

.line-white-grey {
  border-color: #f7f7f7 !important;
}

/********************* Border colour white*/
.line-white {
  border-color: #ffffff;
}

.line-white {
  border-color: #ffffff !important;
}

/********************* Border colour primary1*/
.line-primary1 {
  border-color: #010101 !important;
}

/********************* Border colour primary2*/
.line-primary2 {
  border-color: #00AAE7 !important;
}

/********************* Border colour primary3*/
.line-primary3 {
  border-color: #3363AF !important;
}

/********************* Border colour primary4*/
.line-primary4 {
  border-color: #B4BBC9 !important;
}

/********************* Border colour secondary1*/
.line-secondary1 {
  border-color: #9B4F9F !important;
}

/********************* Border colour secondary2*/
.line-secondary2 {
  border-color: #F26A21 !important;
}

/********************* Border colour secondary3*/
.line-secondary3 {
  border-color: #6FC9C6 !important;
}

/********************* Border colour secondary4*/
.line-secondary4 {
  border-color: #69C073 !important;
}

/********************* Border colour success*/
.do-group .copy, .line-success {
  border-color: #0a6242 !important;
}

/********************* Border colour information*/
.panel.panel-medium {
  border-color: #446ca9;
}

.line-information {
  background-color: #446ca9 !important;
}

/********************* Border colour warning*/
.panel.panel-high {
  border-color: #EDAD44;
}

.line-warning {
  border-color: #EDAD44 !important;
}

/********************* Border colour danger*/
.panel.panel-very-high {
  border-color: #a94442;
}

.dont-group .copy, .line-danger {
  border-color: #a94442 !important;
}

/********************* Border colour important*/
.line-important {
  border-color: #a94442 !important;
}

/********************* Border colour default*/
.panel.panel-low {
  border-color: #628ec5;
}

.line-default {
  border-color: #628ec5 !important;
}

/********************* Border colour blue*/
.line-blue {
  border-color: #628ec5 !important;
}

/********************* Border colour case*/
/********************* Border colour example*/
/********************* Border colour did-you-know */
/********************* Border colour correct */
/********************* Border colour incorrect */
/* Type Groups Styles CSS style sheet for Battersea Systems 3/08/2021 */
/********************* Site */
.did-you-know:before, .Did-you-know:before {
  font-family: "Helvetica", Helvetica, Arial, sans-serif;
}

/********************* heading */
/********************* heading-weight */
/********************* heading-colour */
/********************* Serif */
/********************* San Serif */
/********************* Icons */
.nav-list > li .submenu > li > a:before, .question-answer input[type=checkbox] + label:before, .question-answer input[type=radio] + label:before {
  font-family: "Glyphicons Regular";
}

/***** 1:53 *****/