@charset "utf-8";
/* CSS Document */
/*  Table of Contents 



01. FEATURE STYLES

	A. SEARCH BAR

	B. STICKY

	C. FORM LIST AND FORM VALIDATION

	D. FX REPLACE

    E. COUNTDOWN CLOCK

    F. TIMELINE



02. NAVIGATION STYLES

	A. OFF-CANVAS

	B. TOP BAR

    C. MAIN NAVIGATION BAR

    D. LEFT NAVIGATION BAR

	E. BREADCRUMBS, PAGENATION & PROGRESS INDICATOR



03. CONTAINER STYLES

    A. MAIN SECTION

    B. LEFT SECTION

	C. RIGHT SECTION

	D. FOOTER

	E. OVERLAP OVER CONTAINERS

	F. BLOCK GRIDS

	G. POSTS & TOOLS



04. CONTENT STYLES

	A. HEADERS, PARAGRAPHS, BODY

	B. LISTS

    C. TABS AND ACCORDION

    D. DROPDOWNS

    E. TABLES

    F. HYPERLINKS

    G. LABELS AND HIGHLIGHTS

	H. LINES AND DIVIDERS

	I. COLOURS

	J. FORMS AND VALIDATIONS

	K. V-CARDS



05. BUTTON STYLES

	A. SINGLE BUTTONS

	B. BUTTON GROUPS

	C. SPLIT BUTTONS

	D. DROPDOWN BUTTONS    



06. CALLOUTS AND PROMPT STYLES

	A. MODALS

	B. ALERTS AND FIELD SETS

	C. PANELS, DIVISIONS AND SPANS

	D. TOOL TIPS

	E. JOYRIDES

	F. PRICING TABLES



07. IMAGE AND MEDIA STYLES

	A. THUMBNAILS

	B. SLIDERS

	C. IFRAME

	D. BACKGROUND IMAGE



*/
/* DEEJAYS.COM */
/*



=============================================== 01. FEATURE STYLES ===============================================



*/
.sortable-placeholder {
  height: 200px;
  background: #2196f3;
  border: 2px dashed #000;
}
.drag-handle {
  cursor: move; /* Shows a 'move' cursor to indicate dragging */
  padding: 5px;
  border-bottom: 2px dashed #C2C2C2;
}
.drag-handle i {
  font-size: 1.25em; /* Adjust icon size as needed */
  color: #C2C2C2; /* Adjust color for better contrast */
  padding-right: 0.625em;
  padding-top: 0.375em;
}
.dragged-highlight {
  animation: highlightFade 1s ease-out;
}
@keyframes highlightFade {
  0% {
    background-color: #1c7cc8; /* Light yellow highlight */
  }
  100% {
    background-color: transparent;
  }
}
.responsive-input {
  width: 100%; /* Full width to make it responsive */
  max-width: 100%; /* Ensure it doesn't exceed its container */
  box-sizing: border-box; /* Include padding and border in the width */
}
@media (max-width: 768px) {
  .responsive-input {
    width: 100%; /* Take full width on smaller screens */
  }
}
@media (min-width: 768px) {
  .responsive-input {
    width: auto; /* Adapt to the size of the container on larger screens */
  }
}
.postal-code-input {
  text-transform: uppercase; /* Ensures letters are uppercase */
}
/* -------------------- A. SEARCH BAR -------------------- */
table.gsc-search-box td.gsc-input {
  padding-top: 24px;
}
.button.search-button {
  width: 39px;
  height: 39px;
  background-size: 20px 20px;
  background-color: #f2f2f2;
  background-image: url("../img/search_icon.png");
  background-repeat: no-repeat;
  background-position: center center;
  padding-left: 0;
  padding-right: 0;
  border-radius: 0px;
  border: 0.063rem solid #cacaca;
  border-left: 0rem solid #cacaca;
}
.button.search-button:hover {
  background-color: #e8e6e6;
}
.button.clear-button {
  width: 39px;
  height: 39px;
  background-size: 20px 20px;
  background-color: #fefefe;
  background-image: url("../img/delete_icon.png");
  background-repeat: no-repeat;
  background-position: center center;
  padding-left: 0;
  padding-right: 0;
  border-radius: 0px;
  border: 0.063rem solid #cacaca;
  border-left: 0rem solid #cacaca;
}
.button.clear-button:hover {
  background-color: #e8e6e6;
}
.button.clear, .button.clear:hover, .button.clear:focus {
  cursor: pointer;
  color: #4968a9;
  padding-top: 0px;
}
.button.clear:hover, .button.clear:focus {
  color: #5275bd;
}
#clear-search-button {
  cursor: pointer;
  color: #4968a9;
  font-size: .750em;
}
#clear-search-button:hover, #clear-search-button:focus {
  text-decoration: underline;
}
/* -------------------- B. STICKY -------------------- */
.js-off-canvas-overlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 11;
  width: 100%;
  height: 100%;
  transition: opacity 0.5s ease, visibility 0.5s ease;
  background: rgba(254, 254, 254, 0.25);
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
}
.js-off-canvas-overlay.is-overlay-fixed {
  position: fixed;
}
.very_very_top {
  left: 0;
  top: 0;
  /*height: 39px;*/
  width: 100%;
  z-index: 1001;
  position: fixed;
  border: none;
  border-bottom: 1px solid #aeafaf;
  margin: 0;
  /*margin-bottom: 38px;*/
  box-shadow: 0px 3px 5px rgb(118, 118, 118, 0.3);
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  padding-left: 1.5em;
  padding-right: 1.5em;
  background: linear-gradient(to bottom, #ffffff, #ccced0);
}
.sticky {
  z-index: 10;
}
/*.sticky.is-stuck {

    position: fixed;

    z-index: 101;

    width: 100%;

}*/
.search_stick {
  position: fixed;
  z-index: 10;
}
/* -------------------- C. FORM LIST AND FORM VALIDATION -------------------- */
.contact-us-section {
  padding: 2rem;
  background: #fefefe;
}
.contact-us-section .contact-us-section-left {
  padding-right: 2rem;
  border-bottom: 2px solid #e6e6e6;
  padding-bottom: 2rem;
  margin-bottom: 2rem;
}
@media print, screen and (min-width: 40em) {
  .contact-us-section .contact-us-section-left {
    border-right: 1px solid #e6e6e6;
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0;
  }
}
.contact-us-section .contact-us-section-right {
  padding-left: 2rem;
}
@media print, screen and (min-width: 40em) {
  .contact-us-section .contact-us-section-right {
    border-left: 1px solid #e6e6e6;
  }
}
.contact-us-section .contact-us-header {
  margin-bottom: 2rem;
}
@media screen and (min-width: 40em) and (max-width: 74.9375em) {
  .contact-us-section .contact-us-header {
    font-size: 32px;
  }
}
.contact-us-section .responsive-embed {
  margin-bottom: 0;
  padding-bottom: 55%;
}
.contact-us-form input[type=text], .contact-us-form input[type=email], .contact-us-form textarea {
  margin-bottom: 1.5rem;
}
.contact-us-form-actions {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.contact-us-form-actions input[type=submit] {
  border-radius: 5000px;
  padding-left: 2rem;
  padding-right: 2rem;
}
.contact-us-form-actions .contact-us-file-button {
  background: transparent;
  color: #8a8a8a;
}
.contact-us-list {
  list-style-type: none;
  margin: 0;
}
.contact-us-list li a {
  color: #222222;
}
[type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 2.4375rem;
  margin: 0 0 1rem;
  padding: 0.5rem;
  border: 1px solid #cacaca;
  border-radius: 0;
  background-color: #ffffff;
  box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
  font-family: inherit;
  font-size: .875rem;
  font-weight: normal;
  line-height: 1.5;
  color: #0a0a0a;
  transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
input:disabled, input[readonly], textarea:disabled, textarea[readonly], select:disabled {
  background-color: #d3d2d2;
  cursor: default;
  color: #1e1e1e;
}
[type='search'] {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 2.4375rem;
  margin: 0 0 0;
  padding: 0rem;
  border: 0px solid #cacaca;
  border-right: 0px solid #cacaca;
  border-radius: 0;
  background-color: #ffffff;
  font-family: inherit;
  font-size: .875rem;
  font-weight: normal;
  line-height: 1.5;
  color: #0a0a0a;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  transition: none;
  /*box-shadow: inset 0 0 0 rgba(10, 10, 10, 0.1);*/
}
#searchBar-form {
  position: relative;
  overflow: hidden;
}
#searchBar-form-large {
  position: relative;
  overflow: hidden;
  width: 600px;
}
[type='text']:focus, [type='password']:focus, [type='date']:focus, [type='datetime']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='week']:focus, [type='email']:focus, [type='number']:focus, [type='tel']:focus, [type='time']:focus, [type='url']:focus, [type='color']:focus, textarea:focus {
  outline: none;
  border: 1px solid #5b6771;
  background-color: #fefefe;
  box-shadow: 0 0 5px #cacaca;
  transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
}
[type='search']:focus {
  outline: none;
  border: 1px solid #cacaca;
  border-right: 0px solid #cacaca;
  background-color: #fefefe;
  box-shadow: 0 0 0 #cacaca;
  transition: none;
}
table [type='text'], table [type='text']:focus {
  box-shadow: inset 0 0 0 rgb(10 10 10 / 10%);
}
#search_engine {
  background-color: #000;
  border: 0px solid #fff;
}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: #b6b6b6;
}
input::-moz-placeholder, textarea::-moz-placeholder {
  color: #b6b6b6;
}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
  color: #b6b6b6;
}
input::placeholder, textarea::placeholder {
  color: #b6b6b6;
}
.is-invalid-input:not(:focus) {
  border-color: #d3414e;
  background-color: #f9ecea;
}
.is-invalid-input:not(:focus)::-webkit-input-placeholder {
  color: #d3414e;
}
.is-invalid-input:not(:focus)::-moz-placeholder {
  color: #d3414e;
}
.is-invalid-input:not(:focus):-ms-input-placeholder {
  color: #d3414e;
}
.is-invalid-input:not(:focus)::placeholder {
  color: #d3414e;
}
/* -------------------- D. FX REPLACE -------------------- */
.risk_container {
  background-image: url('../img/bkg_content_callout.png');
  background-size: cover;
  background-position: center;
  padding: 1.5em;
  border-radius: 0.625em;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  /*height: 100vh;*/
}
.pyramid {
  width: 100%;
  position: relative;
  margin: auto;
}
.level {
  text-align: center;
  color: white;
  padding: 1.25em 0;
  margin: 0 auto;
}
.level:nth-child(1) {
  background-color: #84B026;
  width: 30%;
}
.level:nth-child(2) {
  background-color: #5c8c46;
  width: 40%;
}
.level:nth-child(3) {
  background-color: #327355;
  width: 60%;
}
.level:nth-child(4) {
  background-color: #2a5159;
  width: 80%;
}
.level:nth-child(5) {
  background-color: #183b59;
  width: 100%;
}
.level span {
  display: block;
  font-size: 1.125em;
  font-weight: bold;
}
.level .description {
  font-size: .875em;
  padding-left: 1em;
  padding-right: 1em;
}
.blinking {
  animation: blinkingText 1.2s infinite;
}
@keyframes blinkingText {
  0% {
    opacity: 1.0;
  }
  50% {
    opacity: 0.0;
  }
  100% {
    opacity: 1.0;
  }
}
#example-four {
  position: relative;
}
#example-four.on:after {
  content: "Cancel";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: white;
  text-decoration: underline;
}
/* -------------------- E. COUNTDOWN CLOCK -------------------- */
#clockdiv {
  font-family: bebas-neue-by-fontfabric, sans-serif;
  color: #fff;
  display: inline-block;
  font-weight: 100;
  text-align: center;
  font-size: 30px;
  width: 100%;
}
#clockdiv > div {
  padding: 3px;
  border-radius: 3px;
  background: transparent;
  display: inline-block;
}
#clockdiv div > span {
  padding: 3px;
  border-radius: 3px;
  background: transparent;
  display: inline-block;
  font-weight: 700;
}
.smalltext {
  padding-top: 5px;
  font-size: 16px;
}
/* -------------------- E. HORIZONTAL TIMELINE -------------------- */
.timeline {
  list-style-type: none;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  align-items: text-top;
  justify-content: left;
}
ul.timeline li {
  margin: 0;
  padding: 0;
}
/*.bccsa_table_border tr td.cell_margin_top {	
margin-top: 1.50em;		
}*/
.bccsa_table_border ul {
  margin-top: .875em;
  margin-bottom: .875em;
}
.bccsa_table_border thead tr {
  border-bottom: 2px solid #ffffff;
}
.bccsa_table_border td, .bccsa_table_border th {
  padding: 0.75em 0.75em;
  font-size: 0.95rem;
  vertical-align: middle;
}
.bccsa_table_border thead th {
  background-color: #383a4d;
  color: #ffffff;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.bccsa_table_border thead tr {
  border-bottom: 2px solid #4d5066;
}
.bccsa_table_border tbody tr {
  transition: background-color 0.2s ease;
}
.bccsa_table_border tbody tr:hover, .bccsa_table_border tbody tr:focus-within, .bccsa_table_border tbody td:focus {
  background-color: #f9fafb;
}
.bccsa_table_border tbody tr:focus-within, .bccsa_table_border tbody td:focus {
  outline: 1px solid #707070;
  outline-offset: -1px;
}
/* Animate color on link hover */
.bccsa_table_border .fa-ul li a {
  position: relative;
  transition: color 0.2s ease;
}
/* Change link color on hover */
.bccsa_table_border .fa-ul li a:hover {
  /*color: #1a73e8;*/
}
.bccsa_table_border .fa-ul li i {
  width: 1.25em;
  text-align: center;
}
/* Scale the icon when the link is hovered */
.bccsa_table_border .fa-ul li:hover .fa-li i {
  transform: scale(1.15);
  color: #1779ba;
}
/* Smooth icon transition */
.bccsa_table_border .fa-ul li .fa-li i {
  transition: transform 0.2s ease;
}
.button:focus {
  box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.4);
}
.fade-in {
  opacity: 0;
  transform: translateY(10px);
  animation: fadeSlideIn 0.4s ease forwards;
}
@keyframes fadeSlideIn {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.table-card {
  background: white;
  border: 1px solid #e1e5eb;
  border-radius: 0 0 4px 4px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
  padding: 1rem;
  margin-bottom: 1.5rem;
}
.dashboard ul {
  margin-top: 0;
  margin-left: 0;
  margin-bottom: .875em;
  line-height: 1.6;
}
.dashboard ul li {
  margin-bottom: .438em;
}
.content_table ul {
  margin-top: 0;
  margin-left: 0;
  margin-bottom: .875em;
  line-height: 1.6;
}
.content_table ul li {
  margin-bottom: .438em;
}
.exposure_profile_listing {
  margin-bottom: .500em;
}
.bccsa_table_border h6 {
  font-size: 1.125em;
}
.timestamp {
  margin-bottom: 1.250em;
  padding: 0em 1.250em;
  display: flex;
  flex-direction: column;
  -webkit-flex: 1 0 200px;
  flex: 1 0 200px;
  align-items: center;
  font-weight: 100;
}
.status-badge {
  display: inline-block;
  padding: 0.25em 0.6em;
  font-size: 0.85rem;
  font-weight: 600;
  border-radius: 4px;
  color: #fff;
  white-space: nowrap;
}
.status-compliant {
  background-color: #198754; /* Bootstrap 5 green */
}
.status-in-progress {
  background:#E0F2FE;   /* Sky 100 */
  color:#0369A1;        /* Sky 700 (5.17:1 on bg) */
  border:1px solid #BAE6FD; /* Sky 200 */
}
.status-non-compliant {
  background-color: #dc3545; /* Bootstrap 5 red */
}
.status {
  /* padding: 0em 0.875em; */
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 1em;
  padding-right: 1em;
  display: flex;
  -webkit-flex: 1 0 200px;
  flex: 1 0 200px;
  justify-content: center;
  border-top: 0.250em solid #D6DCE0;
  position: relative;
  transition: all 200ms ease-in;
}
/* Default status message styling */
.status-message {
  /*font-size: 1em;*/
  /*margin-top: 0.5em;*/
}
/* Success message (green) */
.success-message {
  color: #539633;
  font-weight: bold;
}
.status h6 {
  padding-top: 2.00em;
  font-weight: 600;
  color: #646e71;
  text-align: center;
  font-size: 0.781em;
  padding-bottom: .500em;
  line-height: 1.500em;
}
.status:before {
  content: "";
  width: 2.125em;
  height: 2.250em;
  background-color: white;
  border-radius: 2.250em;
  border: 0.250em solid #ddd;
  position: absolute;
  top: -1.250em;
  left: 35%;
  transition: all 200ms ease-in;
}
.li.complete .status {
  border-top: 0.250em solid #52962e;
}
.li.complete .status:before {
  background-image: url('../img/timeline_checkmark.png');
  border: none;
  transition: all 200ms ease-in;
}
.li.complete .status h6 {
  color: #52962e;
  text-align: center;
}
.li.current .status {
  border-top: 0.250em solid #D6DCE0;
}
.li.current .status:before {
  top: -2.150em;
  height: 3.125em;
  width: 2.125em;
  background-image: url('../img/timeline_map_marker.png');
  border: none;
  left: 35%;
  transition: all 200ms ease-in;
}
.li.current .status h6 {
  color: #d33f4d;
  text-align: center;
}
.status_icon {
  text-align: center;
}
@media (min-device-width: 320px) and (max-device-width: 700px) {
  .timeline {
    list-style-type: none;
    display: block;
  }
  .li {
    transition: all 200ms ease-in;
    display: flex;
    width: inherit;
  }
  .timestamp {
    width: 100px;
  }
  .status:before {
    left: 50%;
    top: 30%;
    transition: all 200ms ease-in;
  }
}
/* -------------------- F. TIMELINE -------------------- */
.arrow-vertical {
  width: 2px; /* Width of the arrow line */
  min-height: 1600px; /* Adjust based on your layout */
  background-color: #646e71; /* Color of the arrow */
  position: absolute;
  left: -15px; /* Adjust to align with the left side of the flowchart */
  bottom: 50px; /* Adjust based on your layout */
}
.arrow-horizontal {
  width: 20px; /* Width of the horizontal line */
  height: 2px; /* Height of the arrow line */
  background-color: #646e71; /* Color of the arrow */
  position: absolute;
  left: -15px; /* Adjust to align with the left side of the flowchart */
  bottom: 50px; /* Adjust based on your layout */
}
.arrow-horizontal-end {
  width: 20px; /* Width of the horizontal line */
  height: 2px; /* Height of the arrow line */
  background-color: #646e71; /* Color of the arrow */
  position: absolute;
  left: -15px; /* Adjust to align with the left side of the flowchart */
  bottom: 1650px; /* Adjust based on your layout */
}
.arrow-horizontal-end::before {
  content: '';
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #646e71; /* Color of the arrowhead */
  position: absolute;
  right: -15px; /* Adjust to position the arrowhead */
  top: -5px; /* Adjust to align with the horizontal line */
  transform: rotate(90deg); /* Rotate the arrowhead 90 degrees clockwise */
}
.vertical-text {
  position: absolute;
  left: 10px; /* Adjust this value to position text on the right side of the line */
  top: 83%;
  transform: translateY(-50%) rotate(90deg);
  transform-origin: 0 0;
  white-space: nowrap;
  color: #1e1e1e;
  font-size: 15px;
  text-transform: uppercase;
  font-weight: bold;
}
.arrow-vertical2 {
  width: 2px; /* Width of the arrow line */
  height: 1450px; /* Adjust based on your layout */
  background-color: #646e71; /* Color of the arrow */
  position: absolute;
  left: -15px; /* Adjust to align with the left side of the flowchart */
  bottom: 50px; /* Adjust based on your layout */
}
.arrow-horizontal2 {
  width: 20px; /* Width of the horizontal line */
  height: 2px; /* Height of the arrow line */
  background-color: #646e71; /* Color of the arrow */
  position: absolute;
  left: -15px; /* Adjust to align with the left side of the flowchart */
  bottom: 50px; /* Adjust based on your layout */
}
.arrow-horizontal-end2 {
  width: 20px; /* Width of the horizontal line */
  height: 2px; /* Height of the arrow line */
  background-color: #646e71; /* Color of the arrow */
  position: absolute;
  left: -15px; /* Adjust to align with the left side of the flowchart */
  bottom: 1650px; /* Adjust based on your layout */
}
.arrow-horizontal-end2::before {
  content: '';
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #646e71; /* Color of the arrowhead */
  position: absolute;
  right: -15px; /* Adjust to position the arrowhead */
  top: -5px; /* Adjust to align with the horizontal line */
  transform: rotate(90deg); /* Rotate the arrowhead 90 degrees clockwise */
}
.vertical-text2 {
  position: absolute;
  left: 10px; /* Adjust this value to position text on the right side of the line */
  top: 83%;
  transform: translateY(-50%) rotate(90deg);
  transform-origin: 0 0;
  white-space: nowrap;
  color: #1e1e1e;
  font-size: 15px;
  text-transform: uppercase;
  font-weight: bold;
}
/*.arrow-horizontal-end::before {
  content: '';
  width: 0; 
  height: 0; 
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid #000; 
  position: absolute;
  left: -10px; 
  top: -5px; 
}*/
.timeline .timeline-item::after, .timeline .timeline-item::before {
  clear: both;
  content: '';
  display: block;
  width: 100%;
}
.timeline {
  margin: 30px auto;
  padding: 0 10px;
  position: relative;
  transition: all 0.25s ease-in;
  width: 100%;
}
.timeline::before {
  background: #ffffff;
  content: '';
  height: 100%;
  left: 50%;
  position: absolute;
  top: 0;
  width: 3px;
}
.timeline::after {
  clear: both;
  content: '';
  display: table;
  width: 100%;
}
.timeline a {
  color: #0455A4;
  font-weight: bold;
  transition: all 0.25s ease-in;
}
.timeline a:hover {
  box-shadow: 0 1px 0px 0px #1779ba;
  transition: all 0.25s ease-in;
}
.timeline .timeline-item {
  margin-bottom: 24px;
  position: relative;
}
.timeline .timeline-item .timeline-icon {
  background: #ffffff;
  border-radius: 50%;
  height: 50px;
  left: 50%;
  margin-left: -23px;
  overflow: hidden;
  position: absolute;
  top: 0;
  width: 50px;
}
.timeline .timeline-item .timeline-icon img, .timeline .timeline-item .timeline-icon svg {
  left: 6px;
  position: relative;
  top: 3px;
}
.timeline .timeline-item .timeline-icon svg {
  top: 14px;
}
.timeline .timeline-item .timeline-content {
  padding: 24px;
  transition: all 0.25s ease-in;
  width: 40%;
  background: #ffffff;
  margin-bottom: 1rem;
  border: 1px solid #C2C2C2;
  border-radius: 15px;
  color: #0a0a0a;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.timeline .timeline-item .timeline-content-minimal {
  padding: 12px;
  transition: all 0.25s ease-in;
  width: 40%;
  background: transparent;
  margin-bottom: 1rem;
  border: 0px solid #C2C2C2;
  border-radius: 0px;
  color: #0a0a0a;
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.19);
}
.timeline .timeline-item .timeline-content p {
  color: #000000;
}
.timeline .timeline-item .timeline-content p {
  font-size: 14px;
  line-height: 1.4;
  margin-bottom: 0;
}
.timeline .timeline-item .timeline-content .timeline-content-date {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 0;
}
.timeline .timeline-item .timeline-content .timeline-content-month {
  font-size: 0.875rem;
  text-transform: uppercase;
  font-weight: 400;
}
.timeline .timeline-item .timeline-content.right {
  float: right;
  text-align: left;
}
@media screen and (max-width: 39.9375em) {
  .timeline {
    margin: 30px;
    padding: 0;
    width: 90%;
  }
  .timeline::before {
    left: 0;
  }
  .timeline .timeline-item .timeline-content {
    float: right;
    text-align: left;
    width: 90%;
  }
  .timeline .timeline-item .timeline-content::before, .timeline .timeline-item .timeline-content.right::before {
    border-left: 0;
    border-right: 7px solid #ffffff;
    left: 10%;
    margin-left: -6px;
  }
  .timeline .timeline-item .timeline-icon {
    left: 0;
  }
}
/* Content animation */
/* .timeline-icon--hidden, .timeline-content--hidden {

    visibility: hidden

  }*/
/*.timeline-icon--bounce-in {

    -webkit-animation: cd-bounce-1 0.6s;

    animation: cd-bounce-1 0.6s

  }*/
/*.timeline-content--bounce-in {

    -webkit-animation: cd-bounce-2 0.6s;

    animation: cd-bounce-2 0.6s

  }*/
/*.timeline-item:nth-child(even) .timeline-content--bounce-in {

    -webkit-animation-name: cd-bounce-2-inverse;

    animation-name: cd-bounce-2-inverse

  }*/
