/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --thm-orange: #fdf2ee;
  --thm-pink: #fdf2ee;
  --thm-dark-blue: #1F0230;
  --thm-dark-green: #023020;
  --thm-blue-1: #3e3a59;
  --thm-blue-2: #5c5973;
  --thm-blue-3: #7a788d;
  --thm-blue-4: #9896a7;
  --thm-blue-5: #b7b6c1;
  --thm-blue-6: #d6d5dc;
  --thm-white: #ffffff;
  --thm-green: #55aca2;
  --thm-light-green: #eff9f8;
  --thm-grey: #ededed;
  --thm-mid-grey: #ddd;
  --thm-light-grey: #f0f0f0;
  --thm-pink: #f5e4e8;
  --thm-dark-pink: #BFA2B4;
}  

@media (max-width: 768px) {
  .responsive-section {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
  .responsive-section > div {
    width: 100% !important;
    max-width: 100% !important;
  }
}


html {
  /* background: radial-gradient(circle at left top, #151241 20%, #6ec8b9 75%) no-repeat; */
  width: 100vw;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
body {
  overflow: hidden;
  color: var(--thm-dark-blue);
}
table {
  overflow-x: auto;
  max-width: 94vw;
  display: block;
  font-size: 0.9rem;
}
table tr {
  vertical-align: top;
}
td.is-active {
  background-color: var(--thm-light-green);
}
tr.selected td {
  background-color: var(--thm-pink);
}
::-moz-selection { /* Code for Firefox */
  color: var(--thm-dark-blue);
  background: var(--thm-dark-pink);
}

::selection {
  color: var(--thm-dark-blue);
  background: var(--thm-dark-pink);
}

.site-construction-notice {
  text-align: center;
  padding: 0px 5vw;
  background: var(--thm-dark-blue);
}
.site-construction-notice p {
  color: var(--thm-white);
  -webkit-margin-before: 0;
  margin-block-start: 0;
  -webkit-margin-after: 0;
  margin-block-end: 0;
}

.path-frontpage a.logo  {
  pointer-events: none;
  cursor:default;
}
.red-alert {
  background: var(--thm-pink);
  font-weight: bold;
  color: var(--thm-dark-blue);
  padding: 1em;
}
main {
  margin-top: 0 !important;
}
body.maintenance-page.path-frontpage.page-node-type-thm-page {
  color: var(--thm-white);
  padding: 5vw;
  text-align: center;
}
.toolbar-tray a {
  font-family: 'Open Sans', sans-serif;
  font-weight: normal;
}
.toolbar a {
  font-family: 'Open Sans', sans-serif;
  font-weight: normal;
}
.toolbar .toolbar-bar .toolbar-tab > .toolbar-item {
  font-weight: bold;
  font-family: 'Open Sans', sans-serif;
}
input#edit-pass, input#edit-name {
  text-align: center;
}
.cv-search input#edit-name {
  text-align: left;
}

.red-text {
  color: var(--thm-dark-blue);
}
.text-red {
  color: red;
}

form#user-login-form {
  /* margin: 3vw auto; */
  text-align: center;
  /* width: 280px; */
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  
}

.swal2-popup .swal2-title {
  font-size: 1.2em!important;
}
.swal2-popup .swal2-title .visually-hidden + br {
  display: none;
}

.js-form-item.form-item.js-form-type-textarea.form-type-textarea.js-form-item-please-state-why-you-want-to-apply-for-this-job.form-item-please-state-why-you-want-to-apply-for-this-job {
  display: none;
}
.form-actions.js-form-wrapper.form-wrapper {
  text-align: left;
} 


/*Block*/
.job-count-block {
  background: #f8f8f8;
  padding: 18px 24px;
  border-radius: 6px;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  color: #222;
  margin-bottom: 20px;
}

/* Job Application Form*/
.job-application-wrapper {
  max-width: 700px;
  margin: 0 auto;
  padding: 40px 20px;
}


/* Job Preferences Form*/
/* Center the whole form nicely */
.job-preferences-form {
  max-width: 760px;     /* or 640–840px */
  margin: 0 auto;
  padding: 0 16px;      /* small side padding for mobile */
  box-sizing: border-box;
}

/* Labels / titles */
.job-preferences-form label,
.job-pref-title {
  color: #023030;
  font-weight: 600;
  text-align: left;     /* change to center if you want titles centered */
}

/* Make fields full width */
.job-preferences-form textarea,
.job-preferences-form input[type="text"],
.job-preferences-form input[type="email"],
.job-preferences-form input[type="file"] {
  width: 100%;
}

/* Button */
.job-preferences-form input[type="submit"] {
  background: #023030;
  color: #fff;
  border: 0;
  padding: 10px 18px;
  border-radius: 4px;
}
.job-preferences-form input[type="submit"]:hover {
  filter: brightness(1.1);
}

/* ===== Job Preferences Form Styling ===== */
.job-preferences-form {
  max-width: 900px;
  margin: 2rem auto;
  background: #ffffff;
  padding: 2rem 2.5rem;
  border-radius: 12px;
  box-shadow: 0 4px 24px rgba(0,0,0,0.06);
  font-family: 'Open Sans', sans-serif;
}

/* Spacing between form items */
.job-preferences-form .form-item {
  margin-bottom: 1.5rem;
}

/* Labels */
.job-preferences-form label {
  font-weight: 600;
  color: #003c37; /* Adjust to your brand color */
  display: block;
  margin-bottom: 0.4rem;
  font-size: 0.95rem;
}

/* Text inputs, textarea, file upload */
.job-preferences-form input[type="text"],
.job-preferences-form input[type="email"],
.job-preferences-form input[type="file"],
.job-preferences-form textarea,
.job-preferences-form select {
  width: 100%;
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 0.7rem;
  font-size: 0.95rem;
  background-color: #fafafa;
  transition: border-color 0.2s ease-in-out, background-color 0.2s;
}

.job-preferences-form input:focus,
.job-preferences-form textarea:focus,
.job-preferences-form select:focus {
  border-color: #00796b;
  background-color: #fff;
  outline: none;
}

/* Hide admin-like elements */
.job-preferences-form .form-item-display,
.job-preferences-form .form-item-description,
.job-preferences-form .field--label-hidden > label,
.job-preferences-form .tabledrag-toggle-weight-wrapper {
  display: none !important;
}

/* Add another item button */
.job-preferences-form .field-add-more-submit {
  background-color: #023030;
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 0.5rem 1.2rem;
  cursor: pointer;
  font-weight: 600;
  font-size: 0.9rem;
}

.job-preferences-form .field-add-more-submit:hover {
  background-color: #023030;
}

/* Remove buttons */
.job-preferences-form input[value="Remove"] {
  background-color: #023030;
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 0.4rem 1rem;
  margin-top: 0.5rem;
  cursor: pointer;
  font-size: 0.85rem;
}

.job-preferences-form input[value="Remove"]:hover {
  background-color: #023030;
}

/* Save button */
.job-preferences-form input[type="submit"],
.job-preferences-form button[type="submit"] {
  background-color: #023030;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  padding: 0.8rem 2rem;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  width: 100%;
  transition: background-color 0.2s ease-in-out;
}

.job-preferences-form input[type="submit"]:hover {
  background-color: #023030;
}

/* Section headings */
.job-preferences-form h2,
.job-preferences-form h3 {
  font-weight: 700;
  color: #002f2c;
  margin-bottom: 0.75rem;
}

/* File upload field tweaks */
.job-preferences-form .js-form-managed-file {
  border: 1px dashed #ccc;
  padding: 1rem;
  border-radius: 6px;
  background: #fafafa;
}

.job-preferences-form .file {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Align file name and remove button better */
.job-preferences-form .file > a {
  flex-grow: 1;
}

/* Optional: hover effect for form area */
.job-preferences-form:hover {
  box-shadow: 0 6px 28px rgba(0,0,0,0.08);
}

/* Hide 'Cancel account' button on user forms */
.user-form #edit-cancel,
form.user-form input#edit-cancel {
  display: none !important;
}

/* Job Preferences Form */
/* Center the whole form nicely */
.job-preferences-form {
  max-width: 650px;
  margin: 0 auto;
  background: #fff;
  padding: 2rem;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
} 

/* Add spacing between input field and Remove button */
.job-preferences-form .form-item input.form-text {
  width: calc(100% - 140px); /* leaves room for the Remove button */
  display: inline-block;
  margin-right: 10px; /* space between input and Remove */
  padding: 6px 10px; /* reduce vertical padding for compact look */
}

/* Style the Remove button */
.job-preferences-form .form-item .button--danger,
.job-preferences-form .form-item .remove-button,
.job-preferences-form input[value="Remove"] {
  margin-top: 4px; /* slight vertical alignment tweak */
}

/* Add spacing between "Please upload your CV" and Remove button */
.job-preferences-form .field--name-field-upload-cv .file-widget {
  margin-bottom: 12px; /* adds some breathing room */
}

/* Reduce height of CV description box */
.job-preferences-form .field--name-field-upload-cv textarea {
  min-height: 40px; /* smaller box height */
  padding: 6px 8px;
}

/* Compact the entire upload section */
.job-preferences-form .field--name-field-upload-cv {
  padding: 10px;
}

/* Optional: tighten up file field box border and spacing */
.job-preferences-form .field--name-field-upload-cv .form-managed-file {
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 10px;
  margin-bottom: 15px;
}


/* Hide 'File information' and 'Operations' headers */
.job-preferences-form .field--name-field-upload-cv table th {
  display: none !important;
}

/* Remove borders and tighten spacing for the CV upload table rows */
.job-preferences-form .field--name-field-upload-cv table td {
  border-top: none !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

/* Optional: tighten the overall upload field box */
.job-preferences-form .field--name-field-upload-cv .form-managed-file {
  margin-top: 6px !important;
  margin-bottom: 10px !important;
  padding: 8px !important;
  border-radius: 6px;
}

/* Optional: adjust spacing between upload field and Remove button */
.job-preferences-form .field--name-field-upload-cv input[type="file"] {
  margin-right: 8px;
}

/* Optional: tweak the Remove button alignment */
.job-preferences-form .field--name-field-upload-cv input[value="Remove"] {
  margin-top: 2px;
}  
 
/* Hide only the drag handles, not the whole rows */
.job-preferences-form .tabledrag-handle {
  display: none !important;
}

/* Optional: remove extra spacing left behind */
.job-preferences-form tr.draggable td:first-child {
  padding-left: 0 !important;
  width: auto !important;
}
 
.job-preferences-form .field--name-field-locations .description {
  font-weight: 600;
  color: #004d40; /* same as label color */
  font-size: 1rem;
  margin-bottom: 0.5rem;
  display: block;
}


 
/* Blog page styles 2025 */
/* Blog wrapper: controls width and centering on page */
.node--type-thm-blog {
  max-width: 66%;   /* roughly 1/3 padding on each side */
  margin: 0 auto;   /* center the block */
  padding: 0 2%;    /* little breathing room */
}

/* Headings (H2s) inside blogs */
.node--type-thm-blog h2 {
  text-align: center;
  color: #023020;
  font-size: 28px;
  margin: 40px 0 24px;
}

/* Optional: also style H1 (main blog title) */
.node--type-thm-blog h1 {
  text-align: center;
  color: #023020;
  margin: 20px 0 40px;
}



/*new CSS STYLING */
.new-buttons-unhidden {
  background-color: var(--brand);
  color: #fff;
  text-decoration: none;
  padding: 8px 12px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  display: inline-block; /* ensures padding applies well */
}

.new-buttons-unhidden:hover {
  opacity: 0.9;
}

.view-id-matches .new-buttons-unhidden a,
.view-id-matches a.new-buttons-unhidden,
.view-id-matches .new-buttons-unhidden .btn {
  background:#fff !important;
  color:#023020 !important;
  border:2px solid #023020;
  border-radius:10px;
  padding:8px 12px;
  font-weight:600;
}

.view-id-matches { color:#023020; }
.view-id-matches a:not(.new-buttons-unhidden) { color:#023020; }




/* Only on the quick-register page (Drupal adds this body class) */
body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"] {
  /* middle third: 34% width, 33% margins */
  width: 34%;
  margin-left: 33%;
  margin-right: 33%;
  padding: 0;            /* don't use huge side padding */
  box-sizing: border-box;
}

/* Make inputs/selects stretch to the column width */
body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"]
  input[type="text"],
body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"]
  input[type="email"],
body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"]
  input[type="tel"],
body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"]
  select,
body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"]
  textarea {
  width: 100%;
  max-width: 100%;
}

/* Style the "Add another item" and "Remove" buttons on multi-value fields */
body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"]
  .field-add-more-submit.button,
body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"]
  .field-remove-button.button {
  background: #2a9d8f;
  color: #fff;
  border: 0;
  border-radius: 4px;
  padding: .5rem .9rem;
  font-size: .95rem;
  cursor: pointer;
}

body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"]
  .field-add-more-submit.button:hover,
body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"]
  .field-remove-button.button:hover {
  filter: brightness(.92);
}

body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"]
  .field-add-more-submit.button,
body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"]
  .field-remove-button.button {
  background: #2a9d8f !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 4px !important;
  padding: .5rem .9rem !important;
  font-size: .95rem !important;
  cursor: pointer !important;
}

body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"]
  .field-add-more-submit.button:hover,
body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"]
  .field-remove-button.button:hover {
  filter: brightness(.92) !important;
}


/* Mobile: let it breathe */
@media (max-width: 900px) {
  body.path-candidate-quick-register
    form[data-drupal-selector="user-quick-registration-form"] {
    width: 92%;
    margin: 0 auto;
  }
}

body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] 
.field-multiple-drag, 
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] 
.tabledrag-toggle-weight {
  display: none !important;
}

/* Scope to quick registration form only */
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] .form-item {
  margin-bottom: 1.5rem; /* More breathing room between fields */
}

/* Make dropdowns and inputs align in width */
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] select,
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] input[type="text"],
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] input[type="number"],
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] input[type="file"] {
  width: 100%;
  max-width: 500px; /* Keeps it from stretching too wide */
}

/* Align currency symbol on salary field */
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] .form-item-desired-salary {
  display: flex;
  align-items: center;
}

body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] .form-item-desired-salary input {
  margin-left: 0.25rem;
}


/* Only affects the quick-registration form */
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] .form-item {
  margin-bottom: 1.5rem; /* more breathing room between fields */
}

body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] select,
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] input[type="text"],
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] input[type="number"],
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] input[type="file"] {
  width: 100%;
  max-width: 500px; /* keeps it from getting too wide */
}

/* Example tweak for the desired salary field so the £ aligns nicely */
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] .form-item-desired-salary {
  display: flex;
  align-items: center;
}

body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] .form-item-desired-salary input {
  margin-left: 0.25rem;
}


/* Only affects the quick-registration form */
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] .form-item {
  margin-bottom: 1.5rem; /* more breathing room between fields */
}

body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] select,
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] input[type="text"],
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] input[type="number"],
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] input[type="file"] {
  width: 100%;
  max-width: 500px; /* keeps it from getting too wide */
}

/* Example tweak for the desired salary field so the £ aligns nicely */
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] .form-item-desired-salary {
  display: flex;
  align-items: center;
}

body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] .form-item-desired-salary input {
  margin-left: 0.25rem;
}


/* Scope to the quick registration form only */
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] .form-item {
  margin-bottom: 1.5rem; /* add spacing between fields */
}

body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] select,
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] input[type="text"],
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] input[type="number"],
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] input[type="file"] {
  width: 100%;
  max-width: 500px; /* keep it neat */
}

/* Example tweak so the £ symbol sits nicely with the salary input */
body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] .form-item-desired-salary {
  display: flex;
  align-items: center;
}

body.path-candidate-quick-register 
form[data-drupal-selector="user-quick-registration-form"] .form-item-desired-salary input {
  margin-left: 0.25rem;
}


/* Scope: only the Quick Registration form */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] {

  /* Make the column centered & tight */
  width: 34%;
  margin: 0 33%;
  padding: 0;
  box-sizing: border-box;
}

/* Inputs full width */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
input[type="text"],
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
input[type="email"],
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
input[type="tel"],
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
input[type="number"],
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
input[type="file"],
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
select,
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
textarea {
  width: 100%;
  max-width: 100%;
}

/* Tidy spacing between fields */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] .form-item {
  margin-bottom: 1.5rem;
}

/* Hide row weights / drag */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] .field-multiple-drag,
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] .tabledrag-toggle-weight {
  display: none !important;
}

/* --- Buttons: Add another item, Remove, and Save --- */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] .field-add-more-submit.button,
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] .field-remove-button.button,
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] .form-actions .button,
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] [data-drupal-selector="edit-submit"] {
  background: #2a9d8f;
  color: #fff;
  border: 0;
  border-radius: 4px;
  padding: .5rem .9rem;
  font-size: .95rem;
  line-height: 1.2;
  cursor: pointer;
  text-decoration: none;
}

/* Hover/focus */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] .field-add-more-submit.button:hover,
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] .field-remove-button.button:hover,
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] .form-actions .button:hover,
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] [data-drupal-selector="edit-submit"]:hover {
  filter: brightness(.92);
}

/* Spacing between the text box and the Remove button */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] .field-remove-button.button {
  margin-left: .75rem;        /* <- gap you asked for */
  vertical-align: middle;     /* aligns with the input */
}

/* Mobile layout */
@media (max-width: 900px) {
  body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"] {
    width: 92%;
    margin: 0 auto;
  }
}

/* -- 2) One line per item: input + Remove button -- */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field--name-field-job-titles-youre-looking-f .form-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;             /* spacing between input and Remove */
  margin-bottom: 1rem;
}

/* Input: take the space, same width each row */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field--name-field-job-titles-youre-looking-f .form-item input[type="text"] {
  flex: 1 1 auto;           /* fill remaining width */
  min-width: 0;             /* avoid overflow */
}

/* Remove button: same green style + no stretching */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field--name-field-job-titles-youre-looking-f .field-remove-button.button {
  flex: 0 0 auto;           /* keep natural width */
  background: #2a9d8f;
  color: #fff;
  border: 0;
  border-radius: 4px;
  padding: .5rem .9rem;     /* consistent padding */
  font-size: .95rem;
  line-height: 1.2;
  cursor: pointer;
  text-decoration: none;
}
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field--name-field-job-titles-youre-looking-f .field-remove-button.button:hover {
  filter: brightness(.92);
}

/* Add Another Item: keep the same green style */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field--name-field-job-titles-youre-looking-f .field-add-more-submit.button {
  background: #2a9d8f;
  color: #fff;
  border: 0;
  border-radius: 4px;
  padding: .6rem 1rem;
  font-size: .95rem;
  line-height: 1.2;
}

/* Optional: keep the whole form column tidy */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] {
  width: 34%;
  margin: 0 33%;
  box-sizing: border-box;
}
@media (max-width: 900px) {
  body.path-candidate-quick-register
  form[data-drupal-selector="user-quick-registration-form"] {
    width: 92%;
    margin: 0 auto;
  }
}


/* Scope: Quick Registration form */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"] .field--name-field-jobs-looking-for > .field-label {
  display: block;                /* make it a proper block heading */
  font-weight: bold;              /* match other headings */
  font-size: 1.1rem;               /* adjust to match */
  color: #333;                     /* change from green to your form heading color */
  margin-bottom: .5rem;            /* spacing before input */
  text-transform: none;            /* keep normal casing */
}

/* Scope: Quick Registration form, Job Titles field only */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field--name-field-job-titles-youre-looking-f .form-item {
  display: block;                 /* stack input and button */
  margin-bottom: 1rem;
}

/* Make the text box full width (override earlier max-width: 500px) */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field--name-field-job-titles-youre-looking-f .form-item input[type="text"] {
  width: 100%;
  max-width: 100%;                /* override */
  box-sizing: border-box;
}

/* Put Remove below the input, same style as other green buttons */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field--name-field-job-titles-youre-looking-f .field-remove-button.button {
  display: inline-block;          /* sits on its own line */
  margin-top: .6rem;              /* spacing from the input */
  background: #2a9d8f;
  color: #fff;
  border: 0;
  border-radius: 4px;
  padding: .6rem 1rem;
  font-size: .95rem;
  line-height: 1.2;
  cursor: pointer;
  text-decoration: none;
}
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field--name-field-job-titles-youre-looking-f .field-remove-button.button:hover {
  filter: brightness(.92);
}



/* form#user-login-form label, form#user-login-form .description {
  color: var(--thm-white);
  
} */
input[type="submit"],
.button {
  padding: 5px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 3px;
  border: 0;
  min-width: 130px;
  margin-top:20px;
  padding: 5px 10px;
  font-size: 1em;
  transition: all 0.3s;
}
input[type="submit"]:hover,
.button:hover {
  background-color: var(--thm-dark-blue);
  transition: all 0.3s;
}

/* Quick Registration: normalize field headings */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field--name-field-job-titles-youre-looking-for > .field__label,
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field--name-field-job-titles-youre-looking-for > .field-label,
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field--name-field-job-titles-youre-looking-for legend {
  display: block;
  font-weight: 700;
  font-size: 1rem;        /* match your other labels */
  color: #222 !important; /* beat theme color */
  text-align: left !important;
  text-transform: none;
  margin: 0 0 .5rem;
}

/* Same look for Add + Remove */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field-add-more-submit.button,
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field-remove-button.button {
  background: #2a9d8f;
  color: #fff;
  border: 0;
  border-radius: 6px;      /* rounded edges */
  padding: .6rem 1rem;
  font-size: .95rem;
  line-height: 1.2;
  cursor: pointer;
  text-decoration: none;
  -webkit-appearance: none; /* kill default button look */
  appearance: none;
}

body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field-remove-button.button:hover,
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field-add-more-submit.button:hover {
  filter: brightness(.92);
}

/* If Remove sits beside the input */
body.path-candidate-quick-register
form[data-drupal-selector="user-quick-registration-form"]
.field--name-field-job-titles-youre-looking-for .form-item {
  display: flex;
  align-items: center;
  gap: .75rem;             /* keeps a nice gap */
}


.jgforms select {
  margin-bottom: 0px;
  margin-top: 10px;
  width: 100%;
  display: block;
  min-width: 250px;
  max-width: 400px;
  height: 30px;
}
.jgforms .form-left a:link{
  /* color: white; */
  text-decoration: underline;
}

.jgforms a [role="button"] {
  color: var(--thm-dark-blue);
}

tr.odd .form-item, tr.even .form-item {
  margin-top: 5px;
  margin-bottom: 0;
}

.center {
  text-align: center;
}

body{
  padding: 0;
  margin: 0;
  font-size: 12pt;
  font-family: 'Open Sans', sans-serif;
  font-weight: normal;
  font-style: normal;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100vw;
  min-height: 100vh;
}

p, li, .broken-link-text {
  font-family: 'Open Sans', sans-serif;
  font-weight: normal;
  margin: 0;
  padding:10px 0;
  color: var(--thm-blue-2);
  line-height: 1.5; 
}

h1 {
  font-family: 'ff-market-web', sans-serif;
  font-weight: normal;
  margin-top: 0;
  font-size: 3rem;
}
h1.landing-message {
  background: none!important;
  color: var(--thm-dark-blue)!important;
  font-size: 3.5rem!important;
  -webkit-margin-before: 1rem!important;
  margin-block-start: 1rem!important;
  -webkit-margin-after: 1rem!important;
  margin-block-end: 1rem!important;
  line-height: 1;
} 

/* new footer design*/
.region-footer {
  background-color: #002A1F !important;
  color: #ffffff !important;
}

.footer-flex a {
  color: #ffffff !important;
}

.footer-flex a:hover {
  color: #fd0 !important;
}

.footer-flex p {
  color: #ffffff !important;
}

.footer-wrapper {
  border-top: 5px solid white; /* Keep or customize */
}


/* Custom for footer info*/
.footer-flex {
  display: flex;
  justify-content: space-between; /* Adjust spacing between sections */
  flex-wrap: wrap; /* Ensures sections wrap on smaller screens */
}

.footer-flex div {
  flex: 1; /* Distribute space evenly across sections */
  margin: 0 10px; /* Add some spacing between columns */
}

.footer-flex p {
  margin: 5px 0; /* Space out the links */
}

.footer-flex a {
  text-decoration: none;
  color: #000; /* Use your site's color scheme */
}

.footer-flex a:hover {
  text-decoration: underline;
}

@media (max-width: 768px) {
  .footer-flex {
      flex-direction: column; /* Stack sections vertically */
      align-items: flex-start;
  }

  .footer-flex div {
      margin-bottom: 20px;
  }
}
/* Profile info */
.profile {
  max-width: 840px;
  margin: 2rem auto;
  padding: 2rem;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color: #1e1e1e;
  line-height: 1.7;
  font-size: 1.05rem;
}

/* Generic field wrappers */
.profile .field,
.profile .field__item,
.profile p,
.profile div[data-drupal-field-name] {
  margin-bottom: 1.5rem;
}

/* Field group styling (for Field Group module users) */
.profile .field-group-format,
.profile .fieldset-legend,
.profile h2,
.profile h3 {
  font-size: 1.25rem;
  font-weight: 600;
  color: #2c2c2c;
  margin: 2rem 0 1rem;
  border-bottom: 2px solid #eee;
  padding-bottom: 0.4rem;
  text-align: left;
}

/* Field labels */
.profile .field-label,
.profile label,
.profile strong,
.profile .field__label {
  display: block;
  font-weight: 600;
  color: #555;
  margin-bottom: 0.25rem;
  font-size: 0.95rem;
}

/* Field values */
.profile .field__item {
  font-size: 1.05rem;
  color: #222;
}

/* Links */
.profile a {
  color: #007acc;
  text-decoration: none;
}

.profile a:hover {
  text-decoration: underline;
}

/* Profile picture / images */
.profile img,
.profile .field--type-image img {
  max-width: 160px;
  height: auto;
  display: block;
  border-radius: 50%;
  margin: 0 auto 1rem;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

/* Responsive layout tweaks */
@media (max-width: 600px) {
  .profile {
    padding: 1.5rem;
  }

  .profile .field-group-format,
  .profile .fieldset-legend,
  .profile h2,
  .profile h3 {
    font-size: 1.1rem;
  }

  .profile .field__item {
    font-size: 1rem;
  }
}


/* Custom for settings for candidate profile form*/
.quick-register-form {
  max-width: 66%; /* Restrict form to two-thirds width */
  margin: 0 auto; /* Center the form horizontally */
  padding: 20px; /* Optional padding */
}

.quick-register-form .form-control {
  width: 100%; /* Full width for input fields */
  margin-bottom: 15px; /* Space between fields */
}

.quick-register-form .form-submit {
  display: block;
  margin: 20px auto; /* Center submit button */
  width: auto;
}

/* Custom styling for the company profile form */
.quick-company-register-form {
  max-width: 66%; /* Restrict form to two-thirds width */
  margin: 0 auto; /* Center the form horizontally */
  padding: 20px; /* Padding for the form container */
  background-color: #f9f9f9; /* Add light background */
  border-radius: 8px; /* Round corners */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Add shadow for depth */
}

/* Style input fields */
.quick-company-register-form .form-control {
  width: 100%; /* Full width for input fields */
  margin-bottom: 15px; /* Space between fields */
  padding: 10px; /* Inner padding for better usability */
  border: 1px solid #ccc; /* Border style */
  border-radius: 4px; /* Rounded edges */
  box-sizing: border-box; /* Ensure padding doesn't affect width */
}

/* Style the submit button */
.quick-company-register-form .form-submit {
  display: block;
  margin: 20px auto; /* Center submit button */
  width: auto; /* Automatic width */
  padding: 10px 20px; /* Padding for button */
  background-color: #007bff; /* Button background color */
  color: #fff; /* Button text color */
  border: none; /* Remove border */
  border-radius: 4px; /* Rounded edges */
  cursor: pointer; /* Pointer cursor on hover */
  text-align: center;
}

/* Add hover effect to the submit button */
.quick-company-register-form .form-submit:hover {
  background-color: #0056b3; /* Darker blue on hover */
}

/* Add focus styles for input fields */
.quick-company-register-form .form-control:focus {
  border-color: #007bff; /* Highlight border on focus */
  outline: none; /* Remove default outline */
}

/* Custom for settings for candidate profile form*/
.candidate-profile-form {
  margin: 0 auto; /* Center the form horizontally */
  width: 66%; /* Set the width of the form to two-thirds */
  padding: 20px; /* Add some padding inside the form */
  border: 1px solid #ccc; /* Optional: Add a border around the form */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Optional: Add a shadow for better appearance */
  background-color: #f9f9f9; /* Optional: Add a light background color */
}

body {
  display: flex;
  justify-content: center; /* Center the content horizontally */
}

.candidate-profile-form label {
  font-weight: bold;
} 

.candidate-profile-form .custom-label {
  color: #023020 !important;
  font-weight: bold !important;
  font-size: 1rem !important;
  display: block !important;
  margin-bottom: 0.25rem !important;
}



/* Adding custom job application block*/
.custom-job-application-block {
  margin: 0 auto;
  max-width: 600px;
  text-align: center;
}
.centralized-form {
  padding: 20px;
}

/* Custom styling for the Quick Register Form Block */
.quick-register-block {
  margin: 0 auto;
  max-width: 600px;
  text-align: center;
}

.centralized-form {
  padding: 20px;
}


/* Target the block */
.shortlist-candidates-block {
  padding: 20px;
  margin: 0 auto;
  max-width: 800px;
  text-align: center;
}

/* Style the table or list within the block */
.shortlist-candidates-block table {
  width: 100%;
  border-collapse: collapse;
}

.shortlist-candidates-block th,
.shortlist-candidates-block td {
  padding: 10px;
  border: 1px solid #ccc;
}

.shortlist-candidates-block h2 {
  text-align: center;
  margin-bottom: 20px; /* Optional for spacing */
}



/* Styling for the application entity page */
.eck-application-detailed {
  margin: 0 auto; /* Center the page content horizontally */
  max-width: 800px; /* Restrict the width */
  padding: 20px; /* Add padding around the page */
  background-color: #f9f9f9; /* Light background color */
  border-radius: 8px; /* Rounded corners */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
}

/* Title Styling */
.eck-application-detailed .application-title {
  text-align: center; /* Center the title */
  font-size: 24px; /* Larger font size */
  font-weight: bold; /* Bold text */
  margin-bottom: 20px; /* Add space below the title */
}

/* Content Styling */
.eck-application-detailed .application-content {
  font-size: 16px; /* Standard readable font size */
  line-height: 1.6; /* Improve readability */
  color: #333; /* Darker text for contrast */
}

/* Responsive Design */
@media (max-width: 768px) {
  .eck-application-detailed {
    padding: 15px;
    max-width: 95%;
  }

  .eck-application-detailed .application-title {
    font-size: 20px;
  }
}


/* Styling for the list of all applications page */
.eck-all-applications {
  margin: 0 auto; /* Center the page content horizontally */
  max-width: 1000px; /* Restrict the width */
  padding: 20px; /* Add padding around the page */
  background-color: #ffffff; /* White background color */
  border-radius: 8px; /* Rounded corners */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
}

/* Title Styling */
.eck-all-applications .applications-title {
  text-align: center; /* Center the title */
  font-size: 28px; /* Larger font size */
  font-weight: bold; /* Bold text */
  margin-bottom: 30px; /* Add space below the title */
  color: #333; /* Darker text color */
}

/* Application List Styling */
.eck-all-applications .applications-list {
  display: grid; /* Use grid layout for list items */
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); /* Responsive grid */
  gap: 20px; /* Space between grid items */
}

/* Individual Application Item */
.eck-all-applications .applications-list .views-row {
  padding: 15px; /* Add padding inside each item */
  background-color: #f9f9f9; /* Light gray background for each item */
  border: 1px solid #ddd; /* Border around each item */
  border-radius: 8px; /* Rounded corners */
  transition: transform 0.2s ease, box-shadow 0.2s ease; /* Smooth hover effect */
}

.eck-all-applications .applications-list .views-row:hover {
  transform: scale(1.02); /* Slightly enlarge on hover */
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15); /* Add shadow on hover */
}

/* Application Item Content */
.eck-all-applications .applications-list .views-row h2 {
  font-size: 20px; /* Application title font size */
  font-weight: bold; /* Bold title */
  color: #007acc; /* Accent color for titles */
  margin-bottom: 10px; /* Space below the title */
}

.eck-all-applications .applications-list .views-row p {
  font-size: 16px; /* Paragraph font size */
  color: #555; /* Neutral gray for text */
  line-height: 1.5; /* Improve readability */
}

/* Responsive Design */
@media (max-width: 768px) {
  .eck-all-applications {
    padding: 15px;
    max-width: 95%;
  }

  .eck-all-applications .applications-title {
    font-size: 24px;
  }

  .eck-all-applications .applications-list {
    grid-template-columns: 1fr; /* Single column layout on smaller screens */
  }
}


/* Centralize forms only on job advert pages for specific forms */
body.path-job-advert #job-advert-form,
body.path-job-advert-id #job-advert-id-form,
body.path-job-advert-apply #job-advert-apply-form {
  max-width: 600px;
  margin: 0 auto;
  padding: 20px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  border: 1px solid #ccc;
  border-radius: 8px;
}

/* Centralize forms inside specific blocks */
#block-quick-register-form form,
#block-job-application-form form,
#block-job-advert-form form {
  max-width: 600px;
  margin: 0 auto;
  padding: 20px;
  border: 1px solid #ccc;
  border-radius: 8px;
}


/* Target the body class for the "Job Advert" content type */
body.node--type-job-advert form {
  max-width: 600px; !important
  margin: 0 auto; !important
  padding: 20px; !important
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); !important
  border: 1px solid #ccc; !important
  border-radius: 8px; !important
}

/* Target the body class for the "Quick Register" page */
body.node--type-thm-quick-register form {
  max-width: 600px; !important
  margin: 0 auto; !important
  padding: 20px; !important
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); !important
  border: 1px solid #ccc; !important
  border-radius: 8px; !important
}


/* Style specifically for the share-profile page new */
body.path-share-profile main {
  margin: 0 auto; /* Center the main content horizontally */
  width: 66.67%; /* Set the width to 2/3 of the page */
  padding: 0 16.67%; /* Add padding to take up 1/3 space (8.33% on each side) */
  text-align: center; /* Center the text within the content if needed */
}




