/* =========================================== */
/* General Styling */
/* =========================================== */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  :root {
    --columns-size-width: 48% !important;
  }
}

@media only screen and (max-width: 768px) {
  :root {
    --columns-size-width: 100% !important;
  }

  body #t2m-job.t2m-job-detail {
    display: block !important;
  }
}

body #t2m-job h1,
body #t2m-job h2,
body #t2m-job h3,
body #t2m-job h4,
body #t2m-job h5,
body #t2m-job h6 {
  margin: 0;
  padding: 9px 0 4px;
}

body #t2m-job h1.general {
  color: var(--h1-color) !important;
}

body #t2m-job h2.general {
  color: var(--h2-color) !important;
}

body #t2m-job h3.general {
  color: var(--h3-color) !important;
}

body #t2m-job h4.general {
  color: var(--h4-color) !important;
}

body #t2m-job h5.general {
  color: var(--h5-color) !important;
}

body #t2m-job h6.general {
  color: var(--h6-color) !important;
}

body #t2m-job .job-listing-details {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  margin: 20px 0;
}

body #t2m-job .job-listing span.key,
body #t2m-job .job-listing span.val,
body #t2m-job .job-listing-detail {
  font-size: var(--details-font-size-overview) !important;
}

body #t2m-job .job-listing-details>* {
  flex-grow: 1;
}

body #t2m-job span.key {
  font-weight: bold;
}

body #t2m-job .job-listing span.key,
body #t2m-job .job-listing span.val,
body #t2m-job .job-listing-detail {
  font-size: calc(var(--text-font-size-overview)*.85);
  color: var(--text-color-overview);
  font-family: var(--text-font-overview);
}

body ul li,
body ol li {
  display: list-item;
  text-align: match-parent;
  margin-left: 2.5em;
}

body ul,
body ol {
  list-style: disc;
}

/* Default */
body #t2m-job[data-template="Default"] .job-listing-details {
  margin: 20px 0 0 0;
}

/* =========================================== */
/* Overzichtspagina */
/* =========================================== */
@media (max-width: 768px) {

  /* Default */
  body #t2m-job .t2m-job-overview {
    grid-template-columns: repeat(1, 85vw);
    /* One column for mobile */
  }

  /* Default */
  body #t2m-job[data-template="Default"] .t2m-job-overview {
    grid-template-columns: repeat(1, 85vw);
  }
}

@media (min-width: 769px) and (max-width: 1023px) {

  /* Default */
  body #t2m-job .t2m-job-overview {
    grid-template-columns: repeat(2, 90vw);
    /* Two columns for tablets */
  }

  /* Default */
  body #t2m-job[data-template="Default"] .t2m-job-overview {
    grid-template-columns: repeat(1, 90vw);
  }
}

@media (min-width: 1024px) {

  /* Default */
  body #t2m-job .t2m-job-overview {
    grid-template-columns: repeat(var(--columns-overview), 1fr);
    /* Back to three columns for screens >= 1024px */
  }

  /* Default */
  body #t2m-job[data-template="Default"] .t2m-job-overview {
    grid-template-columns: repeat(1, 1fr);
  }
}

@media only screen and (max-width:768px) {
  body #t2m-job.t2m-job-detail {
    display: block;
  }

  body #t2m-job.t2m-job-detail .job-container-detail {
    width: 100% !important;
  }

  body #t2m-job.t2m-job-detail .t2m_sidebar {
    width: 100% !important;
    padding: 20px;
  }

  body #t2m-job .t2m-login-button {
    width: auto !important;
  }
}

body #t2m-job .t2m-job-overview h1 {
  color: var(--title-color-overview);
  font-size: var(--title-font-size-overview) !important;
  font-family: var(--title-font-overview);
}

body #t2m-job .t2m-job-overview h2 {
  color: var(--title-color-overview);
  font-size: var(--title-font-size-overview) !important;
  font-family: var(--title-font-overview);
}

body #t2m-job .t2m-job-overview h3 {
  color: var(--title-color-overview);
  font-size: var(--title-font-size-overview) !important;
  font-family: var(--title-font-overview);
}

body #t2m-job .t2m-job-overview h4 {
  color: var(--title-color-overview);
  font-size: var(--title-font-size-overview) !important;
  font-family: var(--title-font-overview);
  margin-bottom: 15px;
}

body #t2m-job .t2m-job-overview h5 {
  color: var(--title-color-overview);
  font-size: var(--title-font-size-overview) !important;
  font-family: var(--title-font-overview);
}

body #t2m-job .t2m-job-overview h6 {
  color: var(--title-color-overview);
  font-size: var(--title-font-size-overview) !important;
  font-family: var(--title-font-overview);
}

