@import url("css2.css");

:root {
    --primary: #613ce8;
}

@font-face {
    font-family: 'sangam';
    src: url("Tamil-Sangam.ttc");
}

@font-face {
    font-family: 'sangam-bold';
    src: url("");
}

html {
    overflow-x: hidden;
}

body {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    color: #666666;
    overflow-x: hidden;
}

.container {
    max-width: 1380px;
    width: 90%;
}

.inner-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    align-items: center;
}

.main-header {
    top: 0;
    width: 100%;
    background: var(--primary);
    z-index: 100;
}

.logo {
    background: #fff;
    padding: 1.6rem 3rem;
}

.menus a {
    color: #fff;
    font-weight: 600;
    font-size: 18px;
    position: relative;
    padding-right: 1rem;
    transition: all 0.3s ease-in;
    text-decoration: none;
}

.menus a:not(:last-child):after {
    content: '';
    width: 2px;
    height: 71%;
    display: block;
    background: #fff;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

.menus {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.banner {
    background-image: url("bannerk-1.png");
    height: calc(100vh - 122px);
    display: flex;
    align-items: center;
    color: #fff;
    background-blend-mode: overlay;
    background-color: rgba(0, 0, 0, 0.3);
    background-size: cover;
}

section.banner h2 {
    font-size: 88px;
    font-weight: bold;
    margin-top: -25%;
}

.img-r {
    overflow: hidden;
    border-radius: 0 50px 0 50px;
    height: 27rem;
}

section.separator img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.cont-image {
    padding: 70px 0 0;
}

section.cont-image .row {
    align-items: center;
}

.img-r img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

h4.norm-h {
    color: var(--primary);
    font-size: 25px;
    font-weight: 600;
    line-height: 1.6;
    max-width: 93%;
}

.over-img {
    margin-top: -20rem;
}

h2.heading {
    font-size: 50px;
    color: var(--primary);
    font-weight: 700;
    margin-bottom: 1rem;
}

p {
    font-size: 20px;
    color: #060606;
    font-family: 'sangam';
}

a.global-cta {
    color: #fff;
    background: #613CE8;
    border-radius: 40px;
    letter-spacing: 2px;
    font-family: 'Montserrat', sans-serif;
    font-size: 19px;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    padding: 14px 40px;
    margin-bottom: 40px;
    border: none;
    position: relative;
    transition: all 0.3s ease-in;
    text-decoration: none;
    display: inline-block;
}

a.global-cta:before {
    content: "";
    position: absolute;
    top: -10px;
    right: -10px;
    bottom: -10px;
    left: -10px;
    border: 4px solid #bcadf5;
    border-radius: 40px;
    display: block;
    transition: all 0.3s ease-in;
}

a.global-cta:hover {
    background: #A1D2E5;
}

section.cont-image p {
    margin-bottom: 4rem;
}

.grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6rem;
}

.mt-70 {
    margin-top: 70px;
}

footer {
    background: #000;
    margin-top: 8rem;
    padding: 2rem 0;
}

footer .menus a,
footer p {
    font-weight: 500;
    font-size: 14px;
    color: #b7b7b7;
    font-family: 'Montserrat';
    margin: 0;
}

footer .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.socials {
    display: flex;
    gap: 1rem;
}

footer .menus a:hover {
    color: var(--primary);
    text-decoration: none;
}

.banner-sm {
    background-image: url("");
    height: 430px;
    padding: 4rem 0;
    background-blend-mode: overlay;
    background-color: #121212;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    background-position: center;
}
.banner-sm:after {
    content: '';
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    background: #333333;
    opacity: 0.8;
}

.banner-sm .container {
    position: relative;
    z-index: 1;
}
.banner-sm h2 {
    color: #fff;
    font-weight: bold;
    font-size: 58px;
}

h4.special {
    text-transform: uppercase;
    display: block;
    color: #C8BBF7;
    font-size: 20px;
    letter-spacing: 1px;
    font-weight: 700;
    margin-bottom: 1.75rem;
}

h4.special i {
    color: #fff;
    font-style: normal;
}

section.separator {
    position: relative;
}

img.sep-img {
    position: absolute;
    top: 0;
    left: 0;
}

.link-tabs a {
    font-size: 18px;
    font-weight: bold;
    color: #000;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
}

.link-tabs a:before {
    content: '';
    background-image: url("");
    width: 12px;
    height: 14px;
    display: block;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
    top: -1px;
}

.separator-content {
    position: relative;
    z-index: 1;
}

.link-tabs {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 2.5rem 0 4rem;
}

.rounded-label {
    font-size: 22px;
    color: #a1d2e5;
    background: var(--primary);
    display: inline-block;
    padding: 12px 24px 12px 3px;
    font-weight: bold;
    border-radius: 0 0 19px;
    position: relative;
}

.over-img.large-img .img-r {
    height: 33rem;
}

.over-img.large-img {
    margin-top: -21.5rem;
}

.shape-line:before {
    content: '';
    background-image: url("");
    width: 100%;
    height: 72px;
    background-size: contain;
    display: block;
    position: absolute;
    top: -72px;
    background-repeat: no-repeat;
    background-position: bottom;
}

.items-start {
    align-items: flex-start !important;
}

section.video-sec {
    margin: 5rem 0 7rem;
}

.video-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.video-thumb {
    height: 90vh;
    position: relative;
    overflow: hidden;
    border-radius: 0 50px 0 50px;
}

img.play-icon {
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    margin: auto;
    width: auto;
    height: auto;
    border-radius: 0;
    transform: translateY(-50%);
}

.video-thumb:before {
    content: '';
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    background: #613ce861;
}

.rounded-label:before {
    content: '';
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    background: var(--primary);
    left: -100%;
    top: 0;
}

.link-tabs a.active {
    color: #fff;
}

.certificate {
    max-width: 30rem;
    margin: auto;
    text-align: center;
}

.certificate img {
    max-width: 18rem;
    box-shadow: 0px 7px 10px 0px #c5c5c5;
}

h2.heading-sm {
    color: var(--primary);
    font-weight: 700;
    margin-bottom: 1rem;
    font-size: 30px;
}

h2.heading-md {
    color: var(--primary);
    font-weight: 700;
    margin-bottom: 1.5rem;
    font-size: 35px;
}
section.col-conts {
    padding: 6rem 0;
}
.history {
    background-image: url("");
    background-repeat: no-repeat;
    padding: 5rem 0;
    color: #fff;
    position: relative;
    background-size: cover;
}
.history:after {
    content: '';
    width: 100%;
    height: 100%;
    display: block;
    background: var(--primary);
    position: absolute;
    top: 0;
    right: 0;
    opacity: 0.8;
}

.history .container {
    position: relative;
    z-index: 1;
}
section.history p {
    color: #fff;
}

section.history h2 {
    color: #a1d2e5;
}
h2.heading-60 {
    font-size: 60px;
    font-weight: 700;
}
.border-b {
    /*border-bottom: 1px solid #84a3ab;*/
    border-bottom: 1px solid #a1d2e5;
    padding-bottom: 4rem;
    margin-bottom: 6rem;
}
section.history.producten {
    margin-bottom: -8rem;
    margin-top: 12rem;
}
.img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
section.banner-sm.p2 {
    display: flex;
    align-items: center;
}

section.banner-sm.p2 h2 {
    margin: 0;
}
.separator-content.sm {
    height: 85px;
    margin-bottom: 8rem;
}
.cont-image h6 {
    color: #000;
    font-weight: 700;
    font-size: 17px;
    line-height: 1.6;
    margin-bottom: 1rem;
}
.mt-85 {
    margin-top: 85px;
}
section.services {
    padding: 6rem 0 0;
    text-align: center;
    margin-bottom: -7rem;
}

section.services h2 {
    margin-bottom: 5rem;
}

.subheading {
    margin-bottom: 5rem;
}

.s-box .img {
    width: 70px;
    height: 70px;
    margin: 0 auto 2rem;
}

.s-box .img img {
    object-fit: contain;
}

.s-box h4 {
    font-size: 25px;
    color: var(--primary);
    font-weight: 700;
}

.services .col-md-4 {
    margin-bottom: 4rem;
}
.row-gradient-bg h3 {
    font-size: 29px;
    font-weight: 700;
    color: #fff;
    margin: 0;
}

.row-gradient-bg {
    background-image: url("");
    background-repeat: no-repeat;
    background-size: cover;
    padding: 1.5rem 0;
    margin: 0 0 3rem;
}
h4.date {
    font-size: 24px;
    font-weight: 700;
    color: #000;
}

.news-box h3 {
    font-size: 29px;
    font-weight: bold;
    color: var(--primary);
    margin: 2rem 0;
}
.news-box a.global-cta {
    margin-top: 2rem;
}
.news .row:not(.row-gradient-bg) .col-md-6 {
    margin-bottom: 4rem;
}
.pagination {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
    margin-bottom: -4rem;
}

.pagination a {
    font-weight: 700;
    color: #000;
    border-right: 2px solid var(--primary);
    line-height: 1;
    padding: 0 11px;
    font-size: 20px;
    text-decoration: none;
    transition: all 0.3s ease-in;
}

.pagination a.active, .pagination a:hover {
    color: var(--primary);
}

.pagination a:last-child {
    border-right: 0;
    padding-right: 0;
}
.news-container .row:not(:last-child) .col-md-6 {
    border-bottom: 2px solid var(--primary);
    padding-bottom: 2rem;
}
.news-box h6 {
    color: #000;
    font-weight: 700;
    margin: 2rem 0;
}

section.news.single {
    margin: 13rem 0 -4rem;
}

.news.single .col-md-6.col-12 {
    margin-bottom: 0 !important;
}
p a {
    color:#613CE8;
    text-decoration: none;

}
p a:hover {
    color:#613CE8;
    text-decoration: underline;
}
form#webform-submission-contact-node-116-add-form .form-item input, form#webform-submission-contact-node-116-add-form .form-item textarea, form#webform-submission-contact-node-116-add-form .form-item select {
    width: 100%;
    border: none;
    background: #efebfd;
    padding: 8px 14px;
    outline: none;
}
.webform-button--submit {
    color: #fff;
    background: #613CE8;
    border-radius: 40px;
    letter-spacing: 2px;
    font-family: 'Montserrat', sans-serif;
    font-size: 19px;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    padding: 14px 40px;
    margin-bottom: 40px;
    border: none;
    position: relative;
    transition: all 0.3s ease-in;
    text-decoration: none;
    display: inline-block;
    margin: 20px 0 20px 0;
    cursor:pointer;
}
.webform-button--submit:hover {
    background: #A1D2E5;
}
section.contact-form form {
    margin-top: 3rem;
}

