/*********** GLOBAL ***********/

* {
    /* text-align: center; */
    font-family: "Montserrat", san-serrif;
    scroll-behavior: smooth;
}

/*********** TYPOGRAPHY ***********/

.l-height-1 {
    line-height: 1;
}

h1 {
    font-size: 42px !important;
    padding-bottom: 1em;
}

h2 {
    font-size: 36px !important;
}

h3 {
    font-size: 24px !important;
}

h4 {
    font-size: 18px !important;
}

h5 {
    font-size: 14px !important;
}

p {
    font-size: 16px !important;
    text-align: left;
    font: normal normal normal 18px/30px Montserrat;
    letter-spacing: 0px;
    color: #666666;
}

/*********** END OF TYPOGRAPHY ***********/

/*********** ANIMATIONS ***********/

.navbar {
    transition: all 0.4s;
}

.navbar-nav .nav-item {
    margin-left: 2em;
    transition: all 0.2s ease;
    position: relative;
}

.navbar-nav .nav-item:after {
    content: "";
    display: block;
    width: 100%;
    height: 0;
    background-color: #cba052;
    position: absolute;
    bottom: 0;
    left: 0;
    transition: all 0.2s ease;
    opacity: 0;
    z-index: -1;
}

.navbar-nav .nav-item:hover:after {
    height: 100%;
    opacity: 1;
}

.navbar .nav-link {
    padding-left: 1em !important;
    padding-right: 1em !important;
}

/*********** END OF ANIMATIONS ***********/

body {
    overscroll-behavior: none;
}

.navbar {
    /* max-height: 100px; */
}

.goldBG {
    background-color: #cba052;
}

.greyBG {
    background: #373a36;
}

.bgColor1 {
    background-color: #373a36;
    border: 10px solid #ffffff;
}

.bgColor2 {
    background-color: #cba052;
    border: 10px solid #ffffff;
}

.bgColor3 {
    background-color: #f4f4f4;
}

button {
    text-transform: uppercase !important;
}

.btn-gold {
    padding: 0.5em 1em;
    background: #cba052;
    color: #ffffff;
    border: none;
    font-weight: 500;
    font-family: "Montserrat", light;
    display: inline-block;
}
.btn-gold:hover {
    background: #a38142;
    color: #ffffff;
    text-decoration: none;
}
.btn-white {
    padding: 1em 2.4em;
    color: #373a36;
    background: #ffffff;
    opacity: 1;
    border: none;
    font-size: 14px;
    font-weight: 700;
    display: inline-block;
}
.btn-white:hover {
    background: #d8d8d8ce;
    color: #373a36;
}
button.btn-white.btnSwitcher {
    background-color: transparent;
    color: #ffffff;
    font-size: 16px;
}

button.btn-white.btnSwitcher.active {
    /* background: #FFFFFF !important; */
    color: #373a36;
}

.btn-grey {
    padding: 1em 2.4em;
    color: #ffffff;
    background: #cccdcc;
    font-size: 14px;
    font-weight: 700;
    display: inline-block;
}
.btn-grey:hover {
    background: #cccdccbd;
    color: #ffffff;
}
.btn-transp {
    padding: 1em 2em;
    background: transparent;
    color: #cba052;
    border: 2px solid #cba052;
    opacity: 1;
    font-weight: 600;
    transition: all 0.2s ease;
    font-size: 0.9em;
}
.btn-transp:hover {
    color: #fff;
    border: 2px solid #cba052;
    background-color: #cba052;
    opacity: 1;
    text-decoration: none;
}

.btnSwitcher {
    width: 100%;
}
.ftfCol {
    padding-left: 5px !important;
    padding-right: 5px !important;
}

.titleGrey {
    color: #373a36;
    opacity: 0.2;
}

.titleGreySpan {
    color: #373a36 !important;
    opacity: 1;
}

.main-content {
    min-height: 80vh;
}

