@charset "UTF-8";
.main-page-container {
    display: flex;
    flex-direction: column;
    margin: 20px auto;
    margin-bottom: 10px;
    color: var(--color-black);
    max-width: 1024px
}

.main-page-container .align-center {
    justify-content: center;
    align-items: center;
    margin: 30px
}

.main-page-container .oops {
    margin: 20px;
    font-size: 8.9rem;
    font-weight: 800;
    color: var(--color-blue)
}

.main-page-container .title {
    font-size: 1.2rem;
    font-weight: 700;
    margin: 10px
}

.main-page-container .subtitle {
    font-size: 1rem;
    width: 350px;
    font-weight: 400;
    margin: 10px;
    text-align: center
}

.main-page-container .go-to-homepage {
    padding: 15px 30px
}

.about-block {
    margin: 10px
}

.about-block .team-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    margin: 0 auto;
    max-width: 1200px
}

.about-block .team-member {
    margin: 50px;
    text-align: center;
    flex-basis: 20%
}

.about-block .team-member img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    object-fit: cover;
    margin-bottom: 15px;
    filter: grayscale(100%)
}

.about-block .team-member h2 {
    margin: 0;
    color: #333
}

.about-block .team-member h3 {
    margin: 5px 0;
    color: #555
}

.about-block .team-member p {
    color: #666
}

.advice-index .hero_content_wrap {
    color: var(--gray-100);
    padding: 2rem 1rem;
    text-align: center
}

.advice-index .hero_content_wrap h1 {
    font-size: var(--font-size-xxx-large);
    color: var(--gray-100);
    opacity: 1;
    text-align: center;
    margin: 0;
    padding-bottom: 1rem
}

.advice-index .hero_content_wrap h2 {
    font-size: var(--font-size-large);
    color: var(--gray-200);
    opacity: 1;
    text-align: center;
    font-weight: 400;
    text-wrap: balance;
    margin: 0;
    padding-bottom: 2rem
}

.advice-index .inner-content {
    max-width: 1200px;
    margin: 0 auto;
    padding-top: 2rem;
    padding-bottom: 10rem
}

.advice-index .hero-heading {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    color: var(--gray-900);
    text-align: center;
    max-width: 600px;
    margin: auto;
    font-weight: 700
}

.advice-index .hero-subtitle {
    font-size: 1.5rem;
    margin-bottom: 1rem;
    color: var(--gray-500);
    max-width: 600px;
    margin: auto;
    text-align: center;
    margin-top: 12px;
    font-weight: 400
}

.advice-index .advice-section {
    padding: 1rem .5rem 2rem .5rem
}

.advice-index .advice-section-heading {
    color: var(--gray-900);
    font-size: var(--font-size-x-large);
    font-weight: 700;
    margin-bottom: 0
}

.advice-index .advice-section-subheading {
    color: var(--gray-700);
    font-size: var(--font-size-large);
    font-weight: 500;
    margin-bottom: 0;
    margin-top: 0
}

.advice-index .advice-section-collection {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 13px;
    margin-top: 2rem
}

.advice-index .advice-section-article {
    border-radius: 1rem;
    cursor: pointer;
    border-radius: 1rem
}

.advice-index .advice-section-article article {
    background-color: #000;
    background-image: var(--image);
    height: 250px;
    background-size: 100%;
    background-position: center;
    position: relative;
    display: flex;
    align-items: flex-end;
    padding: 1rem;
    border-radius: 1rem;
    background-repeat: none
}

.advice-index .advice-section-article article:hover:before {
    opacity: .8
}

.advice-index .advice-section-article article:before {
    content: "";
    border-radius: 1rem;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-image: linear-gradient(to bottom right, var(--gray-900), var(--gray-900));
    opacity: .7;
    transition: 200ms ease-in-out opacity
}

.advice-index .advice-section-article h2 {
    font-weight: 600 !important;
    font-size: var(--font-size-x-large) !important;
    color: #fff;
    filter: grayscale(1) saturate(1)
}

.advice-show .inner-content {
    max-width: 1200px;
    display: flex;
    margin: auto;
    padding-top: 4rem;
    padding-bottom: 10rem
}

.advice-show .article-main {
    width: 100%;
    padding: 1rem 1rem;
    line-height: 1.5;
    font-size: 1.2rem
}

.advice-show .article-main p,
.advice-show .article-main ul,
.advice-show .article-main li {
    font-size: 1.4rem;
    line-height: 1.7;
    color: var(--gray-700)
}

.advice-show .article-main li {
    margin-bottom: 1rem
}

.advice-show .article-main h1 {
    font-size: 2.7rem;
    line-height: 1.3
}

.advice-show .article-main h2 {
    font-size: 2rem
}

.advice-show .article-main h3 {
    font-size: 1.8rem
}

.advice-show .article-main strong,
.advice-show .article-main b {
    font-weight: 600
}

.advice-show .article-main a {
    text-decoration: underline
}

.advice-show .article-main .blog-image {
    width: min(100%, 1200px)
}

.advice-show .article-main img {
    max-width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 1rem
}

.advice-show .article-main blockquote {
    border-left: 5px solid var(--amber-600);
    background: var(--amber-100);
    padding-left: 10px;
    margin: 0
}

.advice-show .article-more {
    margin-top: 5rem
}

.advice-show .article-more h3>a {
    color: var(--gray-700);
    text-decoration: none
}

.advice-show .article-more .explore-more {
    width: 100%;
    line-height: 1.5;
    font-size: var(--font-size-large);
    display: flex;
    flex-wrap: wrap;
    grid-template-columns: repeat(1, 1fr);
    gap: .75rem
}

.advice-show .article-more .explore-more a {
    color: var(--gray-700);
    font-weight: 500;
    font-size: var(--font-size-medium);
    text-decoration: none
}

.advice-show .article-more .explore-more p {
    padding: 1rem;
    border-radius: .5rem;
    max-width: 30%;
    width: 100%;
    margin: 0;
    background: linear-gradient(45deg, var(--amber-100), var(--amber-200));
    transition: ease-in 200ms background
}

.advice-show .article-more .explore-more p:hover {
    background: linear-gradient(45deg, var(--amber-100), var(--amber-300))
}

.advice-show .article-sidebar {
    display: initial;
    min-width: 350px;
    padding: 1rem 1rem
}

.advice-show .article-sidebar .premium_feed_upgrade_modal {
    position: unset;
    transform: unset;
    width: 100%;
    max-width: 350px;
    text-align: center;
    margin: 20px 0;
    margin-top: 50px;
    border-radius: 4px
}

.advice-show .article-sidebar .premium_feed_upgrade_modal .content {
    padding: 1.5rem 1rem
}

.advice-show .article-sidebar .premium_feed_upgrade_modal .content h1 {
    font-size: 1.7rem
}

.advice-show .article-sidebar .premium_feed_upgrade_modal .content li {
    font-weight: 500
}

.advice-show .article-author a {
    text-decoration: underline;
    color: var(--gray-700)
}

@media only screen and (max-width:768px) {
    .inner-content {
        flex-direction: column;
        padding-top: 0 !important
    }
    .inner-content .article-sidebar {
        position: sticky;
        bottom: 0
    }
    .inner-content .article-sidebar .premium_feed_upgrade_modal {
        margin-top: 0;
        max-width: unset;
        width: 100%
    }
}

@media only screen and (max-width:624px) {
    .advice-show .article-more .explore-more {
        display: flex
    }
}

.card {
    padding: 12px 8px 12px 8px;
    display: flex;
    width: 100%;
    margin: 12px auto;
    background: var(--gray-100);
    border: 1px solid var(--gray-200);
    border-radius: .25rem;
    cursor: pointer
}

.card:hover,
.card.active {
    border: 1px solid var(--gray-300)
}

.card:hover .apply-container .apply-button,
.card.active .apply-container .apply-button {
    display: initial
}

.card.highlight {
    background: var(--amber-50)
}

.card.highlight .tags-container .tags {
    background-color: #fff5d1;
    border: 1px solid #e8dbab;
    color: #806c2a
}

.card.highlight .tags-container .tags:hover {
    background-color: #efdfa8;
    border: 1px solid #e8dbab;
    color: #806c2a
}

.card .info-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-left: 20px;
    width: 100%
}

.card .info-container .profile-header {
    display: flex;
    flex-direction: column
}

.card .info-text {
    color: var(--color-grey);
    font-size: .9rem;
    margin: 0 5px;
    align-self: center
}

.card .apply-container {
    width: 150px;
    align-self: flex-start;
    margin-top: 12px
}

.card .apply-container .apply-button {
    display: none
}

.card .tags-container {
    margin-top: 10px
}

.card .tags-container .tag-wrap {
    flex-wrap: wrap;
    margin-left: -3px
}

.card .tags-container .tags {
    border-radius: 24px;
    border: 1px solid var(--gray-200);
    color: var(--gray-700);
    padding: 3px 7px;
    margin-right: 4px;
    margin-bottom: 4px;
    font-weight: 500;
    font-size: 1rem;
    transition: all 150ms ease-in 0s
}

.card .tags-container .tags:hover {
    border: 1px solid var(--gray-300);
    background-color: var(--gray-200);
    color: var(--gray-800)
}

.card .mobile-card-actions {
    display: none
}

.card .pic-container {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 70px;
    margin-top: 4px
}

.card .pic-container .pic {
    height: 40px;
    width: 40px;
    object-fit: contain;
    border: 1px solid var(--gray-200)
}

@media screen and (max-width:768px) {
    .card .pic-container {
        display: none
    }
}

.card .company-info-container {
    margin-left: auto;
    margin-top: 10px;
    margin-bottom: 10px
}

.card .job-position {
    color: var(--gray-900);
    margin: 0;
    font-size: 1.3rem;
    font-weight: 600;
    display: inline-block
}

.card .job-position a {
    color: inherit;
    text-decoration: none
}

.card .job-position a:visited {
    color: var(--gray-600)
}

.card .job-position:hover {
    color: var(--gray-700);
    text-decoration: underline
}

.card .apply-count {
    background: var(--blue-700);
    color: var(--blue-50);
    font-size: var(--font-size-x-small);
    padding: 1px 6px;
    display: inline-block;
    vertical-align: middle;
    border-radius: 6px;
    margin-left: 4px;
    font-weight: 600
}

.card .company-name-mobile {
    display: none
}

.card .company-name {
    color: var(--gray-700);
    font-size: 1rem;
    font-weight: 400;
    margin-top: 8px
}

.card .company-name .created-at {
    margin-left: 10px
}

.card .job-meta {
    color: var(--gray-700);
    font-size: 1rem;
    margin: 0;
    margin-top: 8px;
    margin-left: -3px
}

.job-category .category-tag {
    padding: 4px 8px;
    border-radius: 24px;
    font-size: 1rem;
    background-color: var(--gray-300);
    color: var(--gray-800)
}

.job-category .category-tag a {
    color: inherit
}


/* drop down menu for applu */

.apply-button {
    background: black !important;
    color: var(--gray-50) !important;
    font-family: monospace !important;
    letter-spacing: 1px;
    text-decoration: none;
    padding: 10px 20px;
    display: inline-block;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: white;
    min-width: 50px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {
    background-color: var(--blue-400);
}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .apply-button {
    background-color: #3e8e41;
}

.card_premium_tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    height: 20px;
    width: 20px;
    font-size: var(--font-size-xx-small);
    color: var(--gray-600);
    background: var(--amber-400);
    line-height: 1
}

.card_premium_icon {
    color: var(--gray-50)
}

.card-tag {
    padding: 4px 8px;
    border-radius: 24px;
    font-size: 1rem;
    border: 1px solid var(--gray-300);
    color: var(--gray-800);
    font-weight: 500
}

:root {
    --color-blue: #e74c3c;
    --color-darkblue: #e74c3c;
    --color-background-blue: rgba(255, 221, 191, 0.2);
    --color-orange-border: #ffe0bd;
    --color-lightblue: #ffb2bb;
    --color-lightestblue: #ffe9ec;
    --color-white: #fff;
    --color-grey: #696969;
    --color-lightgrey: #ece7e7;
    --color-lightestgrey: #fafafa;
    --color-backgroundgrey: rgb(55, 53, 47, 0.08);
    --color-black: #323439;
    --green: #34b84b;
    --color-background: #00438b;
    --red: #e74c3c;
    --red-dark-5: darken(--red, 5);
    --color-brand: #e74c3c;
    --color-background: #fbfaf8;
    --color-text: #1c1c1c;
    --box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.5);
    --text-xl: 1.3rem;
    --text-lg: 1.195rem;
    --text-base: 1rem;
    --text-sm: .805rem;
    --text-xs: .7rem;
    --max-width: 1024px;
    --max-width-md: 800px;
    --max-width-lg: 1400px;
    --gray-50: #f9fafb;
    --gray-100: #f3f4f6;
    --gray-200: #e5e7eb;
    --gray-300: #d1d5db;
    --gray-400: #9ca3af;
    --gray-500: #6b7280;
    --gray-600: #4b5563;
    --gray-700: #374151;
    --gray-800: #1f2937;
    --gray-900: #111827;
    --gray-950: #030712;
    --amber-50: #fffbeb;
    --amber-100: #fef3c7;
    --amber-200: #fde68a;
    --amber-300: #fcd34d;
    --amber-400: #fbbf24;
    --amber-500: #f59e0b;
    --amber-600: #d97706;
    --amber-700: #b45309;
    --amber-800: #92400e;
    --amber-900: #78350f;
    --amber-950: #451a03;
    --sky-50: #f0f9ff;
    --sky-100: #e0f2fe;
    --sky-200: #bae6fd;
    --sky-600: #0284c7;
    --sky-700: #0369a1;
    --blue-50: #eff6ff;
    --blue-100: #dbeafe;
    --blue-200: #bfdbfe;
    --blue-300: #93c5fd;
    --blue-400: #60a5fa;
    --blue-500: #3b82f6;
    --blue-600: #2563eb;
    --blue-700: #1d4ed8;
    --red-50: #fef2f2;
    --red-100: #fee2e2;
    --red-200: #fecaca;
    --red-300: #fca5a5;
    --red-400: #f87171;
    --red-500: #ef4444;
    --red-600: #dc2626;
    --red-700: #b91c1c;
    --red-800: #991b1b;
    --red-900: #7f1d1d;
    --red-950: #450a0a;
    --emerald-100: #d1fae5;
    --emerald-200: #a7f3d0;
    --emerald-500: #10b981;
    --emerald-600: #059669;
    --font-size: 13px;
    --font-size-xxx-small: .55rem;
    --font-size-xx-small: .65rem;
    --font-size-x-small: .75rem;
    --font-size-small: .85rem;
    --font-size-medium: 1rem;
    --font-size-large: 1.25rem;
    --font-size-x-large: 1.5rem;
    --font-size-xx-large: 2rem;
    --font-size-xxx-large: 2.25rem
}

* {
    box-sizing: border-box;
    outline: 0
}

html,
body {
    font-size: 16px;
    margin: 0;
    color: var(--color-text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-smooth: always
}

input,
label,
textarea {
    margin: 0;
    border: 0;
    padding: 0;
    display: inline-block;
    vertical-align: middle;
    white-space: normal;
    background: 0;
    line-height: 1;
    font-size: 1rem
}

input:focus {
    outline: 0
}

strong {
    font-weight: 600
}

a {
    text-decoration: none;
    color: var(--color-brand)
}

.display-flex {
    display: flex;
    flex-direction: row
}

.flex-wrap {
    flex-wrap: wrap
}

.not-found-page {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    font-weight: 800;
    min-height: 550px
}

.not-found-page .not-found-text {
    display: flex;
    flex-direction: column;
    align-items: center
}

.not-found-page .not-found-text .no-jobs-found {
    margin: 10px !important
}

.not-found-page .not-found-text .see-all-jobs {
    padding: 8px 20px !important
}

.not-found-page .not-found-img {
    margin-bottom: 10px
}

.flex {
    display: flex
}

.inline-flex {
    display: inline-flex
}

.content-center {
    justify-content: center
}

.items-center {
    align-items: center
}

.margin-left-auto {
    margin-left: auto
}

.opaque-background {
    display: none;
    background: #fff;
    opacity: .8;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    -webkit-overflow-scrolling: touch
}

.show-opaque-background {
    display: initial
}

.disabled-button {
    opacity: .5 !important
}

.disabled-button:hover {
    color: var(--color-blue) !important;
    background: none !important
}

.dollar-icon::before {
    content: "＄";
    font-size: 1rem;
    font-weight: 600;
    color: var(--green)
}

[type=radio]+label {
    font-size: 1rem
}

[type=radio]:checked,
[type=radio]:not(:checked) {
    position: absolute;
    left: -9999px
}

[type=radio]:checked+label,
[type=radio]:not(:checked)+label {
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    display: inline-block
}

[type=radio]:checked+label:before,
[type=radio]:not(:checked)+label:before {
    content: "";
    position: absolute;
    left: 0;
    top: -1px;
    width: 18px;
    height: 18px;
    border: 1px solid var(--color-lightgrey);
    border-radius: 100%;
    background: #fff
}

[type=radio]:checked+label:after,
[type=radio]:not(:checked)+label:after {
    content: "";
    width: 8px;
    height: 8px;
    background: var(--color-black);
    position: absolute;
    top: 5px;
    left: 6px;
    border-radius: 100%;
    -webkit-transition: all .2s ease;
    transition: all .2s ease
}

[type=radio]:not(:checked)+label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0)
}

[type=radio]:checked+label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.lock-position {
    overflow: hidden
}

.dialog-div {
    position: fixed;
    border-radius: 5px;
    left: 50%;
    top: 50px;
    transform: translate(-50%, 0);
    margin: auto;
    z-index: 11;
    background-color: white;
    box-shadow: 0 0 5px 1px rgba(136, 136, 136, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.1);
    border: 1px solid var(--color-lightgrey);
    overflow: auto;
    padding: 5px 15px
}

.dialog-div.hidden {
    display: none
}

label.label {
    font-size: 1.1rem;
    margin-bottom: 10px;
    color: #343434
}

input.input,
textarea.input {
    border: 1px solid var(--color-lightgrey);
    padding: 15px 20px;
    display: block;
    width: 100%;
    border-radius: 5px;
    background: #fafafa;
    line-height: 1.3;
    box-shadow: 0 0 5px 0 rgba(238, 238, 238, 0.3)
}

select.select {
    border: 1px solid var(--color-lightgrey);
    padding: 15px 20px;
    display: block;
    width: 100%;
    border-radius: 5px;
    background: #fafafa;
    color: var(--color-grey);
    font-size: 1rem;
    line-height: 1.3;
    box-shadow: 0 0 5px 0 rgba(238, 238, 238, 0.3);
    margin: 0;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none
}

.primary-btn {
    padding: 8px 16px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-decoration: none;
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    background-color: var(--color-blue);
    border-radius: 4px;
    border: 1px solid var(--color-blue);
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1), 0 2px 3px 0 rgba(0, 0, 0, 0.2);
    -webkit-transition: box-shadow .2s cubic-bezier(0.4, 0, 0.2, 1), background-color .3s cubic-bezier(0.4, 0, 0.2, 1), border .3s cubic-bezier(0.4, 0, 0.2, 1);
    -moz-transition: box-shadow .2s cubic-bezier(0.4, 0, 0.2, 1), background-color .3s cubic-bezier(0.4, 0, 0.2, 1), border .3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow .2s cubic-bezier(0.4, 0, 0.2, 1), background-color .3s cubic-bezier(0.4, 0, 0.2, 1), border .3s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: auto;
    position: relative
}

.primary-btn:hover {
    background-color: var(--color-darkblue);
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1), 0 6px 8px 0 rgba(0, 0, 0, 0.2);
    color: #fff;
    text-decoration: none
}

.primary-btn.outline {
    border: 1px solid var(--color-blue);
    color: var(--color-blue);
    background-color: transparent;
    box-shadow: none
}

.primary-btn.outline:hover {
    background-color: var(--color-blue);
    color: white
}

.white-btn {
    border: 1px solid #eee;
    padding: 8px 16px;
    border-radius: 2px;
    color: var(--color-black);
    background-color: #fff;
    text-decoration: none;
    cursor: pointer;
    font-weight: 600;
    font-size: .9rem;
    box-shadow: 0 1px 0 0 rgba(142, 142, 142, 0.18)
}

.white-btn:hover {
    background-color: #fafafa
}

@keyframes rotate {
    from {
        transform: rotate(0)
    }
    to {
        transform: rotate(360deg)
    }
}

