/************************************ Start: Box mit Hintergrundfläche ************************************/
.cms_boxbg_box { width: 100%; padding: 97px 114px; background: var(--quaternary); box-shadow: 0 0 100px 0 rgba(0,0,0,0.1); }
@media screen and (max-width: 959px) { .cms_boxbg_box { padding: 30px; } }
/************************************ Ende: Box mit Hintergrundfläche ************************************/

/************************************ Start: Galerie Sgok ************************************/
.block_22030 .cms_gallery_header,
.block_22030 .cms_gallery_intro { display: none; }
.cms_gsgok_main { display: flex; flex-direction: column; gap: 51px; width: 100%; }
.cms_gsgok_intro { display: flex; flex-direction: column; gap: 15px; width: 100%; }
.cms_gsgok_container { display: flex; flex-wrap: wrap; gap: 6px; width: 100%; }
.cms_gsgok_lst { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 6px; width: calc(50% - 3px); aspect-ratio: 580 / 632; }
.cms_gsgok_box { display: flex; width: calc(50% - 3px); height: 60%; }
.cms_gsgok_lst > .cms_gsgok_box:first-of-type { width: 100%; height: 40%; }
.cms_gsgok_container > .cms_gsgok_lst:nth-of-type(2n) > .cms_gsgok_box { width: calc(50% - 3px); height: 60%; }
.cms_gsgok_container > .cms_gsgok_lst:nth-of-type(2n) > .cms_gsgok_box:last-of-type:not(:first-of-type):not(:nth-of-type(2)) { width: 100%; height: 40%; }
.cms_gsgok_imgContainer { position: relative; z-index: 1; display: flex; width: 100%; }
.cms_gsgok_imgBox { display: flex; width: 100%; }
.cms_gsgok_imgBox:before { content: ""; position: absolute; z-index: 2; inset: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); visibility: hidden; opacity: 0; transition: var(--transition); }
.cms_gsgok_imgBox:hover:before { visibility: visible; opacity: 1; }
.cms_gsgok_imgBox:after { content: "\f002"; position: absolute; z-index: 3; top: 50%; left: 50%; transform: translate(-50%,-50%); font: 28px 'FontAwesome'; line-height: 30px; color: var(--white); text-align: center; visibility: hidden; opacity: 0; transition: var(--transition); }
.cms_gsgok_imgBox:hover:after { visibility: visible; opacity: 1; }
.cms_gsgok_imgBox > picture { display: flex; width: 100%; }
.cms_gsgok_imgBox > picture > img { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; object-position: center; object-fit: cover; }
.cms_gsgok_imgLegend { display: none; }
@media screen and (max-width: 959px) { .cms_gsgok_main { gap: 30px; } }
/************************************ Ende: Galerie Sgok ************************************/