﻿body {
    margin: 0;
    border: 0;
    padding: 70px 0 10px 0;
    font-family: Arial;
    font-size: 95%;
    background-color: #ebebeb;
}

    body.noTemplate {
        padding: 0;
        margin: 0;
    }

    body div.pageFooter {
        font-size: 0.9em;
        padding: 20px 5px;
    }

    body.mobile {
        font-size: 85%;
        padding: 0 0 10px 0;
    }

        body.mobile .page {
            background-color: #fafafa;
            padding: 0 0 15px 0;
            min-height: 200px;
            height: auto;
        }

    body.desktop .page {
        background-color: #fafafa;
        padding: 0 0 15px 0;
        min-height: 500px;
        height: auto;
    }

div:not(.c) {
    width: 100%;
}

div.hover:hover {
    background-color: #ebebeb;
}

div.hover.selected {
    background-color: #ebebeb;
}

textarea {
    font-family: Arial;
}

a {
    color: #000000;
    text-decoration: none;
}

body.desktop a:hover {
    text-decoration: underline;
    letter-spacing: 1px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
}

body.desktop .t.withHeaders .c a:hover {
    letter-spacing: 0;
    transition: none;
    -webkit-transition: none;
}

a img {
    vertical-align: middle;
}

p {
    padding: 2px 10px 2px 0;
    margin: 0;
}

span {
    display: inline-block;
}

button, div, span, p, input, select, textarea {
    box-sizing: border-box;
}

    input[type=file] {
        display: none;
    }

    input[type=text], select, textarea {
        width: 100%;
        text-align: left;
    }

        input[disabled], select[disabled], textarea[disabled] {
            color: gray;
            background-color: #ebebeb;
        }

    input[type=checkbox] {
        margin-left: 0px;
        margin-right: 20px;
        zoom: 1.5;
    }

    input::-ms-clear {
        display: none;
    }

img[onclick] {
    cursor: pointer;
    padding-left: 2px;
    padding-right: 2px;
}

img.toggle {
    height: 16px;
    padding-left: 10px;
    padding-right: 10px;
}

a.toggle {
    font-size: 0.8em;
    font-weight: normal;
    padding-left: 20px;
    padding-right: 20px;
}

span.toggleStatus {
    font-size: 0.8em;
    font-weight: normal;
}

    span.toggleStatus img {
        height: 16px;
        padding-left: 10px;
        padding-right: 10px;
    }

.toggleClickable {
    cursor: pointer;
}

div.starWarsContainer {
    display: flex;
    position: relative;
    height: 800px;
    color: #520125;
    font-family: 'Pathway Gothic One', sans-serif;
    font-size: 500%;
    font-weight: 600;
    letter-spacing: 15px;
    line-height: 100%;
    perspective: 300px;
    text-align: center;
    overflow: hidden;
}

    div.starWarsContainer div.starWarsContent {
        position: relative;
        transform-origin: 50% 100%;
        animation: starWars 240s linear;
    }

        div.starWarsContainer div.starWarsContent p {
            padding-top: 90px;
        }

@keyframes starWars {
    0% {
        top: 100px;
        transform: rotateX(15deg) translateZ(0);
    }

    100% {
        top: -30000px;
        transform: rotateX(15deg) translateZ(-8000px);
    }
}

div.logVisible {
}

    div.logVisible div.logVisibleExpanded {
        padding: 3px 3px 3px 20px;
        border: black 1px dotted;
        background-color: #ebebeb;
    }

    div.logVisible div.logItem {
        padding-top: 10px;
    }

        div.logVisible div.logItem span.logVisibleCreated {
            font-size: 0.85em;
            padding: 1px 5px 5px 0;
            color: #006400;
        }

        div.logVisible div.logItem div.comment {
            font-weight: normal;
            font-style: italic;
            color: #006400;
            padding: 3px 5px 3px 5px;
        }

.r {
    display: table-row;
}

.c {
    display: table-cell;
    vertical-align: top;
}

#alwaysTop {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 90;
    padding: 5px 10px 5px 10px;
    background-color: #ebebeb;
}

    #alwaysTop .c.c1 {
        vertical-align: middle;
        padding-right: 10px;
    }

    #alwaysTop .c.c2 {
        vertical-align: middle;
        padding-right: 10px;
    }

    #alwaysTop .c.c3 {
        width: 100%;
        vertical-align: middle;
    }

    #alwaysTop .c.c4 {
        padding-left: 10px;
        vertical-align: bottom;
    }

body.mobile #alwaysTop {
    position: relative;
}

    body.mobile #alwaysTop .c.c1 {
        width: 0%;
        margin-right: 0;
    }

#logo {
    text-align: center;
}

    #logo a img {
        height: 50px;
        cursor: pointer;
    }

#title {
    font-size: 1.1em;
    color: #520125;
    margin-right: 10px;
}

    #title a {
        color: #520125;
    }


    #title.small {
        font-size: 0.9em;
    }

body.desktop #title {
    white-space: nowrap;
}

#search {
    white-space: nowrap;
    position: relative;
    width: 143px;
    vertical-align: bottom;
}

.desktop #search {
    width: 200px;
}

#searchInput {
    font-size: 1.1em;
}

#user {
    white-space: nowrap;
    text-align: right;
    vertical-align: top;
    color: #520125;
}

#userName {
    vertical-align: top;
    font-size: 0.9em;
}

#userCounterRed {
    background-color: red;
    color: /*cWhite*/ #ffffff;
    border-radius: 50%;
    height: 25px;
    width: 25px;
    position: absolute;
    top: 0;
    left: -10px;
    z-index: 5;
    text-align: center;
    padding-top: 5px;
    font-size: 0.9em;
    font-weight: bold;
    cursor: pointer;
}

#userCounterZero {
    background-color: darkgreen;
    color: /*cWhite*/ #ffffff;
    border-radius: 50%;
    height: 25px;
    width: 25px;
    position: absolute;
    top: 0;
    left: -10px;
    z-index: 5;
    text-align: center;
    padding-top: 5px;
    font-size: 0.9em;
    font-weight: bold;
    cursor: pointer;
}