/*@-webkit-keyframes cd-bounce-1 {

  0% {

    opacity: 0;

    -webkit-transform: scale(0.5);

    transform: scale(0.5)

  }

  60% {

    opacity: 1;

    -webkit-transform: scale(1.2);

    transform: scale(1.2)

  }

  100% {

    -webkit-transform: scale(1);

    transform: scale(1)

  }

}*/
/*@keyframes cd-bounce-1 {

  0% {

    opacity: 0;

    -webkit-transform: scale(0.5);

    transform: scale(0.5)

  }

  60% {

    opacity: 1;

    -webkit-transform: scale(1.2);

    transform: scale(1.2)

  }

  100% {

    -webkit-transform: scale(1);

    transform: scale(1)

  }

}*/
/*@-webkit-keyframes cd-bounce-2 {

  0% {

    opacity: 0;

    -webkit-transform: translateX(-100px);

    transform: translateX(-100px)

  }

  60% {

    opacity: 1;

    -webkit-transform: translateX(20px);

    transform: translateX(20px)

  }

  100% {

    -webkit-transform: translateX(0);

    transform: translateX(0)

  }

}*/
/*@keyframes cd-bounce-2 {

  0% {

    opacity: 0;

    -webkit-transform: translateX(-100px);

    transform: translateX(-100px)

  }

  60% {

    opacity: 1;

    -webkit-transform: translateX(20px);

    transform: translateX(20px)

  }

  100% {

    -webkit-transform: translateX(0);

    transform: translateX(0)

  }

}*/
/*@-webkit-keyframes cd-bounce-2-inverse {

  0% {

    opacity: 0;

    -webkit-transform: translateX(100px);

    transform: translateX(100px)

  }

  60% {

    opacity: 1;

    -webkit-transform: translateX(-20px);

    transform: translateX(-20px)

  }

  100% {

    -webkit-transform: translateX(0);

    transform: translateX(0)

  }

}*/
/*@keyframes cd-bounce-2-inverse {

  0% {

    opacity: 0;

    -webkit-transform: translateX(100px);

    transform: translateX(100px)

  }

  60% {

    opacity: 1;

    -webkit-transform: translateX(-20px);

    transform: translateX(-20px)

  }

  100% {

    -webkit-transform: translateX(0);

    transform: translateX(0)

  }

}*/
/*



=============================================== 02. NAVIGATION STYLES ===============================================



*/
.nav_padding {
  padding-left: 3.438em;
}
.nav_dark {
  background-color: #373737;
}
/* -------------------- A. OFF-CANVAS -------------------- */
.off-canvas {
  position: fixed;
  z-index: 12;
  transition: transform 0.5s ease;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  background: #343434;
  overflow-x: hidden;
}
span.menu_icon {
  color: #ffffff;
  font-size: 1.750em;
  font-family: "proxima-nova-extra-condensed", sans-serif;
  font-weight: 700;
  font-style: normal;
}
#menu_icon {
  color: #ffffff;
}
#menu_icon:hover {
  color: #C9C5C6;
}
.menu .logo_header2 a, .menu .logo_header2 .button {
  text-decoration: none;
  padding: 0 0;
}
/* -------------------- B. TOP BAR -------------------- */
.title-bar {
  /*padding: 0.5rem;*/
  background: #ffffff;
  color: #fefefe;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -ms-flex-align: center;
  align-items: center;
}
.title-bar .menu-icon {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}
.smallLogo {
  width: 150px;
}
.largeLogo {
  max-width: 200px;
}
/*



.logo_transition {

    -webkit-transition: width .35s;

    transition: width .35s;



}



*/
.smallLogo2 {
  width: 125px;
}
.largeLogo2 {
  width: 175px;
}
.menu .menu-text {
  /*padding: 1.188rem .75rem;*/
  font-weight: bold;
  line-height: 1;
  font-family: proxima-nova, sans-serif;
  font-size: 13px;
  color: #363636;
}
.title-bar {
  width: 100%;
  z-index: 10;
  /*transition: height .25s ease;*/
  /*height: 8.024em;*/
  border-bottom: 0px solid #ffffff;
  background-color: #eaeaea;
  background-image: url('../img/bkg_titlebar.png');
  background-repeat: no-repeat;
}
.title-bar .title-bar-right, .title-bar .title-bar-left {}
.title-bar-right {
  min-width: 50%;
}
.title-bar-left ul {}
.title-bar .dropdown.menu li {
  float: left;
}
/*.title-bar .dropdown.menu .is-dropdown-submenu {

  border: none;

  background-color: #ffffff;

}*/
#root {
  margin-top: 3em;
}
.top-bar, .top-bar ul {
  background-color: #000000;
}
.top-bar {
  border-style: solid;
  border-width: 0px 0px 0px 0px;
  min-height: 3.313em;
  border-top: 0px solid #6f9fc8;
  border-bottom: 0px solid #ffffff;
}
ul.on_top {
  z-index: 1000 !important;
}
div.left_padding {
  padding-left: 5.313em;
}
/* Very Top Header Navigation */
.very_very_top .menu a, .very_very_top .menu .button, .very_very_top .menu li {
  line-height: 1;
  text-decoration: none;
  display: block;
  padding: .1rem .1rem;
}
li.google_translate_list {
  min-width: 31.25em;
}
/*"""""""" (MAIN) Items""""""""*/
.dropdown.menu > li.is-dropdown-submenu-parent > a::after {
  display: block;
  width: 0;
  height: 0;
  border: inset 6px;
  content: '';
  border-bottom-width: 0;
  border-top-style: solid;
  border-color: #6C7378 transparent transparent;
  right: 5px;
  left: auto;
  /*margin-top: -3px;*/
}
#navTop a {
  /*padding: .500em 0 .500em 1.950em;*/
  color: #C9C5C6;
  font-family: proxima-nova, sans-serif;
  font-weight: 500;
  font-size: 0.813em;
  text-decoration: none;
  text-align: left;
  margin-bottom: .875em;
}
/*"""""""" (MAIN) Hover State""""""""*/
#navTop a:hover {
  color: #FFFFFF;
  text-decoration: none;
}
#navTop span.top_nav_title_link {
  color: #ffffff;
  font-size: 0.875em;
  font-weight: bold;
  padding-top: 0.45em;
  padding-right: 0.375em;
}
/*"""""""" (SUB) Container""""""""*/
#navTop .is-dropdown-submenu {
  padding: 0.625em 0.625em;
  background-color: #050b0e;
  /*background-image:url("img/bkg_content.jpg");*/
  border-width: 1px;
  border-style: none;
  border-color: #ffffff;
  min-width: 285px;
}
#navTop ul li {
  padding: 0.625em 0px;
  /*background-color:rgba(0, 0, 0, 0.2);*/
  border-bottom: 0.063em solid rgba(255, 255, 255, 0.1);
}
#navTop ul li:last-child {
  border-bottom: 0px solid rgba(255, 255, 255, 0.1);
}
/*"""""""" (SUB) Items""""""""*/
#navTop div a, #navTop ul a {
  padding: 0.125em 0.625em 0.125em 0.313em;
  margin: 0.313em 0.313em;
  background-color: transparent;
  font-size: 0.875em;
  list-style-position: inside;
  list-style-type: circle;
}
/*"""""""" (SUB) Hover State""""""""*/
#navTop div a:hover {
  text-decoration: underline;
}
/*"""""""" Individual Titles""""""""*/
#navTop .navToptitle {
  cursor: default;
  padding: 0.188em 0px 0.188em 0.750em;
  background-color: #262626;
  color: #FFFFFF;
  font-family: proxima-nova, Arial;
  font-size: 0.688em;
  font-weight: bold;
}
/*"""""""" Individual Horizontal Dividers""""""""*/
#navTop .navTopdividerx {
  border-top-width: 1px;
  margin: 16px 0;
  border-color: #3d444a;
}
/*"""""""" Individual Vertical Dividers""""""""*/
#navTop .navTopdividery {
  border-left-width: 1px;
  height: 15px;
  margin: 4px 2px 0px;
  border-color: #333333;
}
/*"""""""" Custom Rule""""""""*/
ul#navTop ul {
  background-color: #F1F1F1;
  border-width: 1px;
  border-style: solid;
  border-color: #666666;
}
/*"""""""" Custom Rule""""""""*/
ul#navTop ul a {
  /*padding: 2px 10px 2px 5px;*/
  /*background-color: #F1F1F1;*/
}
/*[END of Very Top Header Navigation]*/
/* NAVTOP MOBILE */
#navTopMobile a {
  padding-top: -1.950em;
  color: #C9C5C6;
  font-family: proxima-nova, sans-serif;
  font-weight: 500;
  text-decoration: none;
  text-align: left;
}
/*"""""""" (MAIN) Hover State""""""""*/
#navTopMobile a:hover {
  color: #FFFFFF;
  text-decoration: none;
}
#navTopMobile span.top_nav_title_link {
  color: #ffffff;
  font-weight: bold;
  padding-top: 0.45em;
  padding-right: 0.375em;
}
/*"""""""" (SUB) Container""""""""*/
#navTopMobile .is-dropdown-submenu {
  padding: 0.625em 0.625em;
  background-color: #050b0e;
  /*background-image:url("img/bkg_content.jpg");*/
  border-width: 1px;
  border-style: none;
  border-color: #ffffff;
  min-width: 285px;
}
#navTopMobile ul li {
  padding: 0.625em 0px;
  /*background-color:rgba(0, 0, 0, 0.2);*/
  border-bottom: 0.063em solid rgba(255, 255, 255, 0.1);
}
#navTopMobile ul li:last-child {
  border-bottom: 0px solid rgba(255, 255, 255, 0.1);
}
/*"""""""" (SUB) Items""""""""*/
#navTopMobile div a, #navTop ul a {
  padding: 0.125em 0.625em 0.125em 0.313em;
  margin: 0.313em 0.313em;
  background-color: transparent;
  font-size: 0.875em;
  list-style-position: inside;
  list-style-type: circle;
}
/*"""""""" (SUB) Hover State""""""""*/
#navTopMobile div a:hover {
  text-decoration: underline;
}
/*"""""""" Individual Titles""""""""*/
#navTopMobile .navToptitle {
  cursor: default;
  padding: 0.188em 0px 0.188em 0.750em;
  background-color: #262626;
  color: #FFFFFF;
  font-family: proxima-nova, Arial;
  font-size: 0.688em;
  font-weight: bold;
}
/*"""""""" Individual Horizontal Dividers""""""""*/
#navTopMobile .navTopdividerx {
  border-top-width: 1px;
  margin: 16px 0;
  border-color: #3d444a;
}
/*"""""""" Individual Vertical Dividers""""""""*/
#navTopMobile .navTopdividery {
  border-left-width: 1px;
  height: 15px;
  margin: 4px 2px 0px;
  border-color: #333333;
}
/*[END of Very Top Header Navigation Mobile]*/
.icon_width {
  padding-right: 0.375em;
}
.icon_width_left {
  padding-left: 0.375em;
}
.icon_width_more {
  padding-right: 0.563em;
}
.icon_inline_textbox {
  padding-left: 0.563em;
  color: #7e7e7e;
  cursor: pointer;
}
.logo_header {
  padding-left: 1.625em;
}
.button-group {
  margin-bottom: 0rem;
}
/* -------------------- C. MAIN NAVIGATION BAR -------------------- */
.navigation_bar_background {
  margin-top: 0;
  /*height: 3.313em;*/
  padding: 0.313em;
  padding-bottom: 0;
  padding-left: 1.5em;
  /*padding-top: 0.688em;*/
  position: relative;
  background-image: url('../img/bkg_navbar.jpg');
  background-repeat: no-repeat;
  border-style: solid;
  border-width: 0px 0px 0px 0px;
  border-top: 0px solid #ffffff;
  border-bottom: 0px solid #ffffff;
  background-color: #18343f;
}
.navigation_bar_background_course {
  margin-top: 0;
  /*height: 3.313em;*/
  padding: 0.313em;
  padding-bottom: 0;
  /*padding-left: 1.5em;*/
  /*padding-top: 0.688em;*/
  position: relative;
  /*background-image: url('../img/bkg_navbar.jpg');*/
  background-color: #1e1e1e;
  background-repeat: no-repeat;
  border-style: solid;
  border-width: 0px 0px 0px 0px;
  border-top: 0px solid #ffffff;
  border-bottom: 0px solid #ffffff;
}
/* -------------------- D. LEFT NAVIGATION BAR -------------------- */
.grey_inside_nav {
  background-color: #373737;
  padding-bottom: 1.125em;
}
.dark_grey_inside_nav {
  background-color: #313131;
  /*padding-bottom: .750em;	*/
  border-width: 0 0 1px 0;
  border-style: solid;
  border-color: #313131;
}
/*.inside_nav {



border-width: 0px 0px thin 0px;

	border-color: #ffffff;

    background-color: #373737;

}*/
.left_bar_top {
  padding-top: 2.750em;
  padding-left: 0;
  padding-bottom: 0.500em;
}
.nav_left_bar {
  padding-left: 2.250em;
  color: #5B6771;
}
.left_bar_info .user-name {
  padding-top: 1.250em;
  padding-left: 1.150em;
  margin-bottom: 0;
  /*font-family: prenton, sans-serif;*/
}
.left_bar_info .user-title {
  margin-bottom: 1.250em;
  padding-left: 1.500em;
  margin-top: -.375em;
  padding-bottom: 0;
  color: #BBBBBB;
  font-size: 0.750em;
}
/* -------------------- E. BREADCRUMBS, PAGENATION & PROGRESS INDICATOR -------------------- */
.toc-container {
  /*margin: 20px;*/
  font-family: Arial, sans-serif;
}
.toc-title {
  font-size: 1.5em;
  text-align: left;
  border-bottom: 2px solid #333;
  padding-bottom: 10px;
}
.toc-list, .toc-sublist, .toc-subsublist {
  list-style-type: none;
  padding-left: 0;
}
.toc-item {
  margin: 10px 0;
  font-weight: bold;
}
.toc-subitem, .toc-subsubitem {
  margin: 5px 0;
  font-size: 0.9em;
  font-weight: normal; /* No bold for sub-items */
}
.toc-link {
  text-decoration: none;
  color: #0066cc;
}
.pagination a, .pagination button {
  display: block;
  padding: 0.1875rem 0.625rem;
  border-radius: 0;
  background: #f5f5f5;
  color: #333333;
}
.pagination .current {
  padding: 0.1875rem 0.625rem;
  background: #5576ba;
  color: #fefefe;
  cursor: default;
}
.pagination a:hover, .pagination button:hover {
  background: #e0edf7;
  text-decoration: none;
}
.progress-indicator {
  list-style: none;
  width: 100%;
  margin: 0 auto;
  padding: 0;
  display: table;
  table-layout: fixed;
}
.progress-indicator > li {
  position: relative;
  display: table-cell;
  text-align: center;
  font-size: 1.5em;
}
.progress-indicator > li span {
  position: absolute;
  color: #a9a8a8;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  font-weight: 600;
  font-size: 0.750rem;
  letter-spacing: 0.05px;
  text-transform: uppercase;
}
.progress-indicator > li::before {
  content: attr(data-step);
  display: block;
  margin: 0 auto;
  background: #cacaca;
  width: 1.5em;
  height: 1.5em;
  text-align: center;
  margin-bottom: 0.25em;
  line-height: 1.5em;
  border-radius: 100%;
  position: relative;
  z-index: 1;
  font-weight: bold;
  font-family: proxima-nova, sans-serif;
  color: #979595;
}
.progress-indicator > li::after {
  content: '';
  position: absolute;
  display: block;
  background: #cacaca;
  width: 100%;
  height: 0.15em;
  top: 50%;
  -webkit-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%);
  left: 50%;
  margin-left: 1.5em\9;
  z-index: 0;
}
.progress-indicator > li:last-child:after {
  display: none;
}
.progress-indicator > li.is-complete {
  color: #5b6771;
}
.progress-indicator > li.is-complete::before, .progress-indicator > li.is-complete::after {
  color: #fefefe;
  background: #5b6771;
}
.progress-indicator > li.is-complete span {
  color: #5b6771;
}
.progress-indicator > li.is-current {
  color: #bf3b4b;
}
.progress-indicator > li.is-current::before {
  color: #fefefe;
  background: #bf3b4b;
}
.progress-indicator > li.is-current span {
  color: #bf3b4b;
}
/*



=============================================== 03. CONTAINER STYLES ===============================================


*/
/* Signature Area */
.completion-sign-off {
  margin-bottom: 2rem;
  /*padding: 1rem;*/
  /*border-top: 2px solid #333;*/
}
.completion-sign-off h4 {
  margin-bottom: 1rem;
  font-weight: bold;
}
.manual-entry-box {
  width: 100%;
  height: 40px;
  border-bottom: 1px solid #ccc;
  margin-top: 0.5rem;
}
.manual-entry-box.signature {
  height: 60px;
  border-bottom: 1px solid #ccc;
}
.entry-label {
  margin-top: 0.5rem;
  font-size: 0.9rem;
  color: #666;
}
/* Documentation Container */
.letter_container {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Adds depth with a shadow */
  background: white; /* White background to represent paper */
  margin: 0 auto; /* Centers the container */
  font-family: Arial, sans-serif; /* Standard font */
  color: #0a0a0a; /* Default Foundation text color */
}
.letter_container h1, .letter_container h2, .letter_container h3, .letter_container h4, .letter_container h5, .letter_container h6 {
  font-family: Arial, sans-serif; /* Standard font */
  font-weight: bold; /* Makes headers bold */
  color: #0a0a0a; /* Primary color for headers */
  margin-top: 0; /* Removes top margin for headers */
  margin-bottom: 0.5em; /* Space after headers */
}
.letter_container p {
  font-family: Arial, sans-serif; /* Standard font */
  font-size: 1em; /* Standard font size for text */
  line-height: 1.6; /* Line height for readability */
  margin-bottom: 1em; /* Space between paragraphs */
}
.bkg_letter_header {
  /*background-color: #0455a4;*/
  /*background-image: linear-gradient(#ffffff, #f9f9f9);*/
  border-bottom: 2px solid #666666;
  padding-bottom: 0.625em;
  margin-bottom: 1em; /* Space after header */
}
.bkg_letter_section {
  background-color: #ffffff;
  border-bottom: 0px solid #0a0a0a;
  padding-bottom: 1em;
  margin-bottom: 1em; /* Space after header */
}
.bkg_letter_footer {
  /*background-color: #0455a4;*/
  border-top: 2px solid #666666;
  padding-top: 0.875em;
  margin-top: 1em; /* Space after header */
}
.grid-container {
  padding-right: 0.625rem;
  padding-left: 0.625rem;
  max-width: 80rem;
  margin: 0 auto;
}
.wider_row {
  max-width: 103.313rem;
  padding-top: 0em;
}
.narrow_row {
  max-width: 100rem;
  padding-top: 0em;
}
.medium_row {
  max-width: 105rem;
  padding-top: 0em;
}
.page_background {
  background: #ffffff;
  background-repeat: no-repeat;
}
.content_background_white {
  background: #ffffff;
  background-repeat: no-repeat;
}
.page_background_blue {
  background: #18343e;
}
.page_background_dark_grey {
  background: #4B545B;
}
.page_background_dark_grey2 {
  background-image: url("../img/bkg_titlebar.png");
  background-repeat: repeat-x;
  background-position: center bottom;
  border-bottom: 0px solid #202427;
}
.navigation_container {
  border-top: 1px solid #18343e;
  border-bottom: 2px solid #ffffff;
}
.page_background_dark {
  background: #0e2149;
  background-image: url("../img/hero_image4.jpg");
  background-repeat: no-repeat;
  background-position: left bottom;
  padding-top: 2rem;
  padding-bottom: 1.5rem;
  border-top: 16px solid #8995c9;
  border-bottom: 16px solid #8995c9;
}
.page_background_dark_portal {
  background: #0e2149;
  background-image: url("../img/hero_image_portal.jpg");
  background-repeat: no-repeat;
  background-position: left bottom;
  padding-top: 2rem;
  padding-bottom: 1.5rem;
  border-top: 16px solid #8995c9;
  border-bottom: 16px solid #8995c9;
}
.page_background_dark_portal2 {
  background: #0e2149;
  background-image: url("../img/hero_image_portal_inside.jpg");
  background-repeat: no-repeat;
  background-position: left bottom;
  padding-top: 2rem;
  padding-bottom: 1.5rem;
  border-top: 16px solid #8995c9;
  border-bottom: 16px solid #8995c9;
}
.page_background_light {
  background: linear-gradient(180deg, #f9fafb, #f1f3f5);
}
.page_background_graphic {
  padding-top: 1.85em;
  padding-bottom: 1.85em;
  padding-left: 0.625em;
  padding-right: 0.625em;
  background-image: url("../img/bkg_page_home.png");
  background-repeat: repeat-x;
  background-color: #ffffff;
  border-top: 0px solid #ffffff;
}
.page_background_graphic2 {
  padding: 3.125em 0.625em;
  /*background-image: url("../img/bkg_page_home.png");*/
  /*background-repeat: repeat-x;*/
  background-color: #fafafa;
}
.page_background_graphic3 {
  padding: 3.438em 0.625em;
  background-image: url("../img/bkg_page_home3.jpg");
  background-repeat: repeat-x;
  background-color: #eeeff1;
}
.page_background_graphic_content {
  padding: 3.125em 0.625em;
  background-image: url("../img/bkg_page_home_content.png");
  background-repeat: repeat-x repeat-y;
  background-color: #ffffff;
}
.page_background_inside {
  background-image: url("../img/bkg_page_home3.png");
  background-repeat: repeat-x;
  background-color: #ffffff;
}
.page_background_roc {
  background-image: url("../img/bkg_page_home3.jpg");
  background-repeat: repeat-x;
  background-color: #ffffff;
}
.no_padding {
  padding: 0px;
}
.negative_padding {
  margin-top: -1.125em;
  /*padding-top: -15px;*/
  padding-bottom: 0.625em;
}
/* Padding for the text and hyperlinks at the very bottom to match*/
ul.small_text_footer li.more_padding_top {
  padding-top: 1.000em;
}
/* -------------------- A. MAIN SECTION -------------------- */
/* -------------------- B. LEFT SECTION -------------------- */
/* -------------------- C. RIGHT SECTION -------------------- */
/* -------------------- D. FOOTER -------------------- */
.black_footer {
  background-color: #202426;
  padding: .500em .625em;
}
#engadget-footer-sitemap-container #engadget-footer-sitemap {
  max-width: 100.000rem;
  margin-right: auto;
  margin-left: auto;
  color: #e6e6e6;
  padding: 3.75rem 0;
}
div.footer_area {
  color: #807f7f;
  font-size: 75%;
}
/* Vertical Footer */
.padding_footer {
  padding-right: 0.625rem;
  padding-left: 0.625rem;
}
#engadget-footer-sitemap-container {
  max-width: 100%;
  width: 100%;
  margin: 0 auto;
  margin-top: 0;
  background-color: #377492;
}
#engadget-footer-sitemap-container #engadget-footer-sitemap {
  max-width: 100.000rem;
  margin-right: auto;
  margin-left: auto;
  color: #e6e6e6;
  padding: 3.75rem 0;
}
#engadget-footer-sitemap-container #engadget-footer-sitemap::before, #engadget-footer-sitemap-container #engadget-footer-sitemap::after {
  display: table;
  content: ' ';
  -webkit-flex-basis: 0;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
}
#engadget-footer-sitemap-container #engadget-footer-sitemap::after {
  clear: both;
}
#engadget-footer-sitemap-container #engadget-footer-sitemap a {
  color: #e6e6e6 !important;
}
#engadget-footer-sitemap-container #engadget-footer-sitemap .links > .link-column {
  float: left;
  width: 50%;
  padding-right: 0.625rem;
  padding-left: 0.625rem;
}
@media print, screen and (min-width: 40em) {
  #engadget-footer-sitemap-container #engadget-footer-sitemap .links > .link-column {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem;
  }
}
#engadget-footer-sitemap-container #engadget-footer-sitemap .links > .link-column:nth-of-type(1n) {
  clear: none;
}
#engadget-footer-sitemap-container #engadget-footer-sitemap .links > .link-column:nth-of-type(2n+1) {
  clear: both;
}
#engadget-footer-sitemap-container #engadget-footer-sitemap .links > .link-column:last-child {
  float: left;
}
@media print, screen and (min-width: 64em) {
  #engadget-footer-sitemap-container #engadget-footer-sitemap .links > .link-column {
    float: left;
    width: 25%;
    padding-right: 0.625rem;
    padding-left: 0.625rem;
  }
}
@media print, screen and (min-width: 64em) and (min-width: 40em) {
  #engadget-footer-sitemap-container #engadget-footer-sitemap .links > .link-column {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem;
  }
}
@media print, screen and (min-width: 64em) {
  #engadget-footer-sitemap-container #engadget-footer-sitemap .links > .link-column:nth-of-type(1n) {
    clear: none;
  }
  #engadget-footer-sitemap-container #engadget-footer-sitemap .links > .link-column:nth-of-type(4n+1) {
    clear: both;
  }
  #engadget-footer-sitemap-container #engadget-footer-sitemap .links > .link-column:last-child {
    float: left;
  }
}
#engadget-footer-sitemap-container #engadget-footer-sitemap .links .link-column:not(:last-child) {
  border-right: 1px solid #4181a3;
}
#engadget-footer-social-container {
  max-width: 100%;
  width: 100%;
  margin: 0 auto;
  margin-top: 0;
  background-color: #e1eef8;
}
#engadget-footer-social-container #engadget-footer-social {
  max-width: 100.000rem;
  margin-right: auto;
  margin-left: auto;
  color: #e6e6e6;
  padding: 3.75rem 0;
}
#engadget-footer-social-container #engadget-footer-social::before, #engadget-footer-social-container #engadget-footer-social::after {
  display: table;
  content: ' ';
  -webkit-flex-basis: 0;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
}
#engadget-footer-social-container #engadget-footer-social::after {
  clear: both;
}
#engadget-footer-social-container #engadget-footer-social a {
  color: #e6e6e6 !important;
}
#engadget-footer-social-container #engadget-footer-social .footer-left {
  width: 100%;
  float: left;
  padding-right: 0.625rem;
  padding-left: 0.625rem;
}
@media print, screen and (min-width: 40em) {
  #engadget-footer-social-container #engadget-footer-social .footer-left {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem;
  }
}
#engadget-footer-social-container #engadget-footer-social .footer-left:last-child:not(:first-child) {
  float: right;
}
@media print, screen and (min-width: 40em) {
  #engadget-footer-social-container #engadget-footer-social .footer-left {
    width: 50%;
    float: left;
    padding-right: 0.625rem;
    padding-left: 0.625rem;
  }
}
@media print, screen and (min-width: 40em) and (min-width: 40em) {
  #engadget-footer-social-container #engadget-footer-social .footer-left {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem;
  }
}
@media print, screen and (min-width: 40em) {
  #engadget-footer-social-container #engadget-footer-social .footer-left:last-child:not(:first-child) {
    float: right;
  }
}
@media print, screen and (min-width: 64em) {
  #engadget-footer-social-container #engadget-footer-social .footer-left {
    width: 41.66667%;
    float: left;
    padding-right: 0.625rem;
    padding-left: 0.625rem;
  }
}
@media print, screen and (min-width: 64em) and (min-width: 40em) {
  #engadget-footer-social-container #engadget-footer-social .footer-left {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem;
  }
}
@media print, screen and (min-width: 64em) {
  #engadget-footer-social-container #engadget-footer-social .footer-left:last-child:not(:first-child) {
    float: right;
  }
}
#engadget-footer-social-container #engadget-footer-social .footer-left .input-group-field {
  background: #fefefe;
}
#engadget-footer-social-container #engadget-footer-social .footer-right {
  text-align: right;
  width: 100%;
  float: left;
  padding-right: 0.625rem;
  padding-left: 0.625rem;
}
@media print, screen and (min-width: 40em) {
  #engadget-footer-social-container #engadget-footer-social .footer-right {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem;
  }
}
#engadget-footer-social-container #engadget-footer-social .footer-right:last-child:not(:first-child) {
  float: right;
}
@media print, screen and (min-width: 40em) {
  #engadget-footer-social-container #engadget-footer-social .footer-right {
    width: 50%;
    float: right;
    padding-right: 0.625rem;
    padding-left: 0.625rem;
  }
}
@media print, screen and (min-width: 40em) and (min-width: 40em) {
  #engadget-footer-social-container #engadget-footer-social .footer-right {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem;
  }
}
@media print, screen and (min-width: 40em) {
  #engadget-footer-social-container #engadget-footer-social .footer-right:last-child:not(:first-child) {
    float: right;
  }
}
#engadget-footer-social-container #engadget-footer-social .fa {
  padding: 0 0 0 0.6rem;
}
#engadget-footer-social-container #engadget-footer-social h2 {
  color: #fefefe;
}
#engadget-footer-social-container #engadget-footer-social p {
  font-size: 0.8rem;
  margin-bottom: 0;
}
#engadget-footer-contact-details-container {
  max-width: 100%;
  width: 100%;
  margin: 0 auto;
  margin-top: 0;
  background-color: #fefefe;
}
#engadget-footer-contact-details-container #engadget-footer-contact-details {
  max-width: 100.000rem;
  margin-right: auto;
  margin-left: auto;
  color: #8a8a8a;
  font-size: 0.8rem;
  padding: 1.25rem 0;
}
#engadget-footer-contact-details-container #engadget-footer-contact-details::before, #engadget-footer-contact-details-container #engadget-footer-contact-details::after {
  display: table;
  content: ' ';
  -webkit-flex-basis: 0;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
}
#engadget-footer-contact-details-container #engadget-footer-contact-details::after {
  clear: both;
}
#engadget-footer-contact-details-container #engadget-footer-contact-details a {
  color: #8a8a8a !important;
}
#engadget-footer-contact-details-container #engadget-footer-contact-details .footer-left {
  width: 100%;
  float: left;
  padding-right: 0.625rem;
  padding-left: 0.625rem;
  text-align: center;
  font-size: 0.9rem;
}
@media print, screen and (min-width: 40em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-left {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem;
  }
}
#engadget-footer-contact-details-container #engadget-footer-contact-details .footer-left:last-child:not(:first-child) {
  float: right;
}
#engadget-footer-contact-details-container #engadget-footer-contact-details .footer-left li {
  display: block;
}
@media print, screen and (min-width: 40em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-left {
    width: 50%;
    float: left;
    padding-right: 0.625rem;
    padding-left: 0.625rem;
    text-align: left;
  }
}
@media print, screen and (min-width: 40em) and (min-width: 40em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-left {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem;
  }
}
@media print, screen and (min-width: 40em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-left:last-child:not(:first-child) {
    float: right;
  }
}
@media print, screen and (min-width: 64em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-left {
    width: 66.66667%;
    float: left;
    padding-right: 0.625rem;
    padding-left: 0.625rem;
  }
}
@media print, screen and (min-width: 64em) and (min-width: 40em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-left {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem;
  }
}
@media print, screen and (min-width: 64em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-left:last-child:not(:first-child) {
    float: right;
  }
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-left ul {
    margin-bottom: 0;
  }
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-left li {
    display: inline-block;
  }
}
#engadget-footer-contact-details-container #engadget-footer-contact-details .footer-left .fa {
  padding: 0 0.4rem;
}
#engadget-footer-contact-details-container #engadget-footer-contact-details .footer-right {
  font-size: 0.9rem;
}
@media screen and (max-width: 39.9375em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-right {
    display: none !important;
  }
}
@media print, screen and (min-width: 40em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-right {
    width: 50%;
    float: left;
    padding-right: 0.625rem;
    padding-left: 0.625rem;
  }
}
@media print, screen and (min-width: 40em) and (min-width: 40em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-right {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem;
  }
}
@media print, screen and (min-width: 40em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-right:last-child:not(:first-child) {
    float: right;
  }
}
@media print, screen and (min-width: 64em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-right {
    width: 33.33333%;
    float: left;
    padding-right: 0.625rem;
    padding-left: 0.625rem;
    text-align: right;
  }
}
@media print, screen and (min-width: 64em) and (min-width: 40em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-right {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem;
  }
}
@media print, screen and (min-width: 64em) {
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-right:last-child:not(:first-child) {
    float: right;
  }
  #engadget-footer-contact-details-container #engadget-footer-contact-details .footer-right ul {
    padding-top: 1.6rem;
  }
}
#engadget-footer-contact-details-container #engadget-footer-contact-details .footer-right .fab {
  padding: 0 0.4rem;
}
/* -------------------- E. OVERLAP OVER CONTAINERS -------------------- */
/* Normal state */
.hover-image {
  padding-bottom: .625em;
}
/* Hover state */
.hover-link:hover .hover-image {
  /* Change the image source on hover */
  content: url('../img/hard_hat_enews_hover_icon.png');
}
/* Position the sidebar at the bottom of the viewport */
#mySidenav {
  position: absolute;
  bottom: 112px;
  right: 0;
  width: 50px; /* Start with a small width */
  transition: width 0.3s, right 0.3s; /* Transition the width and right position on hover */
}
/* Style the links inside the sidenav */
#mySidenav a {
  display: flex; /* Display as flex container */
  align-items: center; /* Center content vertically */
  text-decoration: none;
  font-size: 18px;
  color: #828c95;
  font-weight: 700;
  border-radius: 0 5px 5px 0;
  overflow: hidden;
  height: 55px;
  transform: translateX(0); /* Initially translateX(0) */
  transition: transform 0.3s; /* Add transition for sliding effect */
}
#mySidenav a:hover {
  width: 255px; /* Expand the width on hover */
  transform: translateX(-100%); /* Slide the content in on hover */
}
#mySidenav a img {
  width: 43px; /* Set the correct width of the icon */
  height: auto; /* Maintain aspect ratio */
  margin-right: 10px; /* Add some space between the icon and text */
  margin-left: 10px;
}
/* The link: px from the bottom with a background */
#about {
  background: linear-gradient(to bottom, #2c3134, #202426);
}
div.overlap {
  position: absolute;
  left: 100px;
  right: 0px;
  top: 0px;
  margin-left: auto;
  margin-right: auto;
  z-index: 99 !important;
}
div.overlap2 {
  position: absolute;
  top: -25px;
  z-index: 99 !important;
}
div.overlap3 {
  position: absolute;
  bottom: -75px;
  right: -75px;
  z-index: 99 !important;
}
/* -------------------- F. BLOCK GRID -------------------- */
/* -------------------- G. POSTS & TOOLS -------------------- */
div.contact {
  color: #000000;
  font-size: 1.1em;
  font-weight: bold;
}
div.contact a {
  /*color: #000000;*/
  font-size: 1.1em;
  font-weight: bold;
}
.post_details .user-name a {
  font-weight: bold;
  color: #1E1E1E;
  font-size: 0.875em;
}
.post_details .user-title {
  font-size: 0.750em;
}
/*.post_details {

background-color: #f0f0f7;	

}*/
div.post_description {
  font-family: proxima-nova, sans-serif;
  color: #4D565C;
  font-size: .875em;
}
div.post {
  font-family: proxima-nova, sans-serif;
  color: #4D565C;
  font-size: .875em;
  padding-top: 1em;
  padding-bottom: 1em;
  border-bottom: 0px solid #F0F0F7;
}
div.post_withline {
  font-family: proxima-nova, sans-serif;
  color: #4D565C;
  font-size: .875em;
  padding-top: 1em;
  padding-bottom: 1em;
  border-bottom: 1px solid #F0F0F7;
}
div.paperwork {
  font-family: proxima-nova, sans-serif;
  color: #4D565C;
  font-size: 1em;
  padding-top: 1em;
  padding-bottom: 1em;
  border-bottom: 2px solid #F0F0F7;
}
div.paperwork_closeout {
  font-family: proxima-nova, sans-serif;
  background-color: #F0F0F7;
  color: #4D565C;
  font-size: 1.125em;
  padding-top: 2em;
  padding-bottom: 1em;
  border-bottom: 2px solid #F0F0F7;
}
div.post_main, span.post_main {
  font-family: proxima-nova, sans-serif;
  color: #6d7c88;
  font-size: 0.750em;
  font-weight: normal;
  min-height: 3em;
}
div.post_main_dark, span.post_main_dark {
  font-family: proxima-nova, sans-serif;
  color: #000000;
  font-size: 0.875em;
  font-weight: bold;
  /*padding-top: 1em;*/
}
div.post_main_underneath, span.post_main_underneath {
  font-family: proxima-nova, sans-serif;
  color: #6d7c88;
  font-size: 0.813em;
  font-weight: normal;
  padding-top: 0;
}
div.post_main_white {
  font-family: proxima-nova, sans-serif;
  color: #C9C5C6;
  font-size: 0.750em;
  /*padding-top: 1em;*/
}
div.post_main_white_larger {
  font-family: proxima-nova, sans-serif;
  color: #C9C5C6;
  font-size: 1em;
  /*padding-top: 1em;*/
}
div.post_main_light {
  font-family: proxima-nova, sans-serif;
  color: #C9C5C6;
  font-size: 0.813em;
  font-weight: 400;
  padding-top: 0.750em;
}
div.poster_info {
  font-family: proxima-nova, sans-serif;
  color: #808495;
  font-size: .750em;
}
span.post_info {
  font-weight: bold;
  font-size: .900em;
}
.not_read {
  font-weight: bold;
  font-size: 100%;
}
a.company {
  text-decoration: none;
  font-size: .900em;
  color: #4D565C;
  padding: 0px;
  display: inline;
}
a.company:hover {
  /*text-decoration: underline;*/
  color: #0455A4;
}
a.contact {
  text-decoration: none;
  font-size: .900em;
  padding: 0px;
  display: inline;
}
a.contact:hover {
  text-decoration: underline;
  color: #0455A4;
}
/*a.contact:visited {

  text-decoration: none;

  font-size: .900em;

  padding: 0px;

  display: inline;

}*/
div.leading_title_mainarea {
  background-color: transparent;
  padding: 0em;
  color: #6f6f6f;
  font-family: "proxima-nova-extra-condensed", sans-serif;
  font-size: 1.375em;
  font-weight: bold;
}
div.post_main {
  font-family: proxima-nova, sans-serif;
  color: #4D565C;
  font-size: .875em;
  /*padding-top: 1em;*/
}
div.post_time {
  font-family: "proxima-nova", sans-serif;
  color: #808495;
  font-size: .875em;
  padding-top: 0em;
}
div.poster_info {
  font-family: proxima-nova, sans-serif;
  color: #808495;
  font-size: .750em;
}
span.post_info {
  font-weight: bold;
  font-size: .900em;
}
.not_read {
  font-weight: bold;
  font-size: 100%;
}
a.poster:link {
  text-decoration: none;
  color: #4D565C;
  padding: 0px;
  display: inline;
}
a.poster:hover {
  text-decoration: underline;
}
a.poster:visited {
  text-decoration: none;
  color: #4D565C;
  padding: 0px;
  display: inline;
}
a.post:link {
  text-decoration: none;
  padding: 0px;
  display: inline;
  font-size: 120%;
}
a.post:hover {
  text-decoration: underline;
}
a.post:visited {
  text-decoration: none;
  padding: 0px;
  display: inline;
  font-size: 120%;
}
a.last_post:link {
  text-decoration: none;
  /*color: #404040;*/
  padding: 0px;
  display: inline;
  /*font-weight: bold;*/
}
a.last_post:hover {
  text-decoration: underline;
}
a.last_post:visited {
  text-decoration: none;
  /*color: #404040;*/
  padding: 0px;
  display: inline;
  /*font-weight: bold;*/
}
a.user_tools:link {
  text-decoration: none;
  color: #4D565C;
  padding: 0px;
  display: inline;
}
a.user_tools:hover {
  text-decoration: underline;
}
a.user_tools:visited {
  text-decoration: none;
  color: #4D565C;
  padding: 0px;
  display: inline;
}
a.post_link:link {
  text-decoration: none;
  padding: 0px;
  display: inline;
}
a.post_link:hover {
  text-decoration: underline;
}
a.post_link:visited {
  text-decoration: none;
  padding: 0px;
  display: inline;
}
a.post_tools:link {
  text-decoration: none;
  padding: 0px;
  display: inline;
  color: #4D565C;
  font-size: .875em;
}
a.post_tools:hover {
  text-decoration: underline;
}
a.post_tools:visited {
  text-decoration: none;
  padding: 0px;
  display: inline;
  color: #4D565C;
  font-size: .875em;
}
.active_tool {
  font-weight: bold;
}
a.post_small:link {
  font-size: .750em;
  text-decoration: none;
  padding: 0px;
  display: inline;
}
a.post_small:hover {
  text-decoration: underline;
}
a.post_small:visited {
  font-size: .750em;
  text-decoration: none;
  padding: 0px;
  display: inline;
}
.poster-description {
  color: #8a8a8a;
  font-size: 0.9em;
  line-height: 1.25em;
}
.avatar-image {
  width: 3.125rem;
  height: 3.125rem;
  border-radius: 50%;
  border: 0 solid #cacaca;
  margin-right: 0.9375rem;
}
.avatar-image2 {
  width: 3.125rem;
  height: 3.125rem;
  border-radius: 50%;
  border: 0 solid #cacaca;
  margin-right: 0.9375rem;
}
.avatar-image3 {
  width: 3.125rem;
  height: 3.125rem;
  border-radius: 50%;
  border: 0 solid #cacaca;
  /*margin-right: 0.9375rem;*/
}
.avatar-image4 {
  width: 3.750rem;
}
.avatar-image-small {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  border: 0.0625rem solid #cacaca;
}
.avatar-image-large {
  width: 3.65rem;
  height: 3.65rem;
  border-radius: 50%;
  border: 0.0625rem solid #cacaca;
}
.photo_thumbnail {
  height: 4.688rem;
  object-fit: contain;
}
.image_standard {
  max-height: 17.188rem;
  object-fit: contain;
}
#user_avatar_header {
  background-image: url('../img/tcp_photo/tcp_photo_notuploaded.jpg');
  background-repeat: no-repeat;
  width: 6rem;
  height: 6rem;
  background-size: cover;
  background-position: top center;
  border-radius: 50%;
  margin: auto;
}
#profile_image {
  background-image: url('../img/tcp_photo/tcp_photo_notuploaded.jpg');
  background-repeat: no-repeat;
  width: 9.375rem;
  height: 12.5rem;
  background-size: cover;
  background-position: top center;
  margin: auto;
}
.thumb_image {
  background-image: url('../img/photo/tcp_photo_notuploaded.jpg');
  background-repeat: no-repeat;
  width: 4.688rem;
  height: 4.688rem;
  background-size: cover;
  background-position: top center;
  margin: auto;
  border: solid 4px #fefefe;
  box-shadow: 0 0 0 1px rgb(10 10 10 / 20%);
}
.thumb_image_larger {
  background-image: url('../img/photo/tcp_photo_notuploaded.jpg');
  background-repeat: no-repeat;
  width: 100%;
  height: 14.5rem;
  background-size: cover;
  background-position: center center;
  margin: auto;
  border: solid 4px #fefefe;
  box-shadow: 0 0 0 1px rgb(10 10 10 / 20%);
}
.publication_image_larger {
  background-image: url('../img/magazine/publication_notuploaded.jpg');
  background-repeat: no-repeat;
  width: 100%;
  height: 37.500em;
  background-size: cover;
  background-position: center center;
  margin: auto;
  border: solid 4px #fefefe;
  box-shadow: 0 0 0 1px rgb(10 10 10 / 20%);
}
.logo_thumb {
  height: 3.000em;
  object-fit: contain;
}
.logo_thumb_larger {
  height: 4.250em;
  object-fit: contain;
}
#card_image {
  background-image: url('../img/tcp_photo/tcp_photo_notuploaded.jpg');
  background-repeat: no-repeat;
  width: 12.5rem;
  height: 15.625rem;
  background-size: cover;
  background-position: top center;
  margin: auto;
  border: solid 4px #fefefe;
  box-shadow: 0 0 0 1px rgb(10 10 10 / 20%);
}
#avatar_image {
  background-image: url('../img/tcp_photo/tcp_photo_notuploaded.jpg');
  background-repeat: no-repeat;
  width: 9.375rem;
  height: 12.5rem;
  background-size: cover;
  background-position: top center;
  margin: auto;
}
#user_thumbnail {
  background-image: url('../img/tcp_photo/tcp_photo_notuploaded.jpg');
  background-repeat: no-repeat;
  width: 3.500rem;
  height: 3.500rem;
  background-size: cover;
  background-position: top center;
  margin: auto;
}
#user_avatar_instructor1 {
  background-image: url('../img/avatars/instructor_sample.jpg');
  background-repeat: no-repeat;
  width: 6rem;
  height: 6rem;
  background-size: cover;
  background-position: top center;
  border-radius: 50%;
  margin: auto;
}
#user_avatar_tcpsupport {
  background-image: url('../img/avatars/tcp_support.png');
  background-repeat: no-repeat;
  width: 6rem;
  height: 6rem;
  background-size: cover;
  background-position: top center;
  border-radius: 50%;
  margin: auto;
}
#instructor_photo_small {
  background-image: url('../img/avatars/instructor_sample.jpg');
  background-repeat: no-repeat;
  width: 9.5rem;
  height: 11.5rem;
  background-size: cover;
  background-position: top center;
  /*    border-radius: 50%;*/
  margin: auto;
}
#tcp_photo_small {
  /* background-image: url('../img/tcp_photo/tcp_photo_sample.jpg');*/
  background-repeat: no-repeat;
  width: 9.5rem;
  height: 11.5rem;
  background-size: cover;
  background-position: top center;
  /*    border-radius: 50%;*/
  margin: auto;
}
.container_logo {
  width: 3.438em;
  height: 3.438em;
  display: table-cell;
  vertical-align: middle;
}
/* Resize images */
.container_logo img {
  width: 100%;
  height: auto;
}
.avatar_inpost {
  width: 6rem;
  height: 6rem;
  border-radius: 50%;
  border: 0 solid #cacaca;
}
.avatar_transition {
  -webkit-transition: width .35s; /* Safari */
  transition: width .35s;
}
.container-avatar {
  padding-right: 0.5rem;
}
.missing-documents ul li {
  font-size: 0.85rem; /* smaller font */
  line-height: 1.4; /* improve spacing */
  display: flex; /* allow icon + text inline */
  align-items: flex-start; /* keep vertical alignment clean */
  gap: 0.25em; /* spacing between icon and text */
}
.missing-documents ul li i {
  flex-shrink: 0; /* prevent icon from shrinking */
  margin-top: 0.1em; /* align icon slightly downward if needed */
}
.missing-documents ul li a {
  white-space: nowrap; /* prevent wrapping under icon */
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%; /* avoids weird overflow */
}
.dropdown-pane {
  transition: transform 0.25s ease, opacity 0.25s ease;
}
.dropdown-pane.is-open {
  opacity: 1;
  transform: translateY(0);
}
.dropdown-pane {
  opacity: 0;
  transform: translateY(-0.5rem);
}
.dropdown-pane {
  position: absolute;
  z-index: 10;
  width: 90%;
  max-width: 25rem;
  padding: 1rem;
  visibility: hidden;
  display: none;
  border: 0px solid #cacaca;
  border-top: .500rem solid #fefefe;
  border-radius: 0;
  background-color: #fefefe;
  font-size: 1rem;
  box-shadow: 3px 3px 18px #000000;
}
.dropdown-pane.is-open {
  visibility: visible;
  display: block;
}
.dropdown-pane.tab_pane {
  min-width: 90%;
  max-width: 100%;
  border-top: 0.250rem solid #0D0D0D;
  background-color: #F2F2F3;
  border: 1px solid #707070;
}
.dropdown-pane.tab_pane2 {
  min-width: 96%;
  border-top: 0.250rem solid #0D0D0D;
  /*background-image: url(../img/bkg_page_home3.png);*/
  /*background-repeat: repeat-x;*/
  background-color: #eaeaea;
  border: 1px solid #707070;
  color: #1e1e1e;
}
.nav_tab_container {
  /*min-height: 300px;*/
  max-height: 715px;
  overflow-y: scroll;
}
.nav_tab_container::-webkit-scrollbar {
  width: 8px;
}
/* Track */
.nav_tab_container::-webkit-scrollbar-track {
  background: #F0F0F7;
}
/* Handle */
.nav_tab_container::-webkit-scrollbar-thumb {
  background: #a5a4a4;
}
/* Handle on hover */
.nav_tab_container::-webkit-scrollbar-thumb:hover {
  background: #555;
}
/* Profile Card with Action Icons */
.card_container {
  display: flex;
  flex-flow: row wrap;
}
.card-wrap {
  flex: 0 0 25%;
  display: flex;
  padding: 10px; /* gutter width */
}
.card_container3 {
  display: flex;
  flex-flow: row wrap;
}
.card-wrap3 {
  flex: 0 0 33.33333%;
  display: flex;
  padding: 10px; /* gutter width */
}
.card-wrap2 {
  flex: 0 0 50%;
  display: flex;
  padding: 10px; /* gutter width */
}
.card {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-positive: 1;
  flex-grow: 1;
  margin-bottom: 1rem;
  border: 1px solid #C2C2C2;
  border-radius: 0;
  background: #ffffff;
  overflow: hidden;
  color: #0a0a0a;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}
.fade-card {
  position: relative;
  background: #ffffff;
  border: 1px solid #C2C2C2;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-bottom: 1em;
}
/* Hover effect */
.fade-card:hover {
  border-color: #383a4d; /* New border color on hover */
  box-shadow: 0 4px 12px rgba(56, 58, 77, 0.5), 0 6px 24px rgba(56, 58, 77, 0.3); /* New shadow color */
}
.fade-content {
  position: relative;
  max-height: 225px; /* Initial collapsed height */
  overflow: hidden;
  transition: max-height 0.75s ease-in-out, background 0.75s ease-in-out; /* Smoother transition */
  cursor: pointer;
  padding: 0.375em;
  padding-bottom: .875em;
}
.fade-content.expanded {
  max-height: none; /* Expand to show full content */
}
.fade-content::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 75px; /* Adjust the height to control the fade */
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff 100%);
  transition: opacity 0.5s ease;
}
.fade-content.expanded::after {
  opacity: 0; /* Fade effect disappears when expanded */
}
.identification_card .card-section {
  padding: 1.75rem;
}
.card_content p {
  padding-top: 0.375em;
  color: #1e1e1e;
  font-size: 1em;
  /*padding-left: .875em;*/
  /*padding-right: .875em;*/
  font-weight: 600;
}
.card_content ul li, ol li {
  /*padding-left: .875em;*/
  /*padding-right: .875em;*/
  color: #1e1e1e;
}
.card_content h2, .card_content h3, .card_content h4 {
  /*font-family: "proxima-nova-extra-condensed", sans-serif;*/
  color: #1e1e1e;
  margin-bottom: 0;
  font-weight: 700;
  /*padding-left: 0.5em;*/
  /*padding-right: 0.5em;*/
}
.card_red {
  /*background: #8d3042;*/
  border-top: 0.75em solid #782a39;
  background-image: linear-gradient(#782a39, #8d3042);
  padding-bottom: 0.125em;
}
.card_red2 {
  background: #d3414e;
  border-top: 0.75em solid #d3414e;
  padding-bottom: 0.125em;
}
.card_orange {
  /*background: #d6560b;*/
  border-top: 0.75em solid #a74106;
  background-image: linear-gradient(#a74106, #d6560b);
  padding-bottom: 0.125em;
}
.card_orange2 {
  background: #ed7d31;
  border-top: 0.75em solid #ed7d31;
  padding-bottom: 0.125em;
}
.card_green {
  /*background: #3b590e;*/
  border-top: 0.75em solid #2d440b;
  background-image: linear-gradient(#2d440b, #3b590e);
  padding-bottom: 0.125em;
}
.card_green2 {
  background: #539633;
  border-top: 0.75em solid #539633;
  padding-bottom: 0.125em;
}
.card_links {
  padding-top: 1em;
}
.callout.card_callout {
  background-color: #202427;
  color: #ffffff;
  font-size: 1.5em;
  font-weight: 700;
  font-family: "proxima-nova-extra-condensed", sans-serif;
}
.card_links .menu a.nav_main_link {
  padding-bottom: 1em;
  padding-left: .875rem;
  outline: none; /* Removes the focus outline if it's present */
}
.card_links .menu a {
  line-height: 1.5;
  text-decoration: none;
  display: block;
  padding: 1rem 1rem;
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  padding-left: 1rem;
  padding-right: 1rem;
  /*margin-bottom: 0.7rem;*/
  color: rgba(255, 255, 255, 0.7);
}
.card_links .sub_sub_menu a {
  line-height: 1;
}
.card_links ul.link_card li {
  background-color: rgba(0, 0, 0, 0.1); /* Adjust transparency */
  padding: 0.5em; /* Space inside each list item */
  margin-bottom: 0.3125em; /* Space between list items */
  display: flex; /* Aligns items in a row */
  align-items: center; /* Centers items vertically */
}
/* Apply flex only to direct child <li> elements within each sub-menu */
.card_links > ul > li > ul.link_card2 > li {
  display: block;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.1);
  padding: 0;
  margin-bottom: 0.25em;
}
/* Override for nested ul elements */
.card_links ul.link_card2 ul {
  position: relative; /* Ensure sub-sub menus align correctly */
  display: block; /* Stack items vertically */
  width: 100%; /* Full width to prevent horizontal overflow */
  left: 0; /* Align with the start of the parent li */
  padding-left: 0.25em; /* Indent for clarity */
  padding-top: 0; /* Indent for clarity */
  padding-bottom: 0.25em; /* Indent for clarity */
  margin-top: 0; /* Space between sub-menu and sub-sub menu */
}
.card_links ul.link_card2 ul li {
  display: block; /* Each sub-sub menu item on its own line */
  background-color: transparent; /* Clear any inherited background */
  padding: 0 0; /* Vertical padding for better readability */
}
.card_links .menu > a {
  background-color: transparent;
  /*padding: 0.5em;*/ /* Space inside each list item */
  color: #ffffff;
  font-weight: 700;
}
.card_links .menu .is-active > a {
  background-color: transparent;
  /*padding: 0.5em;*/ /* Space inside each list item */
  color: #ffffff;
  font-weight: 700;
}
.card_links .menu .active > a {
  background-color: transparent;
  color: #ffffff;
  font-weight: 900;
  margin-bottom: 0;
}
.left_nav_card_links .fa-li {
  padding-top: .5em;
}
.left_nav_card_links .number-overlay {
  padding-top: 0.375em;
}
.fa-li {
  position: relative;
  flex-shrink: 0; /* Prevents the icon from shrinking */
}
.number-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #000000;
  font-size: 1.1em;
  font-family: "proxima-nova-extra-condensed", sans-serif;
  font-weight: 700;
  font-style: normal;
  /*padding-left: 1em;*/
  /*padding-right: 0.875em;*/
}
.number-overlay-white {
  color: #ffffff;
}
a.white_list {
  color: rgba(255, 255, 255, 0.7); /* Ensures link color is white */
  font-size: 0.9375em;
  font-weight: 500;
  margin-left: 0.5em; /* Adjust spacing between icon and text */
}
a.white_list:hover {
  color: #ffffff; /* Ensures link color is white */
  text-decoration: none;
}
a.white_list:active {
  color: #ffffff; /* Ensures link color is white */
  text-decoration: none;
  background-color: transparent;
}
a.white_list2 {
  color: rgba(255, 255, 255, 0.7); /* Ensures link color is white */
  font-size: .875em;
  line-height: 1.6;
  font-weight: normal;
  /*padding-right: 2.625em;*/
}
a.white_list2:hover {
  color: #ffffff; /* Ensures link color is white */
  text-decoration: none;
}
a.white_list2:active {
  color: #ffffff; /* Ensures link color is white */
  text-decoration: none;
  background-color: transparent;
  font-weight: bold;
}
.rollover_hover:hover {
  box-shadow: 0 4px 8px 0 rgba(20, 104, 160, 0.3), 0 6px 20px 0 rgba(20, 104, 160, 0.3);
  transform: scale(1.03); /* Adjust the scale value as needed */
  opacity: 1; /* Fully visible */
}
.card_minimal {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-positive: 1;
  flex-grow: 1;
  margin-bottom: 1rem;
  border: 0px solid #C2C2C2;
  border-radius: 0;
  background: #ffffff;
  overflow: hidden;
  color: #0a0a0a;
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0), 0 0 0 0 rgba(0, 0, 0, 0);
}
.card_bkg {
  background-image: url("../img/BCCSA_SWOOSHES_light_grey.png");
  background-repeat: no-repeat;
  background-color: #ffffff;
}
.featured_bkg {
  background-image: url("../img/bccsa_swooshes_lightcolour.jpg");
  background-repeat: no-repeat;
  background-color: #ffffff;
}
.text_bkg {
  background-image: url("../img/bccsa_swooshes_lightgrey2.jpg");
  background-repeat: no-repeat;
  background-color: #ffffff;
}
.photo_bkg_featured {
  background-image: url("../img/bccsa_swooshes_featured_image.png");
  background-repeat: no-repeat;
  background-color: transparent;
}
.tab_image {
  float: left;
  /*width: 19.375em;*/
  width: 100%;
  height: 9.375em;
  border-radius: 10px;
  object-fit: contain;
  object-position: 50% 50%;
  padding-bottom: .875em;
}
/*.tab_image:hover {

transform: scale(1.1);

}*/
.tab_header_title {
  padding-left: .750em;
  padding-top: 1.5em;
}
.tab_image2 {
  float: left;
  /*width: 19.375em;*/
  width: 100%;
  height: 12.500em;
  border-radius: 10px;
  object-fit: cover;
  object-position: 50% 50%;
  padding-bottom: .875em;
}
.tab_image_portrait {
  /*float: left;*/
  /*width: 19.375em;*/
  /*width: 100%;*/
  object-fit: cover;
  object-position: 50% 50%;
  height: 12.500em;
}
.logo_height {
  height: 3.125em;
}
.tab_image_background {
  background-position: left;
  /*width: 19.375em;*/
  width: 100%;
  height: 4.438em;
  border-radius: 10px 10px 0px 0px;
  background-image: url("../img/bccsa_swooshes_lightgrey2.jpg");
  background-repeat: no-repeat;
  background-color: #ffffff;
  padding-bottom: 1em;
}
.title_image_background {
  float: left;
  /*width: 19.375em;*/
  width: 100%;
  padding-top: 1em;
  height: 6.55em;
  border-radius: 0px 0px 0px 0px;
  /*background-image: url("../img/bccsa_swooshes_lightcolour.jpg");*/
  /*background-repeat: no-repeat;*/
  background-color: #54656f;
  background-image: linear-gradient(#54656f, #2d383e);
  /*background-color: #ffffff;*/
  padding-bottom: 0px;
}
.program_image_thumbnail {
  padding-left: .750em;
  padding-top: .875em;
  height: 5.438em;
  object-fit: cover;
  object-position: 50% 50%;
}
.program_image_hero_thumbnail {
  padding-left: .750em;
  padding-top: .875em;
  height: 11.563em;
}
.program_image_page {
  /*padding-left: .750em;*/
  /*padding-top: .875em;*/
  height: 5.438em;
  object-fit: cover;
  object-position: 50% 50%;
}
.program_image_certification {
  height: 7.813em;
}
.title_padding {
  padding-left: .625em;
  padding-top: .625em;
  padding-bottom: .325em;
}
.post_image_thumbnail {
  width: 28em;
}
.post_image_thumbnail_smaller {
  width: 16em;
}
.image_caption {
  /*padding-top: 1em;*/
  font-size: 0.875em;
  font-style: italic;
}
.container_image {
  /*float: left;*/
  width: 100%;
  height: 460px;
  object-fit: cover;
  object-position: 0% 50%;
}
.featured_container {
  position: relative;
  text-align: center;
  color: white;
}
/* Bottom right text */
.featured_bottom_right {
  position: absolute;
  bottom: 0px;
  right: 0px;
  background-color: transparent;
  width: 50%;
  padding: 1.5em;
  font-size: 0.875em;
}
/* Bottom left text */
.featured_bottom_left {
  position: absolute;
  bottom: 8px;
  left: 16px;
}
/* full overlay */
.featured_overlay {
  width: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.white_border_top {
  border-top: .500rem solid #ffffff;
}
.card-section-title {
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
  padding: 1rem;
  padding: 0px 1rem 1rem 1rem;
  vertical-align: top;
}
.cell_minimum_height {
  min-height: 7.000em;
  vertical-align: top;
}
.card-section-title-no-bottom-space {
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
  padding: 1rem;
  padding: 0px 1rem 0px 1rem;
}
.card-minimum-height {
  min-height: 1em;
  vertical-align: top;
}
.card-minimum-height-larger {
  min-height: 6.875em;
}
.card-minimum-height-smaller {
  min-height: 2.5em;
}
.card-section-bottom {
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
  padding: 1rem;
  padding: 0px 1rem 1rem 1rem;
  min-height: 4.5em;
  vertical-align: bottom;
}
.card-section-bottom-smaller {
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
  padding: 1rem;
  padding: 0px 1rem 1rem 1rem;
  min-height: 1.5em;
  vertical-align: bottom;
}
/* When a tab card is hovered */
.tab_card_full a:hover {
  text-decoration: none;
  color: #1a73e8;
}
.tab_links_underline a:hover {
  text-decoration: underline;
  /*background-color: #d5e2fb;*/
}
.tab_card {
  padding: 1.0em;
}
.tab_card p {
  font-size: 0.938em;
}
.card-section-title-no-bottom-space a h5 {
  color: #1e1e1e;
}
.card-section-title-no-bottom-space a:hover h5 {
  color: #0455A4;
}
.tab_card_full a:hover h5 {
  color: #1a73e8;
}
ul.card_unordered li {
  font-size: 0.938em;
  margin-bottom: 0.625em;
  margin-left: 0.500em;
}
/* Indented in Resources folder description, maybe other managers or areas */
.text_bkg ul li, .text_bkg ol li {
  margin-left: 1em;
}
/* Indented in short description of Resources, maybe other managers or areas */
.gateway-table td ul li, .gateway-table td ol li {
  margin-left: .650em;
}
ul.indented li, ol.indented li {
  margin-left: 1em;
  color: #1e1e1e;
}
ul.indented_more li, ol.indented_more li {
  margin-left: 1.5em;
}
ul.indented_alot_more li, ol.indented_alot_more li {
  margin-left: 2.25em;
}
ol.space_top_bottom {
  margin-top: 0.875em;
  margin-bottom: 0.875em;
}
ul.more_space_between li, ol.more_space_between li {
  margin-bottom: 1.5em;
}
ul.little_space_between li, ol.little_space_between li {
  margin-bottom: .750em;
}
ul.very_little_space_between li, ol.very_little_space_between li {
  margin-bottom: .500em;
}
ul.no_space_between li, ol.no_space_between li {
  margin-bottom: 0;
}
.menu.vertical.nested > li:first-child {
  margin-top: .500em; /* Adjust this value as needed */
}
ol > li::marker {
  font-weight: bold;
}
.dropdown-pane.dropdown-pane_dark {
  position: absolute;
  /*z-index: 1;*/
  width: 100%;
  border-top: .500rem solid #1e1e1e;
  background-color: #1e1e1e;
}
.dropdown-pane.arrow-top {
  margin-top: 80px;
}
.dropdown-pane.arrow-top:after {
  content: " ";
  position: absolute;
  right: 13px;
  top: -14px;
  border-top: none;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
  border-bottom: 10px solid #fefefe;
  /*box-shadow: 5px 5px 18px #cacaca;*/
}
.dropdown-pane-smaller {
  width: 150px;
}
a.main_dropdown:link {
  text-decoration: none;
  color: #363636;
  font-weight: bold;
  display: inline;
  font-size: .875em;
}
a.main_dropdown:hover {
  text-decoration: none;
  color: #4968A9;
}
a.main_dropdown:visited {
  text-decoration: none;
  color: #4D565C;
  display: inline;
  font-size: .875em;
}
/*



=============================================== 04. CONTENT STYLES ===============================================



*/
.bold {
  font-weight: bold;
}
.in_progress {
  font-weight: bold;
}
.compliant {
  color: #539633;
}
.not_compliant {
  color: #ba2d35;
}
.bold_more {
  font-weight: 900;
}
.medium_bold {
  color: #000000;
}
.italics {
  font-style: italic;
}
.uppercase_text {
  text-transform: uppercase;
}
.transparent {
  opacity: 0.0;
  filter: alpha(opacity=0); /* For IE8 and earlier */
}
.larger_text {
  font-size: 2em;
}
.larger_text2 {
  font-size: 1.25em;
  outline: none; /* Removes the focus outline if it's present */
}
/* -------------------- A. HEADERS, PARAGRAPHS, BODY -------------------- */
body {
  margin-top: 0;
  padding: 0;
  background: #ffffff;
  font-family: proxima-nova, sans-serif;
  font-weight: normal;
  line-height: 1.5;
  color: #1e1e1e;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  /*background-image: url("../img/bg.jpg");*/
  /*background-repeat: no-repeat;*/
}
.off-canvas-content {
  margin-top: 2em;
}
p {
  font-family: proxima-nova, sans-serif;
  color: #1e1e1e;
  font-size: 1.000em;
}
p.subdued {
  font-size: 0.875em;
  color: #8a8a8a;
}
p.subhead::first-letter {
  font-family: 'Times New Roman', serif;
  font-size: 200%;
  color: #667079;
  line-height: 0;
}
/*.lead_dark {
  font-family: proxima-nova, sans-serif;
  font-size: 1.15em;
  line-height: 1.6;
  color: #000000;
  font-weight: 500;
  margin-bottom: 1em;
}*/
/*.lead {
  font-family: proxima-nova, sans-serif;
  font-size: 1.15em;
  line-height: 1.6;
  color: #ffffff;
  font-weight: 700;
  margin-bottom: 1em;
}*/
/*.lead a {
  font-family: proxima-nova, sans-serif;
  color: #c9c0bf;
  text-decoration: none;
  font-weight: 500;
}*/
/*.lead a:hover {
  font-family: proxima-nova, sans-serif;
  color: #ffffff;
  text-decoration: underline;
}*/
h1 {
  font-family: proxima-nova, sans-serif;
  font-weight: 900;
  color: #000000;
  /* line-height: 1.125em; */
}
h2, h3, h4, h5, h6 {
  font-family: proxima-nova, sans-serif;
  font-style: normal;
  font-weight: 900;
  color: #1e1e1e;
  line-height: 1.375em;
  padding-bottom: .250em;
}
h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small {
  line-height: 0;
  color: #000000;
}
h1.alternate, h2.alternate, h3.alternate, h4.alternate, h5.alternate, h6.alternate {
  font-family: "proxima-nova-extra-condensed", sans-serif;
  font-weight: 700;
  font-style: normal;
}
p.alternate {
  font-family: "proxima-nova-extra-condensed", sans-serif;
  font-weight: 400;
  font-style: normal;
}
h1.white_text, h2.white_text, h3.white_text, h4.white_text, h5.white_text, h6.white_text, p.white_text, span.white_text {
  color: #ffffff;
}
ul.white_text {
  color: #ffffff;
}
ul.white_text li a {
  font-family: proxima-nova, sans-serif;
  color: #c9c0bf;
  text-decoration: none;
  font-weight: 500;
}
ul.white_text li a:hover {
  font-family: proxima-nova, sans-serif;
  color: #ffffff;
  text-decoration: underline;
}
h1.grey_text, h2.grey_text, h3.grey_text, h4.grey_text, h5.grey_text, h6.grey_text, p.grey_text, div.grey_text {
  color: #5b6771;
}
h1.dark_grey_text, h2.dark_grey_text, h3.dark_grey_text, h4.dark_grey_text, h5.dark_grey_text, h6.dark_grey_text, p.dark_grey_text {
  color: #828990;
}
h1.light_grey_text, h2.light_grey_text, h3.light_grey_text, h4.light_grey_text, h5.light_grey_text, h6.light_grey_text, p.light_grey_text {
  color: rgba(255, 255, 255, 0.7);
}
h1.blue_text, h2.blue_text, h3.blue_text, h4.blue_text, h5.blue_text, h6.blue_text, p.blue_text {
  color: #6e81a9;
}
h1.condensed, h2.condensed, h3.condensed, h4.condensed, h5.condensed, h6.condensed, p.condensed {
  color: #ffffff;
  font-family: bebas-neue-by-fontfabric, sans-serif;
  font-weight: 700;
  font-style: normal;
}
h1.no_bold, h2.no_bold, h3.no_bold, h4.no_bold, h5.no_bold, h6.no_bold, p.no_bold {
  font-weight: 400;
}
h1.highlight, h2.highlight, h3.highlight, h4.highlight, h5.highlight, h6.highlight, p.highlight {
  font-weight: 900;
  color: #000000;
  padding-top: 0em;
  padding-bottom: 0em;
}
p.small_text_no_padding {
  font-size: 85.0%;
  padding: 0px;
}
p.small_text_footer {
  font-size: 85.0%;
}
p.card_description_listing, div.card_description_listing {
  font-size: 0.813em;
  color: #6d7c88;
}
ul.small_text_footer li {
  font-size: 0.813em;
}
ul.small_text_footer li.larger_text {
  font-size: 1.000em;
}
p.small_text_footer2 {
  font-size: 0.875em;
}
p.smallest_text {
  font-size: 70.0%;
}
h1.less_space, h2.less_space, h3.less_space, h4.less_space, h5.less_space, h6.less_space {
  margin-bottom: 0em;
  line-height: 0.650em;
}
p.less_space {
  margin-bottom: .750em;
  line-height: 1.45em;
}
h1.medium_space, h2.medium_space, h3.medium_space, h4.medium_space, h5.medium_space, h6.medium_space, p.medium_space {
  margin-bottom: 0em;
  line-height: 1.125em;
}
h1.lesser_space, h2.lesser_space, h3.lesser_space, h4.lesser_space, h5.lesser_space, h6.lesser_space, p.lesser_space {
  margin-bottom: 0em;
  line-height: 0.150em;
}
h1.more_space, h2.more_space, h3.more_space, h4.more_space, h5.more_space, h6.more_space {
  padding-bottom: 0.500em;
}
h1.more_space_top, h2.more_space_top, h3.more_space_top, h4.more_space_top, h5.more_space_top, h6.more_space_top, p.more_space_top {
  padding-top: 0.5em;
}
h1.more_space_top_little, h2.more_space_top_little, h3.more_space_top_little, h4.more_space_top_little, h5.more_space_top_little, h6.more_space_top_little, p.more_space_top_little {
  padding-top: 0.250em;
}
h1.more_space_top_medium, h2.more_space_top_medium, h3.more_space_top_medium, h4.more_space_top_medium, h5.more_space_top_medium, h6.more_space_top_medium, p.more_space_top_medium {
  padding-top: 0.475em;
}
div.more_space_top_medium {
  padding-top: 0.475em;
}
h1.more_space_top_little_bottom_none, h2.more_space_top_little_bottom_none, h3.more_space_top_little_bottom_none, h4.more_space_top_little_bottom_none, h5.more_space_top_little_bottom_none, h6.more_space_top_little_bottom_none, p.more_space_top_little_bottom_none {
  padding-top: 0.250em;
  padding-bottom: 0em;
}
h1.footer, h2.footer, h3.footer, h4.footer, h5.footer, h6.footer, p.footer {
  font-family: "proxima-nova", sans-serif;
  font-weight: bold;
  font-size: 85%; /* text-transform: uppercase; */
}
blockquote, blockquote p {
  font-family: "proxima-nova", sans-serif;
  font-size: 1.125em;
  font-style: normal;
  /*width: 500px;*/
  /*margin: 0.25em 0;*/
  /*padding: 0.35em 40px;*/
  line-height: 1.55;
  position: relative;
  color: #ffffff;
  border-left: 0px solid #cacaca;
}
blockquote.post, blockquote.post p {
  color: #8a8a8a;
  font-size: .938em;
  font-family: "proxima-nova", sans-serif;
  font-weight: normal;
  margin: 0.25em 0;
  padding: 0.35em 12px;
  line-height: 1.55;
  position: relative;
}
/*blockquote {

  margin: 1.5rem 0 .5rem;

  padding: 0 1rem 0 1rem;

  border-left: 0px solid #c6c7c9;

}*/
blockquote:before {
  display: block;
  padding-left: .625em;
  content: "\201C";
  font-size: 5.000em;
  position: absolute;
  left: -.875em;
  top: -.395em;
  color: #ffffff;
}
blockquote cite {
  color: #ffffff;
  font-family: "proxima-nova", sans-serif;
  font-size: .750em;
  display: block;
  margin-top: 1em;
  margin-bottom: 2.75em;
  font-style: normal;
}
blockquote cite:before {
  content: "\2014 \2009";
}
cite2 {
  display: block;
  font-size: 1.000rem;
  color: #384656;
  padding-left: 0.625em;
  padding-top: 0.625em;
  font-style: italic;
}
/* -------------------- B. LISTS -------------------- */
ol.number_list {
  counter-reset: li; /* Initiate a counter */
  margin-left: 0; /* Remove the default left margin */
  padding-left: 0; /* Remove the default left padding */
}
ol.number_list > li {
  position: relative; /* Create a positioning context */
  margin: 0 0 6px 2em; /* Give each list item a left margin to make room for the numbers */
  padding: 4px 8px; /* Add some spacing around the content */
  list-style: none; /* Disable the normal item numbering */
  background: #f6f6f6;
}
ol.number_list > li:before {
  content: counter(li); /* Use the counter as content */
  counter-increment: li; /* Increment the counter by 1 */
  /* Position and style the number */
  position: absolute;
  top: -2px;
  left: -2em;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 2em;
  /* Some space between the number and the content in browsers that support

       generated content but not positioning it (Camino 2 is one example) */
  margin-right: 8px;
  padding: 4px;
  color: #fff;
  background: #646e71;
  font-weight: bold;
  font-family: "proxima-nova-extra-condensed", sans-serif;
  font-size: 1.5rem;
  text-align: center;
  min-height: 100%;
}
li ol.number_list, li ul.number_list {
  margin-top: 6px;
}
ol.number_list ol.number_list li:last-child {
  margin-bottom: 0;
}
ul.indented ul {
  list-style-type: circle;
}
article ul li {
  margin-left: 0.938em;
}
#filter a {
  color: #1e1e1e;
}
#filter .filteractive:hover {
  color: #1e1e1e;
  font-weight: bold;
}
.content_area li {
  margin-left: 0.938em;
}
ul.content_area_breadcrumb li {
  margin-left: -2.0em;
}
ul.content_area_breadcrumb2 li {
  margin-left: 0;
}
ul.small_ul {
  font-size: 85%;
  font-weight: normal;
  color: #e2e1e1;
  line-height: 150%;
}
ul.small_ul2 {
  padding-top: .750em;
  font-size: 90%;
  font-weight: normal;
  line-height: 150%;
}
ul.more_space_top_list, ol.more_space_top_list {
  padding-top: .750em;
}
ul.callout_details li {
  font-size: 0.875em;
  font-weight: normal;
  color: #1e1e1e;
}
.stat {
  font-size: 1.250rem;
  line-height: 1;
  font-weight: bold;
  padding-top: .200em;
  padding-bottom: .500em;
  color: #1e1e1e;
}
.breadcrumbs li {
  float: left;
  font-size: 0.750rem;
  color: #0a0a0a;
  cursor: default;
  text-transform: none;
}
/*#menu-outer {

	height: 84px;

	background: url(images/bar-bg.jpg) repeat-x;



}*/
.table_horizontal_list {
  display: table; /* Allow the centering to work */
  margin: 0 auto;
}
ul#horizontal-list {
  list-style: none;
}
ul#horizontal-list li {
  display: inline;
  padding: .75rem 1rem;
  font-size: 0.875rem;
}
/* -------------------- C. TABS AND ACCORDIONS -------------------- */
.submenu-toggle {
  position: absolute;
  top: 0.25em;
  right: 0;
  cursor: pointer;
  width: 30px;
  height: 30px;
  border-color: rgba(255, 255, 255, 0.5);
}
.submenu-toggle::after {
  display: block;
  width: 0;
  height: 0;
  border: inset 5px;
  content: '';
  border-bottom-width: 0;
  border-top-style: solid;
  border-color: rgba(255, 255, 255, 0.5) transparent transparent;
  top: 0;
  bottom: 0;
  margin: auto;
}
/* Add this CSS rule to change the cursor for links with href="#" */
.card_links .vertical.menu a[href="#"] {
  cursor: text;
}
.toggle-arrow {
  transition: transform 0.3s ease;
}
.toggle-arrow.rotated {
  transform: rotate(180deg);
}
.submenu-toggle:hover::after {
  border-color: rgba(255, 255, 255, 0.8) transparent transparent;
}
.accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a {
  position: relative;
  /*font-family: "proxima-nova-extra-condensed", sans-serif;*/
  font-weight: 700;
  font-style: normal;
  font-size: 1rem;
  color: #ffffff;
  padding-bottom: 1em;
}
.accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a:hover {
  text-decoration: none;
  color: rgba(255, 255, 255, 0.7);
}
.accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a::after {
  display: block;
  width: 0;
  height: 0;
  border: inset 5px;
  content: '';
  border-bottom-width: 0;
  border-top-style: solid;
  border-color: #a6a6a6 transparent transparent;
  position: absolute;
  top: 50%;
  margin-top: -4px;
  left: -3rem;
}
.accordion-title .question-number {
  margin-right: 0.5em;
  font-weight: bold;
  font-size: 1.25rem;
  color: #000000;
}
.accordion-title:hover .question-number, .accordion-title:focus .question-number {
  color: #ffffff;
  text-decoration: none;
}
.accordion-title {
  position: relative;
  display: block;
  padding: 1.25rem 1rem;
  padding-right: 2rem;
  border: 1px solid #ffffff;
  border-bottom: 0;
  font-size: 1.25rem;
  line-height: 1.35;
  color: #234A59;
  font-weight: normal;
  background-image: url("../img/BCCSA_SWOOSHES_light_grey.png");
  background-repeat: no-repeat;
  background-position: left center;
}
.accordion-title span {
  font-size: 1.000rem;
  color: #000000;
  font-weight: normal;
}
.accordion-title:hover, .accordion-title:focus {
  background-color: #234A59;
  color: #ffffff;
  text-decoration: none;
  background-image: none;
  background-repeat: no-repeat;
}
.accordion-title:focus {
  font-weight: bold;
}
.accordion-content {
  display: none;
  padding: 1rem;
  border: 1px solid #ffffff;
  border-bottom: 1px solid #e6e6e6;
  background-color: #fefefe;
  color: #0a0a0a;
}
.faq_title {
  font-size: 1.125rem;
  line-height: 1.5rem;
  color: #202124;
  /*font-weight: bold;*/
  padding-right: 1.75em;
}
.faq_title:hover, .faq_title:focus {
  background-color: #d33f4d;
  color: #ffffff;
  text-decoration: none;
}
.tabs {
  margin: 0;
  border: none;
  background: #fafafa;
  list-style: none;
  border-bottom: 1px solid #e1e5eb; 
}
.tabs-title {
  float: left;
  margin-right: 0.5rem;
}
.tabs-title > a {
  display: inline-flex;
  align-items: center;
  font-family: proxima-nova, sans-serif;
  font-weight: 500;
  font-size: 1.1rem;
  color: #ffffff;
  background-color: #1473e6;
  padding: 0.5em 1em;
  border-radius: 4px;
  border-bottom: none; /* important! */
  transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
  position: relative;
  z-index: 1; /* normal stacking */
}
.tabs-title > a i {
  margin-right: 0.5em;
  font-size: 1em;
}
.tabs-title > a:hover {
  background: #14679e;
  color: #ffffff;
  text-decoration: none;
}
.tabs-title > a:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(20, 115, 230, 0.4);
}
.tabs-title > a[aria-selected="true"] {
  background: #ffffff;
  color: #1a202c;
  font-weight: 700;
  border: 1px solid #e1e5eb;
  border-bottom: none; /* NO bottom border */
  border-radius: 4px 4px 0 0;
  box-shadow: none;
  position: relative;
  z-index: 2; /* sits above content */
  margin-bottom: -1px; /* pulls tab down to cover the border */
}
.tabs-content {
  border-top: 1px solid #e1e5eb;
  background: transparent;
  color: #0a0a0a;
  transition: all 0.5s ease;
}
.tabs-panel {
  opacity: 0;
  transform: translateY(0.5rem);
  visibility: hidden;
  pointer-events: none;
  padding: 1rem;
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.tabs-panel.is-active {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
}
/* -------------------- D. DROPDOWNS -------------------- */
/* -------------------- E. TABLES -------------------- */
.more_space_little .risk_table {
  margin-top: 1.5em;
  margin-bottom: 1.5em;
}
.risk_table table {
  width: 100%;
  border-collapse: collapse;
}
.risk_table th, .risk_table td {
  border: 1px solid black;
  text-align: center;
  padding: 8px;
}
.risk_table th {
  background-color: #f2f2f2;
}
.risk_table .extreme-risk, .extreme-risk-title {
  background-color: #FF0000;
  color: white;
  text-transform: uppercase;
}
.risk_table .very-high-risk, .very-high-risk-title {
  background-color: #FF4500;
  color: white;
  text-transform: uppercase;
}
.risk_table .critical-risk, .critical-risk-title {
  background-color: #ff0000;
  color: white;
  text-transform: uppercase;
}
.risk_table .high-risk, .high-risk-title {
  background-color: #ed7d31;
  color: white;
  text-transform: uppercase;
}
.risk_table .medium-risk, .medium-risk-title {
  background-color: #ffc000;
  text-transform: uppercase;
}
.risk_table .low-risk, .low-risk-title {
  background-color: #ffff00;
  text-transform: uppercase;
}
.risk_table .negligible-risk, .negligible-risk-title {
  background-color: #92d050;
  text-transform: uppercase;
}
.risk-title-padding {
  padding-left: .875em;
  padding-right: .875em;
}
/*.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: #0455A4 !important;
    background-color: #f5f5f5;
}*/
.tablesorter-default .header, .tablesorter-default .tablesorter-header {
  /*background-image: url("../img/black-unsorted.gif");*/
  /*background-position: 90% 45%;*/
  /*background-repeat: no-repeat;*/
  cursor: pointer;
}
.tablesorter-default thead .headerSortUp, .tablesorter-default thead .tablesorter-headerAsc, .tablesorter-default thead .tablesorter-headerSortUp {
  /*background-image: url(../img/black-asc.gif);*/
  /*background-position: 90% 45%;*/
  border-bottom: #838282 4px solid;
}
.tablesorter-default thead .headerSortDown, .tablesorter-default thead .tablesorter-headerDesc, .tablesorter-default thead .tablesorter-headerSortDown {
  /*background-image: url(../img/black-desc.gif);*/
  /*background-position: 90% 45%;*/
  border-bottom: #838282 4px solid
}
.tablesorter-default thead .sorter-false {
  background-image: none;
  cursor: default;
}
/*table.hover tbody tr:hover {

  background-color: #FFF3D9;

}*/
table.form-table {
  width: 100%;
}
table.gateway-table {
  width: 100%;
  /*table-layout: fixed;*/
  /*overflow-wrap: break-word;*/
}
.gateway-table.unstriped tbody {
  background-color: transparent;
}
.gateway-table th {
  background-color: #4c565f;
}
.gateway-table th a {
  color: #a4bce7;
}
.gateway-table th a:hover, .gateway-table th a:focus {
  color: #ffffff;
}
.gateway-table tfoot {
  background-color: #ffffff;
}
.gateway-table tfoot td {
  padding-top: 1rem;
  color: #7e7e7e;
}
table.content_table tfoot td {
  font-size: 0.8125em;
}
table.content_table tfoot th, table.content_table tfoot td {
  padding: 0.750rem 0.625rem 0 0.625rem;
  font-weight: normal;
  text-align: left;
}
.gateway-table th [type='checkbox'], .gateway-table td [type='checkbox'] {
  margin-top: 1rem;
}
/*.gateway-table th.more_space_top {

  padding-top: 2.000em;

}*/
.gateway-table th {
  border: 1px solid #737f8e;
  color: #ffffff;
}
.gateway-table th.minwidth {
  min-width: 150px;
}
.gateway-table tr, .gateway-table td {
  border: 1px solid #e0e0e0;
}
.gateway-table tbody th, .gateway-table tbody td {
  padding: 0.875rem 0.625rem 0.750rem 0.750rem;
}
.gateway-table tr.grey_cell {
  background-color: #f7f7f7;
  border-bottom: 0.375em solid #f1f1f3;
}
.gateway-table tr.grey_cell_border_top {
  background-color: #f7f7f7;
  border-top: 0.375em solid #f1f1f3;
}
#UserTable td {
  vertical-align: top;
}
#UserTable2 td {
  vertical-align: top;
}
.gateway-table th [type='checkbox'], .gateway-table td [type='checkbox'] {
  margin-top: 1rem;
}
.course_space {
  color: green;
}
.gateway-table2 th, .gateway-table2 td {
  vertical-align: top;
}
.gateway-table2 th.grey, .gateway-table2 td.grey, .gateway-table td.grey {
  background-color: #f9f9f9;
}
.gateway-table2 th {
  padding-top: 0.875rem;
}
.gateway-table3 th, .gateway-table3 td {
  vertical-align: top;
  background-color: #F0F0F7;
  border-bottom: 1px solid #ffffff;
}
.gateway-table3 th.grey, .gateway-table3 td.grey {
  background-color: #f1f1f1;
}
.gateway-table3 th {
  padding-top: 0.875rem;
}
.gateway-table4 th, .gateway-table4 td {
  vertical-align: top;
  background-color: #F0F0F7;
  border-bottom: 1px solid #ffffff;
  font-size: 0.813rem;
}
.gateway-table4 th.grey, .gateway-table4 td.grey {
  background-color: #f1f1f1;
}
.gateway-table4 th {
  padding-top: 0.750rem;
}
.cell_description {
  color: #808495;
}
.responsive-card-table {
  border-collapse: collapse;
}
.responsive-card-table.unstriped tbody {
  background-color: transparent;
}
.responsive-card-table th {
  background-color: #373737;
}
.responsive-card-table th {
  border: 1px solid #535252;
  color: #ffffff;
}
.responsive-card-table tr, .responsive-card-table td {
  border: 1px solid #F1F1F3;
}
/*.responsive-card-table tbody th, table tbody td {

  padding: 0.875rem 0.625rem 0.750rem 0.750rem;

}*/
.responsive-card-table td.status_pending {
  background-color: #8E24AA;
  color: #ffffff;
  text-transform: uppercase;
}
.responsive-card-table td.status_approved {
  background-color: #539633;
  color: #ffffff;
  text-transform: uppercase;
}
.responsive-card-table td.status_completed {
  background-color: #539633;
  color: #ffffff;
  text-transform: uppercase;
}
.responsive-card-table td.status_overdue {
  background-color: #d3414e;
  color: #ffffff;
  text-transform: uppercase;
}
.responsive-card-table td.status_active2day {
  background-color: #2196f3;
  color: #ffffff;
  text-transform: uppercase;
}
.responsive-card-table td.status_active1day {
  background-color: #D5962A;
  color: #ffffff;
  text-transform: uppercase;
}
.responsive-card-table td.status_inactive_course {
  background-color: #fcff31;
  color: #ffffff;
  text-transform: uppercase;
}
@media screen and (max-width: 845px) {
  .responsive-card-table {}
  .responsive-card-table thead tr {
    position: absolute;
    top: -9999em;
    left: -9999em;
  }
  .responsive-card-table tr {
    border: 1px solid #F1F1F3;
    display: block;
  }
  .responsive-card-table tr + tr {
    margin-top: 1.5rem;
  }
  .responsive-card-table td {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #f0f0f7;
    border-top: 1px solid #f0f0f7;
    border-right: 1px solid #f0f0f7;
    border-left: 1px solid #f0f0f7;
    padding-left: 50%;
    position: relative;
  }
  .responsive-card-table td:before {
    content: attr(data-label);
    display: inline-block;
    font-weight: bold;
    line-height: 1.5;
    margin-left: -100%;
    width: 100%;
    position: relative;
    z-index: 1;
    color: #373737;
    word-wrap: break-word;
  }
  .responsive-card-table td:after {
    content: '';
    position: absolute;
    /*background: #e6e6e6;*/
    width: 25%;
    height: 95%;
    left: 1px;
    top: 1px;
    z-index: 0;
  }
}
.gateway table {
  background: #ffffff;
  margin-bottom: 1.25rem;
  border-left: solid 0 #dddddd;
  border-right: solid 0 #dddddd;
  border-bottom: solid 1px #dddddd;
  border-top: solid 0 #dddddd;
  table-layout: auto;
}
.gateway table thead, .gateway table tfoot {
  background: #373737;
}
.gateway table thead tr th, .gateway table thead tr td, .gateway table tfoot tr th, .gateway table tfoot tr td {
  padding: 0.750rem 0 0.750rem 0.750rem;
  font-size: 0.750rem;
  font-family: bebas-neue-by-fontfabric, sans-serif;
  font-weight: 700;
  font-style: normal;
  color: #ffffff;
  text-align: left;
}
.gateway td.smaller {
  font-size: 0.75rem;
}
.gateway table tr th, .gateway table tr td {
  padding: 0.750rem 0 0.750rem 0.750rem;
  font-size: 0.750rem;
  text-align: left;
  color: #384656;
}
.gateway table ul li {
  font-size: 0.750rem;
}
a.tables {
  font-family: proxima-nova, sans-serif;
}
a.tables:visited {
  font-family: proxima-nova, sans-serif;
}
a.tables:hover {
  font-family: proxima-nova, sans-serif;
}
.bccsa_grey_tabletitle {
  background: #383a4d;
  color: #ffffff;
  font-weight: bold;
}
.bccsa_grey_tabletitle_upper {
  background: #646e71;
  color: #ffffff;
  font-weight: bold;
  text-transform: uppercase;
}
.bccsa_black_tabletitle {
  background: #373737;
  color: #ffffff;
  font-weight: bold;
}
.gateway td.white {
  background: #ffffff;
  text-align: center;
}
.gateway th.white {
  background: #ffffff;
  text-align: center;
}
.gateway th.small_text {
  font-size: 75%;
  font-weight: normal;
}
/* -------------------- F. HYPERLINKS -------------------- */
.source_link {
  font-size: 0.85em;
  color: #646e71;
  text-decoration: none;
}
.source_link a {
  color: #646e71;
}
.source_link a:hover {
  text-decoration: underline;
}
a.face {
  font-family: proxima-nova, sans-serif;
  color: #737c84;
}
a.face:hover {
  color: #595e62;
  text-decoration: none;
}
a.face2 {
  font-family: proxima-nova, sans-serif;
  color: #1878f1;
}
a.face2:hover {
  color: #1161c6;
  text-decoration: none;
}
a.twit {
  font-family: proxima-nova, sans-serif;
  color: #737c84;
}
a.twit:hover {
  color: #595e62;
  text-decoration: none;
}
a.twit2 {
  font-family: proxima-nova, sans-serif;
  color: #2aa4ef;
}
a.twit2:hover {
  color: #2182be;
  text-decoration: none;
}
a.yout {
  font-family: proxima-nova, sans-serif;
  color: #737c84;
}
a.yout:hover {
  color: #595e62;
  text-decoration: none;
}
a.linkedn {
  font-family: proxima-nova, sans-serif;
  color: #737c84;
}
a.linkedn:hover {
  color: #595e62;
  text-decoration: none;
}
a.mail {
  font-family: proxima-nova, sans-serif;
  color: #e47b35;
}
a.mail:hover {
  color: #c1672b;
  text-decoration: none;
}
a.title {
  color: #000000;
  font-family: proxima-nova, sans-serif;
}
a.title:hover {
  color: #0455A4;
  text-decoration: none;
}
a.title_alternate {
  color: #000000;
  font-family: bebas-neue-by-fontfabric, sans-serif;
}
a.title_alternate:hover {
  color: #0455A4;
  text-decoration: none;
}
.breadcrumbs a {
  color: #4968a9;
}
a {
  font-family: proxima-nova, sans-serif;
  font-size: 1.000em;
  color: #0455A4;
  text-decoration: none;
}
a:visited {
  text-decoration: none;
}
a:hover {
  color: #4968a9;
  text-decoration: underline;
}
a.regular {
  color: #4968a9;
}
a.regular:visited {
  text-decoration: none;
}
a.regular:hover {
  color: #4968a9;
}
a.bold {
  font-weight: bold;
}
a.faq:active {
  text-decoration: none;
  font-weight: bold;
  color: #384656;
}
a.faq[tabindex]:focus {
  text-decoration: none;
  font-weight: bold;
  color: #384656;
  outline: none;
}
a.faq_selected {
  text-decoration: none;
  font-weight: bold;
  color: #384656;
}
a.header_links {
  font-size: .875em;
  font-weight: bold;
  color: #F2F2F2;
}
a.header_links:hover {
  text-decoration: none;
  color: #D2D0D0;
}
.user_name_header_padding {
  padding-top: 1.50em;
}
a.user_name_header {
  font-size: .875em;
  font-weight: bold;
  color: #4A5259;
}
a.user_name_header:hover {
  text-decoration: none;
  color: #5E6871;
}
/*a.user_name_header:visited {



    font-weight: bold;



    color: #f26722;



}*/
a.highlight_link:link {
  font-weight: normal;
  color: #f26722;
}
a.highlight_link:hover {
  text-decoration: underline;
  font-weight: normal;
  color: #f26722;
}
a.highlight_link:visited {
  font-weight: normal;
  color: #f26722;
}
a.footer_links:link {
  /* color: #e6e6e6; */
  text-decoration: none;
}
a.footer_links:hover {
  text-decoration: underline;
}
a.footer_links:visited {
  /* color: #e6e6e6; */
  text-decoration: none;
}
a.top_header_links:link {
  color: #C9C5C6;
  font-size: 0.813em;
  font-weight: 500;
  text-decoration: none;
}
a.top_header_links:hover {
  color: #FFFFFF;
  font-size: 0.813em;
  font-weight: 500;
  text-decoration: underline;
}
a.top_header_links:visited {
  color: #C9C5C6;
  font-size: 0.813em;
  font-weight: 500;
  text-decoration: none;
}
a.small_links:link {
  font-size: 0.813em;
  text-decoration: none;
}
a.small_links:hover {
  text-decoration: underline;
}
/*a.small_links:visited {
  font-size: 80.0%;
  text-decoration: none;
}*/
a.small:link {
  font-size: 85.0%;
  text-decoration: none;
}
a.button.small:link {
  font-size: 0.750rem;
}
a.button.small:hover {
  font-size: 0.750rem;
}
.button.small {
  font-size: 0.85rem;
  padding: 0.4em 0.75em;
}
/*.button-group, .button + .button {
  margin-left: 0.5em;
}*/
.button.dropdown-toggle {
  white-space: nowrap;
}
.last_modified {
  font-size: 0.875rem;
  white-space: nowrap;
  color: #64748b;	
}
a.small:hover {
  font-size: 85.0%;
  text-decoration: none;
  color: #eeebeb;
}
a.small:visited {
  font-size: 85.0%;
  text-decoration: none;
}
a.small2:link {
  font-size: .750em;
  text-decoration: none;
  font-weight: normal;
}
a.small2:hover {
  font-size: .750em;
  text-decoration: none;
  color: #eeebeb;
  font-weight: normal;
}
a.small2:visited {
  font-size: .750em;
  text-decoration: none;
  font-weight: normal;
}
a.small3 {
  color: #C9C5C6;
  font-size: .750em;
  text-decoration: none;
  font-weight: normal;
  outline: none;
}
a.small3:hover {
  color: #ffffff;
  font-size: .750em;
  text-decoration: none;
  font-weight: normal;
  outline: none;
}
a.small3:focus {
  outline: none;
}
a.small_header_tool:link {
  font-size: .688em;
  text-decoration: none;
  font-weight: normal;
}
a.small_header_tool:hover {
  font-size: .688em;
  text-decoration: none;
  color: #667079;
  font-weight: normal;
}
a.small_header_tool:visited {
  font-size: .688em;
  text-decoration: none;
  font-weight: normal;
}
a.footer_link:link {
  font-family: arial, sans-serif;
  font-weight: bold;
  color: #4d4d4d;
}
a.footer_link:hover {
  text-decoration: underline;
  font-family: arial, sans-serif;
  font-weight: bold;
  color: #4d4d4d;
}
a.footer_link:visited {
  font-family: arial, sans-serif;
  font-weight: bold;
  color: #4d4d4d;
}
a.light_blue {
  color: #5178bc;
}
a.light_blue:hover {
  color: #ffffff;
  text-decoration: none;
}
a.grey_link {
  color: #667079;
  border: none;
  outline: none;
}
a.grey_link:hover {
  color: #484F55;
  text-decoration: underline;
}
/*a.light_blue:visited {

  color: #5178bc;

}*/
a.light_blue_lighter {
  color: #6399f7;
}
a.light_blue_lighter:hover {
  color: #ffffff;
  text-decoration: none;
}
a.white {
  color: #ffffff;
}
a.white:hover {
  color: #eeebeb;
}
a.blue_link:link {
  color: #6f9fc8;
}
a.blue_link:hover {
  color: #587fa0;
}
a.blue_link:visited {
  color: #6f9fc8;
}
/* -------------------- G. LABELS AND HIGHLIGHTS -------------------- */
label {
  font-size: 0.875rem;
}
label.question {
  font-size: 1rem;
}
label.sub_question {
  font-size: .875rem;
}
.label {
  display: inline-block;
  padding: 0.33333rem 0.5rem;
  border-radius: 0;
  font-size: 0.75rem;
  line-height: 1;
  white-space: nowrap;
  cursor: default;
  background: #2196f3;
  color: #fefefe;
}
.label.secondary {
  background: #e4e8ea;
  color: #5b6771;
  font-weight: normal;
  border: 0px solid #caced5;
  /*text-transform: uppercase;*/
  letter-spacing: .5px;
}
.label.approved {
  background: #539633;
  color: #ffffff;
  font-weight: bold;
  border: 1px solid #539633;
  /*text-transform: uppercase;*/
  letter-spacing: .5px;
}
.label.todo {
  background: #8e24aa;
  color: #ffffff;
  font-weight: bold;
  border: 1px solid #8e24aa;
  /*text-transform: uppercase;*/
  letter-spacing: .5px;
}
.label.new {
  background: #d3414e;
  color: #ffffff;
  font-weight: bold;
  border: 1px solid #d3414e;
  /*text-transform: uppercase;*/
  letter-spacing: .5px;
}
.label.active2day {
  background: #2196f3;
  color: #ffffff;
  font-weight: bold;
  border: 1px solid #2196f3;
  /*text-transform: uppercase;*/
  letter-spacing: .5px;
}
.label.active1day {
  background: #d5962a;
  color: #ffffff;
  font-weight: bold;
  border: 1px solid #d5962a;
  /*text-transform: uppercase;*/
  letter-spacing: .5px;
}
.label.change {
  background: #fff3d9;
  color: #d3414e;
  font-weight: 500;
  border: 0px solid #fff3d9;
  /*text-transform: uppercase;*/
  letter-spacing: .5px;
  /*margin-bottom: 0.425em;*/
}
.label.change_slider {
  background: #e43b3f;
  color: #ffffff;
  font-weight: 500;
  border: 0px solid #e43b3f;
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-right: 1em;
  padding: 0.5rem 0.75rem 0.5rem;
  box-shadow: 5px 5px #000000;
}
.label.received_pending {
  background: #fee624;
  color: #000000;
  font-weight: bold;
  border: 1px solid #fee624;
  /*text-transform: uppercase;*/
  letter-spacing: .5px;
}
.label.cancelled {
  background: #969ba4;
  color: #ffffff;
  font-weight: bold;
  border: 1px solid #969ba4;
  /*text-transform: uppercase;*/
  letter-spacing: .5px;
}
.label.basic {
  display: inline-block;
  padding: 0rem 0rem;
  border-radius: 0;
  font-size: 0.65rem;
  line-height: 1;
  white-space: nowrap;
  cursor: default;
  background: transparent;
  color: #7e7e7e;
  margin-left: .45rem;
}
.label.basic_red {
  display: inline-block;
  padding: 0rem 0rem;
  border-radius: 0;
  font-size: 0.65rem;
  line-height: 1;
  white-space: nowrap;
  cursor: default;
  background: transparent;
  color: #cc4438;
  margin-left: .45rem;
}
.label.category1 {
  background: #5576ba;
  color: #fefefe;
}
.label.category2 {
  background: #cc4438;
  color: #fefefe;
}
.label.major {
  background: #d33f4d;
  color: #fefefe;
  text-transform: uppercase;
}
.major_text {
  color: #d33f4d;
}
.moderate_text {
  color: #ffa500;
}
.minor_text {
  color: #8e24aa;
}
.label.moderate {
  background: #ffa500;
  color: #fefefe;
  text-transform: uppercase;
}
.label.minor {
  background: #8e24aa;
  color: #fefefe;
  text-transform: uppercase;
}
/* Add a lighter hover effect for each row type */
#summary_compliance .major-row {
  background-color: #ffffff !important; /* Lighter red for Major */
}
#summary_compliance .moderate-row {
  background-color: #ffffff !important; /* Lighter orange for Moderate */
}
#summary_compliance .minor-row {
  background-color: #ffffff !important; /* Lighter purple for Minor */
}
/* Override the striped effect for the specified rows */
#summary_compliance .major-row:hover {
  background-color: #fddede !important; /* Light red for Major */
}
#summary_compliance .moderate-row:hover {
  background-color: #ffe5cc !important; /* Light orange for Moderate */
}
#summary_compliance .minor-row:hover {
  background-color: #f2e6ff !important; /* Light purple for Minor */
}
/* Add a bottom border to each row */
#summary_compliance tbody tr {
  padding-top: .750em;
  border-bottom: 1px solid #f1f1f1; /* Light grey border to separate rows */
}
.label.category3 {
  background: #ffae00;
  color: #0a0a0a;
}
.label.category4 {
  background: #7e7e7e;
  color: #fefefe;
}
.input-group-label {
  padding: 0 1rem;
  border: 0px solid #cacaca;
  border-right-width: 0px;
  border-right-style: solid;
  border-right-color: rgb(202, 202, 202);
  background: transparent;
  color: #959595;
  text-align: center;
  white-space: nowrap;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  -ms-flex-align: center;
  align-items: center;
}
.input-group {
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  margin-bottom: 0;
  -ms-flex-align: stretch;
  align-items: stretch;
}
.circle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 9em; /* Circle size */
  height: 9em;
  border-radius: 50%;
  color: white;
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
  margin: 0 auto 1.25em auto; /* Centers the circle and adds space below it */
  padding: 1em; /* Padding inside the circle for better content spacing */
  position: relative; /* Needed for pseudo-elements */
  box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3), inset 0 0 10px rgba(0, 0, 0, 0.2); /* Outer shadow for depth, inner shadow for bevel */
  /*background: linear-gradient(145deg, #ffffff, #e6e6e6);*/ /* Light gradient to give a slight bevel appearance */
  border: 6px solid; /* Add a border/stroke */
}
.circle:after {
  content: '';
  position: absolute;
  top: 5%;
  left: 5%;
  right: 5%;
  bottom: 5%;
  border-radius: 50%;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
  pointer-events: none; /* Makes sure the pseudo-element doesn't interfere with interaction */
}
.major {
  background: linear-gradient(145deg, #d33f4d, #a82835); /* Darker red overall */
  border-color: #d33f4d; /* Stroke color close to the original major red */
}
.moderate {
  background: linear-gradient(145deg, #ffa500, #cc8400); /* Darker orange overall */
  border-color: #ffa500; /* Stroke color close to the original moderate orange */
}
.minor {
  background: linear-gradient(145deg, #8e24aa, #6d1c80); /* Darker purple overall */
  border-color: #8e24aa; /* Stroke color close to the original minor purple */
}
.circle div {
  margin: 0 0;
  line-height: 1.2;
  z-index: 1; /* Ensures text is above pseudo-elements */
}
.description {
  font-size: 1em;
  font-weight: normal;
  margin-top: 0.5em; /* Space between the circle and description */
  padding: 0 0.5em;
  text-align: center; /* Ensure the description is centered */
}
.count {
  font-size: 2.5em; /* Increased font size for the number */
  z-index: 1; /* Ensures the count is above the background */
}
.major_help {
  background-color: #d33f4d;
  color: #ffffff;
  font-weight: bold;
  padding: 0.5em;
}
.moderate_help {
  background-color: #ffa500;
  color: #ffffff;
  font-weight: bold;
  padding: 0.5em;
}
.minor_help {
  background-color: #8e24aa;
  color: #ffffff;
  font-weight: bold;
  padding: 0.5em;
}
/* -------------------- H. LINES AND DIVIDERS -------------------- */
.type-sidelines {
  display: block;
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
}
.type-sidelines span {
  display: inline-block;
  position: relative;
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.type-sidelines span:before, .type-sidelines span:after {
  content: '';
  position: absolute;
  height: 100%;
  width: 9999px;
  top: 50%;
  border-top-style: solid;
  border-top-width: 1px;
}
.type-sidelines span:before {
  right: 100%;
}
.type-sidelines span:after {
  left: 100%;
}
.double {
  display: block;
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
}
.double span {
  display: inline-block;
  position: relative;
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.double span:before, .double span:after {
  content: '';
  position: absolute;
  height: 100%;
  width: 9999px;
  top: 50%;
  border-top-style: solid;
  border-top-width: 1px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  height: 0.5em;
  margin-top: -0.25em;
}
.double span:before {
  right: 100%;
}
.double span:after {
  left: 100%;
}
.custom {
  display: block;
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
}
.custom span {
  display: inline-block;
  position: relative;
  padding-left: 20px;
  padding-right: 20px;
}
.custom span:before, .custom span:after {
  content: '';
  position: absolute;
  height: 100%;
  width: 100%;
  top: 50%;
  border-top-style: dotted;
  border-top-width: 4px;
  border-top-color: #000000;
  margin-top: -2px;
}
.custom span:before {
  right: 100%;
}
.custom span:after {
  left: 100%;
}
.custom-2 {
  display: block;
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
}
.custom-2 span {
  display: inline-block;
  position: relative;
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.custom-2 span:before, .custom-2 span:after {
  content: '';
  position: absolute;
  height: 100%;
  width: 9999px;
  top: 50%;
  border-top-style: solid;
  border-top-width: 6px;
  border-top-color: #e6e6e6;
  margin-top: -2px;
}
.custom-2 span:before {
  right: 100%;
}
.custom-2 span:after {
  left: 100%;
}
hr {
  clear: both;
  max-width: 100%;
  height: 0;
  margin: 1.25rem auto;
  border-top: 0;
  border-right: 0;
  border-bottom: 1px solid #e1e1e1;
  border-left: 0;
}
hr.separator {
  clear: both;
  max-width: 100%;
  height: 0;
  margin: 1.25rem auto;
  border-top: 0;
  border-right: 0;
  border-bottom: 1px solid #f0f0f7;
  border-left: 0;
}
hr.for_headers {
  margin-top: 0;
  margin-bottom: 1.25rem;
  margin-left: auto;
  margin-right: auto;
  border-bottom: 1px dotted #e1e1e1;
}
hr.for_posts {
  margin-top: .75rem;
  margin-bottom: .75rem;
  margin-left: auto;
  margin-right: auto;
  border-bottom: 1px solid #e1e1e1;
}
hr.black_footer {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #464461;
  margin: 1em 0;
  padding: 0;
}
hr.black_footer2 {
  display: block;
  height: 2px;
  border: 0;
  border-top: 2px solid #464461;
  margin: 1em 0;
  padding: 0;
}
hr.dotted {
  border-top: 1px dotted #999999;
  color: #fff;
  background-color: transparent;
  height: 1px;
  width: 100%;
  padding: 0px;
  margin-top: 4px;
}
hr.grey {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #eceaea;
  margin: 1em 0;
  padding: 5px;
}
hr.grey_thick {
  display: block;
  height: 2px;
  border: 0;
  border-top: 4px solid #707070;
  margin: 1em 0;
  padding: 0px;
}
hr.orange_thick {
  display: block;
  height: 2px;
  border: 0;
  border-top: 25px solid #ed7d31;
  margin: 1em 0;
  padding: 2px;
}
.icon_orange {
  color: #ed7d31;
}
.icon_purple {
  color: #8e24aa;
}
hr.light_grey_thick {
  display: block;
  height: 2px;
  border: 0;
  border-top: 25px solid #a5a5a5;
  margin: 1em 0;
  padding: 2px;
}
.icon_lightgrey {
  color: #636E7C;
}
hr.yellow_thick {
  display: block;
  height: 2px;
  border: 0;
  border-top: 25px solid #ffc000;
  margin: 1em 0;
  padding: 2px;
}
.icon_yellow {
  color: #f59e0b;
}
.icon_header_size {
  font-size: 1.75em;
}
hr.blue_thick {
  display: block;
  height: 2px;
  border: 0;
  border-top: 25px solid #5a9bd5;
  margin: 1em 0;
  padding: 2px;
}
hr.blue {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #1779ba;
  ;
  margin: 1em 0;
  padding: 5px;
}
.icon_blue {
  color: #1779ba;
}
.icon_darkblue {
  color: #244c5c;
}
.icon_black {
  color: #000000;
}
.icon_dark_grey {
  color: #4c565f;
}
hr.white {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ffffff;
  margin: 1em 0;
  padding: 0;
}
hr.white2 {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #e6e8ec;
  margin: .850em 0 1.5em;
  padding: 0;
}
hr.white_thin {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ffffff;
  margin: 0em 0;
  padding: 0;
}
hr.white_smaller {
  display: block;
  height: .5px;
  border: 0;
  border-top: .5px solid #ffffff;
  margin: .5em 0;
  padding: 0;
}
hr.footer_line {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #121418;
  margin: 1em 0;
  padding: 0;
}
div.no_space_top {
  padding: 0;
}
div.more_space_bottom {
  margin-bottom: 2.000em;
}
div.more_space_right {
  padding-right: 0.6875em;
}
div.more_space_bottom_little {
  margin-bottom: 1.000em;
}
div.no_margin_left ul li {
  margin-left: 0;
  margin-bottom: 0.625rem;
}
li.more_space_top_little {
  margin-top: 0.625rem;
}
div.margin_left ul li {
  margin-left: 1.125rem;
  /*margin-bottom: 0.625rem;*/
}
div.more_space_top, span.more_space_top {
  margin-top: 2.000em;
}
div.more_space_top_little, span.more_space_top_little {
  margin-top: 1.125em;
}
div.more_space_top_verylittle, span.more_space_top_verylittle {
  margin-top: .500em;
}
div.more_space_top_mediumlittle, span.more_space_medium_little {
  margin-top: 1.500em;
}
div.more_space_top_helpdiv {
  margin-top: -.750em;
}
span.more_space_left {
  padding-left: 1em;
}
div.field_titles, span.field_titles {
  font-weight: bold;
  text-transform: uppercase;
}
div.padding_div {
  padding: .750em 1.000em;
}
div.padding_div_verytop {
  padding-bottom: 1.125em;
}
i.more_padding_bottom {
  padding-top: .250em;
  padding-bottom: .375em;
}
div.padding_div_more {
  padding: 2em 3em;
}
div.padding_div_for_headers {
  padding-top: 1.250em;
  padding-left: .750em;
  padding-right: .750em;
  padding-bottom: .750em;
}
div.padding_div_for_notes {
  padding-left: .875em;
  padding-right: .875em;
  padding-top: .750em;
  padding-bottom: .750em;
}
.vertical_line {
  border-right: 1px solid #EBEBF2;
}
div.vertical_line_left {
  border-left: 1px solid #d0d0d0;
}
.hidden {
  display: none;
}
div.modal_bkg {
  /*background: #780006;*/
  background-image: url("../img/modal_background.png");
  background-repeat: repeat-x;
  background-color: #ffffff;
  background-position: left top;
}
.iframeModal {
  max-height: 80vh; /* Ensures the modal doesn't exceed 75% of the viewport height */
  overflow: auto; /* Allows scrolling if content is larger than modal */
}
.modalIframe {
  height: 80vh; /* Set iframe height to 75% of the viewport height */
}
div.modal_bkg_search {
  /*background: #780006;*/
  background-image: url("../img/modal_background_grey.png");
  background-repeat: repeat-x;
  background-color: #f5f5f5;
  background-position: left top;
}
/* -------------------- I. COLOURS -------------------- */
.event1_label {
  background-color: #d3414e;
  font-weight: normal;
  padding-left: 1.000em;
  padding-right: 1.000em;
  padding-top: .375em;
  padding-bottom: .375em;
  color: #ffffff;
}
.event2_label {
  background-color: #646f7c;
  font-weight: normal;
  padding-left: 1.000em;
  padding-right: 1.000em;
  padding-top: .375em;
  padding-bottom: .375em;
  color: #ffffff;
}
.event3_label {
  background-color: #539633;
  font-weight: normal;
  padding-left: 1.000em;
  padding-right: 1.000em;
  padding-top: .375em;
  padding-bottom: .375em;
  color: #ffffff;
}
.event4_label {
  background-color: #015f5f;
  font-weight: normal;
  padding-left: 1.000em;
  padding-right: 1.000em;
  padding-top: .375em;
  padding-bottom: .375em;
  color: #ffffff;
}
.event5_label {
  background-color: #c9c5c6;
  font-weight: normal;
  padding-left: 1.000em;
  padding-right: 1.000em;
  padding-top: .375em;
  padding-bottom: .375em;
  color: #2f2e2e;
}
.course_1day {
  background-color: #d5962a;
  font-weight: normal;
  padding-left: 1.000em;
  padding-right: 1.000em;
  padding-top: .375em;
  padding-bottom: .375em;
  color: #ffffff;
}
.course_2day {
  background-color: #2196f3;
  font-weight: normal;
  padding-left: 1.000em;
  padding-right: 1.000em;
  padding-top: .375em;
  padding-bottom: .375em;
  color: #ffffff;
}
.course_cancelled {
  background-color: #caced5;
  font-weight: normal;
  padding-left: 1.000em;
  padding-right: 1.000em;
  padding-top: .375em;
  padding-bottom: .375em;
  color: #667079;
}
.course_completed {
  background-color: #539633;
  font-weight: normal;
  padding-left: 1.000em;
  padding-right: 1.000em;
  padding-top: .375em;
  padding-bottom: .375em;
  color: #ffffff;
}
.course_requested {
  background-color: #8E24AA;
  font-weight: normal;
  padding-left: 1.000em;
  padding-right: 1.000em;
  padding-top: .375em;
  padding-bottom: .375em;
  color: #ffffff;
}
.white_text {
  color: #ffffff;
}
.grey_text_footer {
  color: #737c84;
}
.grey_text_alt {
  color: #a3a7aa;
}
.grey_text_header {
  color: #737c84;
}
.blue {
  color: #5576ba;
}
.grey_footer {
  background-color: #121418;
}
.blue_footer {
  background-color: #045d7b;
  border-top: solid 4px #035773;
}
.white_area {
  background-color: #ffffff;
}
.grey {
  color: #7e7e7e;
}
.bkg_colour_inside {
  background-color: #ffffff;
}
.bkg_red {
  /*background-color: #0455a4;*/
  background-image: linear-gradient(#d3414e, #a2323d);
}
.bkg_leftcol_grey {
  background: linear-gradient(180deg, #f9fafb, #f1f3f5);
  /*background-image: linear-gradient(#265061, #224756);*/
}
#qm1 div#leftcol_grey, #qm1 ul#leftcol_grey {
  background-color: #273337;
}
.bkg_blue {
  /*background-color: #0455a4;*/
  background-image: linear-gradient(#0455a4, #024a8f);
}
.bkg_blue_dark {
  /*background-color: #0455a4;*/
  background-image: linear-gradient(#03294D, #021C36);
}
.bkg_grey_darkest {
  /*background-color: #0455a4;*/
  background-image: linear-gradient(#ffffff, #f9f9f9);
}
.bkg_mobile_area {
  background-image: linear-gradient(#383a4d, #25252b);
}
.bkg_grey_dark {
  /*background-color: #0455a4;*/
  background-image: url("../img/BCCSA_SWOOSHES_light_grey.png");
  background-repeat: no-repeat;
  background-color: #ffffff;
  /*background-image: linear-gradient(#dadcdf, #ffffff);*/
  border-bottom: solid 1px #ffffff;
}
.bkg_swoosh_title {
  /*background-color: #0455a4;*/
  /*background-image: url("../img/bccsa_swooshes_lightgrey_title.jpg");*/
  /*background-repeat: no-repeat;*/
  background-color: #ffffff;
  background-image: linear-gradient(#ffffff, #f9f9f9);
}
.bkg_retro {
  background-color: #1e180a;
}
.light_grey {
  color: #f5f5f5;
}
.mid_grey {
  color: #e6e5e5;
}
.icon_red {
  color: #d3414e;
}
.text_red {
  color: #d3414e;
}
.icon_grey {
  color: #667079;
}
.icon_grey_light {
  color: #caced5;
}
.icon_grey_dark {
  color: #3f4c53;
}
.bkg_grey {
  background-color: #2d2d2d;
}
.bkg_lightest_grey {
  background-color: #eeeff1;
  ;
}
.icon_green {
  color: #539633;
}
.icon_padding {
  padding-right: .375em;
}
.icon_padding_more {
  padding-right: .500em;
}
.icon_padding_left {
  padding-left: .750em;
}
.green {
  color: #539633;
}
.icon_white {
  color: #ffffff;
}
.orange {
  color: #ba6109;
}
.orange2 {
  color: #ffad03;
}
.bccsa_red {
  color: #d33f4d;
}
.bccsa_grey {
  background: #646e71;
  color: #ffffff;
  font-weight: bold;
  padding-top: 0.625em;
  padding-bottom: 0.625em;
  padding-left: 2.500em;
  padding-right: 0em;
}
.yellow {
  color: #ffbb00;
}
.yellow_darker {
  color: #efcc69;
}
.red {
  color: #cc4438;
}
/* -------------------- J. FORMS AND VALIDATIONS -------------------- */
#constant_1 .ctct-form-embed .ctct-form-defaults .ctct-form-header {
  /*font: "proxima-nova", sans-serif;*/
  font-family: "proxima-nova", sans-serif;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  font-size: 1.25em;
  font-weight: 700;
  margin: 0 0 12px;
}
#constant_1 .ctct-form-embed .ctct-form-custom .ctct-form-label {
  display: block;
  margin-bottom: 12px;
  line-height: 1;
  font-weight: 700;
  text-align: left;
  font-family: "proxima-nova", sans-serif;
  font-size: .875em;
}
#constant_1 .ctct-form-embed.form_0 .ctct-form-custom .ctct-form-button {
  background-color: #035eb7;
  border: 1px solid #035eb7;
  color: #ffffff;
  font-family: "proxima-nova", sans-serif;
  font-weight: 900;
  transition: background-color 0.25s ease-out, color 0.25s ease-out;
}
#constant_1 .ctct-form-embed.form_0 .ctct-form-custom .ctct-form-button:hover {
  background-color: #0078c1;
}
#constant_1 .ctct-form-embed.form_0 .ctct-form-defaults {
  background-color: #ffffff;
  width: 100%;
}
#constant_1 .ctct-form-embed .ctct-form-defaults {
  color: #323232;
  background-color: #fff;
  border-radius: 5px;
  padding: 0px;
  font-family: "proxima-nova", sans-serif;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
#constant_1 .ctct-form-embed.form_0 .ctct-form-defaults .ctct-form-text, .ctct-form-embed.form_0 .ctct-form-custom .ctct-form-label, .ctct-form-embed.form_0 .ctct-form-custom .ctct-form-listname, .ctct-form-embed.form_0 .ctct-form-custom .ctct-form-lists-legend, .ctct-form-embed.form_0 .ctct-form-custom .ctct-form-date-slash, .ctct-form-embed.form_0 .ctct-form-defaults .ctct-gdpr-text, .ctct-form-embed.form_0 .ctct-form-defaults .ctct-gdpr-text .ctct-form-footer-link, .ctct-form-embed.form_0 .ctct-form-defaults .ctct-gdpr-text .ctct-form-footer-privacy-link {
  color: #1e1e1e;
  font-family: "proxima-nova", sans-serif;
}
/* CONTACT FORM 2 */
#constant_2 .ctct-form-embed.form_1 .ctct-form-defaults .ctct-form-header {
  /*font: "proxima-nova", sans-serif;*/
  font-family: "proxima-nova", sans-serif;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  font-size: 1.25em;
  font-weight: 700;
  margin: 0 0 12px;
}
#constant_2 .ctct-form-embed.form_1 .ctct-form-custom .ctct-form-button {
  background-color: #035eb7;
  border: 1px solid #035eb7;
  color: #ffffff;
  font-weight: 900;
  transition: background-color 0.25s ease-out, color 0.25s ease-out;
}
#constant_2 .ctct-form-embed.form_1 .ctct-form-custom .ctct-form-button:hover {
  background-color: #0078c1;
}
#constant_2 .ctct-form-embed.form_1 .ctct-form-custom .ctct-form-label {
  display: block;
  margin-bottom: 12px;
  line-height: 1;
  font-weight: 700;
  text-align: left;
  font-family: "proxima-nova", sans-serif;
  font-size: .875em;
}
#constant_2 .ctct-form-embed.form_1 .ctct-form-custom .ctct-form-button {
  background-color: #035eb7;
  border: 1px solid #035eb7;
  color: #ffffff;
}
#constant_2 .ctct-form-embed.form_1 .ctct-form-defaults {
  background-color: #ffffff;
  width: 100%;
}
#constant_2 .ctct-form-embed.form_1 .ctct-form-defaults {
  color: #323232;
  background-color: #fff;
  border-radius: 5px;
  padding: 0px;
  font-family: "proxima-nova", sans-serif;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
