:root{
    /*groen*/
    --mat-groen: #A2C6AC;
    --licht-groen: #D2E3D7;
    --donker-groen: #4C806F;
    --tekst-groen: #044B38;
    --tekst-geel: #ffd140;
    /*geel*/
    --mat-geel: #FDDD78;
    --licht-geel: #F8EECC;
    --donker-geel: #FFD140;

    /*font-size-Icon*/
    --icon-font-size: 299px;
    --icon-font-size-right: 3150%;
}
/*Groen*/
.aw-kleur-groen .aw-banner-divider .elementor-icon-wrapper .elementor-icon svg g g path{
    fill: var(--mat-groen);
}
.aw-color-green .aw-banner-divider .elementor-icon-wrapper .elementor-icon svg g g path{
    fill: var(--mat-groen);
}
.aw-Farbe-grün .aw-banner-divider .elementor-icon-wrapper .elementor-icon svg g g path{
    fill: var(--mat-groen);
}

/*geel*/
.aw-kleur-geel .aw-banner-divider .elementor-icon-wrapper .elementor-icon svg g g path{
    fill: var(--mat-geel);
}
#aw-galerij.aw-kleur-geel{
    background-color: var(--licht-geel) !important;
}
#aw-galerij-divider.aw-kleur-geel .elementor-divider-separator{
    border-block-color: var(--donker-geel) !important;
}
.aw-kleur-geel .aw-galerij-links .aw-banner-links{
    background-color: var(--mat-geel) !important;    
}
.aw-kleur-geel .aw-galerij-links .aw-banner-divider .elementor-shape svg .elementor-shape-fill{
    fill: var(--mat-geel) !important;
}

.aw-kleur-geel .aw-galerij-midden{
    background-color: var(--donker-geel) !important;
}
.aw-kleur-geel .aw-galerij-midden h3{
    color: black !important;
}
.aw-kleur-geel .aw-galerij-rechts .aw-banner-rechts{
    background-color: var(--mat-geel) !important;
}
.aw-kleur-geel .aw-galerij-rechts .aw-banner-divider .elementor-shape svg .elementor-shape-fill{
    fill: var(--mat-geel) !important;
}
.aw-kleur-geel .aw-galerij-rechts .elementor-button{
    border-color: white !important;
}
.aw-kleur-geel .aw-galerij-rechts .elementor-button span{
    color: white !important;
}
.aw-kleur-geel .aw-galerij-rechts .elementor-button span svg{
    fill: white !important;
}
.aw-kleur-geel .aw-galerij-rechts .elementor-button:hover,
.aw-kleur-geel .aw-galerij-rechts .elementor-button:hover span,
.aw-kleur-geel .aw-galerij-rechts .elementor-button:hover span svg{
    color: black !important;
    fill: black !important;
    border-color: black !important;
}
.aw-banner-divider .aw-gallary-wave-icon .elementor-widget-container .elementor-icon-wrapper .elementor-icon{
    font-size: var(--icon-font-size);
    transition: 0.5s;
}
.section-foto-galerij-met-teksten #aw-galerij .aw-galerij-rechts .aw-banner-divider .e-con-inner .elementor-element .elementor-widget-container .elementor-icon-wrapper .elementor-icon{
    font-size: var(--icon-font-size-right) !important;
    transition: 0.5s;
}
@media  screen and (max-width: 1130px) {
    :root{
        --icon-font-size: 296px;
    }
}
@media  screen and (max-width: 1120px) {
    :root{
        --icon-font-size: 294px;
        --icon-font-size-right:3090%;
    }
}

@media  screen and (max-width: 1075px) {
    :root{
        --icon-font-size: 278px;
        --icon-font-size-right:2980%;
    }
}
@media  screen and (max-width: 1025px) {
    :root{
        --icon-font-size: 267px;
        --icon-font-size-right:2830%;
    }
}
@media  screen and (max-width: 1010px) {
    :root{
        --icon-font-size: 262px;
        --icon-font-size-righ: 2790%;
    }
}
@media  screen and (max-width: 957px) {
    :root{
        --icon-font-size: 248px;
        --icon-font-size-right:2650%;
    }
}
@media  screen and (max-width: 910px) {
    :root{
        --icon-font-size: 235px;
        --icon-font-size-right:2500%;
    }
}
@media  screen and (max-width: 876px) {
    :root{
        --icon-font-size: 226px;
        --icon-font-size-right:2400%;
    }
}
@media  screen and (max-width: 834px) {
    :root{
        --icon-font-size: 215px;
        --icon-font-size-right:2300%;
    }
}
@media  screen and (max-width: 770px) {
    :root{
        --icon-font-size: 196px;
        --icon-font-size-right:2300%;
    }
}
@media  screen and (max-width: 767px) {
    :root{
        --icon-font-size: 717px;
        --icon-font-size-right:2100%;
    }
}
@media  screen and (max-width: 728px) {
    :root{
        --icon-font-size: 678px;
        --icon-font-size-right:4245%;
    }
}
@media  screen and (max-width: 709px) {
    :root{
        --icon-font-size: 659px;
    }
}
@media  screen and (max-width: 682px) {
    :root{
        --icon-font-size: 632px;
    }
}
@media  screen and (max-width: 666px) {
    :root{
        --icon-font-size: 616px;
    }
}
@media  screen and (max-width: 647px) {
    :root{
        --icon-font-size: 598px;
    }
}
@media  screen and (max-width: 627px) {
    :root{
        --icon-font-size: 577px;
    }
}
@media  screen and (max-width: 610px) {
    :root{
        --icon-font-size: 559px;
    }
}
@media  screen and (max-width: 589px) {
    :root{
        --icon-font-size: 539px;
    }
}
@media  screen and (max-width: 567px) {
    :root{
        --icon-font-size: 517px;
    }
}
@media  screen and (max-width: 549px) {
    :root{
        --icon-font-size: 499px;
    }
}
@media  screen and (max-width: 529px) {
    :root{
        --icon-font-size: 479px;
    }
}
@media  screen and (max-width: 511px) {
    :root{
        --icon-font-size: 461px;
    }
}
@media  screen and (max-width: 494px) {
    :root{
        --icon-font-size: 444px;
    }
}
@media  screen and (max-width: 476px) {
    :root{
        --icon-font-size: 427px;
    }
}
@media  screen and (max-width: 456px) {
    :root{
        --icon-font-size: 406px;
    }
}
@media  screen and (max-width: 435px) {
    :root{
        --icon-font-size: 384px;
    }
}
@media  screen and (max-width: 414px) {
    :root{
        --icon-font-size: 364px;
    }
}
@media  screen and (max-width: 390px) {
    :root{
        --icon-font-size: 340px;
    }
    .aw-banner-divider .aw-gallary-wave-icon .elementor-widget-container{
        margin: 0px 0px -168px 0px !important;
    }
}
@media  screen and (max-width: 375px) {
    :root{
        --icon-font-size: 325px;
    }

}