.t {
    display: table;
}

    .t.fixed {
        table-layout: fixed;
    }

        .t.fixed .r .c {
            overflow-x: hidden;
            overflow-y: hidden;
        }

            .t.fixed .r .c.rowActions {
                text-align: right;
                padding: 0 5px 0 0;
                white-space: nowrap;
            }

                .t.fixed .r .c.rowActions input[type=checkbox] {
                    margin: 0 0 0 3px;
                    vertical-align: middle;
                }

    .t.withHeaders .r.header .c.header {
        font-size: 1.1em;
        background-color: #940a6f;
        color: #ffffff;
        border-width: 1px;
        border-style: solid;
        border-color: #690243;
        padding: 3px 5px 2px 5px;
        vertical-align: middle;
        position: relative;
    }

    .t.withHeaders .c {
        padding: 4px 5px 2px 0;
        vertical-align: top;
    }

    .t.withHeaders .r.finalAggregates .c {
        font-size: 1.1em;
        background-color: #940a6f;
        color: #ffffff;
        border-width: 1px;
        border-style: solid;
        border-color: #690243;
        padding: 3px 5px 2px 5px;
        vertical-align: middle;
        position: relative;
    }

    .t.children .c {
        padding-top: 3px;
        padding-bottom: 0;
    }

    .t .c.headerLeft {
        font-size: 1.2em;
        background-color: #940a6f;
        color: #ffffff;
        border-width: 1px;
        border-style: solid;
        border-color: #690243;
        padding: 2px 5px 2px 5px;
        vertical-align: top;
    }

    .t.fixed .r.groupHeader .c {
        vertical-align: bottom;
        padding: 10px 5px 2px 15px;
        color: #520125;
        font-weight: bold;
    }

    .t.fixed .r.groupHeader.level-1 .c {
        font-size: 1.2em;
    }

    .t.fixed .r.groupHeader.level0 .c {
        font-size: 1.2em;
    }

    .t.fixed .r.groupHeader.level1 .c {
        font-size: 1.0em;
    }

    .t.fixed .r.groupHeader.level2 .c {
        font-size: 0.8em;
    }

    .t.fixed .r.groupHeader.level3 .c {
        font-size: 0.7em;
    }

    .t.fixed .r.groupHeaderOneCellNoAggregates .c {
        overflow: visible;
        white-space: nowrap;
    }

.category {
    vertical-align: bottom;
    padding: 10px 10px 2px 10px;
    margin: 5px 0 0 0;
    color: #520125;
    font-weight: bold;
    font-size: 1.2em;
    white-space: nowrap;
    white-space: nowrap;
}

table {
    width: 100%;
    border-spacing: 0;
}

button {
    border-width: 1px;
    border-style: solid;
    vertical-align: middle;
}

    button span.forImg {
        width: 23px;
        vertical-align: bottom;
    }

        button span.forImg img {
            height: 20px;
            width: 20px;
            vertical-align: bottom;
        }

    button span.forUnicode {
        width: 23px;
        font-size: 1.3em;
    }

    button.c {
        width: 100%;
    }

body.desktop button:hover {
    letter-spacing: 1px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
}

body.desktop t.withHeaders button:hover, body.desktop .actions button:hover {
    letter-spacing: 0;
    transition: none;
    -webkit-transition: none;
}

button.link {
    color: #000000;
    background-color: none;
    border-color: none;
    border: none;
    background: none;
    display: inline;
    font: inherit;
    padding: 0 20px 0 0;
    outline: none;
    cursor: pointer;
    white-space: nowrap;
}

    button.link:hover, button.link:active, button.link:focus {
        text-decoration: underline;
    }

    button.link[disabled] {
        color: /*cGrey5Dark*/ #555555;
        cursor: not-allowed;
        pointer-events: none;
        text-decoration: none;
    }

button.normal {
    color: #0077cc;
    background-color: #ffffff;
    border-color: #eaf4fb;
    padding: 3px 10px;
    cursor: pointer;
    border-radius: 3px;
    white-space: nowrap;
    height: 30px;
}

    button.normal:hover, button.normal:active, button.normal:focus {
        background-color: #ebebeb;
        border-color: #a6bac9;
    }

    button.normal[disabled] {
        color: /*cGrey4Darker*/ #bbbbbb;
        background: #ebebeb;
        border-color: /*cGrey3*/ #cccccc;
        cursor: not-allowed;
        pointer-events: none;
    }

button.primary {
    color: #ffffff;
    background-color: #0095ff;
    border-color: #005599;
    padding: 3px 10px;
    cursor: pointer;
    border-radius: 3px;
    white-space: nowrap;
    box-shadow: inset 0px 1px 0px #33aaff;
    height: 30px;
}

    button.primary:hover, button.primary:active, button.primary:focus {
        background-color: #0077cc;
        border-color: #428bca;
        transition: color .1s ease-in-out,background-color .1s ease-in-out,border-color .1s ease-in-out,box-shadow .1s ease-in-out;
        -webkit-transition: color .1s ease-in-out,background-color .1s ease-in-out,border-color .1s ease-in-out,box-shadow .1s ease-in-out;
    }

    button.primary[disabled] {
        color: /*cGrey4Darker*/ #bbbbbb;
        background: #ebebeb;
        border-color: /*cGrey3*/ #cccccc;
        cursor: not-allowed;
        pointer-events: none;
        box-shadow: none;
    }

button.critical {
    color: #ffffff;
    background-color: #ffa06a;
    border-color: #ff7323;
    font-weight: bold;
    padding: 3px 10px;
    cursor: pointer;
    border-radius: 3px;
    white-space: nowrap;
    box-shadow: inset 0px 1px 0px #fcc4a3;
    height: 30px;
}

    button.critical:hover, button.critical:active, button.critical:focus {
        background-color: #ff7323;
        border-color: #ff5d00;
        transition: color .1s ease-in-out,background-color .1s ease-in-out,border-color .1s ease-in-out,box-shadow .1s ease-in-out;
        -webkit-transition: color .1s ease-in-out,background-color .1s ease-in-out,border-color .1s ease-in-out,box-shadow .1s ease-in-out;
    }

    button.critical[disabled] {
        color: /*cGrey4Darker*/ #bbbbbb;
        background: #ebebeb;
        border-color: /*cGrey3*/ #cccccc;
        cursor: not-allowed;
        pointer-events: none;
        box-shadow: none;
    }

img.userBig {
    border-radius: 50%;
    height: 50px;
    width: 50px;
    vertical-align: top;
    color: none;
    background-color: none;
    padding: 0;
}

    img.userBig.normal {
        border: 2px solid #ebebeb;
    }

        img.userBig.normal:hover {
            border: 2px solid /*cGrey4Darker*/ #bbbbbb;
        }

    img.userBig.critical {
        border: 3px solid #ff7323;
    }

        img.userBig.critical:hover {
            border: 3px solid #ff5d00;
        }

img.userSmall {
    border-radius: 50%;
    height: 25px;
    width: 25px;
    vertical-align: top;
    border: 2px solid #ebebeb;
    color: none;
    background-color: none;
    padding: 0;
}

    img.userSmall:hover {
        border: 2px solid /*cGrey4Darker*/ #bbbbbb;
    }

span.summary {
    vertical-align: middle;
}

img.logoVeryBig {
    height: 100px;
    margin-right: 2px;
}

img.logoBig {
    height: 50px;
    margin-right: 2px;
}

img.logoMedium {
    height: 30px;
    margin-right: 2px;
}

img.logoSmall {
    height: 20px;
    width: 20px;
    vertical-align: top;
    padding-right: 7px;
}