section.contact-form form .global-cta {
    margin-top: 3rem;
}
section.faqs {
    padding: 6rem 0 0;
}
.faq-body {
    display: none;
    color: #fff;
    padding-top: 1rem;
}

.faq-bx h5 {
    font-size: 27px;
    font-weight: 600;
    color: inherit;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.faq-bx {
    background: var(--primary);
    color: #fff;
    padding: 1.65rem 2rem;
    cursor: pointer;
    transition: all 0.3s ease-in;
}

.faq-container {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.faq-bx h5:after {
    content: '+';
    font-size: 2.5rem;
    font-weight: 400;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.faq-bx.active .faq-body {
    display: block;
}

.faq-body p {
    color: inherit;
    margin: 0;
}

.faq-bx.active h5:after {transform: translateY(-50%) rotate(45deg);}

.faq-bx:nth-child(even) {
    background: #000;
}
.warken {
    background-image: url("");
    background-repeat: no-repeat;
    background-size: cover;
    margin: 4rem 0 1rem  !important;
    display: block;
    position: relative;
}
.secondary-color {
    color: #a1d2e5 !important;
}

.warker.services h4 {
    color: #a1d2e5;
}

.warken .s-box h4 {
    color: #a1d2e5;
}

.warken .s-box img {
    filter: brightness(0) invert(1);
}
.warken .s-box p {
    color: #fff;
}
section.services.warken:before {
    content: '';
    background: #613ce8;
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.8;
}

section.services.warken .container {
    position: relative;
    z-index: 1;
}
.no-footer-space {
    margin-bottom: -7rem;
}


/************new CSS ******************/
header nav#block-ketjen-dutch-mainnavigation ul li a {
    color: #fff;
    font-weight: 600;
    font-size: 18px;
    position: relative;
    padding-right: 1rem;
    transition: all 0.3s ease-in;
    text-decoration: none;
}
header nav#block-ketjen-dutch-mainnavigation ul li a:hover {
    color: #a1d2e5;
}
header nav#block-ketjen-dutch-mainnavigation ul li.menu-item:last-child a:after, footer nav#block-ketjen-dutch-mainnavigation ul li.menu-item:last-child a:after {
    display: none;
}
header nav#block-ketjen-dutch-mainnavigation ul, footer nav#block-ketjen-dutch-mainnavigation ul {
    display: flex;
    list-style: none;
    gap: 1rem;
    margin-bottom: 0;
}
header nav#block-ketjen-dutch-mainnavigation ul li a:after {
    content: '';
    width: 2px;
    height: 71%;
    display: block;
    background: #fff;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
