.basePanelWid{
    width:40%;
}

.scoreboard{
    width:40%;
    height:100%;
    background-color:#444;
    animation:scBoard 1s;
}
.scoreboardClose{
    width:0;
    height:100%;
    opacity:0;

}
@keyframes scClose{
    from{
        width:40%;
        opacity:1;
    }
    to{
        width:0;
        opacity:0;
    }
}
@keyframes scBoard{
    from{
        width:0;
        opacity:0;
    }
    to{
        width:40%;
        opacity:1;
    }
}

.commentboard{
    width:40%;
    height:100%;
    background-color:#222;
    animation:cBoard 1s;
}
.commentboardClose{
    width:0;
    height:100%;
    opacity:0;
    animation: cClose .3s;
    display: none;
}
@keyframes cClose{
    from{
        width:40%;
        opacity:1;
    }
    to{
        width:0;
        opacity:0;
    }
}
@keyframes cBoard{
    from{
        width:0;
        opacity:0;
    }
    to{
        width:40%;
        opacity:1;
    }
}

.hoverTool{
    transform:translate(-20vw,0);
    transition: .5s;
}
.hovClose{

    transform:translate(0vw,0);
    top:0;
    transition: .5s;
}

.comBottonsnew{
    background-color:#111;
}
.comBottonsnew:hover{
    background-color:#333;
    transition:.3s;
}
.textAreaCom{
    width: 99%;
    height: 100%;
}

.saveBotN{
    background-color:#888;
    color:ghostwhite;
}
.saveBotN:hover{
    background-color:#333;
    color:deepskyblue;
    transition:.3s;
}