.potentiaNavbar,
.potentiaFooter {
    /* padding-left: 5% !important; */
    /* padding-right: 5% !important; */
    max-width: 100vw;
}
.potentiaFooter {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.headerContainer {
    display: contents;
}

.mainBanner h1 {
    position: absolute;
    bottom: 0;
    margin-left: 5%;
    color: #ffffff;
    font-weight: 300;
    text-shadow: 0px 3px 6px #0000004d;
}

.homeContainer,
.servicesContainer,
.canRegisterContainer,
.submitVacContainer,
.contactContainer,
.aboutContainer,
.applyContainer {
    margin: 0 5%;
}

#home .mainBanner {
    position: relative;
    background-image: linear-gradient(
            180deg,
            rgba(0, 0, 0, 0),
            rgba(0, 0, 0, 0.5)
        ),
        url("/img/coverImage.jpg");
    background-size: cover;
    height: 430px;
    padding: 0px !important;
    background-position: 50% 35%;
}
#submitVac .mainBanner {
    position: relative;
    background-image: linear-gradient(
            180deg,
            rgba(0, 0, 0, 0),
            rgba(0, 0, 0, 0.5)
        ),
        url("/img/03_Submit_a_vacancy_cover.jpg");
    background-size: cover;
    height: 30vw;
    padding: 0px !important;
    background-position-x: 50%;
    background-position-y: 59%;
}
#canRegister .mainBanner {
    position: relative;
    background-image: linear-gradient(
            180deg,
            rgba(0, 0, 0, 0),
            rgba(0, 0, 0, 0.5)
        ),
        url("/img/04_Register_as_a_candidate_cover.jpg");
    background-size: cover;
    height: 430px;
    padding: 0px !important;
    background-position-x: 50%;
    background-position-y: 59%;
}
#services .mainBanner {
    position: relative;
    background-image: linear-gradient(
            180deg,
            rgba(0, 0, 0, 0),
            rgba(0, 0, 0, 0.5)
        ),
        url("/img/Services cover image.jpg");
    background-size: cover;
    height: 430px;
    padding: 0px !important;
    background-position-x: 50%;
    background-position-y: 45%;
}
#contact .mainBanner {
    position: relative;
    background-image: linear-gradient(
            180deg,
            rgba(0, 0, 0, 0),
            rgba(0, 0, 0, 0.5)
        ),
        url("/img/ContactUs.png");
    background-size: cover;
    height: 430px;
    padding: 0px !important;
    background-position-x: 50%;
    background-position-y: 50%;
}
#apply .mainBanner {
    position: relative;
    background-image: linear-gradient(
            180deg,
            rgba(0, 0, 0, 0),
            rgba(0, 0, 0, 0.5)
        ),
        url("/img/Apply.jpg");
    background-size: cover;
    height: 430px;
    padding: 0px !important;
    background-position-x: 50%;
    background-position-y: 80%;
}
#about .mainBanner {
    position: relative;
    background-image: linear-gradient(
            180deg,
            rgba(0, 0, 0, 0),
            rgba(0, 0, 0, 0.5)
        ),
        url("/img/AboutUs.jpg");
    background-size: cover;
    height: 430px;
    padding: 0px !important;
    background-position-x: 50%;
    background-position-y: 32%;
}
#browse .mainBanner {
    position: relative;
    background-image: linear-gradient(
            180deg,
            rgba(0, 0, 0, 0),
            rgba(0, 0, 0, 0.5)
        ),
        url("/img/browse_vacancies.jpg");
    background-size: cover;
    height: 430px;
    padding: 0px !important;
    background-position-x: 50%;
    background-position-y: 40%;
}
.flexCol {
    flex-direction: column;
    margin-left: 0em !important;
}

.astrix {
    color: #cba052;
    opacity: 1 !important;
}

.checkboxAlign {
    display: flex !important;
    align-items: center !important;
    position: relative;
}

.checkboxAlign input {
    margin: 1em 1em 1em 0 !important;
}

.checkboxAlign label {
    margin: 0 !important;
}

label {
    color: #222222;
    opacity: 0.5;
}

/* select {
    -moz-appearance:none;
    -webkit-appearance:none;
    appearance:none;
    background: url(images/downarrow_blue.png) no-repeat right white;
} */

select,
input::placeholder,
textarea::placeholder {
    font-size: 0.95em !important;
    color: #959595;
}

.removeBtn {
    padding: 0.5em 1em !important;
}

/*********** NAVBAR ***********/

.navbar .nav-link {
    color: #fff;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus {
    color: #fff;
    text-decoration: none;
}