body #t2m-job .t2m-job-overview {
  /* flex-wrap: wrap;
  justify-content: space-between; */
}

body #t2m-job .t2m-job-overview p {
  font-family: var(--text-font-overview);
  font-size: var(--text-font-size-overview);
  color: var(--text-color-overview);
}

  {
  font-size: var(--details-font-size-overview);
}

body #t2m-job .t2m-job-overview .job-card {
  background-color: var(--bg-color-overview);
  box-shadow: var(--box-shadow-overview);
  border-radius: var(--border-radius-overview);
  border: var(--border-overview);
  width: var(--columns-size-width);
  margin-bottom: 20px;
  display: block;
  position: relative;
}

body #t2m-job .t2m-job-overview .job-card-inner {
  min-height: 50%;
}

body #t2m-job .job-row {
  display: flex;
  flex-direction: column;
}

body #t2m-job .job-thumb {
  width: 100%;
  /* Top left, Top right, Bottom right, Bottom left */
  border-radius: var(--border-radius-overview) var(--border-radius-overview) 0 0;
  max-height: 225px;
  min-height: 225px;
  object-fit: cover;
}

body #t2m-job .t2m-job-overview .job-under-wrapper {
  height: 100%;
  padding: 20px 20px 0px 20px;
}

body #t2m-job .t2m-job-overview .job-footer-row {
  padding: 10px 20px 10px 20px;
}

/* Default */
body #t2m-job[data-template="Default"] .job-thumb {
  width: 40%;
  float: left;
  /* Top left, Top right, Bottom right, Bottom left */
  border-radius: var(--border-radius-overview) 0 0 var(--border-radius-overview);
}

body #t2m-job[data-template="Default"] .job-listing-details {
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}

body #t2m-job[data-template="Default"] .t2m-job-overview .job-footer-row {
  padding: 10px 20px 0 20px;
}

/* =========================================== */
/* Vacaturepagina */
/* =========================================== */
.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  width: 100%;
  padding-right: calc(var(--bs-gutter-x) * .5);
  padding-left: calc(var(--bs-gutter-x) * .5);
  margin-right: auto;
  margin-left: auto
}

@media (min-width:576px) {

  .container,
  .container-sm {
    max-width: 540px
  }
}

@media (min-width:768px) {

  .container,
  .container-md,
  .container-sm {
    max-width: 720px
  }
}

@media (min-width:992px) {

  .container,
  .container-lg,
  .container-md,
  .container-sm {
    max-width: 960px
  }
}

@media (min-width:1200px) {

  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl {
    max-width: 1140px
  }
}

@media (min-width:1400px) {

  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1320px
  }
}

body #t2m-job.t2m-job-detail .job-content>h1 {
  color: var(--title-color-vacancy);
  font-size: var(--title-font-size-vacancy) !important;
  font-family: var(--title-font-vacancy);
}

body #t2m-job.t2m-job-detail h2.job-title,
body #t2m-job.t2m-job-detail .job-content>h2 {
  color: var(--title-color-vacancy) !important;
  font-size: var(--title-font-size-vacancy) !important;
  font-family: var(--title-font-vacancy) !important;
}

body #t2m-job.t2m-job-detail .job-content>h3 {
  color: var(--title-color-vacancy) !important;
  font-size: var(--title-font-size-vacancy) !important;
  font-family: var(--title-font-vacancy) !important;
}

body #t2m-job.t2m-job-detail .job-content>h4 {
  color: var(--title-color-vacancy) !important;
  font-size: var(--title-font-size-vacancy) !important;
  font-family: var(--title-font-vacancy) !important;
}

body #t2m-job.t2m-job-detail .job-content>h5 {
  color: var(--title-color-vacancy) !important;
  font-size: var(--title-font-size-vacancy) !important;
  font-family: var(--title-font-vacancy) !important;
}

body #t2m-job.t2m-job-detail .job-content>h6 {
  color: var(--title-color-vacancy) !important;
  font-size: var(--title-font-size-vacancy) !important;
  font-family: var(--title-font-vacancy) !important;
}

body #t2m-job .job-container-detail {
  padding: 20px;
  background-color: var(--bg-color-vacancy) !important;
}

body #t2m-job.t2m-job-detail .job-content>*,
body #t2m-job.t2m-job-detail .job-content>p,
#t2m-job .filter-no-result {
  color: var(--text-color-vacancy);
  font-size: var(--text-font-size-vacancy);
  font-family: var(--text-font-vacancy);
  padding-left: 0px !important;
}

body #t2m-job.t2m-job-detail .job-content .job-text>p {
  padding-bottom: 0px !important;
}

body #t2m-job .job-text {
  margin-bottom: 20px;
}

body #t2m-job.t2m-job-detail {
  display: flex;
  justify-content: space-between;
  margin: 50px auto;
  width: 95%;
}