footer #block-ketjen-dutch-mainnavigation a, footer p {
    font-weight: 500;
    font-size: 14px;
    color: #b7b7b7;
    font-family: 'Montserrat';
    margin: 0;
}
footer nav#block-ketjen-dutch-mainnavigation ul li a:after {
    content: '';
    width: 2px;
    height: 71%;
    display: block;
    background: #b7b7b7;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.path-frontpage section.separator {
    z-index: -1;
}
.banner-sm h2.aos-init.aos-animate {
    max-width: 500px;
}
.col-lg-6.conduct-copy {
    padding-left: 40px;
}
.col-lg-6.conduct-image {
    padding-right: 60px;
}
.region.region-content section.conduct-section.cont-image:nth-child(4) .img-r img {
    width: auto;
}
section.careers-outro.history {
    margin-top: 12rem;
}
.region.region-content section.conduct-section.cont-image:nth-child(4) .img-r {
    border-radius: 0;
    height: auto;
    text-align: center;
}
.page-node-111 footer, .page-node-112 footer {
    margin-top: 0;
}

.page-node-116  .separator-content {
    height: 85px;
    margin-bottom: 2rem;
}
 .page-node-117  .separator-content, .page-node-type-news .separator-content{
    height: 85px;
    margin-bottom: 8rem;
}

