:root {
    --zhaw-dev-blue: #0064a6;
    --zhaw-dev-blue-light: #cddbe9;
    --zhaw-blue-light: #3782b4;
    --zhaw-dev-blue-disabled: #99C1DB;
    --zhaw-sub-zhaw-primary-bg: #004b7d;
    --zhaw-cool-grey: #9a9a9c;
    --zhaw-nav-hover-light: #f2f6fa;
    --zhaw-primary-bg: var(--zhaw-dev-blue);
    --zhaw-secondary-bg: var(--zhaw-blue-light);
    --orange-200: var(--zhaw-blue-light);
    --orange-300: var(--zhaw-dev-blue);
    --primary: var(--zhaw-dev-blue);
    --sidebar-color: var(--white);
    --button-color: var(--zhaw-dev-blue-light);
    --button-color-text: var(--zhaw-dev-blue);
}

/* this is the maximum width of the centered page */
.wrapper, .page {
    max-width: 1320px;
}

.header, .result-paging span, a.active .dialogTab.linkButton {
    color: var(--white);
	background-color: var(--zhaw-primary-bg);
}

.headerLogo {
    background-position: 16px center;
    background-color: transparent;
}
.header {
    background-color: var(--zhaw-dev-blue-light);
    border-color: var(--zhaw-dev-blue);
    color: var(--primary);
}
.headerBar {
    background-color: var(--zhaw-dev-blue);
    color: var(--white);
}
.WebPart-Standard {
    border-color: var(--zhaw-dev-blue);
}

.linkButton {
    background-color: transparent;
    color: var(--white);
    border-radius: 2px;
}
.linkButton:hover {
    background-color: var(--zhaw-blue-light);
    /*color: #000000;*/
    opacity: 1;
    font-weight: bold;
}
.linkButton::before {
    filter: brightness(100);
}

#userPanelContainer {
    color: var(--black-200);
}
#userPanelContainer .linkButton {
    background-color: var(--button-color);
    color: var(--button-color-text);
}
#userPanelContainer .linkButton::before {
    filter: brightness(1);
}
#userPanelContainer .linkButton:hover {
    background-color: var(--button-hover-color);
    color: var(--button-hover-color-text);
}
#userPanelContainer .linkButton:hover::before {
    filter: brightness(100);
}

.language-picker span {
    color: #fff !important;
}
.language-picker a {
    color: #fff9 !important;
}
.menuPanelNavContainer img {
    filter: brightness(1);
}
tr.navigation-parent > td.navigation-inhalt > :first-child::before,
tr.navigation-root > td.navigation-inhalt > :first-child::before {
    filter: brightness(1);
}

.WebPart-SingleColumn {
    margin: 6px;
}
td.topic-title {
    border-bottom: 1px solid var(--zhaw-dev-blue-light);
}
.linkButton, .form-button {
    height: 24px;
    line-height: 24px;
    padding: 0 12px 0 12px;
    font-weight: 100 !important;
    margin: 6px;
}
@media(min-width: 321px) and (max-width:1025px) {
    .mobileHeaderButton {
        margin: 0px;
        padding: 0px;
    }
}
.navigation-root:hover {
    background-color: var(--zhaw-nav-hover-light);
}
.navigation-parent:hover {
    background-color: var(--zhaw-nav-hover-light);
}
.navigation-inhalt {
    padding: 0 6px 0 6px;
}
.navigation-inhalt:hover {
    color: var(--zhaw-dev-blue);
}
.navigation-container td a:hover {
    color: var(--zhaw-dev-blue);
}
.navigation-container td a:active {
    color: var(--zhaw-dev-blue-disabled) !important;
    font-weight: bold;
}
/* default page */
span.titel1 {
    font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;
    font-weight: bold;
    font-size: 18px;
    color: var(--gray-600);
}

span.titel2 {
    font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;
    font-weight: bold;
    font-size: 16px;
    color: var(--gray-600);
}

span.textklein {
    font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;
    color: #000033;
    font-size: 10px;
}
.form-select-width-sjg {
    width: 200px;
}
.cst-grid-style {
    padding: 6px 6px 0px 0px;
}
/* message box */
.alert {
    padding: 20px;
    color: white;
    margin-bottom: 15px;
}

/* The close button */
.closebtn {
    margin-left: 15px;
    color: white;
    font-weight: bold;
    float: right;
    font-size: 22px;
    line-height: 20px;
    cursor: pointer;
    transition: 0.3s;
}

/* When moving the mouse over the close button */
.closebtn:hover {
    color: black;
}

.alert.alert-primary {
    background-color: #2196F3;
    border-color: #2196F3
}

.alert.alert-secondary {
    background-color: #323a45;
    border-color: #323a45
}

.alert.alert-success {
    background-color: #64DD17;
    border-color: #64DD17
}

.alert.alert-info {
    background-color: #29B6F6;
    border-color: #29B6F6
}

.alert.alert-warning {
    background-color: #ff9800;
    border-color: #ff9800
}

.alert.alert-danger {
    background-color: #ef1c1c;
    border-color: #EF5350
}