body #t2m-job.t2m-job-detail .job-container-detail {
  width: 65%;
}

body #t2m-job.t2m-job-detail .t2m_sidebar {
  width: 30%;
}

body #t2m-job.t2m-job-detail .t2m_sidebar .sub-title {
  font-weight: bold;
}

body #t2m-job.t2m-job-detail .job-content {
  margin-bottom: 20px;
}

body #t2m-job.t2m-job-detail img.recruiter-img {
  width: 75%;
}

/* Sidebar Disabled */
body #t2m-job[data-sidebar="false"] .job {
  width: 100%;
  float: unset;
}

body .job-body .job-tags {
  margin: 20px 0;
}

/* =========================================== */
/* Sollicitatiepagina */
/* =========================================== */
body .job-body .t2m-question-widget>table.table>tbody tr td:nth-child(2) {
  min-width: 125px;
}

body #t2m-job .job-container-solliciteren h1 {
  color: var(--title-color-apply);
  font-size: var(--title-font-size-apply) !important;
  font-family: var(--title-font-apply);
}

body #t2m-job .job-container-solliciteren h2 {
  color: var(--title-color-apply);
  font-size: var(--title-font-size-apply) !important;
  font-family: var(--title-font-apply);
}

body #t2m-job .job-container-solliciteren h3 {
  color: var(--title-color-apply);
  font-size: var(--title-font-size-apply) !important;
  font-family: var(--title-font-apply);
}

body #t2m-job .job-container-solliciteren h4 {
  color: var(--title-color-apply);
  font-size: var(--title-font-size-apply) !important;
  font-family: var(--title-font-apply);
}

body #t2m-job .job-container-solliciteren h5 {
  color: var(--title-color-apply);
  font-size: var(--title-font-size-apply) !important;
  font-family: var(--title-font-apply);
}

body #t2m-job .job-container-solliciteren h6 {
  color: var(--title-color-apply);
  font-size: var(--title-font-size-apply) !important;
  font-family: var(--title-font-apply);
}

body #t2m-job .job-container-solliciteren {
  background-color: var(--bg-color-apply);
  width: 100%;
}

body #t2m-job .job-container-solliciteren .job-body {
  padding: 20px;
}

body #t2m-job .job-container-solliciteren .job-content-sollicitatie>* {
  color: var(--text-color-apply);
  font-size: var(--text-font-size-apply);
  font-family: var(--text-font-apply);
}

body #t2m-job .job-container-solliciteren .form-control {
  margin-top: 15px;
  padding: 16px 20px;
  outline: none;
  min-height: 55px;
  position: relative;
  z-index: 2;
  width: 100%;
  font-size: var(--text-font-size-apply) !important;
  border-radius: var(--btn-border-radius);
}

body #t2m-job .job-container-solliciteren .t2m-cv-column,
body #t2m-job .job-container-solliciteren .t2m-submit-section {
  margin-top: 30px;
}

body #t2m-job .job-container-solliciteren .t2m-input-field-firstname {
  display: inline-block !important;
  width: 50%;
  padding-right: 15px;
}

body #t2m-job .job-container-solliciteren .t2m-input-field-surname {
  display: inline-block !important;
  width: 50%;
  padding-left: 15px;
}

body #t2m-job .job-container-solliciteren .t2m-input-field {
  padding: 10px;
  display: flex;
  flex-direction: column;
}

/* =========================================== */
/* Button Styling */
/* =========================================== */
body .job-button.primary.solliciteren {
  width: unset !important;
}

body #t2m-job .t2m-login-button {
  width: 30%;
  margin-bottom: 15px;
}

body #t2m-job a.return-button {
  margin-bottom: 20px;
}

body #t2m-job .t2m-submit-button {
  margin: 20px 0;
}

body #t2m-job a,
body #t2m-job a.return-button,
body #t2m-job .job-detail-link.apply-button {
  text-decoration: none !important;
  box-shadow: none !important;
}

body #t2m-job button.job-button {
  width: 100%;
}

body #t2m-job button.job-button,
body #t2m-job a.t2m-login-button,
body #t2m-job .t2m-submit-button,
body #t2m-job a.return-button,
a.job-button.primary.solliciteren {
  display: inline-block;
  font-family: var(--btn-font);
  font-size: var(--btn-font-size);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  color: var(--btn-text-color);
  background-color: var(--btn-bg-color);
  box-shadow: var(--btn-box-shadow) !important;
  transition: background-color 0.2s ease-in-out;
  cursor: pointer;
  border: var(--btn-border) !important;
  text-decoration: none;
  text-align: center;
  transition: 250ms ease;
}