.loader>div {
    border-radius: 100%;
    margin: 2px;
    border: 2px solid #fff;
    border-bottom-color: transparent !important;
    height: 1rem;
    width: 1rem;
    background: 0 0 !important;
    display: inline-block;
    -webkit-animation: rotate .75s 0s linear infinite;
    animation: rotate .75s 0s linear infinite
}

.loader.dark>div {
    border: 2px solid var(--color-black)
}

.hidden {
    display: none
}

.visibility-hidden {
    visibility: hidden
}

.company-details {
    max-width: 1200px;
    margin: auto;
    margin-bottom: 50px
}

.company-base-container {
    margin-top: 50px
}

.company-base-container .header-image {
    height: 500px;
    width: 1200px
}

.company-base-container .pic {
    height: 70px;
    width: 70px;
    margin: 0 10px;
    object-fit: contain
}

.company-base-container .company-info {
    display: flex
}

.company-base-container .company-info .company-name {
    font-size: 2.1rem;
    font-weight: 800;
    color: var(--color-black);
    margin: 0 10px
}

.company-base-container .company-info .company-social {
    margin-left: auto;
    display: flex;
    flex-direction: column
}

.company-base-container .company-info .company-social a {
    color: var(--color-grey);
    text-decoration: underline !important;
    font-weight: 600;
    margin-left: 10px;
    text-decoration: none;
    margin-bottom: 10px
}

.company-base-container .hiring-for-container {
    font-size: 1rem;
    margin-bottom: 30px;
    margin-left: 100px;
    line-height: 1.5
}

.company-base-container .hiring-for-container .job-item {
    font-weight: 600;
    color: var(--color-grey);
    border-bottom: 2px solid var(--color-lightgrey)
}

.company-other-jobs-container {
    padding-right: 25px;
    padding-top: 20px
}

.company-other-jobs-container .similar-jobs {
    margin-top: 30px;
    margin-bottom: 50px
}

.company-other-jobs-container .similar-jobs .title {
    display: inline-block;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-grey);
    border-bottom: 2px solid var(--color-lightgrey);
    margin: 20px 0
}

.company-other-jobs-container .similar-jobs .small-job-card {
    margin-bottom: 20px
}

.company-other-jobs-container .similar-jobs .small-job-card h4 {
    display: inline
}

.company-other-jobs-container .similar-jobs .small-job-card .company_name {
    font-size: .9rem;
    color: var(--color-black);
    text-decoration: none
}

.more-companies {
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 20px
}

.more-companies .company-name {
    font-size: 1rem;
    font-weight: 600;
    margin-left: 10px
}

.more-companies .small-pic {
    height: 45px;
    width: 45px
}

.more-companies .see-jobs {
    margin-left: auto
}

.more-companies .see-jobs a {
    font-size: .8rem;
    text-decoration: none;
    font-weight: 600;
    color: var(--color-blue);
    border-bottom: 2px solid var(--color-lightblue)
}

.detailed-job-main-container {
    background-color: var(--gray-100)
}

.detailed-job-main-container .header {
    border-bottom: 1px solid var(--gray-200) !important;
    margin-bottom: 1rem
}

.detailed-job-main-container mark {
    font-weight: 600;
    background: linear-gradient(to bottom, rgba(255, 146, 48, 0.3), rgba(255, 146, 48, 0.2))
}

.detailed-job-main-container .info-banner {
    margin: 1rem 0;
    padding: .5rem 0;
    border-top: 1px solid var(--gray-200)
}

.detailed-job-main-container .info-banner h3 {
    display: inline-block;
    margin: .5rem 0 0 0;
    font-size: var(--font-size-x-small);
    font-weight: 500
}

.detailed-job-main-container .info-banner p {
    font-size: var(--font-size-xx-small);
    margin: 0
}

.detailed-job-main-container .info-banner mark {
    font-weight: 500;
    background: var(--amber-100)
}

.detailed-job-main-container .detailed-job-wrapper {
    display: flex;
    justify-content: center;
    max-width: 1400px;
    margin: auto;
    padding: 0 1.5rem;
    gap: .5rem
}

@media(max-width:768px) {
    .detailed-job-main-container .detailed-job-wrapper {
        flex-direction: column;
        padding: 0 1rem 5rem 1rem
    }
}

.detailed-job-main-container .share-container {
    display: flex;
    flex-direction: column;
    margin: 1rem 0
}

.detailed-job-main-container .apply-button-top {
    margin-left: auto;
    display: flex;
    flex-direction: column
}

.detailed-job-main-container .apply-button-top span {
    display: inline-block;
    width: 150px;
    text-transform: uppercase;
    font-size: var(--font-size-xx-small);
    margin-top: .75rem;
    line-height: 1.5;
    font-weight: 400
}

@media screen and (max-width:768px) {
    .detailed-job-main-container .apply-button-top span {
        width: 100%;
        text-align: center
    }
}

.detailed-job-main-container .detailed-job {
    margin: 1rem auto;
    max-width: 800px
}

@media(max-width:768px) {
    .detailed-job-main-container .detailed-job {
        margin: unset
    }
}

.detailed-job-main-container .detailed-job .mobile-job-position {
    display: none
}

.detailed-job-main-container .detailed-job .detailed-job-head {
    margin-top: 1rem;
    width: 100%;
    display: flex;
    gap: 1rem
}

@media screen and (max-width:768px) {
    .detailed-job-main-container .detailed-job .detailed-job-head {
        flex-direction: column
    }
}

.detailed-job-main-container .detailed-job .job_head_info_container {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    flex-shrink: 1;
    width: 100%
}

.detailed-job-main-container .detailed-job .job_head_apply_container {
    flex-shrink: 0;
    margin-top: 2rem
}

@media screen and (max-width:768px) {
    .detailed-job-main-container .detailed-job .job_head_apply_container {
        margin-top: 0
    }
}

.detailed-job-main-container .detailed-job .job_company_link {
    display: inline-flex;
    align-items: center;
    gap: .5rem
}

.detailed-job-main-container .detailed-job .job_company_logo {
    height: 24px;
    width: 24px;
    object-fit: contain
}

.detailed-job-main-container .detailed-job .job_premium_badge {
    color: var(--amber-600);
    background-color: var(--amber-100);
    padding: .25rem .5rem;
    font-weight: 500;
    font-size: var(--font-size-x-small);
    border-radius: 24px
}

.detailed-job-main-container .detailed-job .job_company_title {
    font-size: var(--font-size-medium);
    font-weight: 600;
    color: var(--gray-700);
    text-decoration: none;
    margin: 0
}

.detailed-job-main-container .detailed-job .job_company_title:hover {
    text-decoration: underline
}

.detailed-job-main-container .detailed-job .job_position_title {
    margin: 0;
    font-size: var(--font-size-x-large);
    font-weight: 700
}

.detailed-job-main-container .detailed-job .job-info {
    display: flex;
    align-items: center;
    font-size: var(--font-size-medium);
    color: var(--gray-500);
    font-weight: 500
}

.detailed-job-main-container .detailed-job .job-info-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 1rem
}

.detailed-job-main-container .detailed-job .job-info-tags .tag {
    background: var(--gray-200);
    font-weight: 500;
    color: var(--gray-700);
    font-size: 1rem;
    border-radius: 24px;
    border: 1px solid var(--gray-300);
    padding: 2px 8px
}

.detailed-job-main-container .detailed-job .share-apply-box {
    display: flex
}

@media screen and (max-width:768px) {
    .detailed-job-main-container .detailed-job .share-apply-box {
        flex-direction: column;
        gap: .5rem
    }
    .detailed-job-main-container .detailed-job .share-apply-box h3 {
        margin: 0
    }
}

.detailed-job-main-container .detailed-job .share-apply-box .icon {
    color: var(--gray-500)
}

.detailed-job-main-container .detailed-job .share-apply-box .icon svg {
    height: 1.5rem;
    width: 1.5rem
}

.detailed-job-main-container .detailed-job .share-apply-box .btn-container {
    display: flex;
    align-items: center;
    margin-left: auto
}

@media screen and (max-width:768px) {
    .detailed-job-main-container .detailed-job .share-apply-box .btn-container {
        flex-direction: column;
        margin: 0;
        gap: 1rem
    }
    .detailed-job-main-container .detailed-job .share-apply-box .btn-container .report-btn,
    .detailed-job-main-container .detailed-job .share-apply-box .btn-container .apply-btn,
    .detailed-job-main-container .detailed-job .share-apply-box .btn-container a.button {
        width: 100%;
        margin: 0 !important
    }
}

.detailed-job-main-container .detailed-job .share-apply-box .btn-container .apply-btn {
    margin-left: 10px
}

.detailed-job-main-container .detailed-job .detailed-job-body {
    background: var(--gray-50);
    border-radius: 6px;
    padding: .5rem 1rem;
    border: 1px solid var(--gray-200);
    width: 100%;
    overflow: hidden
}

.detailed-job-main-container .detailed-job .detailed-job-body.paygated .job-full-description {
    filter: blur(4px)
}

.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description {
    word-wrap: break-word;
    font-size: 112%;
    font-weight: 400;
    line-height: 1.5
}

.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description *:empty,
.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description br {
    display: none
}

.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description pre {
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word
}

.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description p,
.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description li,
.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description div {
    line-height: 1.5;
    margin-bottom: 24px
}

.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description li {
    margin-bottom: 8px
}

.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description h1,
.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description h2 {
    font-weight: 600;
    font-size: var(--font-size-large)
}

.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description h3,
.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description h4,
.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description h5,
.detailed-job-main-container .detailed-job .detailed-job-body .job-full-description h6 {
    font-size: var(--font-size-medium);
    color: var(--gray-600)
}

.detailed-job-main-container .detailed-job .detailed-job-body .job-description-text {
    color: var(--color-grey);
    font-weight: 600;
    font-size: 1.2rem
}

.detailed-job-main-container .detailed-job .detailed-job-body .apply-link {
    width: 200px;
    text-align: center;
    flex: 1;
    position: relative;
    top: 5px;
    cursor: pointer
}

.detailed-job-main-container .articles h3 {
    font-size: 2rem;
    font-weight: 800
}

.detailed-job-main-container .detailed_job_fix {
    position: unset;
    transform: unset;
    text-align: center;
    max-width: 350px;
    margin-top: 50px;
    margin-bottom: 1rem;
    background-color: var(--gray-50);
    border: 1px solid var(--gray-200);
    border-radius: 6px
}

@media(max-width:768px) {
    .detailed-job-main-container .detailed_job_fix {
        max-width: unset
    }
}

.detailed-job-main-container .resume-review-sidebar {
    width: 100%;
    max-width: 350px;
    margin-top: 12px;
    padding: 1rem;
    background-color: var(--gray-50);
    border: 1px solid var(--gray-200);
    border-radius: 6px
}

@media(max-width:768px) {
    .detailed-job-main-container .resume-review-sidebar {
        max-width: unset
    }
}

.detailed-job-main-container .resume-words-sidebar {
    width: 100%;
    max-width: 350px;
    margin-top: 12px;
    padding: 1rem;
    background-color: var(--gray-50);
    border: 1px solid var(--gray-200);
    border-radius: 6px
}

@media(max-width:768px) {
    .detailed-job-main-container .resume-words-sidebar {
        max-width: unset
    }
}

.detailed-job-main-container .resume-words-sidebar .power-image {
    width: 100%
}

.detailed-job-main-container .resume-words-sidebar .resume-words-sidebar-content {
    padding: 0 2rem 2rem 2rem
}

.detailed-job-main-container .resume-words-sidebar h3 {
    font-size: 1.5rem
}

.detailed-job-main-container .resume-words-sidebar h3 b {
    color: var(--amber-600);
    text-decoration: underline
}

.detailed-job-main-container .resume-words-sidebar p {
    font-size: 1.2rem
}

.detailed-job-main-container .resume-words-sidebar .resume-review-sidebar-button-footer {
    font-size: .9rem;
    color: var(--gray-500);
    font-weight: 500;
    text-align: center
}

.detailed-job-main-container .resume-words-sidebar .button.primary {
    font-size: 1.3rem;
    font-weight: 600;
    margin-top: 10px
}

.detailed-job-main-container .related-jobs {
    max-width: 350px;
    max-height: 800px;
    margin: 0;
    padding: 1rem .75rem;
    background-color: var(--gray-50);
    border: 1px solid var(--gray-200);
    border-radius: 6px;
    width: 100%
}

@media(max-width:768px) {
    .detailed-job-main-container .related-jobs {
        max-width: unset
    }
}

.detailed-job-main-container .related-jobs h2 {
    font-size: var(--font-size-medium);
    font-weight: 600;
    margin: 0 0 1rem 0
}

.detailed-job-main-container .related-jobs div.job {
    margin-bottom: 10px
}

.detailed-job-main-container .related-jobs img {
    border-radius: 50%;
    margin-right: .5rem
}

.detailed-job-main-container .related-jobs a {
    font-size: 1rem;
    font-weight: 500;
    color: var(--gray-500);
    text-decoration: none
}

.detailed-job-main-container .related-jobs a:hover {
    color: var(--gray-700)
}

.detailed-job-main-container .related-jobs .see-all {
    margin-top: 15px;
    font-weight: 600
}

.detailed-job-main-container .related-jobs .see-all a {
    color: var(--color-blue)
}

.detailed-job-main-container .breadcrumb-container {
    margin-top: 1rem;
    font-weight: 600;
    color: var(--gray-500)
}

.detailed-job-main-container .breadcrumb-container .crumb {
    font-size: var(--font-size-medium);
    color: var(--gray-500);
    text-decoration: none;
    font-weight: 500
}

.detailed-job-main-container .breadcrumb-container .crumb:hover {
    color: var(--gray-700);
    text-decoration: underline
}

.detailed-job-main-container .breadcrumb-container .crumb.active {
    color: var(--gray-700)
}

.detailed-job-main-container .article-more {
    margin: 2rem 0 2rem 0
}

.detailed-job-main-container .article-more h2>a {
    color: var(--gray-900)
}

.detailed-job-main-container .article-more .explore-more {
    width: 100%;
    line-height: 1.5;
    font-size: var(--font-size-large)
}

@media screen and (max-width:640px) {
    .detailed-job-main-container .article-more .explore-more {
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }
}

.detailed-job-main-container .article-more .explore-more a {
    color: var(--gray-700);
    font-weight: 500;
    font-size: var(--font-size-medium)
}

.detailed-job-main-container .article-more .explore-more h3 {
    padding: 1rem;
    border-radius: .5rem;
    width: 100%;
    margin: 0;
    background: linear-gradient(45deg, var(--amber-100), var(--amber-200));
    transition: ease-in 200ms background
}

.detailed-job-main-container .article-more .explore-more h3:hover {
    background: linear-gradient(45deg, var(--amber-100), var(--amber-300))
}

.detailed-job-main-container .credit {
    background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b);
    background-size: 200% 200%;
    color: var(--gray-50);
    padding: 1rem 1rem;
    font-size: var(--font-size-medium);
    border-radius: 6px;
    margin: 1rem 0
}

.detailed-job-main-container .credit h3 {
    margin: 0
}

.detailed-job-main-container .credit p {
    margin: 0
}

.premium_feed_upgrade_modal {
    position: absolute;
    top: 5rem;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border-radius: 25px;
    border: 3px solid var(--red);
    width: 100%;
    max-width: 600px
}

.premium_feed_upgrade_modal .content {
    padding: 3rem 2rem;
    margin: auto;
    align-items: center
}

.premium_feed_upgrade_modal .content .locked_tag {
    background: var(--red-100);
    color: var(--red-600);
    border-radius: 25px;
    padding: 4px 12px;
    position: absolute;
    top: -16px;
    left: 50%;
    transform: translateX(-50%)
}

.premium_feed_upgrade_modal .content .locked_tag h2 {
    margin: 0;
    color: var(--red-600)
}

.premium_feed_upgrade_modal .content h1 {
    font-size: var(--font-size-x-large);
    font-weight: 900;
    color: var(--gray-900);
    margin: 0 0 .5rem 0
}

.premium_feed_upgrade_modal .content h2 {
    font-size: var(--font-size-large);
    font-weight: 600;
    color: var(--gray-500);
    margin: 0 0 .5rem 0
}

.premium_feed_upgrade_modal .content p {
    margin: 0;
    color: var(--gray-400);
    font-weight: 600
}

.premium_feed_upgrade_modal .content ul {
    list-style-type: none;
    padding: 0;
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
    justify-content: center
}

.premium_feed_upgrade_modal .content ul li {
    color: #be123c;
    background-image: linear-gradient(240deg, #fecdd3, #fbcfe8);
    display: inline-flex;
    border-radius: 25px;
    padding: 3px .5rem
}

.premium_feed_upgrade_modal .content ul .icon {
    margin-right: 4px
}

.premium_feed_upgrade_modal .content .pricingCard h3 {
    text-align: center;
    margin-bottom: 0
}

.premium_feed_upgrade_modal .content .pricingCard a.button {
    font-size: var(--font-size-medium)
}

.premium_feed_upgrade_modal .premium-feed-listing-upgrade-pricing-proof {
    margin-top: 0;
    margin-bottom: 0;
    font-size: var(--font-size-medium);
    text-align: center
}

.detailed-job-company-profile {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 1rem;
    margin-top: 2rem;
    background: var(--gray-50);
    max-width: 350px;
    padding: 1rem .75rem;
    border: 1px solid var(--gray-200);
    border-radius: 6px;
    width: 100%
}

@media(max-width:768px) {
    .detailed-job-company-profile {
        max-width: unset
    }
}

.detailed-job-company-profile h2 {
    font-size: var(--font-size-medium);
    font-weight: 600;
    margin: 0
}

.detailed-job-company-profile p {
    margin: 0;
    text-align: center
}

.detailed-job-company-profile img {
    height: 48px;
    width: 48px;
    object-fit: contain;
    border-radius: 50%
}

.detailed-job-company-profile .company-profile-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
    justify-content: center
}

.detailed-job-company-profile .company-profile-tags:empty {
    display: none
}

.detailed-job-company-profile .tag {
    background: #fff;
    font-weight: 500;
    color: var(--gray-700);
    font-size: 1rem;
    border-radius: 24px;
    border: 1px solid var(--gray-300);
    padding: 2px 8px
}

.detailed-job-company-profile .company-profile-links {
    gap: 8px;
    display: flex
}

.detailed-job-company-profile .company-profile-links a {
    font-size: 1rem;
    font-weight: 600;
    color: var(--gray-500);
    text-decoration: underline
}

.detailed-job-company-profile .company-profile-links a:hover {
    color: var(--gray-700)
}

.manage-container {
    margin: auto;
    padding: 30px;
    margin-bottom: 50px;
    max-width: 720px;
    color: var(--color-black)
}

.manage-container h1 {
    font-size: 2.2rem;
    font-weight: 800
}

.manage-container .inline-link-btn {
    border: 0;
    box-shadow: none;
    background: 0;
    font-size: inherit;
    padding: 0;
    margin: 0;
    color: var(--color-blue);
    cursor: pointer
}

.manage-container .inline-link-btn:hover {
    text-decoration: underline
}

.manage-container .edit-subscription-item-container {
    padding: 8px 26px
}

.manage-container .manage-content-container {
    display: flex
}

.manage-container .manage-content-container .category-container {
    margin-bottom: 20px
}

.manage-container .manage-content-container .category-container .category {
    display: flex
}

.manage-container .manage-content-container .category-container .category .category-list {
    margin-right: 30px
}

.manage-container .manage-content-container .category-container .category .category-list .input-checkbox {
    margin-bottom: 10px
}

.manage-container .manage-content-container .save-wrapper {
    margin-top: 30px
}

.manage-container .manage-content-container .save-wrapper .white-btn {
    color: var(--color-grey);
    font-weight: 600
}

.unsubscribe-container .unsubscribe-image {
    width: 100%
}

.unsubscribe-container .unsubscribe-content {
    max-width: 620px;
    width: 100%
}

.unsubscribe-container .button-container {
    margin-top: 20px
}

.lead-magnet-show h1 {
    color: white;
    font-size: var(--font-size-xxx-large);
    text-align: center;
    max-width: 33ch
}

.lead-magnet-show .email-box,
.lead-magnet-show .email-box-success {
    margin: auto;
    width: 100%;
    max-width: 500px;
    text-align: center;
    margin-top: 4rem;
    margin-bottom: 4rem;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
    border: 1px solid var(--gray-200);
    font-size: var(--font-size-x-large);
    font-weight: 400;
    padding: 2rem;
    border-radius: .75rem
}