.navbar .navbar-brand {
    color: #fff;
}

.navbar .navbar-brand img {
    height: 70px;
    transition: all 0.2s ease;
}

.navbar.active .navbar-brand img {
    height: 70px;
}

.fa.fa-bars {
    color: #ffffff;
}

/* Change navbar styling on scroll */
.navbar.active {
    background: #373a36;
    box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.1);
}

.navbar.active .nav-link {
    color: #ffffff;
}

.navbar.active .nav-link:hover,
.navbar.active .nav-link:focus {
    /* color: #555; */
    text-decoration: none;
}

.navbar.active .navbar-brand {
    color: #555;
}

/*********** FORMS ***********/

.input-wrap {
    text-align: left;
    align-self: flex-start;
    margin-bottom: 2em;
}

input,
select,
textarea {
    padding: 0.5em 1em;
    border: none;
    text-align: left !important;
    min-height: 40px;
}

select {
    color: #959595;
}

select.passed {
    color: #000000 !important;
}

input[type="checkbox"] {
    min-height: unset !important;
}

.inputs {
    background: #f6f6f6;
    opacity: 1;
    width: 100%;
}

.inputs.failed {
    outline: 1px #dc3545 solid;
}

.uploadDocs {
    max-width: 450px;
}
input[type="checkbox"] {
    padding: 0.4em !important;
    -webkit-appearance: none;
    background: #f6f6f6;
    outline-offset: 0.3em;
    margin-right: 0.5em;
    margin-top: 1em;
    margin-left: 0.5em;
    border: 0.5em solid #f6f6f6;
}

input[type="checkbox"]:checked {
    display: inline-block;
    background-color: #cba052;
}

.gridLinks {
    width: 33.3%;
}
.gridWidth {
    min-width: 100%;
}

button:focus,
select:focus,
input:focus {
    outline: none !important;
}

/* error messages */
span.help-block.form-error {
    color: #ec0000a6;
    padding: 0.1em;
    border-radius: 3px;
}
.responseSuccess {
    margin-top: 1em;
    background-color: #00ec5a8f;
    padding: 0.2em;
    border-radius: 3px;
}

/*********** GLOBAL END ***********/

/* Home */

.ampPotential h2 {
    color: #ffffff !important;
    opacity: 1;
    text-align: center !important;
    font-weight: 300 !important;
}
.ampPotential p {
    color: #ffffff;
    opacity: 0.6;
    text-align: center;
    font-size: 1.2em !important;
    font-weight: 300;
    line-height: 1.2;
    min-height: 3em;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ampPotential a {
    padding: 1em 2em;
}

.ampPotential .block {
    min-height: 300px;
}

.ampPotential .block:hover p {
    opacity: 1;
}

#home h1 {
    color: #373a36 !important;
    font-weight: 300 !important;
}

#home section,
#services section,
#canRegister section,
#submitVac section,
#apply section,
#contact section {
    padding: 4em 0px;
}

#home h2,
#home h2 span {
    text-align: left;
    display: block;
    color: #373a36;
    font-weight: 400;
}

.ftfRow {
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right: 0em;
    padding-left: 0em;
    background-color: #cba052;
    margin-bottom: 1em;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.maxContainer {
    max-width: 870px !important;
    margin-left: auto;
    margin-right: auto;
}
.AMPH1 {
    text-align: center;

    letter-spacing: 8.4px;
    color: #373a36;
    text-transform: uppercase;
    opacity: 1;
}

.vacancies input {
    text-align: left !important;
}

.block {
    border: 10px solid #ffffff;
    padding: 1em;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.solution {
    min-height: 350px;
    align-items: flex-start;
    justify-content: flex-end;
}

.solution h2 {
    font-weight: 300 !important;
    text-align: left;
    color: #ffffff !important;
    transition: all 0.2s ease;
}

.solution.solutionSmall {
    min-height: 180px;
}

.solution.solutionSmall h2 {
    font-size: 1.5em !important;
    margin-bottom: 0;
}

.aboutTitle {
    /* margin-top: 3em; */
    font-weight: 300;
}

.aboutSubTitle {
    text-align: left;
    font: normal normal normal 24px/36px Montserrat;
    letter-spacing: 0px;
    color: #373a3699;
    opacity: 1;
}

/*********** SERVICES ***********/

.servicesIntro {
    max-width: 800px;
    margin: auto;
}
.servicesIntro h1 {
    margin-top: 2em;
    padding-bottom: 0;
    font-weight: 300;
    font-size: 42px !important;
}

#services p {
    font-size: 14px !important;
}

#services #humanRecourcesGold h2,
#services #humanRecourcesGrey h2 {
    font-size: 24px !important;
    padding-right: 5em;
}

