body, html {

    background-color: #444;
    font-family: Arial, Helvetica, sans-serif
}

a, a:visited {
    color: #c8c8c8;
}


.callout, .content {

    display: flex;
    flex-direction: column;
}

.content > * {

    color: #c8c8c8;

    display: flex;
    flex-direction: row;
    
    justify-content: center;
}

.content b {
    color: white;
}

.content a img {
    width: 20vw;
}

.callout .row {
    display: flex;
    flex-direction: row;
    
    justify-content: center;
}

.callout .row > div {
    background-color: #4c4c4c;

    width: calc((25vw - 50px) / 5);
    height: calc((25vw - 50px) / 5);

    text-transform: uppercase;

    display: flex;

    align-items: center;
    justify-content: center;

    font-size: 2vw;
    font-weight: 800;
    
    margin: 0.25vw;
    
    border-radius: 1vw;
}

.callout .row.active > div.status_1 {
    background-color: #c5aa0e;
} 

.callout .row > div.status_2 {
    background: repeating-linear-gradient(
        -45deg,
      #c5aa0e,
      #c5aa0e 5px,
      #888 5px,
      #888 10px
    );
} 

.callout .row.active > div {
    background-color: #c8c8c8;
}