/**
 * buttons, links, text, title - default settings
 */

:root {
    --primary:#45B29B;
}
body.dahlia {
    --primary:#b3071b;
}
body, h1, h2, h3, h4, h5, li, p, span, label, input, textarea, a, a:hover {
    color: #757575;
    font: normal normal normal 18px/36px OpenSans-Regular, Arial Regular, sans-serif;
    hyphens: auto;
}
img {
    height: auto;
    max-width: 100%;
    vertical-align: top;
}
a,
circle,
svg,
.buttonWrapperPrimary,
.buttonWrapperPrimary div::after,
.buttonWrapperThird,
.buttonWrapperThird div::after,
.buttonWrapperCancel,
.aboutUsImgButton,
.benefitBack,
.slick-dots li button:before,
.slick-arrow,
.similarJob {
    transition: all ease-in-out 0.3s;
    -moz-transition: all ease-in-out 0.3s;
    -o-transition: all ease-in-out 0.3s;
    -webkit-transition: all ease-in-out 0.3s;
}
a {
    display: inline-block;
    text-decoration: none;
}
svg {
    display: block;
    height: auto;
    max-width: 100%;
}
.svgColor1 svg {
    fill: #757575;
}
.svgColor2 svg {
    fill: var(--primary);;
}
.svgColor2:hover svg {
    fill: #757575;
}
.svgColor3 svg {
    fill: #FFF;
}
.svgColor3:hover svg {
    fill: #757575;
}
.svgColor4 circle {
    fill: var(--primary);;
}
.svgColor4 path {
    fill: #FFF;
}
.svgColor4:hover circle {
    fill: #757575;
}
h1 {
    color: var(--primary);;
    font: normal normal normal 42px/57px OpenSans-Bold, Arial Regular, sans-serif;
    margin: 0;
    padding: 0 0 15px;
}
h2 {
    color: var(--primary);;
    font: normal normal normal 40px/55px OpenSans-Light, Arial Regular, sans-serif;
    margin: 0;
    padding: 0 0 50px;
    text-align: center;
}
h3 {
    color: #333;
    font: normal normal normal 30px/41px OpenSans-Light, Arial Regular, sans-serif;
    margin: 0;
    padding: 0 0 20px;
}
h4 {
    color: #FFF;
    font: normal normal normal 42px/57px OpenSans-Bold, Arial Regular, sans-serif;
    margin: 0;
    padding: 0 0 10px;
}
.statement {
    color: var(--primary);;
    font: normal normal normal 60px/73px VladimirScript-Regular, Arial Regular, sans-serif;
    margin-top: 50px;
}
.topicsText1 {
    font: normal normal normal 24px/33px OpenSans-Regular, Arial Regular, sans-serif;
}
.topicsText2 {
    font: normal normal normal 20px/27px OpenSans-Regular, Arial Regular, sans-serif;
}
.topicsText3 {
    font: normal normal normal 18px/24px OpenSans-Light, Arial Regular, sans-serif;
}
.similarJobText {
    font: normal normal normal 24px/33px OpenSans-Light, Arial Regular, sans-serif;
}
iframe {
    height: 100%;
    position: absolute;
    width: 100%;
}
ul {
    margin: 0;
    padding-left: 24px;
}
li {
    line-height: 24px;
    list-style-type: disc;
    padding-bottom: 10px;
}
li::marker {
    font-size: 25px;
}
li:last-child {
    padding-bottom: 0;
}
.bar,
.barBurger {
    background-color: var(--primary);;
    border-radius: 5px;
    height: 3px;
    left: 0;
    position: absolute;
    top: 0;
    width: 24px;
}
.bar.one {
    top: 8px;
    transform: rotate(-135deg);
}
.bar.two {
    top: 8px;
    transform: rotate(-225deg);
}
.barBurger.two {
    top: 8px;
}
.barBurger.three {
    top: 16px;
}
.bar.cancelButton1 {
    transform: rotate(-135deg);
}
.bar.cancelButton2 {
    transform: rotate(-225deg);
}
.buttonWrapper {
    display: flex;
    justify-content: flex-start;
}
.buttonWrapperPrimary,
.buttonWrapperThird {
    background-color: var(--primary);;
    border: none;
    border-radius: 50px;
    cursor: pointer;
    max-width: max-content;
    white-space: nowrap;
}
.buttonWrapperPrimary div::after,
.buttonWrapperThird div::after {
    content: "→";
    display: inline-block;
    font-size: 22px;
    padding-left: 8px;
}
.buttonWrapperThird div::after {
    color: var(--primary);;
}
.buttonWrapperPrimary:hover div::after,
.similarJob:hover .buttonWrapperThird div::after {
    transform: translate(5px);
}
.buttonWrapperPrimary a {
    color: #FFF;
    display: block;
    padding: 15px 30px;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
}
.buttonWrapperPrimary a,
.buttonWrapperPrimary a:hover {
    font: normal normal normal 14px/19px OpenSans-SemiBold, Arial Regular, sans-serif;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.buttonWrapperPrimary:hover,
.buttonWrapperCancel:hover {
    background-color: #757575;
}
.buttonWrapperSecondary a {
    color: var(--primary);;
    display: grid;
    gap: 15px;
    grid-template-columns: 1fr auto;
}
.buttonWrapperSecondary a:hover,
.similarJob:hover .buttonWrapperThird div::after {
    color: #757575;
}
.buttonWrapperSecondary a:hover svg {
    fill: #757575;
}
.buttonWrapperSecondary a div:last-child {
    align-items: center;
    display: flex;
}
.buttonWrapperThird {
    background-color: initial;
    color: var(--primary);;
    font: normal normal normal 14px/19px OpenSans-Bold, Arial Regular, sans-serif;
    text-transform: uppercase;
}
.buttonWrapperCancel {
    background-color: var(--primary);;
    border-radius: 50px !important;
    cursor: pointer;
    height: 40px;
    position: absolute;
    right: -20px;
    top: -20px;
    width: 40px;
}
.buttonWrapperCancel .bar {
    background-color: #FFF;
    left: 8px;
    top: 18px;
    width: 25px;
}
.mobile {
    display: none;
}
/**
* stickyHeader
*/
#stickyHeader {
    display: none;
    margin: 0;
    max-width: initial;
    padding: 0;
    position: fixed;
    width: 100%;
    z-index: 2;
}
#stickyHeaderWrapper {
    align-items: center;
    display: grid;
    gap: 15px 40px;
    grid-template-columns: auto 1fr auto;
    margin: 0 auto;
    max-width: 1920px;
    padding: 15px 75px;
}
.backgroundColor {
    background-color: #FFF;
}
#stickyHeaderJobTitleWrapper,
#stickyNavigationMenuWrapper {
    align-items: center;
    display: flex;
}
#stickyHeaderJobTitleWrapper h1 {
    font: normal normal normal 35px/45px OpenSans-Bold, Arial Regular, sans-serif;
    margin: 0;
    padding: 0;
}
#stickyNavigationMenu {
    cursor: pointer;
    display: block;
    height: 19px;
    overflow: hidden;
    position: relative;
    width: 24px;
}
#stickyNavigationMenuBurger {
    display: block;
}
#stickyNavigationMenuCross {
    display: none;
}
#stickyNavigationList {
    background-color: #FFF;
    display: none;
}
#stickyNavigationList h1 {
    font: normal normal normal 26px/32px OpenSans-Bold, Arial Regular, sans-serif;
}
#stickyNavigationList h2 {
    font: normal normal normal 20px/24px OpenSans-Light, Arial Regular, sans-serif;
    padding: 0 0 25px;
}
#stickyNavigationList .topicsText1 {
    font: normal normal normal 16px/20px OpenSans-Regular, Arial Regular, sans-serif;
}
#stickyNavigationList .buttonWrapperPrimary {
    margin: 0 auto;
}
.stickyNavigationListWrapper {
    padding: 25px;
}
#stickySocialMediaWrapper {
    height: 100vh;
}
.stickyNavigationListWrapper .socialMediaWrapper {
    padding-bottom: 15px;
}
.stickyNavigationListWrapper svg {
    max-height: 28px;
    max-width: 28px;
}
.centerWrapper {
    text-align: center;
}
nav {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    padding-bottom: 15px;
}
nav a {
    font: normal normal normal 16px/20px OpenSans-SemiBold, Arial Regular, sans-serif;
    text-transform: uppercase;
    white-space: nowrap;
}
nav a:hover {
    font: normal normal normal 16px/20px OpenSans-SemiBold, Arial Regular, sans-serif;
}
/**
* header
*/
header {
    height: 800px;
    position: relative;
}
header .columnWrapper {
    display: grid;
    gap: 0 50px;
    grid-template-columns: auto 1fr;
}
#headerBackground {
    background-position: center center;
    background-size: cover;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
