/******************************/
/* BEGIN Reset default styles */
/******************************/

:root {
    /* old weg colors */
    --primary-color: #4f72a4;
    --secondary-color: #ffd700;
    --blue-color: #496da4;

    /* novra colors */
    --dark-color: #25272a;
    --primary-color: #496da4;
    --secondary-color: #f68545;
    --blue-color: #496da4;
}

/* Global Defaults */

html,
body {
    margin: 0px;
    padding: 0px;
    border: 0px;
}

body {
    /*  font: 1em Arial, Helvetica, sans-serif; */
    /*  font: 8pt/1.25 Arial, Helvetica, sans-serif;*/
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1em;
}

/* Headlines */

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    padding: 0;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
}

/* Text Styles */

p,
th,
td,
li,
dd,
dt,
ul,
ol,
blockquote,
q,
acronym,
abbr,
a,
input,
button,
select,
textarea {
    margin: 0;
    padding: 0;
    /* font: normal normal normal 8pt/1.25 Arial, Helvetica, sans-serif; */
    /* font: 8pt/1.25 Arial, Helvetica, sans-serif; */
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1em;
}

th,
td {
    padding: 5px;
}

blockquote {
    margin: 1.25em;
    padding: 1.25em;
}

q {
    font-style: italic;
}

acronym,
abbr {
    cursor: help;
    border-bottom: 1px dashed;
}

small {
    font-size: 0.85em;
}

big {
    font-size: 1.2em;
}

/* Links and Images */

a,
a:link,
a:visited,
a:active,
a:hover {
    color: blue;
    text-decoration: underline;
}

img {
    border: none;
}

/* Tables */

table {
    margin: 0;
    padding: 0;
    border: none;
    border-collapse: collapse;
}

/* Forms */

form {
    margin: 0;
    padding: 0;
    display: inline;
}

label {
    cursor: pointer;
}

/* This is needed for IE to use relative sizes inside a container that
 * and absolute font-size.  This makes IE and FireFox look the same! */

h1 {
    font-size: 2em;
}

h2 {
    font-size: 1.5em;
}

h3 {
    font-size: 1.17em;
}

h4 {
    font-size: 1em;
}

h5 {
    font-size: 0.83em;
}

/******************************/
/* END Reset default styles   */
/******************************/

body,
p,
th,
td,
li,
dd,
dt,
ul,
ol,
blockquote,
q,
acronym,
abbr,
a,
input,
button,
select,
textarea {
    font-size: 8pt;
}

body {
    background-color: #dcdcdc;
}

/* Colors */

.secondary {
    color: var(--secondary-color);
}

/* Layout */

.container {
    overflow: auto;
    margin: 0;
}

.content {
    background-color: #dcdcdc;
    border-right: none;
    vertical-align: top;
    margin: 0 auto;
    text-align: center;
    padding: 1em 1em 0;
}

.content.w-sb {
    margin-left: 110px;
}

#sidebar {
    position: absolute;
    left: 0;
    top: 123px;
    z-index: 100;
    background-color: #333;
    background-image: -webkit-linear-gradient(top, #333 0, #121314 100%);
    background-image: -o-linear-gradient(top, #333 0, #121314 100%);
    background-image: linear-gradient(to bottom, #333 0, #121314 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF333333', endColorstr='#FF121314', GradientType=0);
    padding-top: 2em;
    padding-left: 10px;
    padding-right: 10px;
    width: 90px;
}

#sidebar ul {
    list-style-type: none;
}

#sidebar li > a {
    text-align: right;
    text-decoration: none;
    color: #dcdcdc;
    font-size: 1.1em;
    padding: 3px 5px;
    display: block;
    width: 100%;
}

#sidebar li > a:hover {
    border-right: 3px solid #f68545;
}

#sidebar li > a:active {
    text-decoration: none;
    border: none;
}

#sidebar li > a.selected,
#sidebar li > a:hover.selected {
    background-color: #dcdcdc;
    color: #000;
    font-weight: bold;
    border-right: 3px solid #f68545;
    border-right-color: #f68545;
}

/*******************/
/* Sidebar widgets */
/*******************/

/* Used by container siblings to widgets-sb */

.w-widgets {
    padding-right: 210px;
}

.content.w-widgets {
    padding-right: 220px;
}

#widgets-sb {
    position: absolute;
    right: 0;
    padding-bottom: 5px;
    width: 210px;
    text-align: left;
}

#widgets-sb .sb-widget {
    text-align: left;
    background-color: #fff;
    font-size: 1em;
    overflow: hidden;
    padding: 0;
}

.sb-widget h3 a {
    font-size: 1em;
}

.sb-widget .data a,
.sb-widget .data a:link,
.sb-widget .data a:visited,
.sb-widget .data a:active,
.sb-widget .data a:hover {
    color: blue;
    text-decoration: none;
}

.sb-widget .data a:hover {
    text-decoration: underline;
}

#widgets-sb .sb-widget .data {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.9em;
    background-image: none;
    background-color: transparent;
    position: relative;
    padding: 3px 4px 0;
    height: 100%;
}

#widgets-sb .sb-widget .data > table td,
#widgets-sb .sb-widget .data > table th {
    font-size: 1em;
    vertical-align: top;
    padding: 1px 2px;
    background-color: transparent;
}

#widgets-sb .sb-widget .dragger {
    position: absolute;
    left: 0;
    bottom: 0;
    color: #aaa;
}