.lead-magnet-show .email-box .crossPromoSubtitle,
.lead-magnet-show .email-box-success .crossPromoSubtitle {
    color: var(--gray-600)
}

.lead-magnet-show .email-box ul,
.lead-magnet-show .email-box-success ul {
    list-style-type: none;
    padding: 0;
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
    justify-content: center
}

.lead-magnet-show .email-box ul li,
.lead-magnet-show .email-box-success ul li {
    color: #be123c;
    background-image: linear-gradient(240deg, #fecdd3, #fbcfe8);
    display: inline-flex;
    border-radius: 25px;
    padding: 3px .5rem;
    font-size: 1rem;
    font-weight: bold
}

.lead-magnet-show .email-box ul .icon,
.lead-magnet-show .email-box-success ul .icon {
    margin-right: 4px
}

.lead-magnet-show .email-input {
    margin-bottom: 1rem !important
}

.lead-magnet-show .cross-promo {
    margin: auto;
    border-top: 12px solid #ffc776;
    color: white;
    width: 100%;
    max-width: 800px;
    margin-top: 4rem;
    margin-bottom: 4rem;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
    font-size: var(--font-size-x-large);
    font-weight: 400;
    padding: 2rem;
    border-radius: .75rem;
    background: #0d1b2a
}

.lead-magnet-show .cross-promo h2,
.lead-magnet-show .cross-promo h3 {
    text-align: center
}

.faq-container {
    line-height: 1.5
}

.faq-container h1 {
    text-align: center
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 400 900;
    src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2JL7W0Q5n-wU.woff2") format("woff2");
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 400 900;
    src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa0ZL7W0Q5n-wU.woff2") format("woff2");
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 400 900;
    src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2ZL7W0Q5n-wU.woff2") format("woff2");
    unicode-range: U+1F00-1FFF
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 400 900;
    src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1pL7W0Q5n-wU.woff2") format("woff2");
    unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 400 900;
    src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2pL7W0Q5n-wU.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 400 900;
    src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa25L7W0Q5n-wU.woff2") format("woff2");
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 400 900;
    src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1ZL7W0Q5nw.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}

html,
body {
    font-size: 14px;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.5
}

html *,
body * {
    font-family: Inter, -apple-system, "system-ui", "Segoe UI", sans-serif
}

.font-medium {
    font-weight: 500
}

.font-heading {
    letter-spacing: -0.075rem
}

.footer {
    display: flex;
    flex-direction: column;
    background: #262e31;
    padding-bottom: 20px;
    color: #fff
}

.footer .logo {
    height: 20px;
    margin-bottom: 10px;
    text-align: center
}

.footer .footer-content {
    display: flex;
    padding: 10px;
    margin: auto
}

.footer .footer-content .social-media-info {
    width: 10%;
    margin: 10px;
    font-weight: 600
}

.footer .footer-content .company-info {
    margin: 10px;
    font-weight: 600;
    flex: 1
}

.footer .footer-content .legal-info {
    width: 10%;
    margin: 10px;
    font-weight: 600
}

.footer .footer-name {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 12px
}

.footer .footer-name img {
    margin-bottom: 12px
}

.footer .links-container {
    margin-top: 12px
}

.footer .links-container .link {
    color: #eee;
    text-decoration: none;
    margin: 4px 0;
    font-weight: 400
}

.footer .flex {
    display: flex;
    flex-direction: column
}

.footer .title {
    font-size: 1rem;
    font-weight: 600;
    color: #9ca3af;
    margin-bottom: 0
}

.button {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
    color: #fff;
    font-weight: 600;
    border-radius: .5rem;
    background-color: #fff;
    border: 1px solid #ddd;
    text-align: center;
    user-select: none;
    display: inline-block;
    text-transform: uppercase;
    padding: 12px 14px;
    min-height: 40px;
    text-transform: none;
    font-size: 1rem;
    line-height: 1.2;
    color: #1c1c1c;
    background-color: #fff
}

.button.primary {
    background-color: var(--color-brand);
    color: #fff;
    border: 1px solid var(--color-brand)
}

.button.primary-outline {
    border: 1px solid var(--color-brand);
    background: transparent;
    color: var(--color-brand)
}

textarea,
input[type=name],
input[type=email],
input[type=password],
input[type=text],
input[type=button],
input[type=date],
select {
    text-overflow: "" !important;
    text-indent: .01px !important;
    appearance: none !important;
    padding: 12px 16px;
    border-radius: .5rem;
    outline: 0;
    background: #fff;
    color: #1c1c1c;
    margin: 0;
    font-weight: 400;
    font-size: 1rem;
    border: 1px solid #ddd
}

textarea:active,
textarea:focus,
input[type=name]:active,
input[type=name]:focus,
input[type=email]:active,
input[type=email]:focus,
input[type=password]:active,
input[type=password]:focus,
input[type=text]:active,
input[type=text]:focus,
input[type=button]:active,
input[type=button]:focus,
input[type=date]:active,
input[type=date]:focus,
select:active,
select:focus {
    box-shadow: 0 0 0 2px rgba(231, 76, 60, 0.5);
    border-color: transparent
}

mark {
    background-color: var(--amber-200)
}

.icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    stroke-width: 0;
    stroke: currentColor;
    fill: currentColor;
    vertical-align: middle
}

.icon svg {
    width: 1rem;
    height: 1rem
}

.tooltip {
    position: relative
}

.tooltip::after {
    display: none;
    content: attr(data-tooltip);
    visibility: hidden;
    opacity: 0;
    width: 300px;
    min-width: min-content;
    max-width: max-content;
    background-color: var(--gray-950);
    color: var(--gray-50);
    text-align: center;
    border-radius: .25rem;
    padding: .5rem .5rem;
    position: absolute;
    z-index: 1;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    transition: opacity .1s ease-in-out;
    font-size: .8rem !important
}

.tooltip:hover::after {
    display: unset;
    visibility: visible;
    opacity: 1
}

.header {
    height: 75px;
    align-items: center;
    border-bottom: 1px solid #eee
}

@media screen and (max-width:768px) {
    .header {
        height: 60px
    }
}

.header .desktopLogo {
    display: none
}

@media screen and (min-width:769px) {
    .header .desktopLogo {
        display: block;
        margin-left: 50px
    }
}

.header .mobileLogo {
    display: none
}

@media screen and (max-width:768px) {
    .header .mobileLogo {
        display: block;
        margin-left: 20px
    }
}

.header .mobileMenu {
    list-style: none;
    position: relative;
    padding: 0
}

.header .mobileMenu li {
    position: relative;
    float: left;
    margin: 0;
    padding: 0
}

.header .mobileMenu ul {
    background: var(--color-black);
    padding: 15px 0;
    list-style: none;
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    box-shadow: 0 1px 3px 2px rgba(60, 57, 57, 0.4);
    z-index: 9999
}

.header .mobileMenu ul li {
    float: none;
    width: 200px;
    padding: 3px 10px !important
}

.header .mobileMenu ul li:hover {
    background: var(--color-blue);
    color: var(--color-black)
}

.header .mobileMenu ul a {
    display: block;
    text-decoration: none;
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
    font-weight: 400;
    line-height: 120%
}

.header .mobileMenu ul a:hover {
    color: rgba(255, 255, 255, 0.95)
}

.header .mobileMenu ul ul {
    top: 0;
    left: 100%
}

.header .mobileMenu li:hover>ul {
    display: block
}

.header .menu {
    list-style: none;
    position: relative;
    padding: 0
}

.header .menu a.header-button {
    display: block;
    text-decoration: none;
    color: var(--color-grey);
    text-decoration: none;
    font-weight: 500;
    font-size: 1rem;
    line-height: 32px;
    padding: 0 10px
}

.header .menu a.header-button:hover {
    color: black
}

.header .menu a.header-cta-outline {
    color: #fff !important;
    background-color: #0284c7;
    border: #0369a1;
    margin-left: 1rem
}

.header .menu a.header-cta-gradient {
    margin-left: 1rem;
    margin-right: 50px;
    background-image: linear-gradient(60deg, #c026d3, #e11d48, #db2777);
    background-size: 200% 200%;
    border: 1px solid transparent
}

.header .menu li {
    position: relative;
    float: left;
    margin: 0;
    padding: 0
}

.header .menu ul {
    background: var(--color-black);
    padding: 15px 0;
    list-style: none;
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    box-shadow: 0 1px 3px 2px rgba(60, 57, 57, 0.4);
    z-index: 9999
}

.header .menu ul li {
    float: none;
    width: 200px;
    padding: 3px 10px !important
}

.header .menu ul li:hover {
    background: var(--color-blue);
    color: var(--color-black)
}

.header .menu ul a {
    display: block;
    text-decoration: none;
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
    font-weight: 400;
    line-height: 120%
}

.header .menu ul a:hover {
    color: rgba(255, 255, 255, 0.95)
}

.header .menu ul ul {
    top: 0;
    left: 100%
}

.header .menu li:hover>ul {
    display: block
}

.header .menu .primary-btn {
    font-weight: 600;
    color: white
}

.header.inverted {
    border-bottom: 0
}

.header.inverted .menu>li>a:not(.header-button) {
    color: white
}

.header .logo {
    height: 30px;
    align-items: center;
    margin-left: 50px
}

.header .navigation {
    display: none
}

.header .header-button {
    text-decoration: none;
    font-size: 1rem;
    color: var(--color-grey);
    font-weight: 400
}

.header .header-button.inverted {
    color: white
}

.globalheader-mobile-menu-list {
    transition: height .2s ease-out;
    overflow: hidden;
    height: 0;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background: var(--gray-900);
    padding: 12px 12px 75px 12px;
    will-change: height;
    z-index: 2
}

.globalheader-mobile-menu-list li:first-child {
    text-align: right
}

.globalheader-mobile-menu-list ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.globalheader-mobile-menu-list ul>li:first-child>a,
.globalheader-mobile-menu-list ul>li:nth-child(2)>a {
    margin-top: 0
}

.globalheader-mobile-menu-list ul>li>a {
    color: var(--gray-50) !important;
    text-decoration: none;
    display: block;
    padding: 10px;
    font-size: 1.3rem;
    font-weight: 600;
    margin-top: 24px
}

.globalheader-mobile-menu-list ul>li>a:hover {
    color: var(--gray-100) !important;
    text-decoration: underline
}

.globalheader-mobile-menu-list a.header-cta-outline {
    color: var(--red) !important;
    border: 1px solid var(--red) !important;
    background-color: transparent !important;
    width: 100%
}

.globalheader-mobile-menu-list a.header-cta-gradient {
    background: linear-gradient(90deg, var(--red-600), var(--amber-600));
    border: 1px solid var(--red-600);
    width: 100%
}

.landing-page-container .landing-page {
    justify-content: center
}

.landing-page-container .content {
    max-width: 800px
}

.landing-page-container.homepage-container {
    background-image: url("/assets/homepage.jpg") !important;
    background-repeat: no-repeat;
    background-size: cover
}

.category .category-page {
    display: flex;
    margin-top: 10px;
    align-items: center
}

.category .category-page .category-title {
    color: black;
    font-weight: 500
}

.category .category-page h2 {
    margin-right: auto
}

.category .category-view-more {
    text-align: center;
    margin: 10px
}

.category .category-view-more .view-more {
    margin-right: auto;
    text-align: center;
    width: 300px;
    height: 50px;
    padding: 5px 2px 5px 2px;
    box-shadow: 4px 4px 10px 0 rgba(22, 25, 28, 0.07);
    background: white;
    border-radius: 5px;
    transition: all 100ms ease-in 0s;
    border: 1px solid #ececec;
    cursor: pointer
}

.category .category-view-more .view-more a {
    color: var(--color-grey);
    font-size: 15px
}

.buttons-container {
    display: flex
}

.buttons-container .homepage-button {
    margin: 10px
}

.buttons-container .homepage-button a {
    color: black
}

.job-alert-container {
    position: fixed;
    height: 450px;
    width: 720px;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    color: var(--color-black);
    display: flex;
    flex-direction: row;
    align-items: center;
    z-index: 11;
    background-color: white;
    box-shadow: 0 0 5px 1px rgba(136, 136, 136, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.1);
    overflow: auto
}

.user-details-container {
    height: 100%;
    padding: 30px 10px;
    width: 100%
}

.user-details-container .alert-header {
    font-size: 1.5rem;
    font-weight: 700;
    margin: 10px 20px
}

.user-details-container .user-info {
    margin: 30px 20px;
    font-size: .9rem;
    color: var(--color-grey)
}

.user-details-container .user-info .name,
.user-details-container .user-info .email {
    margin-bottom: 15px
}

.user-details-container .subscribe {
    margin: 20px
}

.alert-pic-container {
    height: 100%;
    width: 100%;
    background: #cce9ff
}

.alert-pic-container .alert-pic {
    width: 350px
}

.hide-alert {
    display: none
}

.show-alert {
    display: flex;
    border: 1px solid var(--color-lightgrey);
    border-radius: 5px
}

.get-notified-container {
    margin: 15px auto;
    padding: 15px 10px 15px 10px;
    width: 100%;
    background: var(--gray-100);
    border: 1px solid var(--gray-200);
    border-radius: .25rem
}

.get-notified-container .notified-header {
    font-size: 1.3rem;
    color: var(--gray-900);
    font-weight: 600;
    text-align: left;
    margin-left: 15px
}

.get-notified-container .user-info {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: 10px 15px
}

.get-notified-container .user-info .name {
    margin: 12px 16px 12px 0
}

.get-notified-container .user-info .email {
    margin: 12px 16px 12px 0
}

.user-confirmation-heading {
    font-size: 1.2rem;
    color: var(--color-grey);
    font-weight: 600;
    margin-left: 10px
}

.user-confirmation-text {
    font-size: 1rem;
    margin-left: 10px
}

.thanks {
    margin: 10px
}

@media only screen and (max-width:1100px) {
    .user-info {
        flex-direction: column !important
    }
    .user-info .name {
        width: 100%;
        margin: 0 !important;
        margin-bottom: 8px !important
    }
    .user-info .name input {
        width: 100%
    }
    .user-info .email {
        width: 100%;
        margin: 0 !important;
        margin-bottom: 8px !important
    }
    .user-info .email input {
        width: 100%
    }
}

.job-skills-container {
    display: flex;
    flex-direction: column;
    margin: 10px
}

.job-skills-container div div div {
    box-shadow: 0 2px 5px 0 rgba(60, 66, 87, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.12);
    background: #fff;
    border: 1px solid #e2e8f0;
    padding: 5px;
    border-radius: 3px;
    margin: 8px;
    font-size: 15px;
    font-weight: 500;
    padding: 8px 12px;
    border-radius: 8px
}

.job-skills-container a {
    color: var(--color-grey)
}

.job-skills-container a:hover {
    color: var(--color-blue)
}

.listing-container {
    padding: 12px 0 48px 0;
    background-color: #fff
}

.listing-container .listing-container-inner {
    max-width: 1400px;
    margin: auto;
    padding: 0 20px
}

.listing-container .listing-flex-container {
    display: flex
}

.listing-container .content-header {
    display: flex;
    align-items: center;
    padding-bottom: 12px
}

@media screen and (max-width:480px) {
    .listing-container .content-header {
        flex-direction: column;
        align-items: flex-start;
        gap: .5rem
    }
    .listing-container .content-header .sort-container {
        margin: 0;
        width: 100%
    }
    .listing-container .content-header .sort-container select {
        width: 100%
    }
}

.listing-container .content-header h1 {
    text-align: left;
    font-weight: 800;
    font-size: 1.5rem;
    margin: 0
}

.listing-container .content {
    text-align: left;
    width: 100%;
    display: flex;
    justify-content: center
}

.listing-container .card-container {
    width: 100%;
    padding: 0 20px 48px 20px;
    max-width: 1200px;
    display: inline-block;
    text-align: left
}

.listing-container .listing-sidebar {
    padding: 0 20px 50px 20px
}

.listing-container .listing-sidebar-create-job-alert {
    background-color: var(--gray-100);
    padding: 3rem 2rem;
    max-width: 500px
}

.listing-container .listing-sidebar-create-job-alert .title {
    margin: 0;
    margin-bottom: 4px
}

.listing-container .listing-sidebar-create-job-alert .subtitle {
    font-size: 1rem;
    margin: 0;
    margin-bottom: 8px;
    color: var(--color-text)
}

.faq-content {
    width: 100%;
    max-width: 920px;
    display: inline-block;
    text-align: left;
    margin: 0 20px
}

.faq-content .faq {
    background: #fff;
    width: 100%;
    padding: 24px 20px 50px 20px;
    max-width: 920px;
    display: inline-block;
    text-align: left
}

.faq-content .question-container {
    margin-top: 24px
}

.faq-content .question {
    color: var(--color-black);
    margin: 0;
    font-size: 1.3rem;
    font-weight: 600
}

.faq-content .answer {
    color: var(--color-grey);
    margin: 0;
    font-size: 1rem;
    line-height: 1.7
}

.faq-content .title {
    margin-bottom: 4px !important
}

.faq-content .subtitle {
    margin-top: 4px !important;
    color: var(--color-grey)
}

.faq-content h2 {
    font-size: 1rem
}

.mobile-filter {
    display: none
}

.newsletter-subscription-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99999999;
    background: #7b0204;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 30px;
    transition: top 500ms ease-out 0s;
    flex-direction: column
}

.newsletter-subscription-bar.hidden {
    top: -250px !important
}

.newsletter-subscription-bar .text {
    color: #fff;
    font-size: 1.2rem;
    margin-bottom: 10px;
    font-weight: 600
}

.newsletter-subscription-bar .input-container {
    display: flex
}

.newsletter-subscription-bar .newsletter-cancel {
    position: absolute;
    right: 20px;
    cursor: pointer
}

.newsletter-subscription-bar .newsletter-box {
    border-radius: 5px;
    margin-right: 10px;
    padding: 10px 15px;
    background-color: #fff
}

.newsletter-subscription-bar .newsletter-btn {
    border-radius: 5px;
    border: 2px solid #fff;
    color: #fff;
    padding: 10px 15px;
    background-color: transparent;
    font-size: .8rem;
    text-transform: uppercase;
    font-weight: 800
}

.newsletter-subscription-bar .newsletter-btn:hover {
    color: #ee301d;
    background-color: #fff
}

.listing-social-proof {
    padding: 1rem 0
}

.listing-social-proof .listing-social-proof-heading {
    text-align: center;
    font-size: 1.2rem
}

.listing-social-proof .listing-social-proof-logo-holder {
    filter: grayscale(1) contrast(0.4) brightness(1);
    flex-wrap: wrap;
    justify-content: space-between
}

.listing-social-proof .listing-social-proof-logo-holder img:hover {
    opacity: .5
}

.listing-social-proof .listing-social-proof-logo-holder img+img {
    margin: 8px
}

@media only screen and (max-width:690px) {
    .listing-social-proof .listing-social-proof-logo-holder .listing-social-proof-logo-holder {
        justify-content: center
    }
    .listing-social-proof .listing-social-proof-logo-holder img {
        height: 14px
    }
}

@media only screen and (max-width:437px) {
    .listing-social-proof .listing-social-proof-logo-holder img:last-child,
    .listing-social-proof .listing-social-proof-logo-holder img:nth-last-child(2) {
        display: none
    }
}

.modal-join-now {
    width: 80%;
    max-width: 500px;
    padding: 20px 30px
}

.modal-join-now .premium-feed-listing-upgrade-pricing-proof {
    text-align: center
}

.modal-join-now .primary-btn {
    margin-top: 20px;
    width: 100%;
    padding: 15px
}

.modal-join-now h2 {
    text-align: center
}

.modal-join-now .item img {
    margin-right: 5px
}

.modal-join-now .item-container {
    width: 350px;
    flex-direction: column;
    margin: auto;
    margin-bottom: 15px
}

.modal-join-now .item {
    margin-bottom: 10px;
    display: inline-flex;
    align-items: center
}

.modal-join-now .close-icon {
    position: absolute;
    right: 10px;
    top: 15px;
    cursor: pointer
}