img.logoVerySmall {
    height: 15px;
    width: 15px;
    vertical-align: top;
    padding-right: 7px;
}

.logoSmallEmpty {
    width: 27px;
}

.fileDrop.ready {
    border: dashed 3px;
    border-radius: 5px;
    background-color: #ffa06a;
    border-color: #ff7323;
    padding: 3px;
}

#menu {
    margin: 3px 10px 3px 0;
    white-space: nowrap;
}

    #menu button {
        font-size: 1em;
        margin: 0 1px 0 1px;
        padding: 4px 12px;
    }

#submenu {
    background-color: #fafafa;
    margin: 2px;
    padding: 1px;
}

    #submenu button {
        font-size: 1em;
        margin: 1px;
        padding: 4px 12px;
    }

span.buttonDropdownContainer {
    position: relative;
}

div.buttonDropdownContent {
    display: none;
    position: fixed;
    width: auto;
    background-color: #ebebeb;
    box-shadow: 0 2px 8px 0 /*cGrey3*/ #cccccc;
    z-index: 110;
}

    div.buttonDropdownContent .t .r button.c {
        padding: 4px 14px;
        text-align: left;
        min-width: 200px;
        z-index: 110;
        letter-spacing: 0px;
        transition: none;
        -webkit-transition: none;
    }

    div.buttonDropdownContent .t .r .c.break {
        padding: 0;
        height: 1px;
        background-color: #0077cc;
        z-index: 110;
    }

.h1 {
    font-weight: bold;
    font-size: 1.2em;
    padding: 20px 10px 2px 10px;
    border-bottom: solid 4px #ff7323;
}

.h2 {
    font-weight: bold;
    font-size: 1.1em;
    padding: 15px 10px 2px 10px;
    border-bottom: solid 1px #0095ff;
}

.h3 {
    font-size: 1em;
    font-weight: bold;
    padding: 12px 10px 2px 8px;
}

.h4 {
    font-size: 1em;
    font-weight: normal;
    padding: 10px 10px 2px 5px;
}

.pageToolbar {
    white-space: nowrap;
    text-align: center;
    vertical-align: bottom !important;
}

div.pageZone {
    float: left;
    margin-top: 25px;
}

body.desktop div.pageZone + div.pageZone {
    padding-left: 10px;
}

div.pageZoneTitle {
    color: #0095ff;
    font-weight: 400;
    text-align: right;
    padding-right: 10px;
    font-family: 'Bookman Old Style';
}

div.pageZone.design {
    border: 1px dashed #0095ff;
}

div.wp + div.wp {
    margin-top: 25px;
}

.wpToolbar {
    white-space: nowrap;
    text-align: right;
    padding-right: 30px;
    vertical-align: bottom !important;
}

span.Sortable {
    cursor: pointer;
    background-image: url("/?static=Sortable.png");
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
    height: 14px;
    width: 14px;
    right: 5px;
    bottom: 1px;
    position: absolute;
}

span.SortUp {
    cursor: pointer;
    background-image: url("/?static=MoveUp.png");
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
    height: 14px;
    width: 14px;
    right: 5px;
    bottom: 1px;
    position: absolute;
}

span.SortDown {
    cursor: pointer;
    background-image: url("/?static=MoveDown.png");
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
    height: 14px;
    width: 14px;
    right: 5px;
    bottom: 1px;
    position: absolute;
}

div.filterContainer {
    width: 170px;
    margin: 0 0 1px 10px;
    position: relative;
}

    div.filterContainer input {
        color: #520125;
    }

span.filtered {
    color: #520125;
    font-weight: bold;
}

.filteredColor {
    color: #520125;
}

div.selectionContainer {
    padding-left: 170px;
}

.selectionContainer .selectionItems {
}

    .selectionContainer .selectionItems span.selectionItem {
        cursor: pointer;
        padding: 0 10px;
    }

.selectionContainer .selectionActions {
}

    .selectionContainer .selectionActions button {
        margin: 2px 10px 2px 2px;
        padding: 4px 14px;
        font-size: 1.2em;
        border-width: 2px;
        border-style: solid;
    }

.t.graph .r.header .c {
    text-align: center;
}

.c.graph {
    border-right: dashed 3px grey;
    height: 50px;
}

.actions {
    padding: 0 5px 5px 5px;
}

    .actions .buttonDropdownContainer {
        display: inline-block;
        margin: 2px 2px 2px 2px;
    }

    .actions button {
        padding: 4px 14px;
        font-size: 1.2em;
        border-width: 2px;
        border-style: solid;
        height: auto;
    }

        .actions button.actionTypeAccept {
            color: #ffffff;
            background-color: #006400;
            border-color: #353b2a;
        }

            .actions button.actionTypeAccept:hover {
                background-color: #004900;
                border-color: #353b2a;
            }

        .actions button.actionTypeReject {
            color: #ffffff;
            background-color: #8b0000;
            border-color: #330f0f;
        }

            .actions button.actionTypeReject:hover {
                background-color: #5e0000;
                border-color: #330f0f;
            }

        .actions button[disabled] {
            color: /*cGrey4Darker*/ #bbbbbb;
            background-color: #ebebeb;
            border-color: /*cGrey4Darker*/ #bbbbbb;
        }

        .actions button.small {
            padding: 1px 5px;
            font-size: 0.9em;
            border-width: 1px;
            font-style: normal;
        }

    .actions .buttonDropdownContent button {
        padding: 3px 6px;
    }

span.actionTypeForkMainN, span.actionTypeForkSubN, span.actionTypeForkMain1, span.actionTypeForkSub1, span.actionTypeAutomatic, span.actionTypeOther, span.actionTypePredecessor {
    color: #0077cc;
    background-color: #ffffff;
    border-color: #eaf4fb;
    border: solid 1px;
    padding: 1px 3px;
}

span.actionTypeAccept {
    color: #ffffff;
    background-color: #006400;
    border-color: #353b2a;
    border: solid 1px;
    padding: 1px 3px;
}

span.actionTypeReject {
    color: #ffffff;
    background-color: #8b0000;
    border-color: #330f0f;
    border: solid 1px;
    padding: 1px 3px;
}

body.mobile .actions {
    text-align: right;
}

.stateType1 {
    color: #3c763d;
    background-color: #dff0d8;
}

.stateType2 {
    color: #a94442;
    background-color: #f2dede;
}

.stateType3 {
    color: /*cBlack*/ #000000;
    background-color: #b2b2b2;
}

.stateType8 {
    color: /*cBlack*/ #000000;
    background-color: #fffff1;
}

.stateType9 {
    color: /*cBlack*/ #000000;
    background-color: #fffff1;
}

