.label {
    padding: 3px 4px 3px 4px;
    border-radius: 2px;
    font-size: 1em;
    background-color: #ddd;
    color: #222;
    text-shadow: none;
}
.label.full-width {
    width: 100%;
    margin-right: 1px;
}
.label-warning,
.label-important {
    background-color: #c0392b;
    color: #fff;
    text-shadow: 1px 1px #6d2018;
}
.label-success {
    background-color: #a6cb61;
    color: #fff;
    text-shadow: 1px 1px #729531;
}
.label-info {
    background-color: #7bb0ce;
    color: #fff;
    text-shadow: 1px 1px #3d80a6;
}
div.label-search-container {
    margin-top: 10px;
    margin-bottom: 5px;
}
.label-search {
    background-color: #fefefe;
    border: 0 solid #ddd;
    color: #888;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
}
.label-pointer {
    cursor: pointer;
}
label.checkbox {
    display: block;
    padding: 6px 5px;
    font-size: 13px;
    line-height: 18px;
    color: #555;
    background-color: #f9f9f9;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    cursor: pointer;
    width: 350px;
    min-width: 350px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
label.checkbox:hover {
    background-color: #f6f6f6;
}
label.checkbox.small {
    min-width: 150px;
    width: 150px;
}
label.checkbox.medium {
    min-width: 190px;
    width: 190px;
}
label.checkbox.large {
    min-width: 280px;
    width: 280px;
}
ul.checkbox-group {
    list-style: none;
    padding: 0;
    margin: 0;
    margin-top: 7px;
    margin-bottom: 7px;
}
ul.checkbox-group li {
    padding: 0;
    margin: 0;
    margin-bottom: 2px;
    line-height: 24px;
}
.label-transparent {
    background: transparent;
    color: #222;
}
.label-turquoise {
    background: #1abc9c;
    color: #fff;
    text-shadow: 1px 1px #0e6252;
}
.label-greensea {
    background: #16a085;
    color: #fff;
    text-shadow: 1px 1px #0a463a;
}
.label-peterriver {
    background: #3498db;
    color: #fff;
    text-shadow: 1px 1px #196090;
}
.label-belizehole {
    background: #2980b9;
    color: #fff;
    text-shadow: 1px 1px #164666;
}
.label-amethyst {
    background: #9b59b6;
    color: #fff;
    text-shadow: 1px 1px #623475;
}
.label-wisteria {
    background: #8e44ad;
    color: #fff;
    text-shadow: 1px 1px #522764;
}
.label-wetasphalt {
    background: #34495e;
    color: #fff;
    text-shadow: 1px 1px #10161c;
}
.label-midnightblue {
    background: #2c3e50;
    color: #fff;
    text-shadow: 1px 1px #080b0e;
}
.label-sunflower {
    background: #f1c40f;
    color: #222;
}
.label-orange {
    background: #f39c12;
    color: #222;
}
.label-carrot {
    background: #e67e22;
    color: #222;
}
.label-pumpkin {
    background: #d35400;
    color: #fff;
    text-shadow: 1px 1px #6d2b00;
}
.label-alizarin {
    background: #e74c3c;
    color: #fff;
    text-shadow: 1px 1px #a82315;
}
.label-pomegranate {
    background: #c0392b;
    color: #fff;
    text-shadow: 1px 1px #6d2018;
}
.label-clouds {
    background: #ecf0f1;
    color: #222;
}
.label-silver {
    background: #bdc3c7;
    color: #222;
}
.label-concrete {
    background: #95a5a6;
    color: #222;
}
.label-asbestos {
    background: #7f8c8d;
    color: #222;
}
.label-chocolate {
    background: #8f6048;
    color: #fff;
    text-shadow: 1px 1px #4b3226;
}
.label-help-error {
    background: #f2dede;
}
.label-help-warning {
    background: #fcf8e3;
    border: 1px solid #f2e187;
}
.label-help-info {
    background: #d9edf7;
    color: #fff;
    text-shadow: 1px 1px #3d80a6;
    border: 1px solid #3d80a6;
}
.label-help-info-lighter {
    background: #c4e3f3;
}
.label-underline {
    padding: 3px;
    border-bottom: 2px dashed #888;
}
.label-underline-success {
    padding: 3px;
    border-bottom: 2px dashed #a6cb61;
}
.label-underline-warning,
.label-underline-important {
    padding: 3px;
    border-bottom: 2px dashed #d84545;
}
.label-underline-info {
    padding: 3px;
    border-bottom: 2px dashed #7bb0ce;
}
.button {
    position: relative;
    overflow: visible;
    display: inline-block;
    padding: 0.5em 1em;
    border: 1px solid #d4d4d4;
    margin: 0;
    text-decoration: none;
    text-align: center;
    color: #555;
    white-space: nowrap;
    cursor: pointer;
    outline: none;
    background-color: #eee;
    background-image: -webkit-gradient(
        linear,
        0 0,
        0 100%,
        from(#f4f4f4),
        to(#ececec)
    );
    background-image: -moz-linear-gradient(#f4f4f4, #ececec);
    background-image: -ms-linear-gradient(#f4f4f4, #ececec);
    background-image: -o-linear-gradient(#f4f4f4, #ececec);
    background-image: linear-gradient(#f4f4f4, #ececec);
    -moz-background-clip: padding;
    background-clip: padding-box;
    border-radius: 0.2em;
    min-height: 15px;
    zoom: 1;
    *display: inline;
}
.button.small {
    font-size: 11px;
    min-height: 10px;
    padding: 0.2em 0.6em;
}
.button.small i {
    font-size: 9px;
    text-shadow: none;
    color: #333;
}
.button.draggable {
    cursor: move;
}
.button:hover,
.button:focus,
.button:active,
.button.active {
    border-color: #aeaeae;
    text-decoration: none;
    color: #555;
    background-color: #eee;
}
.button:active,
.button.active {
    border-color: #949494;
    background-color: #cecece;
}
.selected {
    background: #ccc;
    border-color: #949494;
}
.button:active.selected {
    background: #ccc;
    border-color: #949494;
}
.button::-moz-focus-inner {
    padding: 0;
    border: 0;
}
.buttonbar {
    border-top: 1px solid #eee;
    padding: 10px;
    margin-top: 20px;
    background-color: #f9f9f9;
}
.buttonbar.top {
    border-top: 0;
    border-bottom: 1px solid #eee;
    padding: 10px;
    margin-top: 0;
    margin-bottom: 20px;
}
.button.primary {
    font-weight: bold;
}
.button.danger {
    color: #900;
}
.button.danger:hover,
.button.danger:focus,
.button.danger:active {
    border-color: #b53f3a;
    border-bottom-color: #a0302a;
    color: #fff;
    background-color: #dc5f59;
}
.button.danger:active,
.button.danger.active {
    border-color: #a0302a;
    border-bottom-color: #bf4843;
    background-color: #b33630;
}
.button.pill {
    border-radius: 50em;
}
.button.disable {
    opacity: 0.5;
    cursor: default;
}
.button.big {
    font-size: 14px;
}
.button.big.icon:before {
    top: 0;
}
.button.inactive,
.button.inactive:active,
.button.inactive:hover {
    opacity: 0.7;
    cursor: default;
    border: 1px solid #d4d4d4;
    color: #555;
    background-color: #eee;
    background-image: -webkit-gradient(
        linear,
        0 0,
        0 100%,
        from(#f4f4f4),
        to(#ececec)
    );
    background-image: -moz-linear-gradient(#f4f4f4, #ececec);
    background-image: -ms-linear-gradient(#f4f4f4, #ececec);
    background-image: -o-linear-gradient(#f4f4f4, #ececec);
    background-image: linear-gradient(#f4f4f4, #ececec);
}
.button-group {
    display: inline-block;
    list-style: none;
    padding: 0;
    margin: 0;
    zoom: 1;
    *display: inline;
}
.button + .button,
.button + .button-group,
.button-group + .button,
.button-group + .button-group {
    margin-left: 0;
}
.button-group li {
    float: left;
    padding: 0;
    margin: 0;
}
.button-group .button {
    float: left;
    margin-left: -1px;
}
.button-group > .button:not(:first-child):not(:last-child),
.button-group li:not(:first-child):not(:last-child) .button {
    border-radius: 0;
    border-right: 0;
    border-left: 1px solid #ddd;
}
.button-group > .button:first-child,
.button-group li:first-child .button {
    margin-left: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 0;
}
.button-group > .button:last-child,
.button-group li:last-child > .button {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: 1px solid #ddd;
}
.button-group.minor-group .button {
    border: 1px solid #d4d4d4;
    text-shadow: none;
    background-image: none;
    background-color: #fff;
}
.button-group.minor-group .button:hover,
.button-group.minor-group .button:focus {
    background-color: #599bdc;
}
.button-group.minor-group .button:active,
.button-group.minor-group .button.active {
    background-color: #3072b3;
}
.button-group.minor-group .button.icon:before {
    opacity: 0.8;
}
.button-container .button,
.button-container .button-group {
    vertical-align: top;
    margin-bottom: 3px;
}

.sticky-buttons {
    position: sticky;
    top: 0px;
    z-index: 50;
    background-color: white;
    margin: 0 -10px !important;
    padding: 6px 10px 0 !important;
    border-bottom: 0px solid #ddd;
}
table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}
th,
td {
    border-top: 1px solid #ddd;
    line-height: 16px;
    padding: 5px;
    text-align: left;
    vertical-align: top;
}
th {
    border: 0;
}
table.striped tbody tr:nth-child(2n + 1) {
    background-color: #f9f9f9;
}
table.not-striped tbody tr:nth-child(2n + 1) {
    background-color: transparent;
}
table.bordered {
    border: 1px solid #ddd;
    border-radius: 4px;
}
table.bordered th,
table.bordered td {
    border-left: 1px solid #ddd;
}
table.form tr,
table.form td,
table.form th {
    border: 0;
    padding: 0;
    margin: 0;
}
table.borderless table {
    border: 0;
    margin-bottom: 0;
    padding-bottom: 0;
}
table.borderless td {
    border: 0;
    margin-bottom: 0;
    padding-bottom: 0;
}
table.borderless th {
    border: 0;
    margin-bottom: 0;
    padding-bottom: 0;
}
table.borderless tr {
    border: 0;
    margin-bottom: 0;
    padding-bottom: 0;
}
table tbody tr.success td {
    background-color: #dff0d8;
    border: 0;
}
table.striped tbody tr.success:nth-child(2n + 1) {
    background-color: #dff0d8;
    border-width: 1px;
}
table.striped tbody tr.success:nth-child(2n + 1) td {
    background-color: #dff0d8;
    border-width: 1px;
}
table.bordered tbody tr.success:nth-child(2n + 1) {
    background-color: #dff0d8;
    border-width: 1px;
}
table.bordered tbody tr.success:nth-child(2n + 1) td {
    background-color: #dff0d8;
    border-width: 1px;
}
table tbody tr.error td {
    background-color: #f2dede;
}
table tbody tr.warning td {
    background-color: #fcf8e3;
}
table tbody tr.info td {
    background-color: #d9edf7;
}
table tbody tr.info-lighter td {
    background-color: #c4e3f3;
}
h4 {
    margin: 0;
    padding: 4px 0;
    font-size: 12px;
    letter-spacing: 0.05em;
}
.header-container {
    margin-left: 35px;
    margin-right: 35px;
    padding: 15px 15px;
}
header {
    background: #2e2e2e;
    color: #aaa;
    text-shadow: 1px 1px #222;
}
.header-column {
    float: left;
    width: 50%;
    background: transparent;
    padding-bottom: 15px;
}
header a {
    color: #fff;
    text-decoration: none;
}
header a:hover {
    text-decoration: underline;
}
header:after {
    content: '.';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.nav-container {
    margin: 0;
    padding: 0;
    background: #2e2e2e;
    padding-bottom: 10px;
    border-bottom: 2px solid #999;
}
nav small {
    color: #a6cb61;
    font-size: 11px;
    vertical-align: middle;
}
nav[role='main'] {
    background-color: transparent;
    padding: 0;
    margin-left: 50px;
    margin-right: 50px;
    min-height: 40px;
}
nav[role='main'] ul {
    background-color: #444;
    width: 100%;
    float: left;
    margin: 0;
    padding: 0;
    list-style: none;
    border-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border-bottom: 1px solid #333;
}
nav[role='main'] ul li {
    float: left;
    font-size: 14px;
}
nav[role='main'] li a {
    display: block;
    padding: 16px 12px;
    text-decoration: none;
    color: #fff;
    border: 0;
    text-shadow: 1px 1px #17181a;
}
nav[role='main'] ul li a:hover {
    background-color: #4f4f4f;
    text-decoration: none;
    color: #fff;
    border: 0;
}
nav[role='main'] ul li.active {
    border: 0;
}
nav[role='main'] ul li.active > a {
    color: #cbdd86;
}
nav[role='main'] ul li.pull-right {
    float: right;
}
nav[role='main'] ul li:first-child {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}
nav[role='main'] ul li.last {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}
nav[role='main'] ul li:first-child > a:hover {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}
nav[role='main'] ul li.last > a:hover {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}
nav:after {
    content: '.';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
nav[role='main'] li div {
    background: #4f4f4f;
    position: absolute;
    display: block;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    border-radius: 0;
    padding: 0;
    margin: 0;
    border-radius: 6px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    z-index: 1001;
}
nav[role='main'] li:hover div {
    opacity: 1;
    visibility: visible;
    overflow: visible;
}
nav[role='main'] .nav-column {
    float: left;
    width: 250px;
    border-radius: 6px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
nav[role='main'] .nav-column ul li {
    float: none;
}
nav[role='main'] .nav-column li a {
    background: #4f4f4f;
    display: block;
    line-height: 14px;
    border-radius: 0;
    color: #ccc;
    padding-top: 12px;
    padding-bottom: 12px;
    border-radius: 6px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    font-size: 15px;
}
nav[role='main'] .nav-column li a:hover {
    background: #444;
}
nav[role='main'] .nav-column small {
    background: #4f4f4f;
    margin: 0;
    padding: 0;
    line-height: 12px;
    font-size: 11px;
    color: #888;
}
nav[role='main'] .nav-column li a:hover small {
    background: #444;
}
li.quickmenu {
    background: #4f4f4f;
}
li.quickmenu input[type='text'] {
    font-size: 16px;
    margin: 10px;
    margin-bottom: 0;
    border: 2px solid #666;
    color: #fff;
    background: #444;
}
li.quickmenu select {
    font-size: 16px;
    margin: 10px;
    margin-bottom: 0;
    border: 2px solid #666;
    color: #fff;
    background: #444;
}
li.quickmenu select:active {
    outline: 0;
}
li.quickmenu span {
    color: #ccc;
    font-size: 12px;
    font-weight: bold;
    text-shadow: 1px 1px #222;
}
li.submenu a {
    font-size: 11px;
    color: #888;
}
.error,
.notice,
.notice-alt,
.success {
    padding: 8px;
    padding-bottom: 10px;
    border: 2px solid #ddd;
    margin-top: 15px;
}
.error i,
.notice i,
notice-alt i,
.success i {
    font-size: 18px;
    color: #ffd324;
}
.error {
    background: #fbe3e4;
    color: #8a1f11;
    border-color: #fbc2c4;
}
.notice {
    background: #fff6bf;
    color: #514721;
    border-color: #ffd324;
}
.success {
    background: #e6efc2;
    color: #264409;
    border-color: #c6d880;
}
.notice-alt {
    background: #fcf4ae;
    color: #514721;
    border-color: #ffd324;
}
.success-alt {
    background: #c6d880;
    color: #264409;
    border-color: #c6d880;
}
.notice > hr {
    border-color: #ffd324;
}
.success > hr {
    border-color: #c6d880;
}
.error > hr {
    border-color: #fbc2c4;
}
.notice h2 {
    color: #514721;
    border-bottom: 1px solid #ffd324;
    padding-top: 0;
    margin-top: 0;
}
.notice h3 {
    color: #514721;
    border-bottom: 1px solid #ffd324;
    padding-top: 4px;
    margin-top: 0;
}
.notice-alt h2 {
    color: #514721;
    border-bottom: 1px solid #ffd324;
    padding-top: 0;
    margin-top: 0;
}
.notice-alt h3 {
    color: #514721;
    border-bottom: 1px solid #ffd324;
    padding-top: 4px;
    margin-top: 0;
}
.success h2 {
    border-color: #c6d880;
    color: #264409;
}
.success h3 {
    border-color: #c6d880;
    color: #264409;
}
.error h2 {
    border-color: #fbc2c4;
    color: #8a1f11;
}
.filter-panel {
    background-color: #f7f7f7;
    padding: 20px 0;
}
.filter-panel-component {
    width: calc(100% + 100px);
    margin: -10px -50px 0 -50px;
    border-bottom: 1px solid #ddd;
}
.filter-bar {
    margin: 0 auto;
    width: 800px;
}
.filter-panel-row {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.filter-panel-row > div {
    margin-bottom: 16px;
}
.filter-bar h5 {
    color: #888;
    text-transform: uppercase;
    margin-top: 0;
}
.filter-panel-row-hidden {
    display: none;
}
.filter-panel-toggles ul li {
    color: #556aa1;
    text-transform: uppercase;
}
.filter-panel-toggles ul li:not(:first-child) {
    margin-left: 12px;
}
.standard-panel {
    padding-top: 20px;
    padding-bottom: 20px;
    margin-left: 40px;
    margin-right: 50px;
}
.standard-bar {
    margin: 0 auto;
    width: 800px;
}
.help-panel {
    padding-left: 50px;
    padding-right: 50px;
    margin-bottom: 5px;
    margin-top: 0;
    padding-top: 10px;
    padding-bottom: 25px;
    background: #fff;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
.help-panel-sections {
    width: 15%;
    float: left;
}
.help-panel-sections ul {
    padding: 0;
    margin: 0;
    list-style: none;
}
.help-panel-sections li {
    line-height: 20px;
    margin-right: 25px;
    padding: 2px;
    padding-left: 10px;
    border-left: 2px solid transparent;
}
.help-panel-sections li.active {
    border-left: 2px solid #d84545;
}
.help-panel-sections li:hover {
    background: #eee;
    border-left: 2px solid #ddd;
    cursor: pointer;
}
.help-panel-content {
    width: 85%;
    float: left;
    max-height: 400px;
    overflow: auto;
}
.help-panel {
    border-bottom: 1px solid #ddd;
}
.help-panel:after {
    content: '.';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
#shortcut-panel {
    margin-left: 50px;
    margin-right: 50px;
    margin-bottom: 15px;
    border-top: 2px solid #444;
    padding-top: 10px;
    line-height: 21px;
}
#shortcut-panel ul {
    list-style: none;
    padding: 0;
    margin-top: 0;
}
#shortcut-panel li {
    padding: 3px;
    padding-left: 8px;
    cursor: pointer;
}
#shortcut-panel a {
    color: #ddd;
    text-shadow: 1px 1px #222;
    text-decoration: none;
    font-size: 15px;
}
#shortcut-panel li:hover {
    background-color: #444;
}
#shortcut-panel h3 {
    margin: 0;
    padding: 0;
    color: #cbdd86;
    text-shadow: 1px 1px #000;
}
.shortcut-column {
    width: 200px;
    float: left;
    margin-right: 10px;
}
.map-container {
    background-color: #fff;
    margin: 0;
    padding: 0;
}
#map_canvas {
    width: 100%;
    min-height: 600px;
    position: relative;
    margin: 0;
    padding: 0;
    border-top: 1px solid #999;
}
nav.horizontal ul {
    width: 100%;
    float: left;
    margin: 0;
    padding: 0;
    list-style: none;
    background-color: #323941;
}
nav.horizontal ul li {
    float: left;
}
nav.horizontal li a {
    display: block;
    padding: 13px 8px;
    text-decoration: none;
    color: #ccc;
    border: 0;
    text-shadow: 1px 1px #17181a;
}
nav.horizontal ul li a:hover {
    background-color: #383f49;
    text-decoration: none;
    color: #fff;
    border: 0;
}
nav.horizontal ul li a.active {
    background-color: #414954;
    border: 0;
    color: #fff;
}
nav.horizontal ul li.pull-right {
    float: right;
}
nav.horizontal .fixed {
    position: fixed;
    top: 0;
    width: 100%;
}
nav.horizontal ul li a.brand {
    color: #1b1f24;
    float: right;
    font-weight: bold;
    margin-left: 20px;
    padding-left: 0;
    padding-right: 20px;
    text-shadow:
        0 1px 0 rgba(255, 255, 255, 0.1),
        0 0 30px rgba(255, 255, 255, 0.125);
}
nav.horizontal ul li a.brand:hover {
    color: #fff;
    background-color: transparent;
}
nav.horizontal:after {
    content: '.';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
nav.tabs ul {
    background-color: #fff;
}
nav.tabs li {
    background-color: #eee;
}
nav.tabs li a {
    padding: 10px 12px;
    color: #555;
    font-weight: normal;
    text-shadow: none;
    border-top: 1px solid transparent;
}
nav.tabs li:first-child a {
    border-top-left-radius: 0;
}
nav.tabs li:first-child {
    border-top-left-radius: 0;
}
nav.tabs ul li a:hover {
    background-color: #ccc;
    color: #333;
    border-top: 1px solid transparent;
}
nav.tabs ul li a.active {
    font-weight: bold;
    background-color: #ddd;
    color: #333;
    border-top: 1px solid transparent;
}
.tab-content {
    margin: 0;
    padding: 15px;
    background-color: #fff;
    color: #333;
    display: none;
}
.tab-bordered {
    border: 1px solid #eee;
    border-radius: 0;
}
nav.tabs p {
    background-color: #fff;
    margin-left: 10px;
    color: #888;
}
nav.tabs li.description {
    background-color: #fff;
    color: #888;
}
nav.tabs li.description a {
    border: 0;
    padding: 0;
    margin: 0;
    text-decoration: none;
    color: #607890;
    display: inline;
}
nav.tabs li.description a:hover {
    color: #414954;
    background-color: transparent;
    border: 0;
}
.tab-content h1,
.tab-content h2,
.tab-content h3,
.tab-content h4,
.tab-content h5,
.tab-content h6 {
    margin-top: 0;
    padding-top: 0;
}
.tab-content.bordered {
    border: 1px solid #ddd;
}
.tab-content.top-border {
    border-top: 1px solid #ddd;
}
.tab-content.no-padding {
    padding-left: 0;
    padding-right: 0;
}
.tab-badge {
    background: #999;
    color: #fff;
    padding: 4px 8px 2px 8px;
    margin: 1px 1px 1px 5px;
    font-size: 11px;
    font-weight: bold;
    border-radius: 4px;
}
.tab-badge.danger {
    background: #d84545;
}
.tab-badge.warning {
    background: #f16529;
}
.tab-badge.info {
    background: #2e7a94;
}
.tab-badge.green {
    background: #16a085;
}
form .form-label {
    float: left;
    width: 120px;
    text-align: right;
    margin-right: 10px;
    margin-bottom: 0;
}
form .form-control {
    float: left;
    margin-right: 130px;
    margin-bottom: 0;
}
.form em {
    padding-left: 2px;
    font-size: 11px;
    font-style: normal;
}
.form span.field {
    float: left;
    width: 120px;
    padding-top: 1px;
    font-size: 14px;
}
.form span.smallfield {
    float: left;
    width: 75px;
    padding-top: 1px;
}
.form span.mediumfield {
    float: left;
    width: 180px;
    padding-top: 1px;
}
.req {
    border-left: 3px solid #d84545;
}
input.req {
    border-left: 3px solid #d84545;
}
select.medium {
    width: 164px;
    background-position: 140px 5px;
    margin-bottom: 2px;
}
select.large {
    width: 224px;
    background-position: 200px 5px;
    margin-bottom: 2px;
}
select.multi {
    background-position: -2000px 5px;
    height: 100px;
}
input.small,
select.small {
    width: 80px;
    background-position: 60px 5px;
}
input.medium {
    width: 150px;
}
input.large {
    width: 210px;
}
input.extra-large {
    width: 430px;
    background-position: -2000px 5px;
}
input.half {
    width: 104px;
}
textarea.small {
    width: 80px;
    margin-bottom: 2px;
    background-position: -2000px 5px;
}
textarea.medium {
    width: 164px;
    margin-bottom: 2px;
    background-position: -2000px 5px;
}
textarea.large {
    width: 210px;
    margin-bottom: 2px;
    background-position: -2000px 5px;
}
a.abort {
    color: #d84545;
    padding: 0;
    margin: 0;
    border: 0;
    text-decoration: underline;
}
a.abort:hover {
    color: #fff;
    background-color: #d84545;
    border: 0;
    text-decoration: none;
}
.pagination ul {
    background-color: transparent;
    float: left;
    margin: 2px 0;
    padding: 0;
    list-style: none;
    border: 1px solid #ddd;
}
.pagination ul li {
    float: left;
    line-height: 12px;
}
.pagination li a {
    background: #fff;
    display: block;
    padding: 8px 10px;
    text-decoration: none;
    color: #444;
    border: 0;
    font-size: 11px;
    font-weight: normal;
    line-height: 12px;
}
.pagination ul li a:hover {
    background-color: #ddd;
    text-decoration: none;
    color: #444;
    border: 0;
}
.pagination li.active,
.pagination li.active a {
    font-weight: bold;
    background: #ddd;
}
.pagination:after {
    content: '.';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.leanModal {
    background: #fff;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.7);
    display: none;
    width: 700px;
    margin-top: 0;
}
.leanModalContent {
    padding: 15px;
    margin-bottom: 10px;
    max-height: 400px;
    overflow: auto;
}
.leanModalHeader {
    background: #f5f5f5;
    border-bottom: 1px solid #ddd;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    padding: 5px 15px;
}
.leanModalHeader h3 {
    border: 0;
    padding: 5px;
    padding-top: 10px;
    margin: 0;
    color: #555;
}
.leanModalButtons {
    padding: 15px;
    margin-bottom: 2px;
    border-top: 1px solid #ddd;
    background: #f5f5f5;
}
#lean_overlay {
    position: fixed;
    z-index: 100;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: #000;
    display: none;
}
.modal-dialog {
    width: 500px;
}
.modal-caption {
    padding-top: 0;
    margin-top: 0;
}
.button.drag {
    cursor: move;
}
.progress {
    background-color: #f9f9f9;
    border: 2px solid #eee;
    height: 20px;
    padding: 3px;
    width: 350px;
    margin: 5px 0;
}
.progress span {
    display: inline-block;
    height: 100%;
}
.blue span {
    background-color: #34c2e3;
}
.orange span {
    background-color: #fecf23;
}
.green span {
    background-color: #a5df41;
}
.stripes span {
    -webkit-background-size: 30px 30px;
    -moz-background-size: 30px 30px;
    background-size: 30px 30px;
    background-image: -webkit-gradient(
        linear,
        left top,
        right bottom,
        color-stop(0.25, rgba(255, 255, 255, 0.15)),
        color-stop(0.25, transparent),
        color-stop(0.5, transparent),
        color-stop(0.5, rgba(255, 255, 255, 0.15)),
        color-stop(0.75, rgba(255, 255, 255, 0.15)),
        color-stop(0.75, transparent),
        to(transparent)
    );
    background-image: -webkit-linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.15) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255, 255, 255, 0.15) 50%,
        rgba(255, 255, 255, 0.15) 75%,
        transparent 75%,
        transparent
    );
    background-image: -moz-linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.15) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255, 255, 255, 0.15) 50%,
        rgba(255, 255, 255, 0.15) 75%,
        transparent 75%,
        transparent
    );
    background-image: -ms-linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.15) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255, 255, 255, 0.15) 50%,
        rgba(255, 255, 255, 0.15) 75%,
        transparent 75%,
        transparent
    );
    background-image: -o-linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.15) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255, 255, 255, 0.15) 50%,
        rgba(255, 255, 255, 0.15) 75%,
        transparent 75%,
        transparent
    );
    background-image: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.15) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255, 255, 255, 0.15) 50%,
        rgba(255, 255, 255, 0.15) 75%,
        transparent 75%,
        transparent
    );
    -webkit-animation: animate-stripes 3s linear infinite;
    -moz-animation: animate-stripes 3s linear infinite;
}
@-webkit-keyframes animate-stripes {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 60px 0;
    }
}
@-moz-keyframes animate-stripes {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 60px 0;
    }
}
.glow span {
    -moz-box-shadow:
        0 5px 5px rgba(255, 255, 255, 0.7) inset,
        0 -5px 5px rgba(255, 255, 255, 0.7) inset;
    -webkit-box-shadow:
        0 5px 5px rgba(255, 255, 255, 0.7) inset,
        0 -5px 5px rgba(255, 255, 255, 0.7) inset;
    box-shadow:
        0 5px 5px rgba(255, 255, 255, 0.7) inset,
        0 -5px 5px rgba(255, 255, 255, 0.7) inset;
    -webkit-animation: animate-glow 1s ease-out infinite;
    -moz-animation: animate-glow 1s ease-out infinite;
}
@-webkit-keyframes animate-glow {
    0% {
        -webkit-box-shadow:
            0 5px 5px rgba(255, 255, 255, 0.7) inset,
            0 -5px 5px rgba(255, 255, 255, 0.7) inset;
    }
    50% {
        -webkit-box-shadow:
            0 5px 5px rgba(255, 255, 255, 0.3) inset,
            0 -5px 5px rgba(255, 255, 255, 0.3) inset;
    }
    100% {
        -webkit-box-shadow:
            0 5px 5px rgba(255, 255, 255, 0.7) inset,
            0 -5px 5px rgba(255, 255, 255, 0.7) inset;
    }
}
@-moz-keyframes animate-glow {
    0% {
        -moz-box-shadow:
            0 5px 5px rgba(255, 255, 255, 0.7) inset,
            0 -5px 5px rgba(255, 255, 255, 0.7) inset;
    }
    50% {
        -moz-box-shadow:
            0 5px 5px rgba(255, 255, 255, 0.3) inset,
            0 -5px 5px rgba(255, 255, 255, 0.3) inset;
    }
    100% {
        -moz-box-shadow:
            0 5px 5px rgba(255, 255, 255, 0.7) inset,
            0 -5px 5px rgba(255, 255, 255, 0.7) inset;
    }
}
.shine span {
    position: relative;
}
.shine span::after {
    content: '';
    opacity: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #fff;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -webkit-animation: animate-shine 2s ease-out infinite;
    -moz-animation: animate-shine 2s ease-out infinite;
}
@-webkit-keyframes animate-shine {
    0% {
        opacity: 0;
        width: 0;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        opacity: 0;
        width: 95%;
    }
}
@-moz-keyframes animate-shine {
    0% {
        opacity: 0;
        width: 0;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        opacity: 0;
        width: 95%;
    }
}
.alert {
    padding: 15px;
    margin: 10px 0;
    background-color: #34495e;
    color: #fff;
    border-radius: 4px;
}
.alert-silver {
    background-color: #bdc3c7;
    color: #3d4448;
}
.alert-success {
    background-color: #cbdd86;
    color: #424e16;
    border: 2px solid #a8c637;
}
.alert-notice {
    background-color: #f1c40f;
    color: #312803;
}
.alert-warning {
    background-color: #c0392b;
}
.criteria-container {
    max-width: 500px;
    margin-right: 180px;
    text-align: right;
}
.criteria-tag {
    background-color: #ecf0f1;
    border-bottom: 1px solid #bdc3c7;
    color: #666;
    padding: 2px 4px;
    margin: 1px;
    display: inline-block;
    max-width: 125px;
    overflow: none;
    font-weight: normal;
    font-size: 0.9em;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.schedule-container {
    border: 0;
    overflow: auto;
}
.schedule-container th > small {
    font-weight: normal;
}
.schedule-container td.weekend {
    background-color: #faeff0;
}
.schedule-day-actions {
    border-bottom: 1px dashed #ddd;
    min-height: 30px;
    margin-bottom: 4px;
    padding-top: 3px;
    padding-bottom: 0;
}
.schedule-day-actions > .button-container {
    display: none;
    position: relative;
    right: 0;
    top: 0;
}
.schedule-day-actions:hover > .button-container {
    display: block;
}
.schedule-event-actions {
    display: none;
    position: inherit;
    right: 0;
    top: 0;
}
.schedule-event-top {
    padding: 0 4px;
}
.schedule-event-top > .schedule-event-actions {
    display: none;
    position: inherit;
    right: 0;
    top: 0;
}
.schedule-event-top:hover > .schedule-event-actions {
    display: block;
}
.schedule-event-top:hover > .schedule-event-status {
    display: none;
}
.schedule-event {
    padding: 2px 4px;
    margin-bottom: 2px;
    border: 0 solid transparent;
    border-radius: 4px;
    font-size: 11px;
    cursor: pointer;
    min-width: 130px;
}
.schedule-event-container {
    padding: 0 4px;
}
.schedule-event {
    background-color: #d4d4d4;
    color: #080808;
}
.schedule-event.yellow {
    background-color: #ffe7b1;
    color: #7e5700;
}
.schedule-event.green {
    background-color: #c5e0b3;
    color: #44692b;
}
.schedule-event.purple {
    background-color: #f9c8ea;
    color: #af137f;
}
.schedule-event.blue {
    background-color: #b3cbef;
    color: #1c4787;
}
.schedule-event.red {
    background-color: #f6c8b0;
    color: #963f11;
}
.schedule-event:hover {
    background-color: #dfdfdf;
}
.schedule-event.yellow:hover {
    background-color: #ffedc5;
}
.schedule-event.green:hover {
    background-color: #d0e6c1;
}
.schedule-event.purple:hover {
    background-color: #fbdaf1;
}
.schedule-event.blue:hover {
    background-color: #c4d7f3;
}
.schedule-event.red:hover {
    background-color: #f8d5c2;
}
.schedule-event a {
    color: #3b3b3b;
}
.schedule-event.yellow a {
    color: #7e5700;
}
.schedule-event.green a {
    color: #44692b;
}
.schedule-event.purple a {
    color: #af137f;
}
.schedule-event.blue a {
    color: #1c4787;
}
.schedule-event.red a {
    color: #963f11;
}
.schedule-event a:hover {
    color: #222;
}
.schedule-event.yellow a:hover {
    color: #4b3400;
}
.schedule-event.green a:hover {
    color: #2c451c;
}
.schedule-event.purple a:hover {
    color: #810e5e;
}
.schedule-event.blue a:hover {
    color: #13315d;
}
.schedule-event.red a:hover {
    color: #682b0c;
}
.schedule-event-status {
    float: right;
}
.schedule-event-actions {
    float: right;
}
.schedule-status {
    height: 32px;
    max-height: 32px;
    margin-top: 3px;
}
.schedule-time-gap {
    margin-bottom: 2px;
    margin-left: 10px;
    margin-right: 10px;
    text-align: center;
    background-color: #e1efd7;
    color: #44692b;
    border: 1px solid #c5e0b3;
    font-size: x-small;
    border-radius: 4px;
}
.schedule-time-collapse {
    margin-bottom: 2px;
    margin-left: 10px;
    margin-right: 10px;
    text-align: center;
    background: #c0392b;
    color: #fff;
    text-shadow: 1px 1px #6d2018;
    font-size: x-small;
    border-radius: 4px;
}
.transparent-booking {
    -moz-opacity: 0.5;
    filter: alpha(opacity=50);
    opacity: 0.5;
}
.reset-transparency {
    -moz-opacity: 1;
    filter: alpha(opacity=100);
    opacity: 1;
}
.schedule-event-left-border {
    border-left: 4px solid transparent;
}
.schedule-event-left-border-info {
    border-color: #7bb0ce;
}
.schedule-event-left-border-success {
    border-color: #a6cb61;
}
.schedule-event-left-border-warning {
    border-color: #c0392b;
}
.schedule-event-left-border-important {
    border-color: #c0392b;
}
.schedule-event-left-border-transparent {
    border-color: transparent;
}
.schedule-event-left-border-turquoise {
    border-color: #1abc9c;
}
.schedule-event-left-border-greensea {
    border-color: #16a085;
}
.schedule-event-left-border-peterriver {
    border-color: #3498db;
}
.schedule-event-left-border-belizehole {
    border-color: #2980b9;
}
.schedule-event-left-border-amethyst {
    border-color: #9b59b6;
}
.schedule-event-left-border-wisteria {
    border-color: #8e44ad;
}
.schedule-event-left-border-wetasphalt {
    border-color: #34495e;
}
.schedule-event-left-border-midnightblue {
    border-color: #2c3e50;
}
.schedule-event-left-border-sunflower {
    border-color: #f1c40f;
}
.schedule-event-left-border-orange {
    border-color: #f39c12;
}
.schedule-event-left-border-carrot {
    border-color: #e67e22;
}
.schedule-event-left-border-pumpkin {
    border-color: #d35400;
}
.schedule-event-left-border-alizarin {
    border-color: #e74c3c;
}
.schedule-event-left-border-pomegranate {
    border-color: #c0392b;
}
.schedule-event-left-border-clouds {
    border-color: #ecf0f1;
}
.schedule-event-left-border-silver {
    border-color: #bdc3c7;
}
.schedule-event-left-border-concrete {
    border-color: #95a5a6;
}
.schedule-event-left-border-asbestos {
    border-color: #7f8c8d;
}
.schedule-event-left-border-chocolate {
    border-color: #8f6048;
}
.leanModal.flipable {
    -webkit-perspective: 1000;
    -moz-perspective: 1000;
    perspective: 1000;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.7);
}
.do-flip {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
.flip-container {
    backface-visibility: hidden;
    -webkit-transition: 0.6s;
    -webkit-transform-style: preserve-3d;
    -moz-transition: 0.6s;
    -moz-transform-style: preserve-3d;
    transition: 0.6s;
    transform-style: preserve-3d;
    position: relative;
}
.flip-front,
.flip-back {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.7);
}
.flip-front {
    z-index: 2;
}
.flip-back {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
.callout {
    border: 0;
    border-left: 5px solid #eee;
    margin: 20px 0;
    padding: 15px 30px 15px 15px;
    border-radius: 4px;
    line-height: 16px;
    font-size: 12px;
}
.callout h4 {
    color: #222;
    font-size: 15px;
    margin-bottom: 5px;
}
.callout hr {
    border: 0;
    border-bottom: 2px solid #d0e3f0;
}
.callout-info {
    background-color: #f0f7fd;
    border-color: #d0e3f0;
}
.callout-info hr {
    border-color: #d0e3f0;
}
.callout-danger {
    background-color: #fcf2f2;
    border-color: #dfb5b4;
}
.callout-danger hr {
    border-color: #dfb5b4;
}
.callout-warning {
    background-color: #fefbed;
    border-color: #f1e7bc;
}
.callout-warning hr {
    border-color: #f1e7bc;
}
.callout-success {
    background-color: #edfeed;
    border-color: #8fde8c;
}
.callout-success hr {
    border-color: #c0f1bc;
}
body {
    background-color: #f7f7f7;
    color: #333;
    font-family: Sans-serif, Verdana, Geneva, Arial, Helvetica;
    font-size: 13px;
    margin: 0;
    padding: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
a {
    color: #556aa1;
    text-decoration: none;
    outline: 0;
}
a:active {
    outline: 0;
}
a:focus {
    outline: 0;
}
a:hover {
    background: transparent;
    text-decoration: underline;
}
a img {
    vertical-align: middle;
}
a.action {
    color: #3a9abb;
}
a.action:hover {
    color: #2e7a94;
    background-color: transparent;
}
.text-align-right {
    text-align: right;
}
.clearfix {
    content: '.';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.content-wrap {
    background: none repeat scroll 0 0 #fff;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
    margin-top: 0;
    width: 100%;
    flex: 1;
}
.content {
    padding: 10px 50px 30px 50px;
}
.content h1,
h2,
h3,
h4,
h5,
h6 {
    color: #556aa1;
}
.content h1 {
    font-size: 23px;
    font-weight: normal;
}
.content-column {
    float: left;
    width: 32%;
    margin-right: 1%;
    background: transparent;
}
.content-column-left {
    float: left;
    width: 49%;
    margin-right: 1%;
    background: transparent;
}
.content-column-right {
    float: right;
    width: 49%;
    margin-left: 1%;
    background: transparent;
}
footer {
    text-align: center;
    margin: 20px;
    font-size: 14px;
}
footer a {
    color: #556aa1;
    text-decoration: none;
}
h1.breadcrumb {
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    padding-bottom: 15px;
}
h1.breadcrumb a {
    color: #556aa1;
}
h1.breadcrumb a:hover {
    text-decoration: underline;
    background: transparent;
}
h1.breadcrumb strong {
    color: #888;
}
h1.breadcrumb small {
    color: #888;
}
.select2-dropdown.select2-dropdown--below {
    width: max-content !important;
    max-width: 450px !important;
}

.locked {
    opacity: 1;
    color: inherit;
    border-color: transparent;
    background-color: transparent;
    padding-left: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

[data-lock]::after {
    content: '\F040';
    font-family: 'FontAwesome';
    margin-left: 6px;
    font-size: 1em !important;
    color: inherit;
    cursor: pointer;
}

.unlocked::after {
    content: '\F046';
}

.form-inline {
    display: flex;
    gap: 8px;
    align-items: center;
}
.cost-center-info-row {
    display: flex;
    flex-direction: row;
    gap: 15px;
    margin-bottom: 10px;
}
.cost-center-info-row .info-container {
    flex: 1;
    display: flex;
    flex-direction: row;
    gap: 15px;
    margin: 0;
}

.small-text {
    font-size: 0.7rem;
}

.bg-white {
    background-color: #fff !important;
}

ul.list-unstyled,
ol.list-unstyled {
    list-style: none;
    margin: 0;
    padding: 0;
}
.workorderline-options-group a,
.workorderline-table i {
    padding-left: 3px;
    padding-right: 3px;
}

a.button.locked {
    color: #aaa;
    cursor: not-allowed;
}
input.invalid,
textarea.invalid {
    border: 1px solid red;
    color: red;
}
.validation-danger {
    color: red;
}
.margin-top-10 {
    margin-top: 10px;
}
.margin-left-5 {
    margin-left: 5px;
}

.crmform {
    border: 0;
    width: auto !important;
}
.crmform th,
.crmform td {
    border: 0;
    padding: 0px;
}

span.workorder-status {
    display: block;
    width: 100%;
    height: 100%;
    padding: 5px 0;
    text-align: center;
    color: #000;
}

.workorder-new {
}

.workorder-work {
    background: #f9c45a;
}

.workorder-estimate {
    background: #b5eaf7;
}

.workorder-ordered {
    background: #c6d870;
}

.workorder-closed {
    background: #494949;
    color: #fff !important;
}

.workorder-idle {
    background: #ddd;
}

.workorder-deleted {
}

.skeleton {
    background: linear-gradient(0.25turn, transparent, #fff, transparent),
        linear-gradient(#eee, #eee);
    background-repeat: no-repeat;
    background-position:
        -2000px 0,
        0 0,
        0px 190px,
        50px 195px;
    animation: skeleton 1.5s infinite linear;
    cursor: progress;
}

.skeleton span.text-placeholder {
    display: inline-block;
    height: 12px;
    border-radius: 10px;
    background: #ddd;
    margin: 0 10px;
}

.skeleton span.text-placeholder.short {
    width: 75px;
}

.skeleton span.text-placeholder.medium {
    width: 100px;
}

.skeleton span.text-placeholder.long {
    width: 200px;
}

@keyframes skeleton {
    to {
        background-position:
            2000px 0px,
            0 0,
            0 190px,
            50px 195px;
    }
}

.ajax-error {
    display: block;
    font-family: 'Roboto', sans-serif;
    width: 100%;
    text-align: center;
}

.ajax-error .ajax-error-content {
    display: flex;
    width: 100%;
    color: #00495e;
    justify-content: space-around;
    aligh-items: center;
    text-align: center;
    width: 60%;
    margin: 0 20%;
    flex-direction: column;
}

.ajax-error .ajax-error-content h3 {
    font-size: 40px;
    font-weight: bold;
    color: #00495e;
    margin: 0;
    padding: 0;
}

.ajax-error .ajax-error-content p {
    text-align: center;
    font-weight: 500;
    font-size: 20px;
}

.ajax-error img {
    width: 150px;
    height: auto;
}

.ajax-error .ajax-error-footer {
    font-weight: 700;
}

.text-tag {
    cursor: pointer;
    border-bottom: 1px dotted #555;
    color: blue;
}

.text-tag-container {
    width: 385px;
    padding: 10px;
    background: #eee;
    border-bottom: 2px solid #ddd;
    margin-bottom: 10px;
}

span.validation-help-text {
    display: none;
    font-size: 0.9em;
    color: red;
    padding: 2px 0 8px 2px;
}

span.validation-help-text.visible {
    display: block !important;
}

span.validation-help-text.right.visible {
    display: inline-block !important;
}

input.dirty,
select.dirty,
textarea.dirty {
    border-color: red !important;
    outline: red !important;
    vertical-align: top;
}

div.notification-banner {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* padding-bottom: 10px; */
    box-shadow: 0px -20px 20px 10px #599bdc;
    background-color: #599bdc;
    margin-top: -2px;
    padding: 0;
    font-size: 1.2em;
    margin: 0;
    transition: all 0.3s;
}
div.notification-banner.danger {
    display: flex;
    box-shadow: 0px -20px 20px 10px #dc5959 !important;
    background-color: #dc5959 !important;
}

div.notification-banner a {
    color: #ddd;
}
div.notification-banner p {
    margin: 0 0 10px 0;
}

div.message-summary {
    color: white;
}
div.message-body {
    display: none;
    width: 80%;
}

div.message-content {
    background-color: whitesmoke;
    border-radius: 10px;
    padding: 20px;
    margin: 20px 0;
    border-left: 5px solid #ddd;
}
div.message-content:first-child {
    background-color: whitesmoke;
    border-radius: 10px;
    padding: 20px;
    margin: 10px 0;
}
div.message-button {
    /* padding: 20px; */
    margin: 20px 0 20px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

div.message-overlay {
    background-color: #2e2e2e33;
    height: 0;
    z-index: 5;
}

div.notification-banner.opened {
    box-shadow: 0px -20px 20px 10px #2e2e2e;
    background-color: #2e2e2e;
    justify-content: flex-start;
    overflow-y: scroll;
    height: calc(100vh - 120px);
    display: flex;
}

.message-content.danger {
    background-color: #fcf2f2 !important;
    border-color: #dfb5b4 !important;
}

.message-content.warning {
    background-color: #fefbed !important;
    border-color: #f1e7bc !important;
}

.message-content.info {
    background-color: #f0f7fd !important;
    border-color: #d0e3f0 !important;
}

div.info-text {
    overflow-x: hidden;
    box-sizing: border-box;
}

div.message-content *,
div.info-text * {
    max-width: 100%;
    overflow-x: auto;
}

@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,500,700,900);

:root {
    --border-color: #ddd;
}

/**
 * --------------------------
 * TYPOGRAPHY
 * --------------------------
 */

a.hoverless:hover {
    text-decoration: none;
}

.flex {
    display: flex;
}

.justify-content-space {
    justify-content: space-between;
}

.justify-content-center {
    justify-content: center;
}

.align-items-center {
    align-items: center;
}

.w-100 {
    width: 100%;
}

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

.text-red {
    color: #ff0000;
}

.text-smallish {
    font-size: 85%;
}

.text-muted {
    color: #999;
}

.text-uppercase {
    text-transform: uppercase;
}

.fw-normal {
    font-weight: 400;
}

.text-center {
    text-align: center;
}

.content-with-linebreaks {
    white-space: pre-wrap;
    word-wrap: break-word;
}

/**
 * --------------------------
 * BUTTONS
 * --------------------------
 */

.button-flat {
    border: 0;
    padding: 0;
    background-color: transparent;
}

/**
 * --------------------------
 * FLEX
 * --------------------------
 */

.flex-row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
}
.flex-column {
    display: flex;
    flex-direction: column;
}

.flex-row > div {
    display: flex;
    flex-direction: column;
    flex-basis: 100%;
    flex: 1;
}

/**
 * --------------------------
 * UTILS
 * --------------------------
 */

.bg-white {
    background-color: #fff !important;
}

.opacity-50 {
    opacity: 0.5;
}

.d-block {
    display: block;
}

.d-none {
    display: none;
}

/**
 * --------------------------
 * LOADER
 * --------------------------
 */

.loading-spinner {
    padding: 16px;
}

.loading-spinner span {
    width: 32px;
    height: 32px;
    border: 4px solid #34485e;
    border-bottom-color: #4bb34c;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

.spinner-loader {
    width: 100%;
    height: 100%;
    border: 3px solid #34485e;
    border-bottom-color: #4bb34c;
    border-radius: 50%;
    display: block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/**
 * --------------------------
 * EXTERNAL
 * --------------------------
 */

body.external {
    background-color: #f7f7f7;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

body.external main {
    background-color: #fff;
    padding: 15px 25px 25px 25px;
    border-bottom: 1px solid #ddd;
    flex-grow: 1;
}

body.external .logo {
    width: 100px;
    margin: 30px auto auto auto;
}

body.external .content {
    width: 300px;
    margin: 0 auto;
    margin-top: 50px;
    background-color: #eee;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.2),
        0 0 1px rgba(0, 0, 0, 0.3),
        0 0 1px 1px rgba(255, 255, 255, 0.2) inset,
        0 1px 0 rgba(255, 255, 255, 0.2) inset,
        0 -1px 2px rgba(0, 0, 0, 0.05) inset;
    padding: 25px;
    padding-bottom: 15px;
}

body.external form {
    box-sizing: border-box;
}

body.external form input {
    width: 100%;
    box-sizing: border-box;
}

body.external form .buttonbar {
    border: 1px solid #ddd;
}

/**
 * --------------------------
 * BUTTONS
 * --------------------------
 */

button:disabled,
.disabled-link-button {
    opacity: 0.5;
}

.button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
}

.disabled-link-button {
    pointer-events: none;
}

/**
 * --------------------------
 * FORMS
 * --------------------------
 */

.form-error {
    padding: 3px 0;
    color: #ff0000;
}

.border-red {
    border: 1px solid #ff0000;
}

input,
select {
    border: 1px solid rgb(133, 133, 133);
    border-radius: 2px;
    box-sizing: border-box;
    line-height: 1.2em;
}

input.input-invisible,
input.input-invisible:focus {
    border: 0;
    outline: none;
    cursor: default;
}

.text-tag-container ul li:not(:last-child)::after {
    content: '|';
}

.input-with-icon {
    border: 1px solid rgb(133, 133, 133);
    border-radius: 2px;
}

.input-with-icon input {
    border: 0;
}

.input-with-icon input:focus {
    outline: none;
}

.input-with-icon .input-icon {
    padding: 1px 4px;
    background-color: #ddd;
}

.input-with-right-icon .input-icon {
    border-left: 1px solid rgb(133, 133, 133);
}

.multi-checkbox-wrapper,
.multi-select-dropdown {
    border: 1px solid rgb(133, 133, 133);
    background-color: #fff;
    padding: 2px;
    max-height: 100px;
    overflow-y: auto;
}

textarea.textarea-fixed {
    resize: none;
}

div[contenteditable] {
    color: #333;
}

div[contenteditable]:not([disabled]) {
    border: 1px solid rgb(133, 133, 133);
    padding: 1px 2px;
}

input.full,
textarea.full,
select.full,
input.extra-large,
textarea.extra-large,
select.extra-large,
div[contenteditable].extra-large {
    margin-bottom: 2px;
}

input.full,
textarea.full,
select.full,
div[contenteditable].full {
    width: 100%;
}

input.extra-large,
textarea.extra-large,
select.extra-large,
div[contenteditable].extra-large {
    width: 500px;
}

.locked-input {
    display: flex;
    gap: 8px;
    align-items: center;
}

.locked-input .locked-input-large {
    width: 224px;
}

.locked-input .locked-input-full {
    width: 100%;
}

.locked-input i {
    cursor: pointer;
    color: #556aa1;
}

.locked-input [x-cloak] { 
    display: none !important; 
}

.multi-select-container {
    position: relative;
}

.multi-select-dropdown {
    position: absolute;
    top: 20px;
    left: 0;
    right: 0;
    visibility: hidden;
    opacity: 0;
    z-index: 20;
    max-height: 200px;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
}

.multi-select-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    visibility: hidden;
    opacity: 0;
    z-index: 10;
}

.multi-select-container.open > .multi-select-dropdown,
.multi-select-container.open > .multi-select-overlay {
    visibility: visible;
    opacity: 1;
}

.multi-select-dropdown label {
    display: flex;
    align-items: center;
    padding: 2px 4px;
    cursor: pointer;
}

.multi-select-dropdown input[type='checkbox'] {
    margin-right: 4px;
}

.multi-select-dropdown hr {
    border: 0;
    background: #ddd;
    height: 1px;
    margin: 4px;
}

.select2-container {
    z-index: 100;
}

.select2-container--open {
    z-index: 99999;
}

/**
 * -------------------------
 * TABLES
 * -------------------------
 */

table.table-striped tr:nth-child(even) {
    background-color: #f6f6f6 !important;
}

table .auto-width {
    width: 1%;
    white-space: nowrap;
}

table .action-width {
    width: 36px;
}

table.form .edit-label-width {
    width: 120px;
}

/**
 * -------------------------
 * Summary
 * -------------------------
 */
.summary {
    background-color: #fcfcfc;
    color: #333;
    padding: 0;
    max-width: 32%;
    min-width: 32%;
    font-size: 14px;
    float: left;
    margin-left: 0;
    margin-right: 10px;
    margin-top: 15px;
    border-radius: 0;
    border: 1px solid #dedede;
}
.summary h2 {
    background-color: #f4f4f4;
    border-bottom: 1px solid #dedede;
    color: #555;
    margin: 0;
    padding: 6px;
    font-weight: normal;
    text-transform: uppercase;
    font-size: 14px;
    line-height: 16px;
}
.summary h2 > i {
    border-right: 1px solid #d5d5d5;
    padding-left: 4px;
    padding-right: 10px;
    margin-right: 8px;
    font-size: 18px;
    color: #444;
}
.summary h2 > i.green {
    color: #a3be8c;
}
.summary h2 > i.red {
    color: #bf616a;
}
.summary h2 > i.yellow {
    color: #ebcb8b;
}
.summary h2 > i.purple {
    color: #b48ead;
}

.summary-cell {
    padding: 10px;
    text-align: left;
}
.summary-cell tr > td:first-child {
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
}
.summary-cell tr > td:last-child {
    font-size: 13px;
    text-align: right;
}
.summary-table td,
.summary-table tr {
    border: 0;
    line-height: 10px;
}
.summary-cell tr > td > small {
    font-weight: normal;
    font-size: 10px;
}
.summary-cell tr:hover {
    background-color: #f3f3f3;
    cursor: context-menu;
}

/**
 * -------------------------
 * LISTS
 * -------------------------
 */

ul.list-unstyled,
ol.list-unstyled {
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.list-inline li {
    display: inline-block;
}

/**
 * -------------------------
 * PAGINATION
 * -------------------------
 */

ul.pagination {
    border: 1px solid var(--border-color);
    display: inline-flex;
    padding-left: 0;
    list-style: none;
}

ul.pagination > li.active > span.page-link {
    background-color: var(--border-color);
    font-weight: bold;
}

.page-link {
    background: #fff;
    display: block;
    padding: 8px 10px;
    text-decoration: none;
    color: #444;
    font-size: 11px;
    font-weight: normal;
    line-height: 12px;
}

/**
 * --------------------------
 * ANIMATIONS
 * --------------------------
 */

.zoom {
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.zoom:hover {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

.link {
    cursor: pointer;
}

.colored-link {
    color: #556aa1;
}

/**
 * --------------------------
 * Info containers
 * --------------------------
 */
.info-container {
    margin: 16px 0;
}
.info-container h2 {
    margin-bottom: 8px;
}
.info-container div {
    background-color: #f0f7fd;
    padding: 8px 12px;
}

.info-container p {
    max-width: 900px;
    margin: 8px 0;
}

/**
 * --------------------------
 * Tabs
 * --------------------------
 */

.tab-inline-edit-grid {
    column-gap: 32px;
    display: grid;
    margin-bottom: 64px;
}
.tab-inline-edit-grid .column {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.tab-inline-edit-grid .column .row {
    align-items: center;
    display: flex;
    gap: 4px;
}
.tab-inline-edit-grid .column .row .row-label {
    align-items: flex-end;
    cursor: pointer;
    display: flex;
    flex: 1;
    justify-content: space-between;
    padding: 0;
}
.tab-inline-edit-grid .column .row .row-input-field {
    box-sizing: border-box;
    height: 20px;
    padding: 1px 2px;
    width: 210px;
}
.tab-inline-edit-grid .column .row #e-invoice-address::after {
    content: '\F040';
    font-family: 'FontAwesome';
    margin-left: 6px;
    font-size: 1em !important;
    color: inherit;
    cursor: pointer;
}

/**
 * --------------------------
 * Off Canvas
 * --------------------------
 */
.off-canvas {
    background: white;
    box-sizing: border-box;
    border-left: 1px solid #ccc;
    bottom: 0px;
    height: calc(100vh - 113px);
    position: fixed;
    overflow-y: auto;
    right: -500px;
    top: 113px;
    transition: right 0.5s ease-in-out 0.1s;
    width: 500px;
    z-index: 50;
    padding: 16px 12px;

    display: flex;
    flex-direction: column;

    box-shadow: 0px 0px 8px -3px rgba(0, 0, 0, 0.75);
    -webkit-box-shadow: 0px 0px 8px -3px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 0px 8px -3px rgba(0, 0, 0, 0.75);
}

.off-canvas .flex-col-full {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.off-canvas h2 {
    color: #000;
    margin-bottom: 0;
}

.off-canvas form > div div,
.off-canvas form > div input,
.off-canvas form > div select {
    flex: 1;
    box-sizing: border-box;
    height: 20px;
    padding: 1px 2px;
}

.off-canvas > div {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding-bottom: 32px;
    overflow: hidden;
    gap: 12px;
}

.off-canvas .add-address-form-container,
.off-canvas .register-company-einvoice {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.off-canvas .add-address-form-container form {
    padding: 16px 12px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: #f5f5f5;
    border-radius: 4px;
}
.off-canvas .add-address-form-container form > div {
    display: flex;
    align-items: center;
}

.off-canvas .add-address-form-container label {
    font-weight: bold;
    width: 110px;
}

.off-canvas .form-action-container {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    margin-top: 16px;
}

.off-canvas .form-action-container .form-button {
    align-items: center;
    background-color: #eee;
    border-radius: 0.2em;
    color: #555;
    cursor: pointer;
    display: inline-flex;
    font-family: 'Roboto';
    gap: 4px;
    justify-content: center;
    margin: 0;
    outline: none;
    padding: 0.5em 1em;
    white-space: nowrap;
}

table.form .edit-label-width,
table.edit-labels tr td:nth-child(odd) {
    width: 120px;
}
.off-canvas .form-action-container .submit-button {
    background-color: #dde8ac;
}
.off-canvas .form-action-container .submit-button i {
    color: #88a604;
}

.off-canvas .form-action-container .cancel-button {
    background-color: #eee;
}
.off-canvas .form-action-container .cancel-button i {
    color: #d50000;
}
.off-canvas .form-action-container .new-button {
    background-color: #ccdbdf;
}
.off-canvas .form-action-container .new-button i {
    color: #004a5e;
}
.off-canvas .form-action-container .back-button {
    background-color: #34495e;
    color: white;
}
.off-canvas .form-action-container .back-button i {
    scale: 0.8;
}

.off-canvas .select-address-container {
    background: #f5f5f5;
    border-radius: 4px;
    padding: 16px 8px;
    display: flex;
    flex-direction: column;
}
.off-canvas .select-address-container .row {
    display: flex;
    align-items: center;
    background-color: white;
    padding: 8px 12px;
    margin-bottom: 8px;
    gap: 8px;
    border-radius: 4px;
}
.off-canvas .select-address-container .row:last-child {
    margin-bottom: 0;
}
.off-canvas .select-address-container .row .row-text {
    display: flex;
    flex-direction: column;
    justify-content: left;
    flex: 1;
    gap: 2px;
}

.einvoice-loader {
    width: 48px;
    height: 48px;
    border: 5px solid #34485e;
    border-bottom-color: #4bb34c;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.registration div {
    padding: 8px 12px;
}

.registration-success {
    background-color: #eef3d5;
    border-color: rgba(163, 194, 25, 0.5) !important;
}
.registration-success i {
    color: #a3c219;
}

/**
 * --------------------------
 * File upload progress
 * --------------------------
 */
#progress p {
    display: block;
    width: 240px;
    padding: 3px 5px;
    margin: 2px 0;
    font-size: 0.8em;
    border: 1px solid #446;
    background: #eee url('../img/progress.png') 100% 0 repeat-y;
}

#progress p.success {
    background: #0c0 none 0 0 no-repeat;
}

#progress p.failed {
    background: #c00 none 0 0 no-repeat;
}

/**
 * -------------------------
 * MODALS
 * -------------------------
 */

.modal-tabs {
    border-bottom: 1px solid #ddd;
}

.modal-tabs-feedback {
    padding: 0 15px;
}

/**
 * -------------------------
 * EMPLOYEES
 * -------------------------
 */

table.employee-add-availability-workarea-table,
table.employee-add-availability-service-table {
    width: 100%;
}

table.employee-add-availability-workarea-table thead tr,
table.employee-add-availability-workarea-table tbody tr {
    border: 1px solid rgba(0, 0, 0, 0.12);
}

table.employee-add-availability-workarea-table td.employee-add-availability-workarea-table-checkbox-column {
    width: 16px;
}

table.employee-add-availability-service-table thead tr,
table.employee-add-availability-service-table tbody tr {
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    border-right: 1px solid rgba(0, 0, 0, 0.12);
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    border-left: 4px solid rgba(0, 0, 0, 0.12);
}

table.employee-add-availability-service-table tbody tr.employee-add-availability-service-table-row-chocolate {
    border-left-color: #8f6048;
}

table.employee-add-availability-service-table tbody tr.employee-add-availability-service-table-row-info {
    border-left-color: #7bb0ce;
}

table.employee-add-availability-service-table tbody tr.employee-add-availability-service-table-row-success {
    border-left-color: #a6cb61;
}

table.employee-add-availability-service-table tbody tr.employee-add-availability-service-table-row-silver {
    border-left-color: #bdc3c7;
}

table.employee-add-availability-service-table tbody tr.employee-add-availability-service-table-row-sunflower {
    border-left-color: #f1c40f;
}

table.employee-add-availability-service-table tbody tr.employee-add-availability-service-table-row-amethyst {
    border-left-color: #9b59b6;
}

table.employee-add-availability-service-table tbody tr.employee-add-availability-service-table-row-midnightblue {
    border-left-color: #2c3e50;
}

table.employee-add-availability-service-table tbody tr.employee-add-availability-service-table-row-orange {
    border-left-color: #f39c12;
}

table.employee-add-availability-service-table tbody tr.employee-add-availability-service-table-row-pumpkin {
    border-left-color: #d35400;
}

table.employee-add-availability-service-table tbody tr.employee-add-availability-service-table-row-warning {
    border-left-color: #c0392b;
}

table.employee-add-availability-service-table tbody tr.employee-add-availability-service-table-row-alizarin {
    border-left-color: #e74c3c;
}

table.employee-add-availability-service-table tbody tr.employee-add-availability-service-table-row-greensea {
    border-left-color: #16a085;
}

table.employee-add-availability-workarea-table tbody tr td input[type='checkbox'].employee-add-availability-checkbox-primary {
    display: none;
}

.employee-documents-tab-connect-or-upload-row {
    display: flex;
    gap: 32px;
    justify-content: space-between;
    margin-bottom: 16px;
}

.employee-documents-tab-connect-or-upload-row button {
    align-self: flex-start;
}

/**
 * -------------------------
 * MAIN MENU NUMBER SEARCH
 * -------------------------
 */

.main-menu-number-search-inputs {
    position: relative !important;
    padding: 16px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

.main-menu-number-search-inputs > p {
    margin: 0 0 8px 0;
    color: #ffffff;
    text-shadow: 1px 1px #17181a;
}

.main-menu-number-search-inputs > form > .main-menu-number-search-input-container {
    position: relative !important;
    display: flex;
    flex-direction: 'row';
    border: 1px solid #8b8b8b;
    background-color: #3c3c3c;
    border-radius: 4px !important;
    align-items: center;
    gap: 4px;
    padding: 5px 6px;
}

.main-menu-number-search-inputs > form > .main-menu-number-search-input-container > span {
    color: rgba(255, 255, 255, 0.67);
    text-shadow: 1px 1px #17181a;
    font-size: 13px;
}

.main-menu-number-search-inputs > form > .main-menu-number-search-input-container > span::after {
    content: ":";
}

.main-menu-number-search-inputs > form > .main-menu-number-search-input-container > input {
    width: 100% !important;
    flex-grow: 1;
    border: 0 !important;
    background-color: transparent !important;
    color: #ffffff;
}

.main-menu-number-search-inputs > form > .main-menu-number-search-input-container > input:focus {
    outline: 0 !important;
    border: 0 !important;
}

/**
 * -------------------------
 * SUPPORT
 * -------------------------
 */

.support-tab-content {
    display: flex;
    gap: 32px;

    p {
        line-height: 1.5;
    }

    ul {
        list-style: none;
        margin: 0 0 16px 0;
        padding: 0;

        li {
            display: flex;
            gap: 8px;
            align-items: center;
            padding: 4px 0;

            i {
                font-size: 16px;
                color: #556aa1;
            }
        }
    }

    label {
        display: block;
        margin-bottom: 4px;
    }

    input,
    textarea,
    select {
        width: 100%;
    }

    .support-form-group {
        margin-bottom: 16px;
    }

    .support-tab-form-error,
    .support-tab-latest-error {
        line-height: 1.2;
        margin: 6px 0;
        color: #ff0000;
    }

    a.link-with-arrows::after {
        content: "\00BB";
        margin-left: 2px;
    }
}

.support-tab-content-column {
    width: 100%;
    max-width: 440px;
}

/**
 * -------------------------
 * INVOICING
 * -------------------------
 */

.invoicing-search-button-row {
    gap: 8px;
    margin: 16px 0;
}

#invoices-table > thead > tr > th > small {
    display: block;
    font-weight: 400;
}

ul.invoices-table-invoice-numbers-list,
ul.invoicing-search-label-explanations,
ul.invoices-table-taxreduction-dates-list {
    list-style: none;
    padding: 0;
}

ul.invoicing-search-label-explanations {
    margin: 16px 0;
    display: flex;
    align-items: center;
    gap: 16px;
}

ul.invoices-table-invoice-numbers-list,
ul.invoices-table-taxreduction-dates-list {
    margin: 0;
}

ul.invoices-table-invoice-numbers-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
}

ul.invoicing-search-label-explanations li span {
    margin-right: 8px;
    padding: 2px 6px;
}

.invoicing-search-summary-boxes {
    display: flex;
    gap: 8px;
}

.invoicing-search-summary-boxes .summary {
    float: none;
    align-self: flex-start;
    max-width: auto;
}

.invoices-table-odd,
.invoice-table-expansion-row table tbody tr:nth-child(odd) {
    background-color: #f9f9f9;
}

.invoices-table-debt-indicator {
    border-bottom: 2px dotted #ff0000;
}

.invoice-table-expansion-row {
    font-size: 11px;
    display: none;
}

.invoice-table-expansion-row-visible {
    display: table-row;
}

.invoice-table-expansion-row p {
    text-transform: uppercase;
    font-weight: bold;
    color: #888;
    margin: 4px 0;
}

.invoice-table-expansion-row table th,
.invoice-table-expansion-row table td {
    border: 0;
}

.invoice-table-expansion-row table:not(:last-child) {
    margin-bottom: 16px;
}

span.invoices-toggle-marked {
    cursor: pointer;
}

span.invoices-toggle-marked .fa-solid {
    color: #c0392b;
}

.invoicing-query-template-fields-hidden {
    display: none;
}

table.invoicing-search-table i {
    font-size: 14px;
}

table.invoicing-search-table thead tr th:nth-child(4) {
    width: 40px;
    min-width: 40px;
}

table.invoicing-search-table thead tr th:nth-child(5) {
    width: 124px;
    min-width: 124px;
}

table.invoicing-search-table tbody tr td:nth-child(4) {
    & div {
        display: flex;
        gap: 8px;
    }

    & a {
        color: inherit;
    }
}

.invoicing-search-table .has-multiple-journals {
    padding-right: 7px;
}

.invoicing-search-table .journal-count {
    display: none;
    position: absolute;
    top: -4px;
    right: -3px;
    height: 14px; 
    width: 14px; 
    border-radius: 50%; 
    text-align: center; 
    font-size: 8px; 
    line-height: 14px; 
    background-color: #556aa1; 
    color: #fff;
}

.invoicing-search-table .has-multiple-journals .journal-count {
    display: inline-block;
}

@media(max-width: 1200px) {
    .invoicing-search-summary-boxes {
        flex-flow: row wrap;
    }

    .invoicing-search-summary-boxes .summary {
        width: 100%;
        min-width: 100%;
    }

    .invoicing-search-button-row .button span {
        display: none;
    }
}

/**
 * -------------------------
 * SETUP
 * -------------------------
 */

.setup-permissions-radio-options {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.setup-permissions-radio-options > div {
    display: flex;
    align-items: center;
    gap: 8px;
}

.setup-permissions-radio-options > div > label {
    color: #556aa1;
    font-size: 12px;
    line-height: 1;
    letter-spacing: 0.05em;
    font-weight: bold;
}

.setup-permissions-radio-options > div > small {
    color: #555555;
    font-size: 10px;
    line-height: 1;
    letter-spacing: 0.05em;
}

.modal {
    display: none;
}

.foundation-modal .modal {
    display: block;
    position: fixed;
    content: '';
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.2);
    z-index: -1;
    opacity: 0;
    /*font-size: 0;*/
    transition:
        opacity 0.2s,
        z-index 0s 0.2s;
    text-align: center;
    overflow: hidden;
    overflow-y: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
}

.foundation-modal .modal > * {
    display: inline-block;
    white-space: normal;
    vertical-align: middle;
    text-align: left;
}

.foundation-modal .modal:before {
    display: inline-block;
    overflow: hidden;
    width: 0;
    height: 100%;
    vertical-align: middle;
    content: '';
}

.foundation-modal.modal-visible .modal {
    z-index: 99;
    opacity: 1;
    transition: opacity 0.2s;
}

.modal-inner {
    position: relative;
    overflow: hidden;
    max-width: 90%;
    max-height: 90%;
    overflow-x: hidden;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #aaa;
    z-index: -1;
    opacity: 0;
    transform: scale(0);
    transition:
        opacity 0.2s,
        transform 0.2s,
        z-index 0s 0.2s;
    min-height: 650px;
    min-width: 800px;
    /*padding: 20px;*/
    /*padding-top: 25px;*/
    box-shadow: -3px 3px 2px rgba(0, 0, 0, 0.2);
}

.modal-visible .modal-inner {
    z-index: 100;
    opacity: 1;
    transform: scale(1);
    transition:
        opacity 0.2s,
        transform 0.2s;
}
.modal-content {
    padding: 25px;
    padding-top: 45px;
}
/*
.modal-inner a[rel="modal:close"] {
  position: absolute;
  z-index: 2;
  right: 0;
  top: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  font-size: 16px;
  cursor: pointer;
  text-align: center;
  background: #fff;
  color: #888;
  background: #f6f6f6;
  border-bottom: 1px solid #ccc;
}
*/
.modal-footer {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 80%;
    margin: 0;
    padding: 0;
    margin-left: 10%;
    padding-top: 15px;
    padding-bottom: 15px;
    /*
    background: #eee;
    border-top: 1px solid #ccc;
    padding: 15px;
    */
    color: #777;
    border-top: 1px solid #eee;
    text-align: center;
}
.modal-caption {
    position: fixed;
    top: 0;
    left: 0;
    width: 80%;
    margin: 0;
    padding: 0;
    margin-left: 10%;
    height: 20px;
    padding-top: 10px;
    text-align: center;
    text-transform: uppercase;
    font-size: 0.7em;
    /*background: #f6f6f6;*/
    color: #777;
    border-bottom: 1px solid #eee;
}
/*
.modal-sidebar {
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  width: 50px;
  border-right: 1px solid #ccc;
  margin-bottom: 30px;
}
*/
a[rel='modal:close'] {
    color: red;
}
a[rel='modal:close']:hover {
    text-decoration: none;
    color: #fff;
    background: rgba(200, 0, 0, 0.6);
}

/*  */
.group-calendar-container {
    width: 230px;
    float: left;
}

.group-calendar-day {
    width: 16px;
    height: 12px;
    border: 0;
    border-bottom: 3px solid transparent;
    padding: 6px;
    float: left;
    margin-right: 3px;
    margin-bottom: 3px;
    color: #fff;
    text-align: center;
}

.group-calendar-day:hover {
    background-color: #555555;
    cursor: pointer;
}

.group-calendar-day-normal {
    background-color: grey;
}

.group-calendar-day-weekend {
    background-color: #aaa;
}

.group-calendar-day-selected {
    background-color: green;
}

.group-calendar-day-locked {
    background-color: #312c34;
}

.group-calendar-day-locked.group-calendar-day-weekend {
    background-color: #524d55;
}
.group-calendar-day-locked.group-calendar-day-weekend.group-calendar-day-selected {
    background-color: #524d55;
}

.group-calendar-day-selected.group-calendar-day-weekend {
    background-color: #5b805a;
}

.group-calendar-day-red {
    background-color: #942a25;
}

/*.group-calendar-day-red-selected {*/
.group-calendar-day-red.group-calendar-day-selected {
    background-color: green;
    border-bottom: 3px solid #942a25;
}

.group-calendar-day-original-date {
    background-color: #0f9ae0;
    /*background-image: repeating-linear-gradient(45deg, transparent, transparent 5px, rgba(15,154,224,.5) 5px, rgba(15,154,224,.4) 7px);*/
}

/*.group-calendar-day-original-date-selected {*/
.group-calendar-day-original-date.group-calendar-day-selected {
    background-color: green;
    border-bottom-color: #0f9ae0;
}

.group-calendar-day-today {
    background-color: #c48903;
}

.group-calendar-day-original-date.group-calendar-day-today {
    background-color: #0f9ae0;
    border-bottom-color: #c48903;
}

/*.group-calendar-day-today-selected {*/
.group-calendar-day-today.group-calendar-day-selected {
    background-color: green;
    border-bottom-color: #c48903;
}

.group-calendar-input {
    font-size: 11px;
    padding: 3px;
    width: 135px; /*207*/
    margin-bottom: 2px;
    border: 1px solid #ccc;
    border-left: 0;
    border-top: 0;
    border-right: 0;
    color: #666;
    padding-left: 10px;
}

.group-calendar-input::placeholder {
    color: #ccc;
}

.group-calendar-input:focus {
    border: 1px solid #666;
    border-left: 0;
    border-top: 0;
    border-right: 0;
    outline: none;
}

/* end */

.invoiceline-toolbar {
    position: absolute;
    left: 5px;
    top: 2px;
}
.invoiceline-toolbar-container {
    display: none;
    position: absolute;
    margin-left: -10px;
    margin-top: -5px;
    width: 150px;
}
.invoiceline:hover > div.invoiceline-toolbar {
    display: block;
}

.popoverContainer {
    display: inline-block;
    position: relative;
}
.popoverLabel {
    cursor: pointer;
}
.popoverPanel {
    position: absolute;
    min-width: 200px;
    background-color: #fff;
    padding: 5px;
    padding-left: 0;
    padding-right: 0;
    padding: 0;
    left: 0;
    /*
    top: -150px;
    */
    top: 0;
    margin-top: 25px;
    display: none;
    z-index: 2;
    border: 0;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    background-clip: padding-box;
    background-color: rgb(255, 255, 255);
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    box-shadow:
        rgba(100, 100, 100, 0.34902) 0px 0px 1px 0px,
        rgba(100, 100, 100, 0.34902) 0px 2px 4px 2px;
    box-sizing: border-box;
}
.popoverArrow:after {
    background-color: #fff;
    box-shadow:
        0 0 1px 0 rgba(0, 0, 0, 0.35),
        0 0 6px 0 rgba(0, 0, 0, 0.15);
    content: '';
    display: block;
    height: 10px;
    left: 4px;
    position: absolute;
    transform: rotate(45deg);
    width: 10px;
}
.popoverArrow {
    display: block;
    height: 7px;
    left: 50%;
    margin-left: -8px;
    overflow: hidden;
    position: absolute;
    width: 18px;
}
.popoverArrow.top:after {
    top: 3px;
}
.popoverArrow.top {
    top: -8px;
}
.popoverArrow.bottom:after {
    bottom: 3px;
}
.popoverArrow.bottom {
    bottom: -8px;
}
ul.popoverList {
    list-style: none;
    padding: 0;
    margin: 0;
    margin-bottom: 8px;
}
ul.popoverList li {
    padding: 2px;
    padding-bottom: 4px;
    padding-left: 8px;
    margin: 0;
}
ul.popoverList li:hover {
    background: #eee;
}

select.small,
select.medium,
input.medium,
input.large,
label.checkbox {
    margin-bottom: 3px;
}

.setupsystem_container {
    max-width: 900px;
}

.setupsystem_small_pane {
    width: 360px;
}

.setupsystem_medium_pane {
    width: 450px;
}

.setupsystem_info_box {
    height: auto;
    border: 0;
    margin: 0;
    padding: 10px 5px 10px 15px;
    background-color: #f0f7fd;
}

.setupsystem_info_text {
    max-width: 900px;
    font-family: Sans-serif, Verdana, Geneva, Arial, Helvetica;
    font-size: 14px;
    line-height: 16px;
    color: #333;
    padding: 0;
}

.setupsystem_button_save {
    padding-bottom: 10px;
    margin: 20px 0 10px 0;
}

.setup_list_options div {
    padding-bottom: 30px;
}

div[class='setupsystem_info_text'] p {
    margin: 10px 0 0 0;
}

.setup_workorder_header {
    border-bottom: 2px solid #ddd !important;
}

tr[class='setup_workorder_header'] td {
    padding-top: 40px;
}

tr[class='setup_workorder_header'] strong {
    font-size: 18px;
}

.setup_sub_header {
    font-size: 14px;
    line-height: 48px;
}

.table_2cols {
    display: flex;
}

div[class='table_2cols'] div:nth-child(1) {
    width: 50%;
}

.table_sms {
    display: flex;
    margin-top: 15px;
}
div[class='table_sms'] div:nth-of-type(1) {
    width: 410px;
}

div[class='table_sms'] div:nth-of-type(2) {
    width: auto;
    margin-top: 14px;
    margin-left: 15px;
}

div[class='table_sms'] textarea {
    width: 400px;
    height: 100px;
}
.sms-tag-container {
    min-width: 390px;
    max-width: 390px;
    padding: 10px;
    background: #eee;
    border-bottom: 2px solid #ddd;
}

.invoice_message_table {
    display: flex;
}

div[class='invoice_message_table'] div:nth-of-type(1) {
    width: 160px;
}

.setup_invoice_textarea {
    width: 500px;
    height: 100px;
}

.setup_workarea_textarea {
    box-sizing: border-box;
    width: 500px;
    height: 200px;
}

.setup_workarea_input {
    box-sizing: border-box;
    width: 500px;
}

.invoice-tag-container {
    min-width: 490px;
    max-width: 490px;
    padding: 10px;
    background: #eee;
    border-bottom: 2px solid #ddd;
}

div.setup_interface_paragraph {
    margin-top: 30px;
    margin-bottom: 30px;
}

/* ### NEW ### */
ul.system-setup-list {
    margin: 0;
    padding: 0;
    width: 375px;
}
ul.system-setup-list li.checkbox-li {
    background-color: #f9f9f9;
    color: #555;
    cursor: pointer;
    gap: 6px;
    margin: 4px 0;
    padding: 8px 12px;
    transition: background 0.2s ease-in;
}
ul.system-setup-list li.checkbox-li:hover {
    background: #f6f6f6;
}

.system-settings-flex-col {
    display: flex;
    flex-direction: column;
}

.system-settings-flex-col * select.medium,
.system-settings-flex-col * input.medium {
    margin: 0;
}

.system-sms-textarea-grid {
    column-gap: 32px;
    display: grid;
    grid-template-columns: 400px 400px;
}

.system-sms-textarea-grid textarea {
    box-sizing: border-box;
    height: 100px;
    resize: none;
    width: 400px;
}
.system-sms-textarea-grid .tag-container {
    background: #eee;
    border-bottom: 2px solid #ddd;
    box-sizing: border-box;
    padding: 10px;
    width: 100%;
}

.system-invoice-grid {
    column-gap: 32px;
    display: grid;
    grid-template-columns: 660px minmax(450px, 1fr);
}

textarea.setup_invoice_textarea {
    box-sizing: border-box;
    height: 100px;
    resize: none;
    width: 500px;
}

.system-result-grid {
    column-gap: 32px;
    display: grid;
    grid-template-columns: 375px 375px;
}

html,
body {
    padding: 0;
    margin: 0;
    background: #e8e8e8;
}
.sidetap {
    position: relative;
    width: 100%;
    overflow: hidden;
}
.stp-nav {
    background: black;
    color: white;
    display: none;
    left: 0;
    position: absolute;
    top: 0;
    width: 272px;
    z-index: 5;
}
.stp-content {
    background: white;
    margin-left: 0;
    width: 100%;
    z-index: 10;
    position: relative;
}
.stp-overlay {
    background: blue;
    display: none;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.stp-content-body > * > *:first-child {
    margin-top: 0;
}
.stp-content-body > * > *:last-child {
    margin-bottom: 0;
}
.sidetap.nav-showing .stp-content {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.9);
    -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.9);
    -moz-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.9);
}
.sidetap.nav-showing .stp-overlay {
    display: block;
    z-index: 100;
}
.stp-content-panel,
.stp-nav-panel {
    position: relative;
    height: 100%;
}
.stp-content-panel {
    background: white;
}
.stp-content-panel.hidden {
    display: none;
}
.stp-fake-header {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}
.ios .sidetap {
    overflow-x: hidden;
}
.ios .stp-content-panel,
.ios .stp-nav-panel {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.ios .stp-content-panel.hidden {
    display: block;
    left: -9999px;
}
.ios .stp-content-frame {
    height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    position: relative;
}
.ios .stp-content-body {
    -webkit-transform: translatez(0);
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    -webkit-box-sizing: border-box;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
}
.ios .nav-showing .stp-content .stp-content-body {
    overflow: hidden;
}
/*
  Show Navigation Animation
*/
.showing-nav {
    -webkit-transform: translatex(272px);
    -moz-transform: translatex(272px);
    -webkit-animation-name: slidefornav;
    -moz-animation-name: slidefornav;
    -webkit-animation-timing-function: ease-out;
    -moz-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-animation-duration: 175ms;
    -moz-animation-duration: 175ms;
    animation-duration: 175ms;
}
@-webkit-keyframes slidefornav {
    from {
        -webkit-transform: translatex(0);
    }
    to {
        -webkit-transform: translatex(272px);
    }
}
@-moz-keyframes slidefornav {
    from {
        -moz-transform: translatex(0);
    }
    to {
        -moz-transform: translatex(272px);
    }
}
/*
  Hide Navigation Animation
*/
.hide-nav {
    -webkit-transform: translatex(0);
    -moz-transform: translatex(0);
    -webkit-animation-name: slideovernav;
    -moz-animation-name: slideovernav;
    -webkit-animation-timing-function: ease-out;
    -moz-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-animation-duration: 175ms;
    -moz-animation-duration: 175ms;
    animation-duration: 175ms;
}
@-webkit-keyframes slideovernav {
    from {
        -webkit-transform: translatex(272px);
    }
    to {
        -webkit-transform: translatex(0);
    }
}
@-moz-keyframes slideovernav {
    from {
        -moz-transform: translatex(272px);
    }
    to {
        -moz-transform: translatex(0);
    }
}
/* Slide up or Down animation */
.up-from-bottom {
    -webkit-transform: translatey(0);
    -moz-transform: translatey(0);
    -webkit-animation-name: upfrombottom;
    -moz-animation-name: upfrombottom;
    -webkit-animation-timing-function: ease-out;
    -moz-animation-timing-function: ease-out;
    -webkit-animation-duration: 250ms;
    -moz-animation-duration: 250ms;
    z-index: 5;
}
.down-to-bottom {
    -webkit-transform: translatey(100%);
    -moz-transform: translatey(100%);
    -webkit-animation-name: downtobottom;
    -moz-animation-name: downtobottom;
    -webkit-animation-timing-function: ease-out;
    -moz-animation-timing-function: ease-out;
    -webkit-animation-duration: 250ms;
    -moz-animation-duration: 250ms;
    z-index: 5;
}
@-webkit-keyframes upfrombottom {
    from {
        -webkit-transform: translatey(100%);
    }
    to {
        -webkit-transform: translatey(0);
    }
}
@-webkit-keyframes downtobottom {
    from {
        -webkit-transform: translatey(0);
    }
    to {
        -webkit-transform: translatey(100%);
    }
}
/*
  Sliding animations
*/
.slide-out-to-left {
    -webkit-transform: translatex(-100%);
    -webkit-animation-name: slideouttoleft;
}
.slide-in-from-right {
    -webkit-transform: translatex(0);
    -webkit-animation-name: slideinfromright;
}
.slide-out-to-right {
    -webkit-transform: translatex(100%);
    -webkit-animation-name: slideouttoright;
}
.slide-in-from-left {
    -webkit-transform: translatex(0);
    -webkit-animation-name: slideinfromleft;
}
.slide-in-from-left,
.slide-out-to-right,
.slide-in-from-right,
.slide-out-to-left {
    -webkit-animation-timing-function: ease-out;
    -webkit-animation-duration: 200ms;
}
@-webkit-keyframes slideinfromright {
    from {
        -webkit-transform: translatex(100%);
    }
    to {
        -webkit-transform: translatex(0);
    }
}
@-webkit-keyframes slideinfromleft {
    from {
        -webkit-transform: translatex(-100%);
    }
    to {
        -webkit-transform: translatex(0);
    }
}
@-webkit-keyframes slideouttoleft {
    from {
        -webkit-transform: translatex(0);
    }
    to {
        -webkit-transform: translatex(-100%);
    }
}
@-webkit-keyframes slideouttoright {
    from {
        -webkit-transform: translatex(0);
    }
    to {
        -webkit-transform: translatex(100%);
    }
}

#container {
    display: table;
    width: 100%;
}

#chartrow {
    display: table-row;
}

#chart1 {
    display: table-cell;
    background-color: #fff;
    border: 5px solid #fff;
    width: 380px;
    height: 400px;
    border-radius: 10px;
}

#chart2 {
    display: table-cell;
    background-color: #fff;
    border: 5px solid #fff;
    width: 308px;
    height: 400px;
    border-radius: 10px;
}

#chart3 {
    display: table-cell;
    background-color: #fff;
    border: 5px solid #fff;
    width: 380px;
    height: 400px;
    border-radius: 10px;
}

#chart4 {
    display: table-cell;
    background-color: #fff;
    border: 5px solid #fff;
    width: 380px;
    height: 400px;
    border-radius: 10px;
}

