:root{
    --ButtonAnzahl: 3;
    --PreisButtonHeight: 0.3;
    
    --kaufButtonHeight: calc((var(--wrapper4Height) * (1 - var(--PreisButtonHeight))) / (var(--ButtonAnzahl) *2));;
    
    --kaufButtonTextDivWidth: calc(var(--wrapper5Width) - var(--kaufButtonHeight) * 0.19);
    
    --shadowSizeConstant: 0.02;
    
    --kaufButtonChars: 0;
}

#id_kaufButtonsBox {
    height: var(--wrapper4Height);
    width: var(--wrapper5Width);
    position: absolute;
}

.class_kaufButtons {
    width: var(--wrapper5Width);
    height: var(--kaufButtonHeight);
    margin-bottom: var(--kaufButtonHeight);
    background-image: url('/Bilder/KaufButtonSeite.png');
    background-size: auto 100%;
    background-repeat: no-repeat;
    box-shadow: 0px calc(var(--kaufButtonHeight) * var(--shadowSizeConstant)) rgba(101, 100, 97, 1);
    opacity: 0.8;
}

.class_kaufButtons:hover {
    opacity: 1;
    cursor: pointer;
}

.class_kaufButtonsTextDivs {
    width: var(--kaufButtonTextDivWidth);
    height: var(--kaufButtonHeight);
    margin-left: calc(var(--kaufButtonHeight) * 0.19);
    background-color: rgba(205, 201, 164, 1);
    font-family: var(--w6_fontFamily);
    font-size: min(calc(var(--kaufButtonTextDivWidth) / (var(--kaufButtonChars)) * var(--textConstant)), var(--kaufButtonHeight) / 1.2);
}

.class_kaufButtonText {
    height: var(--kaufButtonHeight);
    width: var(--kaufButtonTextDivWidth);
}

#id_preisButton {
    width: var(--wrapper5Width);
    height: calc(var(--wrapper4Height) * var(--PreisButtonHeight));
    background-image: url('/Bilder/KaufButtonSeite.png');
    background-size: auto 100%;
    background-repeat: no-repeat;
    box-shadow: 0px calc((var(--wrapper4Height) * var(--PreisButtonHeight)) * var(--shadowSizeConstant)) rgba(101, 100, 97, 1);
    opacity: 1;
}

#id_preisButtonTextDiv {
    width: calc(var(--wrapper5Width) - (var(--wrapper4Height) * var(--PreisButtonHeight)) * 0.19);
    height: calc(var(--wrapper4Height) * var(--PreisButtonHeight));
    margin-left: calc((var(--wrapper4Height) * var(--PreisButtonHeight)) * 0.19);
    background-color: rgba(205, 201, 164, 1);
}

.class_kaufFenster {
    height: var(--wrapper4Height);
    width: var(--wrapper5Width);
    position: relative;
    transition-duration: 0.3s;
    background-image: url('/Bilder/KaufFensterSeite.png');
    background-size: auto 100%;
    background-repeat: no-repeat;
}

.class_closeDivs {
    width: calc(var(--wrapper4Height) * 0.1);
    float: left;
    position: absolute;
}

.class_closeImgs {
    width: 60%;
    margin-left: 20%;
    margin-top: 20%;
    cursor: pointer;
    transition-duration: 0.1s;
}

.class_closeImgs:hover {
    width: 64%;
    margin-left: 18%;
    margin-top: 18%;
}

.class_kaufFensterTextDivs {
    width: calc(var(--wrapper5Width) - var(--wrapper4Height) * 0.1);
    height: var(--wrapper4Height);
    margin-left: calc(var(--wrapper4Height) * 0.1);
    background-color: rgb(192, 186, 160);
}

#id_kaufFester0 {
    --hidden: 1;
    margin-left: calc(var(--wrapper5Width) * var(--hidden));
}

#id_kaufFester1 {
    --hidden: 1;
    margin-left: calc(var(--wrapper5Width) * var(--hidden));
    margin-top: calc(var(--wrapper4Height) * -1);
}

#id_kaufFester2 {
    --hidden: 1;
    margin-left: calc(var(--wrapper5Width) * var(--hidden));
    margin-top: calc(var(--wrapper4Height) * -1);
}

#id_kaufFester3 {
    --hidden: 1;
    margin-left: calc(var(--wrapper5Width) * var(--hidden));
    margin-top: calc(var(--wrapper4Height) * -1);
}