#headerWrapper {
    display: grid;
    gap: 15px 40px;
    grid-template-columns: 2fr 3fr auto;
    padding: 15px 75px;
}
#headerWrapper > div {
    align-items: center;
    display: grid;
    position: relative;
}
.dahlia #headerWrapper {
    background-color:rgba(255,255,255,0.85);
    position: relative;
}
.logoWrapper img {
    max-height: 60px;
}
#navigationWrapper {
    display: grid;
    gap: 15px 50px;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}
#navigationWrapper a {
    font: normal normal normal 18px/24px OpenSans-SemiBold, Arial Regular, sans-serif;
    text-transform: uppercase;
    white-space: nowrap;
}
#navigationWrapper a:hover {
    color: var(--primary);;
}
#headerTopicsWrapper {
    background-color: #FFF;
    border-bottom-left-radius: 18px;
    border-top-left-radius: 18px;
    min-width: 800px;
    opacity: 0.85;
    padding: 25px 25px 0;
    position: absolute;
    right: 0;
    top: 50%;
}
/**
 * main
 */
header, main {
    margin: 0 auto;
    max-width: 1920px;
    padding: 0;
    width: 100%;
}
.backgroundWrapper1 {
    background-color: #F5F5F5;
}
.backgroundWrapper2 {
    background-color: var(--primary);;
}
.backgroundWrapper2 h2 {
    color: #FFF;
}
section {
    margin: 0 auto;
    max-width: 1390px;
    padding: 50px 25px 50px;
    position: relative;
}
.contentSpace {
    padding-bottom: 40px;
}
.svgPlusText {
    align-items: center;
    display: grid;
    gap: 15px;
    grid-template-columns: auto 1fr;
}
.columnWrapper {
    display: grid;
    gap: 50px;
    grid-template-columns: 1fr 1fr;
}
#mapWrapper {
    position: relative;
}
#mapWrapper iframe,
#aboutUs img {
    border: 3px solid var(--primary);;
    border-radius: 8px;
}
.socialMediaWrapper {
    display: flex;
    gap: 15px 25px;
    justify-content: center;
}
#shareUsContainer {
    display: flex;
    justify-content: center;
}
#shareUsFull {
    background-color: var(--primary);;
    padding: 25px;
}
.aboutUsImgWrapper {
    position: relative;
}
.aboutUsImgButton {
    background-color: var(--primary);;
    border-radius: 8px;
    bottom: 0;
    cursor: pointer;
    height: 50px;
    left: 0;
    position: absolute;
    width: 50px;
}
.aboutUsImgButton:hover {
    background-color: #757575;
}
.imgBar {
    background-color: #FFF;
    border-radius: 5px;
    bottom: 25px;
    height: 3px;
    left: 12px;
    position: absolute;
    width: 26px;
}
.imgBar.imgButton2 {
    transform: rotate(90deg);
}
.ui.dimmer {
    background-color: rgba(0, 0, 0, 0.5);
}
#similarJobsWrapper {
    display: grid;
    gap: 25px 70px;
    grid-template-columns: 1fr 1fr 1fr;
    padding-bottom: 35px;
}
.similarJob {
    background-color: #FFF;
}
.similarJob:hover {
    background-color: var(--primary);;
}
.similarJob:hover .buttonWrapperThird {
    color: #757575;
}
.similarJob a {
    padding: 35px 25px 40px;
}
/**
 * benefits: slick
 */