#EkonomiContainer {
    display: table;
    width: 100%;
}

#ekonomiChartrow {
    display: table-row;
}

#ekonomiChart1 {
    display: table-cell;
    background-color: #fff;
    border: 5px solid #fff;
    width: 470px;
    height: 400px;
    border-radius: 10px;
}

#ekonomiChart2 {
    display: table-cell;
    background-color: #fff;
    border: 5px solid #fff;
    width: 420px;
    height: 400px;
    border-radius: 10px;
}

.main {
    display: table;
    width: 100%;
}

.row {
    display: table-row;
}

.fourdiv1 {
    float: left;
    display: table-cell;
    background-color: #cbdd86;
    border: 5px solid #fff;
    text-align: center;
    height: 100px;
    width: 23%;
    border-radius: 10px;
    padding-bottom: 35px;
}
.fourdiv2 {
    float: left;
    display: table-cell;
    background-color: #669966;
    border: 5px solid #fff;
    text-align: center;
    height: 100px;
    width: 23%;
    border-radius: 10px;
    padding-bottom: 35px;
}

.fourdiv3 {
    float: left;
    display: table-cell;
    background-color: #99cccc;
    border: 5px solid #fff;
    text-align: center;
    height: 100px;
    width: 23%;
    border-radius: 10px;
    padding-bottom: 35px;
}

