:root {
    --darkest-color: #000000;
    --lightest-color: #ffffff;
    --primary-color: #000000;
    --secondary-color: #BA941B;
    --font-family: arial;
    --font-size: 12pt;
}

a {
    cursor:pointer;
    color:var(--secondary-color);
}

a.column_link {
    color:#0052cc;
}

a.column_link:hover {
    text-decoration:underline;
}

#main {
    color:var(--primary-color);
    font-family: var(--font-family);
    font-size:var(--font-size);
}

#main div.header {
    background-color:var(--primary-color);
    color:var(--lightest-color);
    padding:.8em;
    font-size:1.5em;
    display: flex;
    border-bottom: .3em solid var(--secondary-color);
}

#main div.header div {
    flex:auto;
}

#main div.header #logo img {
    width:100px;
}

#main div.header #text {
    font-weight:bold;
    font-size:1.5em;
    width:100%;
    margin-top:.4em;
    padding-left:1em;
    margin-right:.5em;
    white-space: nowrap;
    overflow-x: hidden;
}

#main div.header #menu {
    font-size:.9em;
    margin-top:1.2em;
}

#main div.menu {
    padding:.4em;
    text-align:left;
    background-color:#ffffff;
    border-bottom:1px solid var(--darkest-color);
}

#main div.menu a {
    color:var(--darkest-color);
    padding:.5em;
    margin-right: .1em;
}
#main div.menu a:hover {
    color:var(--secondary-color);
}
#main div.menu a:last-child {
    margin-right: 0px;
}

#main div.more_menu {
    padding:0em;
    text-align:center;
    justify-content: center;
    background-color:#ffffff;
    border-bottom:1px solid var(--darkest-color);
}

#main div.more_menu a {
    color:var(--darkest-color);
    padding:.5em;
    margin-right: .1em;
}
#main div.more_menu a:hover {
    color:var(--secondary-color);
}
#main div.more_menu a:last-child {
    margin-right: 0px;
}

#main div.content {
    margin:0em 1em;
    padding:1em;
    padding-top:0;
}

#user_menu {
    position:relative;
    text-align:right;
    font-size:1em;
}

#user_menu div.drop_menu {
    position:absolute;
    border-radius:.5em;
    border-top-right-radius: 0;
    right:0;
    color:var(--primary-color);
    background-color:var(--lightest-color);
    padding:.5em;
    font-size:.9em;
    border:1px solid var(--darkest-color);
}

#user_menu div.drop_menu div {
    text-align:left;
    padding:.3em;
}

div.page_header {
    font-size:1.5em;
    font-weight:bold;
    color:var(--primary-color);
    margin-bottom: 1em;
    margin-top:.5em;
}

div.page_header div.sub_header {
    font-weight:normal;
    font-size:.7em;
    margin-left:.5em;
}

div.tabs {
    border-bottom:.2em solid var(--darkest-color);
    padding-bottom:.2em;
    margin-bottom: 1em;
}
div.tabs a {
    border:.15em solid var(--darkest-color);
    color:var(--secondary-color);
    border-bottom: 0px;
    border-top-right-radius: .5em;
    border-top-left-radius: .5em;
    padding:.5em;
    margin-right: .5em;
    white-space: nowrap;
}
div.tabs a:last-child {
    margin-right: 0px;
}
div.tabs a.current {
    color:var(--lightest-color);
    background-color:var(--secondary-color);
    font-weight:bold;
}
div.more_tabs {
    padding-bottom:.2em;
    margin-bottom: 1em;
    flex-wrap: wrap;
}
div.more_tabs a {
    border:.15em solid var(--darkest-color);
    color:var(--secondary-color);
    padding:.5em;
    margin-right: .5em;
    white-space: nowrap;
    margin-bottom:.5em;
}
div.more_tabs a.current {
    color:var(--lightest-color);
    background-color:var(--secondary-color);
    font-weight:bold;
}

button, a.subscribe {
    background-color:var(--primary-color);
    color:var(--secondary-color);
    border:2px solid var(--secondary-color);
    padding:.5em;
    border-radius: .5em;
}

button:hover {
    cursor:pointer;
    background-color:var(--secondary-color);
    color:var(--lightest-color);
    border:2px solid var(--primary-color);
}

button.secondary {
    background-color:var(--lightest-color);
    border:2px solid var(--primary-color);
    color:var(--primary-color);
}

button.secondary:hover {
    cursor:pointer;
    background-color:var(--secondary-color);
    color:var(--lightest-color);
    border:2px solid var(--primary-color);
}

form.single {
    width:100%;
    max-width: 500px;
    margin:auto;
    padding:.5em;
}
form div.form_input {
    margin-bottom:1em;
}
form div.form_input input,select,textarea {
    width:100%;
    border-radius: .5em;
    border:1px solid var(--darkest-color);
}
form div.form_input div.label {
    font-size:.9em;
    color:var(--darkest-color);
    opacity: 50%;
}
form div.errors {
    border:1px solid red;
    border-radius: .5em;
    margin-bottom:.5em;
}
form div.errors div {
    padding:.5em;
}

form div.buttons {
    padding-top:.5em;
    text-align:right;
}

div.search_frame div.form_input {
    /*margin-bottom:1em;*/
}
div.search_frame div.form_input input,select {
    width:100%;
    border-radius: .5em;
    border:1px solid var(--darkest-color);
}
div.search_frame div.form_input div.label {
    font-size:.9em;
    color:var(--darkest-color);
    opacity: 50%;
}

div.data_table_actions {
    text-align:right;
    margin-bottom:.3em;
}

div.data_table_actions a {
    padding:.5em;
    border-radius: .5em;
    background-color: var(--secondary-color);
    color: var(--lightest-color);
    border: .1em solid var(--darkest-color);
}

#display_columns_frame a {
    padding:.3em;
    font-size:.9em;
    border-radius: .5em;
    border:1px solid var(--darkest-color);
}
#display_columns_frame a.hidden_column {
    background-color:var(--lightest-color);
    color:var(--darkest-color);
}
#display_columns_frame a.visible_column {
    background-color:var(--darkest-color);
    color:var(--lightest-color);
}
table.data_table {
    width:100%;
}
table.data_table th {
    text-align:left;
    padding-right:.3em;
}
table.data_table th a.sort {
    margin-left:.2em;
    font-size:.9em;
    white-space: nowrap;
}

table.data_table tr.data_row:nth-child(even) {
    background-color:#dddddd;
}

table.data_table td {
    padding:.3em;
}

table.data_table tr.no_records td {
    text-align:center;
    background-color:#dddddd;
}

div.data_grid {
    display:flex;
    flex-wrap:wrap;
    justify-content: center;
}

div.no_records {
    padding:.5em;
    margin:1em 1em;
    text-align:center;
    background-color:#dddddd;
}

@media (max-width: 640px) {

    #main div.header {
        padding:.5em;
        font-size:1.2em;
    }

    #main div.header #text {
        text-align:left;
        margin-top:.5em;
        padding-left:.5em;
    }

    #main div.header #menu {
        font-size:1em;
        margin-top:1.1em;
    }

    div.page_header {
        margin-bottom: .5em;
        margin-top:0;
    }

    #main div.content {
        margin:0em .2em;
        padding:.1em;
    }

    /*div.tabs a {*/
    /*    border:.1em solid var(--darkest-color);*/
    /*    margin-right: .1em;*/
    /*    padding-right:.3em;*/
    /*}*/

    #main div.menu {
         text-align:center;
     }

}

@media (max-width: 450px) {
    #main div.header #text {
        margin-top:.6em;
        font-size:1.3em;
    }
}