.box {
    width: 100px;
    height: 65px;
    z-index: 85;
    border: 1px solid black;
    cursor: move;
    display: block;
    padding: 2px;
    border-radius: 5px;
    text-align: center;
    left: 17%;
    position: relative;
    cursor: pointer;
    font-weight: normal;
    font-size: 0.7em;
}

    .box.selected {
        border: 4px solid #0095ff;
    }

    .box.youAreHere {
        border: 5px solid #ff7323;
    }

    .box.youAreHereNext {
        background-color: #ebebeb;
        border: 3px dashed #ff7323;
    }

.boxSmall {
    border: 1px solid black;
    border-radius: 3px;
    padding: 1px 5px 0 5px;
    white-space: nowrap;
    font-weight: normal;
    font-size: 0.9em;
}

    .boxSmall.selectedTemp {
        border: 4px dashed #ff7323;
    }

    .boxSmall.selected {
        border: 4px solid #0095ff;
    }

body.mobile .boxSmall {
    white-space: normal;
}

.arrow {
    height: 0;
    position: absolute;
    border: 1px solid #1a0dab;
    z-index: 83;
    display: block;
    transform-origin: 0 0;
}

    .arrow::after {
        position: absolute;
        border-top: 6px solid transparent;
        border-bottom: 6px solid transparent;
        content: '';
        display: inline-block;
        border-bottom-width: 7px;
        top: -6px;
        z-index: 83;
        box-sizing: border-box;
    }

    .arrow.toRight::after {
        border-left: 20px solid #1a0dab;
        border-right: 20px solid transparent;
        right: 50px;
    }

    .arrow.toLeft::after {
        border-left: 20px solid transparent;
        border-right: 20px solid #1a0dab;
        left: 50px;
    }

    .arrow.toBottom::after {
        border-left: 20px solid transparent;
        border-right: 20px solid #1a0dab;
        left: 10px;
    }

    .arrow.youAreHereNext {
        border: 1px dashed red;
        z-index: 84;
    }

    .arrow.toRight.youAreHereNext::after {
        border-left: 20px dashed red;
        z-index: 84;
    }

    .arrow.toLeft.youAreHereNext::after {
        border-right: 20px dashed red;
        z-index: 84;
    }

    .arrow.toBottom.youAreHereNext::after {
        border-right: 20px dashed red;
        z-index: 84;
    }

.actionType1 {
    border-color: #a94442;
}

.actionType2 {
    border-color: #a94442;
}

.actionType3 {
    border-color: #a94442;
}

.actionType4 {
    border-color: #a94442;
}

.actionType5 {
    border-color: #a94442;
}

.actionType6 {
    border-color: #3c763d;
}

.actionType7 {
    border-color: #a94442;
}

.appStaticInfo {
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    color: #000000;
    background-color: #dff0d8;
    border: 1px solid #006400;
    padding: 10px 15px 15px 10px;
    border-radius: 20px;
    cursor: pointer;
}

    .appStaticInfo:empty {
        display: none;
    }

.workflowStaticInfo {
    text-align: center;
    color: #000000;
    background-color: #dff0d8;
    border: 1px solid #006400;
    padding: 10px 15px 15px 10px;
    border-radius: 20px;
    cursor: pointer;
}

    .workflowStaticInfo:empty {
        display: none;
    }

.workflowStaticFiles {
    text-align: center;
    color: #000000;
    background-color: #dff0d8;
    border: 1px solid #006400;
    padding: 10px 15px 15px 10px;
    border-radius: 20px;
    cursor: pointer;
}

    .workflowStaticFiles button.link {
        color: #000000;
    }

.stateStaticInfo {
    text-align: center;
    color: #000000;
    background-color: #dff0d8;
    border: 1px solid #006400;
    padding: 10px 15px 15px 10px;
    border-radius: 20px;
    cursor: pointer;
}

    .stateStaticInfo:empty {
        display: none;
    }

.stateStaticFiles {
    text-align: center;
    color: #000000;
    background-color: #dff0d8;
    border: 1px solid #006400;
    padding: 10px 15px 15px 10px;
    border-radius: 20px;
    cursor: pointer;
}

    .stateStaticFiles button.link {
        color: #000000;
    }

.dialog {
    display: none;
    min-height: 0 !important;
}

    .dialog table {
        padding: 10px;
    }

.dialogBody {
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    width: 100%;
}

.ui-dialog {
    border: thick black;
    border-radius: 6px;
}

.ui-dialog-titlebar {
    display: none;
}

.ui-widget-overlay {
    opacity: .70 !important;
    filter: Alpha(Opacity=70) !important;
    background-color: #323232 !important;
}

.ui-widget-content a {
    color: /*cBlack*/ #000000;
    text-decoration: none;
}

    .ui-widget-content a:hover {
        text-decoration: underline;
    }

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active,
.ui-button:active, .ui-button.ui-state-active:hover {
    color: #ffffff;
    background-color: #0095ff;
    border: 1px solid #005599;
}

#DialogErrorImg {
    background: url("/?static=DialogError.png");
    background-repeat: no-repeat;
    background-size: contain;
    height: 50px;
    padding-right: 50px;
}

#DialogInfoImg {
    background: url("/?static=DialogInfo.png");
    background-repeat: no-repeat;
    background-size: contain;
    height: 50px;
    padding-right: 50px;
}

#DialogQuestionImg {
    background: url("/?static=DialogQuestion.png");
    background-repeat: no-repeat;
    background-size: contain;
    height: 50px;
    padding-right: 50px;
}

#DialogSuccessImg {
    background: url("/?static=DialogSuccess.png");
    background-repeat: no-repeat;
    background-size: contain;
    height: 50px;
    padding-right: 50px;
}

#DialogWarningImg {
    background: url("/?static=DialogWarning.png");
    background-repeat: no-repeat;
    background-size: contain;
    height: 50px;
    padding-right: 50px;
}

#DialogDetails {
    height: 100% !important;
}

#tooltipDiv {
    display: none;
    border: thick black;
    position: absolute;
    z-index: 108;
    top: 120px;
    left: 50px;
    min-width: 200px;
    max-width: 300px;
    max-height: 450px;
    padding: 5px 10px 5px 10px;
    overflow-y: auto;
    color: /*cBlack*/ #000000;
    background-color: #ebebeb;
    border-radius: 5px;
    box-shadow: inset 0 0 20px /*cGrey5Dark*/ #555555;
    -ms-word-wrap: break-word;
    white-space: pre-line;
}

#calendarDiv {
    display: none;
    border: thick black;
    position: absolute;
    z-index: 108;
    width: 300px;
    padding: 5px 5px 5px 5px;
    box-shadow: 0 0 20px #565656;
    color: /*cBlack*/ #000000;
    background-color: /*cWhite*/ #ffffff;
    border-radius: 5px;
    box-shadow: inset 0 0 25px /*cGrey5Dark*/ #555555;
    padding: 15px 30px 15px 30px;
}

#calendarTitle {
    font-size: 0.8em;
}