/*.news-container .col-md-6.col-12.views-row:nth-child(1), .news-container .col-md-6.col-12.views-row:nth-child(2)*/
.news-container .col-md-6.col-12.views-row {
    border-bottom: 2px solid var(--primary);
    padding-bottom: 2rem;
}
li.pager__item.pager__item--last, li.pager__item.pager__item--next {
    display: none;
}
li.pager__item a {
    color: #000;
    font-weight: 700;
    color: #000;
    border-right:  solid var(--primary);
    padding: 0 11px;
    font-size: 20px;
    text-decoration: none;
    transition: all 0.3s ease-in;

}
li.pager__item.is-active a {
    color: var(--primary);
}
li.pager__item {
    padding: 0;
}
header li.menu-item.menu-item--active-trail {
    position: relative;
}
header li.menu-item.menu-item--active-trail:after {
    border-bottom: 10px solid #a1d2e5 !important;
    padding-bottom: 20px;
    content: "";
    width: 94%;
    height: 10px;
    position: absolute;
    bottom: -41px;
    left: 0;
}
header li.menu-item.menu-item--active-trail a {
    color: #a1d2e5 !important;
}
a.global-site {
    background: #a1d2e5;
    color: #000;
    position: absolute;
    right: 1rem;
    top: 0;
    font-size: 13px;
    font-weight: 600;
    border-bottom-left-radius: 6px;
    padding: 4px 10px;
    border-bottom-right-radius: 6px;
    text-decoration: none;
}
#scrollToTopBtn {
    position: fixed;
    background: var(--primary);
    color: #fff;
    bottom: 2rem;
    right: 2rem;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    padding-bottom: 5px;
    z-index: 19;
    cursor: pointer;
    display: none;
}

div#scrollToTopBtn.show {
    display: flex;
}
.img.img-r + p.mt-3 {
    font-size: 14px;
}
section.services .heading {
    position: relative;
    padding-bottom: 2rem;
}