@media only screen and (max-width:1100px) {
    .listing-container .listing-sidebar {
        padding: 0
    }
    .listing-flex-container {
        display: flex;
        flex-direction: column
    }
    .listing-sidebar .listing-sidebar-create-job-alert {
        max-width: initial
    }
    .listing-container .card-container {
        padding: 0
    }
    .listing-container .content-header h1 {
        font-size: 1.4rem
    }
    .content-title {
        font-size: 1.7rem !important;
        text-align: center;
        margin-top: 0 !important
    }
    .content-subtitle {
        font-size: 1.1rem !important;
        text-align: center;
        margin-top: 0 !important;
        margin-bottom: 16px !important
    }
}

.resume-review-sidebar {
    background-color: var(--gray-100);
    padding: 2rem 2rem;
    margin-top: 20px;
    max-width: 500px
}

.resume-review-sidebar h3 {
    font-size: 1.5rem
}

.resume-review-sidebar h3 b {
    color: var(--amber-600);
    text-decoration: underline
}

.resume-review-sidebar p,
.resume-review-sidebar ul,
.resume-review-sidebar li {
    font-size: 1.2rem
}

.resume-review-sidebar li {
    margin-bottom: 12px;
    display: flex;
    align-items: center
}

.resume-review-sidebar ul {
    padding-left: 0;
    list-style-type: none
}

.resume-review-sidebar .resume-review-sidebar-button-footer {
    font-size: .9rem;
    color: var(--gray-500);
    font-weight: 500;
    text-align: center
}

.resume-review-sidebar svg {
    fill: var(--gray-400)
}

.resume-review-sidebar .button.primary {
    font-size: 1.3rem;
    font-weight: 600
}

.resume-words-sidebar {
    background-color: var(--gray-100);
    max-width: 500px
}

.resume-words-sidebar .power-image {
    width: 100%
}

.resume-words-sidebar .resume-words-sidebar-content {
    padding: 0 2rem 2rem 2rem
}

.resume-words-sidebar h3 {
    font-size: 1.5rem
}

.resume-words-sidebar h3 b {
    color: var(--amber-600);
    text-decoration: underline
}

.resume-words-sidebar p {
    font-size: 1.2rem
}

.resume-words-sidebar .resume-review-sidebar-button-footer {
    font-size: .9rem;
    color: var(--gray-500);
    font-weight: 500;
    text-align: center
}

.resume-words-sidebar .button.primary {
    font-size: 1.3rem;
    font-weight: 600;
    margin-top: 10px
}

.hero_container {
    padding-bottom: 2rem;
    place-items: center;
    width: 100%;
    min-height: min-content;
    display: grid;
    margin-top: 0;
    margin-left: auto;
    margin-right: auto;
    position: relative
}

.hero_container .hero_bg_mask {
    z-index: -10;
    isolation: isolate;
    inset: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    isolation: isolate
}

.hero_container .hero_bg_mask img {
    object-fit: cover;
    max-width: 100%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    z-index: -10;
    height: 100%;
    width: 100%;
    object-fit: cover
}

.hero_container .hero_bg_mask::after {
    content: "";
    background-image: linear-gradient(0, transparent, transparent), linear-gradient(90deg, rgba(0, 0, 0, 0.7), transparent), linear-gradient(180deg, transparent, #000);
    inset: 0;
    position: absolute
}

.hero_container .header {
    width: 100%
}

.hero_container .header a.header-button {
    color: var(--gray-50) !important;
    opacity: .8
}

.hero_container .header a.header-button:hover {
    opacity: 1
}

.hero_container .hero_content_wrap {
    padding: 0 1rem;
    max-width: min(800px, 100%)
}

.listing_hero h1 {
    font-size: var(--font-size-xxx-large);
    color: var(--gray-100);
    opacity: 1;
    text-align: center;
    margin: 0;
    padding-bottom: 1rem
}

.listing_hero h2.listing_hero_subtitle {
    font-size: var(--font-size-large);
    color: var(--gray-200);
    opacity: 1;
    text-align: center;
    font-weight: 400;
    text-wrap: balance;
    margin: 0;
    padding-bottom: 1rem
}

.listing_hero h2.listing-social-proof-heading {
    color: var(--gray-200);
    font-weight: 400;
    opacity: .7
}

.listing_hero .premium-feed-listing-upgrade-pricing-proof {
    text-align: center;
    color: white
}

.listing_hero .listing-social-proof-logo-holder {
    filter: grayscale(1) contrast(0) brightness(1) !important
}

.listing_hero .listing-social-proof-logo-holder img:hover {
    opacity: .8
}

@media only screen and (max-width:1100px) {
    .listing_hero .toggle-menu span {
        background-color: var(--gray-50) !important
    }
}

.applied-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px
}

.applied-filters .applied-filter-item {
    padding: 12px 0;
    border-radius: 24px;
    background-color: var(--gray-100);
    border: 2px dashed var(--gray-200);
    cursor: zoom-out;
    padding: 4px 12px
}

.applied-filters .applied-filter-item .icon svg {
    height: 10px;
    width: 10px;
    fill: var(--gray-400)
}

.listing-filters hr {
    border: 0;
    border-bottom: 1px solid var(--gray-300)
}

.listing-filters .filter-popover {
    position: fixed;
    box-shadow: 0 2px 8px 5px rgba(86, 81, 81, 0.05);
    background: white;
    z-index: 3;
    animation: pop-open .1s both;
    border: 1px solid var(--gray-200);
    border-radius: 6px;
    padding: 8px 0;
    overflow: scroll
}

.listing-filters .location-filter,
.listing-filters .benefits-filter {
    max-height: 320px
}

.listing-filters .location-filter .location-item,
.listing-filters .location-filter div[data-benefit],
.listing-filters .benefits-filter .location-item,
.listing-filters .benefits-filter div[data-benefit] {
    padding: 4px 12px;
    cursor: pointer
}

.listing-filters .location-filter .location-item:hover,
.listing-filters .location-filter div[data-benefit]:hover,
.listing-filters .benefits-filter .location-item:hover,
.listing-filters .benefits-filter div[data-benefit]:hover {
    background: var(--gray-200)
}

.listing-filters .location-filter h3,
.listing-filters .benefits-filter h3 {
    padding: 0 12px
}

.listing-filters .location-filter .location-filter-input-box,
.listing-filters .benefits-filter .location-filter-input-box {
    padding: 0 12px;
    margin-bottom: 6px
}

.listing-filters .location-filter .location-filter-input-box input,
.listing-filters .benefits-filter .location-filter-input-box input {
    height: 32px;
    width: 100%
}

.listing-filters .location-filter .location-item-heading,
.listing-filters .benefits-filter .location-item-heading {
    font-size: .8rem;
    padding: 0 12px;
    margin: 0 0 4px;
    color: var(--gray-500)
}

.listing-filters .advanced-search-filter {
    padding: 16px 12px
}

.listing-filters .advanced-search-filter input[type=text],
.listing-filters .advanced-search-filter button {
    width: 100%
}

.listing-filters .filter-button {
    font-weight: 700
}

.listing-filters .filter-button.category {
    max-width: 120px;
    text-overflow: ellipsis
}

.popular-searches {
    margin-top: 0;
    min-width: 175px;
    max-width: 175px
}

.popular-searches h2 {
    font-size: var(--font-size-x-small);
    font-weight: 600;
    letter-spacing: .4px;
    color: var(--gray-400)
}

.popular-searches a {
    font-size: var(--font-size-medium);
    color: var(--gray-700);
    font-weight: 500;
    text-decoration: none;
    display: block;
    margin-bottom: 8px;
    padding: 4px 8px;
    border-radius: 24px;
    border: 1px solid var(--gray-200);
    background: var(--gray-50)
}

.popular-searches a:hover {
    background: var(--gray-200);
    border: 1px solid var(--gray-600)
}

@media only screen and (max-width:640px) {
    .popular-searches {
        display: none !important
    }
}

.role-links {
    display: initial !important
}

@media only screen and (min-width:640px) {
    .role-links {
        display: none !important
    }
}

@media only screen and (max-width:1100px) {
    .mobile-filter {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: #fff;
        font-size: 1rem;
        font-weight: 400;
        padding: 15px 20px;
        background-color: #c71b1b;
        box-shadow: 0 -4px 8px 0 rgba(33, 33, 33, 0.12);
        color: var(--color-white);
        cursor: pointer;
        z-index: 10
    }
    .card {
        padding: 10px 10px 15px 10px
    }
    .card .info-container {
        padding: 0 15px;
        margin: 0
    }
    .card .apply-container {
        display: none
    }
    .card .job-meta {
        margin-top: 10px;
        align-items: flex-start;
        font-size: .9rem
    }
    .card .job-meta .meta-holder {
        margin-bottom: 10px
    }
    .card .mobile-card-actions {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 5px
    }
    .card .mobile-card-actions .apply-link {
        padding: 5px 40px;
        text-align: center;
        margin: 5px 0;
        cursor: pointer
    }
    .card .mobile-card-actions .apply-link:hover {
        color: var(--color-white);
        background-color: var(--color-blue)
    }
    .card .card-actions {
        display: none
    }
    .toggle-alert {
        display: none !important
    }
    .job-button.post-job {
        padding: 5px;
        margin-right: 10px;
        margin: 10px
    }
    .card .tags-container {
        margin-top: 5px
    }
    .card .company-name {
        font-size: 1.1rem
    }
    .company-base-container .pic {
        display: none
    }
    .company-base-container .company-info {
        margin-left: 100px
    }
    .detailed-job-main-container .related-jobs img {
        display: none
    }
    .job-alert-container {
        width: initial
    }
    .job-alert-container {
        width: 80%
    }
    .job-alert-container .alert-pic-container {
        display: none
    }
    .company-other-jobs-container {
        display: none
    }
    .company-base-container {
        margin: 10px auto
    }
    .job-background-container .logo {
        height: 25px;
        margin: 30px 10px
    }
    .filter-container {
        display: none;
        position: fixed;
        padding: 0 35px;
        margin: 0;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        max-width: initial;
        z-index: 12;
        overflow: scroll
    }
    .filter-container .site-info {
        display: none
    }
    .post-job-page .post-job-wrapper {
        width: 95% !important;
        min-width: initial !important;
        margin: auto !important;
        flex-direction: column
    }
    .post-job-page .post-job-wrapper .checkout-right {
        margin-left: initial;
        margin-top: 15px
    }
    .post-job-page .post-job-wrapper .preview {
        margin-top: 15px
    }
    .post-job-page .post-job-footer {
        height: 100px
    }
    .post-job-page .post-job-footer.showin {
        transform: translateY(100px)
    }
    .post-job-page .preview-container .card {
        min-width: initial !important;
        width: 90% !important;
        margin: auto !important
    }
    .post-job-page .pricing_modal {
        flex-direction: column-reverse;
        width: 95% !important;
        min-width: initial !important;
        margin: 25px auto !important
    }
    .post-job-page .pricing_modal .tier {
        width: 100% !important;
        margin: 5px !important;
        min-height: 375px
    }
    .post-job-page .faq-container {
        width: 90% !important;
        margin: 0 auto !important;
        margin-bottom: 50px !important
    }
    .post-job-page .posting-job-container .trix-button-row {
        flex-direction: column;
        align-items: center
    }
    .post-job-page .posting-job-container .heading h3 {
        max-width: 300px;
        text-align: center
    }
    .post-job-page .posting-job-container .post-footer {
        min-width: initial !important;
        width: 95% !important;
        margin: 25px auto !important
    }
    .post-job-page .posting-job-container .basic-details {
        width: 95% !important;
        min-width: initial !important;
        margin: 25px auto !important
    }
    .post-job-page .posting-job-container .basic-details .type-checkbox {
        margin-right: 20px !important
    }
    .post-job-page .posting-job-container .basic-details .compensation-block .salary-container {
        flex-direction: column
    }
    .post-job-page .posting-job-container .basic-details .compensation-block .salary-container select,
    .post-job-page .posting-job-container .basic-details .compensation-block .salary-container input {
        margin: 5px !important
    }
    .post-job-page .posting-job-container .basic-details .block .link-container {
        flex-direction: column;
        margin: 5px !important
    }
    .not-found-page .not-found-img {
        height: 200px
    }
    .main-page-container .oops {
        font-size: 5.9rem
    }
    .main-page-container .title {
        font-size: 1rem
    }
    .main-page-container .subtitle {
        font-size: .9rem
    }
    .footer .links-container {
        text-align: center;
        flex-direction: column
    }
    .footer .footer-name {
        padding: 0
    }
    .footer .footer-content {
        flex-direction: column
    }
    .footer .footer-content .website-intro {
        margin: auto;
        width: 100px
    }
    .footer .footer-content .website-intro .moto {
        display: none
    }
    .footer .footer-content .social-media-info {
        width: 100%;
        justify-content: center;
        align-items: center
    }
    .footer .footer-content .company-info {
        width: 100%;
        justify-content: center;
        align-items: center
    }
    .footer .footer-content .legal-info {
        width: 100%;
        justify-content: center;
        align-items: center
    }
    .newsletter-page-container .newsletter-page-heading {
        margin-bottom: 0 !important;
        width: 90% !important
    }
    .newsletter-page-container .newsletter-page-heading .main-heading h1 {
        margin: 0;
        font-size: 2rem !important;
        font-weight: 800
    }
    .newsletter-page-container .newsletter-image-container {
        display: none !important
    }
    .newsletter-page-container .newsletter-page-content {
        flex-direction: column-reverse;
        margin-top: 5px !important;
        margin-bottom: 5px !important
    }
    .newsletter-page-container .newsletter-page-content .newsletter-details-container {
        margin: 10px !important
    }
    .newsletter-page-container .newsletter-page-content .newsletter-details-container .info-container {
        margin-right: auto !important;
        margin: auto !important
    }
    .newsletter-page-container .newsletter-page-content .newsletter-details-container .input-container .selection-container {
        flex-direction: column;
        height: 80px
    }
    .newsletter-page-container .newsletter-page-content .newsletter-details-container .input-container .selection-container .select-duration {
        max-width: 100%;
        flex: 1;
        margin: 0;
        margin-bottom: 10px
    }
    .newsletter-page-container .newsletter-page-content .newsletter-details-container .input-container .selection-container .category {
        flex: 1;
        margin: 0;
        max-width: 100%
    }
    .newsletter-subscription-bar {
        flex-direction: column
    }
    .newsletter-subscription-bar .input-container {
        flex-direction: column
    }
    .newsletter-subscription-bar .text {
        margin-bottom: 10px;
        font-size: 1.2rem
    }
    .newsletter-subscription-bar .newsletter-box {
        padding: 10px 20px;
        margin-bottom: 5px;
        width: 100%
    }
    .header .menu {
        display: none
    }
    .header .navigation {
        display: initial
    }
    .header .navigation .toggle-menu {
        display: block;
        position: absolute;
        top: 24px;
        right: 20px;
        z-index: 1;
        -webkit-user-select: none;
        user-select: none
    }
    .header .navigation .toggle-menu span {
        display: block;
        width: 20px;
        height: 2px;
        margin-bottom: 5px;
        position: relative;
        background: var(--gray-950);
        border-radius: 4px;
        z-index: 1;
        transform-origin: 4px 0;
        transition: transform .5s cubic-bezier(0.77, 0.2, 0.05, 1), background .5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity .55s ease
    }
    .header .navigation .toggle-menu span.inverted {
        background: var(--gray-950)
    }
    .landing-page-container {
        background-image: none
    }
    .landing-page-container .content-container .landing_page {
        flex-direction: column-reverse;
        padding: 24px 0
    }
    .landing-page-container .content-container .landing_page .image {
        display: none
    }
    .landing-page-container .content-container .landing_page .illustration-container {
        display: flex;
        justify-content: center
    }
    .landing-page-container .content-container .landing_page .illustration-container .illustration-image {
        height: 250px
    }
    .companies-container .card-container {
        box-shadow: none !important
    }
    .blog-post .date-blog .blog-image {
        margin: 20px
    }
    .blog-main-content .blog-desc {
        font-size: 1rem
    }
    .manage-container .manage-content-container .manage-wrapper .manage-pic {
        display: none !important
    }
    .resources-container {
        margin: 10px !important
    }
    .resources-container .tab-container {
        flex-direction: column
    }
    .resources-container .tab-container .tabs {
        display: flex;
        position: initial !important;
        height: initial !important;
        box-shadow: none !important;
        flex-wrap: wrap;
        justify-content: center
    }
    .resources-container .tab-container .tabs .tab-option {
        border-right: 0;
        border-bottom: 5px solid transparent
    }
    .resources-container .tab-container .tabs .tab-option.selected-tab {
        border-bottom: 5px solid var(--color-blue);
        border-right: 0
    }
    .resources-container .option-div {
        margin: 10px
    }
    .resources-container .option-div .column {
        flex-direction: column
    }
}

@media only screen and (max-width:624px) {
    .advice-index .advice-section-collection {
        grid-template-columns: repeat(1, 1fr);
        margin: 5px
    }
    .testimonials {
        display: none
    }
    .buttons-container .homepage-button {
        margin: 5px
    }
    .category .category-view-more {
        margin: initial
    }
    .category .category-view-more .view-more {
        width: 100%
    }
    .buttons-container {
        flex-direction: column
    }
    .template-container .template_page {
        padding: 5px !important
    }
    .template-container .template_page .content {
        margin-right: 5px !important
    }
    .template-container .template_page .image {
        display: none
    }
    .template-container .tips-container {
        padding: 5px !important
    }
    .listing-container .faq-content {
        width: 100%
    }
    .listing-container .main-content {
        flex-direction: column
    }
    .listing-container .main-content .content {
        margin: initial;
        padding-left: 0;
        width: 100%
    }
    .sponsor-container .main-heading .description {
        width: initial !important;
        margin: 10px
    }
    .sponsor-container .benefits .benefit-wrapper .item-group {
        flex-direction: column
    }
    .sponsor-container .benefits .benefit-wrapper .item {
        margin: 10px !important
    }
    .sponsor-container .audience-container .details-container {
        padding: 10px !important
    }
    .sponsor-container .audience-container .ad-container {
        padding: 10px !important
    }
    .sponsor-container .faq-container {
        padding: 10px !important;
        text-align: justify
    }
    .landing-page-container .content-container .landing_page .image {
        display: none
    }
    .landing-page-container .content-container .landing_page .avatar-container {
        display: none
    }
    .company-base-container .pic {
        display: none
    }
    .company-base-container .company-info {
        margin-left: 100px
    }
    .detailed-job-main-container .related-jobs img {
        display: none
    }
    .job-alert-container {
        width: initial
    }
    .job-alert-container .alert-pic-container {
        display: none
    }
    .card .company-name-mobile {
        display: flex;
        color: var(--color-grey);
        text-decoration: none;
        margin-top: 5px
    }
    .card .company-name {
        display: none
    }
    .post-job-page .posting-job-container {
        margin: 0 10px
    }
    .post-job-page .posting-job-container .heading h3 {
        max-width: initial
    }
    .post-job-page .posting-job-container .hiring-hard-section p {
        width: 100% !important
    }
    .post-job-page .posting-job-container .testimonials .image {
        display: none
    }
    .post-job-page .posting-job-container .testimonials .mobileImage {
        display: initial !important
    }
}

@media only screen and (max-width:500px) {
    .advice-index .advice-section-collection {
        grid-template-columns: repeat(1, 1fr);
        margin: 5px
    }
    .template-container .template_page .content .image {
        display: none
    }
    .header .logo {
        margin-left: 20px
    }
    .post-job-page .confirm-payment-dialog {
        width: 90% !important
    }
    .landing-page-container .content-container .landing_page .search-container {
        flex-direction: column
    }
    .landing-page-container .content-container .landing_page .search-container .search-filters .white-btn {
        width: initial;
        margin: 0
    }
    .landing-page-container .content-container .landing_page .search-container .category {
        padding: 15px 20px
    }
    .landing-page-container .content-container .landing_page .content {
        margin: 10px 20px
    }
    .landing-page-container .content-container .landing_page .avatar-container {
        display: none
    }
    .company-base-container .pic {
        display: none
    }
    .company-base-container .company-info {
        margin-left: 100px
    }
    .listing-container .faq-content {
        width: 100%
    }
    .detailed-job-main-container .related-jobs img {
        display: none
    }
    .job-alert-container {
        width: initial
    }
    .job-alert-container .alert-pic-container {
        display: none
    }
    .card .company-name-mobile {
        color: var(--color-grey);
        text-decoration: none;
        margin-top: 5px
    }
    .card .company-name {
        display: none
    }
    .post-job-page .posting-job-container {
        margin: 0 10px
    }
    .post-job-page .posting-job-container .heading h3 {
        max-width: initial
    }
    .post-job-page .posting-job-container .hiring-hard-section p {
        width: 100% !important
    }
    .post-job-page .posting-job-container .testimonials .image {
        display: none
    }
    .post-job-page .posting-job-container .testimonials .mobileImage {
        display: initial !important
    }
}