#services #humanRecourcesGold,
#services #humanRecourcesGrey {
    min-height: 150px !important;
    max-height: 150px !important;
    border: none;
    box-shadow: 0px 6px 12px #00000033;
}

#services a.gridLinks {
    padding: 10px;
}

.servicesIntroSub {
    text-align: center;
    font: normal normal normal 24px/36px Montserrat;
    letter-spacing: 0px;
    color: #373a36;
    opacity: 1;
}

.servicesTitle {
    text-align: left;
    font: normal normal normal 36px/42px Montserrat;
    letter-spacing: 0px;
    color: #373a36;
    opacity: 1;
}
.servicesSubTitle {
    text-align: left;
    font: normal normal normal 24px/36px Montserrat;
    letter-spacing: 0px;
    color: #373a3699;
    opacity: 1;
    margin-bottom: 1.25em;
}
.recTitle {
    margin-left: 33px;
}
.workWithUs {
    background: #373a36 0% 0% no-repeat padding-box;
    padding: 0.5em 1em !important;
    opacity: 1;
    position: sticky;
    bottom: 0;
    font-size: 14px;
    z-index: 5;
}
.workWithUs p {
    text-align: right;
    font: normal normal normal 18px/30px Montserrat;
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 0.45;
}

.selctedFiles {
    text-align: left;
}

/*********** APPLY ***********/

#apply *:not(button):not(label) {
    text-align: left !important;
}

#apply h3 {
    color: #373a36 !important;
}

#apply .applyRight h3 {
    color: #373a3699;
}

#apply h5 {
    color: #0000006e !important;
}

#apply input::placeholder,
#apply textarea::placeholder {
    color: #0000006e !important;
}

#apply section .container-fluid {
    margin-bottom: 2.5em;
}

#apply .btn-gold {
    width: 100%;
    text-transform: uppercase;
}

#apply .applyLeftBlock {
    background-color: #373a36;
    padding: 2em;
}

#apply .applyLeftBlock h4 {
    color: #cba052;
}

#apply .applyLeftBlock h5 {
    color: #fff !important;
    opacity: 0.8;
    margin-bottom: 1em;
}

#apply .applyLeftBlock h5 span {
    opacity: 0.5;
    font-size: 0.8em;
    color: #fff !important;
}

#apply .applyLeftBlock input {
    background-color: #000;
    color: #fff;
    opacity: 0.2;
    margin-bottom: 1em;
}

.checkboxSection label {
    color: #666666 !important;
    opacity: 1 !important;
    font-size: 14px !important;
}

.checkboxSection label#upload-btn {
    font-size: inherit !important;
    width: 100% !important;
    text-align: center !important;
    color: #fff !important;
    cursor: pointer;
    margin-top: 1em;
}

#submitVac .checkboxSection label#upload-btn {
    margin-top: calc(24px + 0.5rem) !important;
}

#canRegister .checkboxSection label#upload-btn {
    max-width: 30em !important;
}

.checkboxSection .inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

#apply .checkboxSection a,
.checkboxAlign a {
    text-decoration: underline;
    color: #666666 !important;
}

#apply .applyRightBlock {
    background-color: #cba052;
    padding: 2em;
}

#apply .applyRightBlock h4,
#apply .applyRightBlock p {
    color: #fff;
    opacity: 0.6;
}

/*********** SUBMIT A VACANCY ***********/

#submitVac:not(button) {
    color: #373a36;
}

#submitVac .filepond--file-action-button {
    margin-top: 0em;
}

.aboutBusiness {
    padding: 1em 0 !important;
}
.aboutVacancy {
    padding-top: 0em !important;
}

/*********** CANDIDATE REG ***********/