#calendarTimeFromToSeparator {
    font-size: 0.8em;
    height: 20px;
    vertical-align: middle;
}

#calendarMonth {
    margin: 10px 0 10px 0;
}

    #calendarMonth div.c {
        text-align: center;
    }

    #calendarMonth .selector {
        color: #520125;
        font-weight: bold;
        font-size: 1em;
        vertical-align: middle
    }

    #calendarMonth .monthLeft a, #calendarMonth .monthRight a {
        color: #520125;
        font-size: 1.2em;
        cursor: pointer;
        text-decoration: none;
    }

        #calendarMonth .monthLeft a.hover, #calendarMonth .monthRight a.hover {
            color: #520125;
            font-size: 1.2em;
            cursor: pointer;
            text-decoration: none;
        }

    #calendarMonth div.t.days {
        border: dotted 1px /*cGrey5Dark*/ #555555;
    }

        #calendarMonth div.t.days div.c.title {
            background-color: #940a6f;
            color: #ffffff;
            border-width: 1px;
            border-style: solid;
            border-color: #690243;
        }

        #calendarMonth div.t.days div.c.day {
            padding-top: 5px;
            padding-bottom: 5px;
            cursor: pointer;
            border-radius: 5px;
        }

            /*http://www.patternify.com/*/
            #calendarMonth div.t.days div.c.day.outOfMonth {
                background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAGUlEQVQYV2PcunXrf29vb0YYzciABggLAADl7QgFckdfKgAAAABJRU5ErkJggg==");
                background-repeat: repeat;
            }

            #calendarMonth div.t.days div.c.day.off {
                background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAYAAABWKLW/AAAAHElEQVQYV2Pcu3fvf2dnZ0YGBgYGMAETAHNgAADaJQgEYLSCTAAAAABJRU5ErkJggg==");
                background-repeat: repeat;
            }

            #calendarMonth div.t.days div.c.day.between {
                color: #ffffff;
                border-color: #005599;
                background-color: #0095ff;
            }

            #calendarMonth div.t.days div.c.day.selected {
                color: #ffffff;
                background-color: #ffa06a;
                border-color: #ff7323;
            }

#calendarTime .r .c {
    padding-top: 10px;
}

#calendarTime .ui-slider-handle {
    width: 3em;
    height: 1.6em;
    top: 50%;
    margin-top: -.8em;
    margin-left: -1.5em;
    text-align: center;
    line-height: 1.6em;
}

#typeDiv {
    display: none;
    border: thick black;
    position: absolute;
    z-index: 108;
    top: 120px;
    left: 50px;
    min-width: 100px;
    padding: 5px 10px 5px 10px;
    overflow-y: auto;
    -ms-word-wrap: break-word;
    box-shadow: 0 0 20px #565656;
    white-space: pre-line;
    color: /*cBlack*/ #000000;
    background-color: #ebebeb;
    border-radius: 5px;
    box-shadow: inset 0 0 20px /*cGrey5Dark*/ #555555;
}

    #typeDiv div.item {
        padding: 2px;
        cursor: pointer;
        color: /*cGrey5Dark*/ #555555;
        background-color: #ebebeb;
        white-space: nowrap;
        overflow-x: hidden;
        height: 25px;
        vertical-align: middle;
    }

        #typeDiv div.item.selected {
            color: /*cWhite*/ #ffffff;
            background-color: #0095ff;
        }

    #typeDiv div.footer {
        text-align: center;
        font-size: 0.85em;
        color: #0077cc;
        background-color: #ebebeb;
    }

img.iconTooltip {
    padding-left: 3px !important;
    height: 12px !important;
    width: 12px !important;
    vertical-align: top !important;
}

body.mobile img.iconTooltip {
    padding-left: 7px !important;
    height: 14px !important;
    width: 14px !important;
}

span.symbol {
    font-family: Courier New;
    font-size: 0.9em;
    white-space: nowrap;
    padding-left: 10px;
    padding-right: 10px;
    font-weight: normal;
}

    span.symbol.Condition {
        color: #00008B;
    }

    span.symbol img {
        height: 15px;
    }

    span.symbol.ForkMainN, span.symbol.ForkSubN {
        font-weight: bold;
        color: red;
    }

    span.symbol.ForkMain1, span.symbol.ForkSub1, span.symbol.Automatic {
        font-weight: bold;
    }

    span.symbol.Formula {
        color: #00008B;
    }

    span.symbol.Script {
        font-weight: bold;
        color: #ffa06a;
    }

    span.symbol.Test {
        color: red;
    }

.homeFrom {
    padding: 5px 5px 5px 10px;
}

.homeTo {
    padding: 5px 5px 5px 5px;
    vertical-align: middle;
}

.homeDetails {
    padding: 5px 0px 5px 5px;
    vertical-align: middle;
}

.homeCreated {
    padding: 5px 1px 5px 1px;
    vertical-align: middle;
}

.homeModified {
    padding: 5px 1px 5px 1px;
    vertical-align: middle;
}

.homeActions {
    padding: 5px 10px 5px 5px;
}

.pagingText {
    white-space: nowrap;
    font-family: 'Courier New';
    font-size: 0.9em;
    text-align: center;
    vertical-align: middle;
}

.pagingGoLeft {
    text-align: right;
}

    .pagingGoLeft button {
        font-size: 1.2em;
    }

.pagingGoRight {
    text-align: left;
}

    .pagingGoRight button {
        font-size: 1.2em;
    }

div.t.withHeaders div.r .Currency {
    white-space: nowrap;
    text-align: right;
}

div.t.withHeaders div.r .DateOnly {
    white-space: nowrap;
    text-align: right;
}

div.t.withHeaders div.r .DateOnlyRange {
    text-align: right;
}

div.t.withHeaders div.r .DateOnlyTimeRange {
    text-align: right;
}

div.t.withHeaders div.r .DateTime {
    text-align: right;
}

div.t.withHeaders div.r .DateTimeRange {
    text-align: right;
}

div.t.withHeaders div.r .Decimal {
    white-space: nowrap;
    text-align: right;
}

div.t.withHeaders div.r .Int {
    white-space: nowrap;
    text-align: right;
}

div.t.withHeaders div.r .TimeOnly {
    white-space: nowrap;
    text-align: right;
}

.formActions {
    padding: 5px;
}

    .formActions:empty {
        display: none;
    }

.formData {
    padding: 5px;
    position: relative;
}

.formPreview {
    position: absolute;
    top: 0;
    left: 60%;
    width: 40% !important;
    height: auto;
}

.formFooter {
    padding: 5px;
}

.subForm {
    border: 1px red solid;
    display: none;
    -moz-box-shadow: inset 0 0 25px /*cBlack*/ #000000;
    -webkit-box-shadow: inset 0 0 25px /*cBlack*/ #000000;
    box-shadow: inset 0 0 25px /*cBlack*/ #000000;
    padding: 25px;
}