.newsletter-page-container {
    display: flex;
    flex-direction: column;
    margin: 20px auto;
    margin-bottom: 30px;
    color: var(--color-black);
    max-width: 1024px
}

.newsletter-page-container .hero-container {
    display: flex;
    justify-content: space-around
}

.newsletter-page-container .newsletter-page-heading {
    margin-top: 35px;
    margin-bottom: 35px;
    max-width: 450px
}

.newsletter-page-container .newsletter-page-heading .main-heading h1 {
    margin: 0;
    font-size: 2.5rem;
    font-weight: 800
}

.newsletter-page-container .newsletter-page-heading .main-heading .first {
    color: #437ea4
}

.newsletter-page-container .newsletter-page-heading .main-heading .second {
    color: #0d538c
}

.newsletter-page-container .newsletter-page-heading .sub-heading {
    font-weight: 400;
    font-size: 1.2rem;
    margin-top: 30px;
    margin-bottom: 35px;
    color: var(--color-grey)
}

.newsletter-page-container .newsletter-page-heading .sub-heading strong {
    color: var(--color-black)
}

.newsletter-page-container .newsletter-page-content .newsletter-details-container {
    display: flex;
    flex-direction: column;
    margin: auto;
    margin-right: 20px
}

.newsletter-page-container .newsletter-page-content .newsletter-details-container .input-container {
    display: flex;
    flex-direction: column;
    margin-top: 5px;
    max-width: 400px
}

.newsletter-page-container .newsletter-page-content .newsletter-details-container .input-container .unsubscribe-text {
    font-size: .7rem;
    margin-top: 10px;
    color: var(--color-grey);
    text-align: center
}

.newsletter-page-container .newsletter-page-content .newsletter-details-container .input-container .input-box {
    width: 100%;
    padding: 8px;
    margin-bottom: 10px;
    border-radius: 3px;
    font-size: 1rem;
    box-shadow: none;
    border: 1px solid var(--color-lightgrey);
    background: var(--color-lightestgrey)
}

.newsletter-page-container .newsletter-page-content .newsletter-details-container .input-container .input-box::placeholder {
    font-size: 1rem
}

.newsletter-page-container .newsletter-page-content .newsletter-details-container .input-container .selection-container {
    margin-bottom: 10px
}

.newsletter-page-container .newsletter-page-content .newsletter-details-container .input-container .select-duration {
    background: var(--color-lightestgrey);
    border: 1px solid var(--color-lightgrey);
    height: 40px;
    border-radius: 0;
    font-size: 1rem;
    color: var(--color-grey);
    flex: 3;
    margin-right: 5px
}

.newsletter-page-container .newsletter-page-content .newsletter-details-container .input-container .category {
    margin-left: 5px;
    flex: 5;
    border: 1px solid var(--color-lightgrey);
    background: var(--color-lightestgrey);
    min-width: 175px;
    max-width: 200px;
    height: 40px;
    color: var(--color-grey);
    border-radius: 0;
    font-size: 1rem
}

.newsletter-page-container .newsletter-page-content .newsletter-details-container .input-container .count-button {
    justify-content: center;
    display: flex;
    margin: 0;
    padding: 8px 20px
}

.newsletter-page-container .newsletter-page-content .thanks-container {
    margin-top: 5px;
    width: 100% !important
}

.newsletter-page-container .newsletter-page-content .newsletter-image-container {
    margin-left: 20px
}

.newsletter-page-container .newsletter-page-content .newsletter-image-container .newsletter-pic {
    margin: 20px;
    height: 350px
}

.pagination-container {
    margin-top: 4rem;
    display: flex;
    justify-content: center;
    padding: 2px
}

.pagination-container .pagination {
    border-radius: .5rem;
    background: var(--gray-100);
    border: .5px solid var(--gray-200);
    display: flex;
    gap: 1.2rem;
    padding: .25rem .75rem;
    box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.1), 0 1px 0 0 rgba(25, 28, 33, 0.02), 0 0 0 1px rgba(25, 28, 33, 0.08)
}

.pagination-container .pagination-item {
    font-size: var(--font-size-large);
    text-decoration: none;
    color: var(--gray-600) !important
}

.pagination-container .pagination-item.current {
    font-weight: 700;
    text-decoration: underline
}

.post-job-page .flex-direction-column {
    display: flex;
    flex-direction: column
}

.post-job-page .postJobTitle {
    max-width: 800px;
    font-weight: 900;
    letter-spacing: -2px;
    margin: 0 auto;
    text-align: center;
    font-size: var(--font-size-xxx-large);
    margin-top: 2rem
}

.post-job-page .postJobSubtitle {
    max-width: 800px;
    font-weight: 700;
    letter-spacing: -1px;
    margin: 0 auto;
    text-align: center;
    font-size: var(--font-size-x-large);
    color: var(--gray-600)
}

.post-job-page .posting-job-container {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 60px)
}

.post-job-page .posting-job-container .listing-headline {
    text-align: center
}

.post-job-page .posting-job-container .heading {
    margin: auto;
    text-align: center
}

.post-job-page .posting-job-container .heading h1 {
    font-weight: 800;
    margin: 4rem auto 0 auto;
    font-size: 3rem;
    text-align: center
}

.post-job-page .posting-job-container .heading h2 {
    margin-top: 20px;
    color: var(--gray-600);
    font-weight: 500;
    font-size: 1.5rem;
    margin: auto;
    max-width: 30ch;
    margin-bottom: 1.5rem
}

.post-job-page .posting-job-container .heading .hero-button {
    margin-top: 24px;
    font-size: var(--font-size-large);
    font-weight: 600;
    padding: 16px 32px
}

.post-job-page .posting-job-container .heading .cta-subtitle {
    color: var(--gray-600);
    font-weight: 500
}

.post-job-page .posting-job-container .post-job-social-proof {
    filter: grayscale(1) contrast(0.4) brightness(1);
    flex-wrap: wrap;
    justify-content: space-between;
    max-width: var(--max-width);
    margin: auto;
    text-align: center;
    margin-top: 16px
}

.post-job-page .posting-job-container .post-job-social-proof h3 {
    color: var(--gray-700)
}

.post-job-page .posting-job-container .post-job-social-proof img:hover {
    opacity: .5
}

.post-job-page .posting-job-container .post-job-social-proof img+img {
    margin: 8px
}

@media only screen and (max-width:690px) {
    .post-job-page .posting-job-container .post-job-social-proof .listing-social-proof-logo-holder {
        justify-content: center
    }
    .post-job-page .posting-job-container .post-job-social-proof img {
        height: 14px
    }
}

@media only screen and (max-width:437px) {
    .post-job-page .posting-job-container .post-job-social-proof img:last-child,
    .post-job-page .posting-job-container .post-job-social-proof img:nth-last-child(2) {
        display: none
    }
}

.post-job-page .posting-job-container .benefits {
    width: 100%;
    max-width: 1024px;
    margin: auto;
    position: relative;
    z-index: 2;
    margin-top: 75px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    border: 1px solid var(--gray-300);
    padding: 40px 20px;
    border-radius: 12px
}

.post-job-page .posting-job-container .benefits h2.benefits-title {
    font-size: var(--font-size-xx-large);
    font-weight: 900;
    letter-spacing: -1.5px;
    text-align: center;
    margin-top: 0;
    margin-bottom: 1rem
}

.post-job-page .posting-job-container .benefits h3.benefits-subtitle {
    font-size: var(--font-size-x-large);
    font-weight: 600;
    letter-spacing: -1px;
    text-align: center;
    max-width: 34ch;
    color: var(--gray-500);
    margin: auto;
    margin-bottom: 2rem;
    margin-top: 0
}

.post-job-page .posting-job-container .benefits .items-list .item {
    background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b);
    background-size: 200% 200%;
    color: var(--gray-50);
    padding: 2px 8px;
    font-size: var(--font-size-large);
    border-radius: 8px;
    font-weight: 500
}

.post-job-page .posting-job-container .benefits .items-list .item .icon>svg {
    height: var(--font-size-large);
    width: var(--font-size-large)
}

.post-job-page .posting-job-container .benefits .items-list .item:last-child {
    margin-bottom: .5rem
}

.post-job-page .posting-job-container .benefits .pricing-text {
    font-size: var(--font-size-large);
    font-weight: 500;
    color: var(--gray-600);
    max-width: 50ch;
    margin: auto;
    margin-bottom: 1rem
}

.post-job-page .posting-job-container .benefits .pricing-text a {
    color: var(--gray-600);
    text-decoration: underline;
    font-weight: 600
}

.post-job-page .posting-job-container .benefits .pricing-text a:hover {
    color: var(--gray-800)
}

.post-job-page .posting-job-container .post-job-faq {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    width: 100%;
    max-width: 1024px;
    margin: auto;
    margin-top: 100px;
    margin-bottom: 100px
}

@media screen and (max-width:768px) {
    .post-job-page .posting-job-container .post-job-faq {
        flex-direction: column
    }
}

.post-job-page .posting-job-container .post-job-faq-side {
    width: min(100%, 50em)
}

.post-job-page .posting-job-container .post-job-faq-side h2 {
    font-size: var(--font-size-xx-large);
    font-weight: 800;
    margin-bottom: 1rem
}

.post-job-page .posting-job-container .post-job-faq-side h3 {
    font-size: var(--font-size-large);
    font-weight: 500;
    color: var(--gray-500)
}

.post-job-page .posting-job-container .post-job-faq-main {
    width: 100%;
    font-size: var(--font-size-large)
}

.post-job-page .posting-job-container .post-job-faq-main details {
    border: 1px solid var(--gray-300);
    border-radius: .25rem;
    padding: 1rem;
    margin-bottom: .5rem
}

.post-job-page .posting-job-container .post-job-faq-main summary {
    font-weight: 600;
    cursor: pointer;
    list-style: none
}

.post-job-page .posting-job-container .post-job-faq-main p {
    color: var(--gray-700);
    margin-top: .5rem;
    margin-bottom: 0
}

.post-job-page .posting-job-container .post-job-faq-main details[open] summary {
    color: var(--red)
}

.post-job-page .posting-job-container .basic-details {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    max-width: 800px;
    width: 100%;
    margin: auto;
    margin: 24px auto;
    padding: 20px 32px;
    border-radius: 6px;
    border: 1px solid var(--gray-300)
}

.post-job-page .posting-job-container .basic-details .heading {
    border-bottom: 1px solid var(--gray-300);
    margin: 0
}

.post-job-page .posting-job-container .basic-details .heading h2 {
    margin: 8px 0;
    color: var(--gray-900);
    max-width: none
}

.post-job-page .posting-job-container .basic-details .block {
    margin: 24px 0
}

.post-job-page .posting-job-container .basic-details label.label {
    font-size: 1rem;
    margin-bottom: 10px;
    color: var(--gray-900);
    font-weight: 500
}

.post-job-page .posting-job-container .basic-details label.label.ok {
    background: url("/assets/icons/ok.svg") no-repeat;
    padding-left: 25px
}

.post-job-page .posting-job-container .basic-details input.input {
    border: 1px solid var(--color-lightgrey);
    padding: 15px 20px;
    display: block;
    width: 100%;
    border-radius: 5px;
    background: #fafafa;
    line-height: 1.3;
    box-shadow: 0 0 5px 0 rgba(238, 238, 238, 0.3)
}

.post-job-page .posting-job-container .basic-details input.input:active,
.post-job-page .posting-job-container .basic-details input.input:focus {
    border: 1px solid #d5d5d5;
    background: #fbfbfb
}

.post-job-page .posting-job-container .basic-details .msR {
    margin-right: 15px
}

.post-job-page .posting-job-container .basic-details select.select {
    border: 1px solid var(--color-lightgrey);
    padding: 15px 20px;
    display: block;
    width: 100%;
    border-radius: 5px;
    background: #fafafa;
    color: var(--color-grey);
    font-size: 1rem;
    line-height: 1.3;
    box-shadow: 0 0 5px 0 rgba(238, 238, 238, 0.3);
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none
}

.post-job-page .posting-job-container .basic-details .type-checkbox-container {
    margin: 5px 0 30px 0
}

.post-job-page .posting-job-container .basic-details .type-checkbox {
    margin-right: 50px
}

.post-job-page .posting-job-container .basic-details .type-checkbox label {
    color: var(--color-grey);
    font-size: 1rem
}

.post-job-page .posting-job-container .basic-details .compensation-block select {
    flex: 2;
    text-align: center
}

.post-job-page .posting-job-container .basic-details .compensation-block input {
    flex: 5
}

.post-job-page .posting-job-container .basic-details .compensation-block p {
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 10px;
    color: var(--color-grey)
}

.post-job-page .posting-job-container .basic-details .compensation-block .js-compensation-preview {
    color: var(--color-grey);
    margin-bottom: 20px
}

.post-job-page .posting-job-container .basic-details .apply-block .or {
    margin-left: 10px;
    margin-right: 10px;
    color: var(--color-grey)
}

.post-job-page .posting-job-container .basic-details .company-logo-img {
    margin-left: 25px;
    text-align: center
}

.post-job-page .posting-job-container .basic-details .company-logo-img span {
    text-align: center;
    font-size: 10px;
    color: var(--color-grey)
}

.post-job-page .posting-job-container .basic-details .select2-selection.select2-selection--multiple,
.post-job-page .posting-job-container .basic-details .select2-selection.select2-selection--single {
    border: 1px solid var(--color-lightgrey) !important;
    border-radius: 5px !important;
    background: #fafafa;
    line-height: 1.3;
    box-shadow: 0 0 5px 0 rgba(238, 238, 238, 0.3)
}

.post-job-page .posting-job-container .basic-details .select2-selection__rendered {
    width: 95%
}

.post-job-page .posting-job-container .basic-details .select2-search.select2-search--inline {
    font-size: 1rem !important;
    background: #fafafa !important;
    padding: 10px 15px
}

.post-job-page .posting-job-container .basic-details .select2-selection__choice {
    padding: 10px 15px;
    font-size: 1rem;
    position: relative;
    top: 2px
}

.post-job-page .posting-job-container .basic-details .select2-dropdown.select2-dropdown--below {
    position: relative !important;
    top: 6px !important
}

.post-job-page .posting-job-container .basic-details .select2-container--default {
    width: 100% !important
}

.post-job-page .posting-job-container .basic-details .select2-container--default .select2-selection.select2-selection--single {
    height: 51px !important
}

.post-job-page .posting-job-container .basic-details .select2-container--default .select2-selection.select2-selection--single .select2-selection__rendered {
    line-height: 51px !important;
    padding: 0 20px
}

.post-job-page .posting-job-container .basic-details .select2-container--default .select2-selection.select2-selection--single .select2-selection__placeholder {
    color: var(--color-grey)
}

.post-job-page .posting-job-container .basic-details .select2-container--default .select2-selection.select2-selection--single .select2-selection__arrow {
    height: 51px !important
}

.post-job-page .posting-job-container .basic-details .select2-container--default .select2-selection--single {
    height: 40px !important
}

.post-job-page .posting-job-container .basic-details .select2-container--default .select2-selection__arrow {
    height: 40px !important
}

.post-job-page .posting-job-container .basic-details .select2-container--default .select2-selection--single {
    border: 1px solid var(--color-lightgrey)
}

.post-job-page .posting-job-container .basic-details .select2-container--default .select2-search--dropdown .select2-search__field {
    font-size: 1rem !important;
    border: 1px solid var(--color-lightgrey);
    padding: 5px 10px;
    color: var(--color-grey)
}

.post-job-page .posting-job-container .basic-details .select2-results__options {
    border: 2px solid var(--color-blue);
    color: var(--color-blue);
    border-radius: 3px;
    width: 100%;
    padding: 10px 15px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer
}

.post-job-page .posting-job-container .basic-details .select2-results__options:hover {
    border: 2px solid var(--color-blue);
    color: #fff;
    background-color: var(--color-blue)
}

.post-job-page .posting-job-container .price {
    font-size: 1.2rem;
    color: #ff4e63;
    font-weight: 600
}

.post-job-page .posting-job-container .checkout {
    display: flex;
    flex-direction: column;
    margin-left: auto
}

.post-job-page .posting-job-container .checkout .apply-coupon {
    text-align: center;
    font-size: .8rem
}

.post-job-page .posting-job-container .checkout span {
    font-size: 10spx;
    margin-top: 10px
}

.post-job-page .posting-job-container .publish-form label {
    margin-bottom: 0 !important
}

.post-job-page .posting-job-container .publish-form .primary-btn {
    padding: 16px 24px
}

.post-job-page .select2-container {
    width: 100% !important
}

.post-job-page .confirm-payment-dialog {
    height: 240px;
    width: 500px
}

.post-job-page .confirm-payment-dialog .button-holder {
    margin-top: 25px
}

.post-job-page .confirm-payment-dialog button {
    height: 50px;
    margin: 0;
    cursor: pointer
}

.post-job-page .confirm-payment-dialog .js-pay-now {
    flex: 1;
    margin-left: 10px
}

.post-job-page .confirm-payment-dialog .js-pay-later {
    flex: 1;
    margin-right: 10px
}

.post-job-page .payment-successful {
    height: 250px;
    width: 500px
}

.post-job-page trix-editor {
    min-height: 250px !important;
    overflow: scroll;
    box-shadow: 0 0 5px 0 rgba(238, 238, 238, 0.3);
    border: 1px solid var(--color-lightgrey);
    background: #fafafa
}

.post-job-page trix-toolbar .trix-button-group {
    border: 1px solid var(--color-lightgrey) !important
}

.post-job-page trix-toolbar .trix-button {
    border-bottom: 0 !important
}

.post-job-page trix-toolbar .trix-button-group--file-tools {
    display: none
}

.post-job-page .hidden {
    display: none !important
}

.post-job-page .helpContainer {
    max-width: 800px;
    text-align: center;
    margin: 12px auto;
    padding: 0 16px;
    margin-bottom: 111px
}

.post-job-page .faq-container {
    width: 800px;
    margin: auto;
    margin-bottom: 50px
}

.post-job-page .faq-container h3 {
    font-weight: 600
}

.post-job-page .faq-container li {
    margin-bottom: 16px;
    line-height: 1.5
}

.post-job-page .coupon {
    color: var(--color-grey);
    text-transform: uppercase;
    font-size: .8rem
}

.post-job-page .pricing_modal {
    display: flex;
    justify-content: center;
    min-width: 700px;
    width: 100%;
    max-width: 1024px;
    margin: auto
}

.post-job-page .pricing_modal .pricing {
    margin-bottom: 50px
}

.post-job-page .pricing_modal .pricing-head {
    margin-top: 50px
}

.post-job-page .pricing_modal .pricing-title {
    text-align: center;
    max-width: 1200px;
    margin: auto;
    font-weight: 800;
    color: var(--color-black);
    text-decoration: underline;
    margin-bottom: 30px
}

.post-job-page .pricing_modal .pricing-opts {
    max-width: 1200px;
    margin: auto;
    display: flex;
    justify-content: space-around;
    padding-top: 80px
}

.post-job-page .pricing_modal .tier {
    width: 50%;
    box-shadow: 0 0 3px #d1d1d1;
    border: 2px solid #dbdbdb;
    border-radius: 6px;
    display: inline-block;
    margin: 20px;
    position: relative;
    cursor: pointer
}

.post-job-page .pricing_modal .tier.premium:not(.selected) .tier-head-name {
    color: var(--color-black) !important
}

.post-job-page .pricing_modal .tier.premium:not(.selected) span.tier-head-name {
    font-weight: 600
}

.post-job-page .pricing_modal .tier.selected::before {
    content: "";
    position: absolute;
    top: -15px;
    left: -15px;
    background-image: url("/assets/icons/ok.svg");
    height: 40px;
    width: 40px
}

.post-job-page .pricing_modal .tier.basic .tier-btn {
    position: absolute;
    margin-left: 0;
    margin-right: 0;
    bottom: 0;
    width: 100%;
    color: var(--color-grey)
}

.post-job-page .pricing_modal .tier-head {
    height: 80px;
    background: #f6f6f6;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.post-job-page .pricing_modal .tier-head-name {
    font-weight: 600;
    color: var(--color-grey);
    display: inline-flex;
    align-items: center
}

