.profactor-topics3 {
    position: relative;

    &::after {
        content: "";
        position: absolute;
        top: 25px;
        right: 25px;
        width: 565px;
        height: 563px;
        background-image: url("icons/bglogo.svg");
        background-size: contain; /* oder cover */
        background-repeat: no-repeat;
        background-position: center;
        opacity: 0.1;
        z-index: 1;
    }

    .inner {
        display: flex;
        flex-direction: column;

        .single-topic-3-topic {
            box-sizing: border-box;
            width: 100%;

            @media screen and (min-width: 1024px){
                width: 66.66%;
            }

            p:first-child {
                margin-top: 0;
            }

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

            &:nth-child(2n){
                align-self: end;
            }
        }
    }
}

.bg-dark-turkis {
    .headline-box {
        h1,h2,h3,
        .h1,.h2,.h3 {
            color: var(--neutral-10);
        }
    }
}

.profactor-textwith4images {
    .inner {
        .wps-grid {
            --numberOfColums: 2;

            @media screen and (min-width: 1024px){
                --numberOfColums: 4;
            }


            div {
                font-style: italic;

                img {
                    max-width: 100%;
                    height: auto;
                }
            }
        }
    }
}


/* tabed content */

div.profactor-tabedcontent {

    .wps_contentimage_image img{
        max-width: 100%;
        height: auto;
    }

    .button-group {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 32px;
        flex-wrap: wrap;
    }

    .tabs {
        display: flex;
        gap: 0;
    }

    .visually-hidden {
        position: absolute !important;
        width: 1px; height: 1px;
        padding: 0; margin: -1px;
        overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
        border: 0;
    }

    .tab-list {
        display: flex;
        flex-direction: column;
        width: 185px;

        label {
            display: block;
            padding: 14px 16px;
            cursor: pointer;
            user-select: none;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            gap: 15px;
            border-radius: 24px 0;
            border: 2px solid transparent;
            margin-bottom: 15px;
            color: var(--dark-turkis-web);
            width: 102px;
            height: 102px;

            svg {
                width: 52px;
                height: 52px;

                @media screen and (min-width: 1024px){
                    width: 102px;
                    height: 102px;
                }
            }

            svg path {
                fill: var(--dark-turkis-web);
            }

            &:hover,
            &:focus {
                outline: 3px solid var(--dark-turkis-web);
                outline-offset: -3px;
            }
        }
    }

    .tab-panels {
        flex: 1;
        padding: 20px;
        padding-left: 50px;

        .tab-panel {
            display: none;
        }
    }

    #tab1:checked ~ .tab-panels #panel1,
    #tab2:checked ~ .tab-panels #panel2,
    #tab3:checked ~ .tab-panels #panel3,
    #tab4:checked ~ .tab-panels #panel4{
        display: block;
    }

    #tab1:checked ~ .tab-list label[for="tab1"],
    #tab2:checked ~ .tab-list label[for="tab2"],
    #tab3:checked ~ .tab-list label[for="tab3"],
    #tab4:checked ~ .tab-list label[for="tab4"]{
        background: var(--dark-turkis-web);
        border-radius: 24px 0;
        border: 2px solid var(--dark-turkis-web);
        color: var(--neutral-10);

        svg path {
            fill: var(--neutral-10);
        }
    }

    @media (max-width:1023px){

        .tabs {
            flex-direction: column;

            .tab-panels {
                padding-left: 0px;
            }

            .tab-list {
                width: 100%;
                flex-direction: row;
                overflow-x:auto;
                border-right: none;

                label {
                    white-space: nowrap;
                    border-bottom: none;
                    margin-bottom: 0px;
                    margin-right: 15px;
                }
            }
        }
    }
}

.profactor-textwithicons {

    .wps-grid {
        justify-content: space-between;
    }

    .icon-box {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;

        @media screen and (min-width: 1024px) {
            flex-direction: column;
            justify-content: center;
            align-items: center;
            text-align: center;
        }
    }
}

