/* padding nach oben und unten wird auf denn title gesetzt damit man auf der ganzen höhe auf das element zum extenden clicken kann */
    .quest {
        width: 100%;
        padding: 0 1.25em;
        padding-top: 0;
        -webkit-box-shadow: 0px 4px 4px 0px #00000029; 
        box-shadow: 0px 4px 4px 0px #00000029;
        border-radius: 4px;
        border: solid 2px #0000;
        transition-duration: 200ms;
    }
    .quest .quest {
        border: solid 2px #00000029;
        box-shadow: none;
    }
    .quest.active, .quest:hover {
        border: solid 2px #FF7608;
        box-shadow: none;
    }
    .quest.active{
        padding-bottom: 0.938em;
    }
    .quest > .title {
        padding-bottom: 0.938em;
        padding-top: 0.938em;
        transition-duration: 200ms;
        display: block;
        border-bottom: solid 0px #0000;
        margin: 0;
        padding-left: 1.25em;
        display: flex;
        align-items: center;
        position: relative;
        cursor: pointer;
        -webkit-touch-callout: none; /* iOS Safari */
        -webkit-user-select: none; /* Safari */
        -khtml-user-select: none; /* Konqueror HTML */
        -moz-user-select: none; /* Old versions of Firefox */
            -ms-user-select: none; /* Internet Explorer/Edge */
                user-select: none; /* Non-prefixed version, currently*/
    }
    .quest.active > .title, .quest:hover > .title {
        color: var(--primaryColor);
    }
    .quest.active > .title, .quest:active > .title {
        color: var(--black);
    }
    .quest.active > .title{
        padding-bottom: 0.875em;
        border-bottom: solid 1px var(--black);
        margin-bottom: 0.938em;
    }
    .quest > .title svg{
        --svgColor: var(--primaryColor);
        position: absolute;
        left: -0.5em;
        width: 1.5em;
        transition-duration: 200ms;
    }
    .quest.active > .title svg {
        transform: rotate(90deg);
    }
    .quest .title > span {
        font-size: 0.889em;
    }
    .quest > .awnser {
        display: grid;
        grid-template-rows: 0fr;
        transition-duration: 200ms;
        padding-left:  1.25em;
        opacity: 0;
    }
    .quest.active > .awnser {
        grid-template-rows: 1fr;
        opacity: 1;
    }
    .quest > .awnser > * {
        overflow: hidden;
    }
    .quest > .awnser > * {
        font-size: 0.889em;
    }
    .quest > .awnser .questionTypeBlock{
        font-size: 1.125em;
    }
    .questRowns {
        display: grid;
        grid-template-columns: repeat(3, 31%);
        justify-content: space-between;
        margin-bottom: 5em;
    }

    .questionTypeBlock {
        display: flex;
        flex-direction: column;
        gap: 0.625em;
    }
    .catGap {
        height: 3.333em;
    }
    @media (max-width: 1000px){
        .questRowns{
            grid-template-columns: 100%;
            row-gap: 3.333em;
        }
    }