.post-job-page .pricing_modal h2.tier-head-name {
    margin: 0
}

.post-job-page .pricing_modal span.tier-head-name {
    font-size: .8rem;
    font-weight: 400
}

.post-job-page .pricing_modal .selected .tier-head-offer {
    position: absolute;
    font-weight: 600;
    top: 38px;
    left: 8px;
    font-size: 10px;
    color: #e6e6e6;
    background: #dc0000;
    padding: 3px 7px
}

.post-job-page .pricing_modal .tier-head-price {
    font-size: 2.1rem;
    font-weight: 700
}

.post-job-page .pricing_modal .tier-head-time {
    color: var(--color-light-grey);
    font-weight: 600
}

.post-job-page .pricing_modal .tier-feature {
    color: var(--color-grey);
    font-size: 16px;
    font-weight: 600;
    margin: 10px 20px;
    border-bottom: 2px dotted #eae7e7;
    padding-bottom: 5px
}

.post-job-page .pricing_modal .tier-feature .meta-holder {
    display: flex;
    align-items: center
}

.post-job-page .pricing_modal .tier-feature .meta-holder img {
    margin-right: 10px
}

.post-job-page .pricing_modal .tier-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100px;
    margin: 5px 20px
}

.post-job-page .pricing_modal .selected.tier {
    border: 2px solid var(--color-blue)
}

.post-job-page .pricing_modal .selected .tier-feature {
    color: var(--color-dark-grey)
}

.post-job-page .pricing_modal .selected .tier-head {
    background: var(--color-blue);
    border-radius: 0
}

.post-job-page .pricing_modal .selected .tier-head-name {
    color: #e6e6e6
}

.post-job-footer {
    border-top: 1px solid #eee;
    position: fixed;
    bottom: 0;
    height: 60px;
    left: 0;
    right: 0;
    background: #fff;
    transform: translateY(0);
    transition: transform 150ms cubic-bezier(0.54, 0.03, 0.49, 1.21) 0s
}

.post-job-footer.preview-open {
    transform: translateY(-175px)
}

.post-job-footer.showin {
    transform: translateY(60px)
}

.post-job-footer .post-job-wrapper {
    min-width: 700px;
    width: 100%;
    max-width: 1024px;
    margin: auto;
    display: flex;
    height: 100%;
    align-items: center
}

.post-job-footer .coupon {
    font-size: .7rem;
    font-weight: 600;
    border: 2px dashed #eee;
    color: #c1c1c1;
    padding: 7px 5px;
    margin-right: 10px;
    min-width: 100px;
    max-width: 100px;
    display: inline-block
}

.post-job-footer .coupon .active {
    color: #343434;
    border: 2px dashed #ccc
}

.post-job-footer .coupon:hover {
    color: #343434;
    border: 2px dashed #ccc
}

.post-job-footer .preview {
    color: var(--color-grey);
    font-size: .9rem;
    font-weight: 400;
    display: inline-flex;
    cursor: pointer;
    align-items: center;
    transition: transform 150ms cubic-bezier(0.54, 0.03, 0.49, 1.21) 0s
}

.post-job-footer .preview:hover {
    color: var(--color-black)
}

.post-job-footer .preview:hover img[alt=collapse] {
    transform: translateY(-1px)
}

.post-job-footer .preview:hover img[alt=expand] {
    transform: translateY(1px)
}

.post-job-footer .checkout-right {
    color: var(--color-grey);
    font-size: .9rem;
    margin-left: auto
}

.post-job-footer .total-is {
    margin-right: 10px
}

.post-job-footer .total-is .price {
    color: var(--color-grey);
    margin-right: 5px;
    font-size: 1.1rem;
    color: #ff4e63;
    font-weight: 300
}

.preview-container {
    border-top: 1px solid #eee;
    position: fixed;
    bottom: 0;
    height: 175px;
    left: 0;
    right: 0;
    background: #fff;
    transform: translateY(0);
    transition: transform 150ms cubic-bezier(0.54, 0.03, 0.49, 1.21) 0s;
    display: flex
}

.preview-container.showin {
    transform: translateY(175px)
}

.preview-container .card {
    min-width: 700px;
    width: 100%;
    max-width: 1024px;
    margin: auto
}

.yellow-bg {
    background: #ffff95
}

@media only screen and (max-width:800px) {
    .posting-job-container .hiring-hard-section {
        text-align: center
    }
    .posting-job-container .hiring-hard-section p {
        width: 100%
    }
    .posting-job-container .hiring-hard-section .bg-image {
        display: none !important
    }
    .posting-job-container .heading h3 {
        max-width: 500px
    }
    .posting-job-container .benefits .benefit-wrapper .item-group {
        flex-direction: column
    }
}

.premium-feed-listing-upgrade {
    background: #222831;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 1;
    top: -55px;
    color: var(--gray-50)
}

.premium-feed-listing-upgrade::before,
.premium-feed-listing-upgrade::after {
    background-position: center center;
    background-repeat: repeat-x;
    background-size: 30px 10px;
    content: "";
    height: 10px;
    position: absolute;
    left: 0;
    width: 100%
}

.premium-feed-listing-upgrade::before {
    background-image: url("/assets/premiumFeed/listingUpgradeTop.svg");
    bottom: 100%
}

.premium-feed-listing-upgrade::after {
    background-image: url("/assets/premiumFeed/listingUpgradeBottom.svg");
    top: 100%
}

.premium-feed-listing-upgrade-pricing {
    width: 100%
}

.premium-feed-listing-upgrade-container {
    display: flex;
    flex-direction: column;
    padding-bottom: 3rem;
    padding-top: 3rem;
    position: relative
}

.premium-feed-listing-upgrade-container::before {
    background: url("/assets/premiumFeed/listingUpgradeBgImage.jpg") center center/cover no-repeat;
    content: "";
    height: 100%;
    -webkit-mask-image: linear-gradient(transparent, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.15), transparent);
    mask-image: linear-gradient(transparent, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.15), transparent);
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1
}

.premium-feed-listing-upgrade-content {
    align-items: center;
    display: flex;
    flex-direction: column;
    margin-inline: auto;
    gap: 1rem;
    width: min(100%, 62em)
}

.premium-feed-listing-upgrade-header {
    align-items: center;
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    gap: .5rem;
    padding: 0 1rem
}

.premium-feed-listing-upgrade-header h2 {
    font-size: var(--font-size-xxx-large);
    font-weight: 900;
    margin: 0
}

.premium-feed-listing-upgrade-header h3 {
    font-size: var(--font-size-x-large);
    margin: 0;
    width: min(100%, 30em);
    text-align: balance;
    color: var(--gray-50);
    opacity: .7;
    font-weight: 600
}

.premium-feed-listing-upgrade-perks {
    width: min(100%, 52em);
    padding: 0 1rem
}

.premium-feed-listing-upgrade-perks p {
    font-weight: 500;
    font-size: var(--font-size-large);
    color: var(--gray-300);
    text-align: center
}

.premium-feed-listing-upgrade-perks ul {
    list-style-type: none;
    padding: 0;
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
    justify-content: center
}

.premium-feed-listing-upgrade-perks ul li {
    color: #be123c;
    background-image: linear-gradient(240deg, #fecdd3, #fbcfe8);
    display: inline-flex;
    border-radius: 25px;
    padding: 3px .5rem
}

.premium-feed-listing-upgrade-perks ul .icon {
    margin-right: 4px
}

.premium-feed-listing-upgrade-perks-v2 {
    padding: 0 1rem
}

.premium-feed-listing-upgrade-perks-v2 .perk-item {
    font-size: var(--font-size-large);
    font-weight: 600
}

.premium-feed-listing-upgrade-perks-v2 .perk-item b {
    text-decoration: underline
}

.premium-feed-listing-upgrade-pricing {
    margin-top: 2rem;
    padding: 0 1rem
}

.premium-feed-listing-upgrade-pricing h3 {
    font-size: var(--font-size-x-large);
    margin: 0;
    color: rgba(var(--gray-50), 0.8);
    text-align: center;
    font-weight: 800
}

.premium-feed-listing-upgrade-pricing h4 {
    text-align: center;
    font-size: var(--font-size-medium);
    font-weight: 600;
    margin: 0
}

.premium-feed-listing-upgrade-pricing-card {
    background: #222831;
    border-radius: .5rem;
    padding: 1rem;
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 1rem
}

.premium-feed-listing-upgrade-pricing-card p {
    font-size: var(--font-size-large);
    margin: 0;
    font-weight: 500;
    opacity: .7;
    text-align: center
}

.premium-feed-listing-upgrade-pricing-card small {
    text-align: center;
    opacity: .7
}

.premium-feed-listing-upgrade-pricing-proof {
    font-weight: 500;
    margin-top: 1rem
}

.premium-feed-listing-upgrade-pricing-proof b {
    font-size: var(--font-size-large);
    font-weight: 700
}

.premium-feed-listing-upgrade-pricing-proof~h4 a {
    text-decoration: underline;
    color: white !important
}

.premium-feed-listing-upgrade-pricing-avatar-container {
    display: flex;
    margin-top: 1rem;
    align-items: center;
    justify-content: center
}

.premium-feed-listing-upgrade-pricing-avatar {
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid var(--gray-50);
    margin-right: -8px
}

.premium-feed-listing-upgrade-pricing-avatar:first-child {
    transform: none
}

.premium-feed-listing-upgrade-benefits {
    margin-top: 2rem;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    padding: 0 1rem
}

.premium-feed-listing-upgrade-benefits-card h3 {
    font-size: var(--font-size-x-large);
    margin: 0;
    color: var(--gray-50);
    font-weight: 800
}

.premium-feed-listing-upgrade-benefits-card h4 {
    font-size: var(--font-size-large);
    margin: 0;
    opacity: .7;
    font-weight: 500
}

.premium-feed-listing-upgrade-testimonials h2 {
    text-align: center;
    margin-bottom: 0
}

.premium-feed-listing-upgrade-testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-top: 2rem;
    padding: 0 1rem
}

@media screen and (max-width:768px) {
    .premium-feed-listing-upgrade-testimonials-grid {
        grid-template-columns: repeat(1, 1fr)
    }
}

.premium-feed-listing-upgrade-testimonials-card {
    color: var(--amber-900);
    background: linear-gradient(135deg, var(--amber-100), var(--amber-200));
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem
}

.premium-feed-listing-upgrade-testimonials-card:nth-child(1),
.premium-feed-listing-upgrade-testimonials-card:nth-child(5) {
    transform: rotate(-1deg)
}

.premium-feed-listing-upgrade-testimonials-card:nth-child(2),
.premium-feed-listing-upgrade-testimonials-card:nth-child(6) {
    transform: rotate(1deg)
}

.premium-feed-listing-upgrade-testimonials-card:nth-child(3),
.premium-feed-listing-upgrade-testimonials-card:nth-child(4) {
    transform: rotate(0)
}

.premium-feed-listing-upgrade-testimonials-card p {
    font-size: var(--font-size-large);
    margin: 0
}

.premium-feed-blurred-listing * {
    pointer-events: none
}

.premium-feed-blurred-listing .job-position,
.premium-feed-blurred-listing .company-name,
.premium-feed-blurred-listing .company-name-mobile,
.premium-feed-blurred-listing .job-meta,
.premium-feed-blurred-listing .tags-container {
    filter: blur(4px)
}

.premium-promo-coupon-wrapper {
    background: linear-gradient(90deg, var(--red-300) 0, var(--amber-200) 100%);
    animation: 600ms ease-out 0s 1 slideDown;
    cursor: text
}

@keyframes slideDown {
    0% {
        transform: translateY(-100%)
    }
    100% {
        transform: translateY(0)
    }
}

.premium-promo-coupon {
    display: flex;
    padding: 1rem 0;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    align-self: stretch;
    margin: auto;
    color: inherit
}

.premium-page {
    padding: 3rem 2rem 10rem 2rem;
    background: var(--gray-100)
}

.premium-page-inner {
    max-width: 1024px;
    margin: auto
}

.premium-page-inner>.hero .preheader {
    position: relative;
    display: flex
}

.premium-page-inner>.hero .preheader img {
    margin: auto
}

.premium-page-inner>.hero .preheader h2 {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 3px;
    color: var(--gray-900);
    font-size: 12px;
    font-weight: bold;
    text-shadow: none;
    letter-spacing: -0.5px
}

.premium-page-inner>.hero .preheader h2+h2 {
    top: 20px
}

.premium-page h1 {
    font-size: var(--font-size-xxx-large);
    font-weight: 800;
    color: var(--gray-800);
    text-align: center
}

.premium-page h2.subtitle {
    font-size: var(--font-size-x-large);
    font-weight: 500;
    margin-top: 1rem;
    margin-bottom: 2rem;
    color: var(--gray-500);
    text-align: center;
    text-wrap: balance
}

.premium-page-pricing {
    margin-top: 2rem;
    padding: 0 1rem
}

.premium-page-pricing h3 {
    font-size: var(--font-size-x-large);
    margin: 0;
    color: rgba(var(--gray-50), 0.8);
    text-align: center;
    font-weight: 800
}

.premium-page-pricing h4 {
    text-align: center;
    font-size: var(--font-size-large);
    margin: 0
}

.premium-page-pricing .pricingSubtitle {
    font-weight: 500;
    color: var(--gray-600);
    max-width: 720px;
    text-align: center;
    margin: auto
}

.premium-page-pricing-card {
    background: #fff;
    border-radius: .5rem;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    box-shadow: rgba(17, 17, 26, 0.1) 0 0 2px;
    border: 1px solid var(--gray-200);
    flex: 1;
    max-width: 400px
}

.premium-page-pricing-card>h4 {
    margin-bottom: 16px;
    font-size: var(--font-size-large)
}

.premium-page-pricing-card .badge {
    background: var(--amber-200);
    color: var(--amber-600);
    padding: .25rem 1rem;
    border-radius: 25px;
    font-weight: 700;
    font-size: var(--font-size-small);
    align-self: center
}

.premium-page-pricing-card .badge.bestValue {
    background-image: linear-gradient(60deg, var(--emerald-100), var(--emerald-200));
    color: var(--emerald-600)
}

.premium-page-pricing-card .perksBadge {
    font-size: var(--font-size-small);
    font-weight: 700;
    color: var(--emerald-600);
    background: var(--emerald-200);
    padding: .25rem .5rem;
    border-radius: 6px
}

.premium-page-pricing-card .priceBig {
    font-size: var(--font-size-xx-large);
    font-weight: 700;
    color: var(--gray-900)
}

.premium-page-pricing-card .priceStriked {
    text-decoration: line-through;
    font-size: var(--font-size-medium);
    color: var(--gray-500);
    margin-right: 10px;
    font-weight: 500
}

.premium-page-pricing-card .priceTime {
    font-size: var(--font-size-large);
    color: var(--gray-600)
}

.premium-page-pricing-card p {
    font-size: var(--font-size-large);
    margin: 0;
    font-weight: 500;
    opacity: .7;
    text-align: center
}

.premium-page-pricing-card a.button.recurring {
    margin-top: .25rem;
    font-size: 1.1rem !important;
    font-weight: 600
}

.premium-page-pricing-card a.button.one-time {
    font-size: 1.1rem !important;
    font-weight: 600
}

.premium-page-pricing-card small {
    text-align: center;
    opacity: .7
}

.premium-page-pricing-card .perksList {
    padding: 12px;
    border-radius: 6px;
    border: 1px solid var(--gray-200);
    background: var(--gray-100);
    display: flex;
    flex-direction: column;
    gap: .5rem;
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--gray-900);
    display: none
}

.premium-page-pricing-proof {
    font-weight: 500;
    margin-top: 1rem
}

.premium-page-pricing-proof b {
    font-size: var(--font-size-large);
    font-weight: 700
}

.premium-page-pricing-card-container {
    display: flex;
    gap: 1rem;
    margin-top: 1rem;
    justify-content: center
}

@media screen and (max-width:768px) {
    .premium-page-pricing-card-container {
        flex-direction: column
    }
}

.premium-page-pricing-avatar-container {
    display: flex;
    margin-top: 1rem;
    align-items: center;
    justify-content: center
}

.premium-page-pricing-avatar {
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid var(--gray-50);
    margin-right: -8px
}

.premium-page-pricing-avatar:first-child {
    transform: none
}

.premium-page-separator {
    display: flex;
    margin: auto;
    padding: 4rem 0;
    text-align: center
}

.premium-page-testimonials h2 {
    text-align: center;
    margin-bottom: 0
}

.premium-page-testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-top: 2rem;
    padding: 0 1rem
}

@media screen and (max-width:768px) {
    .premium-page-testimonials-grid {
        grid-template-columns: repeat(1, 1fr)
    }
}

@media screen and (max-width:768px) {
    .premium-page-testimonials {
        grid-template-columns: repeat(1, 1fr)
    }
}

.premium-page-testimonials-card {
    background-color: #fff;
    border: 1px solid var(--gray-300);
    border-radius: 1rem;
    padding: 1rem;
    transition: transform .3s ease
}

.premium-page-testimonials-card:hover {
    transform: translateY(-5px) scale(1.01)
}

.premium-page-testimonials-card span {
    display: inline-block;
    color: var(--gray-400);
    margin-left: 4px
}

.premium-page-testimonials-card span b {
    font-size: var(--font-size-large);
    color: var(--gray-900)
}

.premium-page-testimonials-card p {
    font-size: var(--font-size-medium);
    color: var(--gray-700);
    line-height: 1.5
}

.premium-page .premiumStats {
    margin: 4rem 1rem
}

.premium-page .premiumStats .premiumStatsHeading {
    text-align: center;
    margin-bottom: 0;
    letter-spacing: -1px
}

.premium-page .premiumStats .premiumStatsSubheading {
    text-align: center;
    color: var(--gray-500);
    font-size: var(--font-size-large);
    font-weight: 500;
    letter-spacing: -1px
}

.premium-page .premiumStats .statsRow {
    display: flex;
    gap: 1rem
}

@media screen and (max-width:768px) {
    .premium-page .premiumStats .statsRow {
        flex-direction: column
    }
}

.premium-page .premiumStats .statsCard {
    border: 1px solid var(--gray-200);
    background: #fff;
    flex: 1;
    border-radius: 6px;
    padding: 1rem 2rem
}

.premium-page .premiumStats .statsCard h2 {
    font-size: var(--font-size-x-large);
    font-weight: 800;
    margin: 0;
    letter-spacing: -1.5px
}

.premium-page .premiumStats .statsCard p {
    font-size: var(--font-size-large);
    color: var(--gray-500);
    font-weight: 500;
    margin: 0;
    letter-spacing: -0.5px
}

.premium-page-perks>h2 {
    text-align: center
}

.premium-page-perks-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-top: 2rem;
    padding: 1rem
}

@media screen and (max-width:768px) {
    .premium-page-perks-grid {
        grid-template-columns: repeat(1, 1fr)
    }
}

.premium-page-perks-card {
    background-color: var(--gray-50);
    border-radius: .5rem;
    padding: 1rem;
    border: 1px solid var(--gray-200)
}

.premium-page-perks-card h2 {
    font-size: var(--font-size-large);
    font-weight: 600;
    margin-bottom: .5rem
}

.premium-page-perks-card p {
    font-size: var(--font-size-large);
    font-weight: 500;
    color: var(--gray-500)
}

@media screen and (max-width:768px) {
    .premium-page-perks {
        grid-template-columns: repeat(1, 1fr)
    }
}

.premium-page-faq {
    display: flex;
    flex-direction: row;
    gap: 1rem
}

@media screen and (max-width:768px) {
    .premium-page-faq {
        flex-direction: column
    }
}

.premium-page-faq-side {
    width: min(100%, 50em)
}

.premium-page-faq-side h2 {
    font-size: var(--font-size-xx-large);
    font-weight: 800;
    margin-bottom: 1rem
}

.premium-page-faq-side h3 {
    font-size: var(--font-size-large);
    font-weight: 500;
    color: var(--gray-500)
}

.premium-page-faq-main {
    width: 100%;
    font-size: var(--font-size-large)
}

.premium-page-faq-main details {
    border: 1px solid var(--gray-300);
    border-radius: .25rem;
    padding: 1rem;
    margin-bottom: .5rem
}

.premium-page-faq-main summary {
    font-weight: 600;
    cursor: pointer;
    list-style: none
}

.premium-page-faq-main p {
    color: var(--gray-700);
    margin-top: .5rem;
    margin-bottom: 0
}

.premium-page-faq-main details[open] summary {
    color: var(--red)
}

