body.home #pageheader p:first-child,
.headertext h1,
#pageheader h1 {
    font-family:var(--headingfont);
    font-weight: 700;
    font-size: 64px;
    line-height: 120%;
    /*letter-spacing: -0.01em;*/

    margin-bottom: 0;
}
.headertext h1 {
    margin-bottom: var(--gutter);
}
 #eventheader h1, #newsheader h1,
body:not(.search) #pageheader h1 {
/*    max-width: 12em;*/
}
.headertext p ,
#pageheader p {
    font-family: var(--headingfont);
    font-weight: 400;
    font-size: 32px; line-height: 130%; letter-spacing: -0.01em;
    margin: 0;  max-width: 25em;
}
#pageheader p:not(.cta):not(:first-child){
    margin: var(--gutter) 0 ;
}

#pageheader p:last-child {
    margin-bottom: 0;
}

@media all and (max-width: 1199.98px) {
    body.home #pageheader p:first-child,
    .headertext h1,
    #pageheader h1 {
        font-size: 48px;
    }
    .headertext p ,
    #pageheader p {
        font-size: 24px;
    }

}
@media all and (max-width:899.98px) {
    body.home #pageheader p:first-child,
    .headertext h1,
    #pageheader h1 {
        font-size: 36px;
    }
    .headertext p ,
    #pageheader p {
        font-size: 20px;
    }

}
@media all and (max-width:599.98px) {
    body.home #pageheader p:first-child,
    .headertext h1,
    #pageheader h1 {
        font-size: 24px;
    }
    .headertext p ,
    #pageheader p {
        font-size: 18px;
    }

}


.pageheader { display: flex; overflow: hidden;   padding: calc(var(--padding_big) * 1) 0;

    background: var(--green);
    position: relative;
/*    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);*/
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 1728 864"> <rect fill="%231eb46a" width="1728" height="856"/> <path fill="%239fdbb3" d="M0,553l72,9c72,8,216,26,360,43s288,35,432,9c144-26,288-95,432-104s288,43,360,69l72,26v259H0v-311Z"/> <path fill="%23f0db10" d="M0,103.7l72,34.6c72,34.6,216,103.7,360,103.7s288-69.1,432-69.1,288,69.1,432,86.4c144,17.3,288-17.3,360-34.6l72-17.3V0H0v103.7Z"/>  <path fill="%23035193" d="M0,792l72-30c72-30,216-90,360-108s288,6,432,36c144,30,288,66,432,36s288-126,360-174l72-48v360H0v-72Z"/> </svg>');
background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.smallheader { background: var(--yellow); padding: calc(var(--padding) * 1.5) 0  calc(var(--padding) * 2) ; }
.smallheader :last-child{ margin-bottom: 0 !important; }

.pageheader > .wrapper > div { display: flex; border-radius: var(--border-radius); overflow: hidden;

    background: var(--green-darkest);
    position: relative;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);

}


.pageheader > .wrapper > div :is(figure,div) {    display: block;
    width: 50%; /*background: var(--green-darkest);*/ color: var(--yellow-lightest);
    position: relative; }
.pageheader figure {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 1728 864"> <rect fill="%231eb46a" width="1728" height="856"/> <path fill="%239fdbb3" d="M0,553l72,9c72,8,216,26,360,43s288,35,432,9c144-26,288-95,432-104s288,43,360,69l72,26v259H0v-311Z"/> <path fill="%23f0db10" d="M0,103.7l72,34.6c72,34.6,216,103.7,360,103.7s288-69.1,432-69.1,288,69.1,432,86.4c144,17.3,288-17.3,360-34.6l72-17.3V0H0v103.7Z"/>  <path fill="%23035193" d="M0,792l72-30c72-30,216-90,360-108s288,6,432,36c144,30,288,66,432,36s288-126,360-174l72-48v360H0v-72Z"/> </svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.pageheader figure picture {
    position: absolute; top: 0; left: 0; /**/
    width: 100%; height: 100%;
}

@media all and (min-width:900px) {
    body.home .pageheader > .wrapper > div { width: 75%; max-width: 850px;}
    body.home .pageheader > .wrapper > div div { width: 100%;}
}
@media all and (min-width:1200px) {
    body.home .pageheader > .wrapper > div { width: 66.666%;}

}

.pageheader > .wrapper > div figure::before {
    display: block; content:""; width: 100%;
    height: 0; padding-bottom: 50%;
}

.pageheader > .wrapper > div figure { /*order: -1;*/
    display: flex;flex-direction: column; flex:1;

}



.pageheader > .wrapper > div div { padding: var(--padding_big);

    display: flex; flex-direction: column;  justify-content: center;
}


@media all and (max-width: 1199px) {


}

@media all and (max-width: 1199px) {


}
@media all and (max-width: 899.98px) {

    .pageheader > .wrapper > div { flex-direction: column; }
    .pageheader > .wrapper > div :is(figure,div) { width:100%; }
    .pageheader figure { order: -1;}
    .pageheader figure picture {
        height: 0; padding-bottom: 50%;
    }

}