body #t2m-job button.job-button:hover,
body #t2m-job .t2m-submit-button:hover,
body #t2m-job a.return-button:hover,
body #t2m-job a.t2m-login-button:hover,
body #t2m-job a.job-button.primary.solliciteren:hover {
  color: var(--btn-text-color-hover);
  background-color: var(--btn-bg-color-hover);
  border: var(--btn-border-hover) !important;
  transition: 250ms ease;
}

body #t2m-job .socials_container>a>svg {
  transition: fill 0.2s ease-in-out;
  fill: var(--btn-bg-color);
  transition: 250ms ease;
}

body #t2m-job .socials_container>a:hover>svg {
  fill: var(--btn-bg-color-hover);
  transition: 250ms ease;
}

body #t2m-job .socials_container>a {
  width: 35px;
  display: inline-block;
  margin-right: 6px;
  margin-top: 5px;
}

/* =========================================== */
/* Filter Styling */
/* =========================================== */
.t2m_filter h2 {
  color: var(--filter_text_color);
  font-family: var(--filter-font);
  font-size: var(--filter-font-size);
  transition: 250ms ease;
}

.t2m_filter select {
  font-family: var(--filter-font);
  font-size: var(--filter-font-size);
  background-color: var(--filter-bg-color);
  color: var(--filter-text-color);
  border-radius: var(--filter-border-radius);
  padding: var(--filter-padding);
  border: var(--filter-border);
  transition: 250ms ease;
}

.t2m_filter select option {
  color: var(--filter-text-color);
  transition: 250ms ease;
}

.t2m_filter select:hover {
  background-color: var(--filter-bg-color-hover);
  color: var(--filter-text-color-hover);
  transition: 250ms ease;
}

.t2m_filter {
  margin: 10px 0;
}

/* =========================================== */
/* Sidebar Styling */
/* =========================================== */
body #t2m-job.t2m-job-detail .t2m_sidebar svg {
  fill: var(--sidebar-icons-color) !important;
}

/* Privacy policy */
body #t2m-job .t2m-agreement-box span a {
  color: var(--sidebar-agreement-box);
}

/* Linkjes recruiter */
body #t2m-job .job-recruiter-detail a {
  color: var(--sidebar-recruiter);
}

body #t2m-job.t2m-job-detail .t2m_sidebar h3 {
  font-family: var(--sidebar-font);
  font-size: var(--sidebar-font-size_title);
  color: var(--sidebar-title-color);
}

body #t2m-job.t2m-job-detail .t2m_sidebar h4,
body #t2m-job.t2m-job-detail aside.t2m_sidebar .share_title {
  font-family: var(--sidebar-font);
  font-size: var(--sidebar-font-size_subtitle);
  color: var(--sidebar-subtitle-color);
}

body #t2m-job.t2m-job-detail .t2m_sidebar {
  padding: var(--sidebar-padding);
  background-color: var(--sidebar-bg);
  border: var(--sidebar-border);
  border-radius: var(--sidebar-border-radius);
  height: 100%;
}

body #t2m-job.t2m-job-detail aside.t2m_sidebar .job-department-details span,
body #t2m-job.t2m-job-detail aside.t2m_sidebar .job-listing span.key,
body #t2m-job.t2m-job-detail aside.t2m_sidebar .job-listing span.val,
body #t2m-job.t2m-job-detail aside.t2m_sidebar .job-listing-detail,
body #t2m-job aside.t2m_sidebar .job-row-recruiter .job-recruiter-detail {
  font-family: var(--sidebar-font);
  color: var(--sidebar-text-color);
  display: block;
}

/* =========================================== */
/* PAGINATION */
/* =========================================== */
body #t2m-job .pagination {
  text-align: left;
  margin: 20px 0;
}

body #t2m-job .pagination .next.page-numbers,
body #t2m-job .pagination .prev.page-numbers {
  background-color: transparent;
  border: none !important;
  font-size: 1.35rem;
  color: var(--title-color-overview);
  font-weight: 400;
}

body #t2m-job .pagination span.page-numbers,
body #t2m-job .pagination a.page-numbers {
  padding: 5px 10px;
  border: 1px solid #e0e0e0 !important;
  background-color: var(--btn-bg-color);
  font-weight: 600;
  transition: 0.2s ease-in-out;
  cursor: pointer;
  font-family: var(--btn-font);
  font-size: 15px;
  border-radius: var(--btn-border-radius);
  color: var(--btn-text-color);
  margin: 0 2px;
}

body #t2m-job .pagination .pager.page-numbers.current {
  border: 1px solid var(--btn-bg-color-hover) !important;
  color: var(--btn-text-color-hover);
  background-color: var(--btn-bg-color-hover);
  cursor: auto;
  transition: 250ms ease;
}

#t2m-job iframe {
  border: 0;
}