/* Custom CSS */

.centered
{
    display: grid;
    justify-self: center;
    justify-content: center;
    text-align: center;
}

.centered h1, .centered h2, .centered h3, .centered h4, .centered p, .centered a
{
    justify-self: center;
}


ul li::marker {
    color: #554188;
}

.frame {
    background-color: white;
    padding: 10px;
    border: 8px ridge #554188;
}

.title {
    font-size: 1.3em;
    font-weight: 400;
    color: #554188;
}


roof .workspace .element {
    align-self: center;
    justify-self: center;
}

.roof .workspace .element .element h1,
.roof .workspace .element .element h3,
.roof .workspace .element .element h4,
.roof .workspace .element .element p {
    justify-self: center;
    text-align: center;
}

@media(max-width: 768px) {
    .roof .workspace .element {
        align-self: left;
        justify-self: left;
    }

    .roof .workspace .element .element h1,
    .roof .workspace .element .element h3,
    .roof .workspace .element .element h4,
    .roof .workspace .element .element p {
        justify-self: left;
        text-align: left;
    }
}