#constant_2 .ctct-form-embed.form_1 .ctct-form-defaults .ctct-form-text, .ctct-form-embed.form_1 .ctct-form-custom .ctct-form-label, .ctct-form-embed.form_1 .ctct-form-custom .ctct-form-listname, .ctct-form-embed.form_1 .ctct-form-custom .ctct-form-lists-legend, .ctct-form-embed.form_1 .ctct-form-custom .ctct-form-date-slash, .ctct-form-embed.form_1 .ctct-form-defaults .ctct-gdpr-text, .ctct-form-embed.form_1 .ctct-form-defaults .ctct-gdpr-text .ctct-form-footer-link, .ctct-form-embed.form_1 .ctct-form-defaults .ctct-gdpr-text .ctct-form-footer-privacy-link {
  color: #1e1e1e;
  font-family: "proxima-nova", sans-serif;
}
select {
  font-family: "proxima-nova", sans-serif;
}
select {
  height: 2.4375rem;
  margin: 0 0 1rem;
  padding: 0.5rem;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 1px solid #cacaca;
  border-radius: 0;
  background-color: #fefefe;
  font-family: inherit;
  font-size: 0.875rem;
  font-weight: normal;
  line-height: 1.5;
  color: #0a0a0a;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='32' height='24' viewBox='0 0 32 24'><polygon points='0,0 32,0 16,24' style='fill: rgb%28138, 138, 138%29'></polygon></svg>");
  background-origin: content-box;
  background-position: right -1rem center;
  background-repeat: no-repeat;
  background-size: 9px 6px;
  padding-right: 1.5rem;
  transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
}
input:checked ~ .switch-paddle {
  background: #539633;
}
.switch-paddle {
  background: #cbcbd1;
}
.wufoo input.text, .wufoo textarea.textarea, .wufoo input.file {
  font-family: 'proxima-nova';
}
.wufoo input.text, .wufoo textarea.textarea, .wufoo input.file, .wufoo select.select {
  font-style: normal;
  font-weight: 400;
  color: #333333;
  font-size: 100%;
}
.simple-subscription-form {
  width: 100%;
  padding: 2rem;
  border-radius: 0;
}
/* -------------------- K. V-CARDS -------------------- */
/* Resources */
.product-card {
  background-color: #ffffff;
  border: 1px solid #e6e6e6;
  padding: 1rem;
  margin-bottom: 1.5rem;
}
.product-card2 {
  background-color: #1779ba;
  border-top: 1px solid #222222;
  padding: 1rem;
  margin-bottom: 1.5rem;
}
.product-card2 .product-card-title a {
  color: #ffffff;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.45rem;
  margin-top: 1rem;
  margin-bottom: 0;
}
.product-card-thumbnail {
  display: block;
  position: relative;
}
.product-card-title {
  font-size: 1.0rem;
  font-weight: 600;
  line-height: 1.25rem;
  margin-top: 1rem;
  margin-bottom: 0;
}
.product-card-desc {
  color: #828990;
  display: block;
  font-size: 0.85rem;
}
.product-card-price {
  color: #222222;
  display: inline-block;
  font-size: 0.85rem;
  font-weight: 400;
  font-style: normal;
  margin-top: 0.8rem;
}
.product-card-price2 {
  color: #222222;
  display: inline-block;
  font-size: 0.85rem;
  font-weight: 400;
  font-style: normal;
  margin-top: 0rem;
}
.product-card-sale {
  color: #cacaca;
  display: inline-block;
  font-size: 0.85rem;
  margin-left: 0.3rem;
  text-decoration: line-through;
}
.product-card-colors {
  display: block;
  margin-top: 0.8rem;
}
.product-card-color-option {
  display: inline-block;
  height: 25px;
  width: 25px;
}
.post_reply .user-name {
  margin-top: .375em;
  margin-bottom: 0;
  /*font-family: prenton, sans-serif;*/
}
.post_reply .user-title {
  margin-bottom: 0;
  margin-top: -.375em;
  padding-bottom: 0;
  color: #43425D;
  font-size: 0.813em;
}
/* User Dropdown Header */
.user_dashboard_header .user-name {
  margin-top: .250em;
  margin-bottom: 0;
  /*font-family: prenton, sans-serif;*/
}
.user_dashboard_header .user-title {
  margin-bottom: 0;
  margin-top: -.375em;
  padding-bottom: 0;
  color: #43425D;
  font-size: 0.813em;
}
.notifications_dashboard_header .dropdown-name {
  margin-top: .250em;
  margin-bottom: 0;
  color: #262424;
  /*font-family: prenton, sans-serif;*/
}
.notifications_container {
  min-height: 300px;
  max-height: 650px;
  overflow-y: scroll;
}
.notifications_container::-webkit-scrollbar {
  width: 8px;
}
/* Track */
.notifications_container::-webkit-scrollbar-track {
  background: #F0F0F7;
}
/* Handle */
.notifications_container::-webkit-scrollbar-thumb {
  background: #a5a4a4;
}
/* Handle on hover */
.notifications_container::-webkit-scrollbar-thumb:hover {
  background: #555;
}
.user_dashboard_header {
  padding-bottom: 1.250em;
}
.notifications_dashboard_header {
  padding-bottom: .625em;
}
.user_dashboard_contents {
  /*padding-top: 1.000em;*/
  border-top: dotted 1px #cacaca;
  margin-bottom: 1.000em;
  /*padding: 0.875rem 1.125rem;	*/
}
.notification_dashboard_contents {
  /*padding-top: 1.000em;*/
  border-top: dotted 1px #cacaca;
  margin-bottom: 1.000em;
  /*padding: 0.875rem 1.125rem;	*/
}
.notification_course_contents {
  padding-top: 1.000em;
  border-bottom: dotted 0px #cacaca;
  margin-bottom: 1.000em;
  padding-bottom: 1.000em;
  /*padding: 0.875rem 1.125rem;*/
}
.user_dashboard_contents .link-title {
  font-size: 0.875em;
}
.user_course_contents .link-title {
  font-size: 0.875em;
}
.notification_dashboard_contents .notification-title {
  font-size: 0.875em;
}
.notification_course_contents .notification-title {
  font-size: 0.875em;
}
.notification_dashboard_contents .notification-title a.user {
  font-weight: bold;
  color: #1E1E1E;
}
.notification_course_contents .notification-title a.user {
  font-weight: bold;
  color: #1E1E1E;
}
.notification_dashboard_contents .notification-title a.noun {
  color: #1E1E1E;
}
.notification_course_contents .notification-title a.noun {
  color: #1E1E1E;
}
#notificationsTable a.noun {
  color: #1E1E1E;
}
.notification_dashboard_contents .notification-title a.subject {
  font-weight: bold;
}
.notification_course_contents .notification-title a.subject {
  font-weight: bold;
}
.notification_course_contents .notification-title a.more {
  font-size: 0.875em;
}
ul li a.edit {
  font-size: 0.875em;
}
.content_area_white ul li.smaller, .pricing-table ul li.smaller {
  font-size: 0.875em;
}
.small_div3 a.edit {
  font-size: 0.875em;
}
.user_dashboard_contents .link-description {
  margin-bottom: 0;
  color: #43425D;
  margin-top: -.375em;
  padding-bottom: 0;
  font-size: 0.813em;
}
.notification_dashboard_contents .notification-description {
  margin-bottom: 0;
  color: #808495;
  /*margin-top: -.250em;*/
  padding-bottom: 0;
  font-size: 0.750em;
}
.notification_course_contents .notification-description {
  margin-bottom: 0;
  padding-bottom: 1.000em;
  color: #808495;
  /*margin-top: -.250em;*/
  font-size: 0.750em;
}
.notification_course_contents .notification-description_larger {
  margin-bottom: 0;
  padding-bottom: 1.000em;
  color: #808495;
  /*margin-top: -.250em;*/
  font-size: 1.000em;
}
.notification_dashboard_contents .notification-description a {
  color: #808495;
}
.notification_course_contents .notification-description a {
  color: #808495;
}
.user_dashboard_contents li {
  background: #f7f7f7;
}
.notification_dashboard_contents li {
  background: #f7f7f7;
}
.notification_course_contents li {
  background: #ffffff;
}
.profile-card-action-icons {
  background-color: transparent;
  font-weight: 400;
  margin-bottom: 1.6rem;
  /*border-radius: 0.125rem;*/
}
.profile-card-action-icons .card-section {
  background-color: inherit;
  padding: 0.5rem 0 0;
}
.profile-card-action-icons .card-section .profile-card-header, .profile-card-action-icons .card-section .profile-card-about {
  /*border-bottom: 0.0625rem solid #cacaca;*/
  /*padding: 0.7rem 1rem;*/
}
.profile-card-action-icons .card-section .profile-card-header {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}
.profile-card-action-icons .card-section .profile-card-header .profile-card-avatar {
  margin-right: 0.5rem;
}
.profile-card-action-icons .card-section .profile-card-header .profile-card-avatar .avatar-image {
  border-radius: 50%;
  width: 3.75rem;
  height: 3.75rem;
}
.profile-card-action-icons .card-section .profile-card-header .profile-card-author {
  -webkit-flex: 1 0 0;
  -ms-flex: 1 0 0px;
  flex: 1 0 0;
  margin-top: 0.3rem;
  padding-bottom: 0;
}
.profile-card-action-icons .card-section .profile-card-header .profile-card-author .author-title, .profile-card-action-icons .card-section .profile-card-header .profile-card-author .author-description {
  margin-bottom: 0;
}
.profile-card-action-icons .card-section .profile-card-header .profile-card-author .author-title {
  color: #828990;
  padding-top: 0.375em;
  padding-bottom: 0;
}
.profile-card-action-icons .card-section .profile-card-header .profile-card-author .author-description {
  color: #828990;
  font-size: 0.813em;
}
.profile-card-action-icons .card-section .profile-card-about .about-title {
  text-transform: uppercase;
}
.profile-card-action-icons .card-section .profile-card-about .separator-left {
  text-align: left;
}
.profile-card-action-icons .card-section .profile-card-about .separator-left::before, .profile-card-action-icons .card-section .profile-card-about .separator-left::after {
  display: table;
  content: ' ';
  -webkit-flex-basis: 0;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
}
.profile-card-action-icons .card-section .profile-card-about .separator-left::after {
  clear: both;
}
.profile-card-action-icons .card-section .profile-card-about .separator-left::after {
  position: relative;
  width: 3rem;
  border-bottom: 0.125rem solid #1779ba;
  margin: 0.3rem auto 0;
  margin-left: 0;
}
.profile-card-action-icons .card-section .profile-card-about .about-content {
  margin-bottom: 0;
}
.profile-card-action-icons .card-section .profile-card-about .about-skills {
  margin-top: 0.6rem;
}
.profile-card-action-icons .card-section .profile-card-about .about-skills ul.arrow {
  list-style-type: none;
  padding-left: 0;
  margin-left: 0;
  margin-bottom: 0;
}
.profile-card-action-icons .card-section .profile-card-about .about-skills ul.arrow li:before {
  content: '\f006';
  font-family: 'FontAwesome';
  float: left;
  color: #1779ba;
  margin-right: 0.5rem;
}
.profile-card-action-icons .card-section .profile-card-action {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.profile-card-action-icons .card-section .profile-card-action .action-area {
  width: 20%;
  border-right: 0.0625rem solid #cacaca;
  text-align: center;
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
}
.profile-card-action-icons .card-section .profile-card-action .action-area:last-of-type {
  border-right: none;
}
.profile-card-action-icons .card-section .profile-card-action .action-area .action-anchor.has-tip {
  border-bottom: none;
  cursor: pointer;
}
.profile-card-action-icons .card-section .profile-card-action .action-area .action-anchor .fa {
  color: #1779ba;
}
/* END Profile Card with Action Icons */
.card-user-profile {
  position: relative;
  z-index: 0;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-bottom: 1rem;
  border: 1px solid rgba(216, 216, 216, 1);
  border-radius: 1;
  background: #f2f2f2;
  box-shadow: none;
  overflow: hidden;
  color: #0a0a0a;
  padding-bottom: 1.125rem;
}
.card-user-profile > :last-child {
  margin-bottom: 0;
}
.card-user-profile:hover .card-user-profile-img {
  opacity: 1;
}
.card-user-profile-content {
  position: relative;
}
.card-user-profile-content::before {
  position: absolute;
  content: '';
  top: -3.4375rem;
  left: -1.875rem;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 3.4375rem 0 0 31.25rem;
  z-index: 0;
  border-color: transparent transparent transparent #fefefe;
}
.card-user-profile-actions {
  -webkit-flex: 0 1 auto;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  padding: 1rem;
  background: #e6e6e6;
  background: #fefefe;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.card-user-profile-actions > :last-child {
  margin-bottom: 0;
}
.card-user-profile-img {
  max-width: 100%;
  opacity: 0.85;
  transition: all 0.25s ease;
}
.card-user-profile-avatar {
  position: absolute;
  bottom: 100%;
  left: 1rem;
  z-index: 2;
  max-width: 5.625rem;
}
.card-user-profile-avatar img {
  border-radius: 50%;
  box-shadow: 0 0 15px rgba(10, 10, 10, 0.3);
}
.card-user-profile-name {
  margin-top: 1.125em;
  margin-bottom: 1.125em;
  font-weight: bold;
  font-size: 1.25rem;
  text-transform: uppercase;
}
.card-user-profile-button {
  margin-bottom: 0;
  -webkit-flex: 1 0 0;
  -ms-flex: 1 0 0px;
  flex: 1 0 0;
}
.card-user-profile-button + .card-user-profile-button {
  margin-left: 1rem;
}
.card-user-profile-info {
  font-size: 0.875rem;
  letter-spacing: 1px;
  opacity: 0.8;
}
/*



=============================================== 05. BUTTON STYLES ===============================================



*/
/* -------------------- A. SINGLE BUTTONS -------------------- */
.button {
  background-color: #1473e6;
  transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}
button.radius, .button.radius {
  border-radius: 3px;
}
button.round, .button.round {
  border-radius: 1000px;
}
.button.primary {
    background: #1473e6;
    border: 1px solid #1473e6;
    color: #fff;
}
.button.primary:hover, .button.primary:focus {
  background-color: #0f54a7;
  color: #fefefe;
}
.button.red_button {
  background-color: #d3414e;
  color: #ffffff;
}
.button.red_button:hover, .button.red_button:focus {
  background-color: #a1303a;
  color: #fefefe;
}
.button.transparent_button {
  background-color: transparent;
  color: #ffffff;
}
.button.transparent_button:hover, .button.transparent_button:focus {
  background-color: transparent;
  color: #2b5c6f;
}
.button.secondary {
background: #fff;
    border: 2px solid #2563eb;
    color: #1f2937;
}
.button.secondary:hover, .button.secondary:focus {
  background-color: #e5e7eb;
  color: #111827; /* near black */
}
.button.secondary2 {
  background-color: #3a4148;
  color: #ffffff;
}
.button.secondary2:hover, .button.secondary2:focus {
  background-color: #4c565f;
  color: #fefefe;
}
.button.secondary3 {
  background: linear-gradient(rgba(230, 230, 230, 0.2), transparent);
  color: #000000;
  border: 0px solid transparent;
}
.button.secondary3:hover, .button.secondary3:focus {
  background-color: rgba(250, 250, 250, 0.7); /* Here, 0.7 is the opacity value (between 0 and 1) */
  color: #3a424e;
}
.button.secondary4 {
  background-color: rgba(241, 241, 241, 0.8);
  color: #000000;
  border: 0px solid transparent;
  border-left: 0px solid #e6e3e3;
}
.button.secondary4:hover, .button.secondary4:focus {
  background-color: rgba(241, 241, 241, 0.7); /* Here, 0.7 is the opacity value (between 0 and 1) */
  color: #3a424e;
}
.button.secondary5 {
  background-color: rgba(250, 250, 250, 0.8);
  color: #000000;
  border: 0px solid transparent;
  border-left: 0px solid #3a4148;
  padding: 0.7rem 0.673rem;
}
.button.secondary5:hover, .button.secondary5:focus {
  background-color: rgba(250, 250, 250, 0.7); /* Here, 0.7 is the opacity value (between 0 and 1) */
  color: #3a424e;
}
.button.accept {
  background-color: #539633;
  color: #ffffff;
}
.button.accept:hover, .button.accept:focus {
  background-color: #61B13B;
  color: #fefefe;
}
.button.decline {
  background-color: #d3414e;
  color: #ffffff;
}
.button.decline:hover, .button.decline:focus {
  background-color: #F44E5D;
  color: #fefefe;
}
.button.cancel {
  background-color: #e1e1e1;
  color: #7e7e7e;
  border: 0px solid #01573e;
}
.button.cancel:hover, .button.cancel:focus {
  background-color: #c8c7c7;
  color: #7e7e7e;
}
.button.secondary5 {
  background-color: #e1e1e1;
  color: #7e7e7e;
  border: 0px solid #01573e;
}
.button.secondary5:hover, .button.secondary5:focus {
  background-color: #c8c7c7;
  color: #7e7e7e;
}
.button.highlight {
  background-color: #214251;
  color: #ffffff;
  font-family: proxima-nova, sans-serif;
  font-weight: 700;
  border-radius: .625em;
  font-size: 1.125em;
  animation: pulseAnimation 2s infinite; /* Add this line */
}
.button.highlight:hover, .button.highlight:focus {
  background-color: #0455A4;
  color: #DADCDF;
  animation: none; /* Stop the animation when the button is hovered over or focused */
}
/* Define the keyframes for the pulsing animation */
@keyframes pulseAnimation {
  0%, 100% {
    background-color: #214251;
    color: #ffffff;
  }
  50% {
    background-color: #0455A4;
    color: #DADCDF;
  }
}
.button.highlight_alternate {
  padding-left: 1.875em;
  padding-right: 1.875em;
  background-color: #234A59;
  color: #ffffff;
  font-family: proxima-nova, sans-serif;
  font-weight: 600;
  line-height: 1.1em;
  font-size: 1.125em;
}
.button.highlight_alternate:hover, .button.highlight_alternate:focus {
  background-color: #2b5c6f;
  color: #DADCDF;
}
.button.highlight_alternate2 {
  padding-left: 1.875em;
  padding-right: 1.875em;
  background-color: #035eb7;
  color: #ffffff;
  font-family: proxima-nova, sans-serif;
  /*font-weight: 600;*/
  line-height: 1.1em;
  /*font-size: 1.125em;*/
}
.button.highlight_alternate2:hover, .button.highlight_alternate2:focus {
  background-color: #046ed5;
  color: #fefefe;
}
.minimum_height_button {
  min-height: 1.125em;
}
.button.tag {
  font-family: proxima-nova, sans-serif;
  vertical-align: center;
  margin: 0 0 1rem 0;
  padding: 0.85em .85em;
  -webkit-appearance: none;
  border: 0px solid #ccced0;
  border-radius: 0;
  transition: background-color 0.25s ease-out, color 0.25s ease-out;
  font-size: 0.938em;
  font-weight: 700;
  line-height: 1.45;
  text-align: left;
  cursor: pointer;
  background-color: #f3f5f9;
  color: #5379BD;
}
.button.tag:hover, .button.tag:focus {
  background-color: #fafafa;
  color: #0455A4;
}
.button.tag:hover {
  scale: 1.025;
}
.button.tag:focus {
  color: #4A5259;
}
a.tag_sublink {
  color: #5379BD;
  font-size: 0.813em;
  font-weight: 500;
}
a.tag_sublink:hover, a.tag_sublink:focus {
  font-size: 0.813em;
  font-weight: 500;
}
.bkg_tag_container {
  margin-top: -1em;
  background-color: #fafafa;
  padding-bottom: .150em;
}
.toggle-icon {
  color: #cacaca;
}
.long-dash {
  font-weight: bold;
  letter-spacing: -3px;
}
.button.tag_highlight {
  font-family: proxima-nova, sans-serif;
  vertical-align: center;
  margin: 0 0 1rem 0;
  padding: 0.85em .85em;
  -webkit-appearance: none;
  border: 0px solid #ccced0;
  transition: background-color 0.25s ease-out, color 0.25s ease-out;
  font-size: 0.875em;
  font-weight: 500;
  line-height: 1.45;
  text-align: left;
  cursor: pointer;
  background-color: #234A59;
  color: #ffffff;
  border-radius: 0;
}
.button.tag_highlight:hover, .button.tag_highlight:focus {
  background-color: #2b5c6f;
  color: #DADCDF;
  /*font-weight: 700;*/
}
.button.tag_highlight:hover {
  scale: 1.025;
}
.grid-padding-x_small > .cell {
  padding-right: 0.188rem;
  padding-left: 0.188rem;
}
.button.course_nav {
  background-color: #1e1e1e;
  ;
  color: #ffffff;
  font-weight: bold;
}
.button.course_nav:hover, .button.course_nav:focus {
  background-color: #135784;
  color: #fefefe;
}
.button.course_nav.dropdown::after {
  display: block;
  width: 0;
  height: 0;
  border: inset 0.4em;
  content: '';
  border-bottom-width: 0;
  border-top-style: solid;
  border-color: #fefefe transparent transparent;
  position: relative;
  top: 0.4em;
  display: inline-block;
  float: right;
  margin-left: 1em;
  margin-right: 1em;
}
.button.muted {
  background-color: #f2f2f2;
  color: #212529;
  font-size: .875em;
  border: 1px solid #dee2e6;
  line-height: 1.5;
}
.button.muted:hover, .button.muted:focus {
  background-color: #dfdfdf;
  color: #212529;
}
.button.muted_thin {
  background-color: #f2f2f2;
  color: #212529;
  font-size: .875em;
  border: 1px solid #dee2e6;
  line-height: .5;
}
.button.muted_thin:hover, .button.muted_thin:focus {
  background-color: #dfdfdf;
  color: #212529;
}
.button.muted_large {
  background-color: #f2f2f2;
  color: #212529;
  border: 1px solid #dee2e6;
}
.button.muted_large:hover, .button.muted_large:focus {
  background-color: #dfdfdf;
  color: #212529;
}
.button.success {
  background-color: #539633;
  color: #fefefe;
}
.button.success:hover, .button.success:focus {
  background-color: #3c7c31;
  color: #fefefe;
}
.button.save_continue {
  background-color: #539633;
  color: #fefefe;
  font-weight: 700;
}
.button.save_continue:hover, .button.save_continue:focus {
  background-color: #3c7c31;
  color: #fefefe;
}
.button.alert {
  background-color: #ba2d35;
  color: #fefefe;
}
.button.alert:hover, .button.alert:focus {
  background-color: #8a2227;
  color: #fefefe;
}
.simple-subscription-form .button {
  margin-bottom: 0;
  border-radius: 0 0 0 0;
}
.button.hollow.secondary:hover, .button.hollow.secondary:focus {
  border-color: #54656f;
  color: #ffffff;
  background-color: #539633;
}
.button.hollow.secondary:hover span, .button.hollow.secondary:focus span {
  color: #D1D1D1;
}
.button.hollow.secondary {
  border: 1px solid #ffffff;
  border-top-color: rgb(255, 255, 255);
  border-right-color: rgb(255, 255, 255);
  border-bottom-color: rgb(255, 255, 255);
  border-left-color: rgb(255, 255, 255);
  color: #ffffff;
  background-color: transparent;
  text-align: left;
}
.bkg_main_nav_cell {
  background-color: #f3f5f9;
  border: 3px solid #ffffff;
}
.button.main_nav:hover, .button.main_nav:focus {
  border-color: #2b5c6f;
  color: #c4d8df;
  background-color: #2b5c6f;
}
.button.main_nav:hover span, .button.main_nav:focus span {
  color: #d1d1d1;
}
.button.main_nav {
  border: 1px solid #ffffff;
  color: #ffffff;
  background-color: #234a59;
  text-align: center;
  border-radius: 8px;
  line-height: 1.35em;
  font-size: 1.063em;
}
span.button_span_lighter {
  font-size: 0.813em;
  color: #d1d1d1;
  font-weight: normal;
  line-height: 2em;
}
/* Header Alert button */
.button-badge {
  background-color: transparent;
  text-decoration: none;
  padding: .5rem 1rem;
  position: relative;
  display: inline-block;
  border-radius: .2rem;
  transition: all ease 0.4s;
}
/*.button-badge:hover {



      border: 1px solid #7e7e7e;



        border-top-color: rgb(126, 126, 126);



        border-right-color: rgb(126, 126, 126);



        border-bottom-color: rgb(126, 126, 126);



        border-left-color: rgb(126, 126, 126);	



}*/
.badge {
  background-color: transparent;
  margin-left: 1.5em;
  font-size: .625em;
  padding-left: .195em;
  font-weight: normal;
  min-width: 2.1em;
  /*margin-top: -2em;*/
}
.badge.left_notification {
  background: #d3414e;
  color: #ffffff;
}
.badge.content_notification {
  background: #e4e8ea;
  color: #5b6771;
  margin-left: .750em;
  font-weight: bold;
}
/* -------------------- B. BUTTON GROUPS -------------------- */
/* -------------------- C. SPLIT BUTTONS -------------------- */
/* -------------------- D. DROPDOWN BUTTONS -------------------- */
.dropdown.button, button.dropdown {
  position: relative;
  padding-right: 0rem;
}
.f-dropdown {
  position: absolute;
  left: -9999px;
  list-style: none;
  margin-left: 0;
  width: 100%;
  max-height: none;
  height: auto;
  background: white;
  border: solid 1px #dfe1e4;
  font-size: 0.750rem;
  z-index: 99;
  margin-top: 2px;
  max-width: 200px;
}
.f-dropdown.drop-right {
  position: absolute;
  left: -9999px;
  list-style: none;
  width: 100%;
  max-height: none;
  height: auto;
  background: white;
  border: solid 1px #dfe1e4;
  font-size: 0.750rem;
  z-index: 99;
  margin-top: 0;
  margin-left: 2px;
  max-width: 200px;
}
.f-dropdown.drop-left {
  position: absolute;
  left: -9999px;
  list-style: none;
  width: 100%;
  max-height: none;
  height: auto;
  background: white;
  border: solid 1px #dfe1e4;
  font-size: 0.750rem;
  z-index: 99;
  margin-top: 0;
  margin-left: -2px;
  max-width: 200px;
}
/*



=============================================== 06. CALLOUTS AND PROMPT STYLES ===============================================



*/
.callout.primary {
  background-color: #f2f2f2;
  color: #333333;
  border: 1px solid rgba(216, 216, 216, 1);
}
.callout.log_in {
  background-color: #eeeff1;
  color: #333333;
  border: 0px solid rgba(216, 216, 216, 1);
}
.callout.major_callout {
  background-color: #d33f4d;
  color: #fefefe;
  border: 0px solid rgba(216, 216, 216, 1);
  font-weight: bold;
}
.callout.moderate_callout {
  background-color: #ffa500;
  color: #fefefe;
  border: 0px solid rgba(216, 216, 216, 1);
  font-weight: bold;
}
.callout.minor_callout {
  background-color: #8e24aa;
  color: #fefefe;
  border: 0px solid rgba(216, 216, 216, 1);
  font-weight: bold;
}
.callout.medium {
  padding-top: 2.250rem;
  padding-right: 1.75rem;
  padding-bottom: 2.250rem;
  padding-left: 1.75rem;
}
.callout.information {
  background-color: #54656f;
  background-image: linear-gradient(#54656f, #2d383e);
  border: .375em solid #2d383e;
}
.callout.information p {
  color: #ffffff;
  /*font-weight: 500;*/
}
.callout.information p a, .callout.information ul.menu li a {
  color: #8EB2F3;
  /*font-weight: 500;*/
  text-decoration: none;
}
.callout.information p a:hover, .callout.information ul.menu li a:hover {
  color: #ffffff;
  /*font-weight: 500;*/
  text-decoration: none;
}
.callout.information ul.menu li a {
  padding-top: .375em;
  padding-left: 0px;
  padding-right: 1.750em;
}
.middle_container {
  margin: auto;
  width: 85%;
}
.media_border {
  border: 10px solid #ffffff;
  border-radius: 0;
  background: #ffffff;
  box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%);
}
.callout.success {
  background-color: #dde9d8;
  color: #0a0a0a;
}
.callout.warning {
  background-color: #efefef;
  background-image: linear-gradient(#efefef, #ffffff);
  color: #1e1e1e;
  font-size: .938em;
  line-height: 1.6;
}
.callout.transparent_background2 {
  background-color: transparent;
  border: 0px solid rgba(236, 238, 241, 1);
  padding-top: 0em;
  padding-bottom: 0em;
  padding-left: 0em;
  padding-right: 0em;
}
.callout.transparent_background3 {
  background-color: transparent;
  border: 0px solid rgba(236, 238, 241, 1);
}
.callout.transparent_background {
  background-color: transparent;
  border: 0px solid rgba(236, 238, 241, 1);
  padding-top: 0em;
  padding-bottom: 0em;
  padding-left: 3.625em;
  padding-right: 3.625em;
}
.callout.transparent_background4 {
  background-color: transparent;
  border: 0px solid rgba(236, 238, 241, 1);
  padding-top: 2.5em;
  padding-bottom: 2.5em;
  padding-left: 1.75em;
  padding-right: 1.75em;
}
.callout.transparent_background5 {
  background-color: transparent;
  border: 0px solid rgba(236, 238, 241, 1);
  padding-top: .750em;
  padding-bottom: 2.00em;
  padding-left: 2.00em;
  padding-right: 2.00em;
}
.callout.transparent_background6 {
  background-color: transparent;
  border: 0px solid rgba(236, 238, 241, 1);
  padding-top: .875em;
  padding-bottom: .875em;
  padding-left: 2.375em;
  padding-right: 2.375em;
}
.callout.transparent_background_sub {
  background-color: transparent;
  border: 0px solid rgba(236, 238, 241, 1);
  padding-top: .875em;
  padding-bottom: .875em;
  padding-left: 0px;
  padding-right: 0px;
}
.callout.slide_out {
  color: #333333;
  padding-top: 25px;
  border-bottom: 0px solid #ffffff;
  background-color: #eaeaea;
  /*background-image: url('../img/bkg_slide_out.png');*/
  /*background-repeat: no-repeat;*/
}
.callout.primary_solid {
  background-color: #F0F0F7;
  color: #373737;
  border: 1px solid rgba(202, 206, 213, 1);
  border-style: solid;
  padding-top: 1.5em;
  padding-left: 1.5em;
  padding-right: 1.5em;
  padding-bottom: 1.5em;
  margin-top: .875em;
  margin-bottom: .875em;
}
.callout.post_reply {
  background-color: #F0F0F7;
  color: #373737;
  border: 0px solid rgba(202, 206, 213, 1);
  border-style: solid;
  padding-top: 1.5em;
  padding-left: 1.5em;
  padding-right: 1.5em;
  padding-bottom: 1.5em;
  margin-top: .875em;
  margin-bottom: .875em;
}
.callout.roc_background {
  background-color: #F0F0F7;
  background-image: url('../img/bkg_roc2.png');
  background-repeat: no-repeat;
  color: #373737;
  border: 1px solid rgba(202, 206, 213, 1);
  border-style: solid;
  padding-top: 1.5em;
  padding-left: 1.5em;
  padding-right: 1.5em;
  padding-bottom: 1.5em;
  margin-top: .875em;
  margin-bottom: .875em;
}
.callout.roc_background_white_border {
  background-color: #F0F0F7;
  background-image: url('../img/bkg_roc3.png');
  background-repeat: no-repeat;
  color: #373737;
  border: 1px solid rgba(255, 255, 255, 1);
  border-style: solid;
  padding-top: 1.5em;
  padding-left: 1.5em;
  padding-right: 1.5em;
  padding-bottom: 1.5em;
  margin-top: .875em;
  margin-bottom: .875em;
}
.callout.post_reply_user {
  background-color: #e3e3ec;
  color: #373737;
  border: 0px solid rgba(202, 206, 213, 1);
  border-style: solid;
  padding-top: 1.5em;
  padding-left: 1.5em;
  padding-right: 1.5em;
  padding-bottom: 1.5em;
  margin-top: .875em;
  margin-bottom: .875em;
}
.callout.post_container {
  background-color: #ffffff;
  border: 1px solid rgba(225, 225, 225, 1);
  padding-top: 2.625em;
  padding-left: 1.500em;
  padding-right: 1.500em;
  padding-bottom: 2.625em;
  border-radius: 0;
}
.post_container li {
  color: #1e1e1e;
}
.question-container {
  display: flex;
  align-items: flex-start; /* Align icon with the top of the question text */
}
.question-text {
  flex-grow: 1;
  margin-right: 10px;
}
.radio-container {
  display: block; /* Stacks radio buttons below the question */
  margin-top: 10px; /* Space between question text and radio buttons */
  margin-left: 30px; /* Adjust this value to align with the question text */
}
.radio-container input[type="radio"] {
  margin-right: 5px;
}
.question-container i {
  margin-right: 10px; /* Adds space between the icon and question text */
  align-self: flex-start; /* Align the icon to the top of the text */
  margin-top: 4px; /* Slightly lower the icon */
}
@media screen and (max-width: 768px) {
  .radio-container {
    margin-left: 15px; /* Reduce left margin on smaller screens if needed */
  }
}
.callout.poster_in_post {
  background-color: #f5f5f5;
  color: #4d4d4d;
  border: 1px solid rgba(225, 225, 225, 1);
}
.callout.benefits {
  background-color: #ECE1DE;
  color: #202124;
  border: 0px solid rgba(225, 225, 225, 1);
}
.bkg_highlighted {
  background-image: url('../img/bkg_content_callout.png');
  background-repeat: no-repeat;
  background-position: left bottom;
}
.bkg_highlighted_light {
  background-image: url('../img/bkg_content_callout_light.png');
  background-repeat: no-repeat;
  background-position: left bottom;
}
.bkg_highlighted_content {
  background-image: url('../img/bkg_content_callout_lighter.png');
  background-repeat: no-repeat;
  background-position: left bottom;
}
span.text_highlight {
  color: #d33f4d;
  font-weight: bold;
}
.bkg_leftcol {
  background: linear-gradient(180deg, #f9fafb, #f1f3f5);
}
.callout_max {
  max-width: 45.000em;
}
.leftbar_max {
  max-width: 25%;
}
.callout.testimonial {
  background-color: transparent;
  color: #ffffff;
  border: 0px solid rgba(236, 238, 241, 1);
  padding-top: 0em;
  padding-bottom: 0em;
  padding-left: 3.625em;
  padding-right: 3.625em;
}
.callout.secondary {
  background-color: #ffffff;
  border: 0px solid rgba(225, 225, 225, 1);
  margin-top: 0.625em;
  margin-bottom: 0em;
  padding-top: 2.625em;
  padding-left: 2.625em;
  padding-right: 2.625em;
  padding-bottom: 2.625em;
  border-radius: 0;
}
.callout.secondary2 {
  background-color: #ffffff;
  border: 1px solid rgba(225, 225, 225, 1);
  padding-top: 2.625em;
  padding-left: 2.625em;
  padding-right: 2.625em;
  padding-bottom: 2.625em;
  border-radius: 0;
}
.callout.grey_callout {
  background-color: #eeeff1;
  border: 1px solid rgba(225, 225, 225, 1);
  margin-top: 2.699em;
  margin-bottom: 2.625em;
  padding-top: 2.625em;
  padding-left: 2.625em;
  padding-right: 2.625em;
  padding-bottom: 2.625em;
  border-radius: 0;
  color: #0a0a0a;
}
.callout.white_callout {
  background-color: #ffffff;
  border: 0px solid rgba(0, 0, 0, 1);
  margin-top: 0em;
  margin-bottom: 0em;
  padding-top: 0.500em;
  padding-left: 0.500em;
  padding-right: 0.500em;
  padding-bottom: 0.500em;
  border-radius: 0;
  color: #43425D;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.card_radius {
  border-radius: 45px;
}
.callout {
  position: relative;
  margin: 0 0 0 0;
  padding: .750rem;
  border: 0px solid rgba(10, 10, 10, 0.25);
  border-radius: 0;
  background-color: white;
  color: #0a0a0a;
}
.callout_header {
  position: relative;
  margin: 0 0 0 0;
  padding: 1rem;
  border: 0px solid rgba(10, 10, 10, 0.25);
  border-radius: 0;
  background-color: #1c1918;
  color: #0a0a0a;
}
.callout.page_leftbar {
  background-color: #f2f2f2;
  color: #333333;
  border: 0px solid rgba(216, 216, 216, 1);
}
/* -------------------- A. MODALS -------------------- */
/*.reveal.modal_bkg {
  position: fixed; 
  top: 375px;      
  left: 50%;       
  transform: translateX(-50%); 
  z-index: 1050;   
}*/
/*.reveal-modal-bg {
  z-index: 99 !important;
}*/
/*.reveal {
  z-index: 1006;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  display: none;
  padding: 2.5rem;
  border: 1px solid #fe1e1e1;
  border-radius: 0;
  background-color: #ffffff;
  position: relative;
  top: 250px;
  margin-right: auto;
  margin-left: auto;
  overflow-y: auto;
}*/
/*.reveal-overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1005;
  display: none;
  background-color: rgba(10, 10, 10, 0.85);
  overflow-y: scroll;
}*/
/* -------------------- B. ALERTS AND FIELD SETS -------------------- */
fieldset {
  border: 1px solid #DDDDDD;
  background: #ffffff;
  padding: 1.25rem;
  margin: 1.125rem 0;
}
fieldset.grey_field {
  border: 1px solid #e5e7eb;
  background: #f8fafc;
  padding: 1.5rem;
  border-width: 1px 1px 1px 1px;
  margin: 1.125rem 0;
}
fieldset.grey {
  border: 1px solid #a6a6a6;
  background: #F2F2F3;
  padding: 1.5rem;
  border-width: 1px 1px 1px 1px;
  margin: 1.125rem 0;
}
fieldset legend {
  font-weight: bold;
  background: #ffffff;
  color: #27303c;
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  padding-left: 1rem;
  padding-right: 1rem;
  margin: 0;
  margin-left: -0.1875rem;
}
fieldset legend.colour {
  font-size: .875em;
  font-weight: bold;
  background: #383a4d;
  color: #ffffff;
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  padding-left: 1rem;
  padding-right: 1rem;
  margin: 0;
  margin-left: -0.1875rem;
}
.long_checkboxes [type='file'], .long_checkboxes [type='checkbox'], .long_checkboxes [type='radio'] {
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 1;
}
.long_checkboxes label {
  display: block;
  padding-right: 10px;
  padding-left: 22px;
  text-indent: -22px;
  line-height: 1.5;
}
.long_checkboxes input {
  vertical-align: top;
}
.long_checkboxes label span {
  vertical-align: top;
  cursor: text;
}
.long_checkboxes input[type=checkbox] + span {
  font-weight: normal;
}
.long_checkboxes input[type=checkbox]:checked + span {
  font-weight: bold;
  color: #333;
}
.long_checkboxes_larger label {
  display: block;
  padding-right: 10px;
  padding-left: 22px;
  text-indent: -22px;
  line-height: 1.5;
}
.long_checkboxes_larger input {
  vertical-align: top;
}
.long_checkboxes_larger label span {
  vertical-align: top;
  cursor: text;
  font-size: 1.125em;
}
.long_checkboxes_larger input[type=checkbox] + span {
  font-weight: normal;
}
.long_checkboxes_larger input[type=checkbox]:checked + span {
  font-weight: bold;
}
.checkboxFormatted {
  display: inline-block;
  vertical-align: top;
  padding-left: 25px;
  position: relative;
  font-size: .875em;
  font-weight: normal;
  width: 100%;
  cursor: text;
}
.checkboxFormatted input {
  position: absolute;
  left: 0;
  top: .438em;
}
/* -------------------- C. PANELS, DIVISIONS AND SPANS -------------------- */
.upload-container {
  background: white;
  padding: 1.5em;
  border-radius: 0.625em;
  box-shadow: 0 0 0.625em rgba(0, 0, 0, 0.1);
  text-align: center;
  width: 22em;
}
.upload-btn {
  margin-top: 0.75em;
  padding: 0.75em 1em;
  font-size: .875em;
}
.file-input {
  display: none;
}
.logo-preview {
  margin-top: 1em;
  max-width: 3.75em;
  height: auto;
  border-radius: 0.3125em;
  /* Initially hidden */
  display: none;
  /* Centering */
  /*  margin-left: auto;*/
  /*  margin-right: auto;*/
}
div.content_area {
  padding-top: 0em;
  padding-right: 1.875em;
  padding-bottom: 1.563em;
  padding-left: 1.875em;
}
div.content_area_inside {
  margin-top: 0;
  padding-top: 1.563em;
  padding-right: 1.563em;
  padding-bottom: 1.563em;
  padding-left: 1.563em;
  background-color: #ffffff;
}
div.max_area_constrained {
  max-width: 45.313em;
}
div.nav_area {
  padding-top: 2.625em;
  padding-right: 0px;
  padding-left: 1.75em;
  /*background-color: #fafafa;*/
}
div.more_padding_left {
  padding-left: 1rem;
}
div.padding_left_little {
  padding-left: .375rem;
}
div.more_padding_right {
  padding-right: 1.75rem;
}
div.alot_more_padding {
  padding: 1.750em;
}
div.even_more_padding_left {
  padding-left: 1.50rem;
}
span.main_content_notification {
  color: #D3414E;
  margin-left: .563em;
  font-size: .938em;
}
span.green_notification {
  color: #539633;
  font-weight: bold;
  font-size: 1.125em;
  margin-right: .625em;
}
.highlight_text {
  background-image: url('../img/highlighter_yellow.png');
  background-repeat: no-repeat;
  background-position: center;
}
span.sub_heading {
  font-size: 0.750em;
  font-family: proxima-nova, sans-serif;
  color: #818285;
  font-weight: 500;
  line-height: 0.750em;
}
div.main_title {
  padding-left: 1rem;
  color: #ffffff;
}
div.main_title a {
  color: #ffffff;
  font-size: 1.75em;
  font-family: "proxima-nova-extra-condensed", sans-serif;
  font-weight: 700;
  font-style: normal;
  padding: 0 0;
}
div.main_title a:hover {
  color: #C9C5C6;
  text-decoration: none;
}
div.main_subtitle {
  padding-left: 1rem;
  padding-top: 0.375rem;
  color: #C9C5C6;
  font-weight: bold;
  font-size: 1em;
}
span.alias {
  font-size: 0.750em;
  font-family: proxima-nova, sans-serif;
  color: #818285;
  font-weight: 500;
}
span.modal_title, div.modal_title {
  color: #231f20;
  position: absolute;
  top: 0.625em;
  left: .875em;
  font-size: 1em;
  font-weight: bold;
}
div.modal_title_background {
  background-color: #234A59;
  padding-left: 25px;
}
div.modal_title_background_darker {
  background-color: #01233F;
  padding-left: 25px;
}
div.sub_heading2 {
  font-size: 1em;
  font-family: proxima-nova, sans-serif;
  text-transform: uppercase;
  color: #A88751;
  font-weight: 500;
  line-height: 1.25em;
  margin-bottom: 1em;
}
div.sub_heading_larger {
  font-size: 1em;
  font-family: proxima-nova, sans-serif;
  text-transform: uppercase;
  color: #A88751;
  font-weight: 700;
  line-height: 1.5em;
  margin-bottom: 1em;
}
div.sub_heading3 {
  font-size: 0.75em;
  font-family: proxima-nova, sans-serif;
  text-transform: uppercase;
  color: #D0A45D;
  font-weight: 500;
  padding-top: .938em;
}
div.featured_heading {
  font-size: .938em;
  font-family: proxima-nova, sans-serif;
  color: #FA6980;
  font-weight: 600;
  line-height: 1.125em;
  padding-top: .063em;
  padding-bottom: .063em;
}
div.featured_sub_heading {
  font-size: 0.750em;
  font-family: "proxima-nova", sans-serif;
  color: #ffffff;
  font-weight: 500;
  padding-top: 1.000em;
}
/* Center divs at small; left or right on medium and large */
.leftdiv, .centerdiv, .rightdiv {
  text-align: center;
}
@media only screen and (min-width: 641px) {
  .leftdiv {
    text-align: left;
  }
  .rightdiv {
    text-align: right;
  }
}
div.large_div {
  font-size: 1.375em;
}
div.large_div2 {
  padding-top: .625em;
  padding-bottom: .375em;
  font-size: 1.125em;
}
div.description2 {
  padding-bottom: .625em;
}
div.small_text {
  font-size: 0.750em;
  padding: 5px;
  line-height: 1.6;
}
div.small_div, span.small_div {
  font-size: 0.875em;
  white-space: nowrap;
  padding-top: 0.500em;	
}
div.small_div2 {
  color: #737376;
  font-size: 0.875em;
}
div.small_div3, span.small_div3 {
  padding-top: 0.500em;
  font-size: 0.875em;
}
div.small_div4 {
  font-size: 0.750em;
  font-weight: normal;
}
div.small_div5 {
  font-size: 0.750em;
  font-weight: normal;
  line-height: 1.1;
}
div.small_div12 {
  /*padding-top: 0.375em;*/
  font-size: 85.0%;
}
div.small_div10 {
  padding-top: 0.125em;
  font-size: 0.625em;
}
span.icon_span {
  font-size: 0.813em;
  color: #9DA8B1;
  font-weight: normal;
}
span.button_span {
  font-size: 0.813em;
  color: #9DA8B1;
  font-weight: normal;
  line-height: 2em;
}
span.button_span_darker {
  font-size: 0.813em;
  color: #848e96;
  font-weight: normal;
  line-height: 2em;
}
span.new_span {
  font-size: 0.813em;
  color: #E43B3F;
  font-weight: normal;
  padding-left: 0.625em;
}
div.new_span {
  font-size: 0.813em;
  color: #E43B3F;
  font-weight: normal;
  padding-left: 0;
}
span.new_span_dark {
  font-size: 0.813em;
  color: #4c565f;
  font-weight: bold;
  padding-left: 0.625em;
  font-style: italic;
}
span.new_span_slider {
  font-size: 0.813em;
  color: #ffad03;
  font-weight: normal;
  padding-left: 0.500em;
}
sup.slider_sup {
  top: -0.25em;
}
span.icon_span_darker {
  font-size: 0.813em;
  color: #7f878e;
  font-weight: normal;
}
span.icon_span_lighter {
  font-size: 0.813em;
  color: #C1C1C1;
  font-weight: normal;
}
span.price_small {
  font-size: 0.625em;
  color: #1c1918;
  font-weight: normal;
}
.more_space_top {
  margin-top: 1.063em;
}
.little_space_top {
  margin-top: 0.875em;
}

a.top_space {
margin-top: 0.875em;	
}


.content_title_header {
  color: #ffffff;
  font-weight: bold;
  background-color: #01233F;
  padding: .625em 1.125em .625em 1.125em;
  /*border-bottom: .313em solid #01325a;*/
}
.content_title_header_table {
  color: #ffffff;
  font-weight: bold;
  background-color: #D3414E;
  padding: .625em 0 .313em 0.625em;
  border-bottom: .313em solid #8E2E37;
}
.content_subtitle_header {
  color: #ffffff;
  font-weight: bold;
  font-size: 0.875em;
  background-color: #373737;
  padding: .625em 0 .313em 1.313em;
}
.content_area_white {
  color: #373737;
  font-weight: normal;
  font-size: .875em;
  background-color: #FFFFFF;
  padding-top: 0;
  padding-bottom: .313em;
  padding-left: .313em;
  padding-right: .313em;
}
.content_area_white_table {
  color: #373737;
  font-weight: normal;
  font-size: 0.938em;
  background-color: transparent;
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
}
.content_area_white ul li {
  /*padding-top: 1.000em;*/
  padding-bottom: .313em;
}
.content_area_white a {
  /*padding-top: 1.000em;*/
  font-size: 0.938em;
}
.content_area_white ul li.divider_space {
  padding-top: 1.000em;
  padding-bottom: .313em;
}
.content_area_white ul li.divider_space_little {
  padding-top: .625em;
}
/* -------------------- D. TOOL TIPS -------------------- */
.has-tip {
  border-bottom: dotted 0px #CCCCCC;
  cursor: text;
  font-weight: normal;
  color: #646e71;
}
.has-tip:hover, .has-tip:focus {
  border-bottom: dotted 1px #CCCCCC;
  color: #333333;
}
/* Style the tooltip background */
.tooltip {
  border-top: solid 4px #25252b;
  background-color: #383a4d !important; /* Light grey */
  color: #c9c5be !important; /* Dark text */
  max-width: 325px;
}
/* Optional: Style the tooltip arrow */
.tooltip:before {
  border-color: #383a4d transparent transparent transparent !important;
}
/* Style the links inside the tooltip */
.tooltip a {
  color: #ffffff !important;
  text-decoration: none; /* Remove underline */
}
/* Optionally add a hover effect for the link */
.tooltip a:hover {
  text-decoration: underline; /* Underline on hover */
}
/*.tooltip {
  display: none;
  position: absolute;
  z-index: 1006;
  font-weight: normal;
  font-size: 0.750rem;
  line-height: 1.3;
  padding: 0.75rem;
  max-width: 200px;
  left: 50%;
  width: 100%;
  color: #FFFFFF;
  background: #0a0a0a;
}*/
/*span.tooltip_text {
  font-size: 0.875em;
  color: #4968a9;
  font-weight: normal;
  text-decoration: none;
  padding-left: 1.875em;
}*/
/* -------------------- E. JOYRIDES -------------------- */
/* -------------------- F. PRICING TABLES -------------------- */
.pricing-table {
  background-color: #fefefe;
  border: solid 0px #cacaca;
  width: 100%;
  text-align: left;
  list-style-type: none;
  padding: 0;
}
.pricing-table2 {
  background-color: #ffffff;
  border: solid 0px #cacaca;
  width: 100%;
  text-align: left;
  list-style-type: none;
  padding: 0;
}
.pricing-table li {
  border-bottom: dotted 1px #cacaca;
  padding: 0.875rem 1.125rem;
}
.pricing-table2 li {
  border-bottom: dotted 1px #cacaca;
  padding: 0.875rem 0rem;
}
.pricing-table li:last-child {
  border-bottom: 0;
}
.pricing-table2 li:last-child {
  border-bottom: 0;
}
.pricing-table .title {
  background-color: #0a0a0a;
  color: #fefefe;
  border-bottom: 0;
}
.pricing-table .price {
  background-color: #e6e6e6;
  font-size: 2rem;
  border-bottom: 0;
}
.pricing-table2 .price {
  background-color: #e6e6e6;
  font-size: 2rem;
  border-bottom: 0;
}
.pricing-table .description {
  color: #8a8a8a;
  font-size: 80%;
}
.pricing-table2 .description {
  color: #8a8a8a;
  font-size: 80%;
}
.pricing-table :last-child {
  margin-bottom: 0;
}
.pricing-table2 :last-child {
  margin-bottom: 0;
}
.pricing-table .button {
  color: #fefefe;
}
.pricing-table2 .button {
  color: #fefefe;
}
/*



=============================================== 07. IMAGE AND MEDIA STYLES ===============================================



*/
.image_max_height {
  max-height: 9.125em;
}
.logo_header {
  max-height: 9.125em;
  padding-bottom: 0.625em;
}
.img-swap {
  cursor: pointer;
  padding-bottom: 0.625em;
}
/* -------------------- A. THUMBNAILS -------------------- */
.subcontractor_thumbnail {
  width: 100px; /* Adjust the width as needed */
  height: auto; /* Maintains aspect ratio */
  display: block; /* Ensures proper layout */
}
.product_thumbnail img {
  display: block;
  height: 100%;
}
.product_thumbnail img.portrait {
  width: 100%;
  height: auto;
}
.tcp_photo_thumbnail {
  position: relative;
  width: 40px;
  height: 40px;
  overflow: hidden;
}
.tcp_photo_thumbnail img {
  position: absolute;
  left: 50%;
  top: 50%;
  height: 100%;
  width: auto;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.tcp_photo_thumbnail img.portrait {
  width: 100%;
  height: auto;
}
.user_photo_thumbnail {
  position: relative;
  width: 40px;
  height: 40px;
  overflow: hidden;
}
.user_photo_thumbnail img {
  position: absolute;
  left: 50%;
  top: 50%;
  height: 100%;
  width: auto;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.user_photo_thumbnail img.portrait {
  width: 100%;
  height: auto;
}
.user_photo_larger {
  position: relative;
  width: 65px;
  height: 65px;
  overflow: hidden;
}
.user_photo_larger img {
  position: absolute;
  left: 50%;
  top: 50%;
  height: 100%;
  width: auto;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.user_photo_larger img.portrait {
  width: 100%;
  height: auto;
}
.photo_width {
  max-width: 100px;
}
.photo_width_small {
  max-width: 6.250em;
}
.photo_width_medium {
  max-width: 15.625em;
}
.photo_width_large {
  max-width: 28.125em;
}
.image_max_height {
  max-height: 9.125em;
  /* min-height: 9.125em; */
  display: block;
  margin: auto;
}
/* -------------------- B. SLIDERS -------------------- */
.orbit-container {
  /*vertical-align: bottom;*/
  border: 10px solid #ffffff;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
ul.orbit-container li {
  display: inline-block;
}
.orbit-container_testimonial {
  /*vertical-align: bottom;*/
  border: 0px solid #ffffff;
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.19);
  background-color: #d3414e;
  background-image: linear-gradient(#d3414e, #942f38);
  padding-top: .750em;
  padding-left: 3.000em;
  padding-right: 3.000em;
  padding-bottom: 2.500em;
  margin: 1.500em auto;
  margin-bottom: 2.500em;
  text-align: center;
  color: #fff;
}
ul.orbit-container_testimonial li {
  display: inline-block;
}
.orbit-bullets {
  /*position: relative;*/
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
  text-align: center;
}
.orbit-bullets button {
  width: .5rem;
  height: .5rem;
  margin: 0.1rem;
  border-radius: 50%;
  background-color: #ffffff;
}
.orbit-bullets button:hover {
  background-color: #999999;
}
.orbit-bullets button.is-active {
  background-color: #E43B3F;
}
/* Slide animation */
.offset-header {
  font-family: bebas-neue-by-fontfabric, sans-serif;
  font-style: normal;
  font-weight: 700;
  color: #ffffff;
  line-height: 1em;
  /*letter-spacing: -0.02em;*/
  max-width: 100%;
}
span.offset-header {
  display: block;
  overflow: hidden;
}
span.offset-header > span {
  animation-name: slideUp;
  animation-duration: 1.5s;
  animation-timing-function: ease-in;
  display: block;
}
.offset-header-odd > span {
  text-align: center;
  animation-delay: 0s;
  animation-fill-mode: forwards;
  margin: 0 .375em;
}
.offset-header-even > span {
  text-align: center;
  animation-delay: 100ms;
  animation-fill-mode: both;
  color: #fefefe;
  font-size: .438em;
  font-family: proxima-nova, sans-serif;
  font-weight: 500;
  font-style: normal;
  margin: 0 .625em;
  line-height: 1em;
  padding-bottom: .625em;
}
@keyframes slideUp {
  0%, 50% {
    transform: translateX(100%);
    opacity: 0;
  }
  60%, 100% {
    transform: translateX(0);
    opacity: 1;
  }
}
/* Callout animation */
.offset-header-callout {
  font-family: bebas-neue-by-fontfabric, sans-serif;
  font-style: normal;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.25em;
  /*letter-spacing: -0.02em;*/
  max-width: 100%;
}
span.offset-header-callout {
  display: block;
  overflow: hidden;
}
span.offset-header-callout > span {
  animation-name: slideUp;
  animation-duration: 2s;
  animation-timing-function: ease-in;
  display: block;
}
.offset-header-callout-odd > span {
  text-align: left;
  animation-delay: 0s;
  animation-fill-mode: forwards;
  margin: 0 0;
}
.offset-header-callout-even > span {
  text-align: center;
  animation-delay: 150ms;
  animation-fill-mode: both;
  color: #fefefe;
  font-size: .438em;
  font-family: proxima-nova, sans-serif;
  font-weight: 500;
  font-style: normal;
  margin: 0 .625em;
}
@keyframes slideUp {
  0%, 50% {
    transform: translateX(100%);
    opacity: 0;
  }
  60%, 100% {
    transform: translateX(0);
    opacity: 1;
  }
}
/*orbit-wrapper {

	

}*/
.orbit-caption {
  position: absolute; /*it was absolute... but would shrink on 2nd to last slide */
  bottom: 0;
  width: 100%;
  /*margin-bottom: 0;*/
  /*padding-left: 2rem;*/
  /*padding-right: 2rem;*/
  padding-top: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-bottom: 2rem;
  /*background-color: rgba(18, 21, 23, 0.8);*/
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, .75));
  color: #fefefe;
  text-align: left;
  border-top: solid 1px #666666;
  /*min-height: 4.75em;*/
  /*font-size: 2.25em;*/
  /*font-family: bebas-neue-by-fontfabric, sans-serif;*/
  /*font-weight: 700;*/
  /*font-style: normal;*/
}
/*.orbit-caption span, .orbit-caption div {

    color: #fefefe;

	text-align: left;

	font-size: .625em;

	padding-top: 0px;

	padding-bottom: 0px;

	line-height: 1em;

	font-family: proxima-nova, sans-serif;

font-weight: 500;

font-style: normal;

}*/
/*.orbit-container .orbit-slides-container > * .orbit-caption {

  background-color: #0D0D0D;

  color: #FFFFFF;

  width: 100%;

  font-size: 0.875rem;

}*/
.orbit-previous, .orbit-next {
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 1;
  padding: 1rem;
  color: #fefefe;
  cursor: pointer;
}
.orbit-previous:hover, .orbit-next:hover {
  background-color: rgba(0, 0, 0, 0.7);
}
div.slide1_bkg {
  background-color: #ffffff;
  background-image: url('../img/bkg_slide1.jpg');
  background-repeat: repeat-x;
  height: 295px;
  width: 1334px;
  border-top: solid 4px #ffffff;
}
div.slide2_bkg {
  background-color: #ffffff;
  background-image: url('../img/bkg_slide2.jpg');
  background-repeat: repeat-x;
  height: 295px;
  width: 1334px;
  border-top: solid 4px #ffffff;
}
div.slide3_bkg {
  background-color: #ffffff;
  background-image: url('../img/bkg_slide3.jpg');
  background-repeat: repeat-x;
  height: 295px;
  width: 1334px;
  border-top: solid 4px #ffffff;
}
div.slide4_bkg {
  background-color: #ffffff;
  background-image: url('../img/bkg_slide4.jpg');
  background-repeat: repeat-x;
  height: 295px;
  width: 1334px;
  border-top: solid 4px #ffffff;
}
div.slide5_bkg {
  background-color: #ffffff;
  background-image: url('../img/bkg_slide5.jpg');
  background-repeat: repeat-x;
  height: 295px;
  width: 1334px;
  border-top: solid 4px #ffffff;
}
div.slide6_bkg {
  background-color: #ffffff;
  background-image: url('../img/bkg_slide6.jpg');
  background-repeat: repeat-x;
  height: 295px;
  width: 1334px;
  border-top: solid 4px #ffffff;
}
.panel_slider_large {
  width: 38%;
  float: left;
  background-image: url('../img/bkg_slider_panel.jpg');
  -ms-transform: rotate(-2deg); /* IE 9 */
  -webkit-transform: rotate(-2deg); /* Chrome, Safari, Opera */
  transform: rotate(-2deg);
  margin-left: 0.938em;
  margin-top: 1.250em;
}
.panel_slider_medium {
  width: 65%;
  float: left;
  background-image: url('../img/bkg_slider_panel.jpg');
  -ms-transform: rotate(-2deg); /* IE 9 */
  -webkit-transform: rotate(-2deg); /* Chrome, Safari, Opera */
  transform: rotate(-2deg);
  margin-left: 0.938em;
  margin-top: 1.875em;
}
.panel_slider_small {
  width: 100%;
  height: 100%;
  float: left;
  background-color: #ededed;
  margin-left: 0em;
  margin-top: 0em;
  border-width: 0px;
  border-bottom: 1px solid #d0d0d0;
}
/* -------------------- C. IFRAME -------------------- */
iframe {
  overflow: hidden;
}
/* -------------------- D. BACKGROUND IMAGE -------------------- */
img.bg {
  /* Set rules to fill background */
  min-height: 100%;
  min-width: 1024px;
  /* Set up proportionate scaling */
  width: 100%;
  height: auto;
  /* Set up positioning */
  position: fixed;
  top: 0;
  left: 0;
}
@media screen and (max-width: 1024px) { /* Specific to this particular image */
  img.bg {
    left: 50%;
    margin-left: -512px; /* 50% */
  }
}
img.bg_inside {
  /* Set rules to fill background */
  min-height: 100%;
  min-width: 1024px;
  /* Set up proportionate scaling */
  width: 100%;
  height: auto;
  /* Set up positioning */
  position: fixed;
  top: 0;
  left: 0;
}
.video_border {
  border: 0.375em dotted #09152f;
}
.stopfade {
  opacity: .95;
}
.strikeout {
  //font-size: 4em;
  line-height: 1em;
  position: relative;
}
.strikeout::after {
  border-bottom: 0.125em solid red;
  content: "";
  left: 0;
  margin-top: calc(0.125em / 2 * -1);
  position: absolute;
  right: 0;
  top: 50%;
}
/* --- Org cards for empty-state dashboard --- */
.section-intro {
  font-size: 1.125rem;
  margin: 0 0 .25rem;
}
.section-subintro {
  color: #6b7280;
  margin: 0 0 1rem;
}
.org-card {
  background: #fff;
  border: 1px solid #e6e6e6;
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .05);
  padding: 1.25rem;
}
.org-card__title {
  margin: 0 0 .75rem;
}
.org-card__label {
  font-weight: 600;
  margin-top: .25rem;
}
.org-card__divider {
  border-top: 1px dashed #e5e7eb;
  margin: 1rem 0;
}
.org-card__quick {
  margin-top: .5rem;
}
.org-card__quick-title {
  font-size: .875rem;
  color: #6b7280;
  margin-bottom: .25rem;
}
.access-code-group .input-group {
  margin-bottom: .25rem;
}
.empty-state {
  color: #6b7280;
  background: #f9fafb;
  border: 1px dashed #e5e7eb;
  border-radius: 6px;
  padding: .75rem 1rem;
  margin: .4rem 0 1rem;
}
.logout-link {
  color: #6b7280;
  font-size: .875rem;
}
@media (max-width: 639.98px) {
  .org-card {
    padding: 1rem;
  }
}
/* ===== Dashboard: Org chooser (scoped) ===== */
.org-chooser {
  --brand: #1473e6;
  --brand-600: #1e40af;
  --ink: #0f172a;
  --muted: #6b7280;
  --ctl-h: 52px; /* default control height */
  --ctl-h-sm: 46px; /* compact control height */
  --pad-x: 14px; /* field/label horizontal padding */
  --btn-pad-x: 16px; /* button horizontal padding */
  --radius: 12px;
}
/* Base containment + reset to kill inherited paddings */
.org-chooser .input-group, .org-chooser .input-group *, .org-chooser .button {
  box-sizing: border-box;
}
/* Access hero */
.org-chooser .access-hero {
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
}
.org-chooser .access-hero__title {
  margin: 0 0 .5rem;
  display: flex;
  gap: .5rem;
  align-items: center;
}
.org-chooser .form-hint {
  margin: .875rem 0 0;
  color: #6b7280;
  font-size: .9rem;
}
.org-chooser .form-hint code {
  background: #eef2ff;
  padding: .1rem .35rem;
  border-radius: 4px;
}
/* Input groups: elevated, touch-friendly, accessible */
.org-chooser .input-hero.input-group, .org-chooser .input-compact.input-group {
  border: 1px solid #d1d5db;
  border-radius: var(--radius);
  overflow: hidden;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .02);
  transition: box-shadow .15s ease, border-color .15s ease;
}
.org-chooser .input-hero .input-group-field, .org-chooser .input-compact .input-group-field {
  height: var(--ctl-h);
  font-size: 1rem;
  margin: 0;
  padding: 0 var(--pad-x) !important;
  border: 0 !important;
  box-shadow: none !important;
  line-height: calc(var(--ctl-h) - 2px);
}
.org-chooser .input-compact .input-group-field {
  height: var(--ctl-h-sm);
  line-height: calc(var(--ctl-h-sm) - 2px);
}
.org-chooser .input-group .input-group-label {
  height: var(--ctl-h);
  padding: 0 var(--pad-x) !important;
  border: 0;
  background: transparent;
  display: inline-flex;
  align-items: center;
  color: #475569;
  font-size: 1rem;
}
.org-chooser .input-compact .input-group-label {
  height: var(--ctl-h-sm);
}
.org-chooser .input-group .input-group-label i {
  width: 1.25em;
  text-align: center;
}
.org-chooser .input-group .input-group-button .button {
  height: var(--ctl-h) !important;
  line-height: calc(var(--ctl-h) - 2px) !important;
  padding: 0 var(--btn-pad-x) !important;
  margin: 0 !important;
  border: 0;
  border-left: 1px solid #d1d5db;
  border-radius: 0;
}
.org-chooser .input-compact .input-group-button .button {
  height: var(--ctl-h-sm) !important;
  line-height: calc(var(--ctl-h-sm) - 2px) !important;
}
/* Focus ring across the whole group */
.org-chooser .input-group:focus-within {
  border-color: var(--brand) !important;
  box-shadow: 0 0 0 3px rgba(29, 78, 216, .15);
}
/* Buttons: primary / secondary / ghost */
.org-chooser .button.btn--primary {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
}
.org-chooser .button.btn--primary:hover, .org-chooser .button.btn--primary:focus {
  background: var(--brand-600);
  border-color: var(--brand-600);
}
.org-chooser .button.btn--secondary {
  background: #ffffff;
  color: #0455A4;
  border-color: #ffffff;
}
.org-chooser .button.btn--secondary:hover, .org-chooser .button.btn--secondary:focus {
   background: var(--brand);
  border-color: var(--brand);
  box-shadow: inset 0 0 0 1px #a8aeb8;
  color: #fff;	
}
.org-chooser .button.btn--ghost {
  background: #fff;
  color: var(--ink);
  border-color: #d1d5db;
}
.org-chooser .button.btn--ghost:hover, .org-chooser .button.btn--ghost:focus {
  border-color: #a8aeb8;
  box-shadow: inset 0 0 0 1px #a8aeb8;
}
.org-chooser .button[disabled], .org-chooser .button:disabled {
  opacity: .55;
  cursor: not-allowed;
}
/* Normalize standalone card buttons */
.org-chooser .button.btn--primary, .org-chooser .button.btn--secondary, .org-chooser .button.btn--ghost {
  height: var(--ctl-h) !important;
  line-height: calc(var(--ctl-h) - 2px) !important;
  padding: 0 var(--btn-pad-x) !important;
  border-radius: 10px !important;
}
/* Org cards */
.org-chooser .org-card {
  background: #fff;
  border: 1px solid #e6e6e6;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .05);
  padding: 1.25rem;
}
.org-chooser .org-card__title {
  margin: 0 0 .35rem;
  display: flex;
  gap: .6rem;
  align-items: center;
}
.org-chooser .org-helper {
  color: #6b7280;
  margin: 0 0 .8rem;
}
.org-chooser .org-card__label {
  font-weight: 600;
  margin-top: .25rem;
}
.org-chooser .org-card__footer {
  margin-top: 1rem;
  display: flex;
  gap: .75rem;
  align-items: center;
  flex-wrap: wrap;
}
.org-chooser .org-footnote {
  margin: 0;
  color: #6b7280;
  font-size: .9rem;
}
/* Let cards fill the equalized height and push footer down */
/*.org-chooser .org-card {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}*/
.org-chooser .org-card__footer {
  margin-top: auto; /* footer sits at the bottom */
}
.org-chooser .empty-state {
  color: #6b7280;
  background: #f9fafb;
  border: 1px dashed #e5e7eb;
  border-radius: 8px;
  padding: .75rem 1rem;
  margin: .4rem 0 1rem;
}
/* Pending invites & continue banner (optional) */
.org-chooser .pending-invites {
  background: #fdfdfd;
  border: 1px solid #f1f5f9;
  border-radius: 12px;
}
.org-chooser .pending-invites h5 {
  margin: 0 0 .5rem;
}
.org-chooser .invite-list li {
  display: flex;
  gap: .5rem;
  align-items: center;
  padding: .25rem 0;
}
.org-chooser .invite-list .button.tiny {
  padding: .35rem .6rem !important;
  height: auto !important;
  line-height: normal !important;
}
.org-chooser .continue-banner {
  display: block;
  padding: .9rem 1rem;
  border: 1px solid #dbe2f2;
  border-radius: 10px;
  background: #eef3fb;
  color: #1e293b;
  text-decoration: none;
}
.org-chooser .continue-banner:hover {
  background: #dbe2f2;
}
.org-chooser .logout-link {
  color: #6b7280;
  font-size: .9rem;
}
/* Responsive tweaks */
@media (max-width:639.98px) {
  .org-chooser .org-card {
    padding: 1rem;
  }
  .org-chooser .input-hero .input-group-field {
    font-size: 1rem;
  }
}
/* Styled SELECT in input-group style */
.org-chooser .select-group {
  position: relative;
  display: flex;
  align-items: stretch;
  border: 1px solid #d1d5db;
  border-radius: var(--radius);
  overflow: hidden;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .02);
  transition: box-shadow .15s ease, border-color .15s ease;
}
.org-chooser .select-group:focus-within {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(29, 78, 216, .15);
}
/* Left icon chunk matches other inputs */
.org-chooser .select-group .input-group-label {
  height: var(--ctl-h-sm);
  padding: 0 var(--pad-x) !important;
  border: 0;
  background: transparent;
  display: inline-flex;
  align-items: center;
  color: #475569;
}
/* The SELECT itself */
.org-chooser .select-group select {
  flex: 1 1 auto;
  height: var(--ctl-h-sm);
  padding: 0 calc(var(--pad-x) + 20px) 0 var(--pad-x);
  margin: 0;
  border: 0;
  outline: 0;
  font: inherit;
  color: var(--ink);
  background: transparent;
  line-height: calc(var(--ctl-h-sm) - 2px);
  /* normalize native arrows */
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: none;
}
.org-chooser .select-group select:focus {
  outline: none;
}
/* Hide old Edge/IE chevron */
.org-chooser .select-group select::-ms-expand {
  display: none;
}
/* Custom chevron */
.org-chooser .select-group::after {
  content: "";
  position: absolute;
  right: calc(56px); /* width of the group button zone */
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid #64748b; /* slate-ish */
}
/* The button chunk on the right */
.org-chooser .select-group .input-group-button .button {
  height: var(--ctl-h-sm) !important;
  line-height: calc(var(--ctl-h-sm) - 2px) !important;
  padding: 0 var(--btn-pad-x) !important;
  margin: 0 !important;
  border: 0;
  border-left: 1px solid #d1d5db;
  border-radius: 0;
}
/* kill the group-level chevron */
.org-chooser .select-group::after {
  content: none;
}
.org-chooser .select-group select {
  /* keep your existing rules… then add: */
  background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'>\
<path d='M1 1l4 4 4-4' fill='none' stroke='%2364748b' stroke-width='1.5' \
stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat;
  background-position: right 12px center; /* arrow padding */
  background-size: 10px 6px;
  padding-right: calc(var(--pad-x) + 24px); /* room for arrow */
}
/* Footer stacks: button on top, note underneath */
.org-chooser .org-card__footer {
  display: block;
  margin-top: 1rem;
}
.org-chooser .org-card__footer .button {
  display: inline-flex;
  margin-bottom: .5rem; /* space above the footnote */
}
/* Stronger separation between body and footer */
.org-chooser .org-card__divider {
  border: 0;
  border-top: 1px solid #e5e7eb; /* solid, subtle */
  margin: 1rem 0;
}
.subtle-lede {
  color: #6b7280;
  margin: .25rem 0 1rem;
}
.org-chooser .org-card__divider {
  border: 0;
  border-top: 1px solid #e5e7eb;
  margin: 1rem 0;
}
.subtle-lede-bold {
  color: #6b7280;
  margin: .25rem 0 0;
  font-weight: 700;
}
.org-chooser .org-card__divider {
  border: 0;
  border-top: 1px solid #e5e7eb;
  margin: 1rem 0;
}
/* Clear button → subtle pill */
.org-chooser .recent-orgs__clear {
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding: 0 .75rem;
  border: 1px solid #d1d5db;
  border-radius: 999px;
  background: #fff;
  color: #475569;
  text-decoration: none;
  font-size: .85rem;
  line-height: 30px;
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.org-chooser .recent-orgs__clear:hover {
  background: #f9fafb;
  border-color: #a8aeb8;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .03);
}
.org-chooser .recent-orgs__clear:focus-visible {
  outline: 2px solid rgba(29, 78, 216, .35);
  outline-offset: 2px;
}
/* More spacing between company chips */
.org-chooser .recent-orgs__chips {
  display: flex;
  flex-wrap: wrap;
  column-gap: .75rem; /* horizontal spacing */
  row-gap: .65rem; /* vertical spacing when wrapping */
}
/* Slightly roomier chips + accessible focus */
.org-chooser .chip {
  padding: .45rem .75rem;
}
.org-chooser .chip:focus-visible {
  outline: 2px solid rgba(29, 78, 216, .35);
  outline-offset: 2px;
  border-color: #93c5fd;
}
/* Keep "Clear" inline next to the title */
.org-chooser .recent-orgs__head {
  display: flex;
  align-items: center;
  justify-content: flex-start; /* was space-between */
  gap: .5rem;
  flex-wrap: nowrap; /* keep on one line */
  margin-bottom: .5rem;
}
/* Let the title truncate instead of wrapping Clear */
.org-chooser .recent-orgs__head h5 {
  margin: 0;
  display: flex;
  align-items: center;
  gap: .5rem;
  flex: 1 1 auto;
  min-width: 0; /* enables ellipsis */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Clear button stays visible and sized by content */
.org-chooser .recent-orgs__clear {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding: 0 .75rem;
  border: 1px solid #d1d5db;
  border-radius: 999px;
  background: #fff;
  color: #475569;
  text-decoration: none;
  font-size: .85rem;
  line-height: 30px;
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.org-chooser .recent-orgs__clear:hover {
  background: #f9fafb;
  border-color: #a8aeb8;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .03);
}
.org-chooser .recent-orgs__clear:focus-visible {
  outline: 2px solid rgba(29, 78, 216, .35);
  outline-offset: 2px;
}
.request-access-form .fieldset {
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: .75rem 1rem;
}
.request-access-form .form-hint {
  color: #6b7280;
  margin: .25rem 0 0;
}
.callout.success {
  border-left: 4px solid #10b981;
}
.admin-card {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
}
.admin-card__title {
  margin: 0 0 .25rem;
  display: flex;
  gap: .5rem;
  align-items: center;
}
.admin-card__who {
  margin: .25rem 0 .75rem;
  color: #0f172a;
}
.admin-card__actions {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
  margin-bottom: .25rem;
}
.email-preview {
  margin-top: .5rem;
}
.email-preview pre {
  background: #0b1220;
  color: #e5e7eb;
  padding: .75rem;
  border-radius: 8px;
  overflow: auto;
  max-height: 300px;
  font-size: .85rem;
}
/* Autocomplete container & list */
.ac-list {
  position: relative;
  margin-top: .25rem;
}
.ac-list ul {
  position: absolute;
  z-index: 10;
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .1);
  max-height: 280px;
  overflow: auto;
  padding: .35rem;
}
/* Little heading inside the list */
.ac-head {
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #64748b;
  padding: .25rem .5rem .35rem;
  margin: .1rem 0 .25rem;
}
/* Result items look clickable */
.ac-item {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .4rem .5rem;
  border-radius: 8px;
}
.ac-item i {
  color: #475569;
  width: 18px;
  text-align: center;
}
.ac-item:hover {
  background: #f8fafc;
}
.ac-item:active {
  background: #eef2ff;
}
/* “Use typed name” action */
.ac-item--use {
  border: 1px dashed #cbd5e1;
  background: #f8fafc;
  margin-top: .25rem;
}
.ac-item--use i {
  color: #2563eb;
}
/* Keyboard highlight (ArrowUp/Down) */
.ac-item.is-highlight {
  background: #eef2ff;
}
/* Highlight matched text */
.ac-item mark {
  background: #fee2e2;
  color: #b91c1c;
  padding: 0 .15rem;
  border-radius: 4px;
}
/* Selected confirmation chip row */
.selected-chip {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin: .4rem 0 .25rem;
}
.selected-chip .chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  background: #eef2ff;
  border: 1px solid #dbeafe;
  color: #1e3a8a;
  padding: .35rem .6rem;
  border-radius: 999px;
  font-size: .9rem;
}
.selected-chip .chip i {
  color: #1e3a8a;
}
/* Make the input feel connected to results on focus */
#org-search:focus + input + #company-help, #org-search:focus {
  outline: none;
}
/* Buttons: ghost + tiny */
.button.btn--ghost {
  background: #fff;
  color: #0f172a;
  border: 1px solid #d1d5db;
  box-shadow: none;
}
.button.btn--ghost:hover, .button.btn--ghost:focus {
  border-color: #a8aeb8;
  background: #f9fafb;
}
.button.tiny {
  font-size: .8rem;
  line-height: 1;
  padding: .4rem .6rem;
  border-radius: 999px;
}
/* Autocomplete container & list */
.ac-list {
  position: relative;
  margin-top: .25rem;
}
.ac-list ul {
  position: absolute;
  z-index: 10;
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .1);
  max-height: 280px;
  overflow: auto;
  padding: .35rem;
}
/* Header + hint inside the panel */
.ac-head {
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #64748b;
  padding: .25rem .5rem .35rem;
  margin: .1rem 0 .25rem;
}
.ac-hint {
  display: flex;
  align-items: center;
  gap: .5rem;
  color: #64748b;
  padding: .5rem;
  border-radius: 8px;
  background: #f8fafc;
  border: 1px dashed #e2e8f0;
  margin: .25rem .25rem .35rem;
}
/* Results look clickable */
.ac-item {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .45rem .6rem;
  border-radius: 8px;
}
.ac-item i {
  color: #475569;
  width: 18px;
  text-align: center;
}
.ac-item:hover {
  background: #f8fafc;
}
.ac-item:active {
  background: #eef2ff;
}
.ac-item.is-highlight {
  background: #eef2ff;
}
/* “Use typed name” action */
.ac-item--use {
  border: 1px dashed #cbd5e1;
  background: #f8fafc;
  margin-top: .25rem;
}
.ac-item--use i {
  color: #2563eb;
}
/* Highlight matched text */
.ac-item mark {
  background: #fee2e2;
  color: #b91c1c;
  padding: 0 .15rem;
  border-radius: 4px;
}
/* Selected confirmation chip */
.selected-chip {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin: .45rem 0 .3rem;
}
.selected-chip .chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  background: #eef2ff;
  border: 1px solid #dbeafe;
  color: #1e3a8a;
  padding: .35rem .65rem;
  border-radius: 999px;
  font-size: .9rem;
}
.selected-chip .chip i {
  color: #1e3a8a;
}
/* Make label look interactive too */
.ac-item .ac-label {
  cursor: pointer;
}
/* Simple utility for show/hide in JS */
.is-hidden {
  display: none !important;
}
/* 1) Action Bar layout */
.action-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-items: stretch;
}
.action-bar .button {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .75rem 1rem;
  border-radius: 9999px;
}
.action-bar .button.large {
  padding: .85rem 1.25rem;
}
/* 2) Primary / Secondary visual alignment (Foundation-friendly) */
.button.primary {
  box-shadow: 0 1px 0 rgba(0, 0, 0, .05);
  font-weight: 700;
}
.button.secondary {
  background: #fff;
  border: 1px solid #d9dee7;
  color: #1f2937;
}
.button.secondary:hover {
  background: #f8fafc;
}
/* 3) Search input: bigger, friendlier */
.searchbar .input-group {
  border: 1px solid #d9dee7;
  border-radius: 9999px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .03);
}
.searchbar .input-group-label {
  background: transparent;
  border: 0;
  padding-left: .9rem;
}
.searchbar .input-group-field {
  height: 44px;
  border: 0;
  outline: 0;
  box-shadow: none;
  padding-left: .35rem;
}
.searchbar .input-group-field::placeholder {
  color: #6b7280;
}
/* 4) Filter toolbar card */
.table-card.callout {
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  background: #fff;
}
/* 5) Tables: lighter header + sticky + subtle hover */
.table-scroll {
  max-height: 60vh;
  overflow: auto;
}
.dashboard thead th {
  position: sticky;
  top: 0;
  background: #f8fafc;
  z-index: 1;
  color: #374151;
  font-weight: 600;
  border-bottom: 1px solid #e5e7eb;
}
.dashboard tbody tr:hover {
  background: #fbfdff;
}
.dashboard td, .dashboard th {
  vertical-align: top;
}
/* 6) Tablesorter sort affordance */
.tablesorter-header {
  cursor: pointer;
}
.tablesorter-headerAsc::after, .tablesorter-headerDesc::after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: .35rem;
  vertical-align: middle;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
}
.tablesorter-headerAsc::after {
  border-bottom: 6px solid #6b7280;
}
.tablesorter-headerDesc::after {
  border-top: 6px solid #6b7280;
}
/* 7) Top header bar (subtle trim) — if it feels heavy */
.header_bkg, .top_header_bkg {
  padding-top: .35rem;
  padding-bottom: .35rem;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .04) !important;
}
/* ACTION BAR */
.action-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-items: stretch;
}
.action-bar .button {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .75rem 1rem;
  border-radius: 9999px;
}
.action-bar .button.large {
  padding: .85rem 1.25rem;
}
/* Secondary buttons aligned to theme */
.button.secondary {
  background: #fff;
  border: 1px solid #d9dee7;
  color: #1f2937;
}
.button.secondary:hover {
  background: #f8fafc;
}
/* Searchbar */
.searchbar .input-group {
  border: 1px solid #d9dee7;
  border-radius: 9999px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .03);
}
.searchbar .input-group-label {
  background: transparent;
  border: 0;
  padding-left: .9rem;
}
.searchbar .input-group-field {
  height: 44px;
  border: 0;
  outline: 0;
  box-shadow: none;
  padding-left: .35rem;
}
.searchbar .input-group-field::placeholder {
  color: #6b7280;
}
/* Filter card */
.table-card.callout {
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  background: #fff;
}
/* Tables: lighter header + sticky + hover */
.table-scroll {
  max-height: 60vh;
  overflow: auto;
}
.dashboard thead th {
  position: sticky;
  top: 0;
  background: #f8fafc;
  z-index: 1;
  color: #374151;
  font-weight: 600;
  border-bottom: 1px solid #e5e7eb;
}
.dashboard tbody tr:hover {
  background: #fbfdff;
}
.dashboard td, .dashboard th {
  vertical-align: top;
}
/* Tablesorter affordance */
.tablesorter-header {
  cursor: pointer;
}
/*.tablesorter-headerAsc::after, .tablesorter-headerDesc::after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: .35rem;
  vertical-align: middle;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
}*/
.tablesorter-headerAsc::after {
  border-bottom: 6px solid #6b7280;
}
.tablesorter-headerDesc::after {
  border-top: 6px solid #6b7280;
}
/* Softer top header bar */
.header_bkg, .top_header_bkg {
  padding-top: .35rem;
  padding-bottom: .35rem;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .04) !important;
}
/* ACTION BAR – emulate dashboard.php (blue primary, white secondary) */
.action-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-items: stretch;
}
.action-bar .button {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .85rem 1.25rem;
  border-radius: 9999px;
  font-weight: 700;
}
.action-bar .button.primary {
  box-shadow: 0 1px 0 rgba(0, 0, 0, .05);
}
.action-bar .button.secondary {
  background: #fff;
  border: 1px solid #d9dee7;
  color: #1f2937;
}
.action-bar .button.secondary:hover {
  background: #f8fafc;
}
/* Searchbar */
.searchbar .input-group {
  border: 1px solid #d9dee7;
  border-radius: 9999px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .03);
}
.searchbar .input-group-label {
  background: transparent;
  border: 0;
  padding-left: .9rem;
}
.searchbar .input-group-field {
  height: 44px;
  border: 0;
  outline: 0;
  box-shadow: none;
  padding-left: .35rem;
}
.searchbar .input-group-field::placeholder {
  color: #6b7280;
}
/* Filter card */
.table-card.callout {
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  background: #fff;
}
/* Tables: lighter header + sticky + hover */
.table-scroll {
  max-height: 60vh;
  overflow: auto;
}
.dashboard thead th {
  position: sticky;
  top: 0;
  background: #f8fafc;
  z-index: 1;
  color: #374151;
  font-weight: 600;
  border-bottom: 1px solid #e5e7eb;
}
.dashboard tbody tr:hover {
  background: #fbfdff;
}
.dashboard td, .dashboard th {
  vertical-align: top;
}
/* Tablesorter affordance */
.tablesorter-header {
  cursor: pointer;
}
/*.tablesorter-headerAsc::after, .tablesorter-headerDesc::after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: .35rem;
  vertical-align: middle;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
}*/
.tablesorter-headerAsc::after {
  border-bottom: 6px solid #6b7280;
}
.tablesorter-headerDesc::after {
  border-top: 6px solid #6b7280;
}
/* Softer top header bar */
.header_bkg, .top_header_bkg {
  padding-top: .35rem;
  padding-bottom: .35rem;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .04) !important;
}
/* Tiny helper text */
.helper-inline {
  font-size: .9rem;
  color: #475569;
  margin-top: .35rem;
}
.helper-inline .muted {
  color: #6b7280;
}
/* === Prime Dashboard: Action Bar — rounded (not pill) + better wrapping === */
/* Match dashboard.php style (tweak 8px if your theme uses a different radius) */
.action-bar .button, .action-bar .button.round {
  border-radius: 8px !important; /* not fully pill */
}
/* Ensure readable multi-line labels and solid tap targets */
.action-bar .button {
  white-space: normal; /* allow wrapping (Foundation buttons are nowrap by default) */
  line-height: 1.2;
  min-height: 44px; /* mobile-friendly touch size */
  align-items: center; /* keep icon + text vertically centered on 1–2 lines */
  text-align: left; /* left-align on desktop for quicker scanning */
}
/* Icon spacing stays tidy even with wrapping */
.action-bar .button i {
  flex: 0 0 auto;
  margin-right: .5rem;
}
/* Mobile: stack buttons full-width with nice spacing and centered labels */
@media (max-width: 640px) {
  .action-bar {
    display: grid;
    grid-template-columns: 1fr;
    gap: .5rem; /* slightly tighter gap on mobile */
  }
  .action-bar .button {
    width: 100%;
    justify-content: center; /* center text on small screens */
    text-align: center;
  }
}
/* ===========================
   Prime Dashboard helpers
   =========================== */