/* Style specifically for the share-profile page */
.share-profile-page {
  max-width: 66%; /* Content spans two-thirds of the page */
  margin: 0 auto; /* Center the content */
  padding: 20px; /* Add padding for spacing */
  background-color: #f9f9f9; /* Subtle background for readability */
  border-radius: 10px; /* Optional rounded corners */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Optional subtle shadow */
}

.share-profile-page h1,
.share-profile-page p {
  text-align: center; /* Center-align headings and paragraphs */
}

.share-profile-page .button {
  display: block;
  margin: 20px auto; /* Center-align buttons */
  padding: 10px 20px; /* Add button spacing */
  background-color: #023020; /* Dark green background */
  color: white; /* White text */
  text-align: center; /* Center text */
  text-decoration: none; /* Remove underline */
  border-radius: 5px; /* Rounded corners */
}

.share-profile-page .button:hover {
  background-color: white; /* Change to white on hover */
  color: #023020; /* Change text color on hover */
  border: 2px solid #023020; /* Add border on hover */
}  

.candidate-profile-form legend,
.candidate-profile-form .form-item label {
  color: #023020; /* your desired color */
  font-weight: bold;
}


/* Style specifically for the  company page */
.company-page {
  font-family: 'Arial', sans-serif;
  color: #003300; /* Dark green text */
  background-color: #fffef5; /* Very light yellow */
  padding: 2rem;
  border-radius: 12px;
  box-shadow: 0 0 10px rgba(0,0,0,0.05);
  max-width: 900px;
  margin: 2rem auto;
}

.company-page header h1 {
  color: #004d00; /* Darker green */
  font-size: 2rem;
  margin-bottom: 1rem;
}

.company-page h2 {
  color: #006600;
  border-bottom: 2px solid #ffcc00; /* Yellow underline */
  padding-bottom: 0.3rem;
  margin-top: 2rem;
}

.company-page .company-logo {
  margin-bottom: 1.5rem;
}

.company-page p {
  margin: 0.5rem 0;
}

.company-page strong {
  color: #003300;
}

.company-page .company-meta,
.company-page .company-location,
.company-page .company-contact,
.company-page .company-keywords,
.company-page .company-overview,
.company-page .company-locations,
.company-page .company-body {
  margin-bottom: 1.5rem;
  background: #e6ffe6; /* Light green background */
  padding: 1rem;
  border-left: 6px solid #009933; /* Accent bar */
  border-radius: 8px;
}

.company-page a {
  color: #006600;
  text-decoration: underline;
}

.company-page a:hover {
  color: #cc9900; /* Yellow hover */
}

 
.company-page .field--name-field-company-logo .field__label {
  display: none; /* hide the field label */
}

.company-page .field--name-field-company-logo img {
  border-radius: 50%;   /* circular logo */
  width: 150px;         /* adjust as needed */
  height: 150px;        /* adjust as needed */
  object-fit: cover;    /* neat crop inside circle */
}


.company-page {
  font-family: 'Arial', sans-serif;
  color: #f5f5f5; /* light text for dark background */
  background-color: #003300; /* dark green background */
  padding: 2rem;
  border-radius: 12px;
  box-shadow: 0 0 15px rgba(0,0,0,0.4);
  max-width: 900px;
  margin: 2rem auto;
}

/* Headings */
.company-page header h1 {
  color: #ffcc00; /* golden yellow headline */
  font-size: 2rem;
  margin-bottom: 1rem;
}

.company-page h2 {
  color: #ffffff; /* white section titles */
  border-bottom: 2px solid #ffcc00;
  padding-bottom: 0.3rem;
  margin-top: 2rem;
}

/* Highlight panels */
.company-page .company-meta,
.company-page .company-location,
.company-page .company-contact,
.company-page .company-keywords,
.company-page .company-overview,
.company-page .company-locations,
.company-page .company-body {
  margin-bottom: 1.5rem;
  background: #004d00; /* lighter green panel */
  padding: 1rem;
  border-left: 6px solid #ffcc00; /* gold accent bar */
  border-radius: 8px;
}

/* Links */
.company-page a {
  color: #ffcc00;
  text-decoration: underline;
}
.company-page a:hover {
  color: #ffffff; /* turns white on hover */
}

/* Logo styling */
.company-page .field--name-field-company-logo img {
  border-radius: 50%;
  width: 150px;
  height: 150px;
  object-fit: cover;
  border: 3px solid #ffcc00; /* gold border around logo */
}

/* Space between sections */
.company-page p {
  margin: 0.75rem 0; /* spacing between paragraphs */
  line-height: 1.6;  /* improves readability */
}

/* Add space below headings */
.company-page strong {
  display: block;     /* ensures it's treated like a heading */
  margin-top: 1rem;   /* space above heading */
  margin-bottom: 0.4rem; /* space below heading */
  color: #ffcc00;     /* keep headings golden for contrast */
}

/* Extra space between groups of content */
.company-page .company-meta,
.company-page .company-location,
.company-page .company-contact,
.company-page .company-keywords,
.company-page .company-overview,
.company-page .company-locations,
.company-page .company-body {
  margin-bottom: 2rem; /* space between sections */
  padding: 1.5rem;     /* padding inside the box */
  border-radius: 8px;
}


/* Specific views styling */ 
    /* General Page Styles - Unhidden Agency Brochure */
    body {
        font-family: Arial, sans-serif;
        margin: 0;
        padding: 20px;
        background: #FFFFFF; /* Soft green background */
        color: #A4D4B4; /* Dark green for text */
    }

    .ai-sourcing-overview .brochure-container {
        width: 800px;
        background: white;
        margin: auto;
        padding: 40px;
        border-radius: 12px;
        box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
    }

    /* Header Section */
    .ai-sourcing-overview .header {
        text-align: center;
        background: #FFFFFF;
        padding: 20px;
        border-radius: 10px;
        font-size: 2rem;
        font-weight: bold;
        color: #023020; /* Dark green */
        text-transform: uppercase;
    }

    /* Sections */
    .ai-sourcing-overview .section {
        margin: 30px 0;
        padding: 20px;
        border-left: 5px solid #FFD700;
        background: #FFFFFF;
        border-radius: 8px;
    }

   .ai-sourcing-overview .section h2 {
        font-size: 1.8rem;
        color: #023020;
        margin-bottom: 10px;
    }

   .ai-sourcing-overview .section p {
        font-size: 1.1rem;
        line-height: 1.6;
    }

    /* List Styling */
   .ai-sourcing-overview .section ul {
        padding-left: 20px;
    }

   .ai-sourcing-overview .section ul li {
        font-size: 1.1rem;
        margin-bottom: 8px;
    }

    /* Pricing Table */
   .ai-sourcing-overview .pricing-table {
        width: 100%;
        border-collapse: collapse;
        margin-top: 15px;
    }

   .ai-sourcing-overview .pricing-table th, .pricing-table td {
        padding: 12px;
        border: 1px solid #023020; /* Dark green */
        text-align: center;
        font-size: 1.1rem;
    }

   .ai-sourcing-overview .pricing-table th {
        background: #FFD700;
        color: #023020;
        font-weight: bold;
    }

    /* CTA Button */
   .ai-sourcing-overview .cta {
        text-align: center;
        margin-top: 30px;
    }

   .ai-sourcing-overview .cta-button {
        display: inline-block;
        background: #023020; /* Dark green */
        color: white;
        padding: 12px 25px;
        font-size: 1.3rem;
        font-weight: bold;
        border-radius: 8px;
        text-decoration: none;
        transition: background 0.3s ease-in-out;
    }

   .ai-sourcing-overview .cta-button:hover {
        background: #035C33; /* Slightly lighter dark green */
    }

    /* Footer */
   .ai-sourcing-overview .footer {
        text-align: center;
        margin-top: 40px;
        padding-top: 20px;
        border-top: 2px solid #FFD700;
        font-size: 1rem;
        color: #555;
    }
.ai-sourcing-overview .keyword-container {
display: flex;
gap: 10px;
flex-wrap: wrap;
margin-top: 10px;
}

.ai-sourcing-overview .keyword {
background-color: #FFD700; /* Gold */
color: #023020; /* Dark Green */
padding: 8px 16px;
border-radius: 20px;
font-weight: bold;
font-size: 1.1rem;
text-transform: uppercase;
display: inline-block;
box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);
}

.ai-sourcing-overview .tagline {
font-style: italic;
font-weight: bold;
font-size: 1.2rem;
color: #023020;
margin-top: 10px;
}
.ai-sourcing-overview .keyword-container {
display: flex;
justify-content: center;  /* Centers items horizontally */
gap: 10px;  /* Adds spacing between the buttons */
flex-wrap: wrap;
margin-top: 10px;
}

.ai-sourcing-overview .keyword {
background-color: #A4D4B4; /* Gold */
color: #023020; /* Dark Green */
padding: 8px 16px;
border-radius: 20px;
font-weight: bold;
font-size: 1.1rem;
text-transform: uppercase;
display: inline-block;
box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);
}

/* Center the tagline */
.ai-sourcing-overview .tagline {
text-align: center;
font-style: italic;
font-weight: bold;
font-size: 1.2rem;
color: #023020;
margin-top: 10px;
}


.ai-sourcing-overview .heading-primary {
text-align: center;
font-size: 2rem;
font-weight: bold;
color: #023020; /* Dark Green */
margin-bottom: 10px;
}

.ai-sourcing-overview .secondary-colour {
color: #023020; /* Replace with your preferred secondary color */
font-weight: bold;
}

.ai-sourcing-overview .steps {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
max-width: 800px; /* Limits width for better readability */
margin: auto;
}

.ai-sourcing-overview .step {
display: flex;
align-items: center;
width: 90%;
margin-bottom: 20px;
position: relative;
padding: 15px;
background: #A4D4B4; /* Soft Green */
border-radius: 10px;
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
}

.ai-sourcing-overview.step-number {
width: 45px;
height: 45px;
background: #FFD700; /* Gold */
color: #023020; /* Dark Green */
font-size: 1.5rem;
font-weight: bold;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-right: 20px;
flex-shrink: 0;
box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
}

.ai-sourcing-overview .step-content {
flex: 1;
}

.ai-sourcing-overview .step-content h3 {
margin: 0 0 5px;
color: #023020; /* Dark Green */
font-size: 1.5rem;
}

.ai-sourcing-overview .step-content p {
margin: 0;
font-size: 1.1rem;
color: #023020;
}

.ai-sourcing-overview .section:nth-of-type(8) .services-container {
display: flex;
justify-content: space-between;
gap: 20px;
}

.ai-sourcing-overview .section:nth-of-type(8) .service-panel {
flex: 1;
border-top: 3px solid #000;
padding: 20px;
text-align: center;
}

.ai-sourcing-overview .services-section .services-container {
display: flex;
justify-content: space-between;
gap: 20px; /* Adjust spacing between panels */
}

.ai-sourcing-overview .services-section .service-panel {
flex: 1;
border-top: 3px solid #000; /* The three lines you requested */
padding: 20px;
text-align: center;
}

body.application-apply {
  width: 66.66%;
  margin: 0 auto;
  padding-left: 16.67%;
  padding-right: 16.67%;
}


/*Button job landing page*/
/* Button base */
a.register-button {
  background-color: #023020;
  color: #ffff;
  font-weight: bold;
  padding: 12px 24px;
  border-radius: 6px;
  text-decoration: none;
  transition: all 0.2s ease;
  display: inline-block;
}

/* Hover effect */
a.register-button:hover {
  background-color: #f0f0f0;
  color: #003f9e;
}



/*Content of main page*/
.content-section {
  max-width: 60%;   /* content takes ~1/3 + 1/3 margins = centered */
  margin: 0 auto;   /* centers it */
  padding: 2rem 0;  /* vertical breathing space */
}



/* Main wrapper for the job landing page */
.job-landing-page {
  background-color: #023020;
  color: #ffffff;
  padding: 4rem 2rem;
}

.job-landing-page .container {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 1rem;
  text-align: center;
}

/* Page title */
.job-landing-page .page-title {
  font-size: 3rem;
  font-weight: bold;
  margin-bottom: 2rem;
  color: #ffffff;
}

/* Intro text */
.job-landing-page .intro-text-section {
  margin-bottom: 2rem;
}

.job-landing-page .intro-text {
  font-size: 1.25rem;
  line-height: 1.6;
  color: #f2f2f2;
}

/* Field groups */
.job-landing-page .field-group {
  margin-bottom: 1.5rem;
  font-size: 1.1rem;
}

.job-landing-page .field-label {
  font-weight: 600;
  display: inline-block;
  margin-right: 0.5rem;
  color: #d1f7ce;
}

.job-landing-page .field-value {
  color: #ffffff;
}

/* Individual skills */
.job-landing-page .skill {
  display: inline-block;
  padding: 0.25rem 0.5rem;
  margin: 0 0.25rem;
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 4px;
  color: #ffffff;
  font-size: 0.95rem;
}

/* Job listing section (View block output) */
.job-landing-page .job-results-section {
  margin-top: 3rem;
}


/* Jobs View Summary */
.view-jobs-unhidden .views-row {
  border-bottom: 1px solid #ddd;
  padding: 20px 0;
  display: flex;
  align-items: center;
  gap: 20px;
}

.view-jobs-unhidden .views-row:last-child {
  border-bottom: none;
}

.view-jobs-unhidden .views-field--field-job-organization-logo img {
  width: 60px;
  height: 60px;
  object-fit: contain;
}

.view-jobs-unhidden .views-field.views-field-title a {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 1.1rem;
  color: #023020; /* your dark green */
  margin: 0 0 5px;
  text-decoration: none;
}

.view-jobs-unhidden .views-field.views-field-title a:hover {
  text-decoration: underline;
  color: #012214; /* darker shade of your green */
}

.view-jobs-unhidden .views-field-field-job-location-group,
.view-jobs-unhidden .views-field-delta,
.view-jobs-unhidden .views-field-field-job-organization-name {
  font-size: 0.875rem;
  color: #7a8a89; /* your brand's gray */
}

.view-jobs-unhidden .views-field-field-job-location-group span,
.view-jobs-unhidden .views-field-delta span,
.view-jobs-unhidden .views-field-field-job-organization-name span {
  /* Optional: add spacing or style to labels if needed */
  font-weight: 600;
  margin-right: 5px;
}

.view-jobs-unhidden .views-field-field-job-location-group span:not(:last-child)::after {
  content: " · ";
  padding: 0 5px;
  color: #ccc;
}

/* Example for better spacing on labels and values */
.view-jobs-unhidden .job-detail {
  display: flex;
  align-items: baseline;
}


.view-jobs-unhidden .views-row {
  background-color: #ffffff; /* light highlight color */
  padding: 15px; /* add some padding for breathing space */
  margin-bottom: 10px; /* space between rows */
  border-radius: 5px; /* optional, for rounded corners */
}


.view-jobs-unhidden .views-row:hover {
  background-color: #e0f7fa; /* a subtle blue highlight on hover */
  cursor: pointer; /* changes cursor to pointer */
}

.view-jobs-unhidden .views-row {
  display: flex;
  flex-wrap: nowrap; /* keep on one line */
  align-items: center;
  gap: 40px; /* space between the main sections */
  padding: 15px 40px; /* top/bottom 15px, left/right 40px for breathing space */
}

.view-jobs-unhidden .job-title {
  flex: 1 1 150px; /* fixed width for job title */
}

.view-jobs-unhidden .job-detail {
  flex: 1 1 auto; /* let job-detail take equal space */
  display: flex;
  align-items: center;
  gap: 8px; /* space between label and value */
  min-width: 150px; /* keep minimum width */
}

.view-jobs-unhidden .job-label {
  font-weight: 600;
  color: #444;
  white-space: nowrap; /* prevent label wrapping */
  min-width: 110px; /* fixed width for labels so they align */
}

.view-jobs-unhidden .job-company {
  color: #333;
}


/* Example for better spacing on labels and values */
.view-jobs-unhidden .job-detail {
  display: flex;
  align-items: baseline;
}

.view-jobs-unhidden .views-row {
  padding-left: 15px;  /* padding on left */
  padding-right: 15px; /* padding on right */
}

.view-jobs-unhidden .job-column {
  padding-left: 10px;
  padding-right: 10px;
}

.view-jobs-unhidden {
  margin-left: 40px;
  margin-right: 40px;
}


.view-jobs-unhidden .views-row {
  display: flex;
  flex-wrap: nowrap;       /* Keep all on one line */
  justify-content: space-between; /* Spread children evenly */
  align-items: center;
  padding: 15px 40px;      /* Add horizontal breathing space */
  gap: 20px;               /* Space between columns */
  width: 100%;             /* Full container width */
  box-sizing: border-box;  /* Include padding in width */
}

.view-jobs-unhidden .views-row > div {
  flex: 1 1 0;             /* Allow each column to grow and shrink equally */
  min-width: 150px;        /* Prevent columns from shrinking too small */
}

.view-jobs-unhidden .job-title {
  flex: 1 1 200px;         /* Slightly bigger for job title */
  font-weight: 700;
  font-size: 1.1rem;
  color: #013220 !important;
}

.view-jobs-unhidden .job-detail {
  flex: 1 1 150px;
  display: flex;
  align-items: center;
}

.view-jobs-unhidden .job-label {
  font-weight: 600;
  color: #444;
  margin-right: 6px;
  white-space: nowrap;     /* Prevent wrapping */
}

.view-jobs-unhidden .job-company {
  color: #333;
  margin-left: 4px;
}


/* Styling for jobs landing pages /* 

/*  CSS to Center CTA and Content Sections */
/* Styling for jobs landing pages */

/* Base section styling for CTAs and content blocks */
.cta-intro-text,
.content-text-section,
.cta-primary-section,
.cta-secondary-section,
.cta-quick-register-section,
.cta-lateral_cta-section,
.cta-hiring,
.cta-category {
  text-align: center;
  margin: 2rem auto;
  max-width: 800px;
  padding: 1rem 1.5rem;
  font-size: 1.125rem; /* Slightly larger for better readability */
  line-height: 1.7;
  color: #244d4d; /* Deeper neutral text color */
}

/* Increase spacing between separate blocks */
.cta-primary-section,
.cta-secondary-section,
.cta-hiring,
.cta-category {
  margin-top: 2.5rem;
}

/* Consistent heading styling inside blocks */
.cta-intro-text h2,
.content-text-section h2,
.cta-primary-section h2,
.cta-secondary-section h2 {
  text-align: center;
  font-size: 1.5rem;
  margin-bottom: 1rem;
  color: #143534;
  font-weight: 600;
}

/* Link styling across CTA sections */
.cta-intro-text a,
.content-text-section a,
.cta-primary-section a,
.cta-secondary-section a,
.cta-hiring a,
.cta-category a {
  color: #176d63;
  font-weight: 500;
  text-decoration: underline;
  transition: color 0.3s ease, text-decoration 0.3s ease;
}

/* On hover: darker tone, cleaner look */
.cta-intro-text a:hover,
.content-text-section a:hover,
.cta-primary-section a:hover,
.cta-secondary-section a:hover,
.cta-hiring a:hover,
.cta-category a:hover {
  color: #0a423c;
  text-decoration: none;
}

/* Responsive typography for small screens */
@media (max-width: 600px) {
  .cta-intro-text,
  .content-text-section,
  .cta-primary-section,
  .cta-secondary-section,
  .cta-quick-register-section,
  .cta-lateral_cta-section,
  .cta-hiring,
  .cta-category {
    font-size: 1rem;
    padding: 1rem;
  }

  .cta-intro-text h2,
  .content-text-section h2,
  .cta-primary-section h2,
  .cta-secondary-section h2 {
    font-size: 1.25rem;
  }
}

a {
  color: #115e59; /* Dark teal */
}
a:hover {
  color: #083c3b;
  text-decoration: underline;
}

@media (max-width: 600px) {
  .job-summary-labels {
    display: block;
    text-align: center;
    margin-bottom: 1rem;
  }
}


.job-summary-label {
  color: #444; /* instead of #999 or lighter */
  font-weight: 500;
}





/* Styles for the parent wrapper as a grid container */

.job-wrapper {
  grid-column: 1 / -1; /* Span the entire width of the grid to separate it */
  margin-bottom: 20px; /* Add space below the custom text */
  padding: 10px; /* Optional: Add internal padding */
  display: block; /* Ensure it behaves as a block element */
  background-color: #f9f9f9; /* Optional: Different background for distinction */
  border: 1px solid #ddd; /* Optional: Add a light border */
}

/* New Job Metadata */
/* Modern Badge Container */
.job-metadata {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 20px;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.06);
  margin-bottom: 25px;
}

/* Badge Item */
.job-metadata-item {
  background: #f8f9fa;
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 14px;
  color: #333;
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #e4e4e4;
  transition: all 0.15s ease;
}

/* Hover effect */
.job-metadata-item:hover {
  background: #eef5f0;
  border-color: #c0d9cc;
}

/* Make labels bold and cleaner */
.job-metadata-item span:first-child,
.job-metadata-item strong,
.job-metadata-item label {
  font-weight: 600;
  color: #0b3d32;
}

.job-wrapper,
.views-field-nothing-1,
.views-row,
.views-view-fields,
.views-field {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.job-metadata {
  max-width: 70%; /* adjust: 60%, 70%, 80% depending on how narrow you want */
  margin: 0 auto; /* centers the block */
}

.job-metadata-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;  /* centers the badges horizontally */
  gap: 15px;
}

.job-metadata-item {
  background: #ffffff;
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 10px 14px;
  display: inline-flex;
  align-items: center;
  font-size: 14px;
  min-width: 200px;     /* ensures consistent width */
  justify-content: center !important; /* centers label/value inside */
}

.job-metadata-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 15px;
  width: 100%;
}

.job-metadata-item {
  background: #ffffff;
  border: 1px solid #d8d8d8;
  border-radius: 10px;
  padding: 12px 16px;
  font-size: 15px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 6px;
  font-weight: 500;
  min-height: 50px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

.job-metadata {
  max-width: 1100px;
  margin: 0 auto;
  padding: 20px;
}

.job-metadata-item {
  width: 100% !important;
  flex: 1 1 100% !important; /* makes it stretch full width */
  background: #ffffff;
  padding: 14px 22px;
  border-radius: 10px;
  border: 1px solid #e3e3e3;
  box-shadow: 0 2px 5px rgba(0,0,0,0.04);
  font-size: 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.job-metadata-item {
  flex: 1 1 calc(25% - 20px); /* 4 per row */
  background: #ffffff;
  padding: 14px 22px;
  border-radius: 10px;
  border: 1px solid #e3e3e3;
  box-shadow: 0 2px 5px rgba(0,0,0,0.04);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 6px;
}

/* FORCE metadata buttons to keep correct layout */
.job-metadata-item {
  flex: 1 1 calc(25% - 20px) !important;
  background: #ffffff !important;
  padding: 14px 22px !important;
  border-radius: 10px !important;
  border: 1px solid #e3e3e3 !important;
  box-shadow: 0 2px 5px rgba(0,0,0,0.04) !important;
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 6px !important;
}

/* FORCE the label inside buttons (Status:, Location:, etc.) */
.job-metadata-item strong {
  color: #023030 !important;
  font-weight: 700 !important;
  margin-right: 4px !important;
  font-size: 16px !important;
}

/* FORCE the value text (Live, Leeds, Permanent, etc.) */
.job-metadata-item span,
.job-metadata-item div {
  color: #023030!important;
  font-size: 16px !important;
}



/* Everything inside .job-details-wrapper ONLY */
.job-details-wrapper {
  max-width: 900px;
  margin: 0 auto;
  padding: 40px 20px;
}

/* Headings ONLY inside job details */
.job-details-wrapper h2,
.job-details-wrapper h3 {
  color: #023030;
  font-weight: 700;
  text-align: center;
  margin: 40px 0 20px;
}

/* Paragraphs ONLY inside job details */
.job-details-wrapper p {
  font-size: 18px;
  line-height: 1.6;
  color: #333;
  margin-bottom: 20px;
  text-align: center;
}

/* Lists ONLY inside job details */
.job-details-wrapper ul {
  margin: 20px auto;
  max-width: 750px;
  padding-left: 30px;
}

.job-details-wrapper ul li {
  margin-bottom: 10px;
  font-size: 17px;
  line-height: 1.5;
}

/* Bold subtitles ONLY inside job details */
.job-details-wrapper strong {
  color: #023030;
  font-weight: 700;
}

/* Spacing inside job details ONLY */
.job-details-wrapper .section-break {
  margin: 40px 0;
}





/* Specific pages styling */


/* Job pages styling */ 

/* Testimonials block styling */
.testimonials-css {
  background-color: #f5f5f5; /* Light grey */
  padding: 20px;
}

.testimonials-css .flexslider .flex-prev,
.testimonials-css .flexslider .flex-next {
    position: absolute;
    top: 50%; /* Center vertically */
    transform: translateY(-50%); /* Adjust for vertical centering */
}

.testimonials-css .flexslider .flex-prev {
    left: -30px; /* Adjust as needed */
}

.testimonials-css .flexslider .flex-next {
    right: -30px; /* Adjust as needed */
}


/* Styles specific to .rate-card-page */
.rate-card-page {
  margin: 0 auto !important; /* Center content horizontally */
  max-width: 1200px !important; /* Limit the width of the content */
  padding: 20px !important; /* Add padding around the content */
  background-color: #f5f5f5 !important; /* Optional: Light background for distinction */
}

/* Ensure all centralized content inside .rate-card-page inherits styles */
.rate-card-page .centralized-content {
  text-align: center !important;
  margin: 20px 0 !important;
}

/* Tiles section inside .rate-card-page */
.rate-card-page .tiles-wrapper {
  display: flex !important;
  justify-content: space-between !important;
  gap: 20px !important;
  margin: 40px 0 !important;
  flex-wrap: nowrap !important;
}

/* Ensure proper styling for tiles */
.rate-card-page .tile {
  background-color: #f9f9f9 !important;
  border: 1px solid #ddd !important;
  padding: 20px !important;
  width: 28% !important;
  text-align: center !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
  border-radius: 8px !important;
  transition: background-color 0.3s ease, color 0.3s ease !important;
  position: relative !important;
}

/* Most Popular Tile Highlight */
.rate-card-page .most-popular {
  border: 2px solid #FFD700 !important;
}

/* CTA Buttons specific to .rate-card-page */
.rate-card-page .cta-button {
  display: inline-block !important;
  padding: 10px 20px !important;
  background-color: #023020 !important;
  color: white !important;
  text-decoration: none !important;
  font-size: 18px !important;
  border-radius: 5px !important;
  margin-top: 20px !important;
}

.rate-card-page .cta-button:hover {
  background-color: white !important;
  color: #023020 !important;
  border: 2px solid #023020 !important;
}


/* Shortlist row colours */
body.path-shortlists-auto .row--yes {
  background-color: green;
  color: white;
}
body.path-shortlists-auto .row--no {
  background-color: red;
  color: white;
}
body.path-shortlists-auto .row--maybe {
  background-color: yellow;
  color: black;
}


/* Shortlist review buttons */
body.path-shortlists-auto .candidate-buttons button {
  padding: 5px 10px;
  margin: 5px;
  border: none;
  cursor: pointer;
}
body.path-shortlists-auto .btn-yes {
  background-color: green;
  color: white;
}
body.path-shortlists-auto .btn-no {
  background-color: red;
  color: white;
}
body.path-shortlists-auto .btn-maybe {
  background-color: yellow;
  color: black;
}


 
/* Add padding around the entire dashboard page */
/* Add padding around the entire view */
/* Add padding around the entire view and force it within the page */
.view.spacing {
  box-sizing: border-box;
  padding: 0 5% !important;
  max-width: 100%;
  overflow: hidden; /* Prevents content from spilling out */
  margin: 0 auto; /* Centers the view */
}



/* Custom styles for the /refer-friend page */
body.path-refer-friend .region-content {
  max-width: 66%; /* 2/3rd of the page width */
  margin: 0 auto; /* Center the content horizontally */
  text-align: center; /* Center align text and buttons */
}

body.path-refer-friend .region-content button {
  margin-top: 20px; /* Add space above the button if needed */
  padding: 10px 20px; /* Adjust padding for the button */
  font-size: 16px; /* Adjust font size for better visibility */
}

/* Hide the page title specifically on the /refer-friend page */
body.path-refer-friend .page-title {
  display: none;
}


/* Container styling */
.marketing-message-block {
    background-color: #025930; /* Mid-green shade for contrast */
    padding: 20px;
    text-align: center;
    border-radius: 8px;
}

/* Top strapline styling */
.marketing-message-block .top-strapline {
    color: white;
    font-size: 18px;
    margin-bottom: 10px;
    font-weight: 400;
}

/* Main marketing message */
.marketing-message-block .main-message {
    color: white;
    font-size: 36px;
    font-weight: bold;
    margin: 20px 0;
}

/* Subtitle styling */
.marketing-message-block .subtitle {
    color: white;
    font-size: 18px;
    margin-top: 10px;
    font-weight: 400;
}





/* Container styling for block - Banner Block*/
.marketing-message-block {
  background-color: #046141; /* Mid-green shade for contrast */
  padding: 20px;
  text-align: center;
  border-radius: 8px;
}

/* Top strapline styling */
.marketing-message-block .top-strapline {
  color: white;
  font-size: 18px;
  margin-bottom: 10px;
  font-weight: 400;
}

/* Main marketing message */
.marketing-message-block .main-message {
  color: white;
  font-size: 36px;
  font-weight: bold;
  margin: 20px 0;
}

/* Subtitle styling */
.marketing-message-block .subtitle {
  color: white;
  font-size: 18px;
  margin-top: 10px;
  font-weight: 400;
}



/*reverse recruiter pages*/ 
/* Headings */
.reverse-recruiter-page h2.section-heading {
  color: #023020;
  font-size: 28px;
  margin: 40px 0 24px;
  text-align: center;
}

/* Paragraphs */
.reverse-recruiter-page p {
  color: #333;
  font-size: 16px;
  line-height: 1.6;
}

/* Buttons */
.reverse-recruiter-page .register-button {
  background: #023020;
  color: #fff;
  padding: 12px 24px;
  border-radius: 6px;
  text-decoration: none;
  display: inline-block;
}

/* Center the button container */
.reverse-recruiter-page .cta-buttons {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;   /* allows wrapping on small screens */
  gap: 20px;         /* space between buttons */
  margin: 2rem 0;
}


/* Feature boxes */
.reverse-recruiter-page .feature-box {
  background: #fff;
  border-left: 6px solid #ffc83d;
  border-radius: 6px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
  margin-bottom: 16px;
  padding: 18px 20px;
}

.reverse-recruiter-page .feature-box strong {
  color: #023020;
  font-size: 16px;
}

/* Cards for solutions */
.reverse-recruiter-page .solution-card {
  background: #f8f8f8;
  border-radius: 12px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.08);
  flex: 1 1 250px;
  padding: 20px;
  text-align: center;
}

/* Badges */
.reverse-recruiter-page .badge {
  background-color: #e6f5ed;
  border-radius: 20px;
  border: 1px solid #10b981;
  color: #065f46;
  font-size: 13px;
  padding: 6px 14px;
  margin: 5px;
  display: inline-block;
}

/* FAQ */
.reverse-recruiter-page .faq-section {
  max-width: 800px;
  margin: 4rem auto;
  padding: 1rem;
}

.reverse-recruiter-page .faq-question {
  cursor: pointer;
  font-weight: bold;
  position: relative;
  padding-right: 1.5rem;
  color: grey;
}

.reverse-recruiter-page .faq-question::after {
  content: '+';
  position: absolute;
  right: 0;
  transition: transform 0.3s ease;
}

.reverse-recruiter-page .faq-item.open .faq-question::after {
  content: '-';
}

.reverse-recruiter-page .faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
  margin-top: 0.5rem;
  color: #444;
}

.reverse-recruiter-page .faq-item.open .faq-answer {
  max-height: 500px;
}



/* Scope only to job search pages */
.node--type-job-search-page {
  /* Improve readability */
  line-height: 1.6;
  color: #f5f5f5; /* Adjust text color for better contrast */
}

/* Make intro paragraph flow naturally */
.node--type-job-search-page p {
  margin-bottom: 1rem;
}

/* Keep <strong> inline (fixes the line-break issue) */
.node--type-job-search-page strong {
  display: inline;
  font-weight: 600;
  color: #ffd700; /* optional highlight */
}

/* Headings */
.node--type-job-search-page h2 {
  margin-top: 2rem;
  margin-bottom: 1rem;
  border-bottom: 2px solid #ffd700; /* subtle underline */
  padding-bottom: 0.3rem;
}

/* Lists */
.node--type-job-search-page ul {
  margin: 1rem 0;
  padding-left: 1.5rem;
}
.node--type-job-search-page li {
  margin-bottom: 0.5rem;
}


/* CSS for seo-page page */
.seo-page {
  text-align: center;
  padding: 0 16.666%; /* split equally on both sides */
}


/* CSS for candidate-hire page */
body.path-candidate-hire .centralized-content {
  text-align: center !important; /* Centers text inside the container */
  margin: 20px auto !important; /* Centers the section and adds vertical spacing */
  max-width: 800px !important; /* Limits the width of the content */
}

body.path-candidate-hire .tiles-wrapper {
  display: flex !important;
  justify-content: space-between !important;
  gap: 20px !important;
  margin: 40px auto !important;
  flex-wrap: wrap !important; /* Allows tiles to wrap on smaller screens */
  max-width: 1200px !important; /* Restricts the width of the tiles section */
}

body.path-candidate-hire .tile {
  background-color: #f9f9f9 !important;
  border: 1px solid #ddd !important;
  padding: 20px !important;
  width: 30% !important; /* Ensures each tile occupies about a third of the width */
  text-align: center !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
  border-radius: 8px !important;
  transition: background-color 0.3s ease, color 0.3s ease !important;
  position: relative !important;
}

body.path-candidate-hire .tile:hover {
  background-color: #023020 !important;
  color: white !important;
}

body.path-candidate-hire .tile h2,
body.path-candidate-hire .tile p,
body.path-candidate-hire .tile h3 {
  color: inherit !important;
  margin-bottom: 15px !important;
}

