/* Minification failed. Returning unminified contents.
(19,15): run-time error CSS1039: Token not allowed after unary operator: '-brand-off-black'
(24,49): run-time error CSS1039: Token not allowed after unary operator: '-brand-off-black'
(27,15): run-time error CSS1039: Token not allowed after unary operator: '-brand-purple'
(43,15): run-time error CSS1039: Token not allowed after unary operator: '-brand-purple'
(48,29): run-time error CSS1039: Token not allowed after unary operator: '-brand-purple'
(54,55): run-time error CSS1039: Token not allowed after unary operator: '-brand-purple'
 */
.browse-job-page {
    text-align: left;
    padding: 2rem 1rem;
    display: grid;
    gap: 2rem;
}

/* ---------- BREADCRUMB SECTION ---------- */
.browse-job-page .breadcrumb ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

.browse-job-page .breadcrumb ol li { display: inline-block; }

.browse-job-page .breadcrumb li+li::before {
  padding: 0.5rem;
  color: var(--brand-off-black);
  content: ">";
  font-weight: 400;
}

.browse-job-page .breadcrumb li a { color: var(--brand-off-black); }

.browse-job-page .breadcrumb .breadcrumb-active strong {
  color: var(--brand-purple);
  font-weight: 500;
}
/* ---------- END BREADCRUMB SECTION ---------- */

/* ---------- BROWSE LINK SECTION ---------- */
.browse-job-page .browse-links ul {
  padding: 0.75rem 0;
  display: grid;
  grid-gap: 1.5rem;
  grid-template-columns: 1fr;
}

.browse-job-page .browse-links ul li { text-transform: capitalize; }

.browse-job-page .browse-links ul li a {
  color: var(--brand-purple);
  font-weight: 400;  
}

.browse-job-page a:focus {
    outline: 1px solid var(--brand-purple);
    transition: outline 0.2s ease;
    border-radius: 0.05rem;
    outline-offset: 2px;
}
/* ---------- END BROWSE LINK SECTION ---------- */
.browse-job-page .browse-jobs-view h3 a { color: var(--brand-purple); }

.browse-job-page .browse-jobs-header h2 { font-size: 1.5rem; }

.browse-job-page .browse-links h2 { font-size: 1.25rem; }

.browse-job-page .browse-jobs-header {
    display: grid;
    gap: 1.5rem;
} 

@media only screen and (min-width: 40rem) {

    .browse-job-page .browse-links ul {
        padding: 1.5rem 0;
        grid-gap: 1.75rem 1.5rem;
        grid-template-columns: repeat(2, 1fr);
    }
}

@media only screen and (min-width: 65rem) {

    .browse-job-page { padding: 1.5rem 1.5rem; }

    .browse-job-page .browse-links ul { grid-template-columns: repeat(3, 1fr); }
}

@media only screen and (min-width: 80rem) {

    .browse-job-page {
        width: 70rem;
        margin: 0 auto;
    }
}

@media only screen and (min-width: 100rem) {

    .browse-job-page { width: 85rem; }

}
