* { user-select: none; }

body { 
    
    border: 2px solid red;
    &.zeige_lupe { cursor: zoom-in; }
}


.lupen_menue { 

    position: fixed;
    left: auto; right: 0; top: 0;
}

.lupen_button { 
    
    font-size: 16pt;
    border-radius: 100%; 
    width:30px;
    height:30px;
    transform: translate(0,-6px);

    &:hover { background-color: black; color: white;}
}

.seiten_lupe {

    --v: 2;
    --g: 50;
    --left: 50%;
    --top: 50%;
    display: none;
    position: fixed;
    left:var(--left); top: var(--top);
    width : calc(var(--g) * 1dvw);
    height: calc(var(--g) * 1dvh);
    transform: translate(-50%,-50%);
    box-sizing: border-box;
    border: 2px solid black;
    overflow: hidden;

    background-color: black;

    &.move { cursor: move; }
    &.rund { border-radius: 100%; }

    .lupen_inhalt {

        position: absolute;
        left:0; top:0;
        transform-origin: 0 0;
        transform: scale(var(--v),var(--v));
        overflow: hidden;
       
    }
}
.anzeige_xy {

    display: none;
    position: fixed;
    left:0; top: 0;
    z-index: 200;
    padding: 6px;
    background-color: white;
}

.lupen_info {

    display: none;
    position: fixed;
    left: 50%; top : 50%;
    transform: translate(-50%,-50%);
    padding: 6px;
    background-color: white;
    color: black;
    font-size: 2dvw;
    border: 3px solid silver;
    border-radius: 12px;
    cursor: pointer;
    font-family: Tahoma;
    width: 90%;
    overflow: auto;
    &.da { display: block; }
}

.seiten_deckel {

    display: none;
    position: absolute;
    left: 0; top:0;
}