#canRegister h2 {
    color: #373a36 !important;
    text-align: left !important;
}

.canRegisterContainer .uploadDocs {
    width: 100%;
}

.registrationPin {
    text-align: left;
    background: #373a36;
    padding: 2em !important;
}

.welcomeBack {
    text-align: left;
    color: #cba052;
    opacity: 1;
    font-weight: 700;
}
.qrp {
    text-align: left;
    background: #000000;
    opacity: 0.2;
}
.qrp::placeholder {
    color: #ffffff;
    text-align: left;
    opacity: 0.4;
}
.completeReg {
    text-align: left;
    font: normal normal normal 14px/18px Montserrat;
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 0.8;
}
.completeRegSmall {
    text-align: left;
    font: normal normal normal 10px/16px Montserrat;
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 0.5;
}

/*********** BROWSE ***********/

#browse .allIndustries {
    color: #666666 !important;
}

#browse .allIndustries p {
    opacity: 0.5;
}

#browse .allIndustries .row > div {
    margin-bottom: 2em;
}

.browseSelect {
    background: #f4f4f4 0% 0% no-repeat padding-box;
    opacity: 1;
    padding-left: 5% !important;
    padding-right: 5% !important;
}

.allIndustries {
    background: #ffffff 0% 0% no-repeat padding-box;
    opacity: 1;
    padding: 5% !important;
}
.notifiedTitle {
    text-align: left;
    font: normal normal bold 24px/29px Montserrat;
    letter-spacing: 0px;
    color: #333333;
    text-transform: uppercase;
    opacity: 0.7;
    margin-bottom: 0;
    font-size: 18px !important;
}
.notifiedRow {
    background: #f4f4f4 0% 0% no-repeat padding-box;
    opacity: 1;
    padding: 1.25em 5% !important;
}

#browse .getnotifiedRight .btn-gold {
    font-size: 14px;
    padding: 1em 1.5em;
}

/*********** Contact Us ***********/

#contact h2 {
    text-align: left;
    font-weight: 300;
}

.contactContainer h2 {
    text-align: left;
    font: normal normal normal 36px/42px Montserrat;
    letter-spacing: 0px;
    color: #373a36;
    opacity: 1;
}

/*********** FOOTER ***********/

footer {
    position: static;
    left: 0;
    bottom: 0;
    width: 100%;
    background-color: #373a36;
    color: #ffffff;
}
.footer-menu {
    list-style: none;
}
.footer-menu a {
    list-style: none;
    text-align: left !important;
    font: normal normal normal 14px/18px Montserrat;
    letter-spacing: 0px;
    color: #fff;
    opacity: 0.7;
    margin-top: 5px;
}
.footer-menu a:hover {
    /* color: #9e9e9ec9; */
}
.footerDetails {
    text-align: right;
    font: normal normal normal 14px/20px Montserrat;
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 0.32;
}
.footerInfo {
    text-align: right;
    font: normal normal bold 14px/20px Montserrat;
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 0.6;
}

.footerContact a,
.contactTableCont a {
    color: inherit;
    transition: all 0.2s ease;
}

.footerContact a:hover,
.contactTableCont a:hover {
    color: #fff;
    text-decoration: none;
}

.footerContact a .footerInfo,
.contactTableCont a .footerInfo {
    transition: all 0.2s ease;
}

.footerContact a:hover .footerInfo,
.contactTableCont a:hover .footerInfo {
    opacity: 1;
}

.mobiCenter {
    text-align: end;
}
.logoFooter {
    width: 200px;
    height: 69px;
    margin-top: -15px;
}

.copyRight {
    background-color: #000000;
    opacity: 0.3;
}
.contactTable {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    text-align: end;
    margin-bottom: 15px;
}
.contactTableCont {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    text-align: left;
    margin-bottom: 15px;
}
.contTitle {
    text-align: left;
    font: normal normal normal 16px/22px Montserrat;
    letter-spacing: 0px;
    color: #222222;
    opacity: 0.55;
}
.conSubTitle {
    text-align: left;
    font: normal normal normal 18px/30px Montserrat;
    letter-spacing: 0px;
    color: #666666;
    opacity: 1;
}
.social-links img {
    max-width: 32px;
}
.footer-copyright {
    /* margin-top: 5px; */
    text-align: left;
    font: normal normal normal 10px/20px Montserrat;
    letter-spacing: 0.64px;
    color: #ffffff;
    text-transform: uppercase;
    opacity: 0.4;
}

