.sidebar-button {
    display: block;             /* Makes them stack vertically */
    width: 140px;               /* Fixed width for a uniform sidebar look */
    margin: 5px auto;           /* Centers the button in the sidebar */
    padding: 3px 5px;
    background-color: #c0c0c0;  /* Standard "Grey" UI color */
    
    color: #000000 !important;  /* Black text */
    text-decoration: none;      /* Removes the blue underline */
    font-family: Arial, sans-serif;
    font-size: 9pt;
    font-weight: bold;
    text-align: center;

    padding: 3px 10px;
    border: 4px outset #ffffff; 
}

.sidebar-button:active {
    border: 4px inset #ffffff;
    padding: 4px 9px 2px 11px;
}

.sidebar-button:hover {
    background-color: #d0d0d0;
    color: #000080 !important;  /* Changes text to Navy Blue */
}

.goblin-container {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.goblin-bubble {
    display: none; /* Hidden by default */
    position: absolute;
    top: -20px;    /* Positions it above the head */
    left: 70px;    /* Positions it to the right */
    background-color: #ffffcc; /* Classic post-it note yellow */
    border: 1px solid #000;
    padding: 5px 10px;
    font-family: "Courier New", Courier, monospace;
    font-size: 10pt;
    font-weight: bold;
    color: #000;
    white-space: nowrap;
    z-index: 100;
    box-shadow: 3px 3px 0px rgba(0,0,0,0.2);
}