/* --- Tooltip (Foundation has-tip) --- */
.tip-icon, .tip-icon.has-tip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 6px; /* not pill */
  border: 1px solid #d9dee7;
  background: #fff;
  color: #374151;
  margin-left: .4rem;
  line-height: 1;
  cursor: help;
}
.tip-icon i {
  font-size: 13px;
}
/* Foundation's injected tooltip bubble */
.tooltip {
  background: #111827;
  color: #fff;
  border-radius: 8px;
  padding: .45rem .6rem;
  font-size: .85rem;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
  border: 1px solid rgba(255, 255, 255, .06);
}
.tooltip:before { /* the little arrow */
  border-color: transparent transparent #111827 transparent !important;
}
/* --- Attention card --- */
.callout.table-card.attention-card {
  border-left: 4px solid #b91c1c; /* red accent */
  background: #fff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .02);
  margin-top: 0.4375em;
}
.attention-card .attention-title {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-weight: 700;
  color: #111827;
}
.attention-card .attention-list {
  margin: .35rem 0 0;
  line-height: 1.6;
  color: #374151;
}
.kpi-chip {
  display: inline-block;
  min-width: 1.75rem;
  padding: .1rem .45rem;
  border-radius: 9999px; /* chip is okay as pill */
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 700;
  font-size: .85rem;
  text-align: center;
}
/* --- Inline helper text --- */
.helper-inline {
  font-size: .95rem;
  color: #475569;
  margin-top: .4rem;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: .6rem .75rem;
}
.helper-inline .muted {
  color: #6b7280;
}
/* Mobile niceties */
@media (max-width: 640px) {
  .attention-card .grid-x {
    row-gap: .5rem;
  }
  .helper-inline {
    font-size: .95rem;
    line-height: 1.4;
  }
}
/* Attention list: semantic UL with custom bullets */
.attention-list {
  list-style: none;
  margin: .35rem 0 0;
  padding: 0;
  line-height: 1.6;
  color: #374151;
}
.attention-list li {
  position: relative;
  padding-left: 1.1rem;
}
.attention-list li:before {
  content: "•";
  position: absolute;
  left: 0;
  top: 0;
  color: #64748b;
  font-weight: 700;
  line-height: 1.2;
}
.kpi-chip {
  display: inline-block;
  min-width: 1.75rem;
  padding: .1rem .45rem;
  border-radius: 9999px;
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 700;
  font-size: .85rem;
  text-align: center;
}
/* Base card keeps white */
.attention-card {
  border-left: 4px solid #b91c1c;
  background: #fff;
}
/* 3) Sticky filter bar */
.filters-sticky {
  position: sticky;
  top: 64px;
  z-index: 3;
}
@media (max-width:640px) {
  .filters-sticky {
    top: 56px;
  }
}
/* FA7 pseudo-element setup for status badges (Classic · Solid) */
.status-badge::before {
  /* FA7-recommended way: use the Solid custom property */
  font: var(--fa-font-solid);
  /* Fallbacks if the variable isn't present yet */
  font-family: "Font Awesome 7 Pro", "Font Awesome 7 Free";
  font-weight: 900;
  display: inline-block;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-right: .4rem;
}
/* Individual icons (unicodes unchanged) */
/*.status-badge.status-compliant::before {
  content: "\f00c";*/
} /* check */
/* In-progress: static clock, no animation */
/*.status-badge.status-in-progress::before {
  content: "\f017";
  font: var(--fa-font-solid);
  font-weight: 900;
  animation: none !important;
}*/
/*.status-badge.status-non-compliant::before {
  content: "\f071";
}*/
@keyframes fa-spin {
  to {
    transform: rotate(360deg);
  }
}
.status-badge.status-in-progress::before {
  animation: fa-spin 1s linear infinite;
}
/* 7) Empty-state helper */
.soft-hide {
  display: none;
}
.empty-state p {
  margin: .75rem 0 0;
}
/* green */
/* Optional chip variants */
.kpi-chip--warn {
  background: #fef3c7;
  color: #b45309;
}
.kpi-chip--ok {
  background: #f8f9fa;
  color: #047857;
}
/* Invite modal hint: calm card with accent and icon */
.form-hint.form-hint--card {
  display: flex;
  align-items: flex-start;
  gap: .55rem;
  margin: .4rem 0 0;
  padding: .6rem .75rem;
  background: #f8fafc; /* soft panel */
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  font-size: .9rem;
  line-height: 1.35;
  color: #475569; /* slate-600 */
}
.form-hint.form-hint--accent {
  border-left: 3px solid #2563eb; /* brand blue accent */
  padding-left: .65rem; /* space after accent */
}
.form-hint.form-hint--card i {
  font: var(--fa-font-solid); /* FA7 */
  font-weight: 900;
  color: #2563eb;
  line-height: 1;
  margin-top: .2rem; /* vertical align with first line of text */
  flex: 0 0 auto;
}
@media (max-width: 640px) {
  .form-hint.form-hint--card {
    font-size: .92rem;
  }
}
/* Make secondary buttons legible on white backgrounds (incl. modals) */
.button.secondary, .input-group-button .button.secondary {
  background: #ffffff;
  border: 1px solid #d9dee7;
  color: #1f2937;
}
.button.secondary:hover, .input-group-button .button.secondary:hover {
  background: #f8fafc;
  border-color: #cfd6e3;
}
/* Legacy “hollow” safety: if hollow sneaks in, keep it visible */
.button.hollow.secondary {
  background: transparent;
  border: 1px solid #d9dee7;
  color: #1f2937;
}
.button.hollow.secondary:hover {
  background: #f8fafc;
}
/* Input group in the modal: don’t clip the trailing button on small screens */
.input-group {
  display: flex; /* override table layout */
  flex-wrap: wrap;
  gap: .4rem;
}
.input-group-label {
  flex: 0 0 auto;
}
.input-group-field {
  flex: 1 1 12rem;
  min-width: 0;
}
.input-group-button {
  flex: 0 0 auto;
}
/* Cancel button readability */
.button.cancel, .reveal .button.cancel {
  background: #ffffff;
  border: 1px solid #d9dee7;
  color: #1f2937;
}
.button.cancel:hover, .reveal .button.cancel:hover {
  background: #f8fafc;
  border-color: #cfd6e3;
}
/* Small screens: stack nicely */
@media (max-width: 640px) {
  .input-group {
    gap: .5rem;
  }
  .input-group-label {
    order: 1;
  }
  .input-group-field {
    order: 2;
    width: 100%;
  }
  .input-group-button {
    order: 3;
  }
}
/* ==== FIX: Invite modal input group (icon + field + button inline) ==== */
.input-group.access-code-group {
  display: flex !important; /* defeat table/grid overrides */
  flex-wrap: nowrap !important; /* keep on one line (desktop) */
  align-items: center;
  gap: 0;
  border: 1px solid #d9dee7;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
  padding: 0;
}
/* normalize children */
.input-group.access-code-group .input-group-label, .input-group.access-code-group .input-group-field, .input-group.access-code-group .input-group-button {
  margin: 0;
}
/* icon block (left) */
.input-group.access-code-group .input-group-label {
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 0;
  flex: 0 0 44px; /* fixed width icon column */
  height: 44px;
  padding: 0 .75rem;
}
.input-group.access-code-group .input-group-label i {
  font: var(--fa-font-solid);
  font-weight: 900;
  opacity: .85;
}
/* text field (middle) */
.input-group.access-code-group .input-group-field {
  flex: 1 1 auto;
  min-width: 0; /* prevent overflow */
  height: 44px;
  border: 0;
  box-shadow: none;
  padding: .55rem .5rem;
}
/* button (right) */
.input-group.access-code-group .input-group-button {
  flex: 0 0 auto;
  display: flex; /* ensure full-height button */
}
.input-group.access-code-group .input-group-button .button {
  height: 44px;
  line-height: 1;
  border: 0;
  border-left: 1px solid #d9dee7;
  border-radius: 0;
  white-space: nowrap;
  padding: 0 .9rem;
}
/* focus ring on entire group */
.input-group.access-code-group:focus-within {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .15);
}
/* --- mobile: stack neatly (only under 640px viewport) --- */
@media (max-width:640px) {
  .input-group.access-code-group {
    flex-wrap: wrap !important;
    gap: .5rem;
    padding: .35rem;
  }
  .input-group.access-code-group .input-group-label {
    order: 1;
    flex: 0 0 auto;
    height: auto;
    padding: 0 .25rem 0 0;
  }
  .input-group.access-code-group .input-group-field {
    order: 2;
    width: 100%;
    height: 40px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: .5rem .6rem;
  }
  .input-group.access-code-group .input-group-button {
    order: 3;
    width: 100%;
  }
  .input-group.access-code-group .input-group-button .button {
    width: 100%;
    height: 40px;
    border-left: 0;
    border-top: 1px solid #d9dee7;
    border-radius: 6px;
  }
}
/* === Hero action bar: prominent, compact, accessible === */
.action-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin-top: .25rem;
}
.action-bar--hero .button {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  padding: .8rem 1rem; /* larger touch target */
  border-radius: 12px;
  font-weight: 700;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .04), 0 6px 18px rgba(0, 0, 0, .06);
  transition: transform .12s ease, box-shadow .12s ease;
}
.action-bar--hero .button i {
  font: var(--fa-font-solid); /* FA7 webfont */
  font-weight: 900;
  font-size: 1.35em; /* bigger, but not oversized */
  line-height: 1;
}
.action-bar--hero .button.primary { /* ensure strong contrast for primary */
  /* assume your theme sets background; we just enhance elevation on hover */
}
.action-bar--hero .button.secondary {
  background: #fff; /* white secondary */
  border: 2px solid #2563eb; /* brand outline */
  color: #1f2937;
}
.action-bar--hero .button:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 0 rgba(0, 0, 0, .04), 0 10px 22px rgba(0, 0, 0, .10);
}
/* Reduce motion if user prefers */
@media (prefers-reduced-motion: reduce) {
  .action-bar--hero .button {
    transition: none;
  }
  .action-bar--hero .button:hover {
    transform: none;
  }
}
/* Badges on buttons (e.g., invites pending, jobs soon) */
.action-bar--hero .btn-badge {
  display: inline-block;
  margin-left: .35rem;
  padding: .2rem .45rem;
  font-size: .78rem;
  line-height: 1;
  font-weight: 700;
  border-radius: 999px;
  background: #eff6ff;
  color: #1d4ed8;
}
/* Mobile: full-width stacking for easy taps */
@media (max-width:640px) {
  .action-bar--hero .button {
    flex: 1 1 100%;
    justify-content: center;
  }
}
/* Inline helper under action bar */
.helper-inline.continue-inline {
  margin: .5rem 0 0;
  display: flex;
  align-items: center;
  gap: .45rem;
  color: #475569;
}
.helper-inline.continue-inline i {
  color: #2563eb;
}
.button.primary-outline {
  background: #fff;
  border: 2px solid #2563eb;
  color: #1f2937;
  margin-top: 1em;
}
.button.primary-outline:hover {
  background: #f8fafc;
}
/* spacing harmony for helpers under the hero bar */
.action-bar + .helper-inline {
  margin-top: .5rem;
}
.helper-inline + .helper-inline {
  margin-top: .4rem;
}
/* your padding tweak on the continue button */
.button.primary-outline {
  background: #fff;
  border: 2px solid #2563eb;
  color: #1f2937;
  margin-top: 1em;
}
/* mobile: make the continue button easy to tap */
@media (max-width:640px) {
  .helper-inline.continue-inline .button.primary-outline {
    width: 100%;
  }
}
/* ====== Design tokens (tweak to your brand) ====== */ :root {
  --brand-600: #2563eb; /* primary */
  --brand-700: #1d4ed8;
  --brand-purple: #606276;
  --ink-900: #111827; /* headings */
  --ink-700: #374151; /* body */
  --ink-500: #6b7280; /* muted */
  --line: #e5e7eb; /* soft borders */
  --bg-soft: #f9fafb; /* page bg tints */
  --ok: #10b981; /* success */
  --warn: #eab308;
  --err: #b91c1c;
  --card: #ffffff;
  --radius-xl: 16px;
  --radius-lg: 12px;
  --radius-md: 8px;
  --shadow-sm: 0 1px 2px rgba(17, 24, 39, .06), 0 1px 1px rgba(17, 24, 39, .04);
  --shadow-md: 0 8px 24px rgba(17, 24, 39, .10);
  --ring: 0 0 0 3px rgba(37, 99, 235, .25);
}
/* Headings + lede */
h2.alternate {
  color: var(--ink-900);
  font-weight: 700;
  letter-spacing: .2px;
  margin-bottom: .25rem;
}
.subtle-lede.page-intro {
  color: var(--ink-500);
  margin-top: .125rem;
  margin-bottom: 1.25rem;
}
/* Section cards */
.callout {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-sm);
}
.section-head {
  font-weight: 700;
  color: var(--ink-900);
}
.section-head i {
  color: var(--brand-purple);
}
/* Helper panel: stick on desktop, airy spacing */
@media(min-width:64em) {
  .helper-panel {
    position: sticky;
    top: 1rem;
  }
}
.helper-panel .callout.primary {
  background: linear-gradient(180deg, #eff6ff, #ffffff);
  border-color: #dbeafe;
}
/* Form rhythm */
label {
  display: block;
  margin-bottom: .9rem;
}
label > .form-hint {
  display: block;
  color: var(--ink-500);
  margin-top: .25rem;
}
.divider-soft {
  background: var(--line);
}
/* Inputs */
input[type="text"], input[type="email"], input[type="tel"], input[type="url"], select, textarea {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
  padding: .7rem .8rem;
  transition: border-color .15s ease, box-shadow .15s ease;
}
input:focus, select:focus, textarea:focus {
  outline: 0;
  border-color: var(--brand-600);
  box-shadow: var(--ring);
}
input::placeholder {
  color: #9ca3af;
}
/* Validation inline */
.form-error-inline {
  color: var(--err);
  margin-top: .35rem;
}
.is-invalid-input {
  border-color: var(--err) !important;
  box-shadow: 0 0 0 3px rgba(185, 28, 28, .15) !important;
}
/* Logo dropzone look (keeps native input) */
label[for="logo"], label:has(#logo) {
  display: block;
  border: 1px dashed #cbd5e1;
  border-radius: var(--radius-lg);
  padding: .9rem;
  background: #fbfdff;
}
label:has(#logo):hover {
  background: #f3f7ff;
  border-color: #bcd2ff;
}
.logo-preview {
  display: none;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 6px;
  box-shadow: var(--shadow-sm);
}
/* Buttons (keep your existing classes; subtle tune) */
.button.btn--primary {
  background: var(--brand-600);
  border: 1px solid var(--brand-700);
  color: #fff;
  border-radius: 999px;
  padding: .65rem 1rem;
}
.button.btn--primary:hover {
  background: var(--brand-700);
}
.button.btn--secondary {
  background: #eef2ff;
  color: #3730a3;
  border: 1px solid #e0e7ff;
  border-radius: 999px;
}
.button.btn--ghost {
  background: transparent;
  border: 1px solid var(--line);
  color: var(--ink-700);
  border-radius: 999px;
}
.button.small {
  padding: .45rem .7rem;
  font-size: .875rem;
}
/* Chips/badges */
.badge-soft {
  background: #eef2ff;
  color: #3730a3;
  border: 1px solid #e0e7ff;
}
/* “Why we ask” bullets prettier spacing */
.helper-panel ul.no-bullet li {
  margin: .35rem 0;
}
/* Improve keyboard focus on important links/buttons */
a:focus, .button:focus {
  outline: 0;
  box-shadow: var(--ring);
}
/* Tighten large-card padding on mobile */
@media(max-width:39.9375em) {
  .callout {
    padding: .9rem .9rem;
  }
}
/* ===== Form control anti-clipping patch (scoped to this page) ===== */
.form-card input[type="text"], .form-card input[type="email"], .form-card input[type="tel"], .form-card input[type="url"], .form-card select, .form-card textarea {
  box-sizing: border-box;
  height: auto !important; /* neutralize any fixed heights */
  min-height: 2.6rem; /* gives room for asc/descenders */
  line-height: 1.25; /* prevent baseline clipping */
  padding-top: .62rem; /* slightly asymmetric padding to balance */
  padding-bottom: .74rem;
}
/* Multi-select (Trades) benefits from a taller line-height too */
.form-card select[multiple], .form-card select[size] {
  height: auto !important; /* let it size by content */
  line-height: 1.35;
  padding-top: .45rem;
  padding-bottom: .45rem;
}
/* Optional: normalize single-line selects on WebKit to avoid baseline drift */
.form-card select:not([multiple]) {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 2rem; /* space for native arrow or your custom one */
}
/* If Foundation sets .input-group-field heights, relax them here */
.form-card .input-group-field {
  height: auto !important;
  line-height: 1.25;
  padding-top: .62rem;
  padding-bottom: .72rem;
}
/* Simple, non-sticky form footer */
.form-card .form-actions {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
  justify-content: flex-end;
  padding-top: .75rem;
  margin-top: .75rem;
  border-top: 1px solid var(--line);
}
@media(max-width: 640px) {
  .form-card .form-actions {
    justify-content: center;
  }
}
/* Tint every helper card like the first one */
.helper-panel .callout {
  background: linear-gradient(180deg, #eff6ff, #ffffff);
  border: 1px solid #dbeafe;
}
/* If you ever want a plain one, add class="callout plain" */
.helper-panel .callout.plain {
  background: #fff;
  border: 1px solid var(--line);
}
/* Left-align the Cancel / Create buttons */
.form-card .form-actions {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
  justify-content: flex-start; /* was flex-end */
  padding-top: .75rem;
  margin-top: .75rem;
  border-top: 1px solid var(--line);
}
.form-card .form-actions .button + .button {
  margin-left: .5rem;
}
/* Design tokens used by the chips (lightweight) */ :root {
  --line: #e5e7eb;
  --ring: 0 0 0 3px rgba(37, 99, 235, .25);
}
/* Pill checkbox chips for Trade types */
.trade-checks .chips {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: .25rem 0 .5rem;
  padding: 0;
}
.trade-checks .chips li {
  list-style: none;
}
.trade-checks .chip-check {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .45rem .75rem;
  background: #fff;
  cursor: pointer;
  user-select: none;
  transition: box-shadow .15s ease, border-color .15s ease, background .15s ease;
}
/* hide the native checkbox but keep it accessible */
.trade-checks .chip-check input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 1px;
  height: 1px;
}
/* keyboard focus */
.trade-checks .chip-check:focus-within {
  box-shadow: var(--ring);
}
/* checked state (JS adds .is-checked for broad support) */
.trade-checks .chip-check.is-checked {
  background: #eef2ff;
  border-color: #c7d2fe;
}
/* --- Other Trade support --- */
.trade-checks .chip-add {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  border: 1px dashed var(--line);
  border-radius: 999px;
  padding: .45rem .75rem;
  background: #fff;
  cursor: pointer;
  user-select: none;
}
.trade-checks .chip-add:focus {
  box-shadow: var(--ring);
  outline: none;
}
.trade-checks .chip-check .chip-close {
  border: 0;
  background: transparent;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  margin-left: .25rem;
  color: #6b7280;
}
.trade-checks .chip-check .chip-close:hover {
  color: #111827;
}
.add-trade-inline {
  display: none;
  margin-top: .5rem;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
}
.add-trade-inline.is-open {
  display: flex;
}
.add-trade-inline input[type="text"] {
  max-width: 260px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: .5rem .6rem;
}
/* Compact variant you can add via class when needed */
.callout--compact {
  padding: .55rem .7rem;
  border-left-width: 5px;
}
.input-code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  text-transform: uppercase;
  letter-spacing: .06em;
}
/* ===========================
   PRIME DASHBOARD – Filter toolbar input height fix
   (prevents text from being cut off)
   =========================== */ :root {
  --filter-field-height: 2.75rem; /* ~44px tap target */
  --filter-vpad: .6rem;
}
/* Ensure consistent height + vertical padding */
.filters-sticky .input-group .input-group-field, .filters-sticky input[type="search"], .filters-sticky select {
  box-sizing: border-box;
  min-height: var(--filter-field-height);
  height: var(--filter-field-height); /* lock visual height */
  line-height: 1.25; /* avoid vertical cropping on Win/Safari */
  padding-top: var(--filter-vpad);
  padding-bottom: var(--filter-vpad);
  font-size: 1rem; /* normalize if something shrunk it */
}
/* Magnifying-glass label pill on the left */
.filters-sticky .input-group .input-group-label {
  box-sizing: border-box;
  display: flex;
  align-items: center; /* vertically center the icon */
  min-height: var(--filter-field-height);
  height: var(--filter-field-height);
  line-height: 1.1;
}
/* “Clear” button on the right matches input height */
.filters-sticky .input-group .input-group-button .button {
  min-height: var(--filter-field-height);
  height: var(--filter-field-height);
  padding-top: var(--filter-vpad);
  padding-bottom: var(--filter-vpad);
}
/* Guard against any compact control styles leaking in */
.filters-sticky .input-group.input-compact .input-group-field, .filters-sticky .input-group.input-compact .input-group-button .button {
  min-height: var(--filter-field-height);
  height: var(--filter-field-height);
}
/* Safari/WebKit quirk: keep select text from clipping */
.filters-sticky select {
  -webkit-appearance: menulist; /* keep native, but consistent height */
  background-clip: padding-box;
}
/* ===== Tighten spacing around the Compliance filters ===== */
/* 1) Reduce gap between H3 and the filter toolbar */
h3.alternate + .filters-sticky {
  margin-top: .35rem;
}
/* 2) Make the filter toolbar more compact (keep inputs 44px tall) */
.filters-sticky {
  padding-top: .6rem;
  padding-bottom: .6rem;
}
/* Kill default bottom margins that create stacked gaps */
.filters-sticky .input-group, .filters-sticky select, .filters-sticky label {
  margin-bottom: 0;
}
/* 44px aligned controls */
.filters-sticky .input-group .input-group-label, .filters-sticky .input-group .input-group-field, .filters-sticky .input-group .button, .filters-sticky select {
  height: 44px;
}
/* 3) Results count: small, no big block gap */
#filter-count {
  margin: .3rem 0 0;
}
/* 4) Reduce space before the tabs */
.filters-sticky + .more_space_top {
  margin-top: .6rem !important;
}
/* 5) Desktop: ensure the 3 cells sit snugly; avoid stray cell gaps */
@media (min-width: 640px) {
  .filters-sticky .cell {
    margin-bottom: 0;
  }
}
/* ===== Compliance filters: arrow spacing + container match ===== */
/* Match the table container look (no thick accent bar) */
.callout.table-card.filters-sticky {
  background: #fff; /* same panel as table card */
  border: 1px solid #d0d6de; /* same border */
  border-left-width: 1px !important; /* kill any accent thickness */
  box-shadow: none; /* keep it flat if table is flat */
  padding-top: .6rem; /* compact, but comfy */
  padding-bottom: .6rem;
}
/* Align selects with comfortable arrow spacing */
.filters-sticky select {
  height: 44px; /* consistent control height */
  padding-right: 2.2rem; /* room for native arrow */
  line-height: 1.2; /* avoid extra vertical space */
  margin-bottom: 0; /* prevent stacked gaps */
}
/* When a custom background arrow is present (some themes),
   nudge it in from the edge for visual balance */