/* Modal */

.modalCloseBtn {
    position: absolute;
    top: 15px;
    right: 15px;
}
.modal-width {
    max-width: 685px !important;
}

#vacancyModal .modalContainer {
    padding: 2em !important;
}

.modalContainer p {
    font-size: 14px !important;
}

.modalContent {
}
.modalH3 {
    text-align: left;
    font: normal normal normal 18px/30px Montserrat;
    letter-spacing: 0px;
    color: #666666;
    opacity: 1;
}
.modalP {
    text-align: left;
    font: normal normal normal 16px/22px Montserrat;
    letter-spacing: 0px;
    color: #666666;
    opacity: 0.5;
}
.myModalFooter {
    background: #f4f4f4 0% 0% no-repeat padding-box;
    opacity: 1;
}

.myModalFooter .btn-gold {
    font-size: 14px;
    padding: 1em 1.25em;
}

.socialImgModal img {
    max-width: 32px;
}
.footerSmall {
    font-size: 75%;
}

.fileName {
    display: flex;
}

.fileName span {
    font-size: 1.4em;
    line-height: 1.1;
}

.fileName span a {
    color: red !important;
    text-decoration: none !important;
}

.fileName span:hover {
    cursor: pointer;
}

/*********** MEDIA QUERIES ***********/

/* Change navbar styling on small viewports */
@media (max-width: 991.98px) {
    .navbar {
        background: #373a36;
    }

    .navbar .navbar-brand,
    .navbar .nav-link {
        color: #ffffff;
    }
    .navbar-brand img {
        max-width: 200px;
        height: auto !important;
    }
    .logoFooter {
        max-width: 200px;
    }
    .uploadDocs {
        width: 100%;
    }
    #humanRecourcesGold h2,
    #humanRecourcesGrey h2 {
        font-size: 24px !important;
    }
    iframe#gmap_canvas {
        width: 300px;
    }
    .absoluteHeaderMobi {
        margin: auto;
        color: #fff;
    }
    .absoluteHeaderMobi a {
        color: #fff !important;
        font-size: 12px;
        text-transform: uppercase;
    }
    .absoluteHeaderMobi a:hover {
        color: #fff;
    }
}

@media (min-width: 992px) {
    .navbar-nav .nav-item.active:after {
        /* border-bottom: 3px solid #CBA052; */
        height: 3px;
        opacity: 1;
    }
    .absoluteHeader {
        max-height: 25px;
        /* margin-bottom: -25px; */
        background-color: #0000002e;
        /* opacity: 0.2; */
        z-index: 1089;
        position: absolute;
        top: 0;
        width: 100%;
        padding: 5px 2em;
        text-align: right;
        color: #fff;
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }
    .absoluteHeader a {
        color: #fff !important;
        font-size: 12px;
        text-transform: uppercase;
        opacity: 0.8;
        font-weight: 600;
    }
    .absoluteHeader a:hover {
        color: #fff;
        text-decoration: none;
        opacity: 1;
    }
    .absoluteHeaderMobi {
        display: none;
    }
}

body.showModal {
    overflow: hidden;
    z-index: -1;
}

.modal {
    display: block;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
    z-index: -1;
}

body.showModal .modal {
    opacity: 1;
    visibility: visible;
    z-index: 1040;
}

body.showModal .modal::before {
    content: "";
    display: block;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.2);
}

.applyRight {
    display: flex;
    flex-direction: column;
}
.applyRight:before {
    content: "";
    display: block;
    flex-grow: 1;
}
.applyRight > .applyRightContainer {
    position: sticky;
    bottom: 50px;
}

.form-control {
    border-color: transparent;
    padding: 0.875rem 1rem;
    height: auto;
    border-radius: 0;
}

.form-control::placeholder {
    color: #ccc;
}

.form-group {
    position: relative;
}

span.help-block.form-error {
    position: absolute;
    bottom: -12px;
    right: 15px;
    font-size: 0.7em;
    color: #fff;
    background-color: #cba052;
    padding: 0 0.5em;
}