.listing_card_upgrade {
    background: #232932;
    align-items: center;
    display: flex;
    justify-content: space-around;
    gap: 1rem;
    border-color: transparent
}

.listing_card_upgrade_content {
    padding-left: 6rem
}

.listing_card_upgrade_title {
    font-size: var(--font-size-large);
    font-weight: 600;
    color: var(--gray-50);
    margin-bottom: .5rem
}

.listing_card_upgrade_subtitle {
    margin-top: 0;
    font-size: var(--font-size-medium);
    font-weight: 500;
    color: var(--gray-200)
}

.listing_card_upgrade_cta {
    flex-shrink: 0;
    padding-right: 2rem
}

@media screen and (max-width:1100px) {
    .listing_card_upgrade_content {
        padding-left: 1rem
    }
    .listing_card_upgrade_cta {
        padding-right: 0
    }
}

@media screen and (max-width:768px) {
    .listing_card_upgrade {
        flex-direction: column
    }
    .listing_card_upgrade_cta,
    .listing_card_upgrade_cta>a {
        width: 100%
    }
}

.pricingCards {
    width: 100%
}

@media screen and (max-width:768px) {
    .pricingCards {
        flex-direction: column;
        align-items: center
    }
}

.pricingCards .pricingCard {
    background: var(--gray-50);
    border-radius: .5rem;
    border: 1px solid var(--gray-200);
    padding: 1rem;
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 1rem;
    max-width: 400px
}

.pricingCards .pricingCard .button {
    font-size: var(--font-size-large)
}

.pricingCards .pricingCard h3 {
    color: var(--gray-900)
}

.pricingCards .pricingCard small {
    text-align: center;
    opacity: .7;
    color: var(--gray-600)
}

.pricingCards .pricingCard small+small {
    margin-top: -10px
}

.resources-container {
    display: flex;
    flex-direction: column;
    margin: 50px;
    color: var(--color-black)
}

.resources-container .newsletter-page-heading {
    text-align: center
}

.resources-container .first {
    align-self: center;
    color: var(--color-blue);
    font-weight: 800;
    font-size: 2.5rem
}

.resources-container .tab-container {
    display: flex
}

.resources-container .tab-container .tabs {
    font-size: 1rem;
    min-width: 250px;
    position: sticky;
    height: 455px;
    top: 20px;
    bottom: 20px
}

.resources-container .tab-container .tab-option {
    border-right: 5px solid transparent;
    color: var(--color-grey);
    padding: 10px;
    margin-bottom: 10px;
    text-align: right;
    cursor: pointer
}

.resources-container .tab-container .tab-option.selected-tab {
    color: var(--color-blue);
    border-right: 5px solid var(--color-darkblue)
}

.resources-container .option-div {
    margin-left: 40px;
    display: flex;
    background: #fafafa;
    border: 1px solid #eee;
    border-radius: 3px;
    padding: 10px 40px
}

.resources-container .option-div li {
    margin-bottom: 10px
}

.resources-container .option-div .column a {
    display: inherit
}

.resources-container .option-div .tabs-1-div,
.resources-container .option-div .tabs-3-div {
    margin: 0 10px;
    display: flex;
    flex-direction: column
}

.resources-container .option-div .tabs-1-div a,
.resources-container .option-div .tabs-3-div a {
    text-decoration: none;
    flex: 1;
    background: rgba(255, 146, 48, 0.3);
    color: var(--color-black)
}

.resources-container .option-div .tabs-2-div,
.resources-container .option-div .tabs-4-div {
    margin: 0 10px;
    display: flex;
    flex-direction: column
}

.resources-container .option-div .tabs-2-div .column,
.resources-container .option-div .tabs-4-div .column {
    display: flex
}

.resources-container .option-div .tabs-2-div .column a,
.resources-container .option-div .tabs-4-div .column a {
    text-decoration: none;
    text-align: center;
    flex: 1
}

.resources-container .option-div .tabs-2-div .column a .collection-books,
.resources-container .option-div .tabs-4-div .column a .collection-books {
    display: flex;
    flex-direction: column;
    margin: 10px;
    border-radius: 3px;
    padding: 10px;
    color: var(--color-black);
    border-right: 7px solid #eee;
    border-bottom: 7px solid #eee;
    border-top: 1px solid #eee;
    border-left: 1px solid #eee;
    background: 0;
    width: 100%
}

.resources-container .option-div .tabs-2-div .column a .collection-books .resource-name,
.resources-container .option-div .tabs-4-div .column a .collection-books .resource-name {
    margin: 20px auto
}

.resources-container .option-div .tabs-2-div .column a .collection-books .resource-description,
.resources-container .option-div .tabs-4-div .column a .collection-books .resource-description {
    font-size: .9rem;
    color: var(--color-grey)
}

.resources-container .option-div .tabs-5-div {
    margin: 0 10px;
    display: flex;
    flex-direction: column
}

.resources-container .option-div .tabs-5-div ul {
    list-style: none
}

.resources-container .option-div .tabs-5-div ul li {
    margin-bottom: 10px
}

.resources-container .option-div .tabs-5-div ul a {
    text-decoration: none;
    text-align: center;
    flex: 1;
    background: rgba(255, 146, 48, 0.3);
    color: var(--color-black)
}

.resources-container .option-div .tabs-5-div ul a h3,
.resources-container .option-div .tabs-5-div ul a p {
    text-align: left
}

.resources-container .option-div .tabs-5-div ul a p {
    background: rgba(255, 146, 48, 0.3)
}

.resources-container .option-div .tabs-5-div .Blogs ul {
    list-style: initial
}

.resources-container .option-div .tabs-4-div {
    margin: 0 10px;
    display: flex;
    flex-direction: column;
    font-size: 1rem
}

.resources-container .option-div .tabs-4-div ul {
    list-style: none
}

.resources-container .option-div .tabs-4-div ul a {
    text-decoration: none;
    color: var(--color-black);
    text-align: center;
    flex: 1;
    background: rgba(255, 146, 48, 0.3)
}

.resources-container .option-div .tabs-4-div ul a h3,
.resources-container .option-div .tabs-4-div ul a p {
    text-align: left
}

.resources-container .option-div .tabs-4-div ul a p {
    background: rgba(255, 146, 48, 0.3)
}

.salariesIndex {
    max-width: 1000px;
    margin: auto;
    padding-top: 64px;
    padding-bottom: 64px
}

.salariesIndex .title {
    font-size: var(--font-size-xxx-large);
    font-weight: 900;
    letter-spacing: -2px;
    margin: auto;
    text-align: center
}

.salariesIndex .subtitle {
    font-size: var(--font-size-x-large);
    font-weight: 600;
    letter-spacing: -1px;
    margin: auto;
    text-align: center;
    color: var(--gray-600)
}

.salariesIndex .searchForm {
    text-align: center;
    margin: auto;
    margin-top: 24px;
    margin-bottom: 24px;
    width: 100%;
    max-width: 340px;
    display: flex;
    align-items: center;
    gap: .25rem
}

.salariesIndex .searchForm input[type=text] {
    flex-grow: 1
}

.salariesIndex .searchForm input[type=submit] {
    flex-shrink: 0
}

.salariesIndex .salaryGrid {
    gap: 1rem;
    margin-bottom: 111px
}

.salariesIndex .salaryCard {
    border: 1px solid var(--gray-300);
    padding: 1rem 2rem;
    color: var(--gray-900);
    font-size: var(--font-size-large);
    border-radius: 6px
}

.salariesIndex .salaryCard:hover {
    border: 1px solid var(--gray-400);
    background: var(--gray-100)
}

.salariesShow {
    max-width: 800px;
    padding: 64px 16px;
    margin: auto
}

.salariesShow a {
    color: var(--gray-800);
    text-emphasis: none;
    text-decoration: underline
}

.salariesShow a:hover {
    color: var(--gray-600)
}

.salariesShow h1.title {
    font-size: var(--font-size-xxx-large);
    font-weight: 900;
    letter-spacing: -2px;
    margin: auto;
    text-align: center;
    margin-bottom: 24px
}

.salariesShow h2.shortAnswer {
    font-size: var(--font-size-large);
    font-weight: 400;
    letter-spacing: 0;
    margin: auto;
    text-align: left;
    margin-bottom: 24px
}

.salariesShow table {
    width: 100%;
    border-collapse: collapse
}

.salariesShow thead th {
    background-color: var(--red);
    color: var(--gray-50);
    padding: 10px;
    border: 1px solid var(--gray-50)
}

.salariesShow tbody td {
    padding: 8px;
    border: 1px solid var(--gray-200);
    text-align: left
}

.salariesShow tbody tr:nth-child(odd) {
    background-color: var(--gray-100)
}

.salariesShow tbody tr:nth-child(even) {
    background-color: #fff
}

.salariesShow p,
.salariesShow h3,
.salariesShow h2 {
    font-size: var(--font-size-large)
}

.salariesShow .dataDisclaimer {
    font-size: var(--font-size-xx-small);
    color: var(--gray-500);
    margin-top: 1rem
}

.scout-header {
    border-bottom: 1px solid #e7e5e4
}

.scout-header .scout-header-inner {
    max-width: 1200px;
    padding: 24px 16px;
    margin: auto;
    display: flex
}

.scout-header .logo-wrapper,
.scout-header .link-wrapper {
    display: flex;
    align-items: center
}

.scout-header .link-wrapper {
    margin-left: auto
}

.scout-header .link {
    font-weight: bold;
    color: #57534e;
    margin: 0 6px
}

.scout-header .link:hover {
    text-decoration: underline;
    color: #dc2626
}

.scout-header .nav-links {
    margin-right: 16px
}

.scout-header .menu-icon,
.scout-header .mobile-menu.is-hidden {
    display: none
}

.scout-header .mobile-menu {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    top: -100px
}

.scout-footer {
    border-top: 1px solid #e7e5e4
}

.scout-footer .scout-footer-inner {
    max-width: 1200px;
    padding: 78px 16px;
    margin: auto
}

.scout-footer .row {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.scout-footer .column a {
    margin-left: 6px;
    margin-right: 6px;
    color: #57534e;
    font-weight: bold
}

.scout-footer .column a:hover {
    text-decoration: underline;
    color: #dc2626
}

.scout-footer .social-icon {
    display: inline-block;
    height: 36px;
    width: 36px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background: #fef2f2;
    border-radius: 50%;
    padding: 2px
}

.page-scout-landing .section-hero {
    padding: 4rem 6rem
}

.page-scout-landing .section-hero .heading {
    max-width: 700px;
    font-size: 3rem
}

.page-scout-landing .section-hero .subheading {
    max-width: 600px;
    font-size: 1.5rem;
    margin-bottom: 48px
}

.page-scout-landing .section-hero .button {
    letter-spacing: 1px;
    font-weight: 700;
    padding: 20px 24px;
    font-size: 1.1rem
}

.page-scout-landing .section-hero .testimonials-container {
    max-width: 1024px;
    margin-top: 48px
}

.page-scout-landing .section-hero .testimonial-row {
    margin: 24px 0;
    display: flex;
    justify-content: space-around
}

.page-scout-landing .section-hero .testimonial-row .testimonial-card {
    border: 1px solid #fafaf9;
    background: #f5f5f4;
    padding: 12px 16px;
    flex: 1;
    margin-right: 12px;
    margin-left: 12px;
    border-radius: 6px
}

.page-scout-landing .section-hero .testimonial-row .testimonial-card .testimonial-text {
    text-align: left;
    color: #44403c;
    font-size: 1.1rem
}

.page-scout-landing .section-hero .testimonial-row .testimonial-card .testimonial-user {
    text-align: left;
    color: #1c1917;
    margin-left: 8px;
    font-size: 1.2rem
}

.page-scout-landing .section-hero .testimonial-row .testimonial-card .testimonial-user .company {
    font-size: 1.1rem;
    color: #78716c
}

.page-scout-landing .section-hero .testimonial-row .testimonial-card .testimonial-avatar-wrapper {
    display: flex;
    align-items: center
}

.page-scout-landing .section-hero .testimonial-row .testimonial-card .testimonial-avatar {
    height: 50px;
    width: 50px;
    object-fit: cover;
    border-radius: 50%
}

.page-scout-landing .section-split {
    max-width: 1200px;
    margin: auto;
    display: flex;
    align-items: center
}

.page-scout-landing .section-split .content {
    flex: 1;
    margin: 0 20px
}

.page-scout-landing .section-split .image {
    flex: 1;
    padding: 0 20px;
    display: inline-flex
}

.page-scout-landing .section-split .image img {
    margin: auto;
    max-width: 100%
}

.page-scout-landing .section-split ul {
    list-style: none;
    padding: 0
}

.page-scout-landing .section-split .heading {
    font-size: 2.2rem
}

.page-scout-landing .section-split .subheading {
    font-size: 1.2rem;
    line-height: 1.5
}

.page-scout-landing .section-split .check-item {
    background: var(--color-brand);
    border-radius: 50%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 20px;
    width: 20px
}

.page-scout-landing .section-split .list-item {
    margin-bottom: 6px
}

.page-scout-landing .section-how {
    max-width: 1200px;
    margin: auto
}

.page-scout-landing .section-how .heading {
    max-width: 700px;
    font-size: 2.2rem;
    text-align: center;
    margin-left: auto;
    margin-right: auto
}

.page-scout-landing .section-how .subheading {
    font-size: 1.2rem;
    line-height: 1.5
}

.page-scout-landing .section-how .how-row {
    display: flex
}

.page-scout-landing .section-how .how-card {
    flex: 1;
    padding: 16px 16px;
    background: #f5f5f4;
    border-radius: 8px;
    font-size: 1.2rem;
    line-height: 1.6;
    margin-bottom: 16px
}

.page-scout-landing .section-how .how-card b {
    font-size: 1.3rem
}

.page-scout-landing .section-how .how-card:nth-child(1) {
    margin-right: 8px
}

.page-scout-landing .section-how .how-card:nth-child(2) {
    margin-left: 8px
}

.page-scout-landing .section-guarantee {
    max-width: 1200px;
    margin: auto
}

.page-scout-landing .section-guarantee .role-row,
.page-scout-landing .section-guarantee .guarantee-row {
    display: flex
}

.page-scout-landing .section-guarantee .guarantee-card {
    flex: 1;
    padding: 16px 16px;
    background: #f5f5f4;
    border-radius: 8px;
    font-size: 1.2rem;
    line-height: 1.6;
    margin-bottom: 16px
}

.page-scout-landing .section-guarantee .guarantee-card:nth-child(1) {
    margin-right: 8px
}

.page-scout-landing .section-guarantee .guarantee-card:nth-child(2) {
    margin-left: 8px
}

.page-scout-landing .section-guarantee .role-card {
    flex: 1;
    padding: 0;
    font-size: 1.1rem;
    margin-bottom: 16px
}

.page-scout-landing .section-guarantee .role-card:nth-child(1) {
    margin-right: 8px
}

.page-scout-landing .section-guarantee .role-card:nth-child(2) {
    margin-left: 8px;
    margin-right: 8px
}

.page-scout-landing .section-guarantee .role-card:nth-child(3) {
    margin-left: 8px
}

.page-scout-landing .section-guarantee .role-card img {
    width: 100%;
    height: unset;
    filter: brightness(90%) saturate(120%)
}

.page-scout-landing .section-guarantee .role-card h3 {
    font-size: 1.4rem;
    font-weight: 500;
    margin-bottom: 8px
}

.page-scout-landing .section-guarantee .role-card p {
    font-size: 1.2rem
}

.page-scout-landing .section-guarantee .heading {
    font-size: 2.2rem;
    text-align: center
}

.page-scout-landing .section-guarantee .subheading {
    font-size: 1.1rem
}

.page-scout-landing .section-pricing {
    max-width: 1200px;
    margin: auto
}

.page-scout-landing .section-pricing .heading {
    font-size: 2.2rem;
    text-align: center
}

.page-scout-landing .section-pricing .subheading {
    font-size: 1.2rem;
    max-width: 700px;
    text-align: center;
    margin: auto;
    line-height: 1.7
}

.page-scout-landing .section-faq {
    max-width: 800px;
    margin: auto
}

.page-scout-landing .section-faq .heading {
    font-size: 2.2rem;
    text-align: center
}

.page-scout-landing .section-faq .item {
    border-bottom: 1px solid #e7e5e4;
    margin-bottom: 10px;
    padding: 10px
}

.page-scout-landing .section-faq .item summary {
    font-weight: bold;
    cursor: pointer;
    padding: 10px;
    list-style: none;
    font-size: 1.2rem
}

.page-scout-landing .section-faq .item p {
    margin: 0;
    padding: 10px;
    color: #57534e;
    font-size: 1.1rem
}

.page-scout-landing .section-ready-hire {
    max-width: 1200px;
    margin: auto
}

.page-scout-landing .section-ready-hire .heading {
    font-size: 2.2rem;
    text-align: center
}

.page-scout-landing .section-ready-hire .subheading {
    font-size: 1.2rem;
    text-align: center;
    max-width: 700px;
    margin: auto
}

.page-scout-landing .section-ready-hire .cta-holder {
    display: flex;
    justify-content: center;
    margin-top: 36px
}

.page-scout-landing .section-ready-hire .cta-holder .button {
    margin: 0 8px
}

.page-scout-landing .section-space-divider {
    padding-top: 128px
}

@media screen and (max-width:768px) {
    .scout-header .link-wrapper {
        display: none
    }
    .scout-header .menu-icon {
        display: inline-flex;
        margin-left: auto
    }
    .scout-header .mobile-menu {
        display: flex;
        position: fixed;
        left: 0;
        right: 0;
        top: -100px;
        transform: translateY(100px);
        transition: 200ms ease-in all;
        list-style: none;
        flex-direction: column;
        background: white;
        padding: 24px;
        text-align: center;
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
        margin: 0
    }
    .scout-header .mobile-menu li {
        margin-bottom: 16px;
        padding-bottom: 16px;
        border-bottom: 1px solid #f5f5f4
    }
    .scout-header .mobile-menu li a {
        font-size: 1.3rem
    }
    .scout-header .mobile-menu li:last-child {
        border: 0;
        padding: 0;
        margin: 0
    }
    .scout-header .mobile-menu.is-hidden {
        display: none
    }
    .scout-footer .row {
        flex-direction: column
    }
    .scout-footer .column {
        margin-top: 12px;
        margin-bottom: 12px
    }
    .page-scout-landing .section-hero {
        padding: 4rem 2rem
    }
    .page-scout-landing .section-hero .heading {
        font-size: 2.2rem;
        text-wrap: balance
    }
    .page-scout-landing .section-hero .testimonial-row {
        flex-direction: column;
        margin: 0
    }
    .page-scout-landing .section-hero .testimonial-row .testimonial-card {
        margin-bottom: 24px
    }
    .page-scout-landing .section-split {
        flex-direction: column;
        padding: 3rem 2rem
    }
    .page-scout-landing .section-split .heading {
        text-align: center
    }
    .page-scout-landing .section-split .image {
        display: none
    }
    .page-scout-landing .section-how {
        padding: 3rem 2rem
    }
    .page-scout-landing .section-how .how-row {
        flex-direction: column
    }
    .page-scout-landing .section-how .how-row .how-card {
        margin: 0;
        margin-bottom: 24px
    }
    .page-scout-landing .section-guarantee {
        padding: 3rem 2rem
    }
    .page-scout-landing .section-guarantee .role-row,
    .page-scout-landing .section-guarantee .guarantee-row {
        flex-direction: column
    }
    .page-scout-landing .section-guarantee .role-row .role-card,
    .page-scout-landing .section-guarantee .role-row .guarantee-card,
    .page-scout-landing .section-guarantee .guarantee-row .role-card,
    .page-scout-landing .section-guarantee .guarantee-row .guarantee-card {
        margin: 0;
        margin-bottom: 24px
    }
    .page-scout-landing .section-guarantee .role-row .role-card p,
    .page-scout-landing .section-guarantee .role-row .guarantee-card p,
    .page-scout-landing .section-guarantee .guarantee-row .role-card p,
    .page-scout-landing .section-guarantee .guarantee-row .guarantee-card p {
        margin-top: 0
    }
    .page-scout-landing .section-guarantee .button {
        letter-spacing: 1px;
        font-weight: 700;
        padding: 20px 24px;
        font-size: 1.1rem
    }
    .page-scout-landing .section-pricing,
    .page-scout-landing .section-faq,
    .page-scout-landing .section-ready-hire {
        padding: 3rem 2rem
    }
    .page-scout-landing .section-space-divider {
        padding: 0
    }
}

.search {
    max-width: 1024px;
    margin: auto
}

.search .create-job-alert {
    margin-left: auto;
    font-size: .8rem;
    font-weight: 600
}

.search-container {
    display: flex;
    gap: 4px;
    position: relative
}

@media(max-width:768px) {
    .search-container {
        flex-direction: column
    }
}

.search-container .search-input {
    background: #fff;
    flex: 1;
    width: 100%;
    border-radius: 24px;
    border: 0;
    font-size: 1.2rem;
    font-weight: 700
}

.search-container .search-btn {
    position: absolute;
    right: 4px;
    top: 3px;
    transform: scale(0.95);
    border-radius: 24px;
    border: 0;
    box-shadow: none;
    font-weight: 600;
    padding: 2px 16px;
    max-height: 20px;
    border: 0;
    box-shadow: none;
    background-color: #0284c7;
}

.search-container .search-btn:hover {
    box-shadow: none
}

.search-terms-container .search-terms-page {
    background: #fff3f3;
    display: flex;
    margin: auto;
    padding: 10px;
    flex-direction: column;
    align-items: center
}

.search-terms-container .search-terms-page .content {
    display: flex;
    flex-direction: column;
    margin: 20px 40px;
    align-items: center
}

.search-terms-container .search-terms-page .content .content-title {
    margin: 10px 0;
    font-weight: 600;
    color: var(--color-black);
    font-size: 2.5rem
}

.search-terms-container .search-terms-page .content-subtitle {
    color: var(--color-grey);
    margin: 16px 0;
    font-size: 1.2rem;
    line-height: 1.4;
    font-weight: 400;
    max-width: 850px
}

.search-terms-container .remote-search-list .list {
    display: flex;
    border: 1px solid var(--color-lightgrey);
    margin-top: 20px;
    max-width: 850px;
    padding: 20px;
    border-radius: 6px;
    margin: auto;
    margin-top: 20px;
    flex-direction: column
}

.search-terms-container .remote-search-list .item-container .item {
    font-size: 1.2rem;
    font-weight: 600
}

.select2-container {
    width: 100% !important
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered li {
    color: var(--color-darkblue);
    border-radius: 2px;
    background-color: var(--color-lightestblue);
    border: 1px solid var(--color-lightblue);
    padding: 5px 10px;
    font-size: .8rem;
    border: 0;
    font-weight: 600
}

.select2-container .select2-search--inline {
    background: white !important
}

.select2-selection__choice {
    margin: 5px
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: var(--color-darkblue) !important;
    margin-right: 5px !important;
    background: var(--color-lightestblue) !important
}

.select2-container--default .select2-selection--multiple {
    background-color: white;
    border: 1px solid var(--color-lightgrey) !important;
    border-radius: 0 !important;
    cursor: text
}

.select2-container .select2-selection--multiple {
    min-height: 35px !important
}

.select2-dropdown {
    border: 1px solid var(--color-lightgrey) !important
}

.select2-results__option {
    color: var(--color-grey) !important;
    font-size: .9rem
}

.select2-results__option--highlighted {
    background: var(--color-blue) !important;
    color: white !important
}

.site-info {
    margin: 40px 0;
    font-size: .8rem;
    font-weight: 400;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.site-info .mailing-info {
    margin-top: 5px
}

.site-info .policy-info {
    margin-top: 5px
}

.site-info .text {
    color: var(--color-grey);
    text-decoration: none;
    margin: 15px 0;
    font-size: .7rem
}

.site-info .mail {
    color: var(--color-grey);
    text-decoration: none
}

.sponsor-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-top: 32px;
    color: var(--color-white);
    background: var(--color-background)
}

.sponsor-container .main-heading {
    text-align: center
}

.sponsor-container .main-heading .heading {
    display: inline-block;
    font-size: 3rem;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4);
    font-weight: 800
}

.sponsor-container .main-heading .description {
    width: 620px;
    margin-bottom: 64px;
    text-align: left;
    margin-top: 32px;
    color: rgba(255, 255, 255, 0.8)
}

.sponsor-container .main-heading .description p {
    margin-bottom: 30px;
    font-size: 1.3rem;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4)
}