.filters-sticky select:not([multiple]) {
  background-position: right .7rem center;
  background-size: 12px auto; /* tame oversized chevrons */
}
/* Tighten vertical rhythm inside the filter row */
.filters-sticky .input-group, .filters-sticky label {
  margin-bottom: 0;
}
#filter-count {
  margin: .3rem 0 0;
}
/* Reduce space between the filters bar and the tabs below */
.filters-sticky + .more_space_top {
  margin-top: .5rem !important;
}
/* (Optional) Title-to-filters gap */
h3.alternate + .filters-sticky {
  margin-top: .35rem;
}
/* Filters match the table card look */
.callout.table-card.filters-sticky {
  background: #fff;
  border: 1px solid #d0d6de;
  border-bottom: none;
  border-left-width: 1px !important;
  padding: .65rem .9rem .7rem; /* compact vertical rhythm */
  box-shadow: none;
}
/* Tighten the title inside the filters bar */
.filters-sticky h3.alternate {
  margin: .1rem 0 .55rem;
  line-height: 1.2;
}
/* Reduce space between attention card and filters bar */
.attention-card {
  margin-bottom: .6rem;
}
.attention-card + .filters-sticky {
  margin-top: .25rem;
}
/* Visible labels + compact controls */
.filters-sticky label {
  display: block;
  margin: 0 0 .25rem;
}
.filters-sticky .input-group, .filters-sticky select {
  margin-bottom: 0;
}
/* Consistent control height and arrow spacing */
.filters-sticky .input-group .input-group-label, .filters-sticky .input-group .input-group-field, .filters-sticky .input-group .button, .filters-sticky select {
  height: 44px;
}
.filters-sticky select {
  padding-right: 2.2rem; /* room for native arrow */
  line-height: 1.2;
}
.filters-sticky select:not([multiple]) {
  background-position: right .7rem center;
  background-size: 12px auto;
}
/* Search hint + results count spacing */
#search-hint {
  margin: .35rem 0 0;
}
#filter-count {
  margin: .35rem 0 0;
}
/* Reduce space before tabs below the filters bar */
.filters-sticky + .more_space_top {
  margin-top: .5rem !important;
}
/* ---- Remove any leftover sticky behavior (safety) ---- */
.filters-sticky {
  position: static !important;
  top: auto !important;
  z-index: auto !important;
}
/* ---- Filters panel (non-sticky), matching table card ---- */
.callout.table-card.filters-bar {
  background: #fff;
  border: 1px solid #d0d6de; /* same as table container */
  border-radius: 12px;
  padding: .75rem .9rem .8rem; /* compact, no extra air */
  margin: 0 0 .75rem; /* space below filters */
  box-shadow: none;
}
/* Title inside filters */
.filters-bar h3.alternate {
  margin: .1rem 0 .55rem;
  line-height: 1.2;
}
/* Visible labels + compact control spacing */
.filters-bar label {
  display: block;
  margin: 0 0 .25rem;
}
.filters-bar .input-group, .filters-bar select {
  margin-bottom: 0;
}
/* Consistent control height + select arrow spacing */
.filters-bar .input-group .input-group-label, .filters-bar .input-group .input-group-field, .filters-bar .input-group .button, .filters-bar select {
  height: 44px;
}
.filters-bar select {
  padding-right: 2.2rem; /* room for native arrow */
  line-height: 1.2;
}
.filters-bar select:not([multiple]) {
  background-position: right .7rem center; /* keep chevron off the edge */
  background-size: 12px auto;
}
/* Search tip + results count */
#search-hint {
  margin: .35rem 0 0;
}
#filter-count {
  margin: .35rem 0 0;
}
/* Space harmony between filters and tabs */
.filters-bar + .more_space_top {
  margin-top: .5rem !important;
}
/* Prevent any layering oddities over the table */
.tabs-content {
  position: relative;
  z-index: 0;
}
/* ============================
   Consolidated Industrial Callouts
   (single source of truth)
   ============================ */ :root {
  --co-radius: 10px;
  --co-shadow: 0 .5px 0 rgba(0, 0, 0, .06);
  --co-bg: #ffffff; /* default background */
  --co-bd: #d1d5db; /* default border */
  --co-accent: #94a3b8; /* default left bar */
  --co-title: #111827;
  --co-text: #374151;
}
/* Base */
.callout {
  position: relative;
  border: 1px solid var(--co-bd);
  border-left: 6px solid var(--co-accent);
  border-radius: var(--co-radius);
  background: var(--co-bg);
  padding: 1rem 1.25rem;
  box-shadow: var(--co-shadow);
  margin-bottom: 1em;
}
/* Text colors inside */
.callout h5, .callout .modal_title {
  color: var(--co-title);
  margin-top: 0;
}
.callout p, .callout li, .callout small {
  color: var(--co-text);
}
.callout .form-hint {
  color: #64748b;
}