span.requestIdWorkflow {
    display: block;
    font-size: 0.8em;
    font-weight: normal;
}

span.requestStateTitle {
    display: block;
    font-size: 1.2em;
}

.highlight {
    font-weight: bold;
}

.strike {
    text-decoration: line-through;
}

.underline {
    text-decoration: underline;
}

.italic {
    font-style: italic;
}

.fieldLabelLeft {
    color: /*cGrey5Dark*/ #555555;
    padding: 1px 5px 1px 5px;
    font-size: 0.80em;
}

.fieldVerticalSpace {
    width: 20px;
}

.fieldLabelAbove {
    color: /*cGrey5Dark*/ #555555;
    vertical-align: bottom;
    padding: 5px 5px 0px 5px;
    font-size: 0.80em;
}

.fieldLabelBelow {
    color: /*cGrey5Dark*/ #555555;
    vertical-align: top;
    padding: 0px 5px 5px 5px;
    font-size: 0.80em;
}

.fieldValue {
    padding: 1px 0 1px 0;
}

.formControl {
    line-height: 1.4285;
    vertical-align: middle;
    background-color: /*cWhite*/ #ffffff;
    border: 1px solid /*cGrey3*/ #cccccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px /*cGrey3*/ #cccccc;
    box-shadow: inset 0 1px 1px /*cGrey3*/ #cccccc;
    -webkit-transition: border-color ease-in-out 0.3s, box-shadow ease-in-out 0.3s;
    transition: border-color ease-in-out 0.3s, box-shadow ease-in-out 0.3s;
    padding: 2px;
}

    .formControl:focus {
        border-color: #005599;
        outline: 0;
        -webkit-box-shadow: inset 0 1px 1px #0095ff;
        box-shadow: inset 0 1px 1px #0095ff;
    }

.formEdit.formula.Html .formControl {
    line-height: normal;
    background-color: inherit;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: none;
    transition: none;
    padding: 0;
}

    .formEdit.formula.Html .formControl:focus {
        line-height: normal;
        border: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        -webkit-transition: none;
        transition: none;
        padding: 0;
    }

textarea.formControl {
    overflow: hidden;
    box-sizing: border-box;
    resize: none;
}

    textarea.formControl.script {
        font-family: 'Courier New';
        font-size: 80%
    }

    textarea.formControl.multilanguage {
        color: /*cGrey5Dark*/ #555555;
        background-color: #ebebeb;
    }

.formRead.script {
    font-family: 'Courier New';
    font-size: 80%;
    white-space: pre;
}

input.formControl[type=text]::-ms-clear {
    display: none;
}


input.formControl[type=text].multilanguage {
    color: /*cGrey5Dark*/ #555555;
    background-color: #ebebeb;
}

textarea.comment {
    line-height: 1.2;
    color: /*cGrey5Dark*/ #555555;
    vertical-align: middle;
    background-color: /*cWhite*/ #ffffff;
    border: 1px solid /*cGrey3*/ #cccccc;
    border-radius: 4px;
    padding: 2px;
    margin-top: 3px;
    font-style: italic;
    resize: none;
    overflow: hidden;
    box-sizing: border-box;
}

    textarea.comment.selectedTemp {
        border: 2px dashed;
        border-color: #ffa06a;
    }

    textarea.comment:focus {
        border-color: #005599;
        outline: 0;
        -webkit-box-shadow: inset 0 1px 1px #0095ff;
        box-shadow: inset 0 1px 1px #0095ff;
    }

div.validationErrors {
    padding: 20px;
}

    div.validationErrors span {
        margin-top: 3px;
        margin-left: 3px;
        padding: 1px 10px 1px 10px;
        border-radius: 5px;
        text-align: left;
        color: #a94442;
        background-color: #f2dede;
        white-space: nowrap;
    }

span.formError {
    display: none;
    margin-top: 3px;
    margin-left: 3px;
    padding: 1px 10px 1px 10px;
    border-radius: 5px;
    text-align: left;
    color: #a94442;
    background-color: #f2dede;
    white-space: pre-wrap;
}

span.formHint {
    display: none;
    margin-top: 3px;
    margin-left: 3px;
    padding: 1px 10px 1px 10px;
    border-radius: 5px;
    text-align: left;
    color: #3c763d;
    background-color: #dff0d8;
    white-space: pre-wrap;
}

.validationsAbove span.formError {
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
}

.validationsAbove span.formHint {
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
}

body.mobile div.form span.formError, body.mobile div.form span.formHint {
    margin-top: 20px;
}

.textError {
    font-weight: bold;
    color: #ffffff;
    background-color: #ffa06a;
    padding: 3px 10px;
}

div.slideshow {
    position: relative;
    text-align: center;
    overflow: hidden;
}

    div.slideshow div.slides {
        position: absolute;
        bottom: 0;
        padding: 10px;
    }

        div.slideshow div.slides span.slide {
            position: relative;
            cursor: pointer;
            height: 15px;
            width: 15px;
            background-color: /*cGrey3*/ #cccccc;
            border-radius: 50%;
            display: inline-block;
            transition: background-color 0.4s ease;
            margin-left: 2%;
            z-index: 10;
        }

            div.slideshow div.slides span.slide:hover {
                background-color: #520125;
            }

            div.slideshow div.slides span.slide.running {
                background-color: #520125;
            }

    div.slideshow div.slideContentFake {
        position: relative;
        z-index: 0;
    }

        div.slideshow div.slideContentFake img {
            display: none;
        }

        div.slideshow div.slideContentFake video {
            display: none;
        }

    div.slideshow div.slideContent {
        position: absolute;
        top: 0;
        text-align: center;
        z-index: 1;
    }

        div.slideshow div.slideContent div.slideTitle {
            position: absolute;
            top: 10%;
            width: 90%;
            left: 5%;
            height: 20%;
            font-family: "Bookman Old Style";
            font-size: 3em;
            font-weight: 700;
            padding: 5px;
            background-color: /*cWhite*/ #ffffff;
            color: #520125;
            vertical-align: middle;
            text-align: center;
            border-color: #520125;
            border-radius: 10px;
            border-style: solid;
            border-width: 2px;
            display: none;
        }

        div.slideshow div.slideContent div.slideDesc {
            position: absolute;
            bottom: 1%;
            height: 0%;
            font-family: "Bookman Old Style";
            font-size: 2.0em;
            color: /*cWhite*/ #ffffff;
            background: /*cGrey5Dark*/ #555555;
            padding: 5px;
            opacity: 0;
            transition: 2s ease;
            -webkit-transition: opacity 2s ease;
        }

            div.slideshow div.slideContent div.slideDesc:empty {
                display: none;
            }

body.mobile div.slideshow div.slideContent div.slideDesc {
    font-size: 1.3em;
}

body.mobile div.slideshow div.slideContent div.slideTitle {
    font-size: 1.6em;
}

