html {
    min-height: 100%;
    position: relative;
    font-family: Arial, Helvetica, sans-serif;
    color: #232323;
    font-size: 14px;
}

body {
    margin: 0;
    height: 100%;
}

header {
    height: 10em;
    z-index: 0;
}

footer {
    position: absolute;
    bottom: 0;
    width: 100%;
}

body:not(.g-specialPageActive),
body:not(.g-specialPageActive) footer {
    min-width: 768px;
}

body.g-specialPageActive header {
    height: 2em;
}

body.g-specialPageActive #brandLogo > img {
    width: 8em;
}

header span,
footer span {
    vertical-align: middle;
}

::-moz-selection {
    background-color: #c31924;
    color: white;
}
::selection {
    background-color: #c31924;
    color: white;
}

#brandLogo {
    margin: 0;
    padding: 0.5em 2em;
    z-index: 3;
}

    #brandLogo::before {
        background-color: white;
        margin-right: 0;
        border-style: none;
    }

    #brandLogo > img {
        width: 16em;
    }

    #brandLogo::before,
    .g-shadow {
        box-shadow: 1px 1px 8px 1px #cacaca;
    }

#navigationMenu {
    margin: 0;
}

.g-invertColor a,
a.g-invertColor,
.g-invertColor {
    background-color: #232323;
    color: white;
}

    .g-invertColor a,
    a.g-invertColor {
        text-decoration: none;
    }

.g-headerFirst,
.g-footerFirst {
    line-height: 2em;
    border-color: white;
}

.g-headerFirst {
    height: 2em;
}

.g-footerFirst {
    height: calc(2em + 2px); /* fixes Firefox's scroll bar appearance when nothing is to scroll */
}

    .g-headerFirst *:not(.k-icon):not(.fa):not(.g-hidden),
    .g-footerFirst *:not(.k-icon):not(.fa):not(.g-hidden) {
        display: inline;
        padding: 0 1em;
    }

        .g-headerFirst *:not(.k-icon):not(.fa):not(.g-originalText),
        .g-footerFirst *:not(.k-icon):not(.fa):not(.g-originalText) {
            text-transform: uppercase;
        }

    .g-headerFirst .k-icon,
    .g-footerFirst .k-icon,
    .g-headerFirst .fa,
    .g-footerFirst .fa {
        font-size: 1.25em;
    }

.g-headerSecond {
    z-index: 1;
    background-color: white;
    height: 4.5em;
}

    .g-headerFirst > *,
    .g-headerSecond > *,
    .g-footerFirst > * {
        height: 100%;
        padding: 0 1em;
    }

    .g-headerSecond .g-clickable .k-icon,
    .g-headerSecond .g-clickable .fa {
        font-size: 3em;
        position: relative;
    }

.g-clickable {
    cursor: pointer;
}

    .g-clickable:hover::before {
        background-color: rgba(35, 35, 35, 0.165);
    }

.g-invertColor .g-clickable:hover::before {
    background-color: rgba(220, 220, 220, 0.165);
}

.g-left {
    float: left;
}

.g-right {
    float: right;
}