.fourdiv4 {
    float: left;
    display: table-cell;
    background-color: #996699;
    border: 5px solid #fff;
    text-align: center;
    height: 100px;
    width: 23%;
    border-radius: 10px;
    padding-bottom: 35px;
}

.tidrapportdiv1 {
    float: left;
    display: table-cell;
    background-color: #9999cc;
    border: 5px solid #fff;
    text-align: center;
    height: 100px;
    width: 23%;
    border-radius: 10px;
    padding-bottom: 35px;
}

.ekonomidiv1 {
    float: left;
    display: table-cell;
    background-color: #cc6666;
    border: 5px solid #fff;
    text-align: center;
    height: 100px;
    width: 23%;
    border-radius: 10px;
    padding-bottom: 35px;
}

.ekonomidiv2 {
    float: left;
    display: table-cell;
    background-color: #ffcc99;
    border: 5px solid #fff;
    text-align: center;
    height: 100px;
    width: 23%;
    border-radius: 10px;
    padding-bottom: 35px;
}

.docdiv1 {
    float: left;
    display: table-cell;
    background-color: #adc2eb;
    border: 5px solid #fff;
    text-align: center;
    height: 100px;
    width: 23%;
    border-radius: 10px;
    padding-bottom: 35px;
}

.docdiv2 {
    float: left;
    width: 22.8%;
    background-color: #e5b2cc;
    border: 5px solid #ffffff;
    border-radius: 10px;
    padding-bottom: 10px;
    padding-left: 7px;
    padding-top: 7px;
}