div.slideshow.clicked div.slideContent div.slideDesc {
    height: 59%;
    opacity: 0.85;
}

input[type=text]::-webkit-input-placeholder {
    color: /*cGrey4Darker*/ #bbbbbb;
    font-style: italic;
    font-weight: normal;
}

input[type=text]::-moz-placeholder {
    color: /*cGrey4Darker*/ #bbbbbb;
    font-style: italic;
    font-weight: normal;
}

input[type=text]:-moz-placeholder {
    color: /*cGrey4Darker*/ #bbbbbb;
    font-style: italic;
    font-weight: normal;
}

input[type=text]:-ms-input-placeholder {
    color: /*cGrey4Darker*/ #bbbbbb;
    font-style: italic;
    font-weight: normal;
}

#searchInput::-webkit-input-placeholder {
    text-align: center;
}

#searchInput::-moz-placeholder {
    text-align: center;
}

#searchInput:-moz-placeholder {
    text-align: center;
}

#searchInput:-ms-input-placeholder {
    text-align: center;
}


.red {
    color: #ff7323;
}

    .red a {
        color: #ff7323;
    }

.bold {
    font-weight: bold;
}

.small {
    font-size: 0.9em;
}

.verySmall {
    font-size: 0.8em;
}

.veryVerySmall {
    font-size: 0.6em;
}

.large {
    font-size: 1.2em;
}

.floatLeft {
    float: left;
}

.floatRight {
    float: right;
}

.absolute {
    position: absolute;
}

.relative {
    position: relative;
}

.top1 {
    top: 1px;
}

.top2 {
    top: 2px;
}

.top3 {
    top: 3px;
}

.top4 {
    top: 4px;
}

.top5 {
    top: 5px;
}

.top6 {
    top: 6px;
}

.top7 {
    top: 7px;
}

.top8 {
    top: 8px;
}

.top9 {
    top: 9px;
}

.top10 {
    top: 10px;
}

.top20 {
    top: 20px;
}

.top30 {
    top: 30px;
}

.top40 {
    top: 40px;
}

.top50 {
    top: 50px;
}

.right0 {
    right: 0;
}

.right20 {
    right: 21px;
}

.right40 {
    right: 42px;
}

.right60 {
    right: 63px;
}

.left {
    text-align: left;
}

.marginLeft10 {
    margin-left: 10px;
}

.pad1 {
    padding: 1px;
}

.pad2 {
    padding: 2px;
}

.pad3 {
    padding: 3px;
}

.pad4 {
    padding: 4px;
}

.pad5 {
    padding: 5px;
}

.pad10 {
    padding: 10px;
}

.pad20 {
    padding: 20px;
}

.padBottom1 {
    padding-bottom: 1px;
}

.padBottom2 {
    padding-bottom: 2px;
}

.padBottom3 {
    padding-bottom: 3px;
}

.padBottom4 {
    padding-bottom: 4px;
}

.padBottom5 {
    padding-bottom: 5px;
}

.padBottom6 {
    padding-bottom: 6px;
}

.padBottom7 {
    padding-bottom: 7px;
}

.padBottom8 {
    padding-bottom: 8px;
}

.padBottom9 {
    padding-bottom: 9px;
}

.padBottom10 {
    padding-bottom: 10px;
}

.padBottom11 {
    padding-bottom: 11px;
}

.padBottom12 {
    padding-bottom: 12px;
}

.padBottom13 {
    padding-bottom: 13px;
}

.padBottom14 {
    padding-bottom: 14px;
}

.padBottom15 {
    padding-bottom: 15px;
}

.padBottom16 {
    padding-bottom: 16px;
}

.padBottom17 {
    padding-bottom: 17px;
}

.padBottom18 {
    padding-bottom: 18px;
}

.padBottom19 {
    padding-bottom: 19px;
}

.padBottom20 {
    padding-bottom: 20px;
}

.padTop1 {
    padding-top: 1px;
}

.padTop2 {
    padding-top: 2px;
}

.padTop3 {
    padding-top: 3px;
}

.padTop4 {
    padding-top: 4px;
}

.padTop5 {
    padding-top: 5px;
}

.padTop6 {
    padding-top: 6px;
}

.padTop7 {
    padding-top: 7px;
}

.padTop8 {
    padding-top: 8px;
}

.padTop9 {
    padding-top: 9px;
}

.padTop10 {
    padding-top: 10px;
}

.padTop11 {
    padding-top: 11px;
}

.padTop12 {
    padding-top: 12px;
}

.padTop13 {
    padding-top: 13px;
}

.padTop14 {
    padding-top: 14px;
}

.padTop15 {
    padding-top: 15px;
}

.padTop16 {
    padding-top: 16px;
}

.padTop17 {
    padding-top: 17px;
}

.padTop18 {
    padding-top: 18px;
}

.padTop19 {
    padding-top: 19px;
}

.padTop20 {
    padding-top: 20px;
}

.padLeft1 {
    padding-left: 1px !important;
}

.padLeft2 {
    padding-left: 2px !important;
}

.padLeft3 {
    padding-left: 3px !important;
}

.padLeft4 {
    padding-left: 4px !important;
}

.padLeft5 {
    padding-left: 5px !important;
}

.padLeft10 {
    padding-left: 10px !important;
}

.padLeft20 {
    padding-left: 20px !important;
}

.padLeft30 {
    padding-left: 30px !important;
}

.padLeft40 {
    padding-left: 40px !important;
}

.padLeft50 {
    padding-left: 50px !important;
}

.padLeft60 {
    padding-left: 60px !important;
}

.padLeft70 {
    padding-left: 70px !important;
}

.padLeft80 {
    padding-left: 80px !important;
}

.padLeft90 {
    padding-left: 90px !important;
}

.padLeft100 {
    padding-left: 100px !important;
}

.padRight10 {
    padding-right: 10px !important;
}

.padRight20 {
    padding-right: 20px !important;
}

.padRight30 {
    padding-right: 30px !important;
}

.padRight40 {
    padding-right: 40px !important;
}

.padRight50 {
    padding-right: 50px !important;
}

.padRight60 {
    padding-right: 60px !important;
}

.padRight70 {
    padding-right: 70px !important;
}

.padRight80 {
    padding-right: 80px !important;
}

.padRight90 {
    padding-right: 90px !important;
}

.pointer {
    cursor: pointer;
}

.center {
    text-align: center;
}

.right {
    text-align: right;
}

.bottom {
    vertical-align: bottom;
}

.middle {
    vertical-align: middle;
}

.top {
    vertical-align: top;
}

.height1px {
    height: 1px;
}

.height2px {
    height: 2px;
}

.height3px {
    height: 3px;
}

.height4px {
    height: 4px;
}

.height5px {
    height: 5px;
}

.height6px {
    height: 6px;
}

.height7px {
    height: 7px;
}