.post-header-image-fullwidth-container {
    position: relative;
    margin-bottom: 50px;

    @media screen and (min-width: 1024px){
        margin-bottom: 125px;
    }

    .industrie-style-headimage {
        position: relative;

        .inner {
            margin: unset;
            padding-left: 0;
            max-width: 100%;

            @media screen and (min-width: 1024px){
                max-width: 80%;
            }


            .single-post-header-image {
                /* transform: translateX(-100px); */
                aspect-ratio: 16 / 7;

                @media screen and (min-width: 1024px){
                    /* transform: translateX(-200px); */
                }
            }
        }
    }

   .headimage-box-widget {
       position: relative;
       width: 100%;
       z-index: 99;
       margin-top: -75px;

       @media screen and (min-width: 1024px){
           margin-top: -115px;
       }

       .box-widget-inner {
           .inner {
               padding-left: 20%;

               .white-box {
                   padding: 24px 32px;
                   background: var(--neutral-10, #FFF);
                   box-shadow: 4px 4px 12px 0 rgba(118, 118, 118, 0.10);
               }
           }
       }
    }

    .headimage-box-widget {
        /*
         display: flex;
         width: 70%;
         max-width: 70%;
         padding: 24px 32px;
         flex-direction: column;
         align-items: flex-start;
         gap: 32px;
         position: relative;
         background: var(--neutral-10, #FFF);
         box-shadow: 4px 4px 12px 0 rgba(118, 118, 118, 0.10);
         margin-top: -40px;

         @media screen and (min-width: 1024px){
             width: 998px;
             max-width: 70%;
             right: 119px;
             position: absolute;
             bottom: -53px;
             right: 0px;
             margin-top: unset;
         }
     */
     }
}



.frontpage-style-headimage {
    .headimage-box-widget {
        display: flex;
        width: 998px;
        max-width: 80%;
        padding: 24px 15px;
        flex-direction: column;
        align-items: center;
        position: relative;
        background: var(--neutral-10, #FFF);
        box-shadow: 4px 4px 12px 0 rgba(118, 118, 118, 0.10);
        margin: auto;
        margin-top: -30px;

        @media screen and (min-width: 1024px){
            margin-top: -140px;
            padding: 24px 32px;
            max-width: 75%;
        }

        .h2 {
            margin-bottom: 24px;
        }
    }
}

.profactor-text.bg-neutral-20,
.profactor-text.bg-dark-turkis{
    padding-top: 80px;
    padding-bottom: 80px;

    hr {
        margin-top: 32px;
        margin-bottom: 32px;
    }

    &.text-white {
        h1, h2, h3, h4,
        .h1, .h2, .h3, .h4,
        p, span, a {
            color: white !important;
        }
    }
}

.profactor-industrieselector .wps-grid-item {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    padding: 25px;
    text-decoration: none;
    padding-top: 50px;
    padding-bottom: 50px;
    color: var(--neutral-10);

    &:hover,
    &:focus-within,
    &:active {
        background-color: var(--dark-turkis-web-hover);
        outline: none;
    }
}

div.otgs-development-site-front-end {display: none !important;}


.wps-testimonials {
    .single-testimonial {
        display: flex;
        flex-direction: column;
        box-sizing: border-box;

        @media screen and (min-width: 600px){
            flex-direction: row;
            padding: 32px 60px;
        }

        cite {
            display: block;
            margin-bottom: var(--space-l);
        }

        .image-container {
            min-width: 280px;
            overflow: hidden;
            aspect-ratio: 3 / 4;
            width: auto;

            img {
                object-fit: cover;
                width: 100%;
                height: 100%;
                object-position: center;
            }
        }
    }
}

.wps-testimonials {
    position: relative;
    overflow: hidden;
    touch-action: pan-y;
}

.wps-testimonials-track {
    display: flex;
    will-change: transform;
    transition: transform 0.45s ease;

    &:focus,
    &:focus-visible {
        outline: none;
    }
}

.single-testimonial {
    flex: 0 0 100%;
    box-sizing: border-box;

    div.article-inner {
        display: flex;
        flex: 0 0 100%;
        box-sizing: border-box;
        background-color: var(--neutral-10);
        box-shadow: 4px 4px 12px 0 rgba(118, 118, 118, 0.10);
        padding: 32px;
        flex-direction: column;

        @media screen and (min-width: 1024px){
            flex-direction: row;
        }
    }

    blockquote {
        margin: 0;

        svg {
            width: 55px;
            height: 55px;
            margin-bottom: 8px;
        }

        @media screen and (min-width: 1024px){
            margin: 2rem;
            width: 150%;

            svg {
                width: 64px;
                height: 64px;
                margin-bottom: 8px;
            }
        }
    }
}

@media (prefers-reduced-motion: reduce) {
    .wps-testimonials-track {
        transition: none;
    }
}

.wps-testimonials {
    cursor: grab;
}
.wps-testimonials:active {
    cursor: grabbing;
}

.wps-testimonials-controls {
    position: absolute;
    inset: 45% 0px auto 0px;
    display: flex;
    justify-content: space-between;
    pointer-events: none;
}

.wps-testimonials-controls button {
    pointer-events: auto;
    background: none;
    border: none;
    appearance: none;

    &.prev {
        transform: translateX(-24px);
    }

    &.next {
        transform: translateX(24px);
    }

    &:hover,
    &:focus,
    &:active {
        cursor: pointer;
        opacity: 0.6;
        outline: none;
    }
}

.wps-testimonials-dots {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 24px;
}

.wps-testimonials-dots button {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 1px solid currentColor;
    background: transparent;
}

.wps-testimonials-dots button[aria-selected="true"] {
    background: currentColor;
}


@media screen and (max-width: 1024px){
    .wps-testimonials-controls button {display: none;}
}

@media screen and (min-width: 1024px){
    .wps-testimonials-dots {display: none;}
}



#cmplz-document {
    width: 100%;
    max-width: 1234px;
    margin: auto;
    padding-left: var(--space-s);
    padding-right: var(--space-s);
    box-sizing: border-box;

    accent-color: var(--dark-turkis-web) !important;

    & > p + h2,
    & > p + .cmplz-subtitle {
        margin-top: 2rem;
    }

    #cmplz-manage-consent-container details,
    #cmplz-cookies-overview details {
        background-color: #fff !important;
        /* background: #fff !important;*/
        border: 1px solid #e0e0e0;
        border-radius: 4px;
        overflow: hidden;
        transition: box-shadow 0.25s ease;
        margin-bottom: 24px;
    }

    details.cmplz-category summary,
    summary.cmplz-service-header {
        background-color: var(--neutral-10) !important;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 3rem;
        padding: 1rem 1.25rem;
        cursor: pointer;
        list-style: none;
        user-select: none;
        -webkit-user-select: none;
        border-radius: 8px;
        transition: background 0.15s ease;
    }

    summary.cmplz-service-header {
        /* padding: 0rem 1.25rem; */
    }

    #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header {
        padding: 0;
        background-color: transparent;
    }

    cmplz-consent-checkbox {
        width:20px;
        height:20px;
    }

    .cmplz-icon.cmplz-open{
        height:50px !important;
        width:50px !important;

        & svg {
            /*width: 28px !important;
            height: auto;*/
        }
    }
}

/*
#cmplz-manage-consent-container .cmplz-category{
	padding: var(--space-s);
	background-color: var(--neutral-10) !important;
	border: solid 1px var(--neutral-60);
	border-radius: 4px;
	
	.cmplz-consent-checkbox {
		width:20px;
		height:20px;
	}
	.cmplz-category-header{
		background-color: var(--neutral-10) !important;
	}
	.cmplz-icon.cmplz-open{
		height:50px !important;
		width:50px !important;
		
		& svg {
			width: 28px !important;
			height: auto;
		}
	}
}
*/