.g-center {
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.g-skew {
    margin-left: 1em;
    margin-right: 1em;
    position: relative;
    z-index: 1;
}

    .g-skew::before {
        content: '';
        -webkit-transform: skew(-14deg);
        -moz-transform: skew(-14deg);
        -ms-transform: skew(-14deg);
        transform: skew(-14deg);
        position: absolute;
        margin-left: -1em;
        margin-right: -1em;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: -1;
        border-width: 0.1em;
        border-style: none;
    }

    .g-skew.g-left {
        left: -1em;
    }

    .g-skew.g-right {
        right: -1em;
    }

    .g-skew.g-left::before {
        border-right-style: solid;
    }

    .g-skew.g-right::before {
        border-left-style: solid;
    }

.g-fullHeight {
    height: 100%;
    line-height: inherit;
}

/* using Font Awesome instead of sprites */
.k-sprite {
    text-indent: 0;
    font-size: 1em;
    width: auto;
    height: auto;
    line-height: 1;
}



/* Font Awesome */

.k-menu .k-item > .k-link > .fa.g-leftOfText,
.fa.g-leftOfText {
    margin-right: 0.5em;
}

.k-menu .k-item > .k-link > .fa.g-rightOfText,
.fa.g-rightOfText {
    margin-left: 0.5em;
}



/* kendo Menu custom styling */

.k-menu.k-widget {
    background-color: transparent;
    border-spacing: 0;
    color: inherit;
}

.k-menu.k-widget.k-menu-horizontal {
    width: 50%;
}

.k-menu > .k-item {
    width: auto;
    text-align: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-weight: bold;
}

.k-menu .k-item.g-active {
    color: #c31924;
}

.k-menu.k-menu-horizontal > .k-item {
    padding: 0 0.5em;
}


.k-menu > .k-item > .k-link {
    height: 100%;
}

.k-menu.k-menu-horizontal > .k-item > .k-link {
    margin-left: 1em;
    margin-right: 1em;
}

.k-menu.k-menu-horizontal .k-item .k-animation-container {
    border-top: solid 4px #c31924;
    box-sizing: border-box;
}

.k-menu > .k-item:hover,
.k-menu-group .k-item.k-state-hover > .k-link {
    background-color: rgba(35, 35, 35, 0.165);
}

.k-menu:not(.k-context-menu) > .k-item.k-state-hover > .k-link,
.k-menu:not(.k-context-menu) > .k-item > .k-link.k-state-active,
.k-menu-group .k-item.k-state-hover > .k-link {
    color: inherit;
}

.k-menu .k-item > .k-link,
.k-menu-group .k-item > .k-link {
    padding-top: 1em;
    padding-bottom: 1em;
}

.k-menu.k-menu-horizontal:not(.k-context-menu) {
    padding: 0 1em;
}

.k-menu.k-menu-horizontal:not(.k-context-menu) > .k-item > .k-link {
    padding: 0;
}

.k-menu img {
    height: 48px;
    width: 48px;
}

.k-menu .k-item > .k-link > .fa {
    font-size: 2em;
    width: 1.5em;
}

.k-menu .k-menu-group img {
    height: 24px;
    width: 24px;
}

.k-menu .k-menu-group .k-item > .k-link > .fa {
    font-size: 1.5em;
}

.k-menu-group {
    padding: 0;
}



/* Tab strip*/

.k-tabstrip > .k-content {
    border: none;
}

.k-tabstrip > .k-tabstrip-items {
    margin: 0 auto 0 0;
    border: none;
    background-color: #f1f1f1;
    padding: 0.5em;
    border-radius: 0.25rem;
}

    .k-tabstrip > .k-tabstrip-items .k-item {
        border: none;
        margin: 0;
        text-transform: uppercase;
        font-weight: bold;
        color: #232323;
    }

        .k-tabstrip > .k-tabstrip-items .k-item.k-state-active,
        .k-tabstrip > .k-tabstrip-items .k-item:hover {
            color: #c31924;
            border-radius: 0.25rem;
        }

    .k-tabstrip > .k-tabstrip-items > .k-item > .k-link > .k-icon,
    .k-tabstrip > .k-tabstrip-items > .k-item > .k-link > .fa {
        margin-left: 0;
        font-size: 1.5em;
    }

.k-tabstrip label {
    cursor: inherit;
}

/* Tree view */

.k-treeview .k-item, .k-treeview .k-item:hover {
    color: #232323;
}

.k-treeview .k-item span.k-in.k-state-selected {
    border-style: none;
}

.k-treeview .k-item span.k-in {
    margin-left: 0.5em;
}

/* Category tab strip */
#categoryTabStrip > .k-tabstrip-items {
    margin: -3.5em auto 0 0;
    left: calc(20em + 38px);
    height: 3.5em;
    border: none;
    width: calc(100% - 20em - 76px);
    overflow: hidden;
    top: 0.2em;
    border-radius: 0;
    background-color: transparent;
    padding: 0;
}

#categoryTabStrip > .k-content {
    background-color: transparent;
}

#categoryTabStrip > .k-tabstrip-prev,
#categoryTabStrip > .k-tabstrip-next {
    margin-top: -3.5em;
    height: 3.5em;
    position: relative;
}

#categoryTabStrip > .k-tabstrip-prev {
    margin-left: 20em;
    left: 2px;
}

#categoryTabStrip > .k-tabstrip-next {
    left: calc(100% - 40px);
}

