body {
    background: #A5A5A5;
    font-family: Arial, Helvetica, sans-serif;
}

.togglebutton {
    padding: 0px;
    border-width: 1px;
    border-color: #474d56;
    color: #474d56;
    cursor: pointer;
    position: absolute;
    font-size: 14px;
    font-weight: bold;
    background-color: #bdc1c9;}
.togglebutton:hover {background-color: #d0d0d0; border-color: #000000; color:  #000000}
.togglebutton:active {transform: translateY(2px);}
.tabbutton {
    padding: 0px;
    border-style: none;
    color: #000000;
    border-radius: 0px 0px 12px 12px;
    cursor: pointer;
    position: absolute;
    background-color: #dadce1;
    font-size: 20px;
    font-weight: bold;
}
.tabbutton:hover {background-color: #bdc1c9;}
.tabbutton:active {transform: translateY(2px);}
.blackpillbutton {
    padding: 0px;
    margin: 0px;
    border-style: solid;
    border-width:5px 40px 5px 40px;
    border-color: #474d56;
    border-radius: 24px;
    color: #ffffff;
    cursor: pointer;
    position: absolute;
    font-size: 20px;
    background-color: #474d56;
}
.blackpillbutton:hover {background-color: #000000; color: #ffffff;}
.blackpillbutton:active {transform: translateY(2px);}

/*blackpill toggle - SPD weekend and other toggles */
.pilltoggle {
    padding: 0px;
    margin: 0px;

    border-radius: 16px;
    color: #FFFFFF;
    cursor: pointer;
    position: absolute;
    font-size: 20px;
    background-color: #417ba1;
}
.pilltoggle:hover {background-color: #a6c1c5; color: #000000;}
.pilltoggle:active {transform: translateY(2px);}
.clearbutton {
    padding: 0px;
    border-style: none;
    border-radius: 18px;
    color: #474d56;
    cursor: pointer;
    position: absolute;
    font-size: 14px;
    font-weight: bold;
    background-color: #FFFFFF00;}
.clearbutton:hover {background-color: #ffffb0; }
.clearbutton:active {transform: translateY(2px);}

.blinker {
    animation: blinker 0.1s linear infinite;
}
@keyframes blinker {
    50% {
      background-color: #3a4102;
    }
  }