.height8px {
    height: 8px;
}

.height9px {
    height: 9px;
}

.height10px {
    height: 10px;
}

.height11px {
    height: 11px;
}

.height12px {
    height: 12px;
}

.height13px {
    height: 13px;
}

.height14px {
    height: 14px;
}

.height15px {
    height: 15px;
}

.height16px {
    height: 16px;
}

.height17px {
    height: 17px;
}

.height18px {
    height: 18px;
}

.height19px {
    height: 19px;
}

.height20px {
    height: 20px;
}

.height21px {
    height: 21px;
}

.height22px {
    height: 22px;
}

.height23px {
    height: 23px;
}

.height24px {
    height: 24px;
}

.height25px {
    height: 25px;
}

.height26px {
    height: 26px;
}

.height27px {
    height: 27px;
}

.height28px {
    height: 28px;
}

.height29px {
    height: 29px;
}

.height30px {
    height: 30px;
}

.height40px {
    height: 40px;
}

.height50px {
    height: 50px;
}

.height60px {
    height: 60px;
}

.height70px {
    height: 70px;
}

.height80px {
    height: 80px;
}

.inlineBlock {
    display: inline-block;
}

.left0 {
    left: 0;
}

.left10 {
    left: 10px;
}

.right0 {
    right: 0;
}

.right10 {
    right: 10px;
}

.right170 {
    right: 170px;
}

.nowrap {
    white-space: nowrap;
}

.wrap {
    white-space: pre-line;
    word-break: break-all;
    width: 100%;
}

.height5 {
    height: 5%;
}

.height10 {
    height: 10%;
}

.height15 {
    height: 15%;
}

.height20 {
    height: 20%;
}

.height25 {
    height: 25%;
}

.height30 {
    height: 30%;
}

.height35 {
    height: 35%;
}

.height40 {
    height: 40%;
}

.height45 {
    height: 45%;
}

.height50 {
    height: 50%;
}

.height55 {
    height: 55%;
}

.height65 {
    height: 65%;
}

.height70 {
    height: 70%;
}

.height75 {
    height: 75%;
}

.height80 {
    height: 80%;
}

.height85 {
    height: 85%;
}

.height90 {
    height: 90%;
}

.height95 {
    height: 95%;
}

.height100 {
    height: 100%;
}

.width10px {
    width: 10px;
}

.width20px {
    width: 20px;
}

.width30px {
    width: 30px;
}

.width40px {
    width: 40px;
}

.width50px {
    width: 50px;
}

.width60px {
    width: 60px;
}

.width70px {
    width: 70px;
}

.width80px {
    width: 80px;
}

.width90px {
    width: 90px;
}

.width100px {
    width: 100px;
}

.width110px {
    width: 110px;
}

.width120px {
    width: 120px;
}

.width130px {
    width: 130px;
}

.width140px {
    width: 140px;
}

.width150px {
    width: 150px;
}

.width1 {
    width: 1%;
}

.width2 {
    width: 2%;
}

.width3 {
    width: 3%;
}

.width4 {
    width: 4%;
}

.width5 {
    width: 5%;
}

.width6 {
    width: 6%;
}

.width7 {
    width: 7%;
}

.width8 {
    width: 8%;
}

.width9 {
    width: 9%;
}

.width10 {
    width: 10%;
}

.width11 {
    width: 11%;
}

.width12 {
    width: 12%;
}

.width13 {
    width: 13%;
}

.width14 {
    width: 14%;
}

.width15 {
    width: 15%;
}

.width16 {
    width: 16%;
}

.width17 {
    width: 17%;
}

.width18 {
    width: 18%;
}

.width19 {
    width: 19%;
}

.width20 {
    width: 20%;
}

.width21 {
    width: 21%;
}

.width22 {
    width: 22%;
}

.width23 {
    width: 23%;
}

.width24 {
    width: 24%;
}

.width25 {
    width: 25%;
}

.width26 {
    width: 26%;
}

.width27 {
    width: 27%;
}

.width28 {
    width: 28%;
}

.width29 {
    width: 29%;
}

.width30 {
    width: 30%;
}

.width31 {
    width: 31%;
}

.width32 {
    width: 32%;
}

.width33 {
    width: 33%;
}

.width34 {
    width: 34%;
}

.width35 {
    width: 35%;
}

.width36 {
    width: 36%;
}

.width37 {
    width: 37%;
}

.width38 {
    width: 38%;
}

.width39 {
    width: 39%;
}

.width40 {
    width: 40%;
}

.width41 {
    width: 41%;
}

.width42 {
    width: 42%;
}

.width43 {
    width: 43%;
}

.width44 {
    width: 44%;
}

.width45 {
    width: 45%;
}

.width46 {
    width: 46%;
}

.width47 {
    width: 47%;
}

.width48 {
    width: 48%;
}

.width49 {
    width: 49%;
}

.width50 {
    width: 50%;
}

.width51 {
    width: 51%;
}

.width52 {
    width: 52%;
}

.width53 {
    width: 53%;
}

.width54 {
    width: 54%;
}

.width55 {
    width: 55%;
}

.width56 {
    width: 56%;
}

.width57 {
    width: 57%;
}

.width58 {
    width: 58%;
}

.width59 {
    width: 59%;
}

.width60 {
    width: 60%;
}

.width61 {
    width: 61%;
}

.width62 {
    width: 62%;
}

.width63 {
    width: 63%;
}

.width64 {
    width: 64%;
}

.width65 {
    width: 65%;
}

.width66 {
    width: 66%;
}

.width67 {
    width: 67%;
}

.width68 {
    width: 68%;
}

.width69 {
    width: 69%;
}

.width70 {
    width: 70%;
}

.width71 {
    width: 71%;
}

.width72 {
    width: 72%;
}

.width73 {
    width: 73%;
}

.width74 {
    width: 74%;
}

.width75 {
    width: 75%;
}

.width76 {
    width: 76%;
}

.width77 {
    width: 77%;
}

.width78 {
    width: 78%;
}

.width79 {
    width: 79%;
}

.width80 {
    width: 80%;
}

.width81 {
    width: 81%;
}

.width82 {
    width: 82%;
}

.width83 {
    width: 83%;
}

.width84 {
    width: 84%;
}

.width85 {
    width: 85%;
}

.width86 {
    width: 86%;
}

.width87 {
    width: 87%;
}

.width88 {
    width: 88%;
}

.width89 {
    width: 89%;
}

.width90 {
    width: 90%;
}

.width91 {
    width: 91%;
}

.width92 {
    width: 92%;
}

.width93 {
    width: 93%;
}

.width94 {
    width: 94%;
}

.width95 {
    width: 95%;
}

.width96 {
    width: 96%;
}

.width97 {
    width: 97%;
}

.width98 {
    width: 98%;
}

.width99 {
    width: 99%;
}

.width100 {
    width: 100%;
}
