@font-face {
            font-family: "Fallbacks";
            src: local("MS UI Gothic"), url("/fonts/MS-UIGothic.ttf") format("truetype");
            font-weight: normal;
            font-style: normal;
        }
        body {
            background: none transparent;
            margin: 0;
            overflow: hidden;
            font-family: "Fallbacks";
            font-size: 16px;
            padding: 5px;
        }
        #moon-box {
            color: white;
            text-align: center;
        }
        #moon {
            width: 48px;
            image-rendering: pixelated;
        }
        .yellow {
            color: #8b11e0
        }
        #compass {
            display: inline;
            margin-left: 5px;
        }
        .moon-symbol {
            position: absolute;
            cursor: pointer;
        }
        #widget-by {
            margin-top: 5px;
            display: block;
            font-size:12px;
            color:#8b11e0;
            text-decoration: none;
        }
        #widget-by:hover {
            text-decoration: underline;
        }