#slickBenefits {
    margin-bottom: 105px;
}
#slickBenefits img {
    margin: 0 auto 25px;
    max-height: 150px;
    min-height: 150px;
}
.benefitContainer {
    box-shadow: 0 0 25px #00000047;
    cursor: pointer;
    margin: 25px;
    position: relative;
}
.benefitContainer:hover .benefitBack {
    opacity: 1;
}
.benefitTitle {
    color: #333;
    font: normal normal normal 26px/36px OpenSans-Light, Arial Regular, sans-serif;
    text-align: center;
}
.benefitFront {
    min-height: 355px;
    padding: 50px 25px 25px;
}
.benefitBack {
    background-color: var(--primary);;
    display: block;
    left: 0;
    min-height: 355px;
    opacity: 0;
    padding: 25px;
    position: absolute;
    top: 0;
    z-index: 5;
}
.benefitText,
.benefitText ul > li {
    color: #FFF;
    font: normal normal normal 20px/24px OpenSans-Regular, Arial Regular, sans-serif;
    letter-spacing: 0.64px;
}
.benefitText ul {
    margin-top: 10px;
}
.slick-prev:before,
.slick-next:before {
    content: initial;
}
.slick-prev,
.slick-prev:focus {
    background-color: var(--primary);;
    height: 111px;
    left: -80px;
    mask-image: url(../images/benefits/chevron-left.svg);
    opacity: 0.5;
    top: 165px;
    width: 34px;
    -webkit-mask-image: url(../images/benefits/chevron-left.svg);
}
.slick-next,
.slick-next:focus {
    background-color: var(--primary);;
    height: 111px;
    mask-image: url(../images/benefits/chevron-right.svg);
    opacity: 0.5;
    right: -80px;
    top: 165px;
    width: 34px;
    -webkit-mask-image: url(../images/benefits/chevron-right.svg);
}
.slick-arrow:hover {
    background-color: var(--primary);;
    opacity: 1;
}
.slick-dots li button:before {
    color: var(--primary);;
    font-size: 15px;
}
.slick-dots li.slick-active button:before,
.slick-dots li button:hover:before {
    color: var(--primary);;
    opacity: 1;
}
.workForUs {
    display: grid;
    gap: 50px;
    grid-template-columns: 1fr;
}

