
.root * {
    box-sizing: border-box
}
.root .container {
    width: 100%;
    padding-right: calc(8% + 15px);
    padding-left: calc(8% + 15px);
    margin: 0 auto
}
@media(min-width: 1024px) {
    .root .container {
        width:100%;
        max-width: 1600px;
        padding-right: calc(10% + 15px);
        padding-left: calc(10% + 15px)
    }
}
.container-fluid {
    width: 100%;
    max-width: 1600px;
    padding: 0;
    margin-right: auto;
    margin-left: auto
}
.row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px
}
.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col,.col-auto,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm,.col-sm-auto,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-md,.col-md-auto,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg,.col-lg-auto,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl,.col-xl-auto {
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px
}
@media(min-width: 1024px) {
    .col-lg-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%
    }
}

.caption {
    font-size: 1rem;
    color: #8c8c8c
}
.caption.image {
    font-size: 12px
}

.icon-Close:before {
    content: "X";
    color: #77b917;
    cursor: pointer;
}
.image-container .image {
    object-fit: contain
}
.image-container img {
    width: 100%;
    height: 100%
}
.section {
    position: relative
}
.cmp-section {
    padding-top: 80px
}
.textparagraph p,.textparagraph li,.textparagraph b,.textparagraph i {
    font-size: 1rem;
    line-height: 2rem
}
.textparagraph p {
    margin-top: 10px
}

.cmp-processchain__clipping {
    position: relative;
    overflow: hidden;
    height: 524px
}

.cmp-processchain__container {
    overflow-x: scroll
}
.cmp-processchain__inner {
    display: flex
}
.cmp-processchain__process-item-first-spacer {
    min-width: 1%;
    height: 464px;
    position: relative;
    margin: 30px 0
}
@media screen and (min-width: 1024px) {
    .cmp-processchain__process-item-first-spacer {
        min-width:0
    }
}
.cmp-processchain__process-item {
    position: relative;
    z-index: 1;
    overflow: hidden;
    padding-right: 0;
    height: 464px;
    min-width: 27%;
    flex-grow: 1;
    transition: .25s cubic-bezier(0.075,0.82,0.165,1);
    margin: 30px 0;
    cursor: pointer;
}
.cmp-processchain__process-item::before {
    content: "";
    height: 444px;
    width: 2px;
    background-color: grey;
    position: absolute;
    left: 0;
    top: 10px
}
.cmp-processchain__process-item:hover {
    background-color: #fff;
    border-radius: 12px 12px 0 12px;
    box-shadow: 0 12px 24px 0 rgba(0,0,0,0.24);
    z-index: 2
}
.cmp-processchain__process-item:hover::before {
    content: none
}
@media screen and (min-width: 1024px) {
    .cmp-processchain__process-item {
        min-width:8.333333333333333%
    }
}
.cmp-processchain__process-item--expanded {
    padding-right: 100%;
    box-shadow: 0 12px 24px 0 rgba(0,0,0,0.24)
}
@media screen and (min-width: 1024px) {
    .cmp-processchain__process-item--expanded {
        padding-right:83.333333333333333%
    }
}
.cmp-processchain__inner--item-expanded .cmp-processchain__process-item {
    width: 20%
}
@media screen and (min-width: 1024px) {
    .cmp-processchain__inner--item-expanded .cmp-processchain__process-item {
        min-width:8.333333333333333%
    }
}
.cmp-processchain__process-item-header {
    display: flex;
    position: absolute;
    z-index: 1;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    height: 464px
}
.cmp-processchain__process-item--expanded .cmp-processchain__process-item-header {
    display: none
}
.cmp-processchain__process-heading {
    font-size: 1.1rem;
    line-height: 20px;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    -ms-writing-mode: tb-lr;
    cursor: default
}
@media screen and (min-width: 1024px) {
    .cmp-processchain__process-item:hover .cmp-processchain__process-heading {
        color:#fff
    }
}
.cmp-processchain__process-count {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 115px;
    margin-top: 16px;
    border-radius: 20px;
    height: 40px;
    width: 40px;
    border: 1px solid grey;
    background-color: #f4f4f4;
    font-size: 1.2rem;
    line-height: 24px
}
.cmp-processchain__process-count ::before {
    content: "";
    width: 100%;
    position: absolute;
    height: 1px;
    background-color: grey;
    z-index: -1;
    left: 0;
    bottom: 135px
}
.cmp-processchain__process-item:hover .cmp-processchain__process-count {
    background: #77b917;
    color: #fff;
}
.cmp-processchain__process-item--expanded .cmp-processchain__process-count {
    color: #77b917
}
.cmp-processchain__process-item-content {
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    visibility: hidden;
    border-radius: 16px 16px 0 16px;
    overflow: hidden;
    background: #fff
}
.cmp-processchain__process-item-content .image {
    height: 100%
}
.cmp-processchain__process-item-content .image div {
    height: 100%
}
.cmp-processchain__process-item-content .image div .image-container {
    height: 100%
}
.cmp-processchain__process-item--expanded .cmp-processchain__process-item-content {
    visibility: visible;
    box-shadow: 0 0 10px 0 rgba(0,0,0,0.12);
    padding: 0 15px
}
@media screen and (min-width: 1024px) {
    .cmp-processchain__process-item--expanded .cmp-processchain__process-item-content {
        padding:0;
        padding-right: 30px
    }
}
.cmp-processchain__close {
    display: none;
    position: absolute;
    z-index: 10;
    top: 0;
    right: 0;
    padding: 16px
}
.cmp-processchain__process-item--expanded .cmp-processchain__close {
    display: block
}
.cmp-processchain__process-item-last-spacer {
    min-width: 10%;
    height: 464px;
    position: relative;
    margin: 30px 0
}
@media screen and (min-width: 1024px) {
    .cmp-processchain__process-item-last-spacer {
        min-width:0
    }
}
.cmp-processchain__process-item-last-spacer::before {
    content: "";
    height: 444px;
    width: 2px;
    background-color: grey;
    position: absolute;
    left: 0;
    top: 10px
}

