#btnContainer{
    user-select: none;
}

#plate{
    position: relative;
    top: 0px;
    left: 0px;
    width: 822px;
    height: 510px;
    z-index: 0;
}
/* Channel knob */
.channelcoarseContainer{
    position: absolute;
    top: 580px;
    left: 60px; 
    width: 280px;
    height: 280px;
    }
#channelcoarseShade{
    position: absolute;
    width: 280px;
    height: 280px;
    z-index: 2;
    pointer-events: none;
    }
#channelcoarseTexture{
    position: absolute;
    width: 280px;
    height: 280px;
    z-index: 1;
    user-select: none;
    }


/* Decode switch */
.decodedisplayContainer{
    position: absolute;
    top: 620px;
    left: 320px;
    width: 130px;
    height: 130px;
}

#decodedisplayTexture{
    /*transform: rotate(-30deg);*/
    transform: rotate(0deg);
    position: absolute;
    width: 130px;
    height: 130px;
    z-index: 2;
    user-select: none;   
}
#decodedisplayShade{
    position: absolute;
    width: 130px;
    height: 130px;
    z-index: 1;
}

/* Channel fine tune? */
.channelfineContainer{
    position: absolute;
    top: 780px;
    left: 10px; 

    /*top: 440px;
    left: 560px; */
    width: 100px;
    height: 100px;
}
#channelfineShade{
    position: absolute;
    width: 100px;
    height: 100px;
    z-index: 4;
    pointer-events: none;
}
#channelfineTexture{
    position: absolute;
    width: 100px;
    height: 100px;
    z-index: 3;
    user-select: none;    
}
/* WPM */
.wpmContainer{
    position: absolute;
    top: 790px;
    left: 292px;
    width: 100px;
    height: 100px;
}
#wpmShade{
    position: absolute;
    width: 100px;
    height: 100px;
    z-index: 4;
    pointer-events: none;
}
#wpmTexture{
    position: absolute;
    width: 100px;
    height: 100px;
    z-index: 3;
    user-select: none;    
}

/* BFO */
.bfoContainer{
    position: absolute;
    top: 790px;
    left: 415px;
    width: 100px;
    height: 100px;
}
#bfoShade{
    position: absolute;
    width: 100px;
    height: 100px;
    z-index: 4;
    pointer-events: none;
}
#bfoTexture{
    position: absolute;
    width: 100px;
    height: 100px;
    z-index: 3;
    user-select: none;    
}

/* AFG */
.afgContainer{
    position: absolute;
    top: 790px;
    left:540px;
    width: 100px;
    height: 100px;
}

#afgShade{
    position: absolute;
    width: 100px;
    height: 100px;
    z-index: 4;
    pointer-events: none;
}

#afgTexture{
    position: absolute;
    width: 100px;
    height: 100px;
    z-index: 3;
    user-select: none;    
}

#pointerBox{
    width: 80px;
    height: 30px;
    position: absolute;
    /*padding: 8px 12px;*/
    background-color: #fff;
    /*border-radius: 4px;*/
    font-family: sans-serif;
    font-size: 14px;
    pointer-events: none;
    transform: translate(15px, 15px);
    transition: transform 0.1s ease-out;
    z-index: 0;
}
/* Morse Key */
.morsekeyContainer{
    position: absolute;
    top: 650px;
    left:715px;
    width: 40px;
    height: 70px;
}
textarea{
    vertical-align: middle;
    background-color: black;
    color: #FFFF;
}
input, label {
    display:block;
}
.img {
    background-image:url("{% static 'spyradioweb/img/Paraset.png' %}");
    width: 830px;
    height: 320px;
    padding: 0px;
    margin: 0px;
}
.img-none {
    width: 830px;
    height: 320px;
    padding: 0px;
    margin: 0px;
}
.topbar-group-style {
    margin: 0 auto;
    background-color: white; 
    color: black; 
    border: 2px solid grey; 
    float: left;
}