body.path-candidate-hire .tile:hover h2,
body.path-candidate-hire .tile:hover p,
body.path-candidate-hire .tile:hover h3 {
  color: white !important;
}

body.path-candidate-hire .most-popular-label {
  position: absolute !important;
  bottom: -10px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  background-color: #FFD700 !important;
  color: #000 !important;
  padding: 5px 10px !important;
  font-weight: bold !important;
  border-radius: 5px !important;
}

body.path-candidate-hire .most-popular {
  border: 2px solid #FFD700 !important;
}

body.path-candidate-hire .cta-button {
  display: inline-block !important;
  padding: 10px 20px !important;
  background-color: #023020 !important;
  color: white !important;
  text-decoration: none !important;
  font-size: 18px !important;
  border-radius: 5px !important;
  margin-top: 20px !important;
}

body.path-candidate-hire .cta-button:hover {
  background-color: white !important;
  color: #023020 !important;
  border: 2px solid #023020 !important;
}

body.path-candidate-hire .subtitle {
  font-size: 24px !important;
  font-weight: bold !important;
  color: #023020 !important;
  margin-bottom: 15px !important;
}

body.path-candidate-hire .centralized-text {
  font-size: 18px !important;
  line-height: 1.6 !important;
  color: #555 !important;
  max-width: 800px !important;
  margin: 0 auto !important;
}

body.path-candidate-hire .centralized-content strong {
  color: #023020 !important;
}

/* Responsive Styles */
@media (max-width: 1200px) {
  body.path-candidate-hire .tiles-wrapper {
      flex-wrap: wrap;
  }
  body.path-candidate-hire .tile {
      width: 45%;
      margin-bottom: 20px;
  }
}

@media (max-width: 768px) {
  body.path-candidate-hire .tiles-wrapper {
      flex-direction: column;
      align-items: center;
  }
  body.path-candidate-hire .tile {
      width: 90%;
  }
}


/* CSS for another specific page, e.g., /another-page */
body.path-another-page .centralized-content {
  text-align: center;
  margin: 20px 0;
}

/* Add additional styling for other pages here following the same pattern */


/* Target the tiles on the /hire page */
.path-hire .tile {
  transition: background-color 0.3s ease, color 0.3s ease;
}

.path-hire .tile:hover {
  background-color: #023020; /* Hover background color */
  color: #ffffff; /* Optional: Change text color on hover */
}

.path-hire .tile:hover h2,
.path-hire .tile:hover p {
  color: #ffffff; /* Ensure all text changes to white on hover */
}



/* Target the heading-wrapper and tiles specifically on the /home page */
.path-home .heading-wrapper {
  background-color: #f0f8ff; /* Example: Set a background color */
  padding: 20px;
}

.path-home .tile {
  transition: background-color 0.3s ease, color 0.3s ease;
}

.path-home .tile:hover {
  background-color: #023020; /* Hover background color */
  color: #ffffff; /* Change text color on hover */
}

.path-home .tile:hover h2,
.path-home .tile:hover p {
  color: #ffffff; /* Ensure all text changes to white on hover */
}

/* Sidebar for my profile */
.my-profile-2025 .sidebar {
  display: block; /* Ensure the sidebar is visible */
}

/* Hide the unwanted "Body:" heading in the sidebar buttons */
.my-profile-2025 .sidebar .block-title {
  display: none; /* Hides the block title */
}

/* Center the profile content and control width */
.my-profile-2025 {
  max-width: 66%; /* Two-thirds of the page */
  margin: 0 auto; /* Center horizontally */
  padding: 20px; /* Add spacing around the content */
  background-color: #f9f9f9; /* Subtle background for readability */
  border-radius: 10px; /* Rounded corners */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Light shadow for depth */
}



/* Coloured user name in profile */
.my-profile-2025 .user-name-section {
  background-color: #f9f9f9; !important /* Subtle background */
  color: #023020; !important /* Dark green text */
  margin: 0; /* Remove any margin around the box */
  width: 100%; /* Ensure full-width of the parent container */
  box-sizing: border-box; /* Include borders in width calculation */
  padding: 0; /* Remove padding inside the section */
}




/* Ensure inner content aligns with full width */
.my-profile-2025 .user-name-section .content-wrapper {
  padding: 0; /* Remove padding inside the content */
  margin: 0; /* Remove any margin inside the wrapper */
}

.my-profile-2025 .user-name-section .content-wrapper {
  padding: 15px; /* Add padding inside the content wrapper */
  box-sizing: border-box; /* Ensure padding is contained */
}

.my-profile-2025 .user-name-section .field-content {
  font-size: 1.2em; /* Increase font size for better readability */
  font-weight: bold; /* Bold the name */
  margin: 0; /* Remove extra margin from field content */
}


.my-profile-2025 ._2025-pic #myImage {
  width: 150px; /* Adjust the size as needed */
  height: 150px; /* Ensure width and height are equal */
  border-radius: 50%;
  object-fit: cover; !important /* Ensures the image fills the circle */
  overflow: hidden;
}


/* Coloured user name in profile */
.my-profile-2025 .user-name-section {
  margin: 0; /* Remove any margin around the box */
  width: 100%; /* Ensure full-width of the parent container */
  box-sizing: border-box; /* Include borders in width calculation */
  padding: 0; /* Remove padding inside the section */
}

/* Ensure inner content aligns with full width */
.my-profile-2025 .user-name-section .content-wrapper {
  padding: 0; /* Remove padding inside the content */
  margin: 0; /* Remove any margin inside the wrapper */
}

/* Current situation width */
.my-profile-2025 .current-situation-fields {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important; /* Remove unnecessary padding */
  box-sizing: border-box !important;
}

.my-profile-2025.current-situation-fields details {
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.my-profile-2025.current-situation-fields summary {
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Indent section headings */
.my-profile-2025 details summary {
  margin-left: 1em; /* Indent the section headings */
  font-weight: bold; /* Optional: Keep headings bold */
  font-size: 1.2em; /* Optional: Adjust font size */
}

.my-profile-2025 details .fields-wrapper .field {
  margin-bottom: 0.5em; /* Add spacing between fields */
  padding: 0.5em; /* Optional: Add internal padding for each field */
  border-bottom: 1px solid #e0e0e0; /* Optional: Add a subtle separator */
}


/* Indent fields inside each section slightly more */
.my-profile-2025 details .fields-wrapper .field {
  margin-left: 2em; /* Indent the fields more than the section headings */
}


/* Headings size & bold */
.my-profile-2025 .current-situation-fields,
.my-profile-2025 .expertise-preferences-fields,
.my-profile-2025 .salary-requirements-fields,
.my-profile-2025 .cv-contact-fields {
  font-size: 16px; /* Adjust font size */
  font-weight: bold; /* Makes the text bold */
  color: #023020;
}

/* Name size */
.my-profile-2025 .user-name-section {
  font-size: 22px; /* Adjust font size */
  font-weight: bold; /* Makes the text bold */
  color: #023020;
}

/* Field colours */
.my-profile-2025 .user-field-heading-colours {
  color: #7a788d;
}

/* General collapsible styling for details and summary elements */
.my-profile-2025 details {
  display: block; /* Ensure the details element is displayed properly */
  margin-bottom: 1em; /* Add space between each collapsible block */
}

.my-profile-2025 summary {
  display: block; /* Ensure the summary element is displayed properly */
  cursor: pointer; /* Add a pointer cursor for interactivity */
  font-weight: bold; /* Optional: style the summary text */
  padding: 0.5em; /* Optional: add padding to the summary */
}

/* Fields wrapper inside details */
.my-profile-2025 details .fields-wrapper {
  display: block; /* Ensure wrapper displays properly */
}

.my-profile-2025 details .fields-wrapper .field {
  display: block; /* Ensure each field is displayed on a new line */
  margin: 0.5em 0; /* Add spacing between fields */
}

/* Reset potential hidden fields inside the wrapper */
.my-profile-2025 details .fields-wrapper .field {
  visibility: visible;
  opacity: 1;
  height: auto;
}

/* Handle input fields, select boxes, and text areas within fields */
.my-profile-2025 details .fields-wrapper .field input,
.my-profile-2025 details .fields-wrapper .field select,
.my-profile-2025 details .fields-wrapper .field textarea {
  visibility: visible;
  opacity: 1;
  height: auto;
  display: inline-block; /* Ensure proper alignment for input elements */
}

/* Specific styling for the "Contact Me" section */
.my-profile-2025 details.contact-me-fields .field {
  display: block;
  margin-bottom: 0.5em; /* Optional: Adjust spacing */
}


/* Collapsable */
.my-profile-2025 details summary {
  cursor: pointer; /* Indicate the summary is clickable */
}

.my-profile-2025 details {
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 10px;
  margin: 10px 0;
  background-color: #f9f9f9;
}

.my-profile-2025 summary {
  font-size: 1.2em;
  font-weight: bold;
  cursor: pointer;
  margin-bottom: 5px;
}

.my-profile-2025 .field-group {
  margin-left: 20px;
  font-size: 1em;
}

/* Centralize buttons */
.my-profile-2025-buttons-top {
  text-align: center; /* Center-align the buttons */
  margin: 20px auto; /* Add spacing around the button container */
}

/* Style the buttons */
.my-profile-2025-buttons-top a {
  display: inline-block; /* Ensure buttons appear inline */
  padding: 7.5px 15px; /* Reduce padding by 25% */
  font-size: 12px; /* Reduce font size by 25% */
  font-weight: bold; /* Bold text */
  color: #FFFFFF; /* Text color */
  background-color: #023020; /* White background */
  border: 2px solid #FFFFFF; /* Border matching background */
  border-radius: 5px; /* Rounded corners */
  text-decoration: none; /* Remove underline */
  transition: all 0.3s ease-in-out; /* Smooth transition for hover effect */
}

/* Centralize buttons for yellow-buttons */
.yellow-buttons a {
  background-color: #FFD700; /* Yellow background */
  color: #000000; /* Black text */
  border-color: #FFD700; /* Border matches background */
}

.yellow-buttons a:hover {
  background-color: #FFC000; /* Slightly darker yellow on hover */
  color: #FFFFFF; /* White text on hover */
}

/* Ensure the parent container spans full width */
.my-profile-2025 {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important; /* Ensures padding and borders don't affect width */
}

/* Ensure details and summary cover the full width */
.my-profile-2025 details {
  width: 100% !important;
  display: block !important;
  margin: 0 !important; /* Reset margins if any */
  padding: 0 !important; /* Reset padding if any */
  box-sizing: border-box !important;
}

.my-profile-2025 summary {
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  text-align: left !important; /* Align content to the left */
}

/* Ensure fields inside the details block cover full width */
.my-profile-2025 .field-group,
.my-profile-2025 .my-profile-field {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Adjust padding for better spacing (optional) */
.my-profile-2025 .my-profile-field {
  padding: 5px 0 !important; /* Add vertical spacing between fields */
}



/* Profile Circle  */
.my-profile-2025 .profile-photo {
  width: 100px; /* Adjust width as needed */
  height: 100px; /* Match height to width for a perfect circle */
  border-radius: 50%; /* Make it circular */
  object-fit: cover; !important /* Ensure the image fits within the circle */
}

.my-profile-2025 .current-situation-fields {
  width: 100%; !important /* Ensure it spans the full container width */
  margin: 0; !important /* Remove any unintended margin */
  padding: 0 1em;!important /* Optional: Add padding for spacing */
}

.my-profile-2025 details .fields-wrapper .field {
  margin-left: 1.5em; /* Add indentation */
}

/* Specific css for site - Style all non-heading fields grey and values in dark */

.my-profile-2025 .my-profile-field-label {
  color: #3e3a59 !important; /* Lighter grey for headings */
  font-weight: normal !important; /* Optional: make headings normal weight */
}

.my-profile-2025 .my-profile-field-value {
  color: #3e3a59 !important; /* Darker color for values */
  text-transform: none !important; /* Ensure text is not capitalized */
}

.my-profile-2025 .my-profile-field {
  color: #3e3a59 !important; /* Darker color for values */
  text-transform: none !important; /* Ensure text is not capitalized */
  font-size: 16px !important; /* Adjust button font size */
}


/* remove bold */
.my-profile-field {
  font-weight: normal !important;
}




/* Specific css for site - Style all summary and details of the current situation section to be full width */

details.my-profile-2025.current-situation-fields {
  width: 100% !important;
}

details.my-profile-2025.current-situation-fields summary {
  width: 100% !important;
  display: block !important; /* Ensures it behaves like a block element */
}

 
/* Style all non-heading fields grey */
.my-profile-2025 details .field {
  color: #7a788d; /* Grey for non-headings */
  text-transform: none; /* Ensure text is not capitalized */
  margin-left: 1em; /* Optional: Add indentation for fields */
}



/* Hover effect for the buttons */
.my-profile-2025-buttons-top a:hover {
  background-color: #023020; /* Dark Green background on hover */
  color: #FFFFFF; /* Dark green text on hover */
  border: 2px solid #023020; /* Ensure border remains consistent */
}



/* Additional spacing and shadow effect for the container BUTTONS CLIENT*/
.secondary-style {
  padding: 15px !important; /* Add padding around the button container */
  background-color: #f9f9f9 !important; /* Light grey background */
  border: 1px solid #ddd !important; /* Subtle border */
  border-radius: 10px !important; /* Rounded corners */
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1) !important; /* Light shadow */
}

.secondary-style .block-class .field__label {
  display: none; /* Hides the label */
}

/* Modify buttons specifically within the secondary-style container */
.secondary-style a {
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1) !important; /* Button shadow */
  font-size: 16px !important; /* Slightly larger font */
}

.secondary-style a:hover {
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2) !important; /* Stronger shadow on hover */
}



.my-profile-2025-sidebar-buttons.text-align-center {
  text-align: center; /* Center the content */
}

.my-profile-2025-sidebar-buttons .btn {
  margin: 10px; /* Add spacing between buttons */
  padding: 10px 20px; /* Increase button padding */
  font-size: 16px; /* Adjust button font size */
}

.my-profile-2025-sidebar-buttons .btn-secondary {
  background-color: #023020; /* Dark green background */
  color: white; /* White text */
  border: 2px solid #023020; /* Matching border */
}

.my-profile-2025-sidebar-buttons .btn-secondary:hover {
  background-color: white; /* White background on hover */
  color: #023020; /* Dark green text on hover */
}

/* Ensure the element is visible */
.my-profile-2025 ._2025-pic {
  display: block; /* Ensure the element is displayed */
  visibility: visible; /* Ensure the element is visible */
  opacity: 1; /* Make sure it's fully opaque */
  position: relative; /* Ensure the element is positioned correctly */
  z-index: 1; /* Bring the element above other layers if needed */
}

/* Override any inherited styles */
.my-profile-2025 ._2025-pic img {
  max-width: 100%; /* Ensure the image fits within its container */
  height: auto; /* Maintain aspect ratio */
  visibility: visible !important; /* Force visibility */
  opacity: 1 !important; /* Force opacity */
  display: inline-block !important; /* Override display issues */
}

/* Handle cases where the parent container might be hidden */
.my-profile-2025 ._2025-pic * {
  visibility: visible !important;
  opacity: 1 !important;
}



/* headings size */
.my-profile-2025 .current-situation-fields,
.my-profile-2025 .expertise-preferences-fields,
.my-profile-2025 .salary-requirements-fields,
.my-profile-2025 .cv-contact-fields {
    font-size: 16px;
    text-transform: uppercase;
}

/*fields size */
.my-profile-2025 {
  font-size: 14px; !important /* Set the font size for all content within the container */
  text-transform: lowercase; /* Ensure all text is displayed in lowercase */
}

.my-profile-2025 .my-profile-field-label,
.my-profile-2025 .my-profile-field-value {
  font-size: 14px; /* Ensure both labels and values have the specified font size */
}



/* Default styles for the section */
.my-profile-2025 .section-1-fields {
  max-height: 0; /* Initially collapsed */
  overflow: hidden; /* Hide content */
  transition: max-height 0.3s ease-out; /* Smooth expand/collapse animation */
}

/* Expanded state */
.my-profile-2025 .section-1-fields.expanded {
  max-height: 1000px; /* Arbitrary large value to ensure full content is visible */
  overflow: visible; /* Allow content to be shown */
}

/* Toggle button styles */
.my-profile-2025 .section-1-toggle {
  cursor: pointer;
  display: inline-block;
  background-color: #007bff;
  color: #fff;
  padding: 5px 10px;
  border-radius: 5px;
  margin-bottom: 10px;
}

.my-profile-2025 .section-1-toggle:hover {
  background-color: #0056b3;
}

/* Field heading and value on the same line */
.my-profile-2025 .profile-fields .field {
  display: flex;
  align-items: center; /* Align label and value vertically */
  gap: 5px; /* Space between label and value */
}

/* Field heading */
.my-profile-2025 .profile-fields .field .label {
  font-weight: bold;
  margin: 0; /* No margin to align with value */
}

/* Field value */
.my-profile-2025 .profile-fields .field .value {
  color: #333; /* Neutral text color for values */
}


/* Add padding and spacing between fields */
.my-profile-2025 .views-field {
  margin-bottom: 15px; /* Add space between fields */
  padding: 10px 0; /* Add vertical padding */
  border-bottom: 1px solid #e0e0e0; /* Optional: subtle separator between fields */
}

.my-profile-2025 .views-field {
  display: block;
}


/* Optional: Adjust the label spacing */
.my-profile-2025 .views-label {
  font-weight: bold; /* Keep labels bold */
  margin-bottom: 5px; /* Space below the label */
  display: block; /* Ensure labels appear above field content */
}

/* Target all view field labels globally */
.my-profile-2025 .views-label {
  font-weight: bold; /* Makes the label bold */
}

/* If you want to target only specific views */
.my-profile-2025 .views-label {
  font-weight: bold; /* Bold only for the #my-profile view */
}


/* Headings styling */
.my-profile-2025 h1.my-profile {
  font-size: 2em;
  font-weight: bold;
  color: #333; /* Neutral text color */
  text-align: center; /* Center-align headings */
  margin-bottom: 20px;
}

/* Profile sections */
.my-profile-2025 .my-profile-section {
  margin-bottom: 30px; /* Space between sections */
  padding: 15px;
  background-color: #fff; /* White background for sections */
  border: 1px solid #e0e0e0; /* Subtle border */
  border-radius: 8px;
}

/* Section titles */
.my-profile-2025 .my-profile-type {
  font-size: 1.2em;
  font-weight: bold;
  margin-bottom: 10px;
  color: #555;
}

/* Buttons styling */
.my-profile-2025 .thm-button {
  display: inline-block;
  padding: 10px 20px;
  font-size: 1em;
  color: #fff;
  background-color: #007bff; /* Bootstrap primary color */
  border: none;
  border-radius: 5px;
  text-decoration: none;
  cursor: pointer;
}

.my-profile-2025 .thm-button:hover {
  background-color: #0056b3; /* Darker shade on hover */
}


.my-profile-2025 ul li a {
  color: #007bff;
  text-decoration: none;
}

.my-profile-2025 ul li a:hover {
  text-decoration: underline;
}

/* Contact info styling */
.my-profile-2025 #get-in-touch {
  background-color: #eef7ff;
  border: 1px solid #cce5ff;
  padding: 20px;
  border-radius: 8px;
}

.my-profile-2025 #get-in-touch h2 {
  text-align: center;
  color: #0056b3;
}

/* Media styling for responsiveness */
@media (max-width: 768px) {
  .my-profile-2025 {
    max-width: 90%; /* Full width on smaller screens */
    padding: 15px;
  }

  .my-profile-2025 .my-profile-section {
    padding: 10px;
  }

  .my-profile-2025 .thm-button {
    padding: 8px 16px;
    font-size: 0.9em;
  }
}




/* My profile section */
h1.my-profile {
  float: left;
  margin-bottom: 0;
}

h2, .user-candidate-profile-form details summary,
h2, .user-my-profile-form details summary,
h2, .user-company-profile-form details summary {
  font-family: 'Open Sans', sans-serif;
  font-weight: normal;
  color: var(--thm-dark-blue);
  font-size: 18pt;
  line-height: 1.2;
  -webkit-margin-before: 0.4em;
  margin-block-start: 0.4em;
  -webkit-margin-after: 0.4em;
  margin-block-end: 0.4em;
}
h2.orange {
  color: var(--thm-dark-blue);
}
h2.my-profile {
  font-size: 2.5rem;
  margin-top: 0;
}

h3 {
  font-family: 'Open Sans', sans-serif;
  font-weight: normal;
  text-transform: uppercase;
  /* font-size: 18pt; */
}

h4 {
  font-family: 'Open Sans', sans-serif;
  font-weight: 600;
}

a {
  font-family: 'Open Sans', sans-serif;
  font-weight: normal;
  text-decoration: none;
  color: var(--thm-dark-blue);
}
p a {
  font-family: 'Open Sans', sans-serif;
  text-decoration: underline;
}

ol, ul {
  -webkit-padding-start: 35px;
  padding-inline-start: 35px;
}

.larger {
  font-size: 150%;
}
.even-larger {
  font-size: 200%;
}
.larger-still {
  font-size: 300%;
}
.script-font {
  font-family: "ff-market-web", sans-serif;
}

/* h2 span, h3 span, h4 span {
  color: #6AC8BD ;
} */

ul li, ol li {
  font-family: 'Open Sans', sans-serif;
  font-weight: normal;
  padding-bottom: 10px;
  
}
::marker {
  color: var(--thm-dark-blue);
}
.header-dark-green ::marker,
.bgopt3 ::marker {
  color: var(--thm-white);
}

footer {
  z-index: 1000;
  position: relative;
  margin-top: 4em;
}

.region-footer {
  background-color: var(--thm-grey);
  border-top: 1px solid var(--thm-mid-grey);
}
.right {
  float:right;
}

.fwrapper {
  display:-webkit-box;
  display:-ms-flexbox;
  padding:1vw 5vw;
  width:calc(100% - 10vw);
  flex-wrap: wrap; 
}
.fheader {
  border-bottom: 1px solid var(--thm-blue-5);
} 

.fheader {
  color: #ffffff !important;

}


.fwrapper .flex {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: space-between;
}
.fwrapper .flex div {
  margin: 0 2vw 2em 0;
}
.fwrapper a {
  color: var(--thm-dark-blue);
}
.fwrapper a:hover {
  color: var(--thm-blue-2);
}
.contextual-region.eck-entity.thm-page.cv-search .flex,
.createdlinks.flex {
  display: flex;
  flex-wrap: wrap;
}
.contextual-region.eck-entity.thm-page.cv-search .flex1,
.createdlinks.flex1 {
  flex: 1;
  min-width: 240px;
}
.contextual-region.eck-entity.thm-page.cv-search .flex2,
.createdlinks.flex2 {
  flex: 2;
}

.createdlinks.flex div {
  margin-right: 1vw;
}

.crm-wrapper > div {
  background-color: var(--thm-grey);
  border-radius: 5px;
  margin: 10px;
  padding: 1em;
}
.crm-wrapper table tr {
  border-bottom: 5px solid var(--thm-grey)!important;
}
.crm-comment-col {
  margin-left: 10px;
}
.crm-wrapper .field--label-above,
.crm-wrapper .field--label--above {
  margin-bottom: 0.5em;
}

.crm-comment {
  margin: 10px 0!important;
}
.comment-submitted {
  font-size: smaller;
  padding: 0;
}
form#user-pass, form#user-pass-reset {
  width: 100%;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  max-width: 400px;
  margin-top: 5vw;
  padding: 0 40px;
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  min-width: 280px;
}


.fleft{
  -webkit-box-flex:1;
  -ms-flex:1;
  flex:1;
  min-width: 280px;
  margin-bottom: 30px;
}
.fright{
  -webkit-box-flex:1;
  -ms-flex:1;
  flex:1;
  text-align: right;
  line-height: 1.3em;
  min-width: 280px;
  margin-bottom: 30px;
}

.messages {
  max-width: 90%;
  margin: 1em auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.welcome {
  width:100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  min-height: 30px;
  background: var(--thm-white);
  text-align: right;
  color: #151241;
  padding-right: 3vw;
}
.header-light-green .welcome {
  background: var(--thm-light-green);
}
.header-dark-green .welcome {
  background: var(--thm-dark-green);
  color: var(--thm-white);
}
.flexslider {
  margin: 0;
}
.flex-control-nav {
  width: 100%;
  position: absolute;
  bottom: 0px;
  text-align: center;
}

.header-white {
  background: var(--white);
}
.header-light-green {
  background: var(--thm-light-green);
}
.header-dark-green {
  background: var(--thm-dark-green);
}
.header_wrapper {
  width: 100%;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 140px;
  max-width: 2200px;
  margin-left: auto;
  margin-right: auto;
}

.logo {
  padding-left: 3vw;
  height: auto;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  flex: 1;
  max-width: none;
  z-index: 10;
}

.logo img {
  max-width: clamp(300px, 30vw, 960px);
  height: auto;
  padding: 10px;
  margin-top: 0;
}


.logo img {
  max-height: 120px; /* adjust until it looks good */
  width: auto;       /* auto width keeps proportions */
  height: auto;
  padding: 5px;
}



.menublock {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 10px 0;
  width: 100%;
  display: block;
  margin-right: 0vw;
  /* position: absolute; */
}
.menublock ul {
  background-color:var(--thm-white);
  padding:5px 3vw 5px 10px;
  float:right;
  font-size: 0.9rem;
}
.menublock a{
  color: var(--thm-blue-2);
}
.header-light-green .menublock ul {
  background-color:var(--thm-light-green);
}
.header-dark-green .menublock ul {
  background-color:var(--thm-dark-green);
}
.header-dark-green .menublock #superfish-main a {
  color: var(--thm-white);
}
.header-dark-green .menublock #superfish-main a:hover {
  color: var(--thm-white);
  background: var(--thm-dark-green);
  border-bottom: 2px solid var(--thm-white);
}
.header-dark-green .menublock #superfish-main .sf-depth-2 a:hover {
  color: var(--thm-blue-2);
  background: var(--thm-light-green);
  border-bottom: 2px solid var(--thm-dark-green);
}

ul.sf-menu.sf-accordion.sf-expanded, ul.sf-menu.sf-accordion li.sf-expanded > ul {
  left: 0 !important;
  position: absolute;
  top: 75px !important;
  font-size: 1rem;
  background-color: var(--thm-white);
}

ul.sf-menu ul {
  margin-top:18px!important;
}

.footer-wrapper {
  border-top:5px solid white;
}


.layout-content {
  min-height: 70vh;
  padding-top: 2em;
}

ul.menu a.is-active,
.sf-menu .active {
  color: var(--thm-blue-2);
  display:block;
  border-bottom: 2px solid var(--thm-dark-blue);
}
.header-dark-green .menu #superfish-main a.is-active,
.header-dark-green .sf-menu#superfish-main .active {
  color: var(--thm-white);
  border-bottom: 2px solid var(--thm-white);
}

ul.sf-menu a, ul.sf-menu span.nolink {
  display: block;
  padding: 1em 1.5em;
  position: relative;
  border-bottom: 2px solid var(--thm-white);
}
.header-dark-green ul.sf-menu a, ul.sf-menu span.nolink {
  display: block;
  padding: 1em 1.5em;
  position: relative;
  border-bottom: 2px solid var(--thm-dark-green);
}


.menu a:hover {
  color: var(--thm-blue-2);
  background-color: var(--thm-grey);
  border-bottom: 2px solid var(--thm-dark-blue);
}

.flexslider{
  border:none;
  border-radius: 0;
}

/* general page split*/
.twocols{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  width:100%;
  margin-left:auto;
  margin-right: auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding:2vw 5vw 5vw 5vw;
  background: var(--thm-white);
}

/* .twocols p{
  color: #151241;
} */
.col-left, .col-right{
  width:50%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.col-left {
  padding-right: 3vw;
  /* align-self: center; */
}
.col-right {
  padding-left: 3vw;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  /* padding-top: 15vh; */
}
.col-right h2 {
  /* color: #6AC8BD; */
  font-size: 2rem;
  text-align: center;
}
/*--Campaign landing page---*/

.home-comp-text-wrapper ul,.home-prof-text-wrapper ul {
  max-width: 900px;
  margin: auto;
  margin-bottom: 40px;
}

.how-we-work-flex-parent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-column-gap: 40px;
     -moz-column-gap: 40px;
          column-gap: 40px;
}


.how-we-work-flex-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background-color: var(--thm-white);
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-column-gap: 20px;
  -moz-column-gap: 20px;
  column-gap: 20px;
  row-gap: 20px;
  padding: 10px 5vw 2vw;
}
.how-we-work-tile {
  border-radius: 3px;
  text-align: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  /* background: #6AC8BD; */
  width: 100%;
  max-width: 350px;
}
.how-we-work-tile p {
  color: var(--thm-white);
  font-size: 1.2rem;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  padding: 20px;
}
.how-we-work-tile-icon {
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-width: 350px;
  margin-left: auto;
  margin-right: auto;
  /* background: -webkit-radial-gradient(left top circle, #151241 20%, #6ec8b9 75%) no-repeat;
  background: radial-gradient(circle at left top, #151241 20%, #6ec8b9 75%) no-repeat; */
  border: 3px solid var(--thm-white);
  border-radius: 3px;
  -webkit-box-shadow: 5px 5px 20px #233c39, -5px 5px 20px #bdf1eb;
          box-shadow: 5px 5px 20px #233c39, -5px 5px 20px #bdf1eb;
  padding: 20px;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
      align-self: center;
}
.how-we-work-tile-icon h5 {
  color: var(--thm-white);
  text-align: center;
  font-size: 2.5rem;
  margin-top: 0;
  text-shadow: 5px 5px 10px #17152f;
  margin: 0;
  font-weight: normal;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: block;
  -webkit-box-flex: 2;
  -ms-flex: 2;
  flex: 2;
  display: block;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
}
.how-we-work-tile-icon h6 {
  color: var(--thm-white);
  text-align: center;
  font-size: 3rem;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0;
  text-shadow: 5px 5px 10px #17152f;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.how-we-work-title {
  font-size: 2rem;
  text-align: center;
  margin: 0 5vw;
  color: var(--thm-dark-blue);
}

.node.node--type-thm-landing-page h2, .node.node--type-thm-landing-page p {
  text-align: center;
}
.views-field.views-field-field-test-company-name {
  color: var(--thm-blue-4);
  font-family: 'Open Sans', sans-serif;
  /* font-size: 1.4rem; */
  text-align: center;
  font-weight: 600;
}

.landing-pg-heading {
  text-align: center;
  color: var(--thm-dark-blue);
  background-color: var(--thm-white);
  margin: 0;
  padding-top: 30px;
  padding: 30px 5vw;
  font-size: 2rem;
}
.flex-direction-nav a  {
  text-decoration: none;
  display: block;
  width: 50px;
  height: 50px;
  position: absolute;
  top: 200px;
  z-index: 10;
  overflow: hidden;
  opacity: 0;
  cursor: pointer;
  color: rgba(0, 0, 0, 0.8);
  text-shadow: 1px 1px 0 rgb(255 255 255 / 30%);
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  margin: 1vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.view.view-testimonials.view-id-testimonials.view-display-id-block_1 .flex-direction-nav a  {
  top: 0;
  
}


.flex-direction-nav a:before {
  font-family: "flexslider-icon";
  font-size: 40px;
  display: inline-block;
  content: '\f001';
  color: var(--thm-dark-blue);
  text-shadow: 1px 1px 0 rgb(255 255 255 / 30%);
}


.landing-pg-webform-contatiner {
  position: absolute;
  top: 140px;
  margin: 30px 5vw;
  /* max-width: 600px; */
  /* width: 100%; */
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.lp-webform-heading h2 {
  color: var(--thm-white);
  text-shadow: 1px 1px 3px black;
}
input[id^="edit-lp-webform-name"],
input[id^="edit-lp-webform-email"],
input[id^="edit-lp-webform-tel"] {
  height: 40px!important;
  border: 1px solid var(--thm-blue-4)!important;
  margin: 0!important;
  padding: 10px!important;
  box-sizing: border-box!important;
  width: 100%;
  min-width: 200px;
}

.node.node--type-thm-landing-page .js-form-wrapper.form-wrapper {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 768px;
}
.node.node--type-thm-landing-page .view.view-banner-images.view-id-banner_images.view-display-id-block_1 img, .view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_2 img, .view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_3 img {
  min-height: 500px;
}
form#webform-submission-landing-page-webform-node-218-add-form {
  width: 100%;
  display: block;
  max-width: 768px;
}
.lp-main-title {
  max-width: 768px;
  display: block;
  width: 100%;
}
.lp-main-title h1 {
  color: var(--thm-white);
  text-shadow: 3px 3px 5px black;
  font-size: 4rem;
  text-align: center;
}
.node.node--type-thm-landing-page .button.js-form-submit.form-submit {
  margin-top: 5px;
}

/*--homepage---*/

.view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_1 img, .view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_2 img, .view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_3 img {
  /* -webkit-filter: grayscale(1);
  filter: grayscale(1); */
  -o-object-fit: cover;
  object-fit: cover;
  height: 500px;
}
.home-banner-image::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(255, 255, 255, 1)), to(rgba(255, 255, 255, 0.1)));
  background-image: -o-linear-gradient(left, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0.1));
  background-image: linear-gradient(90deg, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0.1));
  opacity: .7;
  z-index: 5;
}