.cmp-processchain__mobile-accordion {
    display: none
}
.search-lazy-load {
    display: flex;
    justify-content: center;
    margin-top: 20px
}

.cmp-processchain .twocolumnlayout {
    max-height: 464px;
    overflow-y: auto
}
@media screen and (min-width: 1024px) {
    .cmp-processchain .twocolumnlayout {
        max-height:none;
        overflow: visible
    }
}
@media screen and (min-width: 1024px) {
    .cmp-processchain .twocolumnlayout .row>div:first-child {
        margin-top:0
    }
}
@media screen and (min-width: 1024px) {
    .cmp-processchain .twocolumnlayout .row>div:last-child {
        margin-top:36px;
        height: 428px;
        overflow-y: auto;
        padding-bottom: 50px
    }
}
.cmp-section__content-container .twocolumnlayout:last-child {
    padding-bottom: 0
}
.searchFilterBarContainer {
    margin-bottom: 30px
}

.searchFilterBarContainer .searchFilterBar {
    position: relative
}

.root h6{color: #77b917;font-size: 1.1rem;}
.text-paragraph a{color: #77b917;font-size: 1.1rem; text-decoration: underline;}
.cmp-processchain__process-item-header img{position: absolute;bottom:65px;z-index: 999;visibility:hidden;width:auto}
.cmp-processchain__process-item:hover .cmp-processchain__process-item-header img{visibility: visible;}
.cmp-processchain__inner div:nth-child(2) .cmp-processchain__process-item-header img {animation:show 16.5s linear 0s infinite}
.cmp-processchain__inner div:nth-child(3) .cmp-processchain__process-item-header img{animation:show 16.5s linear 1.5s infinite}
.cmp-processchain__inner div:nth-child(4) .cmp-processchain__process-item-header img {animation:show 16.5s linear 3s infinite}
.cmp-processchain__inner div:nth-child(5) .cmp-processchain__process-item-header img {animation:show 16.5s linear 4.5s infinite}
.cmp-processchain__inner div:nth-child(6) .cmp-processchain__process-item-header img{animation:show 16.5s linear 6s infinite}
.cmp-processchain__inner div:nth-child(7) .cmp-processchain__process-item-header img{animation:show 16.5s linear 7.5s infinite}
.cmp-processchain__inner div:nth-child(8) .cmp-processchain__process-item-header img {animation:show 16.5s linear 9s infinite}
.cmp-processchain__inner div:nth-child(9) .cmp-processchain__process-item-header img{animation:show 16.5s linear 10.5s infinite}
.cmp-processchain__inner div:nth-child(10) .cmp-processchain__process-item-header img {animation:show 16.5s linear 12s infinite}
.cmp-processchain__inner div:nth-child(11) .cmp-processchain__process-item-header img {animation:show 16.5s linear 13.5s infinite}
.cmp-processchain__inner div:nth-child(12) .cmp-processchain__process-item-header img {animation:show 16.5s linear 15s infinite}
@keyframes show{from{visibility:visible;}
9%{visibility:visible;}
9.5%{visibility:hidden;}
to{visibility:hidden;}
}
@media screen and (min-width: 1024px) {
    .cmp-processchain__process-item:hover .cmp-processchain__process-item-content {
        visibility:visible;
        transition: none
    }
}