.fourdiv1:hover {
    opacity: 0.5;
    filter: alpha(opacity=50); /*For IE8 and earlier*/
}

.fourdiv2:hover {
    opacity: 0.5;
    filter: alpha(opacity=50); /*For IE8 and earlier*/
}

.fourdiv3:hover {
    opacity: 0.5;
    filter: alpha(opacity=50); /*For IE8 and earlier*/
}

.tidrapportdiv1:hover {
    opacity: 0.5;
    filter: alpha(opacity=50); /*For IE8 and earlier*/
}

.ekonomidiv1:hover {
    opacity: 0.5;
    filter: alpha(opacity=50); /*For IE8 and earlier*/
}
.ekonomidiv2:hover {
    opacity: 0.5;
    filter: alpha(opacity=50); /*For IE8 and earlier*/
}
.docdiv1:hover {
    opacity: 0.5;
    filter: alpha(opacity=50); /*For IE8 and earlier*/
}
.docdiv2:hover {
    opacity: 0.5;
    filter: alpha(opacity=50); /*For IE8 and earlier*/
}

.row-h1 {
    color: white !important;
}

.row-h4 {
    color: white;
    font-size: 30px;
}

.row-h7 {
    color: white !important;
    font-size: 15px;
}

#to_request svg text {
}