.node--type-thm-page .homepage-slide-h1 {
  position: relative;
}
.node--type-thm-page .homepage-slide-h1 h1 {
  position: absolute;
  z-index: 200;
  margin: 0px 10vw;
  font-size: 1.3rem;
  top: 50px;
  color: var(--thm-blue-2)!important;
  font-style: normal!important;
  padding: 0;
  font-weight: 600;
  
}
.home-marketing-message {
  font-size: 3.5vw;
  color: var(--thm-dark-blue);
  font-family: 'Open Sans', sans-serif;
  font-style: italic;
  line-height: 1.1;
  margin: 10px 0 10px 0;
  font-weight: normal;
  text-align: center;
}
.home-banner-subtext p {
  font-size: 1.3rem;
  color: var(--thm-dark-blue);
  font-family: 'Open Sans', sans-serif;
}
.home-banner-text-wrapper {
  position: absolute;
  top: 115px;
  z-index: 400;
  padding: 20px 10vw;
  max-width: 850px;
}
.view.view-testimonials.view-id-testimonials.view-display-id-block_1 .slides {
  padding: 15px 15vw;
  text-align: center;
}
.home-prof-comp-text-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-column-gap: 80px;
  -moz-column-gap: 80px;
  column-gap: 80px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.home-prof-text-wrapper, .home-comp-text-wrapper {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 400px;
}
.home-prof-text-wrapper h2, .home-comp-text-wrapper h2 {
  text-align: center;
  color: var(--thm-dark-blue)!important;
  font-size: 2rem;
}
.home-prof-text-wrapper h3, .home-comp-text-wrapper h3 {
  text-align: center;
  color: var(--thm-dark-blue)!important;
  font-size: 1.5rem;
}
.home-prof-comp-text-title {
  text-align: center;
  font-size: 1.5rem;
  color: var(--thm-blue-2);
  margin-bottom: 50px;
}
.home-prof-comp-text-title strong {
  color: var(--thm-dark-blue);
}
.home-prof-comp-text-title em strong {
  color: var(--thm-dark-blue);
}




.how-we-work-wrapper h1, .prof-how-we-work-wrapper h1, .comp-how-we-work-wrapper h1 {
  font-size: 2em;
  color: var(--thm-dark-blue);
  /* padding: 10px 5vw; */
  /* background: radial-gradient(circle at left top, #151241 20%, #6ec8b9 75%) no-repeat; */
  /* background: #6AC8BD; */
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: absolute;
  margin-top: 50px;
  text-align: center;
  display: block;
  width: 100%;
}
.how-we-work-wrapper h2, .prof-how-we-work-wrapper h2, .comp-how-we-work-wrapper h2  {
  color: var(--thm-white);
  font-size: 2.5rem;
}
.how-we-work-wrapper p, .prof-how-we-work-wrapper p, .comp-how-we-work-wrapper p {
  color: var(--thm-white);
  font-size: 1.1rem;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
}
.how-we-work-wrapper, .prof-how-we-work-wrapper, .comp-how-we-work-wrapper {
  background: var(--thm-white);
  padding-bottom: 3vw;
  margin: 0 10vw;
  
}
.how-we-work-wrapper-button-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}


.how-we-work-professional-section-logo img,
.how-we-work-companies-section-logo img{
  width: 150px;
  height: 150px;
}



.how-we-work-professional-section-title h2 {
  color: var(--thm-dark-blue);
}
.how-we-work-companies-section-title h2 {
  color: var(--thm-dark-blue);
}

.how-we-work-middle-section {
  display: block;
  position: absolute;
  left: 0;
  right: 0px;
  width: 100%;
  margin: 0 auto;
  top: 367px;
  height: auto;
  text-align: center;
}
.prof-how-we-work-wrapper .how-we-work-middle-section-1, .prof-how-we-work-wrapper .how-we-work-middle-section-2, .prof-how-we-work-wrapper .how-we-work-middle-section-3, .prof-how-we-work-wrapper .how-we-work-middle-section-4, .comp-how-we-work-wrapper .how-we-work-middle-section-1, .comp-how-we-work-wrapper .how-we-work-middle-section-2, .comp-how-we-work-wrapper .how-we-work-middle-section-3, .comp-how-we-work-wrapper .how-we-work-middle-section-4  {
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: block;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  border: 3px solid var(--thm-dark-blue);
  border-radius: 3px;
  padding: 20px;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  background-color: var(--thm-white);
  -webkit-box-shadow: 0 0 20px rgb(0 0 0 / 50%);
          box-shadow: 0 0 20px rgb(0 0 0 / 50%);
}


.margin-bottom {
  margin-bottom: 3em!important;
}


.how-we-work-middle-section-1, .how-we-work-middle-section-2, .how-we-work-middle-section-3, .how-we-work-middle-section-4 {
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: block;
  /* margin-bottom: 30px; */
  max-width: 215px;
  margin-left: auto;
  margin-right: auto;
  /* background: radial-gradient(circle at left top, var(--thm-dark-blue) 20%, var(--thm-dark-blue) 75%) no-repeat; */
  border: 3px solid var(--thm-dark-blue);
  border-radius: 3px;
  /* box-shadow: 0px 0px 30px var(--thm-dark-blue), -5px 5px 20px var(--thm-dark-blue); */
  padding: 20px;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  background-color: var(--thm-white);
  -webkit-box-shadow: 0 0 20px rgb(0 0 0 / 50%);
          box-shadow: 0 0 20px rgb(0 0 0 / 50%);
}
.how-we-work-middle-section-1 h6, .how-we-work-middle-section-2 h6, .how-we-work-middle-section-3 h6, .how-we-work-middle-section-4 h6 {
  color: var(--thm-dark-blue);
  text-align: center;
  font-size: 3rem;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0;
  /* text-shadow: 5px 5px 10px #17152f; */
}
.how-we-work-middle-section-1 h5, .how-we-work-middle-section-2 h5, .how-we-work-middle-section-3 h5, .how-we-work-middle-section-4 h5 {
  color: var(--thm-dark-blue);
  text-align: center;
  font-size: 1.6rem;
  margin-top: 0;
  /* text-shadow: 5px 5px 10px #17152f; */
  margin: 0;
  font-weight: 600;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: block;
  line-height: 1;
}

.how-we-work-logo-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding-top: 50px;
  margin-bottom: 2vw;
}
.how-we-work-companies-section-logo, .how-we-work-professional-section-logo {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}


.how-we-work-professional-section-logo h2 {
  color:  var(--thm-dark-blue);
  font-size: 2rem;
}
.how-we-work-companies-section-logo h2 {
  color:  var(--thm-dark-blue);
  font-size: 2rem;
}

.prof-how-we-work-wrapper .how-we-work-wrapper-section-1, .prof-how-we-work-wrapper .how-we-work-wrapper-section-2, .prof-how-we-work-wrapper .how-we-work-wrapper-section-3, .prof-how-we-work-wrapper .how-we-work-wrapper-section-4, .comp-how-we-work-wrapper .how-we-work-wrapper-section-1, .comp-how-we-work-wrapper .how-we-work-wrapper-section-2, .comp-how-we-work-wrapper .how-we-work-wrapper-section-3, .comp-how-we-work-wrapper .how-we-work-wrapper-section-4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: auto;
  margin-bottom: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
  max-width: 280px;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.how-we-work-wrapper-section-1, .how-we-work-wrapper-section-2, .how-we-work-wrapper-section-3, .how-we-work-wrapper-section-4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: auto;
  margin-bottom: 20px;
}

.prof-how-we-work-wrapper .how-we-work-professional-section-1, .prof-how-we-work-wrapper .how-we-work-professional-section-2, .prof-how-we-work-wrapper .how-we-work-professional-section-3, .prof-how-we-work-wrapper .how-we-work-professional-section-4, .comp-how-we-work-wrapper .how-we-work-professional-section-1 {
  
  padding: 5px 20px;
  border-radius: 3px;
  /* margin-left: 5vw; */
  /* margin-right: auto; */
  text-align: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: var(--thm-blue-3);
  width: 100%;
  /* margin-bottom: 70px; */
  margin: 30px 0 30px;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
}

.comp-how-we-work-wrapper .how-we-work-companies-section-1, .comp-how-we-work-wrapper .how-we-work-companies-section-2, .comp-how-we-work-wrapper .how-we-work-companies-section-3, .comp-how-we-work-wrapper .how-we-work-companies-section-4 {
  padding: 5px 20px;
  border-radius: 3px;
  text-align: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: var(--thm-blue-1);
  width: 100%;
  margin: 30px 0 30px;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
}




.how-we-work-professional-section-1, .how-we-work-professional-section-2, .how-we-work-professional-section-3, .how-we-work-professional-section-4 {
  
  padding: 5px 20px;
  border-radius: 3px;
  /* margin-left: 5vw; */
  /* margin-right: auto; */
  text-align: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: var(--thm-blue-3);
  width: 100%;
  /* margin-bottom: 70px; */
  margin: 30px 0 30px 5vw;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
}
.how-we-work-companies-section-1, .how-we-work-companies-section-2, .how-we-work-companies-section-3, .how-we-work-companies-section-4
{
  padding: 5px 20px;
  border-radius: 3px;
  /* margin-left: auto; */
  /* margin-right: 5vw; */
  text-align: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: var(--thm-blue-1);
  width: 100%;
  /* margin-bottom: 50px; */
  margin: 30px 5vw 30px 0;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
}





.how-we-work-strap {
  display: block;
  width: 100%;
  /* background: -webkit-radial-gradient(left top circle, #151241 50%, #6ec8b9 100%) no-repeat;
  background: radial-gradient(circle at left top, #151241 50%, #6ec8b9 100%) no-repeat; */
  text-align: center;
  /*background: #151241;*/
  padding: 20px 60px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  
}
.how-we-work-strap h2 {
  font-size: 3rem;
  padding: 0;
  color: #6ec8b9;
  margin: 0;
}
.how-we-work-strap img {
  display: block;
  width: 100%;
  max-width: 600px;
  text-align: center;
  margin: auto;
  
}

.how-we-work-strap span {
  color: var(--thm-white);
}

.hp-buttons{
  display:
  -webkit-box;
  display:
  -ms-flexbox;
  display:
  flex;
  width:100%;
  margin-left:
  auto;
  margin-right: auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  min-height: 250px;
}
.left-button, .right-button{
  padding:10px;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 300px;
}

.fp-banner strong{
  font-size: 3rem;
  font-family: 'Open Sans', sans-serif;
  font-weight: normal;
  line-height: 1;
}


.fp-banner{
  width: 100%;
  /* box-sizing: border-box; */
  /* display: block; */
}
.fp-banner img{
  display: none;
  width: 90%;
  margin-bottom: 50px;
  min-width: 350px;
  background-color: var(--thm-white);
}

.jgforms{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  width:100%;
  margin-left:auto;
  margin-right: auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding:2vw 5vw;
}
/* .jgforms p{
  color: var(--thm-white);
} */

.form-right{
  width:50%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: var(--thm-white);
  text-align: center;
}
.jgforms .form-right .webform-submission-client-job-form label,
.form-right .webform-submission-client-job-form-form {
  text-align: left!important;
}
.form-left{
  padding-right:3vw;
  width:50%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.form-left h2{
  color: var(--thm-dark-blue);
  font-size: 2rem;
  line-height: 1.2;
}

.home-buttons-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin: 0 10vw;
}


.hp-buttons a, .home-buttons-wrapper a {
  background-color: var(--thm-white);
  padding: 20px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 3px;
  color: var(--thm-dark-blue);
  border: 3px solid var(--thm-dark-blue);
  font-size: 2rem;
  display: block;
  text-align: center;
  max-width: 350px;
  margin-right: auto;
  margin-left: auto;
  /* min-height: 180px; */
  font-size: 1.3rem;
  font-family: 'Open Sans', sans-serif;
  -webkit-box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 2px, rgba(0, 0, 0, 0.07) 0px 2px 4px, rgba(0, 0, 0, 0.07) 0px 4px 8px, rgba(0, 0, 0, 0.07) 0px 8px 16px, rgba(0, 0, 0, 0.07) 0px 16px 32px, rgba(0, 0, 0, 0.07) 0px 32px 64px;
          box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 2px, rgba(0, 0, 0, 0.07) 0px 2px 4px, rgba(0, 0, 0, 0.07) 0px 4px 8px, rgba(0, 0, 0, 0.07) 0px 8px 16px, rgba(0, 0, 0, 0.07) 0px 16px 32px, rgba(0, 0, 0, 0.07) 0px 32px 64px;
  line-height: 1.2;
}
.hp-buttons a:hover, .home-buttons-wrapper a:hover {
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.7);
          box-shadow: 0 0 20px rgba(0, 0, 0, 0.7);
  -webkit-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}


.hp-buttons img {
  width: 100%;
  height: 80px;
  padding: 10px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.how-we-work-wrapper a, .prof-how-we-work-wrapper a, .comp-how-we-work-wrapper a,
.how-we-work-wrapper-button-wrapper a {
  background-color: var(--thm-white);
  padding: 85px 10px 20px 10px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 3px;
  color:var(--thm-dark-blue);
  border: 3px solid var(--thm-dark-blue);
  font-size: 2rem;
  display: block;
  text-align: center;
  margin-right: auto;
  margin-left: auto;
  
}
.how-we-work-wrapper .left-button a:hover, .how-we-work-wrapper .right-button a:hover, .prof-how-we-work-wrapper .left-button a:hover, .comp-how-we-work-wrapper .right-button a:hover, .how-we-work-wrapper-button-wrapper .left-button a:hover {
  color: var(--thm-dark-blue);
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.7);
          box-shadow: 0 0 20px rgba(0, 0, 0, 0.7);
  border: 3px solid var(--thm-dark-blue);
  -webkit-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}

.how-we-work-wrapper .left-button a, .prof-how-we-work-wrapper .left-button a,
.how-we-work-wrapper-button-wrapper .left-button a  {
  background-image: url(/sites/default/files/new-browse-jobs-icon.svg);
  background-position: center top 20px;
  background-repeat: no-repeat;
  width: 80%;
  background-size: 60px;
  position: relative;
  bottom: 0;
  max-width: 350px;
  font-size: 1.3rem;
  font-family: 'Open Sans', sans-serif;
  -webkit-box-shadow: rgb(0 0 0 / 7%) 0px 1px 2px, rgb(0 0 0 / 7%) 0px 2px 4px, rgb(0 0 0 / 7%) 0px 4px 8px, rgb(0 0 0 / 7%) 0px 8px 16px, rgb(0 0 0 / 7%) 0px 16px 32px, rgb(0 0 0 / 7%) 0px 32px 64px;
          box-shadow: rgb(0 0 0 / 7%) 0px 1px 2px, rgb(0 0 0 / 7%) 0px 2px 4px, rgb(0 0 0 / 7%) 0px 4px 8px, rgb(0 0 0 / 7%) 0px 8px 16px, rgb(0 0 0 / 7%) 0px 16px 32px, rgb(0 0 0 / 7%) 0px 32px 64px;
}
.how-we-work-wrapper .right-button a, .comp-how-we-work-wrapper .right-button a {
  background-image: url(/sites/default/files/new-jg-hire-icon.svg);
  background-position: center top 20px;
  background-repeat: no-repeat;
  width: 80%;
  background-size: 75px;
  position: relative;
  bottom: 0;
  max-width: 350px;
  font-size: 1.3rem;
  font-family: 'Open Sans', sans-serif;
  -webkit-box-shadow: rgb(0 0 0 / 7%) 0px 1px 2px, rgb(0 0 0 / 7%) 0px 2px 4px, rgb(0 0 0 / 7%) 0px 4px 8px, rgb(0 0 0 / 7%) 0px 8px 16px, rgb(0 0 0 / 7%) 0px 16px 32px, rgb(0 0 0 / 7%) 0px 32px 64px;
          box-shadow: rgb(0 0 0 / 7%) 0px 1px 2px, rgb(0 0 0 / 7%) 0px 2px 4px, rgb(0 0 0 / 7%) 0px 4px 8px, rgb(0 0 0 / 7%) 0px 8px 16px, rgb(0 0 0 / 7%) 0px 16px 32px, rgb(0 0 0 / 7%) 0px 32px 64px;
  
}
.how-we-work-wrapper .left-button, .how-we-work-wrapper .right-button, .prof-how-we-work-wrapper .left-button, .comp-how-we-work-wrapper .right-button,
.how-we-work-wrapper-button-wrapper .left-button {
  padding: 10px;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
  margin-top: 30px; 
}



.webform-submission-decision-tree-form{
  position: absolute;
  padding-right:3vw;
  background-color: white;
}
label {
  margin-bottom: 0.5em;
  display: block;
  font-weight: bold;
  font-size: 1rem;
  color: var(--thm-dark-blue);
}

.form-composite > legend {
  display: inline;
  margin: 0;
  font-weight: bold;
  font-size: 1rem;
  -webkit-margin-after: 0.5em;
  margin-block-end: 0.5em;
  -webkit-margin-before: 1em;
  margin-block-start: 1em;
  /* padding: 0 0 40px 10px; */
}
label.ui-checkboxradio-label.ui-corner-all.ui-button.ui-widget.ui-checkboxradio-radio-label {
  width: 100%;
  height: auto;
  background-color: var(--thm-dark-blue);
  color: var(--thm-white);
  font-family: 'Open Sans', sans-serif;
  font-weight: normal;
  font-size: 1.5rem;
  text-align: center;
  -webkit-transition: background-color 0.3s ease;
  -o-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
  padding: 15px;
  border-radius: 3px;
  border: 1px solid var(--thm-dark-blue);
  /*background-image: url(/sites/default/files/arrow-down.svg);*/
  background-repeat: no-repeat;
  background-position: bottom 15px center;
  background-size: 40px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 10px 20px;
}

label.ui-checkboxradio-label.ui-corner-all.ui-button.ui-widget.ui-checkboxradio-radio-label:hover {
  background-color: var(--thm-green);
  border: 1px solid var(--thm-green);
}

label.ui-checkboxradio-label.ui-corner-all.ui-button.ui-widget.ui-checkboxradio-radio-label.ui-state-active {
  background-color: var(--thm-green);
}

#edit-what-would-you-like-to-do- .label {
  display: none;
  
}

.webform-submission-form .button.js-form-submit.form-submit,
.thm-button,
.field--name-field-job-apply-url a {
  padding: 5px 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 3px;
  min-width: 130px;
  margin-top:20px;
  display: inline-block;
  font-size: 1rem;
  text-align: center;
  transition: all 0.3s;
}

.white {
  color: var(--thm-white)!important;
}

/* .candidate-button-wrapper .thm-button {
  background-color: var(--thm-white);
  border: 2px solid var(--thm-dark-blue);  
  color: var(--thm-dark-blue)!important;
}
.candidate-button-wrapper .thm-button:hover {
  background-color: var(--thm-white);
  border: 2px solid var(--thm-dark-blue); 
}


form#webform-submission-candidate-form-node-60-add-form .webform-button--next.button.js-form-submit.form-submit:hover,
.thm-button:hover {
  color: var(--thm-dark-blue);
  background-color: var(--thm-dark-blue);
  transition: all 0.3s;
}



form#webform-submission-client-form-node-62-add-form .webform-button--next.button.js-form-submit.form-submit:hover{
  color:  var(--thm-dark-blue);
  background-color: var(--thm-dark-blue);
  transition: all 0.3s;
} */
.form-textarea-wrapper textarea {
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  margin: 0;
  min-height: 180px;
}


.webform-button--previous.button.js-form-submit.form-submit {
  
  background-repeat: no-repeat;
  background-position: top 10px center;
  background-size: 20px;
}

.webform-button--submit.button.js-form-submit.form-submit {
  
  background-repeat: no-repeat;
  background-position: top 10px center;
  background-size: 35px;
}

.webform-element-description {
  margin: 10px 0;
  font-size: 1rem;
}

.client-job-form-submission-wrapper .webform-button--submit.button.js-form-submit.form-submit,
.client-job-form-submission-wrapper .thm-button {
  background-color: var(--thm-green);
  color: var(--thm-white);
  border-radius: 3px;
  transition: all 0.3s;
}
.client-job-form-submission-wrapper .webform-button--submit.button.js-form-submit.form-submit:hover,
.client-job-form-submission-wrapper .thm-button:hover {
  background-color: var(--thm-dark-blue);
  transition: all 0.3s;
}

.webform-ajax-form-wrapper {
  padding: 20px;
  position: relative;
  width: 100%;
  max-width: 100%;
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  z-index: 100;
}
.geo-block-wrapper {
  margin-top: 1vw;
}

div#edit-what-would-you-like-to-do- {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.form-actions.js-form-wrapper.form-wrapper {
  text-align: center;
}
.js-form-wrapper.form-wrapper {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  /* max-width: 350px; */
}

.form-text.required,
.form-email.required{
  width: 100%;
}
form#user-candidate-profile-form,
form#user-my-profile-form,
form#user-company-profile-form,
form.user-login-form,
form.user-register-form,
form#webform-submission-client-job-form-add-form,
form#user-mailing-preferences-form,
form#user-thm-mentors-form,
form#required-candidate-data-form,
.form-header {
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  padding: 1vw 5vw;
}

/* form#crm-profile-form .form-radios {
  display: flex;
  flex-wrap: wrap;
}
form#crm-profile-form .form-radios .form-item {
  margin: 3px;
} */

#views-form-cv-search-page-1,
#views-exposed-form-cv-search-page-1 {
  max-width: inherit;
  padding: 1vw 2vw;
}
#views-exposed-form-q-and-as-block-1,
#views-exposed-form-q-and-as-block-2 {
  display: flex;
  width: 100%;
  justify-content: center;
}
.view-q-and-as .view-content {
  text-align: center;
}
.view-q-and-as .answer {
  padding-left: 1.5em;
}

details#edit-field-address-0 summary {
  display: none;
}
details#edit-field-address-0 .details-wrapper {
  padding: 0;
}
.view.view-clients-view.view-id-clients_view.view-display-id-block_1 .view-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 20px 10vw;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-column-gap: 40px;
  -moz-column-gap: 40px;
  column-gap: 40px;
  row-gap: 20px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.views-field.views-field-field-client-logo img {
  max-height: 100px;
  height: auto;
  width: auto;
  max-width: 200px;
  -webkit-filter: grayscale(1);
  filter: grayscale(1);
}
.views-field.views-field-field-client-logo img:hover {
  -webkit-filter: grayscale(0);
  filter: grayscale(0);
  -webkit-transition: all 0.25s ease-out;
  -o-transition: all 0.25s ease-out;
  transition: all 0.25s ease-out;
}
.view.view-clients-view.view-id-clients_view.view-display-id-block_1, .view.view-clients-view.view-id-clients_view.view-display-id-block_2 {
  margin-bottom: 80px;
  padding: 0 10vw;
}
.view-clients-view.view-id-clients_view.view-display-id-block_2 .views-field.views-field-field-client-logo .field-content  {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.view-clients-view.view-id-clients_view.view-display-id-block_2 .slick-track {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-column-gap: 100px;
     -moz-column-gap: 100px;
          column-gap: 100px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.view.view-company-matches.view-id-company_matches.view-display-id-block_2 .views-row {
  margin-top: 0;
}

.view.view-clients-view.view-id-clients_view.view-display-id-block_1 .views-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
      align-self: center;
}
.advert-form-flex {
  display: flex;
  column-gap: 40px;
  flex-wrap: wrap;
  margin: auto;
  padding: 0 10vw;
  justify-content: space-evenly;
  background-color: var(--thm-pink);

}
.advert-form-flex .advert-form-flex-item {
  flex: 1;
  min-width: 500px;
  justify-content: center;
}


.advert-banner-image img {
  max-height: 375px;
  width: 100%;
  object-fit: cover;
  object-position: center;

}
.advert-banner-image {
  position: relative;
  max-height: 375px;
}

.advert-strapline {
  position: absolute;
    color: var(--thm-white);
    font-size: 4.5vw;
    top: 5vw;
    left: 10vw;
    font-family: 'Open Sans',sans-serif;
    font-style: italic;
    line-height: 1.2;
    text-shadow: 5px 5px 10px var(--thm-dark-blue);
    text-align: right;
}
.advert-banner-container .landing-pg-heading {
  padding: 0 5vw;
}
.advert-banner-container .view.view-clients-view.view-id-clients_view.view-display-id-block_2 {
  margin-bottom: 20px;
    padding: 0px 10vw;
}
.advert-banner-container .view.view-testimonials.view-id-testimonials.view-display-id-block_1 .slides {
  padding: 15px 20vw;
}



.testimonal-wrapper {
  font-size: 80%;
  padding-top: 20px;
}
.testimonal-wrapper .landing-pg-heading {
  font-size: 1.2rem;
}

.white-with-shadow {
  border: 1px solid var(--thm-mid-grey);
  padding: 2em 2vw;
  border-radius: 3px;
}


/*------ New site style CSS start ----------------*/

.paragraph {
  margin-bottom: 2em;
  text-align: initial;
}

.paragraph.paragraph--type--new-banner {
  position: relative;
  margin-left: -5vw;
  width: 100vw;
  max-height: 550px;
  border: 0!important;
  padding: 0!important;
  margin-top: -2em;
}
/* .paragraph.paragraph--type--new-banner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 80%;
  height: 100%;
  background-image: -webkit-gradient(linear,left top,right top,color-stop(50%,rgba(255,255,255,1)),to(rgba(255,255,255,0.1)));
  background-image: -o-linear-gradient(left,rgba(255,255,255,1) 50%,rgba(255,255,255,0));
  background-image: linear-gradient(90deg,rgba(255,255,255,1) 50%,rgba(255,255,255,0));
  opacity: .7;
  z-index: 5;
} */
.paragraph.paragraph--type--new-banner .new-banner-text-wrapper {
  z-index: 10;
  position: absolute;
  top: 0;
  left: 0;
  padding: 2em 5vw;
  text-align: center;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
}
.paragraph.paragraph--type--new-banner .new-banner-background {
  position: relative;
}
.paragraph.paragraph--type--new-banner .new-banner-background::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.paragraph.paragraph--type--new-banner.bgopt1.has-img .new-banner-background::before {
  background-color: var(--thm-grey);
  opacity: 0.6;
}
.paragraph.paragraph--type--new-banner.bgopt2.has-img .new-banner-background::before {
  background-color: var(--thm-pink);
  opacity: 0.6;
}
.paragraph.paragraph--type--new-banner.bgopt3.has-img .new-banner-background::before {
  background-color: var(--thm-dark-green);
  opacity: 0.6;
}
.paragraph.paragraph--type--new-banner.bgopt4.has-img .new-banner-background::before {
  background-color: var(--thm-green);
  opacity: 0.6;
}
.paragraph.paragraph--type--new-banner.bgwhite.has-img .new-banner-background::before {
  background-color: var(--thm-white);
  opacity: 0.6;
}

.paragraph.paragraph--type--new-banner h1.new-banner-top-strapline {
  margin: 0;
  padding: 0;
}

.paragraph.paragraph--type--new-banner .new-banner-top-strapline p {
  font-size: clamp(1rem, 2vw, 1.3rem) !important;
  font-style: normal!important;
  color: var(--thm-dark-blue);
  font-family: 'Open Sans',sans-serif!important;
  text-align: center!important;
  padding: 0!important;
  margin-left: 0!important;
  width: 100%!important;
  all: unset;
}

.bgopt3.paragraph.paragraph--type--new-banner .new-banner-top-strapline p,
.bgopt4.paragraph.paragraph--type--new-banner.has-img .new-banner-top-strapline p {
  color: var(--thm-white);
}
.paragraph.paragraph--type--new-banner .new-banner-marketing-message {
  all: unset;
  font-size: clamp(40px,6vw,80px);
  color: var(--thm-dark-blue);
  line-height: 1;
  margin-top: -1rem;
}

.bgopt3.paragraph.paragraph--type--new-banner .new-banner-marketing-message,
.bgopt4.paragraph.paragraph--type--new-banner.has-img .new-banner-marketing-message {
  color: var(--thm-white);
}
.new-banner-sub-title p {
  font-size: clamp(1rem,2vw,1.3rem) !important;
  font-style: normal!important;
  color: var(--thm-dark-blue);
  font-family: 'Open Sans',sans-serif!important;
  all: unset;
}

.bgopt3 .new-banner-sub-title p,
.bgopt4.has-img .new-banner-sub-title p {
  color: var(--thm-white);
}

.new-banner-button-wrapper,
.call-to-action-button-wrapper {
  padding: 0.5em 2em;
  z-index: 400;
  width: fit-content;
  display: flex;
  column-gap: 20px;
  align-items: center;
  border-radius: 3px;
}

.call-to-action-button-wrapper {
  margin-top: 1vw;
}

.new-banner-button-text, .call-to-action-button-text {
  font-size: clamp(1rem, 2vw, 1.5rem);
}
.new-banner-button-icon img, .call-to-action-button-icon img {
  height: 50px;
  width: auto;
  display: block;
}
.new-banner-background {
  width: 100%;
  height: auto;
  min-width: 100vw;
}
.no-img .new-banner-background {
  width: 100%;
  height: auto;
  min-width: 100vw;
  min-height: 550px;
}
.new-banner-background img {
  object-fit: cover;
  height: 550px;
  width: 100%;
  display: flex;
  object-position: top 0 right 20%;
} 

.paragraph.paragraph--type--new-banner {
  position: relative;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  max-height: 550px;
  border: 0!important;
  padding: 0!important;
  margin-top: -2em;
}

.banner-outer-wrapper {
  width: 100vw;
  background-color: #023020;
  color: white;
  margin-left: calc(-50vw + 50%);
  padding: 80px 20px;
}

.banner-inner-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
  font-family: Arial, sans-serif;
}

.paragraph--type--your-banner-type {
  background-color: #023020;
}

.banner-full-width {
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  position: relative;
  background-color: #023020; /* dark green or your chosen background */
}

.banner-full-width .new-banner-text-wrapper {
  width: 100%;
  padding: 80px 20px;
  text-align: center;
  color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; /* 👈 this centers the content horizontally */
  padding: 80px 20px;
  text-align: center;
  color: white;
} 


 

.paragraph.banner-full-width {
  position: relative;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  background-color: #002f20;
  overflow-x: hidden;
}

html, body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

/* This makes the entire banner break out of the container width */
.banner-full-wrapper {
  position: relative;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  background-color: #002f20; /* Or match your dark green background */
  overflow: hidden;
  z-index: 0;
}



.paragraph.paragraph--type--call-out-text,
.paragraph.paragraph--type--call-out-text-formatted {
  text-align: center;
  padding: 1em 5vw 2em;
}
.call-out-text-line-1 {
  font-family: 'Open Sans',sans-serif;
  font-size: clamp(1.2rem,3vw,2.1rem);
  font-style: italic;
}
.call-out-text-line-2 {
  font-family: "ff-market-web", sans-serif;
  /* font-size: 3rem; */
  font-size: clamp(2rem,5vw,3.5rem);
  color: var(--thm-dark-blue);
  margin-top: 1rem;
}

.bgopt3 .call-out-text-line-1,
.bgopt3 .call-out-text-line-2 {
  color: var(--thm-white);
}

.paragraph.paragraph--type--numbered-infographic,
.paragraph.paragraph--type--infographic {
  display: flex;
  width: 100%;
  border: 1px solid var(--thm-mid-grey);
  height: auto;
  border-radius: 3px;
  overflow: hidden;
  min-height: 220px;
}
.paragraph.paragraph--type--numbered-infographic .left,
.paragraph.paragraph--type--infographic .left {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  position: relative;
  flex: 1;
  width: 100%;
  height: 100%;
  border-radius: 3px 0 0 3px;
  border: 1px solid var(--thm-mid-grey);
  height: auto;
  padding: 0;
}
.paragraph.paragraph--type--numbered-infographic .left .numbered-info-text-wrapper {
  display: flex;
  align-items: center;
}
.paragraph.paragraph--type--numbered-infographic .numbered-info-text-wrapper {
  padding: 0 0.5rem;
  min-height: 80px;
}
.paragraph.paragraph--type--numbered-infographic.even .left .numbered-info-text-wrapper {
  flex-direction: row-reverse;
}
.paragraph.paragraph--type--numbered-infographic .right,
.paragraph.paragraph--type--infographic .right {
  display: flex;
  box-sizing: border-box;
  position: relative;
  flex: 1;
  width: 100%;
  height: auto;
  border-radius: 0 3px 3px 0;
  border: 1px solid var(--thm-mid-grey);
  flex-direction: column;
  justify-content: space-evenly;
  height: auto;
}
.paragraph.paragraph--type--numbered-infographic.odd .left,
.paragraph.paragraph--type--infographic.odd .left,
.paragraph.paragraph--type--numbered-infographic.even .right,
.paragraph.paragraph--type--infographic.even .right {
  border-right: none;
}
.paragraph.paragraph--type--numbered-infographic.odd .right,
.paragraph.paragraph--type--infographic.odd .right,
.paragraph.paragraph--type--numbered-infographic.even .left,
.paragraph.paragraph--type--infographic.even .left {
  border-left: none;
}

.numbered-info-number-icon img {
  object-fit: contain;
  width: 100%;
  height: 100%;
  max-height: 400px;
}
.numbered-info-number-icon {
  font-size: 5em;
  line-height: 1;
  color: var(--thm-light-grey);
  font-weight: bold;
  text-align: left;
}
.light-grey-number .numbered-info-number-icon {
  color: var(--thm-light-grey);
}
.dark-green-number .numbered-info-number-icon {
  color: var(--thm-dark-green);
}

.odd .numbered-info-number-icon {
  margin-right: 0.5rem;
}
.even .numbered-info-number-icon {
  margin-left: 0.5rem;
}

.numbered-info-subtitle {
  /* position: absolute; */
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: top;
}
.numbered-info-subtitle-text {
  display: inline-block;
  max-width: 500px;
  font-size: 1.1em;
  font-weight: bold;
  text-align: center;
  box-sizing: border-box;
  padding: 0 1em 0 4em;
}
.even .numbered-info-subtitle-text {
  padding: 0 4em 0 1em;
}

.numbered-info-title {
  font-size: 2em;
  line-height: 1.1;
  color: var(--thm-light-grey);
  font-weight: bold;
  padding: 0;
  text-align: right;
}
.light-grey-number .numbered-info-title {
  color: var(--thm-light-grey);
}
.dark-green-number .numbered-info-title {
  color: var(--thm-dark-green);
}

.numbered-info-heading {
  font-family: "ff-market-web", sans-serif;
  font-size: 2em;
}
.white-script.numbered-info-heading {
  color: var(--thm-white);
}
.green-script.numbered-info-heading {
  color: var(--thm-green);
}
.dark-blue-script.numbered-info-heading {
  color: var(--thm-dark-blue);
}
.dark-green-script.numbered-info-heading {
  color: var(--thm-dark-green);
}

