.displayFrame{
    position: absolute;
    width: 105%;
    height: 112%;
    background: black;
    z-index: -1;
    border-radius: 1.9vw;
    transform: translate(-2.5%, -3%);
}
#gradient-canvas {
    width:100%;
    height:100%;
    --gradient-color-1: #043D5D;
    --gradient-color-2: #032E46;
    --gradient-color-3: #23B684;
    --gradient-color-4: #0F595E;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    /* create hue-rotate animation */
}
.monitor{
    z-index: 1;
    position: relative;
    margin-top: 2.5%;
    margin-left: 13%;
    width: 74%;
    height: 85vh;
}

#displayFrameLeft,
#displayFrameRight{
    margin-top: 1.3vh;
    margin-left: 11%;
    width: 2%;
    height: 88vh;
    border-top-left-radius: 1.9vw;
}

#displayFrameRight{
    margin-left: 87%;
    border-top-left-radius:0;
    border-top-right-radius: 1.9vw;
}

#displayFrameTop{
    margin-top: 1.3vh;
    margin-left: 11%;
    width: 78%;
    height: 2vw;
    border-top-left-radius: 1.9vw;
    border-top-right-radius: 1.9vw;
}

#displayFrameBottom{
    margin-top: 87vh;
    margin-left: 11%;
    width: 78%;
    height: 4vw;
    border-bottom-left-radius: 1.9vw;
    border-bottom-right-radius: 1.9vw;
}

.wall{
    z-index: 100;
    position: fixed;
    background-color: rgb(0, 142, 161);
}

#leftWall,
#rightWall{
    width: 12%;
    height: 100vh;
}

#rightWall{
    margin-left: 88%;
}

#topWall{
    width: 100%;
    height: 2vh;
}

#bottomWall{
    width: 100%;
    height: 15vh;
    margin-top: 88vh;
}

#displayLeg{
    z-index: -1;
    width: 20%;
    height: 15vh;
    background-color: gray;
    position: fixed;
    bottom: -15px;
    left: 40%;
}

#powerOffButton{
    position: absolute;
    z-index: 999;
    width: 1.5vw;
    height: 1.5vw;
    background-image: url("../images/general/MONITORoff.svg");
    background-size: cover;
    right: 14px;
    bottom: -4.5vh;
}