/*Media Queries*/

@media screen and (max-width: 700px) {
    .fourdiv1 {
        float: left;
        width: 50%;
        padding: 2px;
    }
}

@media screen and (max-width: 420px) {
    .fourdiv1 {
        float: left;
        width: 75%;
        padding: 2px;
    }
}

@media screen and (max-width: 700px) {
    .fourdiv2 {
        float: left;
        width: 50%;
        padding: 2px;
    }
}

@media screen and (max-width: 420px) {
    .fourdiv2 {
        float: left;
        width: 75%;
        padding: 2px;
    }
}

@media screen and (max-width: 700px) {
    .fourdiv3 {
        float: left;
        width: 50%;
        padding: 2px;
    }
}

@media screen and (max-width: 420px) {
    .fourdiv3 {
        float: left;
        width: 75%;
        padding: 2px;
    }
}

@media screen and (max-width: 700px) {
    .fourdiv4 {
        float: left;
        width: 50%;
        padding: 2px;
    }
}

@media screen and (max-width: 420px) {
    .fourdiv4 {
        float: left;
        width: 75%;
        padding-bottom: 20px;
    }
}

@media screen and (max-width: 700px) {
    .tidrapportdiv1 {
        width: 50%;
    }
}

@media screen and (max-width: 420px) {
    .tidrapportdiv1 {
        float: left;
        width: 75%;
        padding-bottom: 20px;
    }
}