.paragraph.paragraph--type--numbered-infographic.odd .numbered-info-icon,
.infographic-icon {
  position: absolute;
  top: 50%;
  left: 15%;
  transform: translate(-50%,-50%);
  z-index: 100;
}
.paragraph.paragraph--type--numbered-infographic.even .numbered-info-icon {
  position: absolute;
  top: 50%;
  left: 85%;
  transform: translate(-50%,-50%);
  z-index: 100;
}
.numbered-info-icon img,
.infographic-icon img {
  height: 160px;
  width: 160px;
  display: block;
}

.paragraph.paragraph--type--numbered-infographic.even {
  flex-direction: row-reverse;
}


.numbered-info-background-img img,
.infographic-background-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.paragraph.paragraph--type--numbered-infographic.odd .right::after,
.paragraph.paragraph--type--infographic .right::after {
  content: '';
  background: url(/themes/jg/images/prof-info-arrow-odd.png);
  position:absolute;
  top: 0px;
  left: -1px;
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
}
.paragraph.paragraph--type--numbered-infographic.even .left,
.paragraph.paragraph--type--infographic.even .left {
  border-radius: 0 3px 3px 0;
}

.paragraph.paragraph--type--infographic.img-left .right {
  border-radius: 3px 0 0 3px;
}
.paragraph.paragraph--type--infographic.img-left .right .infographic-icon {
  position: absolute;
  top: 50%;
  left: 85%;
  transform: translate(-50%,-50%);
  z-index: 100;

}
.paragraph.paragraph--type--infographic.img-left .right::after {
  content: '';
  background: url(/themes/jg/images/prof-info-arrow-odd.png);
  background-position-x: 0%;
  background-position-y: 0%;
  background-repeat: repeat;
  background-size: auto;
  position: absolute;
  top: 0px;
  left: 1px;
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
  transform: rotate(180deg);
}

.paragraph.paragraph--type--numbered-infographic.even .right::after {
  content: '';
  background: url(/themes/jg/images/prof-info-arrow-even.png);
  position:absolute;
  top:0px;
  left:1px;
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  background-position: right center;
  background-size: contain;
}
.paragraph.paragraph--type--numbered-infographic.even.navy-grey .right::after {
  content: '';
  background: url(/themes/jg/images/comp-info-arrow-even.png);
  position:absolute;
  top:0px;
  left:1px;
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  background-position: right center;
  background-size: contain;
}

/* .paragraph.paragraph--type--numbered-infographic.even .left {
  background-color: var(--thm-pink);
} */


.paragraph.paragraph--type--new-call-to-action {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  border-radius: 3px;
  overflow: hidden;
}
.paragraph.paragraph--type--new-call-to-action.navy-green {
  background-color: var(--thm-light-green);
  padding: 2em;
  border: 1px solid var(--thm-mid-grey);
}
.paragraph.paragraph--type--new-call-to-action.navy-grey {
  background-color: var(--thm-grey);
  padding: 2em;
  border: 1px solid var(--thm-mid-grey);
}
.paragraph.paragraph--type--new-call-to-action.orange-grey {
  background-color: var(--thm-pink);
  padding: 2em;
  border: 1px solid var(--thm-mid-grey);
}
.paragraph.paragraph--type--new-call-to-action.no-text .call-to-action-button-wrapper {
  margin-top: 0;
}
.paragraph.paragraph--type--new-call-to-action.bgwhite.bborder {
  padding: 0 2em 2em;
  border-radius: 0;
  border-bottom: 1px solid var(--thm-mid-grey);
}
.call-to-action-text {
  text-align: center;
  font-size: clamp(0.75rem,3vw,1.3rem);
}
.call-to-action-title {
  font-family: "ff-market-web", sans-serif;
  font-size: clamp(2rem,3vw,3rem);
  text-align: center;
  color: var(--thm-dark-blue);
  margin-block-start: 0;
  margin-block-end: 0;
  text-transform: unset;
}
.paragraph.paragraph--type--tiles .tiles-title,
.paragraph.paragraph--type--new-tiles .tiles-title {
  color: var(--thm-dark-blue);
  font-family: "ff-market-web", sans-serif;
  font-size: clamp(2rem,3vw,2.5rem);
  text-align: center;
  margin: 1em 1em 0;
}
.bgopt3.paragraph.paragraph--type--tiles .tiles-title,
.bgopt3.paragraph.paragraph--type--new-tiles .tiles-title {
  color: var(--thm-white);
}
.bgwhite.paragraph.paragraph--type--tiles .tiles-title {
  margin: 0 1em;
}
.paragraph.paragraph--type--new-tiles {
  border: 1px solid var(--thm-mid-grey);
  border-radius: 3px;
  overflow: hidden;
}

.paragraph.paragraph--type--infographic .right.bgopt3,
.paragraph.paragraph.paragraph--type--numbered-infographic .right.bgopt3,
.paragraph.paragraph--type--infographic .right.bgopt3 p,
.paragraph.paragraph.paragraph--type--numbered-infographic .right.bgopt3 p {
  color: var(--thm-white);
}
.paragraph.paragraph--type--infographic .right,
.paragraph.paragraph.paragraph--type--numbered-infographic .right {
  text-align: center;
  padding: 2em 3em 2em 7em;
  box-sizing: border-box;
}
.paragraph.paragraph--type--infographic.even .right,
.paragraph.paragraph.paragraph--type--numbered-infographic.even .right {
  text-align: center;
  padding: 2em 7em 2em 3em;
  box-sizing: border-box;
  border-radius: 3px 0 0 3px;
}

.paragraph.paragraph--type--new-tiles.orange_orange .tiles-subtitle,
.paragraph.paragraph--type--new-tiles.orange_grey .tiles-subtitle,
.paragraph.paragraph--type--new-tiles.navy_grey .tiles-subtitle {
  font-family: 'Open Sans',sans-serif;
  font-size: clamp(1rem,2.5vw,1.6rem);
  text-align: center;
  color: var(--thm-dark-blue)!important;
}
.paragraph.paragraph--type--new-tiles.navy_grey {
  background-color: var(--thm-light-green);
}

.paragraph.paragraph--type--new-tiles.orange_grey {
  background-color: var(--thm-grey);
}
.paragraph.paragraph--type--new-tiles.orange_orange {
  background-color: var(--thm-pink);
}
.field.field--name-field-tiles {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  padding: 1em;
}
.field.field--name-field-tiles > .field__item {
  padding: 1em;
  min-width: 30%;
  box-sizing: border-box;
}
.paragraph-tile-wrapper {
  max-width: 400px;
  column-gap: 30px;
  display: flex;
  flex: 1;
  width: 100%;
}
.paragraph-flexi-tile-wrapper {
  margin: 1em auto;
  border: 1px solid var(--thm-mid-grey);
  border-radius: 3px;
  padding: 1em 2em;
}
.paragraph-flexi-tile-wrapper.navy-orange {
  background-color: var(--thm-pink);
}
.paragraph-flexi-tile-wrapper.navy-grey {
  background-color: var(--thm-grey);
}
.paragraph-flexi-tile-wrapper.orange-grey {
  background-color: var(--thm-grey);
}
.paragraph-flexi-tile-wrapper.orange-grey .flexi-tile-title,
.paragraph-flexi-tile-wrapper.orange-white .flexi-tile-title {
  color: var(--thm-dark-blue);
}
.paragraph-flexi-tile-wrapper .field--name-field-button {
  padding: 0.5em 0 0;
  text-align: center;
}
.tile-icon img {
  width: 80px;
  height: auto;
}
.tile-description {
  font-size: clamp(0.8rem, 2vw, 1rem);
}
.tile-title {
  font-size: clamp(1rem, 2vw, 1.2rem);
}

.paragraph.paragraph--type--cta-simple-contact-form .insert-view-title,
.paragraph.paragraph--type--insert-view .insert-view-title,
.paragraph.paragraph--type--insert-webform .insert-webform-title,
.paragraph.paragraph--type--flexi-tiles .flexi-tiles-title,
.paragraph.paragraph--type--faq-container .faq-container-title,
.paragraph.paragraph--type--downloads .downloads-title {
  color: var(--thm-dark-blue);
  font-family: "ff-market-web", sans-serif;
  font-size: clamp(1.3rem, 3vw, 2.7rem);
  text-align: center;
  margin-bottom: 0.5em;
}

.paragraph.paragraph--type--statistics .field--name-field-stats {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
}
.paragraph.paragraph--type--statistics .field--name-field-stats > .field__item {
  flex: 1;
  max-width: 250px;
  margin: 1em;
  text-align: center;
}
.paragraph.paragraph--type--statistics .field--name-field-stats .stat-stat {
  color: var(--thm-white);
  font-weight: bold;
  background: var(--thm-dark-blue);
  border-radius: 10px;
  padding: 5px 10px;
  margin-bottom: 10px;
  font-size: 2em;
  display: inline-block;
}

.bgopt3.paragraph.paragraph--type--statistics .field--name-field-stats .stat-stat {
  color: var(--thm-dark-green);
  background-color: var(--thm-white);
}

.bgopt3.paragraph.paragraph--type--statistics .field--name-field-stats .stat-description {
  color: var(--thm-white);
}

.paragraph--type--cta-simple-contact-form {
  border: 1px solid var(--thm-mid-grey);
  border-radius: 3px;
  padding: 2em;
  background: var(--thm-grey);
}
.paragraph--type--cta-simple-contact-form form {
  display: flex;
  flex-direction: column;
}

.paragraph--type--cta-simple-contact-form [id^="edit-flexbox"] {
  align-items: end;
}
.paragraph--type--cta-simple-contact-form [id^="edit-actions"] {
  max-width: 175px;
  justify-content: center;
  display: flex;
}

.paragraph.paragraph--type--insert-view.qa-view h2 {
  margin: 0;
}
.paragraph.paragraph--type--insert-view.qa-view a.button {
  text-decoration: none;
  display: inline-block;
}
.paragraph.paragraph--type--insert-view.qa-view .ask-question {
  text-align: center;
  padding: 1em 0;
}
.bgopt3.paragraph.paragraph--type--insert-view.qa-view,
.bgopt3.paragraph.paragraph--type--insert-view.qa-view label,
.bgopt3.paragraph.paragraph--type--insert-view.qa-view ::marker {
  color: var(--thm-white);
}

.paragraph-flexi-tile-wrapper img {
  max-width: 100%;
  height: auto;
}
.paragraph--type--flexi-tiles .field.field--name-field-tiles {
  column-gap: 1em;
  margin: 0 2em;
  align-items: stretch;
  box-sizing: border-box;
}
.paragraph.paragraph--type--flexi-tiles.tile-quantity-1 .paragraph-flexi-tile-wrapper {
  max-width: 60vw;
}
.paragraph.paragraph--type--flexi-tiles.tile-quantity-2 .paragraph-flexi-tile-wrapper {
  max-width: 40vw;
}
.paragraph.paragraph--type--flexi-tiles.tile-quantity-other .paragraph-flexi-tile-wrapper {
  max-width: 20vw;
}
.paragraph.paragraph--type--flexi-tiles .paragraph-flexi-tile-wrapper {
  min-width: 350px;
  height: 100%;
  box-sizing: border-box;
}
.paragraph.paragraph--type--flexi-tile .flexi-tiles-text p {
  padding: 0;
  margin: 0 0 1em;
}
.paragraph-flexi-tile-wrapper .field--name-field-button a {
  display: inline-block;
  padding: 0.5em 2em;
  border-radius: 3px;
}

.paragraph--type--downloads {
  text-align: center;
  border-radius: 3px;
}
/* .paragraph--type--downloads h2.downloads-title {
  color: var(--thm-white)!important;
  margin-bottom: 1rem!important;
} */
.paragraph--type--downloads .downloads-files a {
  font-size: 1.5rem;
  background-size: 45px;
  padding: 1rem 1rem 1rem 3.5rem;
  background-position: 5px;
  border-radius: 3px;
  margin-bottom: 1em;
  background-repeat: no-repeat;
  display: inline-block;
  transition: all 0.3s;
}
.paragraph--type--downloads .file--application-pdf,
.paragraph--type--downloads .file--x-office-document {
  background: none;
  padding:0;
  color: var(--thm-dark-blue);
}
.paragraph--type--downloads .file--application-pdf a {
  background-image: url(/themes/jg/images/icons/pdf.png);
}
.paragraph--type--downloads .file--x-office-document a {
  background-image: url(/themes/jg/images/icons/docx.png);
}


.paragraph--type--tiles {
  border-radius: 3px;
}
.paragraph--type--insert-view,
.paragraph--type--insert-webform {
  border-radius: 3px;
}


.wf-loading .paragraph.paragraph--type--new-banner .new-banner-marketing-message,
.wf-loading .new-banner-button-text,
.wf-loading .call-to-action-button-text,
.wf-loading .client-job-form-submission-wrapper .webform-button--submit.button.js-form-submit.form-submit,
.wf-loading .client-job-form-submission-wrapper .thm-button,
.wf-loading .call-out-text-line-2,
.wf-loading .numbered-info-title,
.wf-loading .call-to-action-title, 
.wf-loading .paragraph.paragraph--type--new-tiles .tiles-title,
.wf-loading .paragraph.paragraph--type--insert-view .insert-view-title,
.wf-loading .paragraph.paragraph--type--flexi-tiles .flexi-tiles-title,
.wf-loading .paragraph.paragraph--type--faq-container .faq-container-title,
.wf-loading .paragraph.paragraph--type--downloads .downloads-title,
.wf-loading .tablink,
.wf-loading .link-desc-link a {
  visibility: hidden;
}


.double-text-wrapper {
  display: flex;
  flex-wrap: wrap;
}

.double-text-wrapper .double-text-left-text.bgwhitewithborder,
.double-text-wrapper .double-text-right-text.bgwhitewithborder {
  border: 1px solid var(--thm-mid-grey);
}
.double-text-wrapper .double-text-left-text {
  flex: 1;
  border-right: none!important;
  border-radius: 3px 0 0 3px;
  padding: 2em 2em 2em 5em;
}
.double-text-wrapper .double-text-right-text {
  flex: 1;
  border-left: none!important;
  border-radius: 0 3px 3px 0;
  padding: 2em 5em 2em 2em;
}
.bgopt3.double-text-left-text,
.bgopt3.double-text-right-text,
.bgopt3.double-text-left-text p,
.bgopt3.double-text-right-text p,
.bgopt3.double-text-left-text h2,
.bgopt3.double-text-right-text h2,
.bgopt3.double-text-left-text h3,
.bgopt3.double-text-right-text h3,
.bgopt3.double-text-left-text li,
.bgopt3.double-text-right-text li,
.bgopt3.double-text-left-text a,
.bgopt3.double-text-right-text a {
  color: var(--thm-white);
}

.double-text-wrapper .double-text-right-text.bgwhiteborder,
.double-text-wrapper .double-text-left-text.bgwhiteborder {
  border-bottom: 1px solid var(--thm-mid-grey);
}


.double-text-wrapper .grey {
  background-color: var(--thm-grey);
}
.double-text-wrapper .orange {
  background-color: var(--thm-pink);
}
.double-text-wrapper .green {
  background-color: var(--thm-light-green);
}
.faq-wrapper {
  margin-left: auto;
  margin-left: auto;
  border: 1px solid var(--thm-mid-grey);
  border-radius: 3px;
  padding: 0.5em;
  text-align: left;
}
.faq-alignment-center .faq-wrapper {
  text-align: center;
}
.faq-alignment-right .faq-wrapper {
  text-align: right;
}

.faq-question {
  font-size: 1.2em;
}
.faq-answer {
  margin-left: 1.6em;
}


/*----New Accounts page Start -----*/
.mobiletab {
  display: none;
}

.tablink.active {
  background: inherit;
  z-index: 10!important;
}
.tablink:hover {
  background: var(--thm-light-green);
}

.tablink {
  all: unset;
  display: flex;
  height: auto;
  box-sizing: border-box;
  border-radius: 3px 3px 0 0;
  padding: 10px 2vw;
  align-self: center;
  font-family: "ff-market-web", sans-serif;
  font-size: clamp(1.3rem, 2vw, 2rem);
  column-gap: 2vw;
  border: 1px solid var(--thm-mid-grey);
  border-bottom: none;
  cursor: pointer;
}
.tablink {
  background: rgb(153,153,153);
  background: linear-gradient(180deg,rgba(153,153,153,0) 70%,rgba(153,153,153,0.3) 100%);
}

.tabcontent {
  padding: 3em 5vw;
  border: 1px solid var(--thm-mid-grey);
  border-top: none;
  border-radius: 0 0 3px 3px;
  overflow: hidden;
  position: relative;
  z-index: 11;
  background: white;
  clip-path: inset(0px -10px -10px -10px);
}
.infographic-text {
  font-size: clamp(0.8rem, 1.3vw, 25px);
  /* background-color: var(--thm-white); */
}
.paragraph.paragraph--type--infographic.img-left {
  flex-direction: row-reverse;
  background-color: var(--thm-white);
}


.paragraph.paragraph--type--infographic .right {
  border-radius: 0 3px 3px 0;
  overflow: hidden;
}
.paragraph.paragraph--type--infographic.img-right {
  border-radius: 3px;
  overflow: hidden;
  background-color: var(--thm-white);
}
.paragraph.paragraph--type--link-with-description {
  display: flex;
  column-gap: 40px;
  align-items: center;
  justify-content: center;
  padding: 20px;
  flex-wrap: wrap;
  border-radius: 3px;
  border: 1px solid var(--thm-mid-grey);
  background-color: var(--thm-white);
}

.paragraph.paragraph--type--link-with-description .link-desc-link {
  order: 1;
}
.paragraph.paragraph--type--link-with-description.link-right .link-desc-description {
  order: 2;
}
.paragraph.paragraph--type--link-with-description.link-left .link-desc-description {
  order: 0;
}


.link-desc-link a {
  padding: 0.5rem 1em;
  border-radius: 3px;
  display: inline-block;
  margin: 0.5rem 0;
}

.link-desc-description {
  flex: 1.5;
  display: flex;
  justify-content: center;
  min-width: 280px;
  text-align: center;
  color: var(--thm-dark-blue);
  font-size: clamp(0.8rem, 1.3vw, 25px);
}
.link-desc-link {
  flex: 1;
  text-align: center;
  display: flex;
  justify-content: center;
  min-width: 200px;
}


.tab-orange,
.tablink.active.tab-orange {
  background-color: var(--thm-orange);
}
.tab-white,
.tablink.active.tab-white {
  background-color: var(--thm-white);
}
.tab-grey,
.tablink.active.tab-grey {
  background-color: var(--thm-grey);
}
.tab {
  display: flex;
  width: 100%;
  box-sizing: border-box;
  position: relative;
  top: 2px;
  column-gap: 0px;
  flex-wrap: wrap;
}
.tab button {
  flex: 1;
  flex-basis: auto;
}
.tabs-icon img {
  height: clamp(20px, 2vw, 40px);
}



/*----New Accounts page End -----*/

/*------ New site style CSS End ----------------*/





/*------MAIN PAGE CSS ----------------*/

.topsection, .middle-row, .lower-row{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  width:100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

/* .left{
  max-width: 700px;
  width:100%;
  min-width:400px;
}
.right{ 
  width:calc(100% - 700px);
  padding-left:30px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;  
} */

.topsection .right{
  min-height:700px;
}

.left.information{
  padding-left:30px;
}


.topsection .right img {
  width: 100%;
  margin-top:-100px;
  float:right;
}


.middle-row .left img{
  max-width:620px;
  width:620px;
  float:right;
  padding-top:20px;
}

.right h2{
  padding-top:20px;
  margin-top: 0;
}

.lower-row .right img{
  padding-top:20px;
  max-width: 610px;
  height:auto;
  float:right;
}


.field--name-field-map-location{
  text-align: right;
  padding-top:20px; 
}

.clearfix{
  clear:left;
}
.clearfixb{
  clear:both;
}
img.tops-left{
  width:100%;
  height:auto;  
}

.user-save-message {
  text-align: center;
  border: 1px solid var(--thm-blue-3);
  background-color: var(--thm-grey);
  margin-left: 39%;
  max-width: 22%;
  padding: 5px;
  border-radius: 3px;
}

.broken-link {
  padding: 1em 0 4em;
  font-size: 10pt;
}

div#webform-submission-candidate-form-node-3-form-ajax {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.progress-step.is-active .progress-marker::before {
  background-color: var(--thm-green);
}

/*--------------------------Blog and Article -------------*/

.blog-first-wapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 0 1em 0;
  border-bottom: 1px solid var(--thm-mid-grey);
}
.blog-left {
  margin-right: 50px;
  width: 100%;
}
.blog-right, .blog-right img {
  width: 100%;
  height: auto;
  max-width: 400px;
}

.createdlinks {
  padding-bottom:10px;
  font-weight: normal;
  color: var(--thm-dark-blue);
  margin: 20px 0;
}
.createdlinks img {
  border-radius: 100px;
}

.thm-article, .partner-page-wrapper,
.blog-page-wrapper, .thm-page{
  background-color: var(--thm-white);
  padding: 0 5vw 2em;
}


.sidebar-flex {
  display: flex;
  position: relative;
}
.sidebar-flex #page-content,
.sidebar-flex .detailed-job-wrapper {
  max-width: calc(100vw - 22vw);
  box-sizing: border-box;
}
.sidebar-flex #right-sidebar {
  width: 22vw;
  max-width: 22vw;
  margin-right: 5vw;
  will-change: min-height;
}
.sidebar-flex #right-sidebar.has-banner {
  top: 575px;
  position: relative;
}
.sidebar-flex #right-sidebar h2 {
  margin-bottom: 1em;
  color: var(--thm-blue-2);
}
.related-content-tile {
  border: 1px solid var(--thm-mid-grey);
  border-radius: 3px;
  padding: 2em;
  margin-bottom: 2em;
  display: block;
  background-color: var(--thm-grey);
  transition: all 0.3s;
  color: var(--thm-blue-2);
  line-height: 1.5;
}
.related-content-tile:hover,
.related-content-tile.review-cv {
  background-color: var(--thm-dark-green);
  color: var(--thm-white)!important;
  transition: all 0.3s;
}
.related-content-tile.review-cv p,
.related-content-tile.review-cv ul{
  color: var(--thm-white);
}
.related-content-tile.review-cv ul li {
  color: var(--thm-white);
  padding: 0;
}
.related-content-tile.review-cv .button {
  margin: 1em 0 0;
  transition: all 0.3s;
  display: inline-block;
  min-width: 0;
}

.related-content-tile.review-cv ul {
  list-style: none; /* Remove default bullets */
  padding: 0;
  line-height: 1.1;
  margin-left: 1.5em;
}

.related-content-tile.review-cv ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: var(--thm-white); /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}

.related-content-tile h3 {
  margin: 0 0 0.5em 0;
  font-size: 1.2rem;
}
.related-content-tile:hover h3 {
  margin: 0 0 0.5em 0;
  color: var(--thm-white);
}
.related-content-tile p {
  padding: 0;
}
.related-content-tile:hover p {
  color: var(--thm-white);
}
[data-drupal-views-infinite-scroll-pager] {
  padding-inline-start: 0;
  text-align: center;
}
[data-drupal-views-infinite-scroll-pager] button {
  font-size: 0.9rem;
}

.thm-article .paragraph--type--text-with-video .paragraph-right,
.thm-article .paragraph--type--text-with-video .paragraph-left {
  margin: 2em 2vw;
}

.thm-article .paragraph--type--column-text {
  padding: 1em 0 2em;
}
.thm-article p,
.partner-page-wrapper p,
.blog-page-wrapper p,
.view-hidden-events p,
.view-aa-blog-tiles.view-display-id-block_2 p {
  padding: 0 0 10px;
  line-height: 1.5;
}
.partner-card-wrapper p {
  padding: 0;
  
}
.partner-page-wrapper .views-row p, 
.blog-page-wrapper .views-row p,
.view-hidden-events .views-row p,
.view-aa-blog-tiles.view-display-id-block_2 .views-row p {
  font-size: 0.75rem;
}

.partner-card-wrapper h2,
.blog-left h2,
.paragraph-title h2,
.view-aa-company-cards .h3 {
  color: var(--thm-dark-blue);
  padding: 0;
}

.paragraph.paragraph--type--text-with-video.videoright h2,
.paragraph.paragraph--type--text-with-video.videoleft h2,
.paragraph--type--column-text h2 {
  color:  var(--thm-blue-2);
  padding: 0;
  -webkit-margin-after: 0.83em;
  margin-block-end: 0.83em;
}

.partner-page-wrapper h1, .blog-page-wrapper h1, .thm-article h1, .ext-job-listing-page-wrapper h1 {
  color: var(--thm-dark-blue);
  padding: 10px 30px 10px 10vw;
  /* background: var(--thm-blue-4); */
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: -10vw;
  line-height: 1.1;
}
.node--type-thm-page h1 {
  font-size: 3em;
  color: var(--thm-dark-blue);
  padding: 10px 30px 10px 10vw;
  /* background: var(--thm-blue-4); */
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  /* margin-top: 50px; */
  margin-left: -10vw;
  line-height: 1.1;
}
/*
.node--type-thm-page {
  background: var(--thm-white);
  padding-top: 2vw;
}
*/

.partner-page-wrapper .view-content,
.blog-page-wrapper .view-content,
.view-hidden-events .view-content,
.view-aa-company-cards .view-content .views-infinite-scroll-content-wrapper,
.view-aa-blog-tiles.view-display-id-block_2 .view-content
{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  grid-gap: 1em;
  margin-top: 1em;
}

/* Featured image inside single blog page */
.blog-featured-image img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 20px auto;
  border-radius: 8px;
  object-fit: cover;   /* crop gracefully if container smaller */
}
/* Ensure blog tile images stay inside their card */
.view-aa-blog-tiles .views-row img {
  width: 100% !important;
  height: 200px !important;
  object-fit: cover;
  border-radius: 6px;
  display: block;
}

.view-aa-blog-tiles .views-row img.image-style-large {
  width: 100% !important;
  height: 200px !important;
  object-fit: cover;
}



.article-image img, .partner-card-wrapper img {
  width: 100%;
  height: auto;
  display: block;
}
.view.view-home-page-blog.view-id-home_page_blog.view-display-id-block_1 {
  margin: 0 0 2vw 0;
}

.view.view-home-page-blog.view-id-home_page_blog.view-display-id-block_1 .slick__slide {
  background: var(--thm-white);
  padding: 10px;
  width: 100%;
  height: auto;
  max-width: 450px;
  margin: 20px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.4);
  border-radius: 1vw;
}
.view.view-home-page-blog.view-id-home_page_blog.view-display-id-block_1 .slick-track {
  display: flex;
} 


.partner-page-wrapper .views-row, 
.blog-page-wrapper .views-row, 
.view-hidden-events .views-row, 
.view-aa-company-cards .views-row,
.view-aa-blog-tiles.view-display-id-block_2 .views-row {
  background: var(--thm-white);
  padding: 1em;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.partner-page-wrapper .views-row,
.view-hidden-events .views-row,
.view-aa-company-cards .views-row {
  border: 1px solid var(--thm-mid-grey);
  padding: 1em;
  transition: all 0.3s;
}
.blog-page-wrapper .views-row,
.view-aa-blog-tiles .views-row {
  border: 1px solid var(--thm-mid-grey);
  padding: 0;
  transition: all 0.3s;
  border-radius: 3px;
}
.blog-page-wrapper .views-row .article-text-wrapper,
.view-aa-blog-tiles .views-row .article-text-wrapper {
  padding: 1em;
}
.view-aa-blog-tiles.view-display-id-block_1 .views-row {
  min-width: 275px;
  max-width: 400px;
}
.view-aa-blog-tiles.view-display-id-block_1 .views-infinite-scroll-content-wrapper {
  display: flex;
  flex-wrap: wrap;
  row-gap: 2em;
  column-gap: 2em;
}
.view-aa-blog-tiles.view-display-id-block_1 .views-infinite-scroll-content-wrapper.clearfix::after {
  display: none;
}

.partner-page-wrapper .views-row:hover,
.blog-page-wrapper .views-row:hover,
.view-hidden-events .views-row:hover,
.view-aa-company-cards .views-row:hover,
.view-aa-blog-tiles.view-display-id-block_2 .views-row:hover {
  background-color: var(--thm-dark-blue);
  color: var(--thm-white);
  transition: all 0.3s;
}
.partner-page-wrapper .views-row:hover h2,
.partner-page-wrapper .views-row:hover p,
.blog-page-wrapper .views-row:hover h2,
.blog-page-wrapper .views-row:hover p,
.view-hidden-events .views-row:hover h2,
.view-hidden-events .views-row:hover p,
.view-aa-company-cards .views-row:hover h2,
.view-aa-company-cards .views-row:hover p,
.view-aa-blog-tiles.view-display-id-block_2 .views-row:hover h2,
.view-aa-blog-tiles.view-display-id-block_2 .views-row:hover p {
  color: var(--thm-white);
  transition: all 0.3s;
}
.view.view-home-page-blog.view-id-home_page_blog.view-display-id-block_1 h2 {
  font-size: 1rem;
  color: var(--thm-dark-blue);
  text-align: center;
  padding: 10px;
}
.view-aa-blog-tiles select#edit-field-tags-target-id {
  all: unset;
  border: 1px solid var(--thm-mid-grey);
  padding: 0.5em;
  background: url(/themes/jg/images/down-arrow.svg) no-repeat;
  background-color: rgba(0,0,0,0);
  background-position-x: 0%;
  background-position-y: 0%;
  background-size: auto;
  background-position-x: 0%;
  background-position-y: 0%;
  background-size: auto;
  background-position: right 5px center;
  background-size: 10px 10px;
  background-color: var(--thm-white);
}

.view.view-aa-blog-tiles h2 {
  color: var(--thm-dark-blue);
  font-size: 1.1rem;
  font-weight: 400;
}
.partner-page-wrapper a.views-more-link, .partner-card-wrapper a {
  display: block;
  text-align: right;
}

input.form-text, input.form-url, input#edit-contact-email-, input#edit-contact-phone-, #edit-candidate-email, #edit-referrer-email {
  width: 100%;
  height: 40px;
  margin: 5px 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-family: 'Open Sans', sans-serif;
  font-weight: normal;
}
input#edit-email-,
input#edit-user-name-to-log-into-the-hidden-market-,
input#edit-name {
  width: 100%;
  height: 40px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-family: 'Open Sans', sans-serif;
  font-weight: normal;
}
.webform-required {
  text-align: center;
  padding-top: 10px;
}

form#webform-submission-advert-webform-node-470-add-form div#edit-flexbox {
  row-gap: 10px;
}
form#webform-submission-advert-webform-node-470-add-form .webform-button--submit {
  background-color: var(--thm-white);
  color: var(--thm-dark-blue);
  margin-top: 0px;
}
form#webform-submission-advert-webform-node-470-add-form .webform-button--submit:hover {
  background-color: var(--thm-grey);
  color: var(--thm-dark-blue);
  box-shadow: none;
}



.jgforms label,
form#user-form label,
.jgforms legend,
.user-cv-form label,
.user-cv-form .form-composite > legend {
  font-size: 1rem;
  color: var(--thm-dark-blue);
  margin-right: 5px;
  padding: 0px;
  font-family: 'Open Sans', sans-serif;
}
.user-cv-form .form-type-radio label {
  font-size: 1rem;
  color: var(--thm-dark-blue);
}

.webform-button--submit.button.js-form-submit.form-submit:hover,
.field--name-field-job-apply-url a:hover {
  color: var(--thm-white);
  background-color: var(--thm-dark-blue);
}
.webform-confirmation__message, .webform-confirmation__back {
  /* margin: 3vw; */
  /* color: var(--thm-white); */
  font-size: 1rem;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.webform-confirmation__back a {
  font-size: 1rem;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  background-color: var(--thm-dark-blue);
  padding: 5px 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 3px;
  min-width: 130px;
  color: var(--thm-white);
  border: 2px solid var(--thm-dark-blue);
  position: relative;
  top: 100px;
}
.webform-confirmation__back a:hover {
  color: var(--thm-white);
  background-color: var(--thm-dark-blue);
}
.webform-progress-tracker .progress-text {
  color: var(--thm-dark-blue);
  font-size: 0.8em;
  line-height: normal;
}

#webform-submission-referral-form-node-234-add-form label {
  font-size: 1.2rem;
  color: var(--thm-dark-blue);
  margin-right: 5px;
  padding: 0px;
}
.ext-job-flex-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-column-gap: 40px;
  -moz-column-gap: 40px;
  column-gap: 40px;
  row-gap: 40px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.ext-job-page-left {
  -webkit-box-flex: 3;
  -ms-flex: 3;
  flex: 3;
  min-width: 400px;
}
.ext-job-page-right {
  -webkit-box-flex: 2;
  -ms-flex: 2;
  flex: 2;
  min-width: 400px;
}

#webform-submission-referral-form-node-234-add-form, .ext-job-page-right h2 {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 600px;
  
}



.sf-accordion-toggle.sf-style-none {
  float: right;
  width: 30px;
  height: 30px;
  margin-right: 5vw;
  
  
}
.sf-accordion-toggle.sf-style-none span {
  visibility: hidden;
  
  
}
a#superfish-main-toggle {
  margin: 0;
  background-image: url(/themes/jg/images/hamburger-icon.svg);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: center;
  
}
a#superfish-main-toggle.sf-expanded {
  margin: 0;
  background-image: url(/themes/jg/images/ham-menu-cross.svg);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: center;
}

.header-dark-green a#superfish-main-toggle {
  background-image: url(/themes/jg/images/hamburger-icon-white.svg);
}
.header-dark-green #superfish-main-toggle.sf-expanded {
  background-image: url(/themes/jg/images/ham-menu-cross-white.svg);
}

ul.sf-menu li:last-child {
  padding-right: 3vw;
  
}
/*--------------------Jobs page -------------------*/

#views-exposed-form-jobs-block-3 .form--inline {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#views-exposed-form-jobs-block-3 #edit-actions {
  all: unset;
  width: 100%;
  text-align: center;
}
#views-exposed-form-jobs-block-3 #edit-actions input {
  margin: 0 1em 0 0;
  height: 40px;
}

.slick--view--job-matches-for-candidate--block-2 {
  padding-top: 0;
  margin: 0 -5vw;
}
.job-matches {
  text-align: center;
}