.checkboxAlign span.help-block.form-error {
    left: 45px;
    right: inherit;
}

.form-control:focus {
    border-color: #cba052;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgb(203 160 82 / 26%);
}

.block:hover {
    text-decoration: none !important;
    transform: translateY(-3px);
}

.block * {
    transition: all 0.2s ease;
}

.block:hover * {
    text-decoration: none !important;
    transform: translateY(-3px);
}

.buttonSwitch {
    border: 4px solid #cba052;
    position: relative;
}

.buttonSwitch button {
    z-index: 10;
}

.switcher {
    width: 50%;
    position: absolute;
    z-index: 5;
    height: 100%;
    background-color: #fff;
    transition: all 0.2s cubic-bezier(0.23, -0.18, 0.77, 1.3);
    left: 0;
    top: 0;
}

.switch2 .switcher {
    left: 50%;
}

footer a {
    font-weight: 500;
    color: #fff;
    opacity: 0.6;
    font-size: 0.9em;
    line-height: 0.9;
    transition: all 0.2s ease;
}

footer a:hover {
    opacity: 1;
    color: #fff;
    text-decoration: none;
}

footer h5 {
    opacity: 0.4;
    font-weight: 300;
}

.footer-menu li {
    margin-bottom: 0.3em;
}

.footer-menu a:hover {
    opacity: 1;
}

.error {
    width: 100px;
}

#browse .allIndustries p {
    line-height: 1.5;
}

.vacancy {
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0);
    transition: all 0.2s ease;
}

.vacancy:hover {
    cursor: pointer;
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
    transform: translateY(-4px);
}

.vacancy h4 {
    transition: all 0.2s ease;
}

.vacancy:hover h4 {
    color: #cba052;
}

.modal-content {
    border-radius: 0;
    border: 0;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.input-wrap span.help-block.form-error {
    bottom: -12px;
    top: auto;
}

.contactTableCont a:hover {
    color: #cba052;
}

#submitVac .uploadInput {
    padding-top: 32px;
}

/* TOOLTIP CSS */

.tooltip-inner {
    max-width: 400px !important;
    background-color: #cba052 !important;
}

.bs-tooltip-top .arrow::before,
.arrow {
    border-top-color: #cba052 !important;
}

/* END OF TOOLTIP CSS */

@media (min-width: 758px) and (max-width: 1480px) {
    .errorMini {
        bottom: -30px !important;
    }
}

@media (max-width: 768px) {
    .switcher {
        width: 100%;
        height: 50%;
    }
    .switch2 .switcher {
        top: 50%;
        left: 0;
    }
    .solution {
        min-height: 180px;
    }
    .solution h2 {
        font-size: 1.6em !important;
    }
    .mainBanner {
        margin-top: 93px;
        background-position: center;
        height: 40vh !important;
    }

    #about .mainBanner {
        margin-top: 85px;
    }

    button.btn-white.btnSwitcher {
        font-size: 12px;
    }
    .servicesIntro h1 {
        font-size: 32px !important;
    }
    .servicesIntroSub {
        font: normal normal normal 18px/32px Montserrat;
    }
    .recTitle {
        margin-left: 0;
    }

    #submitVac .uploadInput {
        padding-top: unset;
    }
}

.vs__dropdown-toggle {
    background: #f6f6f6 !important;
    border: 0 !important;
    border-radius: 0 !important;
    cursor: pointer !important;
}

.vs__selected {
    border: 0 !important;
    background-color: #cba052 !important;
    color: #fff !important;
    padding: 0 0.55em !important;
    line-height: 1 !important;
    font-size: 0.8em;
    height: 30px;
}

.vs__selected svg path {
    fill: #fff !important;
}

.vs__open-indicator:before {
    content: "";
    width: 0;
    height: 0;
    display: inline-block;
    border: 6px solid transparent;
    border-top-color: black;
    position: absolute;
    left: 0;
    top: calc(50% - 4px);
}

.vs__open-indicator {
    width: 12px !important;
    padding: 0 !important;
    display: block !important;
    height: 100% !important;
    margin-right: 8px !important;
}