#widgets-sb .sb-widget div.larger-font {
    font-size: 12px;
}

#widgets-sb .sb-widget p,
#widgets-sb .sb-widget h4,
#widgets-sb .sb-widget ul {
    margin-bottom: 0.5em;
}

#widgets-sb .sb-widget h4 {
    border-bottom: 1px solid #555;
}

#widgets-sb .sb-widget ul {
    margin-left: 1.5em;
}

#widgets-sb .sb-widget dt {
    background-color: #eee;
    font-family: Monospace;
    font-size: 10px;
    border: 1px solid #bbb;
    padding: 0.5em;
}

#widgets-sb .sb-widget dd {
    margin-top: 0.5em;
    margin-bottom: 1em;
    font-size: 11px;
    padding-left: 1em;
}

#footer {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    font-size: 0.8em;
    text-align: center;
    clear: both;
    padding: 7px 0;
    color: var(--primary-color);
    background-color: #eaf4fd;
    background-color: #163568;
    /* Thin bar */
    border-top: 1px solid #c9d3e2;
    color: #eee;
    background-color: #222;
    border: none;
    z-index: 999;
}

/***********************/
/* Content Page Styles */
/***********************/

body .page,
.page p,
.page th,
.page td,
.page li,
.page dd,
.page dt,
.page ul,
.page ol,
.page blockquote,
.page q,
.page acronym,
.page abbr,
.page a,
.page input,
.page button,
.page select,
.page textarea {
    font-size: 9pt;
}

.content .page p {
    margin: 6px 0;
}

.content .page .info {
    margin: 6px 0;
}

.content .page .groups {
    border: 1px solid #333;
    border-radius: 3px;
    padding: 0.5em;
    padding-bottom: 0;
    margin: 0.5em 0;
}

.content .page .group {
    margin-bottom: 0.5em;
}

.content .page .two-col > .group {
    float: left;
    width: 49.5%;
    min-width: 360px;
}

.content .page .two-col > :first-child {
    margin-right: 1%;
}

.page .group h3,
.page .group h4 {
    padding: 0.3em;
    margin-bottom: 0.2em;
}

.page .group th,
.page .group td {
    padding: 2px;
    vertical-align: top;
}

.page .group table th {
    font-weight: bold;
}

.page .group table td .rb {
    margin-top: 2px;
}

/*************************/
/* General notifications */
/*************************/

.flash,
.notify {
    height: 20px;
    font-size: 10pt;
}

span.flash,
span.notify {
    padding: 2px;
}

.notice {
    background: transparent url(../images/icon_success.gif) no-repeat;
    color: #008000;
    /* green */
    padding-left: 24px !important;
}

.warn {
    background: transparent url(../images/icon_warn.gif) no-repeat;
    color: #b8860b;
    /* darkGoldenRod */
    padding-left: 24px !important;
}

.error {
    background: transparent url(../images/icon_err.gif) no-repeat;
    color: #ff0000;
    /* red */
    padding-left: 24px !important;
}

.working {
    background: transparent url(../images/weg_loader.gif) no-repeat;
    color: #093a80;
    /* red */
    padding-left: 24px !important;
}

.empty {
}

.ind-led {
    height: 17px;
    padding-left: 21px !important;
    padding-top: 1px;
}

.good {
    background: transparent url(../images/icon_green.gif) no-repeat left center;
    color: #00b000;
    /* green */
}

.warning {
    background: transparent url(../images/icon_yellow.gif) no-repeat left center;
    color: #b8860b;
    /* darkGoldenRod */
}

.alarm {
    background: transparent url(../images/icon_red.gif) no-repeat left center;
    color: #ff0000;
    /* red */
}

.button {
    margin-top: 0.3em;
    margin-left: 0.3em;
    padding: 0.25em 0.5em;
    cursor: pointer;
}

.button span.ui-icon {
    margin: -1px 2px 0 -3px;
    float: left;
}

.pcmiform-buttons {
    margin-top: 5px;
}

/********************************
 * Grid System (from bootstrap) *
 ********************************/

.grid-row:before {
    content: "";
    display: table;
}

.grid-row:after {
    clear: both;
}

[class*="col-"] {
    box-sizing: border-box;
    float: left;
    position: relative;
    min-height: 1px;
    padding-right: 7px;
    padding-left: 7px;
}

.col-12 {
    width: 100%;
}

.col-11 {
    width: 91.66666667%;
}

.col-10 {
    width: 83.33333333%;
}

.col-9 {
    width: 75%;
}

.col-8 {
    width: 66.66666667%;
}

.col-7 {
    width: 58.33333333%;
}

.col-6 {
    width: 50%;
}

.col-5 {
    width: 41.66666667%;
}

.col-4 {
    width: 33.33333333%;
}

.col-3 {
    width: 25%;
}

.col-2 {
    width: 16.66666667%;
}

.col-1 {
    width: 8.33333333%;
}

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

/*********************/
/* basic form styles */
/*********************/

form.horizontal-form {
    display: block;
    margin: 0.5em;
}

form .form-group {
    margin: 0;
    margin-bottom: 1em;
    font-size: 14px;
}

form .form-group label {
    font-size: inherit;
    display: block;
    font-weight: bold;
    margin-bottom: 3px;
}

form .form-group .form-control {
    font-size: inherit;
    box-sizing: border-box;
    display: block;
    margin: 0;
    padding: 4px 8px;
    width: 50%;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}