#slick-views-job-matches-for-candidate-block-block-1-1 button.slick-prev.slick-arrow,
#slick-views-job-matches-for-candidate-block-block-2-1 button.slick-prev.slick-arrow {
  background-color: white;
  border: 0;
  height: 30px;
  width: 30px;
  margin-right: 20px;
  background-image: url(/themes/jg/images/arrow-left-nav.svg);
  background-repeat: no-repeat;
  left: -35vw;
}
#slick-views-job-matches-for-candidate-block-block-1-1 button.slick-next.slick-arrow,
#slick-views-job-matches-for-candidate-block-block-2-1 button.slick-next.slick-arrow {
  background-color: white;
  border: 0;
  height: 30px;
  width: 30px;
  margin-left: 20px;
  background-image: url(/themes/jg/images/arrow-right-nav.svg);
  background-repeat: no-repeat;
  right: -35vw;
}



.job-wrapper,
.job-tile-wrapper {
  width:100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 11pt;
  line-height: 16pt;
  text-align: center;
}
.job-tile-wrapper .job-line {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
}
.job-details-wrapper {
  padding: 0.5em;
  font-size: 11pt;
  line-height: 1.2;
}

.job-tile-wrapper .job-line p {
  font-size: 0.83em;
  -webkit-margin-before: 0;
  margin-block-start: 0;
  -webkit-margin-after: 0;
  margin-block-end: 0;
  -webkit-margin-start: 0px;
  margin-inline-start: 0px;
  -webkit-margin-end: 0px;
  margin-inline-end: 0px;
  padding:2px;
}

.view-jobs:not(.view-display-id-block_3) .view-content,
.view-jobs.view-display-id-block_3 .view-content .views-infinite-scroll-content-wrapper,
.view-job-matches-for-candidate .view-content {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  /* margin:2vw 6vw; */
  -webkit-box-pack: space-evenly;
  -ms-flex-pack: space-evenly;
  justify-content: space-evenly;
  padding: 2vw 5vw;
  -webkit-column-gap: 30px;
  -moz-column-gap: 30px;
  column-gap: 30px;
  row-gap: 30px;
}
.view-jobs.view-display-id-block_3 .view-content .views-infinite-scroll-content-wrapper .views-row::after {
  display: none;
}

.paragraph--type--insert-view .view-jobs .view-content {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap: wrap;
  flex-wrap: nowrap;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  -webkit-box-pack: space-evenly;
  -ms-flex-pack: space-evenly;
  justify-content: space-evenly;
  padding: 0;
  row-gap: 30px;
}

.job-wrapper h3,
.job-tile-wrapper h3 {
  color: var(--thm-dark-blue);
  text-align: center;
  width:100%;
  margin: 0.5em 0;
}
.job-wrapper h4,
.job-tile-wrapper h4  {
  font-size: 1.1rem;
  -webkit-margin-before: 0;
  margin-block-start: 0;
  -webkit-margin-after: .8em;
  margin-block-end: .8em;
  text-align: center;
  width:100%;
  margin: 0 0 0.5em 0;
}
.job-company {
  max-height: 1.5em;
  overflow: hidden;
}

.webform-submission-job-application-form .form-textarea-wrapper .form-textarea {
  padding: 10px;
  color: var(--thm-dark-blue);
  font-size: 1.1rem;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.back-button {
  width:170px;
  text-align: center;
  line-height: 50px;
  height:50px;
  border-radius:10px;
  display:block;
  color: white;
  font-size:1rem;
}

.back-button:hover {
  background-color: red;
}


.candidate-wrapper {
  width:calc(100% - 10vw);
  padding-left: 5vw;
  padding-right:5vw;
  background-color: white;
}

.candidate-table {
  padding-top:2vw;
  padding-bottom:2vw;
  font-family: 'Open Sans', sans-serif;
  font-size: 10pt;
}
.candidate-table td, .candidate-table th {
  border:1px solid #ccc;
  padding:5px;
  font-family: 'Open Sans', sans-serif;
}
.candidate-table td a {
  font-family: 'Open Sans', sans-serif;
}

.candidate-table th, .candidate-table th a {
  background-color: #ebebeb;
  font-family: 'Open Sans', sans-serif;
}

ul.tabs {
  background-color: white;
  width:calc(100% - 10vw);
  padding-left: 5vw;
  padding-right:5vw;
}

details {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  border: none;
}

.job-wrapper .view-filters {
  padding: 1em 2em;
  border-radius: 3px;
  text-align: left;
}

/* .job-wrapper label, span.fieldset-legend {
  font-family: 'Homenaje-Regular', sans-serif;
  font-weight: normal;
  font-size: 1.2rem;
  color: var(--thm-dark-blue);
}*/


.job-wrapper .form--inline .form-item {
  margin: 0 1em 1em 0;
}
fieldset#edit-webform-submission-value-6-wrapper {
  width: auto;
}
summary.h2 {
  font-size: 1.8rem;
  color: var(--thm-blue-4);
  margin-bottom: 1em;
  padding: 0;
}

[class*='form-item-views-bulk-operations-bulk-form'] {
  margin-top: 0!important;
  margin-bottom: 0!important;
}

.field--name-field-notes p {
  padding-top: 0;
}

/*-------------------- Job Entity Styling -------------------*/
/* Specific styling for the job banner */
.job-banner {
  background-color: #f9f9f9; !important
  padding: 15px; !important
  display: grid; !important
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); !important /* Creates responsive grid columns */
  gap: 20px; !important /* Adds space between grid items */
  justify-items: center; !important /* Centers each item horizontally within its cell */
  align-items: center; !important /* Centers each item vertically within its cell */
  text-align: center; !important
}

/* Field groups inside banners */
.job-banner .field-group {
  display: flex;
  flex-direction: column; /* Stacks label and value vertically */
  justify-content: center; /* Centers them vertically */
  align-items: center; /* Centers them horizontally */
  text-align: center;
  font-size: 1rem;
  font-weight: bold;
  color: #023020;
}

/* Shared styling for banners and wrappers */
.job-banner,
.job-wrapper {
  background-color: #f9f9f9;
  border-radius: 5px;
  margin-bottom: 20px;
}

/* Specific styling for the job banner */
.job-banner {
  padding: 15px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
  text-align: center;
}

/* Specific styling for job wrapper */
.job-wrapper {
  padding: 20px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}


/* Company field (specific styling for the label and value) */
.job-wrapper .company-label {
  font-weight: bold; !important
  color: #023020; !important /* Green for label */
  font-size: 1.2rem; !important
  text-align: center; !important
}

.job-wrapper .company-value {
  font-weight: normal; !important
  color: #7a788d; !important /* Grey for value */
  font-size: 1rem; !important
  text-align: center; !important
}


/* Job title styling */
.job-wrapper .job-title {
  color: #023020;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
}

/* Description styling */
.job-description {
  text-align: center;
  margin: 20px auto;
  max-width: 800px;
}

/* Apply button styling */
.button-container .apply-button {
  display: inline-block; !important
  background-color: #023020; !important
  color: #fff; !important
  padding: 10px 20px; !important
  border-radius: 5px; !important
  text-decoration: none; !important
  font-weight: bold; !important
  transition: background-color 0.3s ease; !important
}


.button-container .apply-button {
  background-color: #023020; /* Default background color */
  color: #fff; /* Default text color */
  padding: 10px 20px;
  min-width: 80px;
  min-height: 20px;
  text-decoration: none;
  border: none;
  border-radius: 5px; /* Rounded corners */
  font-weight: bold;
  text-align: center; !important
  transition: background-color 0.3s ease; /* Smooth transition for hover effect */
}

.button-container {
  text-align: center; /* Center-align inline elements */
  margin-top: 20px;
  width: 100%; /* Ensure the container spans full width */
}


.button-container .apply-button:hover {
  background-color: #ffc83d; /* Background color on hover */
  color: #000; /* Optional: Change text color on hover */
}

/* Job title field (specific styling for the label and value) */
.job-wrapper .job-title-value {
  color: #023020 !important; /* Green for job title */
  font-weight: bold !important;
  font-size: 2rem !important; /* Larger size for Job Title */
  text-align: center !important;
}

.job-wrapper .job-title-label {
  font-weight: bold;
  color: #023020; /* Green for label */
  font-size: 2rem; /* Larger size for Job Title */
  text-align: center;
}

.job-wrapper .job-title-value {
  font-weight: normal;
  color: #7a788d; /* Grey for value */
  font-size: 1.8rem;
  text-align: center;
  margin-bottom: 10px;
}




/*-------------Job match candidate cards Start---------*/

#slick-views-job-matches-for-candidate-block-block-1-1 .slick__slide .views-field-nothing {
  width: 350px;
}

.job-tile-wrapper .job-links-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 5px;
     -moz-column-gap: 5px;
          column-gap: 5px;
  margin: auto 5px 20px;
}
.job-tile-wrapper .job-links-wrapper .job-read-more,
.job-tile-wrapper .dismiss-match,
.job-tile-wrapper .save-match {
  padding: 5px 10px;
  border-radius: 3px;
  font-size: 0.8rem;
}


.job-tile-wrapper .job-line {
  display: block;
}
.job-match-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-column-gap: 10px;
     -moz-column-gap: 10px;
          column-gap: 10px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.match {
  padding: 0.5em 1em;
  background-color: var(--thm-white);
  border-radius: 3px;
}
.match.best-match {
  color: var(--thm-dark-green);
  border: 1px solid var(--thm-dark-green);
}
.match.great-match {
  color: var(--thm-dark-blue);
  border: 1px solid var(--thm-dark-blue);
}
.match {
  color: var(--thm-blue-4);
  border: 1px solid var(--thm-blue-4);
}
.job-thm.thm-search, .job-thm.thm-ad {
  font-size: 0.8rem;
  color: var(--thm-dark-blue);
  line-height: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.job-thm.thm-search::before, .job-thm.thm-ad::before {
  content: "";
  background-image: url(/sites/default/files/thm-mag-glass.svg);
  background-repeat: no-repeat;
  background-size: 35px;
  width: 35px;
  height: 35px;
  margin-right: 5px;
}





/*-------------Job match candidate cards End---------*/
/*-------------company cards---------*/

.cc-wrapper .view-content .views-infinite-scroll-content-wrapper{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  width:100%;
  padding: 2vw 5vw;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-pack: space-evenly;
  -ms-flex-pack: space-evenly;
  justify-content: space-evenly;
  -webkit-column-gap: 20px;
  -moz-column-gap: 20px;
  column-gap: 20px;
  row-gap: 20px;
}

.cc-wrapper .views-row{
  width:100%;
  background-color: white;
  max-width: 350px;
  min-width: 250px;
}

.cc-wrapper .views-row:hover{
  -webkit-box-shadow: 0 0 15px #ccc;
          box-shadow: 0 0 15px #ccc;
}

.cc-wrapper .views-row img{
  width:230px;
  height:auto;
  padding:10px;
}

.company-info {
  padding:20px;
  text-align: justify;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.cc-wrapper p{
  font-size: 1rem;
  font-family: 'Open Sans', sans-serif;
  text-align: right;
  padding-right:20px;
}
.company-logo {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  padding-top: 20px;
}
/*------------------------------Candidate Card styling------*/
.candcard1wrapper{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  position:relative;
  background-color: white;
  width:100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 15px 30px;
  margin-bottom: 1em;
}

.candcard1wrapper .left, .candcard1wrapper .middle, .candcard1wrapper .right{
  -webkit-box-flex:1;
  -ms-flex:1;
  flex:1;
}

.candcard1wrapper.pinline {
  display:inline-block;
}

/*--------------------------webform styling---------------*/

.webform-submission-information, .webform-submission-nav {
  display:none;
}

.webform-submission-edit-form .webform-submission-nav {
  display: inherit;
  color: var(--thm-white);
}
.webform-submission-edit-form .webform-submission-nav select,
.webform-submission-edit-form .webform-submission-nav input {
  color: #000;
}

.detailed-job-wrapper {
  background-color: var(--thm-white);
  margin-top: 2vw;
  margin-bottom: 2vw;
  /* box-shadow: 0px 40px 20px -20px rgba(0, 0, 0, 0.3); */
}

.job-opportunity-wrapper {
  padding: 1em 1em 2em;
  border-top: 1px solid var(--thm-mid-grey);
  border-bottom: 1px solid var(--thm-mid-grey);
  margin: 1em 0 0;
}
.job-opportunity-wrapper .job-header {
  display: flex;
  flex-wrap: wrap;
}
.job-opportunity-wrapper .job-header img {
  margin-left: auto;
  max-width: 10%;
  max-height: 60px;
}
.job-advert-wrapper {
  padding: 1em;
  border-bottom: 1px solid var(--thm-mid-grey);
  color: var(--thm-blue-1)!important;
  font-size: 0.9em!important;
  line-height: 1.1!important;
}
.job-advert-wrapper p,
.job-advert-wrapper li {
  padding: 0;
}
.job-advert-wrapper h3 {
  margin: 0;
  padding: 1em 0;
}
.job-buttons-wrapper {
  padding: 1em;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.jobs-sidebar {
  position: relative;
  transform: translate(0, 0);
  transform: translate3d(0, 0, 0);
  will-change: position, transform;
  padding-top: 2em;
}
.jobs-sidebar .thm-button.large {
  font-size: 1.2em;
  background-color: var(--thm-green);
}
.jobs-sidebar .job-buttons-wrapper {
  padding: 1em 0;
}
.jobs-sidebar .thm-button {
  min-width: 0;
}
.more-opportunities-wrapper {
  background: var(--thm-light-green);
  padding: 0em 2em 1.5em;
  border: 1px solid var(--thm-mid-grey);
  border-radius: 3px;
  margin-bottom: 1em;
}
.share-this-job {
  background: var(--thm-grey);
  padding: 0em 2em 1.5em;
  border: 1px solid var(--thm-mid-grey);
  border-radius: 3px;
  margin-bottom: 1em;
}
.post-a-job {
  background: var(--thm-dark-green);
  padding: 0em 2em 1.5em;
  border: 1px solid var(--thm-mid-grey);
  border-radius: 3px;
  margin-bottom: 2em;
  color: var(--thm-white);
}
.job-referral {
  background: var(--thm-pink);
  padding: 0em 2em 1.5em;
  border: 1px solid var(--thm-mid-grey);
  border-radius: 3px;
  margin-bottom: 1em;
}
.job-referral #edit-actions {
  text-align: left;
}

.more-opportunity-wrapper strong a {
  font-weight: bold;
}
.more-opportunity-wrapper {
  margin-bottom: 1.0em;
  padding-left: 1em;
  font-size: 0.9em;
}
.more-opportunity-wrapper .location {
  font-size: 0.9em;
}

.detailed-job-wrapper h2 {
  margin-left:-5vw;
  padding-left:5vw;
  color: var(--thm-dark-blue);
  padding: 10px 30px 10px 5vw;
  /* background: -webkit-radial-gradient(left top circle, #151241 20%, #6ec8b9 75%) no-repeat;
  background: radial-gradient(circle at left top, #151241 20%, #6ec8b9 75%) no-repeat; */
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;    
}

#candidate-card h2 {
  margin-left:-5vw;
  padding-left: 5vw;
  color: var(--thm-dark-blue);
  padding: 10px 30px 10px 5vw;
  /* background: -webkit-radial-gradient(left top circle, #151241 20%, #6ec8b9 75%) no-repeat;
  background: radial-gradient(circle at left top, #151241 20%, #6ec8b9 75%) no-repeat; */
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;    
}

#candidate-card {
  background-color: white;
  padding:1vw 5vw;
}
.candidate-card.share-profile-wrapper {
  background: var(--thm-light-green);
  padding-bottom: 1em;
  margin-bottom: 1em;
}

.tabs.secondary {
  display:none;
}

.webf_label {
  display:block;
  padding-right: 20px;
  font-size: 1.1rem;
  min-width:fit-content;
  margin-bottom: 10px;
}
.webf_about_label {
  display:block;
  padding-right: 20px;
  font-size: 1.1rem;
  min-width:200px;
  margin-bottom: 20px;
}
.webf_about_label h3{
  margin-bottom: 0;
  
}
.webf_about_label p{
  font-size: 1rem;
  white-space: pre-line;
}
.webf_label h4{
  font-size: 1.3rem;
  color: var(--thm-dark-blue);
  margin-bottom: 2px;
}
.webf_label p{
  font-weight: 400;    
  font-size: 1rem;
  color: #626262;
}
.webf_label li{
  font-weight: 400;    
  font-size: 1rem;
  color: #626262;
  padding-bottom: 0;
}
.webf_label ul {
  margin-top: 0;
  -webkit-padding-start: 20px;
  padding-inline-start: 20px;
}
.detailed-job-wrapper .flex-group {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  width:100%;
  justify-content:flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  column-gap: 50px;
  
}
.js-form-item.form-item.js-form-type-textarea.form-type-textarea.js-form-item-please-state-why-you-want-to-apply-for-this-job.form-item-please-state-why-you-want-to-apply-for-this-job .form-textarea-wrapper {
  margin-top: 10px;
}
.js-form-item.form-item.js-form-type-textarea.form-type-textarea.js-form-item-please-state-why-you-want-to-apply-for-this-job.form-item-please-state-why-you-want-to-apply-for-this-job label {
  font-size: 1rem;
  margin-bottom: 2px;
}
.job-title-apply {
  display: flex;
  justify-content: space-between;
  margin-bottom: 2em;
  align-items: center;
}
.job-title-apply h1 {
  margin: 0;
}

.detailed-job-wrapper .client-job-form-submission-wrapper {
  padding: 0;
  background-color: var(--thm-white);
  border: none;
  margin-bottom: 0;
  display: inline-block;
}
.detailed-job-wrapper .client-job-form-submission-wrapper .webform-submission-job-application-add-form {
  display: inline-block;
}
.detailed-job-wrapper .client-job-form-submission-wrapper .webform-submission-job-application-add-form .form-item {
  display: none;
}
.detailed-job-wrapper .client-job-form-submission-wrapper .webform-submission-job-application-add-form #edit-actions {
  margin: 0;
}
.detailed-job-wrapper .client-job-form-submission-wrapper .webform-submission-job-application-add-form #edit-actions input,
.job-title-apply .thm-button {
  margin: 0 0 0 2em;
  font-size: 1.5em;
  padding: 0.5em 1em;
  background-color: var(--thm-green);
  border: 1px solid var(--thm-mid-grey);
  color: var(--thm-white);
  transition: all 0.3s;
  min-width: 170px;
}
.detailed-job-wrapper .client-job-form-submission-wrapper .webform-submission-job-application-add-form #edit-actions input:hover,
.job-title-apply .thm-button:hover {
  background-color: var(--thm-dark-blue);
  border: 1px solid var(--thm-mid-grey);
  color: var(--thm-white);
}
.client-job-form-referal-wrapper {
  padding: 1vw 2vw 2vw;
  background-color: var(--thm-grey);
  margin-bottom: 1em;
}
.job-advert-wrapper .field--name-body fieldset {
  all: unset;
}
.job-advert-wrapper .field--name-body legend {
  display: none;
}
.path-webform #webform-submission-review-my-cv-add-form,
.path-webform #webform-submission-review-my-jd-add-form,
.path-webform #webform-submission-request-to-post-a-job-add-form,
#webform-submission-book-a-meeting-add-form {
  margin: 0 5vw;
}
#webform-submission-book-a-meeting-add-form .webform-options-display-buttons label.webform-options-display-buttons-label {
  vertical-align: top;
}
#webform-submission-book-a-meeting-add-form .webform-options-display-buttons-title {
  padding-bottom: 1em;
}

#edit-meeting-type .form-type-radio .description {
  margin: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.webform-options-display-buttons input:checked + label.webform-options-display-buttons-label {
  border-color: var(--thm-dark-blue);
}

.edi-paragraph {
  font-style: italic;
  margin: 15px 30px;
}
.edi-my-profile {
  font-style: italic;
  margin: 15px 30px;
  padding-top: 1em;
  margin-top: 1em;
  border-top: 1px solid var(--thm-mid-grey);
}

.job-line.job-title {
  display: flex;
  align-self: center;
  width: 100%;
  margin: 0;
}
.job-line.job-title h3 {
  color: var(--thm-dark-blue);
  overflow: hidden;
  max-height: 2.3em;
}

/*--------------------Paragraph styling -------------------*/

.field--name-field-paragraph > .field__item {
  text-align: center;
}

.bgopt1 {
  background-color: var(--thm-grey);
  border: 1px solid var(--thm-mid-grey);
}
.bgopt2 {
  background-color: var(--thm-pink);
  border: 1px solid var(--thm-mid-grey);
}
.bgopt3 {
  background-color: var(--thm-dark-green);
  border: 1px solid var(--thm-mid-grey);
}
.bgopt4 {
  background-color: var(--thm-light-green);
  border: 1px solid var(--thm-mid-grey);
}
.bgwhite {
  background-color: var(--thm-white);
}
.bgwhite.bborder {
  border-bottom: 1px solid var(--thm-mid-grey);
}
.paragraph.bgopt1,
.paragraph.bgopt2,
.paragraph.bgopt3,
.paragraph.bgopt4 {
  padding: 2em;
}
.paragraph.bgopt3 p,
.paragraph.bgopt3 p a,
.paragraph.bgopt3 li,
.paragraph.bgopt3 li a,
.paragraph.bgopt3 li::marker,
.paragraph.bgopt3 h2, 
.paragraph.bgopt3 h3 {
  color: var(--thm-white);
}

.paragraph.paragraph--type--insert-view.bgopt3 p,
.paragraph.paragraph--type--insert-view.bgopt3 h2,
.paragraph.paragraph--type--insert-view.bgopt3 h3,
.paragraph.paragraph--type--insert-webform.bgopt3 p,
.paragraph.paragraph--type--insert-webform.bgopt3 h2,
.paragraph.paragraph--type--insert-webform.bgopt3 h3 {
  color: inherit;
}

.paragraph.paragraph--type--insert-webform.bgopt3 .fieldset-legend,
.paragraph.paragraph--type--insert-webform.bgopt3 label,
.paragraph.paragraph--type--insert-webform.bgopt3 h3 {
  color: var(--thm-white)!important;
  background-color: var(--thm-dark-green);
}
.paragraph.paragraph--type--insert-webform.bgopt3 .webform-options-display-buttons input:checked + label.webform-options-display-buttons-label {
  background-color: var(--thm-dark-blue);
  border-color: var(--thm-white);
  box-shadow: none;
}

.paragraph--type--cta-simple-contact-form.bgopt3 h2,
.paragraph--type--downloads.bgopt3 h2,
.paragraph--type--insert-view.bgopt3 > h2,
.paragraph--type--insert-webform.bgopt3 > h2 {
  color: var(--thm-white)!important;
}

.paragraph--type--text-with-image.bgwhite p,
.paragraph--type--text-with-image.bgopt1 p,
.paragraph--type--text-with-image.bgwhite li,
.paragraph--type--text-with-image.bgopt1 li {
  color: var(--thm-blue-2)!important;
}

.paragraph--type--new-tiles.bgopt1,
.paragraph--type--new-tiles.bgopt2,
.paragraph--type--new-tiles.bgopt3,
.paragraph--type--new-tiles.bgopt4,
.paragraph--type--new-tiles.bgwhite {
  padding: 0;  
}
.paragraph--type--new-tiles .tiles-subtitle {
  text-align: center;
  padding: 0 2em;
  font-family: 'Open Sans',sans-serif;
  font-size: 1.2em;
}

.paragraph--type--text-with-image h6 {
  color:var(--thm-white);
  line-height: 1.5;
  font-style: italic;
  padding: 0;
  margin:0;
}

.paragraph--type--text-with-image h2 {
  color: var(--thm-dark-blue);
  
}
.paragraph--type--text-with-image h3 {
  color: var(--thm-dark-blue);
  text-align: left;
  margin-left: 0;
  margin-bottom: 5px;
}

.clogo {
  width:100%;
  text-align: center;
}
.clogo img {
  margin-right:auto;
  margin-left:auto;
  height:230px;
  width:230px;
  -o-object-fit: cover;
  object-fit: cover;
  margin-bottom: 1vw;
  -o-object-fit: contain;
  object-fit: contain;
  background-color: white;
}

.curl {
  margin-top:2vw;
  margin-bottom:2vw;
  padding:10px;
  width:100%;
  text-align: center;
  background: white;
  
}

/*------------ Footer user account menu-------------------*/

#block-useraccountmenu ul.sf-menu.menu li {
  background-color: white;
  padding:0;
  width:150px;
  text-align: center;
}
#block-useraccountmenu ul.sf-menu.menu li:last-child {
  padding:0;
}
#block-useraccountmenu #superfish-account {
  width:300px;
  margin-left:auto;
  margin-right: auto;
}

#block-adminlinks {
  padding: 0.75em 5vw;
  background-color: var(--thm-pink);
}
#block-adminlinks a {
  text-decoration: none;
  padding: 0.2em 1em;
  display: inline-block;
}
#block-adminlinks a:hover {
  background-color: var(--thm-white);
}

#block-useraccountmenu h2{
  color: white;
  text-align: center;
}

.field-group-html-element,
.user-company-profile-form details,
.user-candidate-profile-form details:not(details details):not(.description-details),
.user-my-profile-form details:not(details details):not(.description-details),
.nice-form-region form {
  padding: 1em 0;
  border-bottom: 1px solid var(--thm-mid-grey);
  margin-bottom: 1em;
}
.user-candidate-profile-form details summary,
.user-my-profile-form details summary,
.user-company-profile-form details summary {
  padding: 1em;
  margin: 0;
}
.user-candidate-profile-form details summary:hover,
.user-my-profile-form details summary:hover,
.user-company-profile-form details summary:hover {
  background: var(--thm-light-green);
}
.user-candidate-profile-form details,
.user-my-profile-form details,
.user-company-profile-form details {
  width: auto;
}

.user-candidate-profile-form details[id^="edit-field-upload-cv"] th,
.user-my-profile-form details[id^="edit-field-upload-cv"] th,
.user-company-profile-form details[id^="edit-field-upload-cv"] th {
  display: none;
}
.user-candidate-profile-form details[id^="edit-field-upload-cv"] .form-managed-file,
.user-my-profile-form details[id^="edit-field-upload-cv"] .form-managed-file,
.user-company-profile-form details[id^="edit-field-upload-cv"] .form-managed-file {
  display: block;
  margin-bottom: 1em;
  margin-right: 1em;
}
.user-candidate-profile-form details[id^="edit-field-upload-cv"] .file,
.user-my-profile-form details[id^="edit-field-upload-cv"] .file,
.user-company-profile-form details[id^="edit-field-upload-cv"] .file {
  max-width: 200px;
  word-wrap: anywhere;
  display: block;
}
.user-candidate-profile-form details[id^="edit-field-upload-cv"] .form-managed-file label,
.user-my-profile-form details[id^="edit-field-upload-cv"] .form-managed-file label,
.user-company-profile-form details[id^="edit-field-upload-cv"] .form-managed-file label {
  margin-bottom: 0;
}
.user-candidate-profile-form details .tabledrag-toggle-weight-wrapper,
.user-my-profile-form details .tabledrag-toggle-weight-wrapper,
.user-company-profile-form details .tabledrag-toggle-weight-wrapper {
  display: none;
}
.user-candidate-profile-form details .field-multiple-drag,
.user-my-profile-form .field-multiple-drag {
  display: none!important;
}
.user-candidate-profile-form details .field-multiple-table th,
.user-candidate-profile-form details .field-multiple-table td,
.user-my-profile-form .field-multiple-table th,
.user-my-profile-form .field-multiple-table td {
  border: none!important;
  text-align: left;
}
.user-candidate-profile-form details .field-multiple-table,
.user-my-profile-form .field-multiple-table {
  margin: 0 0 1rem!important;
  font-size: 1rem;
}
.user-candidate-profile-form details .tabledrag-toggle-weight,
.user-my-profile-form .tabledrag-toggle-weight {
  display: none!important;
}
.user-candidate-profile-form details .field-multiple-table td,
.user-my-profile-form .field-multiple-table td {
  padding: 0!important;
}
.user-my-profile-form .field-multiple-table td input{
  max-width: 334px!important;
}
.user-candidate-profile-form details .field-multiple-table th,
.user-my-profile-form .field-multiple-table th {
  padding: 0!important;
}
.user-candidate-profile-form details .field-multiple-table th .label,
.user-my-profile-form .field-multiple-table th .label {
  margin-bottom: 0!important;
}
/* .user-candidate-profile-form details[id^="edit-field-upload-cv"] .description,
.user-my-profile-form details[id^="edit-field-upload-cv"] .description,
.user-company-profile-form details[id^="edit-field-upload-cv"] .description,
.user-candidate-profile-form [id^="edit-field-upload-portfolio"] .description,
.user-my-profile-form [id^="edit-field-upload-portfolio"] .description,
.user-company-profile-form [id^="edit-field-upload-portfolio"] .description {
  display: none;
} */
.user-candidate-profile-form details[id^="edit-field-upload-cv"] .form-type-textfield label,
.user-my-profile-form details[id^="edit-field-upload-cv"] .form-type-textfield label,
.user-company-profile-form details[id^="edit-field-upload-cv"] .form-type-textfield label,
.user-candidate-profile-form [id^="edit-field-upload-portfolio"] .form-type-textfield label,
.user-my-profile-form [id^="edit-field-upload-portfolio"] .form-type-textfield label,
.user-company-profile-form [id^="edit-field-upload-portfolio"] .form-type-textfield label {
  font-size: 0.8rem;
  margin-top: 0.5em;
}
.user-candidate-profile-form details[id^="edit-field-upload-cv"] .form-type-managed-file label,
.user-my-profile-form details[id^="edit-field-upload-cv"] .form-type-managed-file label,
.user-company-profile-form details[id^="edit-field-upload-cv"] .form-type-managed-file label {
  display: none!important;
}
.user-candidate-profile-form details[id^="edit-field-upload-cv"] .tabledrag-handle,
.user-my-profile-form details[id^="edit-field-upload-cv"] .tabledrag-handle,
.user-company-profile-form details[id^="edit-field-upload-cv"] .tabledrag-handle,
.user-candidate-profile-form [id^="edit-field-upload-portfolio"] .tabledrag-handle,
.user-my-profile-form [id^="edit-field-upload-portfolio"] .tabledrag-handle,
.user-company-profile-form [id^="edit-field-upload-portfolio"] .tabledrag-handle {
  display: none!important;
}
.user-candidate-profile-form input[id^="edit-field-upload-cv"].form-text,
.user-my-profile-form input[id^="edit-field-upload-cv"].form-text,
.user-company-profile-form input[id^="edit-field-upload-cv"].form-text,
.user-candidate-profile-form input[id^="edit-field-upload-portfolio"].form-text,
.user-my-profile-form input[id^="edit-field-upload-portfolio"].form-text,
.user-company-profile-form input[id^="edit-field-upload-portfolio"].form-text {
  max-width: 200px!important;
}
.user-candidate-profile-form input[id^="edit-field-upload-cv"] .form-text,
.user-my-profile-form input[id^="edit-field-upload-cv"] .form-text,
.user-company-profile-form input[id^="edit-field-upload-cv"] .form-text,
.user-candidate-profile-form input[id^="edit-field-upload-portfolio"] .form-text,
.user-my-profile-form input[id^="edit-field-upload-portfolio"] .form-text,
.user-company-profile-form input[id^="edit-field-upload-portfolio"] .form-text {
  max-width: 200px!important;
}
.user-candidate-profile-form input[id^="edit-field-upload-cv"][id*="remove-button"],
.user-my-profile-form input[id^="edit-field-upload-cv"][id*="remove-button"],
.user-company-profile-form input[id^="edit-field-upload-cv"][id*="remove-button"],
.user-candidate-profile-form input[id^="edit-field-upload-portfolio"][id*="remove-button"],
.user-my-profile-form input[id^="edit-field-upload-portfolio"][id*="remove-button"],
.user-company-profile-form input[id^="edit-field-upload-portfolio"][id*="remove-button"] {
  font-size: 0 !important;
  background: url(/themes/jg/images/icons/delete.svg) !important;
  height: 30px !important;
  width: 30px !important;
  display: block !important;
  background-size: 26px !important;
  background-repeat: no-repeat !important;
}
.user-candidate-profile-form table[id^="edit-field-upload-cv"] thead,
.user-my-profile-form table[id^="edit-field-upload-cv"] thead,
.user-company-profile-form table[id^="edit-field-upload-cv"] thead,
.user-candidate-profile-form table[id^="edit-field-upload-portfolio"] thead,
.user-my-profile-form table[id^="edit-field-upload-portfolio"] thead,
.user-company-profile-form table[id^="edit-field-upload-portfolio"] thead {
  display: none!important;
}
.user-candidate-profile-form table[id^="edit-field-upload-cv"] td,
.user-my-profile-form table[id^="edit-field-upload-cv"] td,
.user-company-profile-form table[id^="edit-field-upload-cv"] td,
.user-candidate-profile-form table[id^="edit-field-upload-portfolio"] td,
.user-my-profile-form table[id^="edit-field-upload-portfolio"] td,
.user-company-profile-form table[id^="edit-field-upload-portfolio"] td {
  border-bottom: 0px!important;
  vertical-align: middle;
}
.user-candidate-profile-form details[id^="edit-field-upload-cv"] summary,
.user-my-profile-form details[id^="edit-field-upload-cv"] summary {
  background-color: #fff !important;
  color: var(--thm-dark-blue) !important;
  pointer-events: none;
  font-weight: bold;
  font-size: 1rem !important;
  padding: 0;
}
.user-candidate-profile-form details[id^="edit-field-upload-cv"] details,
.user-my-profile-form details[id^="edit-field-upload-cv"] details {
  margin: 0!important;
  padding: 0!important;
}
.user-candidate-profile-form details[id^="edit-field-upload-cv"] details .details-wrapper,
.user-my-profile-form details[id^="edit-field-upload-cv"] details .details-wrapper {
  margin: 0!important;
  padding: 0!important;
}
.user-candidate-profile-form details[id^="edit-field-upload-cv"],
.user-my-profile-form details[id^="edit-field-upload-cv"] {
  margin: 0!important;
}
.user-candidate-profile-form details[id^="edit-field-upload-cv"] .form-item,
.user-my-profile-form details[id^="edit-field-upload-cv"] .form-item {
  margin: 0;
}

