html
{
    background-color: rgb(32, 32, 32);
}

body
{
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    margin-top: 50px;
}

h2
{
    color: rgb(33, 122, 220);
}

p
{
    color: lightgreen;
    font-size: 100%;
    font-weight: normal;
}

button
{
    background-color: saddlebrown;
    color: lightgray;
}

a
{
    font-size: 90%;
    font-weight: lighter;
    color: cyan;
    text-decoration: none;
    cursor: pointer;
}

.bottom_container
{
    position: absolute;
    bottom: 20px;      					/* margin from bottom */
    left: 50%;         					/* move left edge to center */
    transform: translateX(-50%);		/* center the element */
}

/*
    paragraph is centered on page, but left aligned and wrapped
    according width of 34 charactters
*/
.protection_prgrph
{
    text-align: left;
    width: 34ch;
    margin-inline: auto;				/* Centers horizontally on modern browsers */
    line-height: 1.6;					/* 1.5 to 1.6 is optimal for reading 65ch lines */
    padding-left: 10px;
}

.prtctn_usr_prgrph
{
    font-size: 90%;
    font-weight: lighter;
    color: cyan;
}

.playaround_prgrph
{
    font-size: 80%;
    font-weight: lighter;
    color: darkgray;                  /* weird: darkgray is between gray and */
    margin-bottom: 10px;
}