@media screen and (max-width: 700px) {
    .ekonomidiv1 {
        float: left;
        width: 50%;
        padding-bottom: 10px;
    }
}

@media screen and (max-width: 420px) {
    .ekonomidiv1 {
        float: left;
        width: 75%;
        padding-bottom: 10px;
    }
}

@media screen and (max-width: 700px) {
    .ekonomidiv2 {
        float: left;
        width: 50%;
        height: 120px;
        padding-bottom: 10px;
    }
}

@media screen and (max-width: 420px) {
    .ekonomidiv2 {
        float: left;
        width: 75%;
        padding-bottom: 20px;
    }
}

@media screen and (max-width: 700px) {
    .docdiv1 {
        float: left;
        width: 50%;
        height: 120px;
        padding: 2px;
    }
}

@media screen and (max-width: 1410px) {
    .docdiv2 {
        float: left;
        width: 290px;
    }
}

@media screen and (max-width: 1555px) {
    #chart1 {
        float: left;
        height: 350px;
    }
}

@media screen and (max-width: 1555px) {
    #chart2 {
        float: left;
        height: 350px;
    }
}

@media screen and (max-width: 1555px) {
    #chart3 {
        float: left;
        height: 350px;
    }
}

@media screen and (max-width: 1555px) {
    #chart4 {
        float: left;
        height: 350px;
    }
}

@media screen and (max-width: 800px) {
    #ekonomiChart1 {
        float: left;
        height: 350px;
    }
}

@media screen and (max-width: 800px) {
    #ekonomiChart2 {
        float: left;
        height: 350px;
    }
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    #ekonomiChart1 {
        width: 400px;
    }
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    #ekonomiChart2 {
        width: 400px;
    }
}