.vs__selected-options {
    align-items: center;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url(/img/arrow.svg) !important;
    background-size: 10px !important;
    background-repeat: no-repeat !important;
    background-position: calc(100% - 14px) 50% !important;
}

.btn-link {
    color: #cba052;
    padding-left: 0;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
}

.btn-link img {
    width: auto;
    height: 18px;
    margin-right: 0.4em;
    transition: all 0.2s ease;
}

.btn-link:hover {
    color: #cba052;
    filter: brightness(0%);
    text-decoration: none;
}

.btn-link:hover img {
    transform: translateY(-1px);
}

.vdp-datepicker,
.vdp-datepicker input {
    background-color: #f6f6f6;
    width: 100%;
}

.vdp-datepicker__calendar .cell:hover {
    border-color: #cba052 !important;
}

.vdp-datepicker__calendar .cell.selected,
.vdp-datepicker__calendar .cell.selected:hover {
    background-color: #cba052 !important;
    color: #fff;
    border-color: #cba052 !important;
}

.vdp-datepicker__calendar {
    border: 0 !important;
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
    text-align: center !important;
}

#apply .vdp-datepicker__calendar * {
    text-align: center !important;
}

.vdp-datepicker:before {
    content: "";
    width: 0;
    height: 0;
    display: inline-block;
    border: 5px solid transparent;
    border-top-color: black;
    position: absolute;
    right: 14px;
    top: calc(50% - 4px);
    transition: all 0.2s ease;
    pointer-events: none;
}

.vdp-datepicker input:hover {
    cursor: initial;
}

.characterCount {
    font-size: 10px;
    position: absolute;
    bottom: -22px;
    left: 15px;
    text-transform: uppercase;
    opacity: 0.5;
}

.filepond--panel-root {
    background: #fdfdfd;
    border-radius: 0 !important;
}

.filepond--root .filepond--list-scroller {
    margin: 1.5em 0 0 !important;
}

.filepond--drop-label {
    align-items: flex-start !important;
    min-height: 2.5em !important;
}

.filepond--drop-label.filepond--drop-label label {
    color: #fff !important;
    font-family: "Montserrat", light;
    font-weight: 400;
    font-size: 16px !important;
    opacity: 1 !important;
    background: #cba051;
    text-transform: uppercase;
    width: 100%;
    cursor: pointer;
}

.filepond--root {
    margin-bottom: 1em !important;
}

.filepond--credits {
    visibility: hidden;
}

#canRegister .filepond--wrapper {
    max-width: 750px;
}

.input-wrap .btn-sm {
    width: auto !important;
}

/* multiselect */

div.multiselect {
    box-sizing: border-box;
    padding: 0.5em 1em 0em 1em;
    min-height: 0px !important;
    color: rgb(160, 153, 153);
}

ul.multiselect__content {
    list-style: none;
    display: flex !important;
    flex-direction: column;
    gap: 8px;
    padding: 4px !important;
}

ul.multiselect__content li {
    /* padding: 4px; */
    border-radius: 4px;
    cursor: pointer;
    /* background-color: #cba051; */
    /* color: #fff !important; */
    overflow: hidden;
}
.multiselect__tags {
    min-height: auto !important;
    padding: 0px !important;
    border-radius: 4px !important;
    border: none !important;
    background-color: transparent !important;
}

.multiselect__tags:active {
    background-color: transparent !important;
}

.multiselect__input,
.multiselect__single {
    background-color: transparent !important;
}

.multiselect__content-wrapper {
    background-color: transparent !important;
    border: none !important;
    border-radius: 4px;
    padding: 0px;
    position: static !important;
}

.multiselect__tag {
    background-color: #cba051 !important;
    color: #fff !important;
}

.multiselect__tags-wrap {
    padding: 4px;
    gap: 8px;
    height: max-content;
    margin-bottom: 4px;
}

.multiselect__option--highlight,
.multiselect__option--highlight:after {
    background-color: #373a36 !important;
}

.multiselect__option--selected {
    background-color: #cba051 !important;
    color: white !important;
}

.multiselect__option--selected:after {
    color: white !important;
}

.multiselect__tag-icon:after {
    color: white !important;
}

.multiselect__tag-icon:focus,
.multiselect__tag-icon:hover {
    background-color: transparent !important;
}