#time {
    text-align: center;
    font-size: 11vw;
    font-family: monospace;
    font-weight: 500;
    color: black;
    margin-left: 1px;
    margin-right: 1px;
    margin-bottom: 15px;
}

#system-time {
    text-align: center;
    font-size: 10vw;
    font-family: monospace;
    font-weight: 500;
    color: black;
    margin-left: 1px;
    margin-right: 1px;
    margin-top: 5px;
}

#system-time-of-week {
    font-size: 5vw;
}

#user-time {
    text-align: center;
    font-size: 7vw;
    font-family: monospace;
    font-weight: 500;
    color: black;
    margin-left: 1px;
    margin-right: 1px;
    margin-top: 5px;
}

#user-period {
    font-size: 4vw;
    vertical-align: text-top;
    color: dimgray;
}

#select-system {
    font-size: 2.5vw;
}

#user-at {
    font-size: 5vw;
}

#globe {
    padding: 5vw;
}

path.sphere-outline {
    fill: none;
    stroke-width: 0.5;
    stroke: gray;
}

path.country {
    stroke-width: 0.5;
    stroke: darkslateblue;
    fill: skyblue;
    fill-opacity: 0.5;
}

path.country-back {
    stroke-width: 0.5;
    stroke: mediumslateblue;
    fill: lightblue;
    fill-opacity: 0.5;
}

path.hour-meridian {
    fill: none;
    stroke-width: 4;
    stroke: gray;
}

path.hour-meridian-back {
    fill: none;
    stroke-width: 4;
    stroke: lightgray;
}

path.minute-meridian {
    fill: none;
    stroke-width: 3;
    stroke: gray;
    mix-blend-mode: difference;
}

path.minute-meridian-back {
    fill: none;
    stroke-width: 3;
    stroke: lightgray;
}

path.mean-sun-meridian {
    fill: none;
    stroke-width: 14;
    stroke: darkorange;
    stroke-linecap: round;
}

path.mean-sun-meridian-back {
    fill: none;
    stroke-width: 14;
    stroke: palegoldenrod;
}

path.north-pole-circle {
    fill: darkorange;
    stroke: darkorange;
}

path.north-pole-circle-back {
    fill: palegoldenrod;
    stroke: palegoldenrod;
}

path.south-pole-circle {
    fill: darkorange;
    stroke: darkorange;
}

path.south-pole-circle-back {
    fill: palegoldenrod;
    stroke: palegoldenrod;
}

path.apparent-sun-meridian {
    fill: none;
    stroke-width: 14;
    stroke: darkorange;
    opacity: 0.2;
    stroke-linecap: round;
}

path.apparent-sun-meridian-back {
    fill: none;
    stroke-width: 14;
    stroke: palegoldenrod;
    opacity: 0.2;
}

path.user-meridian {
    fill: none;
    stroke-width: 4;
    stroke: red;
}

path.user-meridian-back {
    fill: none;
    stroke-width: 4;
    stroke: lightcoral;
}