.print-only {
    display:none
}
/**
** dahlia styles
 */

body.dahlia .aboutUsImgHolder {
    display: none;
}
body.dahlia .statement {
    display: none;
}
/**
* media screen (smartphones, tablets, etc.)
 */
@media only screen and (max-width: 1500px) {
    button.slick-arrow {
        display: none !important;
    }
}
@media only screen and (max-width: 1240px) {
    #stickyHeaderWrapper,
    #headerWrapper {
        padding: 15px 25px;
    }
    #navigationWrapper {
        gap: 15px 25px;
    }
    #similarJobsWrapper {
        gap: 25px;
        grid-template-columns: 1fr 1fr;
    }
}
@media only screen and (max-width: 1000px) {
    .desktop {
        display: none;
    }
    .mobile {
        display: block;
    }
    #stickyHeaderWrapper {
        grid-template-columns: 1fr auto;
    }
    .logoWrapper img {
        max-height: 40px;
    }
    .columnWrapper, .workForUs {
        grid-template-columns: 1fr !important;
    }
    #mapWrapper {
        height: 0;
        overflow: hidden;
        padding-bottom: 56.25%;
    }
}
@media only screen and (max-width: 800px) {
    body, h1, h2, h3, h4, h5, li, p, span, label, input, textarea, a, a:hover {
        font: normal normal normal 16px/24px OpenSans-Regular, Arial Regular, sans-serif;
    }
    h1 {
        font: normal normal normal 28px/38px OpenSans-Bold, Arial Regular, sans-serif;
    }
    h2 {
        font: normal normal normal 34px/46px OpenSans-Light, Arial Regular, sans-serif;
        padding: 0 0 30px;
    }
    h3 {
        font: normal normal normal 24px/33px OpenSans-Light, Arial Regular, sans-serif;
    }
    .topicsText1 {
        font: normal normal normal 18px/24px OpenSans-Regular, Arial Regular, sans-serif;
    }
    .statement {
        font: normal normal normal 40px/60px VladimirScript-Regular, Arial Regular, sans-serif;
        margin-top: 25px;
    }
    .benefitTitle {
        font: normal normal normal 20px/28px OpenSans-Light, Arial Regular, sans-serif;
    }
    .benefitText,
    .benefitText ul > li {
        font: normal normal normal 16px/24px OpenSans-Regular, Arial Regular, sans-serif;
    }
    header {
        height: 250px;
    }
    #headerTopicsWrapper {
        display: none;
    }
    #similarJobsWrapper {
        grid-template-columns: 1fr;
    }
}
