/*
 * @package:    fz3temp-2
 * @author:     Dennis Rougoor - Fervent Digital
 * @copyright:  2018 - 2025
 * --------------
 * Created:     19-11-2025, 09:43:58
 * Modified:    19-11-2025, 09:44:33
 * Modified By: Dennis Rougoor
 */
/* 
Theme Name: ferventdigital
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Bij ferventdigital vinden we dat elke ondernemer, groot of klein, online zichtbaar moet kunnen zijn. Of je nu op zoek bent naar een vette website, een conversiegerichte webshop, professionele fotografie óf het beter inzetten van je social media: ferventdigital is jouw one-stop oplossing voor online zichtbaarheid.
Author: ferventdigital
Author URI: https://www.fervent.digital/
Template: hello-elementor
Version: 2.0.0
Text Domain: ferventdigital
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Improved Animations Stylesheet from https://element.how/elementor-improve-entrance-animations/ , works for the 'fade' animations */
@keyframes fadeDown {
    from {
        opacity: 0;
        transform: translate3d(0,-30px,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInDown {
    animation-name: fadeDown
}

@keyframes fadeLeft {
    from {
        opacity: 0;
        transform: translate3d(-30px,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInLeft {
    animation-name: fadeLeft
}

@keyframes fadeRight {
    from {
        opacity: 0;
        transform: translate3d(30px,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInRight {
    animation-name: fadeRight;
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translate3d(0,30px,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInUp {
    animation-name: fadeUp;
}


.fc{
    max-width:fit-content !important;
}

.elementor-button-icon svg{
    width:10px;
}

.custom-link{
    text-decoration: underline;
    transition: all 0.3s ease;
}

.custom-link:hover{
    text-decoration: none;
}

.no-underline{
    text-decoration: none !important;
}

.image-fullheight,
.image-fullheight div,
.image-fullheight img{
    height:100%;
}

.bericht-termen .elementor-post-info__terms-list{
    gap:8px;
}

.bericht-termen .elementor-post-info__terms-list .elementor-post-info__terms-list-item{
    padding:6px 18px;
    border:1px solid #fff;
    font-size:14px;
    color:#fff;
    border-radius:50px;
}

.elementor-button .elementor-button-icon{
    transition: all 0.3s ease;
    position: relative;
    left:0px;
    bottom:0px;
    transform:translateX(0px);
    transform:translateY(0px);
}

.elementor-button:hover .elementor-button-icon{
    transform:translateX(5px) translateY(-5px);
}

.controlledByArrows_1{
    padding-left: max(calc((100vw - 1440px) / 2), 50px);
}

.news-block-container .swiper-slide{
    overflow:hidden;
    text-decoration: none !important;
    border-radius: 18px;
}

.news-block{
    overflow:hidden;
    text-decoration: none !important;
    border-radius: 18px;
}

.news-block .news-block-image img {
     transition: all 0.3s ease;
}

.news-block::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    opacity: 0.5;
    background: black;
    z-index: 1;
}

.news-block .news-block-image {
    width: 100% !important;
}
.news-block:hover .news-block-image img {
    transform: scale(1.05);
}

.image-carousel .swiper-wrapper{
    gap:24px;
}

.image-carousel .swiper-wrapper .swiper-slide{
    border-radius: 18px;
    background: rgba(92, 165, 95, 0.10);
    height:125px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.swiper-nav-container{
    padding-left: max(calc((100vw - 1440px) / 2), 50px);
}

.arrowControlPrevious_1,
.arrowControlForward_1{
    transition: all 0.3s ease;
    cursor: pointer !important;
    width:40px;
    height:40px;
}

.elementor-popup-modal .elementor-nav-menu--main .elementor-nav-menu ul.sub-menu{
    display: block !important;
    position: relative !important;
    left:0px !important;
    top:0px !important;
    background-color: transparent !important;
    color:#fff !important;
    margin-top:20px !important;
}

.elementor-popup-modal .elementor-nav-menu--main .elementor-nav-menu ul.sub-menu li,
.elementor-popup-modal .elementor-nav-menu--main .elementor-nav-menu ul.sub-menu li a{
    background-color: transparent;
    color:#fff !important;
    text-decoration: none;
    opacity: 0.8;
}

.elementor-popup-modal .elementor-nav-menu--main .elementor-nav-menu ul.sub-menu li a:hover{
    opacity: 1;
}

.diensten-loop .elementor-button svg{
    fill:#231F20;
}

.open-categories{
    cursor: pointer;
}

.tax-filter{
    background-color: #ffffff;
    border-radius: 8px;
    border:1px solid #231F204D;
    min-width: 100% !important;
    max-width: unset !important;
    white-space: nowrap;
    display: none;
    z-index: 3 !important;
    text-align: left;
    padding:10px 0px !important
}

.tax-filter button{
    width:100% !important;
    text-align: left !important;
    justify-content: flex-start !important;
    padding-left:16px !important;
    padding-right:16px !important;
}

.tax-filter button:hover{
    background-color: #f4f4f4;
}

.tax-filter.active{
    display: block;
}

.open-categories.active div:last-child img{
    transform:rotate(180deg);
}

.elementor hr{
    width: 100%;
    opacity: 0.1;
    background: #231F20;
    margin-bottom:32px;
}

.break-word{
    word-break: break-word;
}

.sticky{
    position: sticky;
    top: 100px;
}

.diensten-carousel img{
    height: 60vh;
    object-fit: cover;
    width: 100%;
}

.diensten-carousel .swiper .elementor-swiper-button-next,
.diensten-carousel .swiper .elementor-swiper-button-prev{
    width: 32px;
    height: 32px;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
}

.diensten-carousel .swiper .elementor-swiper-button-next svg,
.diensten-carousel .swiper .elementor-swiper-button-prev svg{
    fill:#231F20 !important;
}

.diensten-carousel .swiper .elementor-swiper-button-next svg path:last-child,
.diensten-carousel .swiper .elementor-swiper-button-prev svg path:last-child{
    fill:none;
}

.post-content img{
    width: 100%;
}

.team-item img{
    border-top-left-radius: 18px;
    border-top-right-radius: 18px;
    overflow: hidden;
}

.team-item ul li{
    list-style: none;
}


.team-item a{
    pointer-events: none;
    color:#231F20;
    text-decoration: none;
    font-weight: 400;
}

.elementor-button:hover{
    text-decoration: none !important;
}

.remove-filters{
    cursor: pointer;
    text-decoration: underline;
}

.remove-filters:hover{
    text-decoration: none;
}

.gform_wrapper form{
    margin-top:40px;
}

.gform_wrapper form .gform_fields{
    gap:24px;
}

footer a:hover{
    text-decoration: underline !important;
}

input[type=date], input[type=email], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=url], select, textarea{
    border-radius: 8px !important;
    border: 1px solid rgba(18, 18, 18, 0.40) !important;
    padding:16px !important;
    box-shadow: none !important;
    height:56px !important;
}

.gform_button{
    font-family: "Open Sans", Sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    text-decoration: none !important;
    line-height: 150% !important;
    color: #231f20 !important;
    background-color: #f7d405 !important;
    border-radius: 18px 18px 18px 18px !important;
    padding: 8px 24px 8px 24px !important;
    transition: all 0.3s ease;
}

.gform_button:hover{
    background-color: #debe04 !important;
}

::placeholder{
    color:rgba(18, 18, 18, 0.5) !important;
}

.ginput_container_consent{
    cursor: pointer;
}

.gallery-images{
    display: flex;
    flex-wrap:wrap;
    gap:16px;
    /* min-height:500px; */
}

.gallery-images > div{
    flex-basis: calc(25% - 16px);
    aspect-ratio: 1/1;
}

.gallery-images > div img{
    width: 100%;
    height:100%;
    border-radius: 18px;
    object-fit: cover;
}

.lb-outerContainer{
    background-color: transparent !important;
}

.lightbox{
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    justify-content: center;
    height: 100%;
    max-width: 100vw;
}

.lightbox .lb-image{
    border:none !important;
}

.fslightbox-container button{
    padding:0px;
    min-width:42px;
    min-height:42px;
    background-color: white;
}

.fslightbox-container button svg path{
    fill:black;
}

.fslightbox-container button:hover svg path{
    fill:black;
}

.open-image-filters{
    display: inline-flex;
    gap:10px;
    justify-content: center;
    align-items: center;
    padding: 12px 16px;
    border:1px solid #231F204D;
    cursor: pointer;
    border-radius:8px;
}

.filter-buttons{
    display: flex;
    flex-direction: column;
    position: absolute;
    top:60px;
    left:0px;
    background-color: #fff;
    border-radius: 8px;
    border: 1px solid #231F204D;
    white-space: nowrap;
    display: none;
    padding:10px 0px;
}

.filter-buttons.active{
    display: flex !important;
}

.open-image-filters.active .angle{
    transform:rotate(180deg);
}

.filter-buttons button{
    background-color: transparent;
    border:none;
    border-radius:0px;
    text-align: left;
}

.filter-buttons button:hover{
    background-color: #f4f4f4;
}

.filters-container{
    position: relative;
    margin-bottom: 40px;
    display: flex;
    justify-content: space-between;
    align-content: center;
}

.remove-image-filters{
    text-decoration: underline;
    cursor: pointer;
}

.remove-image-filters:hover{
    text-decoration: none;
}

.hero-cta .elementor-button-text {
    min-width: max-content;
}

@media only screen and (max-width: 767px) {
    .bericht-termen .elementor-post-info__terms-list .elementor-post-info__terms-list-item{
        margin-bottom:24px;
    }

    .swiper-nav-container,
    .controlledByArrows_1{
        padding-left:20px !important;
    }

    .gallery-images > div{
        flex-basis: calc(50% - 16px);
    }
}

@media only screen and (max-width: 420px) {
    .gallery-images > div{
        flex-basis: 100%;
    }

    .filters-container{
        flex-direction: column;
        gap:16px;
    }
}