body {
    background-color: #333;
    color: #bbb;
}

a {
    color: #bbb !important;
}

.mainnav {
    /* font-family: 'VT323', monospace; */
    font-family: 'Alumni Sans';
    font-size: 1.4em;
    font-weight: 600;
    margin-top: 1em;
    margin-bottom: 1em;
    flex-wrap: wrap;
}

.footer {
    /* font-family: 'VT323', monospace; */
    font-size: 1.2em;
    margin: 0.4em 0px;

    font-family: 'Alumni Sans';
}

.cv {
    color: #bbb;
    font-size: 1.2em;
}

.cvdesc {
    /* font-family: 'Zilla Slab', serif; */
    font-family: 'Alumni Sans';
    font-size: 1.2em;

    font-style: italic;
    line-height: 1em;
}

.employment {
    /* font-family: 'VT323', monospace; */
    /* font-size: 1em; */

    font-family: 'Alumni Sans';
    font-size: 1.2em;
}

.monofont {
    font-family: 'VT323', monospace;
}

.regloginfont {
    font-family: 'Alumni Sans';
}

.buttonfont {
    font-family: 'Alumni Sans';
    font-size: 1.2em;
    font-weight: 600;
    padding: 0px 10px;
}

.monobigger {
    font-family: 'VT323', monospace;
    font-size: 1em;
}

.langselector {
    font-family: 'Alumni Sans';
    font-size: 1em;
    font-weight: 600!important;
    text-transform: uppercase;
}

.userbutton {
    /* font-family: 'VT323', monospace; */
    font-family: 'Alumni Sans';
    font-size: 1em;
    --bs-btn-padding-y: .05rem;
    --bs-btn-padding-x: .5rem;
}

.blog {
    /* font-family: 'Noto Sans', sans-serif; */
    font-family: 'Fira Sans Condensed';
    font-size: 1.25em;
}

.blogrecord {
    margin-bottom: 2em;
    padding-bottom: 2em;
    border-bottom: 1px;
    border-left: 0px;
    border-right: 0px;
    border-top: 0px;
    border-style: solid;
    border-color: #444;
}

.tags {
    margin-bottom: 1em;
}

.tag {
    /* font-family: 'Zilla Slab', serif !important; */
    font-family: 'Alumni Sans';
    font-size: 1em;

    background-color: rgb(18, 130, 147) !important;
    font-weight: 400;
}

.employment .tag {
    font-size: 0.7em;
}

.pagetag {
    font-family: 'Alumni Sans';
    font-size: 1em;

    background-color: rgb(18, 130, 147);
    font-weight: 400;
}

pre {
    border-radius: 10px;
    padding: 1.2em 1.7em;
    background-color: #181818;
}

p code,
li code {
    color: #181818;
    background-color: #999;
    padding: 2px 5px;
    border-radius: 3px;
}

.langs {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    padding: 5px 8px;
    gap: 11px;
}

.calitemframe {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 9px 9px 9px 0;
    margin-bottom: 15px;

    background: #D9D9D9;
    border-radius: 10px;
}

.grayed {
    background: #666;
}

.datewithtagsframe {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px;
    gap: 5px;
}

.dateframe {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 3px 10px;
    margin-top: 2px;

    min-width: 70px;

    background: #B80000;
    border-radius: 8px;
}

.grayed .dateframe {
    background: #444 !important;
}

.yellow .dateframe {
    background: #C0C000;
}

.green .dateframe {
    background: #086400;
}

.datenumber {
    font-family: 'Alumni Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 60px;
    line-height: 45px;

    color: #FFFFFF;
}

.grayed .datenumber {
    color: #999;
}

.datemonth {
    font-family: 'Alumni Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 24px;

    color: #FFFFFF;
}

.grayed .datemonth {
    color: #999;
}

.dateitemtagsframe {
    display: flex;
    flex-flow: wrap;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    padding: 3px 15px 0px 15px;
    gap: 6px;
}

.dateitemtag {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 3px 7px;
    gap: 10px;

    background: #4B47FF;
    border-radius: 4px;

    font-family: 'Roboto Condensed', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 130%;

    white-space: nowrap;

    color: #FFFFFF;
}

.grayed .dateitemtag {
    background: #444;
    color: #999;
}

.calitembodyframe {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 10px;
    gap: 10px;

    background: #FFFFFF;
}

.grayed .calitembodyframe {
    background: #444;
}

.grayed .calitembodyframe a {
    color: black !important;
}

.obligations {
    font-family: 'Roboto Condensed', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 120%;

    color: #000000;
}

.obligations p {
    margin-bottom: 0;
}

.obligations a {
    color: blue !important;
}

.calform {
    font-family: 'Alumni Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 20px;

    color: #000000;
}

.calform p {
    font-family: 'Roboto Condensed', sans-serif;
    line-height: 130%;

    margin-bottom: 0;
}

.calform a {
    color: blue !important;
}

.remarks {
    font-family: 'Roboto Condensed', sans-serif;
    font-style: italic;
    font-weight: 400;
    font-size: 18px;
    line-height: 130%;

    color: #000000;
}