.sponsor-container .main-heading .description .button {
    margin-top: 42px;
    margin-bottom: 52px;
    text-align: center
}

.sponsor-container .main-heading .description .button .primary-btn {
    text-align: center;
    padding: 20px 50px;
    box-shadow: 0 10px 10px -11px rgba(0, 0, 0, 0.15), 0 10px 10px -5px rgba(0, 0, 0, 0.2);
    font-size: 1.2rem;
    font-weight: 600
}

.sponsor-container h2 {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 20px;
    margin-top: 0;
    text-align: center
}

.sponsor-container p {
    line-height: 1.5
}

.sponsor-container ul li {
    line-height: 1.5
}

.sponsor-container .main-container {
    color: var(--color-black);
    background-color: #fbfbfb;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px 100px
}

.sponsor-container .audience-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px
}

.sponsor-container .audience-container .ad-container {
    width: 100%;
    padding: 40px;
    font-size: 1.2rem
}

.sponsor-container .audience-container .ad-container li {
    margin-bottom: 24px
}

.sponsor-container .audience-container .ad-container li img {
    margin-top: 12px;
    padding: 8px;
    box-shadow: rgba(0, 0, 0, 0) 0 0 0 0, rgba(0, 0, 0, 0) 0 0 0 0, rgba(0, 0, 0, 0) 0 1px 1px 0, rgba(60, 66, 87, 0.08) 0 0 0 1px, rgba(0, 0, 0, 0) 0 0 0 0, rgba(0, 0, 0, 0) 0 0 0 0, rgba(60, 66, 87, 0.13) 0 2px 5px 0;
    border-radius: 4px
}

.sponsor-container .audience-container .ad-container li ul {
    margin-top: 24px
}

.sponsor-container .audience-container .details-container {
    padding: 40px
}

.sponsor-container .audience-container .details-container li {
    font-size: 1.2rem;
    margin-bottom: 24px
}

.sponsor-container .audience-container .button-container {
    text-align: center;
    width: 100%;
    height: 100px;
    color: var(--color-white)
}

.sponsor-container .audience-container .primary-btn {
    padding: 20px 50px;
    box-shadow: 0 10px 10px -11px rgba(0, 0, 0, 0.15), 0 10px 10px -5px rgba(0, 0, 0, 0.2);
    font-size: 1.2rem;
    font-weight: 600;
    position: relative;
    top: 40px
}

.sponsor-container .benefits {
    margin-bottom: 50px
}

.sponsor-container .benefits h2 {
    margin-bottom: 12px;
    text-align: center
}

.sponsor-container .benefits h3 {
    margin-bottom: 10px;
    text-align: center
}

.sponsor-container .benefits .benefit-wrapper {
    display: flex;
    flex-direction: column
}

.sponsor-container .benefits .benefit-wrapper .item-group {
    display: flex;
    justify-content: space-between
}

.sponsor-container .benefits .benefit-wrapper .item {
    flex: 50%;
    min-height: 120px;
    margin-top: 10px;
    margin-bottom: 10px;
    box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    background: #fff;
    border: 0 solid #e2e8f0;
    padding: 20px;
    border-radius: 3px;
    display: flex;
    align-items: center
}

.sponsor-container .benefits .benefit-wrapper .item h5 {
    margin: 0 24px;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 1rem;
    color: var(--color-grey)
}

.sponsor-container .benefits .benefit-wrapper .item p {
    margin: 12px 0 0 24px;
    font-size: 1.2rem;
    line-height: 1.4
}

.sponsor-container .benefits .benefit-wrapper .item:nth-child(1) {
    margin-right: 20px
}

.sponsor-container .benefits .benefit-wrapper .item:nth-child(2) {
    margin-left: 20px
}

.sponsor-container ul.numbers {
    list-style: none;
    padding-left: 0;
    margin-bottom: 30px
}

.sponsor-container .number {
    color: var(--color-black);
    font-size: 1.3rem;
    font-weight: 600;
    display: inline-block
}

.sponsor-container .number.price {
    font-size: 2.3rem
}

.sponsor-container .number-supporting-text {
    color: var(--color-grey);
    font-size: 1rem;
    font-weight: 400
}

.sponsor-container .faq-container {
    padding: 40px 100px;
    color: var(--color-white);
    background-color: #272e31
}

.sponsor-container .faq-container .separator {
    width: 100px
}

.sponsor-container .faq-container .question {
    margin-bottom: 24px
}

.sponsor-container .faq-container h2 {
    margin-bottom: 12px;
    text-align: center
}

.sponsor-container .faq-container h4 {
    font-weight: 600;
    margin-bottom: 12px;
    color: var(--color-lightgrey);
    font-size: 1rem
}

.sponsor-container .faq-container p {
    margin-top: 8px;
    font-size: 1.2rem
}

.sponsor-container .contact-container {
    text-align: center;
    width: 100%;
    color: var(--color-white);
    background: #272e31;
    padding-bottom: 100px
}

.sponsor-container .contact-container h3 {
    font-size: 2rem;
    margin-bottom: 36px
}

.sponsor-container .contact-container .primary-btn {
    padding: 16px 32px
}

@media only screen and (max-width:1000px) {
    .sponsor-container .main-container {
        padding: 20px 0
    }
    .sponsor-container .audience-container {
        padding: 20px 0
    }
    .sponsor-container .item-group {
        flex-direction: column
    }
    .sponsor-container .item-group .item {
        margin: 0 !important;
        margin-bottom: 24px !important
    }
    .sponsor-container .ad-container img {
        height: auto !important;
        width: 100%
    }
    .sponsor-container .details-container,
    .sponsor-container .ad-container {
        width: 100vw
    }
}

.template-container .template_page {
    display: flex;
    margin: auto;
    padding: 50px;
    background: #fff3f3
}

.template-container .template_page .content {
    display: flex;
    flex-direction: column;
    margin: 20px 40px;
    flex: 1;
    margin-right: 100px
}

.template-container .template_page .content .content-title {
    margin: 10px 0;
    font-weight: 700;
    color: var(--color-black);
    font-size: 3rem
}

.template-container .template_page .content-subtitle {
    color: var(--color-grey);
    margin: 16px 0;
    font-size: 1.2rem;
    line-height: 1.4;
    font-weight: 400;
    max-width: 700px
}

.template-container .template_page .content-subtitle a {
    color: black;
    text-decoration: none
}

.template-container .template_page .content-subtitle a:hover {
    color: var(--color-black)
}

.template-container .template-content {
    display: flex;
    flex-direction: column;
    max-width: 1000px;
    margin: auto;
    padding: 50px
}

.template-container .template-content .content-title {
    text-align: center
}

.template-container .button {
    text-align: center
}

.template-container .tips-container {
    display: flex;
    flex-direction: column;
    max-width: 1200px;
    margin: auto;
    padding: 50px
}

.template-container .tips-container .content-title {
    margin: 0 20px;
    font-weight: 700;
    color: var(--color-black);
    font-size: 1.5rem
}

.template-container .tips-container .content-subtitle {
    color: var(--color-grey);
    margin: 16px 0;
    font-size: 1.2rem;
    line-height: 1.4;
    font-weight: 400
}

.companies-content {
    background: #fff3f3;
    display: flex;
    margin: auto;
    padding: 50px;
    flex-direction: column;
    align-items: center
}

.companies-content .companies-content-title {
    margin: 10px 0;
    font-weight: 600;
    color: var(--color-black);
    font-size: 2.5rem
}

.companies-content .companies-content-subtitle {
    color: var(--color-grey);
    margin: 16px 0;
    font-size: 1.2rem;
    line-height: 1.4;
    font-weight: 400;
    max-width: 850px
}

.companies-content .button-container {
    text-align: center;
    margin-top: 10px
}

.companies-content .button-container .button {
    padding: 15px 40px
}

.remote-company-list {
    margin: auto;
    padding: 20px 100px;
    display: grid;
    grid-gap: 20px;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    max-width: 1400px
}

.remote-company-list .list-card {
    display: flex;
    align-items: center;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2);
    border: 1px solid var(--color-lightgrey);
    margin-bottom: 20px;
    width: 100%;
    max-width: 300px;
    border-radius: 6px;
    flex-direction: column
}

.remote-company-list .list-card .logo-container {
    margin: 10px
}

.remote-company-list .list-card .logo-container .logo {
    height: 100px;
    width: 100px
}

.remote-company-list .list-card .name-container .name {
    font-size: 1.2rem;
    font-weight: 600
}

.remote-company-list .list-card .social-links-container {
    display: flex;
    flex-direction: row
}

.remote-company-list .list-card .jobs-container {
    margin: 10px
}

.remote-company-list .remote-job {
    margin: 20px
}

.margin {
    margin: 5px
}

@media only screen and (max-width:1200px) {
    .remote-company-list {
        grid-template-columns: 1fr 1fr 1fr
    }
}

@media only screen and (max-width:920px) {
    .remote-company-list {
        grid-template-columns: 1fr 1fr
    }
}

@media only screen and (max-width:640px) {
    .remote-company-list {
        grid-template-columns: 1fr
    }
}

.container {
    width: 100%
}

@media(min-width:640px) {
    .container {
        max-width: 640px
    }
}

@media(min-width:768px) {
    .container {
        max-width: 768px
    }
}

@media(min-width:1024px) {
    .container {
        max-width: 1024px
    }
}

@media(min-width:1280px) {
    .container {
        max-width: 1280px
    }
}

@media(min-width:1536px) {
    .container {
        max-width: 1536px
    }
}

.hidden {
    display: none
}

.block {
    display: block
}

.inline-block {
    display: inline-block
}

.inline {
    display: inline
}

.flex {
    display: flex
}

.inline-flex {
    display: inline-flex
}

.grid {
    display: grid
}

.object-contain {
    object-fit: contain
}

.object-cover {
    object-fit: cover
}

.overflow-hidden {
    overflow: hidden
}

.static {
    position: static
}

.fixed {
    position: fixed
}

.absolute {
    position: absolute
}

.relative {
    position: relative
}

.sticky {
    position: sticky
}

.flex {
    display: flex
}

.inline-flex {
    display: inline-flex
}

.flex-row {
    flex-direction: row
}

.flex-row-reverse {
    flex-direction: row-reverse
}

.flex-col {
    flex-direction: column
}

.flex-col-reverse {
    flex-direction: column-reverse
}

.flex-no-wrap {
    flex-wrap: nowrap
}

.flex-wrap {
    flex-wrap: wrap
}

.flex-wrap-reverse {
    flex-wrap: wrap-reverse
}

.items-stretch {
    align-items: stretch
}

.items-start {
    align-items: flex-start
}

.items-center {
    align-items: center
}

.items-end {
    align-items: flex-end
}

.items-baseline {
    align-items: baseline
}

.justify-center {
    justify-content: center
}

.flex-initial {
    flex: 0 1 auto
}

.flex-1 {
    flex: 1 1 4000px
}

.flex-auto {
    flex: 1 1 auto
}

.flex-none {
    flex: none
}

.flex-grow {
    flex-grow: 1
}

.flex-grow-0 {
    flex-grow: 0
}

.flex-shrink {
    flex-shrink: 1
}

.flex-shrink-0 {
    flex-shrink: 0
}

.grid {
    display: grid
}

.grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr))
}

.grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

.grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr))
}

.grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr))
}

.grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr))
}

.grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr))
}

.grid-cols-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr))
}

.grid-cols-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr))
}

.grid-cols-9 {
    grid-template-columns: repeat(9, minmax(0, 1fr))
}

.grid-cols-10 {
    grid-template-columns: repeat(10, minmax(0, 1fr))
}

.grid-cols-11 {
    grid-template-columns: repeat(11, minmax(0, 1fr))
}

.grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr))
}

.grid-cols-none {
    grid-template-columns: none
}

.gap-1 {
    gap: .25rem
}

.gap-2 {
    gap: .5rem
}

.gap-3 {
    gap: .75rem
}

.gap-4 {
    gap: 1rem
}

.pr-0 {
    padding-right: 0
}

.pr-1 {
    padding-right: .25rem
}

.pr-2 {
    padding-right: .5rem
}

.pr-3 {
    padding-right: .75rem
}

.pr-4 {
    padding-right: 1rem
}

.pr-5 {
    padding-right: 1.25rem
}

.pl-0 {
    padding-left: 0
}

.pl-1 {
    padding-left: .25rem
}

.pl-2 {
    padding-left: .5rem
}

.pl-3 {
    padding-left: .75rem
}

.pl-4 {
    padding-left: 1rem
}

.pl-5 {
    padding-left: 1.25rem
}

.mt-0 {
    margin-top: 0
}

.mt-1 {
    margin-top: .25rem
}

.mt-2 {
    margin-top: .5rem
}

.mt-3 {
    margin-top: .75rem
}

.mt-4 {
    margin-top: 1rem
}

.mt-5 {
    margin-top: 1.25rem
}

.mt-6 {
    margin-top: 1.5rem
}

.mt-8 {
    margin-top: 2rem
}

.mt-10 {
    margin-top: 2.5rem
}

.mt-12 {
    margin-top: 3rem
}

.mt-16 {
    margin-top: 4rem
}

.mt-20 {
    margin-top: 5rem
}

.mt-24 {
    margin-top: 6rem
}

.mt-32 {
    margin-top: 8rem
}

.mt-40 {
    margin-top: 10rem
}

.mt-48 {
    margin-top: 12rem
}

.mt-56 {
    margin-top: 14rem
}

.mt-64 {
    margin-top: 16rem
}

.mr-0 {
    margin-right: 0
}

.mr-1 {
    margin-right: .25rem
}

.mr-2 {
    margin-right: .5rem
}

.mr-3 {
    margin-right: .75rem
}

.mr-4 {
    margin-right: 1rem
}

.mr-5 {
    margin-right: 1.25rem
}

.mr-6 {
    margin-right: 1.5rem
}

.mb-0 {
    margin-bottom: 0
}

.mb-1 {
    margin-bottom: .25rem
}

.mb-2 {
    margin-bottom: .5rem
}

.mb-3 {
    margin-bottom: .75rem
}

.mb-4 {
    margin-bottom: 1rem
}

.mb-5 {
    margin-bottom: 1.25rem
}

.mb-6 {
    margin-bottom: 1.5rem
}

.mb-8 {
    margin-bottom: 2rem
}

.mb-10 {
    margin-bottom: 2.5rem
}

.mb-12 {
    margin-bottom: 3rem
}

.mb-16 {
    margin-bottom: 4rem
}

.ml-0 {
    margin-left: 0
}

.ml-1 {
    margin-left: .25rem
}

.ml-2 {
    margin-left: .5rem
}

.ml-3 {
    margin-left: .75rem
}

.ml-4 {
    margin-left: 1rem
}

.ml-5 {
    margin-left: 1.25rem
}

.ml-6 {
    margin-left: 1.5rem
}

.ml-8 {
    margin-left: 2rem
}

.ml-10 {
    margin-left: 2.5rem
}

.ml-12 {
    margin-left: 3rem
}

.ml-16 {
    margin-left: 4rem
}

.ml-20 {
    margin-left: 5rem
}

.ml-24 {
    margin-left: 6rem
}

.text-xs {
    font-size: var(--font-size-x-small)
}

.text-sm {
    font-size: var(--font-size-small)
}

.text-base {
    font-size: var(--font-size-medium)
}

.text-lg {
    font-size: var(--font-size-large)
}

.text-xl {
    font-size: var(--font-size-x-large)
}

.text-2xl {
    font-size: var(--font-size-xx-large)
}

.text-3xl {
    font-size: var(--font-size-xxx-large)
}

.font-normal {
    font-weight: 400
}

.font-medium {
    font-weight: 500
}

.font-semibold {
    font-weight: 600
}

.font-bold {
    font-weight: 700
}

.font-extrabold {
    font-weight: 800
}

.font-black {
    font-weight: 900
}

.text-center {
    text-align: center
}

.break-all {
    word-break: break-all
}

.shadow-xs {
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05)
}

.shadow-sm {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05)
}

.shadow {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)
}

.shadow-md {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)
}

.shadow-lg {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)
}

.shadow-xl {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)
}

.shadow-2xl {
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25)
}

.shadow-inner {
    box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06)
}

.shadow-outline {
    box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5)
}

.shadow-none {
    box-shadow: none
}

.appearance-none {
    appearance: none
}

.select-none {
    user-select: none
}