#categoryTabStrip > .k-tabstrip-items > .k-item {
    color: #232323;
    border: none;
    height: 100%;
    background-color: transparent;
    border-bottom-width: 0.2em;
    white-space: nowrap;
    bottom: 0.2em;
    border-radius: 0;
}

    #categoryTabStrip > .k-tabstrip-items > .k-item.k-state-active,
    #categoryTabStrip > .k-tabstrip-items > .k-item:hover {
        color: #c31924;
        border-top: none;
        border-left: none;
        border-right: none;
        border-bottom-style: solid;
        border-bottom-color: #c31924;
    }

    #categoryTabStrip > .k-tabstrip-items > .k-item > .k-link {
        height: 100%;
        padding: 0 1em;
    }

.g-categoryTab .k-tabstrip > .k-tabstrip-items {
    margin: 0.5em 0 0.5em auto;
}

.g-categoryTab .k-tabstrip > .k-content {
    padding: 0;
}



.g-linkList {
    list-style: none;
    height: 4em;
    text-align: center;
    line-height: 4em;
    margin: 0;
    padding: 0;
}

    .g-linkList > li {
        display: inline;
        margin: 1em;
        text-align: center;
        vertical-align: middle;
    }

        .g-linkList > li:last-child {
            display: none;
        }


.g-box {
    margin: 1em;
    background-color: #f1f1f1;
}



/* Right aligned elements */

.g-rightAligned {
    text-align: right;
    margin: 10px 0px;
}

    .g-rightAligned > label {
        margin-right: 5px;
    }

    .g-rightAligned .k-dropdown {
        text-align: left;
    }



/* special page */
.g-specialPage {
    margin: 5em 2em 2em 2em;
    padding: 2em;
}

    .g-specialPage > * {
        display: block;
        margin: 1em;
        text-align: center;
    }

    .g-specialPage .g-logo {
        display: block;
        text-align: center;
        font-size: 3em;
        margin: 0 0 2rem 0;
    }

.g-unsupportedBrowserInfoText:not(.g-downloadLink) {
    text-align: justify;
}

.g-appErrorStatus {
    font-size: 2em;
    font-weight: bold;
}

.g-appErrorText {
    font-size: 1.5em;
}



@media only screen and (max-width: 1529px) {
    body:not(.g-specialPageActive) {
        padding-bottom: 6.5em;
    }

    body.g-specialPageActive {
        padding-bottom: 2.5em;
    }

    #navigationMenu {
        display: none;
    }

    #footerNavigation {
        display: none;
    }

    #footerNavigationPlaceholder {
        display: none;
    }

    #copyrightText {
        display: block;
        text-align: center;
    }

    body.g-specialPageActive #footerNavigationAlternative {
        display: none;
    }
}

@media only screen and (min-width: 1530px) {
    body {
        padding-bottom: 2.5em;
    }

    #navigationBurger {
        display: none;
    }

    #footerNavigationAlternative {
        display: none;
    }
}



/* loading */
.g-loadingIndicatorContent {
    position: absolute;
    text-align: center;
    z-index: 2;
}

.g-spinner {
    color: #c31924;
    font-size: 3em;
    animation: spin 1s infinite linear;
}

.g-loadingText {
    display: block;
    font-size: 1.5em;
    margin-top: 1em;
    margin-bottom: calc(-100% - 1em);
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(359deg);
        -moz-transform: rotate(359deg);
        -ms-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

@-moz-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(359deg);
        -moz-transform: rotate(359deg);
        -ms-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(359deg);
        -moz-transform: rotate(359deg);
        -ms-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}



/* hide kendo loading masks */
#footerNavigation .k-loading-mask,
#footerNavigationAlternative .k-loading-mask {
    display: none;
}


/* language selector */

.g-languageSelector {
    list-style-type: none;
    padding-left: 1.5em;
    padding-right: 1.5em;
    margin-top: 0.75em;
    margin-bottom: 0.75em;
}

.g-languageSelector > li {
    padding: 0.75em;
}

.g-languageSelector > li > a > span{
    margin-right: 10px;
    font-size: 2em;
}

.g-languageSelector > li > a {
    display: flex;
    align-items: center;
}

.g-languageSelector > li:hover {
    background-color: rgba(35, 35, 35, 0.165);
    cursor: pointer;
}

.g-selected {
    background-color: #f1f1f1;
}