.user-candidate-profile-form #edit-field-address-wrapper details,
.user-my-profile-form #edit-field-address-wrapper details,
.user-company-profile-form #edit-field-address-wrapper details {
  box-sizing: border-box;
  box-shadow: none;
}

input#edit-created-min-date,
input#edit-created-max-date,
input#edit-access-min-date,
input#edit-access-max-date {
  margin-top: 10px;
  height: 40px;
}

.profile {
  width:100%;
  margin-left:auto;
  margin-right: auto;
  padding:3vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  /* max-width: 500px; */
  text-align: center;
  display: block;
  font-size: 2rem;
  color: var(--thm-white);
}

video, audio {
  background: 000;
  margin-top: 0.5rem;
  max-width: 600px;
  max-height: 350px;
}

h2.profile-name {
  color: var(--thm-dark-blue);
  font-style: italic;
}
.profile .label, .profile .field__label {
  
  color: var(--thm-white);
  font-size: 2rem;
  font-weight: normal;
  display: block;
  padding-bottom: 0;
  margin-top: 20px;
}
.profile .field__item {
  
  color: #000;
  font-size: 1.7rem;
  
}
.profile .form-item {
  margin-top: 0;
  margin-bottom: 30px;
}
.profile a {
  color: #000;
}
.profile p {
  font-size: 1rem;
}
.non-details-multi-wrapper .form-item summary {
  display: none!important;
}
.form-item .file a {
  font-size: 0.8rem!important;
  padding-bottom: 5px!important;
  display: inline-block!important;
}
.form-item .file-size {
  display: none!important;
}

#drupal-off-canvas-wrapper.ui-dialog [class*="form-item-field-upload-cv"].form-type-textfield::before {
  content: 'Description (optional)';
  font-weight: bold;
  color: var(--thm-dark-blue);
  padding: 5px 0;
  display: block;
  font-size: 0.8rem;
  margin-top: -1rem;
}
[class*="form-item-field-upload-cv"].form-type-textfield::before {
  content: 'Description (optional)';
  font-weight: bold;
  color: var(--thm-dark-blue);
  padding: 0;
  display: block;
  font-size: 0.8rem;
}

form#user-form {
  background: var(--thm-white);
  padding: 2vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  max-width: 600px !important;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 2vw;
  margin-top: 2vw;
  -webkit-box-shadow: 0px 40px 20px -20px rgba(0, 0, 0, 0.3);
          box-shadow: 0px 40px 20px -20px rgba(0, 0, 0, 0.3);
}

form#user-form .js-form-wrapper.form-wrapper {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 100% !important;
  
}

.no-break {
  white-space: nowrap;
}



#edit-social-auth-buttons:after {
  content: 'OR';
  color: var(--thm-dark-blue);
  display: block;
  font-weight: bold;
  font-size: 1.2em;
  margin: 1.5em 0 0;
  text-align: center;
}

#edit-social-auth-linkedin {
  /* background-color: #151241; */
  padding: 10px 20px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 3px;
  min-width: 130px;
  margin-top: 20px;
  color: var(--thm-white);
  border: 2px solid var(--thm-dark-blue);
  font-size: 1em;
  display: block;
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
  margin-left: auto;
  margin-right: auto;
}
#edit-social-auth-linkedin:hover {
  border: 2px solid var(--thm-dark-blue);
}
#edit-social-auth-linkedin:before {
  display: inline;
  color: var(--thm-white);
  content: 'Login with your ';
  padding-left: 30px;
  background-image: url(/modules/contrib/social_auth_linkedin/img/linkedin_logo.svg);
  background-repeat: no-repeat;
  background-size: 22px;
}
#edit-social-auth-linkedin:after {
  display: inline;
  color: var(--thm-white);
  content: ' account';
}
.linktext {
  font-size: 1rem;
  float: right;
  padding-left: 1em;
}
.ui-widget-overlay {
  background: var(--thm-blue-1);
  opacity: 0.9;
}

.ui-widget-content a {
  color: var(--thm-dark-blue);
}

.views-exposed-form {
  max-width: 100%;
  margin: 0;
  padding: 0;
}
.views-exposed-form input.form-text {
  height: 40px;
  margin: 0px 0;
}
.view-footer {
  margin: 1em 0;
}

.js .dropbutton-multiple {
  all: unset;
}
.js .dropbutton-multiple .dropbutton-widget {
  width: 150px;
  position: relative;
  text-align: right;
}
.js .dropbutton-multiple .dropbutton-widget a {
  color: #333;
}
#my-profile {
  padding: 2em 5vw;
  clear: both;
  max-width: 1200px;
  margin: auto;
}
#my-profile a:not(.thm-button) {
  color: var(--thm-green);
  text-decoration: underline;
}
#my-profile a:not(.thm-button):hover {
  color: var(--thm-dark-blue);
}
#my-profile div {
  position: relative;
}
.my-profile-header {
  display: flex;
  align-items: center;
  clear: both;
  padding-top: 1em;
}
.my-profile-buttons {
  display: flex;
  justify-content: end;
}
.my-profile-buttons a {
  margin: auto 0 auto 5px;
}
.my-profile-header .my-profile-section {
  text-align: center;
}
.my-profile-header .my-profile-section p {
  line-height: 2;
}
.my-profile-section a.thm-button {
  margin: 1em 0 auto 5px;
}
.my-profile-buttons a:first-child,
.my-profile-section a.thm-button.first {
  margin: auto 0;
}
.my-profile-type {
  color: var(--thm-blue-2);
  font-size: 1.5rem;
}
.my-profile-section {
  padding: 1em 0 0;
  margin: 1em 0;
  border-top: 1px solid var(--thm-mid-grey);
}
.my-profile-header .my-profile-section {
  border-top: 0;
  margin-top: 0;
  padding-top: 0;
}
.my-profile-section ul {
  color: var(--thm-blue-2);
}
.my-profile-section li {
  padding: 0;
}

.my-profile-dets {
  padding: 1em 0;
  margin: 1em 0;
  border-top: 1px solid var(--thm-mid-grey);
  display: flex;
  flex-wrap: wrap;
}
.my-profile-dets table {
  font-size: 1rem;
  color: var(--thm-blue-3);
  margin-right: 5em;
  min-width: 480px;
}
.my-profile-dets th {
  text-align: left;
  padding-right: 2em;
  color: var(--thm-blue-3);
  min-width: 250px;
  max-width: 250px;
  width: 250px;
}
.my-profile-dets li {
  padding: 0;
  width: 250px;
}
.my-profile-dets ul.cols-1 {
  columns: 1;
}
.my-profile-dets ul.cols-2 {
  columns: 2;
}
.my-profile-dets a:not(.editlink) {
  color: var(--thm-green);
  text-decoration: underline;
}
.my-profile-dets a:not(.editlink):hover {
  color: var(--thm-dark-blue);
}
.my-profile-dets > div {
  padding-right: 5em;
  flex: 1;
  min-width: 600px;
  margin-bottom: 1em;
}
.my-profile-dets .additional {
  display: none;
}
.my-profile-dets li.morelink {
  cursor: pointer;
  color: var(--thm-green);
  text-decoration: underline;
}
.my-profile-dets li.morelink:hover {
  color: var(--thm-dark-blue);
}
.editlink {
  position: absolute;
  top: 0;
  left: 0;
  display: none;
}
div:hover > .editlink {
  display: block;
}
.editlink img {
  width: 20px;
  padding: 3px;
  background: var(--thm-green);
  border-radius: 3px!important;
}
table.my-profile-table td {
  padding-right: 5em;
}
table.my-profile-table table {
  font-size: 1rem;
}

.profile-pic {
  padding-right: 2em;
}

.profile-pic img {
  border-radius: 500px;
}
.share-profile-wrapper {
  padding: 0 5vw;
}
.share-profile-wrapper h2 {
  color: var(--thm-dark-blue);
  font-style: italic;
}
.profile-cta-wrapper {
  padding: 2em 5vw 2em;
  background-color: var(--thm-grey);
  text-align: center;
  margin: 2em 0;
  font-size: 1.2em;
}
.share-profile-wrapper summary {
  display: list-item;
  color: var(--thm-dark-blue);
}

.cv-search,
.cv-search a {
  font-family: 'Open Sans', sans-serif;
  font-weight: normal;
}
.cv-search th a {
  font-weight: bold;
  text-decoration: underline;
}
.cv-search a:hover {
  color: var(--thm-green);
}
.tablesorter-header-inner {
  text-decoration: underline;
  cursor: pointer;
}
.tablesorter-header-inner:hover {
  color: var(--thm-green);
}

.thm-page.cv-search,
#salary-report-form form:not(.salary-report-form-simple) {
  padding: 2vw 3vw;
}

.view-saved-filter-sets .views-row,
.cv-search .views-row {
  margin-top: 1em;
}
.view-saved-filter-sets table tr,
.cv-search table tr {
  border-bottom: 1px solid var(--thm-mid-grey);
}
.view-saved-filter-sets table thead tr,
.cv-search table thead tr {
  border-bottom: 2px solid var(--thm-blue-5);
}
.view-saved-filter-sets table tr td,
.cv-search table tr td {
  padding: 5px 10px;
}
.view-saved-filter-sets table tr th,
.cv-search table tr th {
  text-align: left;
  padding: 5px 10px;
}
.cv-search .form-actions.js-form-wrapper.form-wrapper,
.cv-search .js-form-wrapper.form-wrapper,
.view-saved-filter-sets .form-actions.js-form-wrapper.form-wrapper,
.view-saved-filter-sets .js-form-wrapper.form-wrapper {
  text-align: left;
  margin: 0;
  max-width: none;
  width: inherit;
}
.cv-search .views-exposed-form .form-item,
.cv-search .views-exposed-form .fieldset-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin: 0 0.5em 1em;
}
.cv-search .views-exposed-form .fieldset-wrapper {
  margin-left: 0;
}
.cv-search .views-exposed-form fieldset {
  padding: 0;
  border: 0;
  max-width: 200px!important;
}
.cv-search .views-exposed-form label,
.cv-search .views-exposed-form .fieldset-legend {
  display: block;
  font-weight: bold;
  margin-bottom: 10px;
  font-size: 1rem;
}
.cv-search .views-exposed-form fieldset .form-item {
  margin: 0;
}
.cv-search .form-item-search-api-fulltext {
  max-width: 100%!important;
  width: 100%;
}

.views-exposed-form select {
  all: unset;
  font-family: 'Open Sans',sans-serif;
  font-weight: normal;
  font-size: 0.875rem;
  position: relative;
  min-height: 40px;
  border: 1px solid var(--thm-blue-5);
  border-radius: 3px;
  color: var(--thm-blue-2);
  min-width: 150px !important;
  padding: 8px;
  background: url(/themes/jg/images/down-arrow.svg) no-repeat;
  background-position-x: 0%;
  background-position-y: 0%;
  background-size: auto;
  background-position-x: 0%;
  background-position-y: 0%;
  background-size: auto;
  background-position: right 5px center;
  background-size: 10px 10px;
  background-color: var(--thm-white);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

#vbo-action-form-wrapper {
  margin-bottom: 1em;
}
.ext-job-details-flex {
  padding: 20px;
  margin-top: 20px;
  background: var(--thm-grey);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-column-gap: 30px;
  -moz-column-gap: 30px;
  column-gap: 30px;
  row-gap: 20px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}
.ext-job-page-left .field__label {
  margin-bottom: 0.7rem;
  color: var(--thm-dark-blue);
}
.ext-job-page-left .field {
  padding: 10px;
  min-width: 250px;
}
.paragraph.paragraph--type--job-location.paragraph--view-mode--default {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-column-gap: 30px;
  -moz-column-gap: 30px;
  column-gap: 30px;
  row-gap: 20px;
}

.required-asterisc legend span::after,
.required-asterisc label::after {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 0.3em;
  content: "";
  vertical-align: super;
  background-image: url(/core/misc/icons/ee0000/required.svg);
  background-repeat: no-repeat;
  background-size: 6px 6px;
  width: 7px;
  height: 7px;
  background-size: 7px 7px;
}
.ad-type.a_premium {
  padding: 10px;
  background: #daa520;
  color: var(--thm-white);
}
.ad-type.b_essential {
  padding: 10px;
  background: #7a788d;
  color: var(--thm-white);
}
form#user-company-profile-form fieldset#edit-field-industry--wrapper {
  -webkit-column-count: 3;
  -moz-column-count: 3;
  column-count: 3;
}
.progress-tracker--center {
  text-align: center;
}
.progress-tracker {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 60px auto;
  padding: 0;
  list-style: none;
}

.candidate-buttons {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.candidate-buttons h3 {
  background: var(--thm-pink);
  padding: 0.5em 1em;
}
.candidate-button-group {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  width: 300px;
  margin: 0.5em 1em;
  min-width: 300px;
  flex: 1;
}
.candidate-button-group ul {
  text-align: left;
  font-size: 1rem;
  line-height: 1;
  padding: 0;
  margin-bottom: auto;
}
.candidate-button-group li {
  padding: 0;
  line-height: 1.75;
}
.candidate-button-group li a {
  font-size: 1rem;
  color: var(--thm-dark-blue);
  text-decoration: underline;
}
.candidate-button-group li a:hover {
  text-decoration: none;
}
.candidate-buttons h3 {
  font-size: 1rem;
  font-weight: bold;
  color: var(--thm-dark-blue);
  margin: 0;
}

.job-matches {
  margin-top: 1em;
}
.job-matches a {
  text-decoration: underline;
  color: var(--thm-dark-blue);
}
.job-matches nav.slick__arrow,
.view-job-matches-for-candidate nav.slick__arrow {
  position: absolute;
  margin: 2em auto;
  display: inline-block;
  text-align: center;
}
.job-matches .slick-prev:before,
.job-matches .slick-next:before,
.view-job-matches-for-candidate .slick-prev:before,
.view-job-matches-for-candidate .slick-next:before {
  display: none;
}

.view.view-jobs.view-id-jobs.view-display-id-block_2 .view-content,
.view-job-matches-for-candidate.view-display-id-block_1 .view-content {
  display: block;
}
.view-job-matches-for-candidate .view-content {
  padding-left: 0;
  padding-right: 0;
}

.job-tile-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: inherit;
      -ms-flex-align: inherit;
          align-items: inherit;
  padding: 1em;
  position: relative;
  width: 300px;
  height: 300px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 1em;
  border-radius: 3px;
  border: 1px solid var(--thm-mid-grey);
}
div#edit-job-skills-specialism-s-items-0-item---more {
  white-space: initial;
}
.job-wrapper {
  color: var(--thm-blue-1);
}
.job-tile-wrapper {
  color: var(--thm-blue-1);
  background: var(--thm-white);
}

.pager__item.is-active a,
.pager__item .is-active a {
  font-weight: bold!important;
}

table.shortlisted-candidates tr {
  border-bottom: 1px solid var(--thm-mid-grey);
}

table.shortlisted-candidates td,
table.shortlisted-candidates th {
  padding: 10px;
}
table.shortlisted-candidates th {
  font-size: 1.1em;
  min-width: 240px;
  text-align: left;
}
.view-shortlist-reports .views-row {
  margin-top: 0;
}


/*------ New home pages Start ------ */
.how-we-help-flex-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-column-gap: 40px;
     -moz-column-gap: 40px;
          column-gap: 40px;
  row-gap: 40px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 80px;
  margin-top: 80px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.how-we-help-section-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  -webkit-column-gap: 40px;
     -moz-column-gap: 40px;
          column-gap: 40px;
  max-width: 450px;
  min-width: 280px;
  width: 100%;
}
.how-we-help-section-right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  -webkit-column-gap: 40px;
     -moz-column-gap: 40px;
          column-gap: 40px;
  max-width: 450px;
  min-width: 280px;
  width: 100%;
}

.how-we-help-text {
  -webkit-box-flex: 2;
      -ms-flex: 2;
          flex: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: left;
      -ms-flex-pack: left;
          justify-content: left;
}
.how-we-help-icon {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  max-width: 100px;
}
.how-we-help-icon img {
  width: 100px;
  height: 100px;
}
.how-we-help-text h3 {
  text-align: left;
  -webkit-margin-before: 0;
          margin-block-start: 0;
  -webkit-margin-after: 1rem;
          margin-block-end: 1rem;
}

/*------ New home pages End ------*/

.counter {
  background: red;
  border-radius: 50px;
  color: var(--thm-white);
  font-size: 0.8em;
  margin-left: 5px;
  padding: 0px 8px 1px;
  display: inline-block;
  font-weight: bold;
  text-align: center;
}
.page-load-progress-lock-screen {
  background-color: var(--thm-pink);
}
.page-load-progress-throbber::after {
  content: 'Please wait while we update your profile';
  display: block;
  font-weight: bold;
  clear: both;
  text-align: center;
  position: absolute;
  top: -100px;
  font-size: 2em;
  width: 400px;
  left: -140px;
  color: var(--thm-dark-blue);
}

.csv-feed .feed-icon {
  background-image: url(/themes/jg/images/csv.png);
  width: 100px;
  display: block;
  margin-bottom: 10px;
  height: 40px;
}
#drupal-off-canvas-wrapper.ui-widget.ui-widget-content {
  border: none;
  border-radius: 0;
  box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.75);
  z-index: 1000;
}

#drupal-off-canvas-wrapper.ui-dialog {
  background: var(--thm-white);
  padding: 0 2rem 1rem;
}

#drupal-off-canvas-wrapper.ui-dialog .ui-dialog-titlebar {
  background: var(--thm-green);
  border-bottom: 0;
  font-family: 'Open Sans', sans-serif;
  margin: 0 -2em;
  padding: 1em 3rem;
}
#drupal-off-canvas-wrapper.ui-dialog .form-required::after {
  content: " *";
  color: var(--thm-dark-pink);
}
#drupal-off-canvas-wrapper.ui-dialog form {
  padding: 0;
}
#drupal-off-canvas-wrapper.ui-dialog table {
  width: 100%;
  margin: 0!important;
}
#drupal-off-canvas-wrapper.ui-dialog .draggable:hover,
#drupal-off-canvas-wrapper.ui-dialog .draggable:focus-within {
  background: none;
}
#drupal-off-canvas-wrapper.ui-dialog label {
  margin-bottom: 5px;
}
#drupal-off-canvas-wrapper.ui-dialog input[type="submit"].button--primary {
  background: var(--thm-green);
  border-radius: 3px;
  padding: 0.5em;
  font-size: 1em;
  font-weight: normal;
  font-family: 'Open Sans', sans-serif;
}
#drupal-off-canvas-wrapper.ui-dialog .tabledrag-toggle-weight-wrapper {
  display: none;
}
#drupal-off-canvas-wrapper.ui-dialog td:first-child {
  padding: 0;
}
#drupal-off-canvas-wrapper.ui-dialog table h4 {
  margin-top: 0!important;
  font-size: 0.9rem;
}
#drupal-off-canvas-wrapper.ui-dialog fieldset {
  border: none;
  padding: 0;
}
#drupal-off-canvas-wrapper.ui-dialog input[type="submit"][id^="edit-submit"] {
  width: 100%!important;
}
#drupal-off-canvas-wrapper.ui-dialog input[type="submit"].button--primary:hover {
  background: var(--thm-dark-blue);
}
#drupal-off-canvas-wrapper.ui-dialog label,
#drupal-off-canvas-wrapper.ui-dialog .fieldset-legend {
  color: var(--thm-dark-blue);
  font-size: 0.9rem;
  font-family: 'Open Sans', sans-serif;
  font-weight: bold;
}
#drupal-off-canvas-wrapper.ui-dialog label.option {
  font-weight: normal;
}

#drupal-off-canvas-wrapper.ui-dialog .form-text, #drupal-off-canvas-wrapper.ui-dialog .form-tel, #drupal-off-canvas-wrapper.ui-dialog .form-email, #drupal-off-canvas-wrapper.ui-dialog .form-url, #drupal-off-canvas-wrapper.ui-dialog .form-search, #drupal-off-canvas-wrapper.ui-dialog .form-number, #drupal-off-canvas-wrapper.ui-dialog .form-color, #drupal-off-canvas-wrapper.ui-dialog .form-file, #drupal-off-canvas-wrapper.ui-dialog .form-textarea, #drupal-off-canvas-wrapper.ui-dialog .form-date, #drupal-off-canvas-wrapper.ui-dialog .form-time {
  border: 1px solid var(--thm-blue-5);
  border-radius: 3px!important;
  padding: 5px 10px;
  height: 40px!important;
  font-size: 1rem;
  box-sizing: border-box;
  background-color: var(--thm-white);
  box-shadow: none;
  font-family: 'Open Sans', sans-serif;
}
#drupal-off-canvas-wrapper.ui-dialog .form-text:focus, #drupal-off-canvas-wrapper.ui-dialog .form-tel:focus, #drupal-off-canvas-wrapper.ui-dialog .form-email:focus, #drupal-off-canvas-wrapper.ui-dialog .form-url:focus, #drupal-off-canvas-wrapper.ui-dialog .form-search:focus, #drupal-off-canvas-wrapper.ui-dialog .form-number:focus, #drupal-off-canvas-wrapper.ui-dialog .form-color:focus, #drupal-off-canvas-wrapper.ui-dialog .form-file:focus, #drupal-off-canvas-wrapper.ui-dialog .form-textarea:focus, #drupal-off-canvas-wrapper.ui-dialog .form-date:focus, #drupal-off-canvas-wrapper.ui-dialog .form-time:focus, #drupal-off-canvas-wrapper.ui-dialog input[type="submit"].button:focus, #drupal-off-canvas-wrapper.ui-dialog input[type="checkbox"]:focus, #drupal-off-canvas-wrapper.ui-dialog input[type="radio"]:focus {
  outline: 2px solid red!important;
  outline-offset: 1px!important;
  box-shadow: none!important;
  border-color: var(--thm-blue-5);
}
#drupal-off-canvas-wrapper.ui-dialog span, #drupal-off-canvas-wrapper.ui-dialog applet, #drupal-off-canvas-wrapper.ui-dialog object, #drupal-off-canvas-wrapper.ui-dialog iframe, #drupal-off-canvas-wrapper.ui-dialog h1, #drupal-off-canvas-wrapper.ui-dialog h2, #drupal-off-canvas-wrapper.ui-dialog h3, #drupal-off-canvas-wrapper.ui-dialog h4, #drupal-off-canvas-wrapper.ui-dialog h5, #drupal-off-canvas-wrapper.ui-dialog h6, #drupal-off-canvas-wrapper.ui-dialog p, #drupal-off-canvas-wrapper.ui-dialog blockquote, #drupal-off-canvas-wrapper.ui-dialog pre, #drupal-off-canvas-wrapper.ui-dialog a, #drupal-off-canvas-wrapper.ui-dialog abbr, #drupal-off-canvas-wrapper.ui-dialog acronym, #drupal-off-canvas-wrapper.ui-dialog address, #drupal-off-canvas-wrapper.ui-dialog big, #drupal-off-canvas-wrapper.ui-dialog button, #drupal-off-canvas-wrapper.ui-dialog cite, #drupal-off-canvas-wrapper.ui-dialog code, #drupal-off-canvas-wrapper.ui-dialog del, #drupal-off-canvas-wrapper.ui-dialog dfn, #drupal-off-canvas-wrapper.ui-dialog em, #drupal-off-canvas-wrapper.ui-dialog img, #drupal-off-canvas-wrapper.ui-dialog ins, #drupal-off-canvas-wrapper.ui-dialog kbd, #drupal-off-canvas-wrapper.ui-dialog q, #drupal-off-canvas-wrapper.ui-dialog s, #drupal-off-canvas-wrapper.ui-dialog samp, #drupal-off-canvas-wrapper.ui-dialog small, #drupal-off-canvas-wrapper.ui-dialog strike, #drupal-off-canvas-wrapper.ui-dialog strong, #drupal-off-canvas-wrapper.ui-dialog sub, #drupal-off-canvas-wrapper.ui-dialog sup, #drupal-off-canvas-wrapper.ui-dialog tt, #drupal-off-canvas-wrapper.ui-dialog var, #drupal-off-canvas-wrapper.ui-dialog b, #drupal-off-canvas-wrapper.ui-dialog u, #drupal-off-canvas-wrapper.ui-dialog i, #drupal-off-canvas-wrapper.ui-dialog center, #drupal-off-canvas-wrapper.ui-dialog dl, #drupal-off-canvas-wrapper.ui-dialog dt, #drupal-off-canvas-wrapper.ui-dialog dd, #drupal-off-canvas-wrapper.ui-dialog ol, #drupal-off-canvas-wrapper.ui-dialog ul, #drupal-off-canvas-wrapper.ui-dialog li, #drupal-off-canvas-wrapper.ui-dialog fieldset, #drupal-off-canvas-wrapper.ui-dialog form, #drupal-off-canvas-wrapper.ui-dialog label, #drupal-off-canvas-wrapper.ui-dialog legend, #drupal-off-canvas-wrapper.ui-dialog table, #drupal-off-canvas-wrapper.ui-dialog caption, #drupal-off-canvas-wrapper.ui-dialog tbody, #drupal-off-canvas-wrapper.ui-dialog tfoot, #drupal-off-canvas-wrapper.ui-dialog thead, #drupal-off-canvas-wrapper.ui-dialog tr, #drupal-off-canvas-wrapper.ui-dialog th, #drupal-off-canvas-wrapper.ui-dialog td, #drupal-off-canvas-wrapper.ui-dialog article, #drupal-off-canvas-wrapper.ui-dialog aside, #drupal-off-canvas-wrapper.ui-dialog canvas, #drupal-off-canvas-wrapper.ui-dialog details, #drupal-off-canvas-wrapper.ui-dialog embed, #drupal-off-canvas-wrapper.ui-dialog figure, #drupal-off-canvas-wrapper.ui-dialog figcaption, #drupal-off-canvas-wrapper.ui-dialog footer, #drupal-off-canvas-wrapper.ui-dialog header, #drupal-off-canvas-wrapper.ui-dialog hgroup, #drupal-off-canvas-wrapper.ui-dialog main, #drupal-off-canvas-wrapper.ui-dialog menu, #drupal-off-canvas-wrapper.ui-dialog meter, #drupal-off-canvas-wrapper.ui-dialog nav, #drupal-off-canvas-wrapper.ui-dialog output, #drupal-off-canvas-wrapper.ui-dialog progress, #drupal-off-canvas-wrapper.ui-dialog ruby, #drupal-off-canvas-wrapper.ui-dialog section, #drupal-off-canvas-wrapper.ui-dialog summary, #drupal-off-canvas-wrapper.ui-dialog time, #drupal-off-canvas-wrapper.ui-dialog mark, #drupal-off-canvas-wrapper.ui-dialog audio, #drupal-off-canvas-wrapper.ui-dialog video, #drupal-off-canvas-wrapper.ui-dialog input, #drupal-off-canvas-wrapper.ui-dialog select, #drupal-off-canvas-wrapper.ui-dialog textarea {
  color: var(--thm-dark-blue);
  font-family: 'Open Sans', sans-serif;
}
#drupal-off-canvas-wrapper.ui-dialog tr:hover td {
  background-color: var(--thm-white);
}
#drupal-off-canvas-wrapper.ui-dialog .form-select, #drupal-off-canvas-wrapper.ui-dialog .form-text, #drupal-off-canvas-wrapper.ui-dialog .form-tel, #drupal-off-canvas-wrapper.ui-dialog .form-email, #drupal-off-canvas-wrapper.ui-dialog .form-url, #drupal-off-canvas-wrapper.ui-dialog .form-search, #drupal-off-canvas-wrapper.ui-dialog .form-number, #drupal-off-canvas-wrapper.ui-dialog .form-color, #drupal-off-canvas-wrapper.ui-dialog .form-file, #drupal-off-canvas-wrapper.ui-dialog .form-textarea, #drupal-off-canvas-wrapper.ui-dialog .form-date, #drupal-off-canvas-wrapper.ui-dialog .form-time {
  border: 1px solid var(--thm-blue-5);
  border-radius: 3px;
  font-size: 1rem;
  color: var(--thm-blue-2);
  height: 40px;
}
#drupal-off-canvas-wrapper.ui-dialog details, #drupal-off-canvas-wrapper.ui-dialog summary,
#drupal-off-canvas-wrapper.ui-dialog .ui-dialog-content {
  background: var(--thm-white);
}
#drupal-off-canvas-wrapper.ui-dialog a, #drupal-off-canvas-wrapper.ui-dialog .link {
  color: var(--thm-green);
  font-size: 1rem;
}
#drupal-off-canvas-wrapper.ui-dialog .description, #drupal-off-canvas-wrapper.ui-dialog .form-item .description, #drupal-off-canvas-wrapper.ui-dialog .details-description {
  color: var(--thm-blue-3);
  margin-top: 0;
}
#drupal-off-canvas-wrapper.ui-dialog details {
  margin: 0 -1rem;
  padding: 0 1rem;
}
#drupal-off-canvas-wrapper.ui-dialog details details,
#drupal-off-canvas-wrapper.ui-dialog details details .details-wrapper {
  margin: 0;
  padding: 0;
}
#drupal-off-canvas-wrapper.ui-dialog details summary img {
  max-width: 18px !important;
  cursor: pointer;
  margin-top: -3px;
  margin-left: 2px;
}
#drupal-off-canvas-wrapper.ui-dialog details:not(.description-details) > summary {
  all: revert;
  padding: 1rem;
  margin: 0 -2rem;
  box-sizing: border-box;
  background-color: var(--thm-dark-green)!important;
  cursor: pointer;
  color: var(--thm-white)!important;
  font-weight: bold;
}
#drupal-off-canvas-wrapper.ui-dialog details > summary::marker {
  color: #fff;
}
#drupal-off-canvas-wrapper.ui-dialog details:not(.description-details) > summary:hover,
#drupal-off-canvas-wrapper.ui-dialog details:not(.description-details) > summary:focus {
  background-color: var(--thm-dark-blue)!important;
  color: var(--thm-white);
}
#drupal-off-canvas-wrapper.ui-dialog details.description-details {
  width: 100%;
}
#drupal-off-canvas-wrapper.ui-dialog details.description-details a {
  font-size: 0.9rem;
  text-decoration: underline;
}
#drupal-off-canvas-wrapper.ui-dialog details.description-details a:hover {
  color: var(--thm-dark-green);
}
#drupal-off-canvas-wrapper.ui-dialog details.description-details > summary {
  padding-bottom: 0px!important;
  margin: 0!important;
  display: flex;
}
#drupal-off-canvas-wrapper.ui-dialog details.description-details[open] > summary,
#drupal-off-canvas-wrapper.ui-dialog details.description-details > summary:hover,
#drupal-off-canvas-wrapper.ui-dialog details.description-details > summary:focus,
#drupal-off-canvas-wrapper.ui-dialog details.description-details[open] > summary:hover,
#drupal-off-canvas-wrapper.ui-dialog details.description-details[open] > summary:focus {
  background-color: var(--thm-white)!important;
}
#drupal-off-canvas-wrapper.ui-dialog .form-type-radio {
  padding: 0;
  margin: 0.5rem 0;
}
#drupal-off-canvas-wrapper.ui-dialog input[type="checkbox"] {
  position: relative;
  margin-right: 10px;
  transform: scale(1.2);
}
#drupal-off-canvas-wrapper.ui-dialog details.description-details details label {
  margin-right: 5px;
}
#drupal-off-canvas-wrapper.ui-dialog .form-autocomplete {
  background: none;
  width: auto;
}
#drupal-off-canvas-wrapper.ui-dialog td .form-item,
#drupal-off-canvas-wrapper.ui-dialog td .form-select {
  padding-bottom: 0;
}
#drupal-off-canvas-wrapper.ui-dialog td .form-item:first-child,
#drupal-off-canvas-wrapper.ui-dialog td .form-select:first-child {
  padding-top: 0.25rem;
}

#drupal-off-canvas-wrapper.ui-dialog .user-candidate-profile-form details[id^="edit-field-upload-cv"] summary,
#drupal-off-canvas-wrapper.ui-dialog .user-candidate-profile-form details[id^="edit-field-upload-cv"] summary:hover,
#drupal-off-canvas-wrapper.ui-dialog .user-my-profile-form details[id^="edit-field-upload-cv"] summary,
#drupal-off-canvas-wrapper.ui-dialog .user-my-profile-form details[id^="edit-field-upload-cv"] summary:hover {
  background-color: var(--thm-white)!important;
  color: var(--thm-dark-blue)!important;
  font-size: 0.9rem !important;
}
#drupal-off-canvas-wrapper.ui-dialog .user-my-profile-form details[id^="edit-field-upload-cv"] {
  margin: 0;
  padding: 0;
}

#drupal-off-canvas-wrapper.ui-dialog input[type="submit"].button {
  border-radius: 3px;
  background: var(--thm-green);
  padding: 0.3rem 0.5em;
  font-size: 1em;
  font-weight: normal;
  width: 150px;
  color: var(--thm-white);
}
#drupal-off-canvas-wrapper.ui-dialog input[type="submit"].button:hover,
#drupal-off-canvas-wrapper.ui-dialog input[type="submit"].button:focus {
  background: var(--thm-dark-blue);
}
#drupal-off-canvas-wrapper.ui-dialog .form-file {
  width: inherit;
  margin-bottom: 5px!important;
  padding-top: 7px;
}
#drupal-off-canvas-wrapper.ui-dialog span.file {
  max-width: 250px;
  overflow: hidden;
  display: block;
}
#drupal-off-canvas-wrapper.ui-dialog [id^="edit-user-picture"].button {
  width: 150px!important;
}
#drupal-off-canvas-wrapper.ui-dialog [id^="edit-user-picture"] img {
  border-radius: 500px;
}

#drupal-off-canvas-wrapper.ui-dialog .user-candidate-profile-form .field--name-field-address details summary,
#drupal-off-canvas-wrapper.ui-dialog .user-my-profile-form .field--name-field-address details summary {
  display: none;
}
#drupal-off-canvas-wrapper.ui-dialog textarea {
  min-height: 7em;
  line-height: 1.2 !important;
}
#drupal-off-canvas-wrapper.ui-dialog summary:focus {
  outline-offset: 0;
  outline: 0;
}

