/*
decent heading fonts:
Avenir Next Condensed
Charter

decent body fonts:
Seravek
Lucida Grande
Helvetica Neue
*/

.section-theme {
}

.section-theme h1 {
    font-family: "Avenir Next Condensed", Helvetica, Verdana, sans-serif;
    /*font-family: "Avenir Next Condensed", "Lucida Grande", Verdana, Helvetica, sans-serif;*/
    /*font-family: "Charter", "Lucida Grande", "Verdana", "Helvetica", "sans-serif";*/
    font-weight: bold;
}

.section-theme h2 {
    font-family: "Avenir Next Condensed", Helvetica, Verdana, sans-serif;
}

.section-theme h3 {
    font-family: "Avenir Next Condensed", Helvetica, Verdana, sans-serif;
}

.section-theme p {
    font-family: /*"Seravek", *//*"Avenir Next Condensed", "Helvetica Neue",*/ Helvetica, Verdana, sans-serif;
    /*font-weight: lighter;*/
}

.status-note {
    font-size: 80%;
    background: var(--theme-background-color-tinted);
}

.center-section {
    position:       relative;
    margin-left:    auto;
    margin-right:   auto;
}

.center {
    text-align: center;
}

.screenshot {
    height: auto;
    max-width: 100%;
    /*text-align: center;*/
    /*transform: scale(0.5);*/
}

.image-caption {
    text-align: center;
    font-size: 90%;
    font-style: italic;
}

.left-table-col {
    border-spacing: 8px;
    padding:        8px;
    width:          50%;
    vertical-align: top;
    background:     var(--theme-box-gradient);
    border-radius:  8px;
}

.right-table-col {
    border-spacing: 8px;
    padding:        8px;
    width:          50%;
    vertical-align: top;
    background:     var(--theme-box-gradient);
    border-radius:  8px;
}

.shaded-box {
    padding:        8px;
    margin-bottom:  8px;
    vertical-align: top;
    background:     var(--theme-box-gradient);
    border-radius:  8px;
}

.left-col {
    width:          48%;
    float:          left;
    margin-right:   16px;
}

.right-col {
    width:          48%;
    float:          right;
    margin-left:    16px;
}

h1 {
    text-align: center;
}

.box-badge {
    font-size: 50%;
    background:     linear-gradient(to bottom, #c0a000 0%, #ffd800 100%);
    padding: 2px;
    color: #FFFFFF;
}

h3 .box-badge {
    font-size: 70%;
}

p .box-badge {
    font-size: 90%;
}