.content-paragraph,
.sub-content-paragraph {
    display: none;
}

.content-paragraph.active,
.sub-content-paragraph.active {
    display: block;
}

.image-block {
    margin: 1rem 0;
}

.image-block img {
    width: 100%;
}

.image-block .caption {
    color: rgb(51,51,153);
    text-align: center;
    font-style: italic;
    margin: 0.5rem 0;
}

.caption {
    color: rgb(51,51,153);
    text-align: center;
    font-style: italic;
    margin: 0.5rem 0;
}

.navbar {
    margin: 1rem 0;
}

.navbar button {
    font-size: 1rem;
    border: 2px solid #999;
    cursor: pointer;
    padding: 0.3rem 0.6rem;
    background: none;
}

.navbar button:hover {
    background-color: rgba(0,0,0,0.05);
}

.navbar button.active {
    background-color: #fff;
    box-shadow: 0 0 0 3px rgba(0,0,0,0.1);
}

.code-block {
    background: #f5f5f5;
    padding: 1rem;
    overflow-x: auto;
}

table {
    width: 100%;
    border-collapse: collapse;
    margin: 1rem 0;
}

table td,
table th {
    border: 2px solid #999;
    padding: 10px;
    text-align: left;
}

table code {
    font-family: monospace;
    white-space: pre;
}