/* Theme Name: Inzet Theme URI: http://www.burotijs.nl/ Description: Inzet theme Version 1.0 By Buro Tijs Author: BuroTijs Author URI: http://www.burotijs.nl/ Version: 1.0 Template: genesis License: GPL-2.0+ License URI: http://www.gnu.org/licenses/gpl-2.0.html */ /* Fonts */ @font-face { font-family: 'RussoOne-Regular'; src: url('fonts/RussoOne-Regular.eot'); src: url('fonts/RussoOne-Regular.eot?#iefix') format('embedded-opentype'), url('fonts/RussoOne-Regular.woff2') format('woff2'), url('fonts/RussoOne-Regular.woff') format('woff'), url('fonts/RussoOne-Regular.ttf') format('truetype'), url('fonts/RussoOne-Regular.svg#RussoOne-Regular') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Trenda-Bold'; src: url('fonts/Trenda-Bold.eot'); src: url('fonts/Trenda-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/Trenda-Bold.woff2') format('woff2'), url('fonts/Trenda-Bold.woff') format('woff'), url('fonts/Trenda-Bold.ttf') format('truetype'), url('fonts/Trenda-Bold.svg#Trenda-Bold') format('svg'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Trenda-Regular'; src: url('fonts/Trenda-Regular.eot'); src: url('fonts/Trenda-Regular.eot?#iefix') format('embedded-opentype'), url('fonts/Trenda-Regular.woff2') format('woff2'), url('fonts/Trenda-Regular.woff') format('woff'), url('fonts/Trenda-Regular.ttf') format('truetype'), url('fonts/Trenda-Regular.svg#Trenda-Regular') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } /* CSS reset */ * {margin:0px; padding:0px; border:none; outline:none; box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;font-feature-settings: lnum;font-variant-numeric: lining-nums;} body {font-family: 'Trenda-Regular';font-size: 17px;color: #5c5956;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;padding-top: 0px;background-color: #eeeeee;} img {border:none; outline:none;max-width: 100%;} a,h1,h2,h3,h4,h5,h6,p,div,img {text-decoration:none; padding:0px; margin:0px;font-weight: normal;} ul {list-style-type: none;margin-bottom: 0px;} input,textarea,select,input[type="text"], input[type="email"], input[type="button"], input[type="submit"] {-webkit-appearance: none;-moz-appearance: none;border-radius: 0px;-ms-appearance: none;-o-appearance: none;appearance: none;} html {text-size-adjust: none;-ms-text-size-adjust: none;-webkit-text-size-adjust: none;-o-text-size-adjust: none;} a:hover, a:focus {text-decoration: none;} p:empty {display: none;} svg {max-width: 100%;} small {font-size: 100%;} picture > img {width: 100%; height: 100%; object-fit: cover; } .custom-object-fit {background-size: cover;background-position: center;background-repeat: no-repeat;} .custom-object-fit > img {opacity: 0;} #tslOverlay {z-index: 999999 !important;} ::-moz-selection { background: #622a86;color: #fff; } ::selection { background: #622a86; color: #fff;} ::-webkit-input-placeholder {color: #b6b5b4 !important;} :-moz-placeholder { /* Firefox 18- */color: #b6b5b4 !important;opacity: 1;} ::-moz-placeholder { /* Firefox 19+ */color: #b6b5b4 !important;opacity: 1;} :-ms-input-placeholder {color: #b6b5b4 !important;} /* End of reset css */ .main-form .nf-form-content input[type="button"],.vakgebieden-banner,.custom-input-grp .checkbox > label,.member-image img,.main-form .gform_wrapper .gform_footer button.button,.slick-arrow,.job-top-part h3,.job-card,.side-panel-info > i,.social-links > a,.footer-contact-info a i,.service-title h3,.service-card,.main-btn i,.main-btn,.home-category-list > li a,.close-icon,.menu-dropdown-vacature-menu-container > ul > li > a::before,.menu-main-menu-container > ul > li > a,header .title-area a.custom-logo-link,header.site-header::after,header.site-header,.header-button-menu > a,.sidebar-modal,.panel-title > a > i,.panel-title > a,.vakgebieden-home-list li a i,.vakgebieden-home-list li a,.main-dropdown-menu,.menu-overlay,.main-sidebar-part,.job-alert-sidebar,span.replace-btn, .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_checkbox li label, .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_radio li label, .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_checkbox li label::after, .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_radio li label::after, .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_checkbox li label::before, .option-card > i,.option-card,.menu-target-group-menu-container > ul > li > a::before,.job-function .radio::after,.job-function .radio:before,.job-function .radio label,.job-function .radio.active span,.bold-text p a::after,.custom-text-link p a::after{transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;} section {float: left;width: 100%;} h1,h2,h3,h4,h5,h6 {float: left; width: 100%;color: #1e1e1e;} h1 {font-size: 60px; line-height: 66px;font-family: 'RussoOne-Regular';} h2 {font-size: 36px; line-height: normal; font-family: 'RussoOne-Regular'; } h3 {font-size: 25px; line-height: 34px;font-family: 'Trenda-Bold';} h4 {font-size: 18px;line-height: 24px;} h5,h6 {font-size: 16px;line-height: 21px;} p {float: left;width: 100%;font-size: 17px;line-height: 28px;color: #5c5956;} .main-btn {display: inline-block; height: 60px; line-height: 60px; background-color: #1e1e1e; box-shadow: 0 5px 10px rgba(0,0,0,0.15); border-radius: 30px; position: relative; font-size: 20px; color: #ffffff; font-family: 'RussoOne-Regular'; padding: 0 40px 0 90px; cursor: pointer;overflow: hidden;vertical-align: middle;} .main-btn i {position: absolute; left: 10px; top: 10px; width: 40px; height: 40px; background-color: #4b4b4b; border-radius: 50%; text-align: center; line-height: 38px; } .main-btn i img {width: 14px; } .main-btn > span {position: relative; } .main-btn > span::before {content: attr(data-text); position: absolute; top: -60px;line-height: normal;display: inline-table;width: auto;white-space: nowrap;} .main-btn:hover {line-height: 180px;background-color: #ffffff;color: #1e1e1e;} .main-btn:hover i{background-color: #1e1e1e;} .orng-btn {background-color: #622a86; } .orng-btn i {background-color: #1e1e1e; } .orng-btn:hover {color: #622a86;} .orng-btn:hover i{background-color: #622a86;} .text-link {display: inline-block; font-size: 18px; line-height: 28px; color: #622a86; font-family: 'Trenda-Bold'; padding-right: 24px; background-image: url(images/icon-arrow-cross-purple.svg); background-repeat: no-repeat; background-position: right 10px; background-size: 10px; } .text-link span,.footer-contact-info a span,.address-link a span,.back-link a span,.share-list li a span {position: relative;} .text-link span::after, .footer-contact-info a span::after, .address-link a span::after,.back-link a span::after, .share-list li a span::after{content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background-color: #622a86;opacity: 0;} /* ********** Header ********** */ header.site-header {position: fixed; left: 0; top: 0; width: 100%; padding: 37px 0 31px; z-index: 999;} header.site-header::after, .dropdown-header-part::after {position: absolute; content: ""; bottom: 0; left: 0; width: calc(50% + 200px); height: 2px; background-color: #fff; } .d-flex {display: flex; flex-wrap: wrap; } .row.d-flex::after, .row.d-flex::before {display: none; } header.site-header .row.d-flex {align-items: center; } header .title-area, .secondary-logo {float: left; width: 151px; } header .title-area a.custom-logo-link, .secondary-logo > a {float: left; width: 100%; } .header-menu-part {float: right; width: calc(100% - 151px); padding-left: 79px; display: flex; flex-wrap: wrap; align-items: center;justify-content: space-between;} .header-menu {float: left; } .menu-main-menu-container {float: left; } .menu-main-menu-container > ul {float: left; } .menu-main-menu-container > ul > li {float: left; margin-right: 50px; } .menu-main-menu-container > ul > li:last-child {margin-right: 0; } .menu-main-menu-container > ul > li > a {float: left; position: relative; color: #ffffff; font-size: 17px; font-family: 'Trenda-Bold';cursor: pointer;text-transform: lowercase;} .menu-main-menu-container > ul > li > a::after {position: absolute; content: ""; left: 0; right: 0; bottom: -3px; height: 2px; background-color: #ffffff;opacity: 0;transform: translate3d(0, 100%, 0);-webkit-transform: translate3d(0, 100%, 0);-moz-transform: translate3d(0, 100%, 0);transition: transform .2s cubic-bezier(.84, .41, 0, 1.2), opacity .2s ease-out;-webkit-transition: transform .2s cubic-bezier(.84, .41, 0, 1.2), opacity .2s ease-out;-moz-transition: transform .2s cubic-bezier(.84, .41, 0, 1.2), opacity .2s ease-out;} .menu-main-menu-container > ul > li > a:hover::after {opacity: 1;transform: translate3d(0, 0, 0);-webkit-transform: translate3d(0, 0, 0);-o-transform: translate3d(0, 0, 0);-ms-transform: translate3d(0, 0, 0);-moz-transform: translate3d(0, 0, 0);} .menu-main-menu-container > ul > li.current-menu-item > a {color: #fff; } .menu-main-menu-container > ul > li.current-menu-item > a::after {opacity: 1;background-color: #fff;} .menu-main-menu-container > ul > li.has-submenu > a::after {right: 18px; } .menu-main-menu-container > ul > li.has-submenu > a::before {content: "\ea99"; font-family: IcoFont !important; float: right; font-size: 12px; position: relative; top: 6px; margin-left: 6px; } .menu-main-menu-container > ul > li.open > a {color: #fff; } .menu-main-menu-container > ul > li.open > a::after {background-color: #fff;opacity: 1;} .menu-main-menu-container > ul > li.open > a::before {transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); -moz-transform: rotate(180deg); } .header-button-menu {float: right; } .header-button-menu > a {float: left; margin-right: 20px; height: 48px; line-height: 46px; padding: 0 25px; border-radius: 30px; font-size: 16px; font-family: 'RussoOne-Regular'; box-shadow: 0 5px 10px rgba(0,0,0,0.15); border: 2px solid transparent; } .header-button-menu > a:last-child {margin-right: 0; } .orng-small-btn {background-color: #622a86; color: #fff; } .black-small-btn {background-color: #1e1e1e;color: #ffffff;} .header-button-menu > a:hover {border-color: #fff;} .orng-small-btn:hover {background-color: #622a86;color: #fff;} header.site-header.fixed {background-color: #353535;padding: 16px 0 16px;} header.site-header.fixed::after {opacity: 0; } header.fixed .title-area a.custom-logo-link {width: 117px; } header.fixed .menu-main-menu-container > ul > li > a {color: #fff; } header.fixed .menu-main-menu-container > ul > li > a::after {background-color: #fff; } .menu-mobile,.menu-inside-btn {display: none;} .mobile-header-menu {display: none; } .mobile-inside-menu {display: none; } .sidebar-inside.sidebar-menu-part {display: none; } /* ********** Dropdown menu ********** */ .main-dropdown-menu {position: fixed; left: 0; right: 0; height: 100vh; overflow: auto;z-index: 99999;transform: translateY(-100%);-webkit-transform: translateY(-100%);-o-transform: translateY(-100%);-moz-transform: translateY(-100%);-ms-transform: translateY(-100%);} .main-dropdown-menu.open {transform: translateY(0%);-webkit-transform: translateY(0%);-o-transform: translateY(0%);-ms-transform: translateY(0%);-moz-transform: translateY(0%);} .dropdown-wrapper {float: left;width: 100%;position: relative;min-height: 100vh;} .dropdown-wrapper::after {content: ""; left: 0; top: 0; bottom: 0; width: calc(50% + 240px); position: absolute; background-color: #622a86; z-index: -1; } .dropdown-header-part {float: left; width: 100%; position: relative; padding: 40px 0 35px; opacity: 0; transition: 0.3s opacity ease-in-out; -webkit-transition: 0.3s opacity ease-in-out; -moz-transition: 0.3s opacity ease-in-out; transition-delay: 0s; transition-delay: 0s; -ms-transition: 0.3s opacity ease-in-out;} .main-dropdown-menu.open .dropdown-header-part {opacity: 1; transition-delay: 0.3s; -ms-transition-delay: 0.3s; -webkit-transition-delay: 0.3s; -moz-transition-delay: 0.3s; } body.scroll-hidden {overflow-y: hidden; } .dropdown-body {float: left; width: 100%; padding: 60px 0 60px;opacity: 0;transition: 0.3s opacity ease-in-out;-webkit-transition: 0.3s opacity ease-in-out;-moz-transition: 0.3s opacity ease-in-out;-ms-transition: 0.3s opacity ease-in-out;} .main-dropdown-menu.open .dropdown-body {opacity: 1;transition-delay: 0.3s;-ms-transition-delay: 0.3s;-webkit-transition-delay: 0.3s;-moz-transition-delay: 0.3s;} .vacatures-dropdown {width: 100%; float: left; } .menu-dropdown-vacature-menu-container,.menu-target-group-menu-container {float: left; width: 100%; } .menu-dropdown-vacature-menu-container > ul,.menu-target-group-menu-container > ul {float: left; width: 100%; } .menu-dropdown-vacature-menu-container > ul > li,.menu-target-group-menu-container > ul > li {float: left; width: 100%; margin-bottom: 16px; } .menu-dropdown-vacature-menu-container > ul > li:last-child,.menu-target-group-menu-container > ul > li:last-child {margin-bottom: 0; } .menu-dropdown-vacature-menu-container > ul > li > a,.menu-target-group-menu-container > ul > li > a {float: left; position: relative; padding-left: 67px; font-size: 32px; line-height: 46px; color: #fff; font-family: 'RussoOne-Regular'; } .menu-dropdown-vacature-menu-container > ul > li > a .menu-item-description, .menu-target-group-menu-container > ul > li > a .menu-item-description {display: block; line-height: 28px; font-size: 17px; font-family: 'Trenda-Regular'; } .menu-dropdown-vacature-menu-container > ul > li > a::before, .menu-target-group-menu-container > ul > li > a::before {content: ""; position: absolute; left: 0; top: 3px; width: 40px; height: 40px; background-color: #4b4b4b; border-radius: 50%;background-image: url(images/icon-arrow-cross.svg);background-repeat: no-repeat;background-position: center;background-size: 14px;} .menu-dropdown-vacature-menu-container > ul > li > a:hover::before, .menu-target-group-menu-container > ul > li > a:hover::before {background-color: #1e1e1e;} .vakgebieden-header-part {float: left; width: 100%; padding-left: 67px; margin-top: 48px; } #custom_html-2 {float: left; width: 420px; } #custom_html-2 p, .second-menu p {color: #fff; margin-bottom: 17px;} .vakgebieden-list-part,.menu-dropdown-main-menu-container ul{display: flex; width: 100%; flex-wrap: wrap; justify-content: space-between; } .vakgebieden-list-part > li,.menu-dropdown-main-menu-container ul > li {width: 48%; margin-bottom: 12px; } .vakgebieden-list-part > li a,.menu-dropdown-main-menu-container ul > li a {float: left; position: relative; font-size: 18px; color: #ffffff; font-family: 'Trenda-Bold'; padding-left: 25px; } .vakgebieden-list-part > li a i {position: absolute; left: 0; top: -2px; width: 10px; } .vakgebieden-list-part > li a span,.menu-dropdown-main-menu-container ul > li a span {position: relative; } .vakgebieden-list-part > li a span::after,.menu-dropdown-main-menu-container ul > li a span::after {position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background-color: #fff; content: ""; opacity: 0; } /* Common underline hover effects */ .share-list li a span::after,.back-link a span::after,.address-link a span::after,.member-meta h4 strong::after,.menu-footer-menu-container > ul > li > a::after,.footer-contact-info a span::after,.vakgebieden-list-part > li a span::after,.menu-wrapper ul > li > a::after,.text-link span::after,.menu-dropdown-main-menu-container ul > li a span::after{transform: translate3d(0, 100%, 0); -webkit-transform: translate3d(0, 100%, 0); -moz-transform: translate3d(0, 100%, 0); transition: transform .2s cubic-bezier(.84, .41, 0, 1.2), opacity .2s ease-out; -webkit-transition: transform .2s cubic-bezier(.84, .41, 0, 1.2), opacity .2s ease-out; -moz-transition: transform .2s cubic-bezier(.84, .41, 0, 1.2), opacity .2s ease-out;} .share-list li a:hover span::after,.back-link a:hover span::after,.address-link a:hover span::after,.team-box-content:hover .member-meta h4 strong::after,.job-card:hover .text-link span::after,.menu-footer-menu-container > ul > li > a:hover::after,.footer-contact-info a:hover span::after,.service-card:hover .text-link span::after,.vakgebieden-list-part > li a:hover span::after,.menu-wrapper ul > li > a:hover::after,.text-link:hover span::after,.menu-dropdown-main-menu-container ul > li a:hover span::after {opacity: 1; transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); } /* *End* */ .i-shape {position: absolute; right: 0; bottom: 0; height: 344px; overflow: hidden;z-index: -1;} .i-shape > img {width: 161px; max-width: initial; max-height: initial; } .menu-overlay {position: fixed; left: 0; right: 0; top: 0; bottom: 0; background-color: rgba(30,30,30,0.6); z-index: 11111;opacity: 0;visibility: hidden;pointer-events: none;} .menu-overlay.show {opacity: 1; visibility: visible; pointer-events: auto; } .hide-overlay {position: absolute; right: 0; top: 0; bottom: 0; width: calc(50% - 240px); } .main-sidebar-part.open ~ .menu-overlay {z-index: 1111; } /* ********** Sidebar menu ********** */ .main-sidebar-part {position: fixed; right: 0; top: 0; bottom: 0; background-color: #1e1e1e; z-index: 9999; width: 500px; display: flex;flex-wrap: wrap;overflow: auto;transform: translateX(420px);-webkit-transform: translateX(420px);-o-transform: translateX(420px);-ms-transform: translateX(420px);-moz-transform: translateX(420px);box-shadow: 0 5px 10px rgba(0,0,0,0.15);} .main-sidebar-part.open {transform: translateX(0); -webkit-transform: translateX(0); -o-transform: translateX(0); -ms-transform: translateX(0); -moz-transform: translateX(0);} .side-panel {float: left; width: 80px; padding: 20px; text-align: center; } .side-panel-info {float: left; width: 100%;cursor: pointer;} .side-panel-info > i {display: inline-block; width: 40px; height: 40px; border-radius: 50%; border: 2px solid #622a86; font-size: 14px; color: #622a86; line-height: 36px; margin-bottom: 20px; } .side-panel-info:hover i {background-color: #622a86; color: #fff; } .side-panel-info span {display: inline-block; font-size: 17px; color: #ffffff; font-family: 'Trenda-Bold'; text-transform: uppercase; writing-mode: vertical-lr; -webkit-writing-mode: vertical-lr; -ms-writing-mode: vertical-lr; -o-writing-mode: vertical-lr; -moz-writing-mode: vertical-lr; } .sidebar-menu-part {width: calc(100% - 80px); float: right; border-left: 2px solid #4b4b4b; position: relative;padding:72px 0 70px;} .close-icon {position: absolute; right: 20px; top: 20px; width: 40px; height: 40px; background-color: #353535; border-radius: 50%; text-align: center; line-height: 40px; color: #eeeeee; font-size: 14px; cursor: pointer; } .close-icon:hover {background-color: #622a86; } .menu-wrapper {float: left; width: 100%; margin-bottom: 31px; padding: 0 40px 32px; border-bottom: 2px solid #4b4b4b; } .menu-wrapper:last-child {margin-bottom: 0; padding-bottom: 0; border-bottom: none; } .menu-wrapper > p {color: #ffffff; margin-bottom: 15px; } .menu-wrapper > div {float: left; width: 100%; } .menu-wrapper ul {float: left; width: 100%; } .menu-wrapper ul > li {float: left; width: 100%; margin-bottom: 4px; } .menu-wrapper ul > li:last-child {margin-bottom: 0; } .menu-wrapper ul > li > a {float: left; font-size: 18px; line-height: 28px; color: #622a86; padding-left: 30px;background-image: url(images/icon-arrow-cross-purple.svg);background-repeat: no-repeat;background-position: left;background-size: 10px;position: relative;} .menu-wrapper ul > li > a::after {content: ""; position: absolute; left: 30px; right: 0; bottom: 1px; height: 1px; background-color: #622a86; opacity: 0; } body.admin-bar header.site-header {top: 32px;} body.admin-bar .main-sidebar-part {top: 32px;} /* ********** Footer ********** */ footer.site-footer {float: left; width: 100%; } .footer-top-part {float: left; width: 100%; padding: 80px 0 72px; background-color: #353535;overflow: hidden;} #custom_html-3 {float: left; width: 100%; } .footer-info-part {display: flex; width: 100%; margin-bottom: 74px; flex-wrap: wrap; align-items: center;justify-content: space-between;position: relative;} .footer-info-part::after {content: ""; left: 0; width: 4000px; bottom: -35px; height: 2px; background-color: #4b4b4b; position: absolute; } .footer-logo {float: left; width: 151px; } .footer-logo a {float: left; width: 100%; } .footer-contact-info {margin-left: -10px; } .footer-contact-info a {display: flex; margin-right: 20px; font-size: 18px; color: #ffffff; font-family: 'Trenda-Bold'; flex-wrap: wrap; float: left; align-items: center; line-height: normal; } .footer-contact-info a > i {width: 32px; height: 32px; border: 2px solid #622a86; border-radius: 50%; color: #622a86; font-size: 14px; text-align: center; line-height: 28px; margin-right: 14px; } .footer-contact-info a span::after {background-color: #fff;} .footer-contact-info a:hover > i{background-color: #622a86;color: #fff;} .social-links {float: right; } .social-links > a {display: flex; width: 32px; height: 32px; background-color: #622a86; color: #fff; border-radius: 50%; float: left; flex-wrap: wrap; justify-content: center; align-items: center; font-size: 14px; margin-right: 15px; border: 2px solid #622a86;} .social-links > a:hover {background-color: transparent;color: #622a86;} .social-links > a:last-child {margin-right: 0;} #custom_html-3 h3 {font-size: 28px; color: #ffffff; font-family: 'Trenda-Regular'; } .footer-bottom-part {float: left; width: 100%; padding: 33px 0 30px;} #nav_menu-2 {float: left; width: 100%; } #nav_menu-2 > h3 {float: right; width: auto; font-size: 14px; line-height: 28px; color: #8d8b89; font-family: 'Trenda-Regular'; } .menu-footer-menu-container {float: left; } .menu-footer-menu-container > ul {float: left; } .menu-footer-menu-container > ul > li {float: left; margin-right: 40px; } .menu-footer-menu-container > ul > li > a {float: left; font-size: 14px; line-height: 28px; color: #1e1e1e;position: relative;} .menu-footer-menu-container > ul > li > a::after {content: ""; position: absolute; left: 0; right: 0; bottom: 4px; height: 1px; background-color: #1e1e1e; opacity: 0; } .footer-logobar {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; width: 100%; } .footer-logobar h3 {width: 50%;} .logopart span {display: inline-block; vertical-align: middle;margin-right: 36px; } .logopart span:last-child {margin-right: 0; } .logopart span > img {max-width: 100px; max-height: 90px; } /* ********** Home page ********** */ body.home header.site-header::after {background-color: #fff;} body.home .menu-main-menu-container > ul > li > a {color: #fff;} body.home .menu-main-menu-container > ul > li > a::after {background-color: #fff;} header.site-header + .site-inner {min-height: 100vh; } .home-banner {position: relative; } .home-banner::before {content: ""; left: 0; right: 0; top: 0; position: absolute; height: 200px; z-index: 1; background: -moz-linear-gradient(top, rgba(30,30,30,0.9) 0%, rgba(30,30,30,0) 100%); background: -webkit-linear-gradient(top, rgba(30,30,30,0.9) 0%,rgba(30,30,30,0) 100%); background: linear-gradient(to bottom, rgba(30,30,30,0.9) 0%,rgba(30,30,30,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e61e1e1e', endColorstr='#001e1e1e',GradientType=0 ); } .home-banner::after {content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background-color: #000; background: -moz-linear-gradient(top, rgba(30,30,30,0) 0%, rgba(30,30,30,0.4) 100%); background: -webkit-linear-gradient(top, rgba(30,30,30,0) 0%,rgba(30,30,30,0.4) 100%); background: linear-gradient(to bottom, rgba(30,30,30,0) 0%,rgba(30,30,30,0.4) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#001e1e1e', endColorstr='#661e1e1e',GradientType=0 ); } .home-banner > picture {position: absolute; left: 0; right: 0; top: 0; bottom: 0;} .home-banner-title {display: flex; width: 50%; padding: 170px 0 67px; min-height: 600px; flex-wrap: wrap; align-items: flex-end; position: relative;z-index: 1;} .home-banner-title h1 {color: #fff; padding-right: 50px; } /* Home intro */ .home-intro-part {padding-bottom: 116px; margin-bottom: -100px; z-index: 11; } .white-bg {position: relative; } .white-bg::before {content: ""; left: 0; top: 0; bottom: 0; position: absolute; width: calc(50% + 530px); background-color: #fff; z-index: -1; } .intro-main-part {float: left; width: 100%;margin-bottom: 100px;} .intro-text {float: left; width: 520px; padding: 70px 0; } .vacature-category-box {float: right; width: 620px; background-color: #622a86; padding: 51px 55px 60px 60px; position: relative; box-shadow: 0 5px 10px rgba(0,0,0,0.15); margin-top: -100px;z-index: 1;} .vacature-category-box h3 {color: #fff; margin-bottom: 22px; } .home-category-list {float: left; width: 100%; margin-bottom: 15px; } .home-category-list > li {float: left; margin-right: 15px; margin-bottom: 15px; } .home-category-list > li a {float: left; background-color: #ffffff; height: 48px; line-height: 48px; padding: 0 50px 0 27px; border-radius: 30px; box-shadow: 0 5px 10px rgba(0,0,0,0.15); cursor: pointer; font-size: 18px; color: #1e1e1e; font-family: 'Trenda-Bold'; background-image: url(images/icon-arrow-cross-purple.svg); background-repeat: no-repeat; background-position: calc(100% - 27px); background-size: 10px; } .home-category-list > li a:hover{color: #622a86;} .more-info-btn {float: left; width: 100%; } .vacature-category-box .i-shape {height: 308px;right: -3px;} /* Home Info */ .home-info-part {display: flex; flex-wrap: wrap; width: 100%; align-items: center;margin-bottom: 80px;} .home-info-img {float: left; width: 510px; height: 580px; } .home-info-img picture {float: left; width: 100%; height: 100%; } .info-usp-part {float: left; width: 550px; padding: 30px 0 30px 150px; } .info-usp-part h3 {margin-bottom: 13px; } .info-usp-part > p {margin-bottom: 25px; } .info-usp-list {float: left; width: 100%; margin-bottom: 21px; } .info-usp-list > li {float: left; width: 100%; margin-bottom: 13px; position: relative; padding-left: 30px; font-size: 17px; color: #5c5956; line-height: 28px; } .info-usp-list > li:last-child {margin-bottom: 0 !important; } .info-usp-list > li::before {content: "\eed8"; font-family: IcoFont !important; position: absolute; left: 0; font-size: 20px; color: #622a86; line-height: 28px; } .info-usp-list > li b {float: left; width: 100%; font-weight: normal; font-size: 19px; line-height: 28px; color: #1e1e1e; font-family: 'Trenda-Bold'; margin-bottom: 9px; } /* Job alert CTA */ .job-alert-cta {float: left; width: 100%; max-width: 1060px; border: 8px solid #622a86; padding: 65px 72px 53px; position: relative; } .job-alert-text {float: left; width: 75%; } .job-alert-text h2 {color: #622a86; margin-bottom: 19px; } .job-alert-text p {max-width: 500px; } .job-mail-icon {float: right; margin-top: 7px; max-width: 120px; } .job-alert-cta .more-info-btn {width: auto; position: absolute; right: 32px; bottom: -34px; padding: 0 40px; background-color: #fff; } /* Gravity form */ .form-wrapper {float: left; width: 100%; margin-top: 100px; max-width: 660px; } .main-form {float: left; width: 100%; } .main-form br { display: none;} .main-form .gform_wrapper {margin: 0;float: left; width: 100%; } .main-form .gform_wrapper form {float: left;width: 100%;} .main-form .gform_wrapper .gform_body {width: 100%; float: left; } .main-form .gform_wrapper ul.gform_fields {float: left;width: 100%} body .main-form .gform_wrapper ul li.gfield {margin-top: 0 !important; padding: 0 !important; float: left; width: 100%; clear: none;margin-bottom: 15px !important;background-color: transparent;border: none;position: relative;} .main-form .gform_wrapper .top_label .gfield_label {line-height: normal; clear: none; float: left; font-weight: normal; margin-bottom: 0 !important; margin-top: 15px !important; font-size: 18px; color: #1e1e1e; font-family: 'Trenda-Bold'; width: 210px; padding-right: 15px;border-bottom: none; } body .main-form .gform_wrapper ul li.gfield.hidden_label .gfield_label {display: none; } .main-form .gform_wrapper .gfield_required_asterisk {color: #622a86; margin-left: 0; font-size: 21px; position: absolute; right: -14px; z-index: 1; width: 30px; height: 30px; background-color: #fff; text-align: center; line-height: 40px; top: -15px; } body .main-form .gform_wrapper .top_label div.ginput_container {margin-top: 0 !important; float: right; width: calc(100% - 210px) !important; position: relative; } body .main-form .gform_wrapper .top_label div.ginput_container:last-child {margin-right: 0; } .main-form .gform_wrapper li div.has_first_name span {width: calc(50% - 10px) !important; margin: 0; padding: 0;} .main-form .gform_wrapper li div.has_first_name span:nth-child(2) {float: right;} .main-form .gform_wrapper li div.has_first_name span > label {float: left;width: 100%;color: #8e8b8a;font-family: 'Trenda-Regular';font-weight: normal;} /*.main-form .gform_wrapper li div.has_first_name span {float: left; width: 100%; margin: 0; padding: 0; }*/ .main-form .gform_wrapper div.has_first_name span input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]) {margin-bottom: 0; } .main-form .gform_wrapper input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]), .main-form .gform_wrapper textarea, .main-form .gform_wrapper .top_label select {font-size: 17px; padding: 0 20px; height: 55px; color: #5c5956; font-family: 'Trenda-Regular'; float: left; width: 100% !important; border: 2px solid #d6d6d6 !important; border-radius: 0; background-color: #fff; box-shadow: none; margin-bottom: 0; } /*.main-form .gform_wrapper input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]):focus, .main-form .gform_wrapper textarea.medium:focus, .main-form .gform_wrapper .top_label select.medium:focus {border-color: #63a532 !important;}*/ .main-form .gform_wrapper .top_label select {background-image: url(images/icon-dropdown-purple.svg); background-repeat: no-repeat; background-position: calc(100% - 19px); padding-right: 50px; } .main-form .gform_wrapper textarea {height:200px !important;padding: 12px 20px;} .main-form .gform_wrapper li.gfield_error input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]), .main-form .gform_wrapper li.gfield_error textarea {border-color: #ffb400 !important;} .main-form .gfield_checkbox {width: 100%;float: left;justify-content: space-between;} .main-form .gfield_checkbox .gchoice {float: left;width: 100%;margin-bottom: 6px;} .main-form .gform_wrapper .top_label li ul.gfield_checkbox, .main-form .gform_wrapper .top_label li ul.gfield_radio {width: 100% !important; float: left; margin: 10px 0 0 !important; } .main-form .gform_wrapper ul.gfield_checkbox li, .main-form .gform_wrapper ul.gfield_radio li {padding: 0 !important; float: left; width: 100%; margin: 0 0 0 !important;} .main-form .gform_wrapper ul.gfield_radio li {width: auto; margin-right: 20px !important; } .main-form .gform_wrapper ul.gfield_checkbox li:last-child, .main-form .gform_wrapper ul.gfield_radio li:last-child {margin-bottom: 0 !important} .main-form .gform_wrapper ul.gfield_checkbox li input[type="checkbox"], .main-form .gform_wrapper ul.gfield_radio li input[type="radio"], body .main-form .gform_wrapper .top_label div.ginput_container input[type="checkbox"]{width: auto !important; position: absolute; left: 0; top: 0; opacity: 0; visibility: hidden; pointer-events: none; } .main-form .gform_wrapper ul.gfield_checkbox li label, .main-form .gform_wrapper ul.gfield_radio li label, body .main-form .gform_wrapper .top_label div.ginput_container input[type="checkbox"] + label{cursor: pointer; float: left; width: auto; max-width: 100% !important; font-size: 17px; color: #5c5956; font-family: 'Trenda-Regular'; font-weight: normal !important; line-height: 28px; position: relative; padding-left: 39px; margin-left: 0 !important; } .main-form .gform_wrapper ul.gfield_checkbox li label .gfield_required_asterisk, .main-form .gform_wrapper ul.gfield_radio li label .gfield_required_asterisk, body .main-form .gform_wrapper .top_label div.ginput_container input[type="checkbox"] + label .gfield_required_asterisk {z-index: -1;right: -20px;} .main-form .gform_wrapper ul.gfield_checkbox li label a, .main-form .gform_wrapper ul.gfield_radio li label a, body .main-form .gform_wrapper .top_label div.ginput_container input[type="checkbox"] + label a{color: #622a86; } .main-form .gform_wrapper ul.gfield_checkbox li label::after, .main-form .gform_wrapper ul.gfield_radio li label::after, body .main-form .gform_wrapper .top_label div.ginput_container input[type="checkbox"] + label::after{content: ""; left: 0; top: 4px; position: absolute; width: 20px; height: 20px; border: 2px solid #d6d6d6; background-color: #fff; } .main-form .gform_wrapper ul.gfield_radio li label::after {border-radius: 50%; } .main-form .gform_wrapper ul.gfield_checkbox li label::before, body .main-form .gform_wrapper .top_label div.ginput_container input[type="checkbox"] + label::before{content: ""; position: absolute; left: 5px; top: 10px; width: 11px; height: 6px; border-left: 2px solid #622a86; border-bottom: 2px solid #622a86; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -moz-transform: rotate(-45deg); opacity: 0; z-index: 1; } .main-form .gform_wrapper ul.gfield_radio li label::before {content: ""; position: absolute; left: 5px; top: 9px; z-index: 1; width: 10px; height: 10px; background-color: #622a86; border-radius: 50%; opacity: 0; } .main-form .gform_wrapper ul.gfield_checkbox li input[type="checkbox"]:checked ~ label::before, .main-form .gform_wrapper ul.gfield_radio li input[type="radio"]:checked ~ label::before, body .main-form .gform_wrapper .top_label div.ginput_container input[type="checkbox"]:checked ~ label::before{opacity: 1;} .main-form .gform_wrapper ul.gfield_checkbox li.checked label::before{opacity:1 !important;} .main-form .gform_wrapper .top_label .gfield_label + .gfield_description {width: 190px; float: left; clear: both; padding: 0; } .main-form .gform_wrapper .gform_footer {padding: 0; margin: 16px 0 0; clear: none; float: right; position: relative; width: calc(100% - 210px); } .main-form .gform_wrapper .gform_footer button.button {float: left; width: auto; margin: 0; font-weight: normal; text-align: center; height: 60px; line-height: 60px; background-color: #622a86; box-shadow: 0 5px 10px rgba(0,0,0,0.15); border-radius: 30px; position: relative; font-size: 20px; color: #ffffff; font-family: 'RussoOne-Regular'; padding: 0 40px 0 40px; cursor: pointer; } .main-form .gform_wrapper .gform_footer button.button:hover {background-color: #fff;color: #622a86;} .main-form .gform_wrapper .field_description_below .gfield_description {float: right; width: calc(100% - 210px); font-size: 15px; color: #8e8b8a; font-family: 'Trenda-Regular'; margin-top: 6px; border: none; overflow: visible; max-height: inherit; padding: 0; } .main-form .gform_wrapper.gform_validation_error .gform_body ul li.gfield.gfield_error:not(.gf_left_half):not(.gf_right_half) {max-width: 100% !important; } .main-form .gform_wrapper li.gfield.gfield_error.gfield_contains_required div.gfield_validation_message {max-width: 100%; float: right; width: calc(100% - 210px); font-size: 17px; color: #ffb400; font-weight: normal; font-family: 'Trenda-Regular'; line-height: normal; margin-left: 0; border-radius: 0; padding: 0; margin-top: 6px; } /*.main-form .gform_wrapper li.gfield_error input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]), .main-form .gform_wrapper li.gfield_error textarea {border: 1px solid #eca400;}*/ .main-form .gform_wrapper div.validation_error, .main-form .gform_confirmation_message {float: left; width: 100%; clear: none; text-align: left; background-color: #ffb400; padding: 17px 20px 17px; margin-bottom: 40px; margin-top: 0; border-radius: 0; border: none !important; box-shadow: none; } .main-form .gform_confirmation_message {background-color: #00b895; margin-bottom: 0;} .main-form.dark-bg-form .gform_confirmation_message {background-color: #ffffff;text-align:center;} .main-form .gform_wrapper div.validation_error > h2.hide_summary {margin: 0; color: #fff; font-size: 17px; font-weight: normal; font-family: 'Trenda-Regular'; } .main-form .gform_wrapper div.validation_error > h2.hide_summary::before {display: none !important;} /*body .main-form .gform_wrapper .top_label div.ginput_container.ginput_container_fileupload input {width: 100%; height: 55px; opacity: 0; cursor: pointer;} body .main-form .gform_wrapper .top_label div.ginput_container.ginput_container_fileupload input ~ span {clip: initial; clip-path: unset; float: left; height: auto; overflow: visible; width: 100%; left: 0; top: 0px; margin: 0; pointer-events: none; line-height: 57px;} body .main-form .gform_wrapper .top_label div.ginput_container.ginput_container_fileupload input ~ span::before {float: left; content: "Select file"; height: 55px; line-height: 57px; border: 1px solid #62a431; padding: 0 40px; border-radius: 30px; background-color: #fff; font-size: 16px; color: #63a532; font-family: 'FSIndustrieW01-Bold'; margin-right: 20px; } body .main-form .gform_wrapper .top_label div.ginput_container.ginput_container_fileupload .ginput_preview {line-height: 55px; } body .main-form .gform_wrapper .top_label div.ginput_container.ginput_container_fileupload .ginput_preview strong {font-weight: normal; }*/ body .main-form .gform_wrapper ul li.gfield.gfield_html {margin-top: 16px !important; margin-bottom: 33px !important; } body .main-form .gform_wrapper .top_label div.ginput_container.ginput_container_date input {background-image: url(images/icon-calender.svg);background-repeat: no-repeat;background-position: calc(100% - 23px);padding-right: 60px !important;} body .main-form .gform_legacy_markup_wrapper div.gform_body ul.gform_fields li.gfield.gfield_html.privacy-text {margin-bottom: 15px !important; } body .main-form .gform_legacy_markup_wrapper div.gform_body ul.gform_fields li.gfield.gfield_html.privacy-text p {float: right; width: calc(100% - 210px) !important; color: #5c5956; font-size: 16px; } body .main-form .gform_legacy_markup_wrapper div.gform_body ul.gform_fields li.gfield.gfield_html p > a {color: #622a86; } .main-form .gform_legacy_markup_wrapper .validation_message {letter-spacing: normal; max-width: 100%; float: right; width: 100%; font-size: 17px; color:#ffb400; font-weight: normal; font-family: 'Trenda-Regular'; line-height: normal; margin-left: 0; border-radius: 0; padding: 0; margin-top: 5px;} .main-form .gform_legacy_markup_wrapper .validation_message:empty {display: none; } /* Custom file upload */ body .main-form .gform_wrapper ul li.gfield.custom-file-upload::after {content: ""; position: absolute; right: 0; width: calc(100% - 210px); bottom: 0; top: 0; border: 2px dotted #d6d6d6;pointer-events: none;} body .main-form .gform_wrapper ul li.gfield.custom-file-upload .ginput_container_fileupload {padding: 30px 30px 0; } body .main-form .gform_wrapper ul li.gfield.custom-file-upload .gfield_description {padding: 11px 30px 27px; } body .main-form .gform_wrapper ul li.gfield.custom-file-upload .ginput_container_fileupload input {width: 195px; height: 48px; border-radius: 30px; opacity: 0; cursor: pointer; } body .main-form .gform_wrapper ul li.gfield.custom-file-upload .ginput_container_fileupload > span {width: 195px; height: 48px; background-color: #1e1e1e; float: left;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;align-content: center; border-radius: 30px; overflow: hidden; text-align: center;color: #fff; cursor: pointer; font-size:0 !important; font-family: 'RussoOne-Regular'; margin-top: -48px; pointer-events: none;box-shadow: 0 5px 10px rgba(0,0,0,0.15);padding: 0;} body .main-form .gform_wrapper ul li.gfield.custom-file-upload .ginput_container_fileupload > span::after {content: "Upload document";font-size: 16px !important;white-space: nowrap;} body .main-form .gform_wrapper ul li.gfield.custom-file-upload.foto-upload .ginput_container_fileupload > span::after {content: "Upload foto";} body .main-form .gform_wrapper ul li.gfield.foto-upload .ginput_container_fileupload input, body .main-form .gform_wrapper ul li.gfield.foto-upload .ginput_container_fileupload > span {width: 147px; } body .main-form .gform_wrapper ul li.gfield.gfield_error.custom-file-upload {margin-bottom: 35px !important; } body .main-form .gform_wrapper ul li.gfield.custom-file-upload .gfield_validation_message {margin-bottom: -23px !important; margin-top: 0 !important; } .custom-file-name {float: left; width: 100%; margin-top: 21px; background-color: #eeeeee; padding: 11px 90px 10px 46px; font-size: 15px; color: #5c5956; background-image: url(images/icon-file.svg); background-repeat: no-repeat; background-position: 12px 10px; margin-bottom: -2px;position:relative} .foto-upload .custom-file-name {background-image: url(images/icon-img.svg);background-position: 12px 13px;} .custom-file-name:empty {display: none; } span.replace-btn {position: absolute;right: 11px;top: 12px;color: #622a86;font-size: 14px;border-bottom: 1px solid transparent;cursor:pointer;} span.replace-btn:hover {border-bottom-color:#622a86} /* Dark background form */ .dark-bg-form.main-form .gform_wrapper .top_label .gfield_label {color: #fff; } .dark-bg-form.main-form .gform_wrapper input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]), .dark-bg-form.main-form .gform_wrapper textarea, .dark-bg-form.main-form .gform_wrapper .top_label select {color: #fff;border: 2px solid #fff !important;background-color: transparent;} .dark-bg-form.main-form .gform_wrapper .gfield_required_asterisk {background-color: #1e1e1e;} .dark-bg-form.main-form .gform_wrapper .top_label select {background-image: url(images/icon-dropdown-white.svg);} .dark-bg-form.main-form .gform_legacy_markup_wrapper select option {color:#000;} .dark-bg-form.main-form .gform_wrapper ul.gfield_checkbox li label, .dark-bg-form.main-form .gform_wrapper ul.gfield_radio li label {color: #fff;} .dark-bg-form.main-form .gform_wrapper ul.gfield_checkbox li label::after, .dark-bg-form.main-form .gform_wrapper ul.gfield_radio li label::after {border: 2px solid #fff; background-color: transparent; } .dark-bg-form.main-form .gform_wrapper ul.gfield_checkbox li label::before {border-left: 2px solid #fff;border-bottom: 2px solid #fff;} /* Normal form */ .normal-form.main-form .gform_wrapper .top_label .gfield_label {width: 100%; margin-top: 0 !important; margin-bottom: 11px !important; } body .normal-form.main-form .gform_wrapper .top_label div.ginput_container {width: 100% !important;} .normal-form.main-form .gform_wrapper .gfield_required_asterisk {top: 19px;} .normal-form.main-form .gform_wrapper .gform_footer {width: 100%} .normal-form.main-form .gform_wrapper li.gfield.gfield_error.gfield_contains_required div.gfield_description, .normal-form.main-form .gform_wrapper .field_description_below .gfield_description {width: 100%;} body .main-form.normal-form .gform_legacy_markup_wrapper div.gform_body ul.gform_fields li.gfield.gfield_html.privacy-text p {width: 100% !important; color: #a5a5a5; } /* Job alert sidebar */ .job-alert-sidebar {position: fixed; left: 0; top: 0; bottom: 0; z-index: 99999; background-color: #1e1e1e; width: 620px; overflow: auto;transform: translateX(-620px);-webkit-transform: translateX(-620px);-o-transform: translateX(-620px);-ms-transform: translateX(-620px);-moz-transform: translateX(-620px);} .job-alert-sidebar.show {transform: translateX(0); -webkit-transform: translateX(0); -o-transform: translateX(0); -ms-transform: translateX(0); -moz-transform: translateX(0); } body.admin-bar .job-alert-sidebar, body.admin-bar .sidebar-modal {top: 32px;} #custom_html-4 {float: left; width: 100%; padding: 60px 80px 80px 80px; } .job-alert-wrapper {float: left; width: 100%; } .sidebar-header {float: left; width: 100%; margin-bottom: 28px;} .sidebar-header .job-mail-icon {float: left; margin-bottom: 31px; margin-top: 0; } .sidebar-header h2 {color: #fff; margin-bottom: 23px; } .sidebar-header > p {color: #a5a5a5;} /* Home Branche part */ .home-branche-part {padding:245px 0; position: relative; } .home-branche-part::before {content: ""; left: 0; right: 0; top: 0; bottom: 0; position: absolute; background: -moz-linear-gradient(left, rgba(30,30,30,0.9) 0%, rgba(30,30,30,0) 100%); background: -webkit-linear-gradient(left, rgba(30,30,30,0.9) 0%,rgba(30,30,30,0) 100%); background: linear-gradient(to right, rgba(30,30,30,0.9) 0%,rgba(30,30,30,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e61e1e1e', endColorstr='#001e1e1e',GradientType=1 ); z-index: 1; } .home-branche-part > picture {position: absolute; left: 0; right: 0; top: 0; bottom: 0; } .vakgebieden-banner {opacity: 0; } .vakgebieden-banner.show { opacity: 1; } .home-branche-wrapper {display: flex; flex-wrap: wrap; align-items: center; position: relative;z-index: 1;justify-content: space-between;} .home-branche-wrapper h2 {color: #fff; font-size: 48px; line-height: 56px; width: 40%; } .home-branche-view {float: left; width: 400px;margin-right: 109px;} .vakgebieden-home-list {float: left; width: 100%; box-shadow: 0 5px 10px rgba(0,0,0,0.15);} .vakgebieden-home-list li {float: left; width: 100%; border-bottom: 2px solid #4b4b4b; } .vakgebieden-home-list li:last-child {border-bottom: none; } .vakgebieden-home-list li a {float: left; width: 100%; position: relative; background-color: #1e1e1e; padding: 32px 30px 31px 108px; color: #ffffff; font-size: 30px; font-family: 'RussoOne-Regular'; } .vakgebieden-home-list li a i {position: absolute; left: 40px; top: 30px; width: 40px; height: 40px; background-color: #cc5200; border-radius: 50%; text-align: center; line-height: 38px; } .vakgebieden-home-list li a:hover {background-color: #353535;} .vakgebieden-home-list li a:hover i {background-color: #622a86;} .vakgebieden-home-list li.active a {background-color: #353535;} .vakgebieden-home-list li.active a i {background-color: #622a86;} /* Home service part */ .home-service-part {padding: 100px 0 60px; margin-top: -100px; z-index: 1; } .service-wrapper {display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 1060px; width: 100%; } .service-card {width: calc(50% - 20px); box-shadow: 0 5px 10px rgba(0,0,0,0.15); padding: 40px 40px 32px; margin-bottom: 40px; position: relative; transform: translateY(0px);-webkit-transform: translateY(0px);-moz-transform: translateY(0px);} .service-card:hover {box-shadow: 0 10px 20px rgba(0,0,0,0.15);} a.link-cover {position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 11; } .service-title {float: left; width: 100%; margin-bottom: 22px; } .service-icon {float: left; width: 60px; height: 60px; } .service-icon img {max-height: 100%; } .service-title h3 {width: calc(100% - 60px); padding-left: 40px; margin-top: 13px; } .service-card:hover .service-title h3 {color: #622a86;} .service-card > p {margin-bottom: 12px;} .service-text-card {width: 75%;padding-right: 40px;padding-top: 35px;margin-bottom: 50px;} .service-text-card h3 {margin-bottom: 10px; } .service-text-card p a {color: #622a86; } /* Home About part */ .home-about-part {position: relative; margin-bottom: 80px; } .about-image{position: absolute; left: 0; top: 0; bottom: 0; width: calc(50% - 240px); } .about-image > picture {width: 100%;height: 100%;float: left;} .about-image .i-shape {z-index: 1; right: -4px; height: 276px; } .home-about-text {float: right; width: 730px; padding: 153px 115px 152px 0; } .home-about-text h3 {margin-bottom: 19px; } .home-about-text p {margin-bottom: 24px; } /* ********** Service overview page ********** */ .inner-banner {position: relative; padding: 183px 0 172px; background-color: #622a86; } .inner-banner > picture {position: absolute; right: 0; top: 0; bottom: 0; width: calc(50% - 240px); } .inner-banner-content {float: left; width: 840px; } .inner-banner-content h1 {color: #fff; font-size: 64px; line-height: normal; margin-bottom: 12px; } .inner-banner-content p {color: #ffffff;font-size: 18px;margin-bottom: 27px;} .inner-banner-content p > a { color: inherit; border-bottom: 1px solid #fff;} .inner-banner-content p:last-child {margin-bottom: 0;} .service-showcase {padding: 91px 0 106px; margin-top: -100px; z-index: 1; } .service-overview-part {float: left; width: 100%; margin-bottom: 70px; } .service-overview-part > h3 {margin-bottom: 31px; } .service-overview-wrapper {float: left; width: 100%; } .service-overview-wrapper .row {margin-left: -20px; margin-right: -20px; } .service-col {padding-left: 20px; padding-right: 20px;margin-bottom: 40px;} .service-col .service-card {width: 100%; float: left; height: 100%; background-color: #fff; padding: 46px 40px 32px; margin-bottom: 0; } .service-col .service-title {margin-bottom: 15px;} /*.service-col .service-title h3 {width: 100%; padding-left: 0;margin-top: 27px;}*/ .service-steps-part {float: left; width: 100%; margin-bottom: 77px; } .steps-row {display: flex; flex-wrap: wrap; width: 100%; align-items: center; margin-bottom: 110px; } .steps-row:last-child {margin-bottom: 0; } .stpes-img {float: left; width: 510px; height: 577px; } .full-picture {float: left; width: 100%; height: 100%; } .steps-content {float: left; width: 550px; padding-left: 152px; } .steps-content h3 {margin-bottom: 22px; } .steps-content p {margin-bottom: 26px; } .steps-content p:last-child {margin-bottom: 0; } .steps-content p a {color: #622a86; } .steps-row:nth-child(2n) {flex-direction: row-reverse; justify-content: space-between; } .steps-row:nth-child(2n) .stpes-img {width: 620px; height: 418px; } .steps-row:nth-child(2n) .steps-content {padding-left: 0; width: 530px; } .logo-part {float: left; width: 100%; } .logo-part h3 {margin-bottom: 35px; } .logo-list {display: flex; flex-wrap: wrap; width: 100%; align-items: center;max-width: 1100px;} .logo-list span {width: 197px; text-align: center; padding: 0 20px;margin-right: 20px;} .logo-list span > img {max-height: 80px; } .logo-list .slick-track {display: flex; flex-wrap: wrap; align-items: center; } .logo-list .slick-track::before, .logo-list .slick-track::after {display: none; } .testimonial-content {padding: 122px 115px 100px 0; } .testimonial-content blockquote {float: left; width: 100%; position: relative; margin-bottom: 30px; } .testimonial-content blockquote::before {content: ""; position: absolute; width: 145px; height: 90px; left: -20px; top: -42px; background-image: url(images/quote-icon.svg); background-repeat: no-repeat; background-size: cover; z-index: -1; } .testimonial-content blockquote p {font-size: 31px; color: #1e1e1e; line-height: 42px; margin-bottom: 0; } .testimonial-meta {float: left; width: 100%; display: flex; flex-wrap: wrap; align-items: center; } .testimonial-meta > span {float: left; width: 60px; height: 60px; border-radius: 50%; overflow: hidden; } .testimonial-meta > span img,.contact-cta-info > span img, .avatar-img > img {width: 100%; height: 100%; object-fit: cover; } .testimonial-text {float: left; width: calc(100% - 60px);} .testimonial-meta > span + .testimonial-text {padding-left: 22px;} .testimonial-text h4 {font-size: 17px; color: #1e1e1e; font-family: 'Trenda-Bold'; margin-bottom: 1px; } .testimonial-text p {margin-bottom: 0; } /* Contact CTA */ .small-container {width: 1060px; max-width: 100%; margin: 0 auto; } .contact-cta-part {padding-top: 20px; padding-bottom: 105px; } .contact-cta-wrapper {padding-bottom: 72px; } .contact-cta-wrapper h2 {margin-bottom: 27px; } .contact-cta-info {display: flex; flex-wrap: wrap; width: 100%; align-items: center; } .contact-cta-info > span {width: 80px; height: 80px; border-radius: 50%; overflow: hidden; } .contact-cta-right-part {width: calc(100% - 80px); padding-left: 40px; } .contact-cta-right-part > p {margin-bottom: 7px; } .contact-cta-right-part .footer-contact-info {float: left; width: 100%; margin-left: 0; } .contact-cta-right-part .footer-contact-info a {color: #1e1e1e;margin-right: 30px;} .contact-cta-right-part .footer-contact-info a span::after {background-color: #1e1e1e; } .contact-cta-part .job-alert-cta .more-info-btn {background-color: #eeeeee; } /* ********** Service detail page ********** */ .service-detail-part {padding-top: 110px; padding-bottom: 92px; } .service-detail-part .service-steps-part {margin-bottom: 92px; } .service-inzet-part {float: left; width: 100%; } .service-inzet-left {float: left; width: 520px; } .service-inzet-left h2 {color: #622a86; line-height: 42px; margin-bottom: 25px; } .service-inzet-right {float: left; padding-left: 140px; width: 570px; } .service-inzet-right .info-usp-list {margin-bottom: 0; } /* ********** Vakgebied detail page ********** */ .inner-banner-content .more-info-btn {margin-top: 6px;margin-bottom: 8px;} .vakgebied-detail-part {padding-top: 110px; } .mo-margin {margin-bottom: 0 !important; } .vakgebied-job-part {padding: 73px 0 75px; margin-bottom: 80px; } .vakgebied-job-part .job-alert-cta {margin-bottom: 52px; } .vakgebied-job-info {float: left; width: 100%; max-width: 1060px;margin-bottom: 20px;} .vakgebied-job-info > h3 {margin-bottom: 34px; } .job-main-list {float: left; width: 100%; } .job-main-list > .row {margin-left: -20px; margin-right: -20px; } .job-col {padding-left: 20px; padding-right: 20px; margin-bottom: 40px; } .job-card {display: flex; width: 100%; background-color: #fff; padding: 36px 34px 40px 40px; box-shadow: 0 5px 10px rgba(0,0,0,0.15); height: 100%; flex-wrap: wrap; align-content: space-between; position: relative;transform: translateY(0px);-webkit-transform: translateY(0px);-moz-transform: translateY(0px);} .job-card:hover {box-shadow: 0 10px 20px rgba(0,0,0,0.15);} .job-main-list .job-card:hover, .service-card:hover {transform: translateY(-8px);-webkit-transform: translateY(-8px);-moz-transform: translateY(-8px);} .job-top-part {float: left; width: 100%;margin-bottom: 22px;} .job-top-part h3 {margin-bottom: 22px; } .job-card:hover .job-top-part h3 {color: #622a86;} .tag-part {float: left; width: 100%; margin-bottom: 12px; } .tag-part > span {float: left; margin-right: 10px; margin-bottom: 10px; height: 32px; border: 2px solid #eee; border-radius: 30px; padding: 0 15px; line-height: 30px; font-size: 15px; color: #8e8b8a; } .tag-part > span:empty {display: none; } .job-bottom-part {display: flex; width: 100%; flex-wrap: wrap; align-items: center; } .avatar-img {float: left;width: 60px; height: 60px; border-radius: 50%; overflow: hidden; } .job-bottom-part .more-info-btn {width: calc(100% - 60px); padding-left: 30px; } .text-link b {font-weight: normal; color: #1e1e1e; } .text-link b p {color: #1e1e1e; width: auto; font-size: 18px; margin-right: 4px; } /* ********** Werken page ********** */ .reason-main-part {padding: 110px 0; margin-top: -100px;margin-bottom: -100px; z-index: 11;} .reason-steps-part {float: left; width: 100%; } .reason-left-col {float: left; width: 510px; } .reason-right-col {float: right; width: 620px;padding-top: 102px;} .reason-card {float: left; width: 100%;} .reason-card > picture {float: left; width: 100%; height: 480px; margin-bottom: -80px;} .reason-text {float: left;width: 400px;padding: 32px 40px 31px;background-color: #1e1e1e;} .reason-text > h3 {margin-bottom: 14px; } .reason-main-title {max-width: 400px; margin-bottom: 102px; } .r-card1 .reason-text {float: right; background-color: #eeeeee;} .r-card1 {margin-bottom: 92px; } .r-card3 .reason-text {background-color: transparent; padding: 0; width: 100%; } .r-card3 {margin-bottom: 101px; } .r-card5 > picture {width: 400px; float: right; } .r-card5 h3, .r-card2 h3 {color: #fff; } .r-card5 p, .r-card2 p {color: #a5a5a5; } .r-card2 {margin-bottom: 110px; } .r-card4 {margin-bottom: 70px; } .r-card4 .reason-text {background-color: #fff; width: 510px; } .reason-outer-text {float: left; border: 8px solid #622a86; width: 400px; padding: 0 32px 24px; } .reason-outer-text h2 {color: #622a86; background-color: #fff; margin-bottom: 16px; width: auto; margin-top: -27px; padding: 0 15px; margin-left: -15px; } .reason-outer-text p a {color: #622a86; } .reason-main-title.mobile-reason-title {display: none !important;} /* Faq part */ .faq-contact-part {padding: 71px 0 64px; margin-top: -100px; z-index: 11; } .faq-wrapper {float: left; width: 1060px; max-width: 100%; } .faq-col {float: left; width: 620px; } .faq-col > h3 {margin-bottom: 32px; } .faq-inner-part {float: left; width: 100%; } .panel-group {margin-bottom: 0; float: left; width: 100%; } .panel-group .panel {margin-bottom: 0 !important; margin-top: 0 !important; border-radius: 0 !important; background-color: transparent !important; float: left; width: 100%; border: none !important; box-shadow: none !important; border-top: 2px solid #eee !important;} .panel-default > .panel-heading {float: left; width: 100%; padding: 0; border-radius: 0; background-color: transparent; border: none; } .panel-title {font-size: 18px; font-family: 'Trenda-Bold'; margin-bottom: 0 !important; font-weight: normal; line-height: normal; float: left; width: 100%; } .panel-title > a {float: left; width: 100%; padding: 21px 20px 20px 57px; position: relative; color: #622a86; } .panel-title > a:hover {color:#622a86 !important;} .panel-title > a > i {position: absolute; top: 15px; left: 0; width: 32px; height: 32px; font-size: 24px; line-height: 29px; color: #622a86; background-color: #eee; border-radius: 50%; padding-left: 1.6%; font-style: normal; font-weight: normal; transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); } .panel-title > a.collapsed > i {background-color: #622a86;color: #fff;transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); } .panel-title > a.collapsed {color: #1e1e1e; } .panel-collapse {float: left; width: 100%; } .panel-default > .panel-heading + .panel-collapse > .panel-body {border: none !important; float: left; width: 100%; padding:0 12px 19px 57px; margin-top: 0px; } .faq-contact-col {float: right; width: 290px; } .faq-contact-title {float: left; display: flex; flex-wrap: wrap; width: 100%; justify-content: space-between; align-items: center; margin-bottom: 10px; } .faq-contact-title > h3 {font-size: 21px; line-height: 28px; max-width: 170px; } .faq-contact-title > h3 span {color: #622a86; } .faq-contact-title .avatar-img {width: 80px; height: 80px; } .faq-contact-col .more-info-btn {margin-top: 22px; } .call-btn {background-color: #fff; color: #1e1e1e; font-size: 18px; font-family: 'Trenda-Bold'; padding: 0 20px 0 60px; height: 48px; line-height: 48px; } .call-btn:hover {line-height: 168px;} .call-btn i {width: 32px; height: 32px; background-color: #622a86; top: 8px; left: 8px; font-size: 14px; color: #ffffff; line-height: 33px; } .online-text {float: left; width: 100%; font-size: 15px; color: #8e8b8a; padding-left: 23px; position: relative; margin-top: 29px; } .online-text::after {content: ""; position: absolute; left: 0; top: 4px; width: 10px; height: 10px; background-color: #008000; border-radius: 50%; } .online-text.not-available::after {background-color: #aba9a8; } /* Slider part */ .work-related-slider {padding: 115px 0 126px; } .work-job-part {float: left; width: 100%; margin-bottom: 14px; } .work-job-part .small-container {float: left; } .work-cta-part {float: left; width: 100%; } .work-cta-part .job-alert-cta .more-info-btn{background-color: #eeeeee} .related-slider-part {float: left; width: 100%; } .werken-job-slider {float: left; width: 100%; } .werken-job-slider .slick-track {left: -385px; display: flex; flex-wrap: wrap; } .werken-job-slider .slick-track::after, .werken-job-slider .slick-track::before {display: none; } .werken-job-slider .job-col { float: left;width: 550px;height: auto;margin-top: 20px;} .slick-arrow {width: 50px; height: 50px; background-color: #622a86; border-radius: 50%; font-size: 0; box-shadow: 0 5px 10px rgba(0,0,0,0.15); background-repeat: no-repeat; background-position: center; } .slick-next.slick-arrow {background-image: url(images/icon-arrow-right.svg);} .slick-prev.slick-arrow {background-image: url(images/icon-arrow-right.svg);transform: rotate(180deg);-webkit-transform: rotate(180deg);-o-transform: rotate(180deg);-ms-transform: rotate(180deg);-moz-transform: rotate(180deg);box-shadow: 0 -5px 10px rgba(0,0,0,0.15);} .slick-arrow {position: absolute; left: calc(50% + 368px); top: -60px; z-index: 1; } .slick-arrow:hover{background-color: #1e1e1e;} .slick-prev.slick-arrow {left: calc(50% + 303px); } /* ********** Inschrijven detail page ********** */ .form-main-part {padding: 80px 0; z-index: 1; margin-top: -100px; } .form-main-part.white-bg::before, .small-white-bg::before {width: calc(50% + 200px);} .left-form-part {float: left; width: 660px; } .form-main-part .faq-contact-col {padding-top: 80px; } .left-form-part .body-text {float: left;width: 100%;margin-bottom: 20px;} /* ********** About page ********** */ .about-team-part {padding: 103px 0 92px;} .team-slider-part {float: left; width: 100%; } .team-member-slider {float: left; width: 100%; } .team-box {float: left; width: 330px; padding: 0 20px;margin-top: 20px;} .team-box-content {float: left; width: 100%;cursor: pointer;} .member-image {float: left; width: 100%; height: 380px; background-color: #fff;overflow: hidden;} .member-image img {width: 100%; height: 100%; object-fit: cover; transform: scale(1);-webkit-transform: scale(1);-moz-transform: scale(1);} .team-box-content:hover .member-image img {transform: scale(1.08);-webkit-transform: scale(1.08);-moz-transform: scale(1.08);} .member-meta {float: left; width: 100%; padding: 21px 20px 0; } .member-meta h4 {font-size: 17px; line-height: 28px; color: #1e1e1e; text-align: center; } .member-meta h4 strong {font-weight: normal; display: inline-block; font-size: 19px; color: #622a86; font-family: 'Trenda-Bold'; position: relative; } .member-meta h4 strong::after {content: "";position: absolute;left: 0;right: 0;bottom: -1px;height: 2px;background-color: #622a86;opacity: 0;} .member-meta h4 span {width: 100%; float: left; } .team-member-slider .slick-track {left: -494px; } .team-member-slider .slick-arrow {left: calc(50% + 478px);} .team-member-slider .slick-prev.slick-arrow {left: calc(50% + 413px); } .about-main-part {padding: 80px 0; margin-bottom: 80px; } .about-text {float: left; width: 520px; } .about-part-img {float: right; width: 620px; height: 420px; } .about-text h3 {margin-bottom: 14px; } .about-text p {margin-bottom: 11px; } .about-text p:last-child {margin-bottom: 0; } .about-text p > a {color: #622a86; } .internal-job-list {float: left; width: 100%; margin-bottom: 26px; } .internal-job-list li {float: left; width: 100%; margin-bottom: 8px; } .internal-job-list li:last-child {margin-bottom: 0; } .internal-job-list li .text-link {padding-left: 25px; padding-right: 0; background-position: left 9px; } .about-text h4 {font-family: 'Trenda-Bold'; margin-bottom: 6px; } /* Team member sidebar */ .sidebar-modal {display: block !important; position: fixed; left: 0; top: 0; bottom: 0; z-index: 99999; background-color: #1e1e1e; width: 620px; overflow: auto; right: initial; opacity: 1; transform: translateX(-620px);-webkit-transform: translateX(-620px);-o-transform: translateX(-620px);-ms-transform: translateX(-620px);-moz-transform: translateX(-620px);padding-right: 0 !important;} .sidebar-modal.in {transform: translateX(0); -webkit-transform: translateX(0); -o-transform: translateX(0); -ms-transform: translateX(0); -moz-transform: translateX(0); } .modal-wrapper {float: left; width: 100%; padding: 80px 80px 80px 80px; } .modal-member-content {float: left; width: 100%;} .modal-member-content .avatar-img {width: 80px; height: 80px; margin-bottom: 23px; } .modal-member-content h2 {color: #fff; margin-bottom: 23px; } .member-bio {float: left; width: 100%; margin-bottom: 23px; } .member-bio p {color: #a5a5a5; margin-bottom: 31px; } .member-bio p:last-child {margin-bottom: 0; } .modal-member-content .footer-contact-info {float: left; margin-left: 0; width: 100%;} .modal-member-content .footer-contact-info a {margin-bottom: 10px; margin-right: 0;clear: left;} .modal-member-content .footer-contact-info a:last-child {margin-bottom: 0; } .modal-backdrop {z-index: 9999;} /* ********** Text page ********** */ .bg-inner-banner {background-image: url(images/I-image-banner-white.svg); background-repeat: no-repeat; background-size: 336px; background-position: calc(100% - 72px) 132px; } .text-main-part {padding: 77px 0 92px; margin-bottom: 100px; margin-top: -100px; z-index: 1; } .text-wrapper-part {float: left; width: 750px; } .text-wrapper-part .body-text {float: left; width: 100%; } .body-text h3 {margin-bottom: 12px; } .body-text p {margin-bottom: 28px; } .body-text p:last-child {margin-bottom: 0; } .body-text p a,.body-text li a,.service-inzet-left p a {color: #622a86;} .body-text h2 {margin-bottom: 10px; } .body-text h4, .body-text h5, .body-text h6 {font-family: 'Trenda-Bold'; margin-bottom: 10px; } .body-text > ul, .body-text > ol {float: left; width: 100%; margin-bottom: 24px;} .body-text > ul:last-child, .body-text > ol:last-child {margin-bottom: 0; } .body-text > ul > li, .body-text > ol > li {float: left; width: 100%; font-size: 17px; line-height: 28px; color: #5c5956; position: relative; padding-left: 30px; margin-bottom: 8px; } .body-text > ul > li:last-child, .body-text > ol > li:last-child {margin-bottom: 0;} .body-text > ul > li::before {content: "\eed8"; font-family: IcoFont !important; position: absolute; left: 0; font-size: 20px; color: #622a86; line-height: 28px;} .body-text > ol {list-style: none; counter-reset: li; } .body-text > ol > li {counter-increment: li; } .body-text > ol > li::before {content: "." counter(li); color: #622a86; display: inline-block; width: 17px; margin-left: -32px; text-align: right; direction: rtl; margin-right: 17px; font-family: 'Trenda-Bold'; } /* ********** Contact page ********** */ .contact-box-part {float: left; max-width: 1060px; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; position: relative; margin-bottom: 45px;margin-top: 32px;} .contact-info-box {float: left; width: calc(50% - 20px); background-color: #fff; padding: 32px 40px 31px; box-shadow: 0 5px 10px rgba(0,0,0,0.15); } .contact-info-box h3 {font-size: 18px; line-height: 28px; margin-bottom: 22px; } .contact-info-box .footer-contact-info {float: left; width: 100%; margin-left: 0;margin-bottom: 22px;} .contact-info-box .footer-contact-info a {color: #1e1e1e; float: left; clear: left; margin-bottom: 10px; } .contact-info-box .footer-contact-info a span::after {background-color: #1e1e1e;} .contact-info-box .footer-contact-info a:last-child {margin-bottom: 0; } .contact-info-box > p a {color: #622a86; } .contact-address-info {float: left; width: 840px; } .address-link {float: left; width: 100%; margin-bottom: 24px; } .address-link > a {float: left; position: relative; font-size: 20px; line-height: normal; color: #ffffff; font-family: 'Trenda-Bold'; padding-left: 45px; cursor: pointer; } .address-link > a > i {width: 32px; height: 32px; border: 2px solid #ffffff; border-radius: 50%; color: #ffffff; font-size: 14px; text-align: center; line-height: 28px; margin-right: 14px; position: absolute; left: 0; top: -5px; } .address-link a span::after {background-color: #fff;} .contact-address-info > p {color: #ffffff; } .contact-address-info > p > span {color: #1e1e1e; } .contact-form-part {padding: 91px 0 82px; margin-top: -100px; z-index: 1; margin-bottom: -100px; } .contact-form-part.white-bg::before {width: calc(50% + 422px); } .conatct-form-wrapper {float: left; width: 660px; } .conatct-form-wrapper > h3 {margin-bottom: 36px; } .map-area {height: 600px; } .map-area > img {width: 100%; height: 100%; object-fit: cover; } /* ********** Job detail page ********** */ body.single-vacature header.site-header {position: absolute; } body.single-vacature .orng-small-btn, body.views-template-form-page-template .orng-small-btn, body.views-template-404-page-template .orng-small-btn, body.views-template-target-group-landing-page-template .orng-small-btn{background-color: #fff; color: #622a86; } body.single-vacature .orng-small-btn:hover, body.views-template-form-page-template .orng-small-btn:hover, body.views-template-404-page-template .orng-small-btn:hover, body.views-template-target-group-landing-page-template .orng-small-btn:hover{background-color: #622a86; color: #fff; border-color: #fff;} .job-detail-banner {padding: 191px 0 180px; } .job-banner-content {float: left; width: 839px; } .back-link {float: left; width: 100%;margin-bottom: 28px;} .back-link a {display: inline-block; position: relative; font-size: 18px; color: #ffffff; font-family: 'Trenda-Bold'; padding-left: 25px; cursor: pointer; } .back-link a > i {position: absolute; width: 12px; left: 0; top: -1px; } .back-link a span::after {background-color: #fff;} .job-banner-content h1 {font-size: 48px; line-height: 52px; color: #ffffff; margin-bottom: 29px; } .job-banner-content .tag-part {margin-bottom: 23px; } .tag-part.red-tag-part > span {background-color: #fff;border-color: #fff;color: #622a86; line-height: 28px;} .job-banner-content > p {font-size: 18px; color: #ffffff; margin-bottom: 27px; } .job-banner-content .more-info-btn {margin-top: 6px; } .share-option {display: inline-block; vertical-align: middle; margin-left: 30px; position: relative; top: -2px; } .share-option > span {float: left; font-size: 18px; line-height: 28px; color: #ffffff;margin-right: 30px;} .share-list {float: left; } .share-list li {float: left; margin-right: 29px; } .share-list li a {float: left; font-size: 18px; color: #ffffff; line-height: 28px; font-family: 'Trenda-Bold'; } .share-list li a i {margin-right: 9px; } .share-list li a span::after {background-color: #fff;height: 1px;} .job-detail-part {padding: 72px 0 103px; margin-top: -100px; z-index: 1;overflow: hidden;} .job-detail-part .faq-contact-col {padding-top: 80px; } .job-info-col {float: left; width: 745px; padding-left: 50px; position: relative; } .job-info-col::after {content: "";position: absolute;left: 0;bottom: -103px;width: 16px;height: 16px;background-color: #fff;} .custom-progress-bar {content: ""; left: 7px; top: 12px; bottom: -80px; width: 2px; background-color: #eeeeee; position: absolute;} .custom-progress-bar > span {position: absolute; left: 0; top: 4px; width: 100%;background-color: #622a86; } .custom-progress-bar > span::after {content: "\ea5b"; position: absolute; bottom: -5px; left: -6px; font-family: IcoFont !important; color: #622a86; font-size: 15px; } .job-info-row {float: left; width: 100%; margin-bottom: 43px; } .job-info-row:last-child {margin-bottom: 0; } .job-info-row > h3 {margin-bottom: 13px; } h3.dot-first {position: relative; } .dot-first.only-dot {top: 63px;z-index: 1;} .dot-first::before {content: ""; position: absolute; left: -50px; top: 8px; width: 16px; height: 16px; background-color: #fff; border: 2px solid #622a86; border-radius: 50%;} .dot-first::after {content: ""; position: absolute; left: -67px; top: -9px; width: 50px; height: 50px; background-color: #622a86; border-radius: 50%;opacity: 0; } @keyframes pulse-ring {0% {transform: scale(0.33); opacity: 1; } 80%, 100% {opacity: 0; } } @-webkit-keyframes pulse-ring {0% {transform: scale(0.33); opacity: 1; } 80%, 100% {opacity: 0; } } @keyframes pulse-dot {0% {transform: scale(1); } 50% {transform: scale(1.2); } 100% {transform: scale(1); } } @-webkit-keyframes pulse-dot {0% {transform: scale(1); } 50% {transform: scale(1.2); } 100% {transform: scale(1); } } h3.dot-first.active::before {background-color: #622a86;-webkit-animation: pulse-dot 1.25s cubic-bezier(0.455, 0.03, 0.515, 0.955) -0.4s;animation: pulse-dot 1.25s cubic-bezier(0.455, 0.03, 0.515, 0.955) -0.4s;} h3.dot-first.active::after { -webkit-animation: pulse-ring 1.25s cubic-bezier(0.215, 0.61, 0.355, 1);animation: pulse-ring 1.25s cubic-bezier(0.215, 0.61, 0.355, 1);} .job-info-row .body-text {float: left; width: 100%; } .geboden-wordt {margin-bottom: 62px; } .process-part {margin-bottom: 65px; } .process-wrapper {float: left; width: 100%;margin-top: 19px;} .process-step-slider {float: left; width: 680px;max-width: 100%;} .process-step-slider .slick-list{overflow: visible;} .process-step-slide {float: left; width: 100%; position: relative; background-color: #fff; box-shadow: 0 5px 10px rgba(0,0,0,0.15); padding: 66px 40px 31px;z-index: 1;} .process-step-slide h3 {padding-left: 33px; padding-right: 200px; margin-bottom: 47px; } .step-count {position: absolute; left: 35px; top: 12px; font-size: 120px; line-height: normal; color: #eeeeee; font-family: 'RussoOne-Regular'; font-weight: normal; z-index: -1; } .process-step-slider .slick-arrow {left: initial; top: 53px;right: 40px; } .process-step-slider .slick-prev.slick-arrow {right: 105px; left: initial; } .inzet-usp > p {margin-bottom: 24px; } .inzet-usp .info-usp-list > li {margin-bottom: 23px; } .inzet-usp .info-usp-list {margin-bottom: 0; } .job-apply-part {padding: 50px 0 190px; z-index: 1; } .job-apply-part::after {content: ""; position: absolute; top: 58px; width: calc(50% + 318px); bottom: 110px; border: 8px solid #622a86; left: -8px; pointer-events: none; } .job-form-part {float: left; width: 700px; } .job-form-part > h2 {font-size: 64px; color: #622a86; width: auto; clear: left; padding: 0 40px; background-color: #fff; margin-top: -27px; position: relative; z-index: 1; margin-bottom: 41px; margin-left: -40px; } .job-form-part > p {margin-bottom: 32px; } .job-form-part .main-form {max-width: 660px; } .job-related-part {padding: 84px 0 75px;} .job-related-part .vakgebied-job-info {margin-bottom: 0; } .job-related-part .job-alert-cta {margin-bottom: 52px; } .job-related-part .job-alert-cta .more-info-btn {background-color: #eee;} .mobile-contact-person {display: none !important; } .mobile-solliciteer-btn {display: none; } .mobile-person-info {display: none;} /* ********** Job Overview page ********** */ .job-overview-banner {padding-bottom: 145px; } .all-jobs-list {padding: 80px 0 105px; z-index: 1; margin-top: -100px; } .all-jobs-list .small-container {float: left; } .all-jobs-list .job-main-list {margin-bottom: 40px; } .job-usp-wrapper {float: left; width: 100%; background-color: #eeeeee; padding: 34px 135px 34px 40px; position: relative;background-image: url(images/I-image.svg);background-repeat: no-repeat;background-size: 56px;background-position: calc(100% - 30px) 30px;} .job-usp-wrapper h3 {position: relative; font-size: 19px; line-height: 28px; padding-left: 25px; margin-bottom: 1px; } .job-usp-wrapper h3::before {content: "\eed8"; font-family: IcoFont !important; position: absolute; left: -4px; font-size: 20px; color: #622a86; line-height: 28px; } .hide-filter {display: none !important; } .custom-filter {float: left; width: 100%; margin-top: 10px; } .custom-filter > form {float: left; width: 100%; } .custom-input-grp {float: left; width: 100%; margin-bottom: 0; } .custom-input-grp > label {display: inline-block; vertical-align: middle; font-weight: normal; font-size: 17px; color: #ffffff; margin-right: 36px; margin-bottom: 15px; } .custom-input-grp .checkbox {display: inline-block; margin: 0 15px 15px 0; vertical-align: middle; } .custom-input-grp .checkbox > label {float: left; width: auto; height: 44px; line-height: 40px; border: 2px solid #fff; border-radius: 30px; font-size: 17px; color: #ffffff; font-weight: normal; font-family: 'Trenda-Bold'; padding: 0 20px; cursor: pointer; } .custom-input-grp .checkbox > label input[type="checkbox"] {opacity: 0; position: absolute; left: 0;visibility: hidden; } .custom-input-grp .checkbox > label > span {display: inline-block; width: 24px; height: 24px; background-color: #cc5200; border-radius: 50%; vertical-align: middle; text-align: center; line-height: 24px; font-size: 13px; font-family: 'Trenda-Regular'; margin-top: -4px; margin-left: 17px; margin-right: -12px; color: #fff !important;} .custom-input-grp .checkbox > label:hover, .custom-input-grp .checkbox > label.active{background-color: #fff;color: #622a86;} .custom-input-grp .checkbox > label.active {box-shadow: 0 5px 10px rgba(0,0,0,0.15);} .custom-input-grp .checkbox > label.active {transition: none !important; } /* ********** Thanks you page ********** */ .thanks-steps-part {padding: 40px 0 78px; margin-top: -100px; z-index: 1; } .steps-wrapper {float: left; width: 748px; max-width: 100%; } .process-steps-row {padding: 66px 0px 0px; box-shadow: none; background-color: transparent; margin-bottom: -6px; } .process-steps-row .step-count {left: 0; } .thanks-steps-part .faq-contact-col {padding-top: 140px; } /* ********** ninja forms ********** */ .main-form .nf-form-content {float: left; width: 100%; padding: 0; } .main-form .nf-multi-cell .nf-cell {padding: 0; width: 100% !important; } .main-form .nf-form-content .label-above .nf-field-label {clear: none; float: left; margin-bottom: 0 !important; margin-top: 15px !important; width: 210px; padding-right: 15px;position: static;} .main-form .nf-form-content label {font-size: 18px; color: #1e1e1e; font-family: 'Trenda-Bold'; line-height: normal;font-weight: normal;} .main-form .label-above .nf-field-element{margin-top: 0 !important; float: right; width: calc(100% - 210px) !important; position: relative; } .main-form .nf-form-content input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]), .main-form .nf-form-content textarea, .main-form .nf-form-content select {font-size: 17px; padding: 0 20px; padding-right: 20px; height: 55px; color: #5c5956; font-family: 'Trenda-Regular'; float: left; width: 100% !important; border: 2px solid #d6d6d6 !important; border-radius: 0; background-color: #fff; box-shadow: none; margin-bottom: 0; } .main-form .nf-form-content select {background-image: url(images/icon-dropdown-purple.svg) !important; background-repeat: no-repeat !important; background-position: calc(100% - 19px) !important; padding-right: 50px;} .main-form .nf-form-content .list-select-wrap .nf-field-element > div {background: transparent;border: none;} .main-form .nf-form-content .list-select-wrap > div div::after {display:none;} .main-form .nf-form-content textarea {height: 200px !important; padding: 12px 20px;resize: none;} .main-form .nf-error.field-wrap .nf-field-element::after {display: none;} .main-form .ninja-forms-req-symbol {color: #622a86; margin-left: 0; font-size: 21px; position: absolute; right: -14px; z-index: 1; width: 30px; height: 30px; background-color: #fff; text-align: center; line-height: 40px; top: -15px;z-index: 11;} .main-form .nf-error .nf-error-msg {max-width: 100%; float: right; width: calc(100% - 210px); font-size: 17px; color: #ffb400; font-weight: normal; font-family: 'Trenda-Regular'; line-height: normal; margin-top: 3px; margin-right: 0; } .main-form .nf-form-content .nf-error input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]), .main-form .nf-form-content .nf-error textarea, .main-form .nf-form-content .nf-error select {border-color: #ffb400 !important;} .main-form .nf-form-content input[type=checkbox].ninja-forms-field, .main-form .nf-form-content input[type=radio].ninja-forms-field {position: absolute;left: 0;top: 0;opacity: 0;visibility: hidden;pointer-events: none;} .listradio-wrap .nf-field-element label.nf-checked-label:before {top: 5px !important;} .main-form .nf-form-content input[type="button"] {float: left; width: auto; margin: 0; font-weight: normal; text-align: center; height: 60px; line-height: 60px; background-color: #622a86; box-shadow: 0 5px 10px rgba(0,0,0,0.15); border-radius: 30px; position: relative; font-size: 20px; color: #ffffff; font-family: 'RussoOne-Regular'; padding: 0 40px 0 40px; cursor: pointer; } .main-form .nf-form-content input[type="button"]:hover {background-color: #fff;color: #622a86;} .main-form .nf-form-fields-required {display: none; } .main-form .html-container.label-above .nf-field-element {width: 100% !important; } .main-form .su-expand-content {float: left; width: 100%; margin-top: 10px; font-size: 17px; line-height: 26px; color: #5c5956 !important; margin-bottom: 20px; } .jBox-Tooltip {width: 35% !important; } .jBox-content {line-height: 28px;} /* 404 page */ .banner-404 .vakgebieden-list-part {margin-top: 26px;float: left;} .banner-404 .vakgebieden-list-part > li {width: 100%;margin-bottom: 0;} /* Quote slider */ .testimonial-part {overflow: hidden;} .testimonial-slide {float: left;width: 100%;} .testimonial-main-slider .slick-list {overflow:visible} .testimonial-main-slider .slick-arrow{left: calc(50% + 294px);top: -80px;} .testimonial-main-slider .slick-prev.slick-arrow {left: calc(50% + 229px);} .main-form .gform_legacy_markup_wrapper .gfield_visibility_hidden {display: none;} /* Ninja form */ #nf-field-267-container .nf-field-label #nf-label-field-267 {width: auto;float: left;padding-right: 16px;} .checkbox-container.label-right label::before {left: -27px !important;font-size: 16px !important;} .main-form .label-above .nf-field-element p > a,.main-form .label-above .nf-field-element a {color: #622a86;} .main-form .nf-breadcrumbs li a.nf-breadcrumb {float: left; margin-right: 20px; height: 48px; line-height: 48px; padding: 0 25px; border-radius: 30px; font-size: 16px; font-family: 'RussoOne-Regular'; box-shadow: 0 5px 10px rgba(0,0,0,0.15); background-color: #1e1e1e; color: #ffffff; } .main-form .nf-breadcrumbs {display:none;} .main-form .nf-progress-container {background-color: #eee; height: 5px; border-radius: 30px; overflow: hidden; margin-bottom: 35px; margin-top: 0; } .main-form .nf-progress {background-color: #622a86; height: 100%; } .main-form .ninja-forms-form-wrap h3 {margin-bottom: 24px; } #nf-field-267-container .nf-error-msg.nf-error-required-error {width: 100%; } /* Unsubscribe email css */ .confirmation_msg {float: left;width: 100%;} .confirmation_msg h3 {margin-bottom: 12px;} .confirmation_msg p a {color: #622a86;} .views-template-campaign-page-template .inner-banner-content h1{line-height:64px;margin-bottom: 23px;} .views-template-campaign-page-template .inner-banner{padding: 191px 0 172px;} .reward-col .service-icon{width: 63px;} .views-template-campaign-page-template .job-form-part > h2{margin-bottom:43px} .views-template-campaign-page-template .info-usp-list > li{padding-left: 28px;} .views-template-campaign-page-template .info-usp-list > li::before{left: -6px;} .views-template-campaign-page-template .home-about-text p{margin-bottom: 27px;} .service-meta-part{float:left;max-width:710px} .service-meta-part h3{margin-bottom:11px;} .service-meta-part p {margin-bottom: 50px;} .reward-col .service-title{display: flex;flex-wrap: wrap;flex-direction: column;} .reward-col .service-title h3{padding-left:0px;margin: 29px 0px 2px;font-size:24px;line-height:30px;width:100%} .reward-col .service-title span{font-family: 'Trenda-Bold'; color: #1e1e1e;margin-bottom:-3px;font-size:18px;line-height:30px} .service-overview-wrapper > .custom-width{width:1320px;} .site-container {overflow: hidden;} .reward-col .service-card{padding: 44px 40px 20px;} .views-template-campaign-page-template .service-overview-part{margin-bottom:0px} .views-template-campaign-page-template .service-showcase{padding: 100px 0 45px;} .views-template-campaign-page-template .home-about-text{padding: 114px 90px 91px 3px;} .term-section-part{padding: 112px 0px 114px;} .term-section-inner-part{max-width:835px;margin:auto} .term-section-inner-part h3{margin-bottom:15px} .term-section-part .body-text > ul > li::before { content: ""; position: absolute; left: 0; background-color: #622a86; height: 6px; width: 6px; border-radius: 50%; top: 11px; } .term-section-part .body-text > ul > li, .term-section-part .body-text > ol > li{padding-left: 20px;margin-bottom: 0;} .views-template-campaign-page-template .home-about-part{margin-bottom:0px} .views-template-campaign-page-template .job-apply-part::after{bottom: 100px} .views-template-campaign-page-template .job-apply-part{padding-bottom:188px} .views-template-campaign-page-template .home-about-text h3{margin-bottom:12px} .views-template-campaign-page-template .info-usp-list > li{margin-bottom:15px} .term-section-inner-part.body-text p{margin-bottom: 14px;} .views-template-campaign-page-template .job-form-part > p { margin-bottom: 20px; } .views-template-campaign-page-template .main-form .gform_wrapper ul li.gfield.gfield_html{margin-bottom: 21px !important;} .views-template-campaign-page-template .main-form .gform_wrapper .top_label #field_7_28 .gfield_label{margin-top: 25px!important;} .views-template-campaign-page-template .main-form .gform_wrapper .top_label #field_7_28{margin-bottom: 0px!important;} .views-template-campaign-page-template .main-form .gform_wrapper .top_label #field_7_24{margin-top: 13px!important;} .views-template-campaign-page-template .main-form .gform_wrapper .gform_footer{margin:7px 0 0} .views-template-campaign-page-template .main-form .gform_wrapper ul li#field_7_7.gfield.gfield_html {margin-bottom: 33px!important; } .views-template-campaign-page-template .main-form .gform_wrapper ul li#field_7_1{margin-bottom: 29px !important;} .service-card.remove-service-card-hover:hover .service-title h3{color: initial;} .service-card.remove-service-card-hover:hover{transform: initial; -webkit-transform: initial; -moz-transform: initial;box-shadow:0 5px 10px rgb(0 0 0 / 15%)} body .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_checkbox li label, body .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_radio li label{background-color: transparent; border: 2px solid #622a86; border-radius: 26px; font-size: 17px; line-height: 28px; color: #ffffff; padding: 10px 18px; } body .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_checkbox li label::after, body .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_radio li label::after {border: 2px solid #fff; background-color: #fff; height: 20px; width: 20px; border-radius: 50%; border: none; bottom: -2px; right: -2px; top: inherit; left: inherit;opacity:0 } body .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_checkbox li label::before {top: initial; left: initial;right: 3px; bottom: 6px; font-size: 10px!important; line-height: normal;width: 9px;height: 5px;border-left-color: #000;border-bottom-color: #000;} body .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_checkbox li, body .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_radio li{width: auto;margin:0px 13px 15px 0px!important} body .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_checkbox li input[type="checkbox"]:checked ~ label,body .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_radio li input[type="radio"]:checked ~ label{background-color:#622a86} body .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_checkbox li input[type="checkbox"]:checked ~ label::after, body .dark-bg-form.main-form.design-check-box .gform_wrapper ul.gfield_radio li input[type="radio"]:checked ~ label::after{opacity:1} article[aria-label="Job alert"] .main-form .gform_confirmation_message {background-color: #622a86;color: #fff;} .views-template-simple-campaign-page-template .text-main-part { margin-bottom: 0;padding-bottom: 40px; } .views-template-simple-campaign-page-template .form-main-part { margin-top: 0; padding: 40px 0 80px; } .main-form > h3 { margin-bottom: 33px; } .views-template-simple-campaign-page-template .main-form .gform_wrapper .top_label .gfield_label{width:230px;} body.views-template-simple-campaign-page-template .main-form .gform_wrapper .top_label div.ginput_container{width: calc(100% - 230px) !important;} .views-template-simple-campaign-page-template .main-form .gform_wrapper .gform_footer{width: calc(100% - 230px);} .views-template-simple-campaign-page-template .main-form .gform_confirmation_message {background-color: #ffb400;margin-bottom: 0;color: #fff;} /* *********** New phase css 2023 *********** */ /* Target group landing page */ .target-detail-banner {padding: 165px 0 0; background-color: #622a86; } .inner-banner-wrap {float: left; width: 100%; padding-bottom: 107px; min-height: 600px; position: relative; } .inner-banner-wrap picture {position: absolute; right: 0; top: 0; bottom: 0; width: calc(50% + 200px); } .inner-banner-wrap .inner-banner-content {float: left; width: calc(50% - 20px); position: relative; z-index: 1; padding-top: 41px; } h1.h1-lg {font-size: 110px; line-height: 100px; } .inner-banner-wrap h1.h1-lg {margin-bottom: 28px; } .inner-banner-wrap p {font-size: 17px; max-width: 65%; } .step-section {margin-top: 0 !important; padding-bottom: 34px; } .full-banner-section {position: relative; padding: 100px 15px 218px; min-height: 700px; display: flex; align-items: center; justify-content: center; } .full-banner-section picture {position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: -1; } .full-banner-content {max-width: 1050px; text-align: center; } .full-banner-content h2 {color: #fff; font-size: 110px; line-height: 100px; margin-bottom: 8px; } .full-banner-content p {color: #fff; } .related-job-section {margin-top: -110px; } .related-job-section .vakgebied-job-info{margin-bottom: 0;} .more-info-btn.view-all-job {margin-bottom: 50px; margin-top: -15px; } /* Home page new */ .home-new-banner .inner-banner-wrap h1.h1-lg {margin-bottom: 45px;} .home-option-section {padding: 40px 0 110px; } .home-option-section h3 { width: 100%; padding-top: 0; text-align: center; } .option-card-list {float: right;width: 100%;display: flex;flex-wrap: wrap;column-gap: 3%;justify-content: flex-end;row-gap: 40px;} .option-plain-card { width: 31.33%; display: flex; align-items: center; justify-content: center; } .option-card {width: 31.33%; position: relative; padding: 63px 30px 66px; text-align: center; background-color: #622a86; box-shadow: 0 5px 10px rgba(0,0,0,0.15); } .option-card > i {position: absolute; width: 40px; height: 40px; background-color: #1e1e1e; border-radius: 50%; right: 15px; bottom: 15px; display: flex; justify-content: center; align-items: center; } .card-content {float: left; width: 100%; } .card-content * {color: #fff; } .card-content h2 {font-size: 40px; line-height: normal; margin-bottom: 6px; } /*.option-card:nth-child(2) {background-color: #1e1e1e; } .option-card:nth-child(2) > i {background-color: #4b4b4b; }*/ .option-card:hover {background-color: #353535 !important;} .option-card:hover > i{background-color: #622a86 !important;} .home-option-section + .home-intro-part {padding-top: 110px; } .home-new-branche::before {background: -moz-linear-gradient(left, rgba(255,102,0,0.6) 0%, rgba(255,102,0,0) 100%); background: -webkit-linear-gradient(left, rgba(255,102,0,0.6) 0%,rgba(255,102,0,0) 100%); background: linear-gradient(to right, rgba(255,102,0,0.6) 0%,rgba(255,102,0,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99622a86', endColorstr='#00622a86',GradientType=1 ); } /* New Dropdown menu */ .new-menu-overlay {float: left; width: 100%; } .new-menu-overlay > p {color: #fff; margin-bottom: 28px; } .second-menu {width: 370px; float: left; padding-right: 40px; } .menu-dropdown-main-menu-container {float: left; width: 100%; } .new-menu-overlay .vakgebieden-list-part > li, .new-menu-overlay .menu-dropdown-main-menu-container ul > li {width: 100%; margin-bottom: 12px; } .menu-dropdown-main-menu-container ul > li a::before {content: ""; position: absolute; left: 0; top: 3px; width: 10px; background-image: url(images/icon-arrow-cross.svg); background-repeat: no-repeat; background-position: center; background-size: 10px; height: 16px; } /* New css */ .job-function{float: left; width: 100%;margin-top: -4px; } .job-function .radio:first-child {display: none; } .job-function .radio {float: left; height: 50px; display: flex; align-items: center; border: 1px solid #fff; margin-right: 15px; border-radius: 40px; width: auto; background-size: 0; overflow: hidden; margin-top: 0;flex-wrap:wrap; } .job-function .radio:last-child {margin-right: 0; } .job-function .radio.active {box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.15); } .job-function .radio:before {content: ""; position: absolute; top: 0; width: 100%; height: 100%; background-color: transparent; } .job-function .radio.active:before{background-color: #fff;} .job-function .radio label {font-size: 17px;color: #ffffff;font-family: 'RussoOne-Regular';width: 100%;height: 100%;padding: 10px 30px;text-align: center; align-content: center;} .job-function .radio.active label {position: relative; color: #622a86; } .job-function .radio label span {display:none;font-size: 13px; float: left; line-height: 16px; width: 100%; font-family: 'Trenda-Regular';} .job-function .radio.active span {color: #5c5956;} .job-overview-banner h1 {margin-bottom: 24px;} /* Home Changes new */ .home-testimonial-part {float: left; width: 100%; max-width: 1170px; position: relative; margin-bottom: -15px; } .home-testimonial-part .left-part {float: left; width: 400px; padding: 124px 50px 0 0; line-height: 28px; } .home-testimonial-part .testimonial-content {padding: 124px 120px 0 0; } .home-testimonial-part .left-part h3 {margin-bottom: 12px; } .home-testimonial-part .testimonial-main-slider {position: static; } .home-testimonial-part .testimonial-main-slider .slick-arrow {left: 0; bottom: 0; top: calc(50% + 52px); } .home-testimonial-part .testimonial-main-slider .slick-arrow.slick-next {left: 65px; } .home-testimonial-part .slick-counter {position: absolute; top: calc(50% + 63px); font-family: 'Trenda-Bold'; left: 145px; font-size: 16px; line-height: 28px; } .home-testimonial-part .testimonial-content blockquote p {font-size: 30px;} .home-testimonial-part .testimonial-content blockquote p::before {content: ' “ ';position: relative; left: 5px;} .home-testimonial-part .testimonial-content blockquote p::after { content: ' ” '; position: relative; right: 5px;} /* New vacature css */ .new-vacature-banner {padding-bottom: 181px; } .vacature-filter-wrapper {float: left; position: relative; width: 100%; margin-top: 21px; } .vacature-filter {display: none; float: left; width: 100%; max-width: 223px; background-color: #fff; padding: 26px 15px 27px 30px; position: absolute; left: 37px; top: 62px; z-index: 9; box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.15); margin-bottom: 0; } .form-group.job-filter > label {display: inline-block; vertical-align: middle; font-weight: normal; font-size: 17px; color: #ffffff; margin-right: 0px; margin-bottom: 19px; } .vacature-filter-btn {display: inline-block; font-size: 17px; color: #ffffff; background-color: #e65c00; padding: 22px 135px 21px 35px; line-height: 28px; border-radius: 36px; width: auto; cursor: pointer; z-index: 1; position: relative; } .vacature-filter-btn::after {content: "\ea99"; font-family: IcoFont !important; float: right; font-size: 14px; position: absolute; top: 50%; right: 26px; transform: translateY(-50%); } .form-group.vacature-filter .checkbox label::before {content: ""; position: absolute; left: 5px; top: 11px; width: 10px; height: 5px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -moz-transform: rotate(-45deg); opacity: 0; z-index: 1; } .form-group.vacature-filter .checkbox label.checked::before {opacity: 1; } .form-group.vacature-filter .checkbox label.checked::after {background-color: #622a86; } .vacature-filter .checkbox {float: left; width: 100%; margin-bottom: 7px; margin-top: 0; } .vacature-filter .checkbox:last-child {margin-bottom: 0; } .vacature-filter .checkbox > label {cursor: pointer; float: left; width: auto; max-width: 100% !important; font-size: 17px; color: #5c5956; font-family: 'Trenda-Regular'; font-weight: normal !important; line-height: 28px; position: relative; padding-left: 39px; margin-left: 0 !important; } .form-group.vacature-filter .checkbox label::after {content: ""; left: 0; top: 4px; position: absolute; width: 20px; height: 20px; border: 2px solid #622a86; background-color: #fff; } .form-group.vacature-filter .checkbox label span {width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; background-color: #eeeeee; border-radius: 50%; font-size: 11px; color: #a4a2a0; margin-left: 3px; } /* Gravity form signature field css */ .main-form .gform_wrapper .gfield--type-signature .gfield_required_asterisk {z-index: 111;} .main-form .gform_wrapper .gfield_signature_ui_container, [id*="signature_image"]{float: right; width: calc(100% - 210px) !important; position: relative;} body .main-form .gform_wrapper .top_label .gfield--type-signature div.ginput_container {width: 450px !important;} .main-form .gform_wrapper .gfield--type-signature .gfield_signature_container canvas {} .main-form [id*="signature_image"] .gfield_signature_image > div {display: none !important;} /* Banner text bold 27-3-2024 */ .bold-text,.custom-text-link {float: left;width: 100%;} .bold-text p {color: #fff;font-family: 'Trenda-Bold';font-size: 18px;} .bold-text p a,.custom-text-link p a {display: inline-block; color: #fff; padding-right: 24px; background-image: url(images/icon-arrow-cross.svg); background-repeat: no-repeat; background-position: right 10px; background-size: 10px;position:relative;font-family: 'Trenda-Bold'; } .bold-text p a::after,.custom-text-link p a::after {content: ""; position: absolute; left: 0; bottom: 0; height: 2px; background-color: #fff; width: calc(100% - 24px); } .bold-text p a:hover::after,.custom-text-link p a:hover::after {opacity:0;bottom: -2px;} .custom-text-link p a {color:#622a86; background-image: url(images/icon-arrow-cross-purple.svg);} .custom-text-link p a::after {background-color:#622a86}