section.services h2.heading:after {
    content: '';
    width: 100%;
    height: 17rem;
    display: block;
    position: absolute;
    top: -144px;
    right: 0;
    background: url("");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right;
}

section.services {
    overflow: hidden;
}

ul.menu li a:before {
    border-bottom: 10px solid #a1d2e5 !important;
    padding-bottom: 20px;
    content: "";
    width: 0;
    height: 10px;
    position: absolute;
    bottom: -45px;
    left: 0;
    transition: all 0.3s ease-in;
}

ul.menu li a:hover:before {
    width: calc(100% - 1rem);
}
.overflow {
    overflow: hidden !important;
    height: 100vh;
}

/* -- Interactive Map -- */
.interactive-map-container{padding: 75px 0; margin: 0 auto; max-width: 100%; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.interactive-map-container ul {padding-left:0; list-style: none;}
.interactive-map-container img {max-width: 100%;}
.interactive-map{ background: #dae5be; border-radius: 17px; border:5px solid #000; }
.interactive-map .upper{ padding: 15px 25px; }
.interactive-map p, .map-popup p{ padding: 0; }
.interactive-map h2{ color:#000; text-transform: none; }
.interactive-map .image{ position: relative; border-top: 5px solid #000; }
.interactive-map .image img{ display: block; border-bottom-left-radius: 13px; border-bottom-right-radius: 13px; max-width:100%; }
.interactive-map .image .area{ width: 4.4%; height: 60px; position: absolute; background:url("") no-repeat; background-size: 100% auto; z-index: 2; transition:transform 150ms linear; transform-origin: center; }
.interactive-map .image .area:hover{ transform:scale(1.1); }
.interactive-map .image .area.active{ transform:rotate(-45deg); z-index: 4; }
.map-popup { width: 40%; background: #fff; margin-top: 20px; border-radius: 17px; border:5px solid #000; overflow: hidden; position: absolute; z-index: 3; margin-right: -30px; transition: opacity 250ms linear; }
.interactive-map .map-popup:not(.active) { opacity: 0; pointer-events: none; }
.map-popup.full-pop{ display: none; }
.map-popup .lower{ border-top: 5px solid #000; padding: 15px; line-height: 1.45em; font-size: 14px; }
.map-popup .flexslider{ width: 100%; border: 0; border-radius: 0; margin: 0; }
.map-popup .flexslider .slides:after{ display: none; }
.map-popup .flexslider img{ border-radius: 0; margin: 0; position: static;pointer-events: none; }
.map-popup .flex-direction-nav a{ opacity: 1 !important; left: 10px; top: 30%; transition:transform linear 150ms; }
.map-popup .flex-direction-nav a:hover{ transform:scale(1.1); }
.map-popup .flex-direction-nav a.flex-next{ left: auto; right: 10px; }
.map-popup .flex-direction-nav a:before{ display: none; }
.map-popup h4{ text-transform: none; }

/*-- Responsiveness Media Queries for Interactive Map -- */

@media (max-width: 1200px) {
    .interactive-map .image .area{ height: 38px; }
}

@media (max-width: 1080px) {
    .interactive-map .flex-direction-nav a{ width: 25px; }
}

@media (max-width: 610px) {
    .interactive-map .image .area{ height: 25px; }
    .interactive-map .popup{ display: none; }
    .map-popup.full-pop{ display: block; margin-right: 0; width: 100%; position: static; margin-top: 20px !important; }
    .map-popup.full-pop:not(.active) {display: none; }
}


.page-node-123 .inner-intro-wrapper .inner-intro-left {
    max-width:100%;
    width:100%;
    flex:none;
    margin-bottom: 75px;
    padding-right:15px!important;
    padding-left:15px!important;
}

.page-node-123 .inner-intro-wrapper .inner-intro-left h4 {
    max-width:100%;
    width:100%;
    text-align: center!important;
}

.page-node-123 .inner-intro-wrapper .inner-intro-right {
    max-width:100%;
    width:100%;
    flex:none;
    margin-bottom: 30px;
    padding-right:15px!important;
    padding-left:15px!important;
}

.page-node-123 .inner-intro-wrapper .inner-intro-right p {

    text-align: center!important;
    margin-bottom:0;
}