.section_title { color: white; background-color: blueviolet;
    position: relative; display: flex; flex-direction: column;
margin: var(--gutter_big) 0;
}
.section_title .wrapper h2 { margin: 0;}
.section_title .wrapper {

    position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
    /*max-width: 720px; */text-align: center; margin: auto !important;
    padding-left: 32px;
    padding-right: 32px;
}


.section_title picture.c {
    position: absolute; top: 0; left: 0; height: 100%; width:100%;
/*    position: relative; display: block;
    border: 20px dashed red;*/
    background-color: var(--dark-purple); user-select: none;
}

.section_title picture.c::before {
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, .5);
    z-index: 5;

}
.section_title::before {
    background-color: red;
    content:""; display: block; width: 100%; height: 36vw; min-height: 320px; max-height: 640px;
}