.callout .form-hint .clear-link {
  border: 2px solid #2563eb;
    color: #1f2937;
    padding: .35rem .6rem;
    border-radius: 12px;
    font-size: .875rem;
    line-height: 1;
    cursor: pointer;
	font-weight: bold;
}

.callout .form-hint .clear-link:hover {
  border: 2px solid #111827;
    color: #111827;
} 

a.show-all-highlighted {
  border: 2px solid #2563eb;
    color: #1f2937;
    padding: .35rem .6rem;
    border-radius: 12px;
    font-size: .875rem;
    line-height: 1;
    cursor: pointer;
    font-weight: bold;	
}

a.show-all-highlighted:hover {
  border: 2px solid #111827;
    color: #111827;	
}

/* Variants (set the tokens; base uses them) */
.callout.success {
  --co-accent: #1f7a4d; /* deep safety green */
  --co-bd: #b6dfc8;
  --co-bg: linear-gradient(180deg, #f5faf7, #ffffff 60%);
  --co-title: #0b3d2e;
}
.callout.alert {
  --co-accent: #b91c1c; /* industrial red */
  --co-bd: #f0b6b6;
  --co-bg: linear-gradient(180deg, #fff7f7, #ffffff 60%);
  --co-title: #7f1d1d;
}
.callout.info {
  --co-accent: #1d4ed8; /* steel blue */
  --co-bd: #c7d2fe;
  --co-bg: linear-gradient(180deg, #f5f8fc, #ffffff 60%);
  --co-title: #0f172a;
}

.callout.white {
  --co-accent: #d0d6de; /* grey */
  --co-bd: #ffffff;
  --co-bg: #ffffff;
  --co-title: #0f172a;	
}


.callout.note, .callout.grey_callout {
  --co-accent: #475569; /* slate */
  --co-bd: #d1d5db;
  --co-bg: linear-gradient(180deg, #f6f7f9, #ffffff 60%);
  --co-title: #111827;
}
/* Optional 'tinted' solid backgrounds (no gradient) */
.callout.tinted {
  background: var(--co-bg-solid) !important;
}
.callout.success.tinted {
  --co-bg-solid: #eaf5ef;
}
.callout.alert.tinted {
  --co-bg-solid: #fdecec;
}
.callout.info.tinted {
  --co-bg-solid: #eef3fb;
}
.callout.note.tinted, .callout.grey_callout.tinted {
  --co-bg-solid: #f2f4f6;
}
/* Optional heading icons (Font Awesome) — opt-in with .co--icons */
.callout.co--icons h5:first-child, .callout.co--icons .modal_title:first-child {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-top: 0;
}
.callout.co--icons.success h5:first-child::before, .callout.co--icons.success .modal_title:first-child::before {
  content: "\f00c";
  font: var(--fa-font-solid);
  font-weight: 900;
  color: var(--co-accent);
}
.callout.co--icons.alert h5:first-child::before, .callout.co--icons.alert .modal_title:first-child::before {
  content: "\f071";
  font: var(--fa-font-solid);
  font-weight: 900;
  color: var(--co-accent);
}
.callout.co--icons.info h5:first-child::before, .callout.co--icons.info .modal_title:first-child::before {
  content: "\f05a";
  font: var(--fa-font-solid);
  font-weight: 900;
  color: var(--co-accent);
}
/* ============================
   Attention Card (single version)
   ============================ */
.callout.attention-card {
  --co-accent: #d0d6de;
  background: #f6f8fa;
  border: 1px solid #d0d6de;
  border-left: 6px solid var(--co-accent);
  border-radius: 12px;
  padding: 1rem 1.25rem;
  box-shadow: none;
}
.attention-title {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-weight: 700;
  color: #1f2937;
}
.attention-title i {
  font: var(--fa-font-solid);
  font-weight: 900;
  color: #1f2937;
}
.attention-list {
  margin: .5rem 0 0;
  color: #374151;
  line-height: 1.5;
  list-style: none;
  padding: 0;
}
.attention-list.indented li {
  position: relative;
  padding-left: 1.05rem;
}
.attention-list.indented li:before {
  content: "\2022";
  position: absolute;
  left: 0;
  top: .15em;
  color: #6b7280;
  font-weight: 700;
}
.kpi-chip {
  display: inline-block;
  padding: .15rem .5rem;
  border-radius: 999px;
  font-weight: 700;
  font-size: .85rem;
  background: #e7ecf2;
  color: #2f3b46;
  margin-left: .25rem;
  margin-right: .25rem;
}
.kpi-chip--warn {
  background: #f1d5d5;
  color: #b91c1c;
}
.kpi-chip--ok {
  background: #dcefe3;
  color: #1f5e25;
}
.attention-card--warn {
  --co-accent: #8b1e1e;
  background: #f6eaea;
}
.attention-card--info {
  --co-accent: #2b4c7e;
  background: #e8f0fa;
}
.attention-card--ok {
  --co-accent: #2e7d32;
  background: #e6f4ea;
}
/* ============================================
   Access Hero – Tinted Background (opt-in)
   Usage: <div class="access-hero tinted info|success|alert|neutral">…</div>
   ============================================ */
/* (Optional) baseline so the hero always looks like a card */
.access-hero {
  --ah-bg: #ffffff; /* default: white */
  --ah-border: #e5e7eb; /* light concrete */
  background: var(--ah-bg);
  border: 1px solid var(--ah-border);
  border-radius: 12px;
  padding: 1rem;
}
.form-card {
  background: linear-gradient(180deg, #f7fafd, #ffffff);
  border: 1px solid #d0d6de;
  border-radius: 12px;
  padding: 1rem;
}
/* Turn on the tint */
.access-hero.tinted {
  background: var(--ah-bg-solid) !important; /* solid tint, no gradients */
}
/* Variants (pick one of these as an extra class) */
.access-hero.tinted.neutral {
  --ah-bg-solid: #f2f4f6;
} /* light concrete */
.access-hero.tinted.info {
  --ah-bg-solid: #eef3fb;
} /* steel blue tint */
.access-hero.tinted.success {
  --ah-bg-solid: #eaf5ef;
} /* industrial green tint */
.access-hero.tinted.alert {
  --ah-bg-solid: #fdecec;
} /* industrial red tint */
fieldset.form-element {
  background: #f7fafd;
  border: 1px dashed #d0d6de;
  border-radius: 12px;
  padding: .9rem;
  margin: 1.125rem 0;
}
/* Make Foundation Reveal overlay sit above site chrome */
/*.reveal-overlay { z-index: 1200; }*/
/*.reveal         { z-index: 1201; }*/
.input-error {
  border-color: #dc2626 !important;
}
.field-error {
  display: none;
  color: #b91c1c;
  font-size: .875rem;
  margin-top: .3rem;
}
.field-error.show {
  display: block;
}
/* Attention drawers: rotate caret when open */
.attn-toggle .fa-caret-down {
  transition: transform .15s ease;
}
.attn-toggle[aria-expanded="true"] .fa-caret-down {
  transform: rotate(180deg);
}
/* Chips row + details toggle in Assessments ► Subcontractor cell */
.assess-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .5rem;
  margin-top: .25rem;
}
.assess-header .assess-toggle {
  margin-left: auto;
}
.assess-details[hidden] {
  display: none !important;
}
.assess-toggle {
  appearance: none;
  border: 0;
  background: transparent;
  padding: .15rem 0;
  cursor: pointer;
  font: inherit;
  color: inherit;
  display: inline-flex;
  align-items: center;
}
.assess-toggle:focus {
  outline: 2px solid #111827;
  outline-offset: 2px;
  border-radius: .25rem;
}
/* reuse your existing rotation rule */
.toggle-arrow.rotated {
  transform: rotate(180deg);
  transition: transform .15s ease;
}
/* Chips row + Details toggle (Assessments → Subcontractor cell) */
.assess-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .5rem;
  margin-top: .25rem;
}
.assess-toggle {
  appearance: none;
  border: 0;
  background: transparent;
  padding: .15rem 0;
  cursor: pointer;
  font: inherit;
  color: inherit;
  display: inline-flex;
  align-items: center;
  margin-left: auto;
}
.assess-toggle:focus {
  outline: 2px solid #111827;
  outline-offset: 2px;
  border-radius: .25rem;
}
.assess-details[hidden] {
  display: none !important;
}
/* Chips row + Details toggle (Assessments → Subcontractor cell) */
.assess-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .5rem;
  margin-top: .25rem;
  cursor: pointer; /* whole strip looks clickable */
}
.assess-toggle {
  appearance: none;
  border: 0;
  background: transparent;
  padding: .15rem 0;
  cursor: pointer;
  font: inherit;
  color: inherit;
  display: inline-flex;
  align-items: center;
  margin-left: auto;
}
.assess-toggle:focus {
  outline: 2px solid #111827;
  outline-offset: 2px;
  border-radius: .25rem;
}
.assess-details[hidden] {
  display: none !important;
}
.docs-strip {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font: inherit;
  color: inherit;
}
.docs-strip:focus {
  outline: 2px solid #111827;
  outline-offset: 2px;
  border-radius: .25rem;
}
.docs-details[hidden] {
  display: none !important;
}
.docs-strip .toggle-arrow {
  transition: transform .15s ease;
}
.docs-strip[aria-expanded="true"] .toggle-arrow {
  transform: rotate(180deg);
}
/* === REVEAL FIX PATCH: keep Foundation in control === */
/* Put the overlay above everything and make sure it can receive clicks */
.reveal-overlay {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 10050 !important;
  pointer-events: auto !important;
}
/* Let Foundation handle modal positioning (remove hard top offsets) */
.reveal {
  position: fixed !important;
  top: auto !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  z-index: 10051 !important;
  background-color: #ffffff !important;
  margin-top: 50px !important;	
}

.reveal-overlay {
  background-color: rgba(10, 10, 10, 0.85);
  /*overflow-y: scroll;*/
}
/*.reveal {
  z-index: 1006;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  display: none;
  padding: 2.5rem;
  border: 1px solid #fe1e1e1;
  border-radius: 0;
  background-color: #ffffff;
  position: relative;
  top: 250px;
  margin-right: auto;
  margin-left: auto;
  overflow-y: auto;
}*/
/*.reveal-overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1005;
  display: none;
  background-color: rgba(10, 10, 10, 0.85);
  overflow-y: scroll;
}*/


/* Neutralize the extra per-modal offset */
.reveal.modal_bkg {
  top: auto !important;
}
/* Make sure the × is always clickable and on top of modal content */
.reveal .close-button {
  position: absolute;
  top: .5rem;
  right: .5rem;
  z-index: 10052;
  pointer-events: auto !important;
}
/* While any modal is open, demote nav/menu stacks */
html.is-reveal-open .top-bar-container, html.is-reveal-open #qm3 {
  z-index: 100 !important;
}
#leftNav.menu.vertical {
  gap: .25rem;
}
#leftNav .is-drilldown-submenu {
  border-left: 2px solid rgba(0, 0, 0, .08);
}
#leftNav a {
  display: block;
  padding: .6rem .9rem;
  border-radius: .5rem;
}
#leftNav a:hover, #leftNav a:focus {
  background: rgba(0, 0, 0, .05);
}