.remarks p {
    font-family: 'Roboto Condensed', sans-serif;
    line-height: 130%;

    margin-bottom: 0;
}

.remarks ul {
    margin-left: 0;
    margin-bottom: 0;
    padding-left: 1em;
}

.remarks li {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 400;
    font-size: 18px !important;
    line-height: 130% !important;
    
    margin-left: 0 !important;
    margin-bottom: 0 !important;
}

.remarks a {
    color: blue !important;
}



.calendaritemcheck {
    width: 1em;
    height: 1em;
    color: #000000;
}

.calendaritemcheck:checked:before {
    background-color: green;
}

.useall {
    font-family: 'Alumni Sans';
    font-size: 1.4em;
    /* margin-bottom: 1em; */
}

.vatcalcframe {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    padding: 10px;
    gap: 10px;

    background: #7E7E7E;
    color: white;
    border-radius: 10px;

    font-family: 'Alumni Sans';
    font-size: 1.4em;
}

.vatcalcframe .btn {
    font-size: 1em;
}

.vatcalcframe input {
    width: 10em;
}

.vatcalcframeresult {
    width: 6em !important;
}

/* .vatcalc .col {
    padding: 0;
} */

.vatcalcrow {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    padding: 0px;
    gap: 18px;
}

.vatcalcanddivisor {
    width: 100%;
    text-align: center;
    text-transform: uppercase;
}

.vatcalcordivisor {
    width: 100%;
    text-align: center;
    padding: 0;
    margin: 0;
    line-height: 50%;
    text-transform: uppercase;
}

.buttonrow {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding: 5px 0px;
    gap: 10px;
}

.articleframe {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 9px;

    margin-bottom: 1em;

    width: 100%;
    /* height: 346px; */
    /* left: 189px; */
    /* top: 1521px; */

    background: #D9D9D9;
    border-radius: 10px;
}

.articlebody {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 10px;
    gap: 10px;

    width: 100%;
    /* height: 206px; */

    background: #FFFFFF;
    border-radius: 5px;

    /* Inside auto layout */

    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.articletagsframe {
    /* Auto layout */

    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: center;
    padding: 0px;
    gap: 6px;

    /* Inside auto layout */

    flex: none;
    order: 0;
    flex-grow: 0;
}

.articletagsframe a {
    text-decoration: none !important;
}

.articleheader {
    /* Header */

    font-family: 'Roboto Condensed', sans-serif;
    font-style: italic;
    font-weight: 700;
    font-size: 20px;
    line-height: 20px;
    /* identical to box height, or 83% */

    color: #000000 !important;

    /* Inside auto layout */

    flex: none;
    flex-grow: 0;

    /* text-decoration: none !important; */
}

.articlebodytext {
    /* Body text */

    font-family: 'Roboto Condensed', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 130%;
    /* or 91% */

    color: #000000;

    /* Inside auto layout */

    flex: none;
    align-self: stretch;
    flex-grow: 0;
}

.articlebodytext code {
    color: white;
    border-radius: 3px;
}

.articlebodytext p code, .articlebodytext li code {
    font-size: 0.6em;
    color: #181818;
    background-color: #c8c8c8;
    padding: 2px 5px;
    border-radius: 3px;
}

.articlebodytext p {
    margin-bottom: 0.5rem;
}

.articlebodytext pre {
    border-radius: 8px;
    font-size: 0.6em;
    padding: 0.6em 0.8em;
    background-color: #373737;
}

.articlefooter {
    font-family: 'Alumni Sans';
    font-style: italic;
    font-weight: 400;
    font-size: 22px;

    width: 100%;

    text-align: right;

    color: #000000;
}

.articlefooter a, .articlebodytext a {
    color: blue !important;
}

.articlefooter p {
    margin-bottom: 0;
    line-height: 100%;
}

.outerDiv {
    background-color: #006699;
    /* color: #fff; */
    /* height: 400px; */
    width: 100%;
    /* margin: 0px auto; */
    /* padding: 5px; */
}

.leftDiv {
    background-color: #efefef;
    color: #000;
    float: left;

    flex-wrap: wrap;

    display: flex;
    white-space: nowrap;

    align-items: center;
}

.rightDiv {
    background-color: #efefef;
    color: #000;
    float: right;

    flex-wrap: wrap;

    display: flex;
    white-space: nowrap;

    align-items: center;
}

.filterMain00 {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: center;
    font-family: 'Roboto Condensed', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
}

.filterMain {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    /* width: 100%; */
    /* align-items: center; */
    /* margin-bottom: 0.3em; */
}

.filterContainer {
    display: flex;
    flex-direction: column;
    text-align: left;
    width: min-content;
    margin: 0.3em;
    padding: 0.2em 0.5em;
    background-color: black;
    border-radius: 10px;
}

.filterRow {
    width: min-content;
    display: flex;
    flex-direction: row;
    align-items: center;
    white-space: nowrap;
}

.filterPadding {
    padding-left: 1.3em;
}

.filterRowCaption {
    margin-left: 0.3em;
    white-space: nowrap;
}