.table-has-description thead h4,
#drupal-off-canvas-wrapper.ui-dialog table-has-description thead h4 {
  display: none!important;
}

.ui-dialog .ui-dialog-buttonpane,
#drupal-off-canvas-wrapper.ui-dialog .ui-dialog-buttonpane {
  background: var(--thm-grey);
  border-radius: 0 0 3px 3px;
}
.ui-dialog .ui-dialog-titlebar {
  background: var(--thm-dark-blue);
  color: var(--thm-white);
  border-radius: 3px 3px 0 0;
}
.ui-dialog .ui-dialog-titlebar span.ui-dialog-title,
#drupal-off-canvas-wrapper.ui-dialog .ui-dialog-titlebar span.ui-dialog-title {
  color: var(--thm-white);
  font-weight: normal;
}
span.green-tick {
  padding-left: 2em;
  background: url(/themes/jg/images/green-tick.png);
  background-size: contain;
  background-position: left center;
  background-repeat: no-repeat;
}
ul.green-ticks li {
  list-style: none;
  padding-left: 2em;
  background: url(/themes/jg/images/green-tick.png);
  background-size: 1.5em;
  background-position: left center;
  background-repeat: no-repeat;
}
.green-tick + .green-tick {
  margin-left: 1.5em;
}

.mobile-only {
  display: none;
}

form.views-exposed-form .datetime-wrapper .fieldset-legend {
  display: none!important;
}
form.views-exposed-form .datetime-wrapper .fieldset-wrapper {
  display: flex;
  flex-direction: row!important;
}
form.views-exposed-form .datetime-wrapper .fieldset-wrapper .form-item {
  margin: 0 1em 1em 0;
}
.action-buttons {
  white-space: nowrap;
}
.icon img,
.icon svg {
  width: 25px;
  max-width: initial;
}

input#edit-tags,
input#edit-exclude-tags {
  width:94vw;
}

summary {
  display: list-item;
}

.description-details > summary {
  display: flex!important;
  padding: 0!important;
  margin-bottom: 0;
}
.description-details summary label {
  margin-bottom: 0;
  margin-right: 5px;
}
.description-details summary:hover {
  background: none!important;
}

form#user-login-form .description-details summary {
  justify-content: center;
}


/*-------------------- Button colours -------------------*/

input[type="submit"],
.button,
.back-button,
.paragraph--type--tile-card .field--name-field-button a,
.job-tile-wrapper .job-links-wrapper .job-read-more,
.job-tile-wrapper .dismiss-match,
.job-tile-wrapper .save-match,
.webform-submission-form .button.js-form-submit.form-submit,
.thm-button,
.field--name-field-job-apply-url a,
.new-banner-button-wrapper,
.call-to-action-button-wrapper,
.paragraph--type--downloads .downloads-files a,
.related-content-tile.review-cv .button,
.paragraph-flexi-tile-wrapper .field--name-field-button a,
.link-desc-link a {
  background-color: var(--thm-green);
  color: var(--thm-white);
  border: 2px solid var(--thm-white);
}


input[type="submit"]:hover,
.button:hover,
.back-button:hover,
.paragraph--type--tile-card .field--name-field-button a:hover,
.job-tile-wrapper .job-links-wrapper .job-read-more:hover,
.job-tile-wrapper .dismiss-match:hover,
.job-tile-wrapper .save-match:hover,
.webform-submission-form .button.js-form-submit.form-submit:hover,
.thm-button:hover,
.field--name-field-job-apply-url a:hover,
.new-banner-button-wrapper:hover,
.call-to-action-button-wrapper:hover,
.paragraph--type--downloads .downloads-files a:hover,
.related-content-tile.review-cv .button:hover,
.paragraph-flexi-tile-wrapper .field--name-field-button a:hover,
.link-desc-link a:hover {
  background-color: var(--thm-dark-blue);
}

/* .bgopt3 .webform-submission-form .button.js-form-submit.form-submit,
.bgopt3 .thm-button,
.bgopt3 .field--name-field-job-apply-url a,
.bgopt3 .new-banner-button-wrapper,
.bgopt3 .call-to-action-button-wrapper,
.bgopt3 .paragraph--type--downloads .downloads-files a,
.related-content-tile.review-cv .button {
  border: 2px solid var(--thm-white);
} */

.job-tile-wrapper .save-match.saved,
.job-tile-wrapper .dismiss-match.dismissed {
  background-color: var(--thm-dark-blue);
}

/*-------------------- Other -------------------*/

#edit-minimum-salary-required-wrapper legend,
#edit-field-ideal-desired-salary-value-wrapper legend,
#edit-field-minimum-salary-required-wrapper legend,
#edit-field-ideal-desired-salary-wrapper legend {
  display: none;
}
#edit-minimum-salary-required-wrapper .fieldset-wrapper,
#edit-field-ideal-desired-salary-value-wrapper .fieldset-wrapper,
#edit-field-minimum-salary-required-wrapper .fieldset-wrapper,
#edit-field-ideal-desired-salary-wrapper .fieldset-wrapper {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  width: 340px;
}
#edit-minimum-salary-required-wrapper .fieldset-wrapper .form-item-minimum-salary-required-max,
#edit-field-ideal-desired-salary-value-wrapper .fieldset-wrapper .form-item-field-ideal-desired-salary-value-max,
#edit-field-minimum-salary-required-wrapper .fieldset-wrapper .form-item-field-minimum-salary-required-max,
#edit-field-ideal-desired-salary-wrapper .fieldset-wrapper .form-item-field-ideal-desired-salary-max {
  margin-left: 1em;
}

.view-crm-button {
  margin: 0.9em 45vw 0 0;
}

#views-exposed-form-job-matches-page-1 {
  margin-bottom: 2em;
}

label[for="edit-select-all"] {
  margin-left: 5px;
}

.form-item input:not(.form-radio):not(.form-checkbox):not(.button),
select {
  border: 1px solid var(--thm-blue-5);
  border-radius: 3px;
  padding: 5px 10px;
  height: 40px;
  box-sizing: border-box;
  background-color: var(--thm-white);
}

.pager a.button {
  all: unset;
  text-decoration: underline;
  margin-top: -3em;
  display: block;
  cursor: pointer;
}

.swal2-popup .swal2-styled.swal2-confirm {
  background-color: var(--thm-green)!important;
  color: var(--thm-white)!important;
  border: 2px solid var(--thm-dark-blue)!important;
  box-shadow: none!important;
}
.swal2-popup .swal2-styled.swal2-confirm:hover {
  background-color: var(--thm-dark-blue);
}

input[type="checkbox"],
input[type="radio"] {
  transform: scale(1.2);
}
.view-sharing-links {
  min-width: 160px;
}

.webform-submission-request-to-post-a-job-add-form .iti__flag-container {
  right: 0;
  left: auto;
}
.paragraph--type--tiles.bgwhite .paragraph--type--tile-card.bgwhite {
  border: 1px solid var(--thm-mid-grey);
}

.right-sidebar h2 {
  color:  var(--thm-blue-2);
}

.bgopt3 ::-moz-selection { /* Code for Firefox */
  color: var(--thm-dark-blue);
  background: var(--thm-dark-pink);
}
.bgopt3 ::selection {
  color: var(--thm-dark-blue);
  background: var(--thm-dark-pink);
}

details.refer-friend[open=""] summary {
  display: none;
}
details.refer-friend .thm-button {
  margin: 0;
}
details.refer-friend summary {
  display: block;
  padding: 0;
}

.paragraph--type--cta-simple-contact-form .form-item input:not(.form-radio):not(.form-checkbox) {
  max-width: 250px;
}
.paragraph--type--cta-simple-contact-form [id^="edit-flexbox"]  {
  width: inherit;
}
.paragraph--type--cta-simple-contact-form .webform-submission-form .button.js-form-submit.form-submit {
  margin-top: 0;
}

.field--name-field-upload-cv summary {
  display: block;
  padding: 0;
  font-weight: bold;
}
.field--name-field-upload-cv .details-wrapper {
  padding: 0;
  margin-top: 1em;
}
.field--name-field-upload-cv .tabledrag-toggle-weight-wrapper {
  display: none;
}
.field--name-field-upload-cv .details-wrapper thead {
  display: none;
}
.field--name-field-upload-cv .details-wrapper table {
  overflow-x: auto;
}

.view-all-jobs .feed-icons div:first-child::before {
  content: 'Download data:';
  font-weight: bold;
}
/* .view-all-jobs .feed-icons div:last-child::before {
  content: 'Download job ads:';
  font-weight: bold;
} */
.view-all-jobs .views-data-export-feed {
  display: inline;
  float: left;
  margin-right: 2em;
}

.view-job-applications-per-job th#view-field-candidate-name-table-column,
.view-job-applications-per-job td.views-field-field-candidate-name {
  min-width: 175px;
  max-width: 175px;
}

#edit-field-jobs-applied-for,
#edit-field-jobs-applied-for-target-id {
  max-width: 150px;
}

.description-icon {
  max-width: 20px;
}

.form-type-checkbox {
  display: flex!important;
}

.form-type-checkbox details {
  margin: 0!important;
  padding: 0!important;
}
.form-type-checkbox label {
  margin-bottom: 0!important;
}
.form-type-checkbox input {
  display: flex!important;
  margin-right: 10px;
}
.form-type-checkbox details {
  width: 100%!important;
}
.form-type-checkbox .description {
  margin-left: 0!important;
}
.form-type-checkbox .description a {
  color: var(--thm-green);
  text-decoration: underline;
}
.form-type-checkbox .description a:hover {
  color: var(--thm-dark-blue);
}
#drupal-off-canvas-wrapper.ui-dialog table[id^="edit-field-upload-cv-"] .draggable a.tabledrag-handle,
table[id^="edit-field-upload-cv-"] .draggable a.tabledrag-handle {
  display: none;
}

/*-------------------- Media Queries -------------------*/

@media all and (min-width:2200px) { 
  .layout-content {
    max-width:2200px;
    margin-left:auto;
    margin-right:auto;
  }
  .paragraph.paragraph--type--new-banner {
    margin-left: calc(1100px - 55vw);
  }
  .sidebar-flex #page-content,
  .sidebar-flex .detailed-job-wrapper {
    max-width: calc(100% - 25%);
  }
  .sidebar-flex #right-sidebar {
    width: 25%;
    max-width: 25%;
  }
}

@media screen and (min-width:38em) {
  .layout-container {
    margin:0!important;
  }
}

@media all and (max-width:1800px) {
  .partner-page-wrapper h1,
  .blog-page-wrapper h1,
  .thm-article h1,
  .ext-job-listing-page-wrapper h1 {
    font-size: 2.5rem;
  }
}

@media all and (max-width:1600px) {
  .related-content-tile h3 {
    font-size: 1.1rem;
  }
  .related-content-tile,
  .related-content-tile p {
    font-size: 0.9rem;
  }
}

@media all and (max-width:1500px) {
  .partner-page-wrapper h1,
  .blog-page-wrapper h1,
  .thm-article h1,
  .ext-job-listing-page-wrapper h1 {
    font-size: 2rem;
  }
}

@media all and (max-width:1300px) {
  .sidebar-flex .paragraph--type--cta-simple-contact-form form {
    flex-direction: column;
    flex-wrap: wrap;
  }
  .sidebar-flex [id^="edit-flexbox"] {
    flex-direction: column;
  }
  .sidebar-flex [id^="edit-flexbox"] .form-item {
    margin-bottom: 1em;
  }
  body{
    font-size: 12pt;
  }
  p {
    font-weight: normal;
  }
  h1,
  .partner-page-wrapper h1,
  .blog-page-wrapper h1,
  .thm-article h1,
  .ext-job-listing-page-wrapper h1 {
    font-size: 2rem;
  }
  .middle-row .left img{
    max-width:460px;
    width:460px;
    float:right;
    padding-top:20px;
  }
  form:not(.user-candidate-profile-form):not(.webform-submission-add-form) .form-composite > legend, .label,
  form:not(.user-my-profile-form):not(.webform-submission-add-form) .form-composite > legend, .label {
    font-size: 1.5rem;
  }
  .datetime-wrapper h4.label {
    font-size: initial;
  }
  label.ui-checkboxradio-label.ui-corner-all.ui-button.ui-widget.ui-checkboxradio-radio-label {
    font-size: 1.1rem; 
    font-family: 'Open Sans', sans-serif;
    font-weight: normal;
  }
  .new-banner-button-icon img, .call-to-action-button-icon img {
    height: 40px;
  }
  .numbered-info-icon img, .infographic-icon img {
    height: 120px;
    width: 120px;
  }
  .sidebar-flex #page-content,
  .sidebar-flex .detailed-job-wrapper {
    max-width: calc(100vw - 27vw);
  }
  .sidebar-flex #right-sidebar {
    width: 27vw;
    max-width: 27vw;
    margin-right: 5vw;
  }
}

@media all and (max-width:1100px) { 
  .menublock ul{
    font-size: 0.8rem;
  }
  .sidebar-flex #page-content,
  .sidebar-flex .detailed-job-wrapper {
    max-width: calc(100vw - 30vw);
  }
  .sidebar-flex #right-sidebar {
    width: 30vw;
    max-width: 30vw;
    margin-right: 5vw;
  }
}

@media all and (max-width:1011px) {
  .paragraph-tile-wrapper {
    max-width: 100%;
  }
}

@media all and (max-width:1000px) {
  .paragraph--type--cta-simple-contact-form form {
    flex-wrap: wrap;
  }
  .jgforms {
    display: block;
    padding: 3vw 10vw;
  }
  .form-left {
    padding-right: 0vw;
    width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    margin-bottom: 20px;
  }
  .form-right {
    width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    background: var(--thm-white);
  }
  .menublock ul {
    font-size: 0.75rem;
  }
  .tabcontent {
    padding: 2em 5vw;
  }
  .paragraph {
    margin-bottom: 1em;
  }



 
 

  /* My profile mobile styling */

  #my-profile {
    display: block;
  }
  .my-profile-buttons .thm-button {
    margin-top: 0;
  }
  .profile-pic > img {
    width: 120px;
  }
  .profile-pic {
    float: left;
  }
  h2.my-profile {
    font-size: 2rem;
  }
  .my-profile-dets {
    clear: both;
  }
  .my-profile-dets > div {
    min-width: 100%;
  }
  .my-profile-type {
    font-size: 1.2rem;
  }
  .paragraph.paragraph--type--flexi-tiles .paragraph-flexi-tile-wrapper {
    min-width: 100%;
    max-width: 100%;
    width: 100%;
  }
  .paragraph--type--flexi-tiles .field.field--name-field-tiles {
    margin: 0;
  }
  .paragraph.paragraph--type--flexi-tiles .field.field--name-field-tiles > .field__item {
    width: 100%;
    margin: 0;
    padding: 1em 0;
  }
  .double-text-wrapper {
    flex-direction: column;
  }
  .double-text-wrapper .double-text-left-text {
    padding: 2em;
    border: 1px solid var(--thm-mid-grey)!important;
    border-bottom: 0!important;
    border-radius: 3px 3px 0 0;
  }
  .double-text-wrapper .double-text-right-text {
    padding: 2em;
    border: 1px solid var(--thm-mid-grey)!important;
    border-top: 0!important;
    border-radius: 0 0 3px 3px;
  }
  .double-text-wrapper .double-text-left-text.bgwhite,
  .double-text-wrapper .double-text-right-text.bgwhite {
    border: none!important;
  }
  .double-text-wrapper .double-text-left-text.bgwhiteborder,
  .double-text-wrapper .double-text-right-text.bgwhiteborder {
    border: none!important;
    border-radius: 0!important;
    border-bottom: 1px solid var(--thm-mid-grey)!important;
  }

}

@media all and (max-width:900px) {
  .sidebar-flex {
    flex-direction: column;
  }
  .sidebar-flex #page-content,
  .sidebar-flex .detailed-job-wrapper {
    max-width: 100%;
  }
  .sidebar-flex #right-sidebar.has-banner {
    top: 0;
  }
  .sidebar-flex #right-sidebar {
    width: 100%;
    max-width: calc(100vw - 10vw);
    margin: 0 5vw;
  }
  .jobs-sidebar {
    position: relative!important;
    transform: none!important;
    left: 0!important;
    width: 100%!important;
  }
  .hp-buttons {
    min-height: auto;
    padding: 0 10vw;
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
  }
  h1.landing-message,
  .node--type-thm-page h1 {
    font-size: 3rem!important;
  }
  .node--type-thm-page .homepage-slide-h1 h1 {
    font-size: 1rem!important;
  }
  h2,
  .paragraph--type--text-with-image h2 {
    font-size: 1.5rem;
  }
  form#user-company-profile-form fieldset#edit-field-industry--wrapper {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
  }
  .blog-first-wapper {
    display: block;
  }
  .blog-right, .blog-right img {
    margin-top: 20px;
    max-width: 100%;
  }
  .twocols {
    display: block;
  }
  .col-left, .col-right {
    width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding: 0;
    text-align: center;
  }
  .fp-banner img {
    width: 100%;
    margin-bottom: 30px;
    margin-top: 30px;
    min-width: 100%;
  }
  .left-button, .right-button {
    padding: 10px;
    min-width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    width: 100%;
  }
  .hp-buttons a {
    padding: 10px;
    max-width: 100%;
    min-height: auto;
    font-size: 1.4rem;
  }
  .hp-buttons .left-button a, .hp-buttons .right-button a {
    background-size: 100px;
  }
  .how-we-work-wrapper a {
    font-size: 1.5rem;
  }
  .how-we-work-strap h2 {
    font-size: 2.1rem;
  }
  .how-we-work-logo-section {
    display: none;
  }
  .prof-how-we-work-wrapper .how-we-work-logo-section {
    display: block;
  }
  .prof-how-we-work-wrapper .how-we-work-wrapper-section-1,
  .prof-how-we-work-wrapper .how-we-work-wrapper-section-2,
  .prof-how-we-work-wrapper .how-we-work-wrapper-section-3,
  .prof-how-we-work-wrapper .how-we-work-wrapper-section-4,
  .comp-how-we-work-wrapper .how-we-work-wrapper-section-1,
  .comp-how-we-work-wrapper .how-we-work-wrapper-section-2,
  .comp-how-we-work-wrapper .how-we-work-wrapper-section-3,
  .comp-how-we-work-wrapper .how-we-work-wrapper-section-4 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: auto;
    margin-bottom: 20px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    max-width: 100%;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
  
  .how-we-work-middle-section-1, .how-we-work-middle-section-2, .how-we-work-middle-section-3, .how-we-work-middle-section-4 {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 5px;
  }
  .how-we-work-middle-section-1 h5, .how-we-work-middle-section-2 h5, .how-we-work-middle-section-3 h5, .how-we-work-middle-section-4 h5 {
    margin-left: auto;
    margin-right: auto;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
    font-size: 1.4rem;
  }
  .how-we-work-middle-section-1 h6, .how-we-work-middle-section-2 h6, .how-we-work-middle-section-3 h6, .how-we-work-middle-section-4 h6 {
    margin-left: auto;
    margin-right: auto;
    font-size: 2rem;
  }
  .how-we-work-companies-section-1 p, .how-we-work-companies-section-2 p, .how-we-work-companies-section-3 p, .how-we-work-companies-section-4 p {
    padding: 40px 20px 10px;
    font-weight: 700;
    color: var(--thm-blue-2);
  }
  
  .prof-how-we-work-wrapper .how-we-work-professional-section-1 p,
  .prof-how-we-work-wrapper .how-we-work-professional-section-2 p,
  .prof-how-we-work-wrapper .how-we-work-professional-section-3 p,
  .prof-how-we-work-wrapper .how-we-work-professional-section-4 p,
  .comp-how-we-work-wrapper .how-we-work-companies-section-1 p,
  .comp-how-we-work-wrapper .how-we-work-companies-section-2 p,
  .comp-how-we-work-wrapper .how-we-work-companies-section-3 p,
  .comp-how-we-work-wrapper .how-we-work-companies-section-4 p {
    padding: 10px;
    font-weight: 400;
    color: var(--thm-white);
    font-size: 1rem;
  }
  
  .how-we-work-professional-section-1 p, .how-we-work-professional-section-2 p, .how-we-work-professional-section-3 p, .how-we-work-professional-section-4 p {
    padding: 40px 20px 10px;
    font-weight: 700;
    color: var(--thm-blue-4);
    font-size: 1.4rem;
  }
  
  .how-we-work-companies-section-1, .how-we-work-companies-section-2, .how-we-work-companies-section-3, .how-we-work-companies-section-4 {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    margin: 0;
    background-image: url(/sites/default/files/new-companies-icon.svg);
    background-repeat: no-repeat;
    background-position: top center;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    display: block;
    background-size: 50px;
    background-color: rgba(255, 255, 255, 0);
    width: 80%;
    margin-top: 20px;
  }
  .how-we-work-professional-section-1, .how-we-work-professional-section-2, .how-we-work-professional-section-3, .how-we-work-professional-section-4 {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    margin: 0;
    background-image: url(/sites/default/files/new-professional-icon.svg);
    background-repeat: no-repeat;
    background-position: top center;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    display: block;
    background-size: 30px;
    background-color: rgba(255, 255, 255, 0);
    /* width: 80%; */
    margin-top: 20px;
  }
  
  .how-we-work-wrapper-section-1 {
    padding-top: 40px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .how-we-work-wrapper-section-2, .how-we-work-wrapper-section-3, .how-we-work-wrapper-section-4 {
    padding-top: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .how-we-work-middle-section {
    display: none;
    
  }
  .how-we-work-wrapper-button-wrapper {
    display: block;
  }
  .paragraph--type--text-with-image.imgleft {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .node.node--type-thm-landing-page .flex-direction-nav a  {
    display: none;
    
  }
  h1.landing-message {
    text-align: center;
    margin: 0;
    padding: 15px 5vw!important;
  }
  .view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_1 img, .view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_2 img, .view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_3 img {
    -o-object-fit: cover;
    object-fit: cover;
    height: 500px;
    object-position: -700px center;
  }
  .new-banner-button-icon img, .call-to-action-button-icon img {
    height: 35px;
  }
  .numbered-info-icon img, .infographic-icon img {
    height: 100px;
    width: 100px;
  }
}

@media all and (max-width:768px) {

  .paragraph--type--cta-simple-contact-form form {
    flex-direction: column;
  }

  .non-mobile {
    display: none;
  }
  .mobile-only {
    display: block;
  }
  .quicklinks details summary {
    padding-left: 5vw;
  }
  .header-dark-green .quicklinks details summary {
    color: var(--thm-white);
  }
  .how-we-work-wrapper {
    display: block;
  }
  .how-we-work-professional-section-1, .how-we-work-professional-section-2, .how-we-work-professional-section-3, .how-we-work-professional-section-4,
  .how-we-work-companies-section-1, .how-we-work-companies-section-2, .how-we-work-companies-section-3, .how-we-work-companies-section-4 {
    max-width: 100%;
    min-height: auto;
    padding: 5px 20px 5px 20px;
  }
  .how-we-work-companies-section {
    padding: 50px 5vw 50px 5vw;
  }
  .how-we-work-professional-section {
    padding: 150px 5vw 50px 5vw;
  }
  .lp-main-title h1 {
    font-size: 3rem;
  }
  .hp-buttons {
    display: block;
    min-height: auto; 
  }
  .view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_1 img, .view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_2 img, .view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_3 img {
    -o-object-fit: cover;
    object-fit: cover;
    height: 500px;
    object-position: -1000px center;
  }
  .paragraph.paragraph--type--numbered-infographic {
    display: block;
    border: 1px solid var(--thm-mid-grey);
    border-radius: 3px;
  }
  .paragraph.paragraph--type--numbered-infographic .left,
  .paragraph.paragraph--type--numbered-infographic .right {
    border: none;
  }
  .numbered-info-subtitle {
    position: relative;
  }

  .paragraph.paragraph--type--infographic {
    flex-direction: column;
  }
  .paragraph.paragraph--type--infographic .right {
    display: none;
  }
  .paragraph.paragraph--type--infographic {
    box-shadow: none;
  }
  .paragraph.paragraph--type--infographic .left .infographic-text {
    padding: 0;
    position: relative;
  }

  .paragraph.paragraph--type--infographic .left,
  .paragraph.paragraph--type--numbered-infographic .left {
    max-width: 100%;
    min-width: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  .paragraph.paragraph--type--infographic.even .left,
  .paragraph.paragraph--type--numbered-infographic.even .left {
    flex-direction: row-reverse;
  }
  .paragraph.paragraph--type--infographic .right {
    border-radius: 0 0 3px 3px;
    overflow: hidden;
  }
  .paragraph.paragraph--type--numbered-infographic .left,
  .paragraph.paragraph--type--numbered-infographic .right {
    max-width: 100%;
    min-width: 100%;
  }
  .numbered-info-subtitle-text {
    font-size: 1em;
    justify-content: center;
    padding: 1em 2em!important;
  }
  .paragraph.paragraph.paragraph--type--infographic .right,
  .paragraph.paragraph.paragraph--type--numbered-infographic .right {
    border-radius: 0 0 3px 3px;
    padding: 2em 3em!important;
  }
  .paragraph.paragraph--type--numbered-infographic .right::after,
  .paragraph.paragraph--type--infographic .right::after {
    display: none;
  }
  .numbered-info-number-icon img {
    max-height: 200px;
  }
  .tile-icon img {
    width: 50px;
    height: auto;
  }
  .infographic-text {
    font-size: 0.9rem;
  }
  .numbered-info-icon img, .infographic-icon img {
    height: 120px;
    width: 120px;
  }
}

@media all and (max-width:750px) {
  .job-tile-wrapper {
    width: 100%;
    margin: 0;
    height: auto;
  }
  .partner-page-wrapper .view-content,
  .blog-page-wrapper .view-content,
  .thm-page .view-content,
  .view-aa-blog-tiles.view-display-id-block_2 .view-content
  {
    display: block;
  }
  .partner-page-wrapper .views-row,
  .blog-page-wrapper .views-row,
  .thm-page .views-row,
  .view-aa-blog-tiles.view-display-id-block_2 .views-row
  {
    margin-bottom: 20px;
  }
  .partner-page-wrapper .views-row p,
  .blog-page-wrapper .views-row p, 
  .thm-page .views-row p,
  .view-aa-blog-tiles.view-display-id-block_2 .views-row p {
    font-size: 1rem;
  }
  .partner-page-wrapper a.views-more-link, .partner-card-wrapper a {
    margin-top: 20px;
  }
  /* .paragraph.paragraph--type--new-banner::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100%;
    background-image: -webkit-gradient(linear,left top,right top,color-stop(50%,rgba(255,255,255,1)),to(rgba(255, 255, 255, 1)));
    background-image: -o-linear-gradient(left,rgba(255,255,255,1) 50%,rgba(255,255,255,1));
    background-image: linear-gradient(90deg,rgba(255,255,255,1) 50%,rgba(255,255,255,1));
    opacity: .7;
    z-index: 5;
  } */
}

@media all and (max-width:650px) {
  .advert-form-flex .advert-form-flex-item {
    min-width: 100%;
  }
  .link-desc-description p {
    padding-top: 0;  
  }
  .paragraph.paragraph--type--link-with-description .link-desc-link {
    order: 3;
  }
  .numbered-info-icon img, .infographic-icon img {
    height: 100px;
    width: 100px;
  }

  h2.my-profile {
    font-size: 1.5rem;
  }
  .my-profile-dets ul.cols-2 {
    columns: 1;
  }
  .my-profile-dets table th {
    font-size: 0.85rem;
  }
  .my-profile-dets table tr {
    display: flex;
    flex-direction: column;
    margin-bottom: 0.5em;
  }
  .my-profile-buttons {
    clear: both;
    float: left;
    margin-top: 1em;
    text-align: left;
  }
}

@media all and (max-width:600px) {
  .lp-main-title h1 {
    font-size: 2.2rem;
  }
  .ext-job-page-left, .ext-job-page-right {
    min-width: 100%;
  }
  form#user-company-profile-form fieldset#edit-field-industry--wrapper {
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
  }
  h2, .paragraph--type--text-with-image h2 {
    font-size: 1.3rem;
  }
  h1.landing-message, .node--type-thm-page h1 {
    font-size: 2rem!important;
  }
  
  .home-prof-text-wrapper, .home-comp-text-wrapper {
    min-width: 100%;
  }
  .home-prof-text-wrapper h3, .home-comp-text-wrapper h3 {
    font-size: 1.3rem;
  }
  .how-we-work-wrapper p {
    font-size: 1rem;
  }
  .how-we-work-middle-section-1 h5, .how-we-work-middle-section-2 h5, .how-we-work-middle-section-3 h5, .how-we-work-middle-section-4 h5 {
    font-size: 1.2rem;
  }
  .views-field.views-field-field-client-logo img {
    max-width: 85px;
  }
  .home-prof-text-wrapper h2, .home-comp-text-wrapper h2, .how-we-work-title, .landing-pg-heading {
    font-size: 1.6rem;
  }
  .logo img, .logo {
    width: 200px;
    height: 40px;
  }
  .detailed-job-wrapper {
    width: 100%;
    display: block;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  .view.view-testimonials.view-id-testimonials.view-display-id-block_1 .slides {
    padding: 15px 5vw;
  }
  .home-marketing-message, .advert-strapline {
    font-size: 1.6rem;
  }
  .tablink.active {
    order: 1;
    min-width: 100%;
  }
  .tabcontent {
    padding: 1em 5vw;
  }
  .numbered-info-icon img, .infographic-icon img {
    height: 90px;
    width: 90px;
  }
  video, audio {
    max-width: 100%;
  }
}

@media all and (max-width:500px) {
  #block-adminlinks a {
    display: block;
  }
  .link-desc-description {
    min-width: 100%;
  }
  .tabcontent {
    border-radius: 0 0 1vw 1vw;
    margin-top: -1vw;
    clip-path: inset(1vw -10px -10px -10px);
  }
  .numbered-info-icon img, .infographic-icon img {
    height: 80px;
    width: 80px;
  }
  .my-profile-header {
    flex-direction: column;
  }
  .profile-pic {
    margin-top: 1em;
  }
  .profile-pic img {
    width: 100px;
  }
  .my-profile-type {
    clear: both;
  }
  .my-profile-buttons {
    display: inline-block;
  }
  .my-profile-section .thm-button {
    margin-top: 0;
  }
}

@media all and (max-width:400px) {
  .view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_1 img, .view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_2 img, .view.view-home-page-banner.view-id-home_page_banner.view-display-id-block_3 img {
    -o-object-fit: cover;
    object-fit: cover;
    height: 500px;
    object-position: -1200px center;
  }
  .paragraph-tile-wrapper {
    display: block;
    text-align: center;
  }
  .paragraph.paragraph--type--new-tiles.orange_orange {
    padding: 5vw;
  }
  .numbered-info-icon img, .infographic-icon img {
    height: 70px;
    width: 70px;
  }
}


/* media queries to control number of insert-view tiles (views outputs 5) */


.sidebar-flex .paragraph--type--insert-view:not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+5) {
  display: none;
}

@media all and (max-width:1920px) {
  .sidebar-flex .paragraph--type--insert-view:not(.bgwhite):not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+4) {
    display: none;
  }
}
@media all and (max-width:1823px) {
  .sidebar-flex .paragraph--type--insert-view.bgwhite:not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+4) {
    display: none;
  }
}

@media all and (max-width:1806px) {
  .paragraph--type--insert-view:not(.bgwhite):not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+5) {
    display: none;
  }
}

@media all and (max-width:1733px) {
  .paragraph--type--insert-view.bgwhite:not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+5) {
    display: none;
  }
}

@media all and (max-width:1451px) {
  .paragraph--type--insert-view:not(.bgwhite):not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+4) {
    display: none;
  }
}

@media all and (max-width:1377px) {
  .paragraph--type--insert-view.bgwhite:not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+4) {
    display: none;
  }
}

@media all and (max-width:1449px) {
  .sidebar-flex .paragraph--type--insert-view:not(.bgwhite):not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+3) {
    display: none;
  }
}

@media all and (max-width:1352px) {
  .sidebar-flex .paragraph--type--insert-view.bgwhite:not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+3) {
    display: none;
  }
}

@media all and (min-width:901px) and (max-width:1100px) {
  .sidebar-flex .paragraph--type--insert-view:not(.bgwhite):not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+2) {
    display: none;
  }
}

@media all and (max-width:1095px) {
  .paragraph--type--insert-view:not(.bgwhite):not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+3) {
    display: none;
  }
}

@media all and (max-width:1022px) {
  .paragraph--type--insert-view.bgwhite:not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+3) {
    display: none;
  }
}

@media all and (min-width:901px) and (max-width:999px) {
  .sidebar-flex .paragraph--type--insert-view.bgwhite:not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+2) {
    display: none;
  }
}

@media all and (max-width:900px) {
  .sidebar-flex .paragraph--type--insert-view:not(.bgwhite):not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+3) {
    display: none;
  }
}

@media all and (max-width:750px) {
  .paragraph--type--insert-view:not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+2),
  .sidebar-flex .paragraph--type--insert-view:not(.companies-view):not(.qa-view):not(.qa-grouped-view) .view-content .views-row:nth-child(n+2) {
    display: none;
  }
}


html {
  box-sizing: border-box;
  font-size: 100%;
  scroll-behavior: smooth;
}

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

/* Make everything fit screen width */
body {
  margin: 0;
  padding: 0;
  max-width: 100%;
  overflow-x: hidden;
}

/* Images and embeds scale automatically */
img, iframe, video {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Flex and grid containers auto-stack on mobile */
@media (max-width: 768px) {
  [style*="display:flex"],
  .flex,
  .grid {
    flex-direction: column !important;
    align-items: center !important;
  }

  /* Make all columns or cards full-width */
  [style*="width:"],
  .card,
  .column,
  .block {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Add some breathing room on mobile */
  body, main, section {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}


@media (max-width: 768px) {
  .wide-box {
    width: 100vw !important;      /* use full viewport width */
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important; /* center align edge-to-edge */
    margin-right: calc(-50vw + 50%) !important;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
  }
}