.toggle-arrow {
 color: #6b7280;
font-size: 0.750rem;
}

/* Softer zebra stripe for tablesorter tables */
table.tablesorter tbody tr.even > td { background-color: #ffffff !important; } /* base */
table.tablesorter tbody tr.odd  > td { background-color: #fbfcff !important; } /* subtle blue tint */

/* Optional: gentle hover */
table.tablesorter tbody tr:hover > td { background-color: #f6faff !important; }

/* Keep the sticky first column in sync with the row stripe */
.table-scroll table tbody tr.even td:first-child { background-color: #ffffff !important; }
.table-scroll table tbody tr.odd  td:first-child { background-color: #fbfcff !important; }

/* Ensure the Reveal close button is not an overlay */
.reveal .close-button{
  position: absolute;
  top: .5rem;
  right: .5rem;
  width: auto;
  height: auto;
  padding: .25rem .5rem;
  line-height: 1;
  z-index: 3; /* above content but not covering it */
}

/* Optional: scope any existing wide close styles to off-canvas only */
.off-canvas .close-button {
  /* your off-canvas-specific sizing here if you have one */
}

/* ===== Select text clipping fixes (Foundation Reveal) ===== */

/* Ensure the modal can show the full control box */
.reveal.modal_bkg { overflow: visible; }

/* Make labels block so selects don't fight for height */
.reveal label { display: block; }

/* Normalize all single-line controls in modals */
.reveal input[type="text"],
.reveal input[type="email"],
.reveal input[type="number"],
.reveal input[type="tel"],
.reveal input[type="url"],
.reveal input[type="datetime-local"],
.reveal select {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  font-size: 16px;          /* prevents iOS zoom + clipping */
  line-height: 1.35;        /* allow ascenders/descenders */
  min-height: 2.5rem;       /* predictable box */
  padding: .5rem .75rem;    /* adequate vertical breathing room */
}

/* Specific tweaks for selects (native look, no custom arrow) */
.reveal select {
  -webkit-appearance: menulist;
  appearance: menulist;
  background-clip: padding-box;
  padding-right: 2.25rem;   /* room for native arrow */
}

/* If a global rule forces a fixed height/line-height, overrule it */
.reveal select,
.reveal input,
.reveal textarea {
  height: auto !important;
  line-height: 1.35 !important;
}

/* Safari/iOS safeguard: keep form text at >=16px to avoid zoom + crop */
@supports (-webkit-touch-callout: none) {
  .reveal select,
  .reveal input,
  .reveal textarea { font-size: 16px; }
}

/* Contact tab + modals: fix cropped select text */
#tab-contact label,
.reveal label { display:block; }

#tab-contact select,
.reveal select {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  font-size: 1rem;
  line-height: 1.5;
  padding: .5rem .9rem .5rem .75rem;
  height: auto !important;                 /* beat Foundation’s fixed 2.4375rem */
  min-height: calc(1.5em + 1rem + 2px);    /* line-height + vertical padding + borders */
  -webkit-appearance: menulist;
  appearance: menulist;
  background-origin: content-box;
  background-position: right .75rem center; /* avoid negative offset */
  background-repeat: no-repeat;
  background-size: 9px 6px;
}

/* Make sure the modal doesn’t clip controls */
.reveal.modal_bkg {
	overflow: visible;
  max-height: calc(100dvh - 3rem);  /* fit within viewport with some margin */
  overflow-y: auto;                  /* show vertical scrollbar as needed */
  -webkit-overflow-scrolling: touch; /* smooth scroll on iOS */
  overscroll-behavior: contain;      /* don't scroll the page behind */
}



/* Contact tab: form clarity + select text no-clip */
#tab-contact label { display:block; }
#tab-contact select {
  height: auto !important;
  min-height: calc(1.5em + 1rem + 2px);
  line-height: 1.5 !important;
  padding: .5rem .9rem .5rem .75rem;
  background-position: right .75rem center;
  background-repeat: no-repeat;
  background-size: 9px 6px;
  -webkit-appearance: menulist;
  appearance: menulist;
}

a.more_space_top_link {
  margin-top: 1rem;
}

/* ====== Expanded row (inline) + More panel polish ====== */
.table-inline-row td,
.table-actions-row td {
  padding: 0 !important;
  background: #f8fafc;
  border-top: 1px solid #e5e7eb;
}

.table-inline-panel { background: #f8fafc; }
.table-inline-panel .inline-shell { padding: 16px 16px 12px; }

.inline-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 1rem; margin-bottom: 10px;
}
.inline-title { font-weight: 700; font-size: 1.05rem; color: #0f172a; }
.inline-sub   { font-size: .875rem; color: #6b7280; }
.inline-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.inline-actions .button.tiny.secondary i { margin-right: .35rem; }

/* --- Docs details: comfortable, legible list items --- */
.docs-details { margin-top: .4rem; }

.docs-details .js-docs-list { 
  margin: .25rem 0 0; 
  padding: 0;
}

.docs-details .js-docs-list li {
  /* Layout */
  display: flex;
  flex-wrap: wrap;                 /* so actions wrap nicely on small screens */
  align-items: flex-start;
  gap: .35rem .6rem;               /* row/column gaps */
  
  /* Spacing + visuals */
  padding: .45rem .6rem;
  margin-bottom: .45rem;
  background: #FBFBFC;
  border: 1px solid #E7E7EC;
  border-radius: .55rem;
}

.docs-details .js-docs-list li i.icon_width_more {
  color: #8E8E95;
  margin-top: .15rem;              /* align icon with text cap-height */
  width: 1.1em;                    /* consistent icon column */
  flex: 0 0 auto;
}

.docs-details .js-docs-list .doc-name {
  font-weight: 600;
  line-height: 1.25;
  flex: 1 1 auto;                  /* take remaining space before actions */
  min-width: 12ch;                 /* prevents over-squeeze before wrapping */
}

/* Actions = subtle “pills” with clear separation from the title */
.docs-details .js-docs-list a.tiny-link {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .18rem .5rem;
  border: 1px solid #D7D7DC;
  border-radius: .45rem;
  text-decoration: none;
  line-height: 1.2;
  background: #F6F6F9;
  transition: background .15s ease, border-color .15s ease, transform .02s;
}

/* ensure there’s space before the first action even if markup keeps “·” */
.docs-details .js-docs-list .doc-name + a.tiny-link { 
  margin-left: .25rem; 
}

/* space between Request and Upload */
.docs-details .js-docs-list a.tiny-link + a.tiny-link { 
  margin-left: .25rem; 
}

.docs-details .js-docs-list a.tiny-link:hover {
  background: #F0F0F6;
  border-color: #C8C8D0;
}

.docs-details .js-docs-list a.tiny-link:active {
  transform: translateY(1px);
}

/* === Details: Missing / Expired Documents — comfy layout & spacing === */
.docs-details .js-docs-list{
  margin: .5rem 0 0;
  padding: 0;
  list-style: none;
}

.docs-details .js-docs-list > li {
  display: flex;
  flex-wrap: wrap;                /* allow wrap on narrow screens */
  align-items: center;
  gap: .5rem .75rem;              /* row / column gaps */
  padding: .5rem .75rem;
  margin-bottom: .5rem;
  background: #fbfbfc;
  border: 1px solid #e6e7eb;
  border-radius: .6rem;
}

/* Icon column (when present) */
.docs-details .js-docs-list > li > i{
  width: 1.1em;                   /* consistent icon width */
  color: #8e8e95;
  flex: 0 0 auto;
  margin-top: .1rem;
}

/* Title takes the available space */
.docs-details .js-docs-list .doc-name{
  font-weight: 600;
  line-height: 1.25;
  flex: 1 1 auto;
  min-width: 12ch;                /* prevents over-squeeze */
}

/* Actions: works whether they’re wrapped or direct links */
.docs-details .js-docs-list > li > a.tiny-link,
.docs-details .js-docs-list > li > div > a.tiny-link{
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin-left: .25rem;            /* separation from title */
  padding: .2rem .55rem;
  line-height: 1.2;
  text-decoration: none;          /* we’ll use a pill look */
  border: 1px solid #d7d9df;
  border-radius: .45rem;
  background: #f6f7fb;
  transition: background .15s ease, border-color .15s ease, transform .02s;
}

/* Space between Request & Upload */
.docs-details .js-docs-list > li a.tiny-link + a.tiny-link,
.docs-details .js-docs-list > li > div > a.tiny-link + a.tiny-link{
  margin-left: .35rem;
}

.docs-details .js-docs-list > li a.tiny-link:hover{
  background: #eff1f7;
  border-color: #c8cbd4;
}
.docs-details .js-docs-list > li a.tiny-link:active{ transform: translateY(1px); }

/* Mobile: stack actions underneath gracefully */
@media (max-width: 42rem){
  .docs-details .js-docs-list > li{
    gap: .4rem .5rem;
  }
}

/* ===== Details panel: Missing / Expired Documents ===== */
.inline-section.is-docs .docs-rows{
  margin: .5rem 0 0;
  padding: 0;
  list-style: none;
}

.inline-section.is-docs .docs-rows > .doc-row{
  display: flex;
  flex-wrap: wrap;                 /* wrap actions on narrow screens */
  align-items: center;
  gap: .5rem .75rem;               /* row / column gaps */
  padding: .55rem .75rem;
  margin-bottom: .55rem;
  background: #fbfbfc;
  border: 1px solid #e6e7eb;
  border-radius: .6rem;
}

.inline-section.is-docs .docs-rows > .doc-row .doc-name{
  font-weight: 600;
  line-height: 1.25;
  flex: 1 1 auto;                  /* title grows; actions sit to the right */
  min-width: 12ch;                 /* prevents over-squeeze before wrap */
}

/* Actions container */
.inline-section.is-docs .docs-rows > .doc-row .doc-actions{
  display: inline-flex;
  gap: .4rem;                      /* space between Request / Upload */
  flex: 0 0 auto;
}

/* Turn the action links into compact pills */
.inline-section.is-docs .doc-actions .q-btn.tiny.link{
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .22rem .6rem;
  line-height: 1.2;
  text-decoration: none;
  border: 1px solid #d7d9df;
  border-radius: .45rem;
  background: #f6f7fb;
  transition: background .15s ease, border-color .15s ease, transform .02s;
}

.inline-section.is-docs .doc-actions .q-btn.tiny.link:hover{
  background: #eff1f7;
  border-color: #c8cbd4;
}
.inline-section.is-docs .doc-actions .q-btn.tiny.link:active{
  transform: translateY(1px);
}

/* Keep icon spacing tidy */
.inline-section.is-docs .doc-actions .q-btn.tiny.link i{
  margin-right: .25rem;
}

/* Mobile: stack actions under the title neatly */
@media (max-width: 42rem){
  .inline-section.is-docs .docs-rows > .doc-row{
    gap: .4rem .5rem;
  }
  .inline-section.is-docs .docs-rows > .doc-row .doc-actions{
    width: 100%;
    justify-content: flex-start;
  }
}

.js-docs-count {
padding-left: .625em;
}

.table-inline-panel .mini-h
 {
    font-weight: 800;
    color: #0f172a;
    margin: 0 0 .35rem;
	font-size: 1.25rem; 
}

.inline-section .q-kind--ohs .q-icon {
    background: #dde0e3;
    border-color: #cbd5e1;
}

/* ==== START: doc rows + chips (questionnaires/docs) ==== */
/*.inline-section.is-docs { margin-top:.5rem; }*/
ul.docs-rows { list-style:none; margin:0; padding:0; }
ul.docs-rows > li.doc-row {
  display: flex;
  flex-wrap: wrap;          /* allow the attribution to wrap under */
  align-items: center;      /* nice vertical alignment */
  gap: .5rem .75rem;
  padding: .5rem .75rem;
  border: 1px solid #e5e5e5;
  border-radius: .5rem;
  margin-bottom: .5rem;
  background: #fff;
}
ul.docs-rows > li.doc-row > .cell { min-width: 0; }     /* prevent squish overflow */
ul.docs-rows > li.doc-row .doc-actions { white-space: nowrap; }
@media (max-width:640px){
  ul.docs-rows > li.doc-row .doc-actions{ width:100%; margin-left:0; justify-content:flex-start; }
}
ul.docs-rows .doc-name { font-weight:600; }
ul.docs-rows .doc-meta { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; }
ul.docs-rows .doc-actions { margin-left:auto; display:flex; gap:.75rem; }
ul.docs-rows .doc-attrib { color:#6a6a6a; font-size:.85rem; }

/* chips */
.chip{display:inline-block;padding:.15rem .5rem;border-radius:999px;font-size:.8rem;font-weight:600;border:1px solid transparent}
.chip--ok{background:#ecfdf5;border-color:#d1fae5;color:#065f46}
.chip--warn{background:#fff7ed;border-color:#ffedd5;color:#9a3412}
.chip--info{background:#eff6ff;border-color:#dbeafe;color:#1e3a8a}
.chip--muted{background:#f3f4f6;border-color:#e5e7eb;color:#374151}
/* ==== END: doc rows + chips ==== */

/* ---- Header Active/Inactive switch (visual only) ---- */
.switch.switch--status {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  cursor: not-allowed; /* visual only for now */
}
.switch.switch--status .switch-label { font-weight: 600; color: #1e1e1e; }
.switch.switch--status input { display: none; }
.switch.switch--status .slider {
  position: relative; display: inline-block; width: 46px; height: 24px;
  background: #c7c7c7; border-radius: 999px; transition: background .2s;
}
.switch.switch--status .slider:before {
  content: ""; position: absolute; width: 20px; height: 20px; left: 2px; top: 2px;
  background: #fff; border-radius: 50%; transition: transform .2s;
}
.switch.switch--status input:checked + .slider { background: #1473e6; }
.switch.switch--status input:checked + .slider:before { transform: translateX(22px); }

/* Spacing helpers */
.mr-10 { margin-right: .625rem; } .ml-10 { margin-left: .625rem; }
.mb-0{margin-bottom:0}.mb-5{margin-bottom:.313rem}.mb-10{margin-bottom:.625rem}
.mt-10{margin-top:.625rem}

/* Tiny “Requested” chip used in Missing/Expired docs card */
.chip-requested {
  display:inline-block; padding:.2rem .45rem; border-radius:999px;
  font-size:.72rem; font-weight:600; margin-left:.4rem; line-height:1;
  background:#fff7ed; border:1px solid #fdba74; color:#9a3412;
}

/* Ensure both class orders look the same */
.button.primary.hollow,
.button.hollow.primary {
  background: transparent;
  border: 1px solid #1473e6; /* Foundation primary */
  color: #1473e6;
}
.button.primary.hollow:hover,
.button.hollow.primary:hover {
  background: rgba(23,121,186,0.06);
}

/* Keep modal above overlay and intercept clicks correctly */
.reveal-overlay { z-index: 1000; }
.reveal { z-index: 1001; }

/* Apply the same soft card-row look to one-off rows (e.g., Compliance items) */
.card .inline-section.is-docs .doc-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem .75rem;
    padding: .55rem .75rem;
    margin-bottom: .55rem;
	margin: .5rem 0 0;
    background: #fbfbfc;
    border: 1px solid #e6e7eb;
    border-radius: .6rem;
    text-align: left;
}
/* Inline actions (inside a cell) */
.table-actions-list--inline {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem .5rem;
  padding: 0;
  margin: 0;
  list-style: none;
}
.table-actions-list--inline a {
  appearance: none;
  border: 1px solid var(--line);
  background: var(--chip-bg);
  color: var(--ink);
  font-weight: 600;
  font-size: .95rem;
  line-height: 1.2;
  border-radius: 999px;
  padding: .6rem .9rem;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  text-decoration: none;
  cursor: pointer;
  transition: transform .03s ease, background-color .15s, border-color .15s, color .15s;
}
.table-actions-list--inline a:focus {
  outline: 0;
  box-shadow: 0 0 0 3px var(--ring);
  background: #fff;
}
@media (hover:hover){
  .table-actions-list--inline a:hover{
    background:#fff; border-color:#cbd5e1;
  }
}
.table-actions-list--inline [data-variant="primary"]{ background:var(--brand); border-color:var(--brand); color:#fff; }
.table-actions-list--inline [data-variant="ok"]     { background:var(--ok-50); border-color:#86efac; color:var(--ok); }
.table-actions-list--inline [data-variant="warn"]   { background:var(--warn-50); border-color:#fed7aa; color:var(--warn); }
.table-actions-list--inline [data-variant="danger"] { background:var(--danger-50); border-color:#fecaca; color:var(--danger); }
.table-actions-list--inline i { font-size: 1rem; opacity: .9; }
/* Collapsible inline actions for Assessments */
.table-actions-list--inline.is-collapsed { display: none; }