*{
    margin: 0;
    padding: 0;
}
body{
    font-family: Tahoma, Geneva, sans-serif;
    font-size: .8em;
}
#mapImg, #mapCanvas, #dotList div, #playerCard, #toggleSidebar{
    position: absolute;
}
/* #map{
    transform: scale(100%);
} */
.dot {
    height: 10px;
    width: 10px;
    border-radius: 50%;
    display: inline-block;
    cursor: pointer;
    box-shadow: 1px 1px 1px black;
}
#playerCard {
    background-color: white;
    text-align: center;
    /* border: 3px solid white; */
    border-radius: 1px;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
}
#sidebar, #toggleSidebar{
    position: fixed;
}
#sidebar {
    top: 30px;
    z-index: 9999;
    display: inline;
    background-color: rgba(243, 255, 174, 0.74);
    overflow: scroll;
    overflow-y: auto;
    overflow-x: hidden;
    min-width: 195px;
}
.p-head {
    color: white;
    text-shadow: 1px 1px black, 1px 1px 1px black, 1px 1px 1px black;
}
#playerCard p {
    width: auto;
    padding: 2px;
}
#sidebar .head {
    background-color: grey;
    color: white;
    padding: 5px;
    cursor: pointer;
}
#mapImg, #mapCanvas, #sidebar .head {
    user-select: none;
}
.row {
    display: flex;
    padding: 0 5px;
}
.row:hover {
    background-color: rgba(128, 128, 128, 0.274);
}
#sidebar p, input[type="radio"] {
    padding: 2px 2px;
}
.sidebarBlock {
    padding: 2px;
}
.bg {
    background-color: aliceblue;
}
input[type="text"] {
    overflow: hidden;
}
#toggleSidebar {
    margin: 3px;
    padding: 4px;
    border-radius: 1px;
    border: none;
}
#toggleSidebar:hover {
    background-color: rgb(194, 194, 194);
}
input[type="checkbox"] {
    margin-right: 5px;
}