.ControllerPanelGlobal{
    top: 98vh;
    left: 2vh;
    /* left: 10vw; */
    transform: translate(0% , -100%);
    position: fixed;
    transition-duration: 0.2s;
}



.ControllerPanelHidden{
    
}

.ControllerPanelColorInfo{
    text-align: center;
    left: 50%;
    top: -1vh;
    border-radius: 4px;
    padding: 10px 20px 10px 20px;
    margin: 2px;
    position: relative;
    font-size: 2.5vmin;
    font-weight: 400;
    transform: translate(-50% , -50%);
}

.ControllerPanelColorBackground{
}

.ControllerPanelBtn {
    border-radius: 0px;
    cursor: pointer;
 
    background: rgba(20, 20, 20, 0.85);
    /* padding: 10px 20px 10px 20px; */
    border: none;
    position: relative;
    margin:2px;
   
}

.ControllerPanelBtn:disabled{
    color:  rgba(219, 219, 219, 0.55);    
    cursor:Default;
    opacity: 0.5;
}
.ControllerPanelBtn:disabled:hover{
    background: rgba(20, 20, 20, 0.85);    
}

.ControllerPanelBtnOpen{
    font-size: calc(1px + 2.5vmin);
    text-align: center;
    position: relative;
    height: calc(6px + 5vmin);
    padding: 5px 10px 5px 10px;
}

.iconButton{
    height: 3vmin;
    position: relative;
    width: 5vmin;
    float: none;
    top: 50%;
    left: 50%;
    transform: translate(-50% , 0%);
    background-repeat: no-repeat;
    background-size: contain;
}


.ControllerPanelBtn:hover {
    background: rgba(0, 0, 0, 0.25);
   
}




.ControllerPanelBtn:active { 
    color: skyblue;
}
.ControllerPanelBtnDisable:active { 
    color: none;
}

.ControllerPanelBtn:visited {
 
}
.ControllerPanelBtn:focus {
    outline: none;
}
.ControllerPanelBtn:target {

}

@media screen and (orientation:portrait) {
    .ControllerPanelGlobal {
        display: none;
    }
}