/*Page Struture*/
#labelSubmenu {
    position: fixed;
    top: 2vh;
    right: 12px;
    width: 6vh;
    height: 6vh;
    min-height: 36px;
    min-width: 36px;
    margin-bottom: 0;
    z-index: 10;
}

#main {
    bottom: auto;
}

#toasts {
    left: 20%;
    width: 80%;
}

#notificationsBar {
    width: 25%;
    height: 100%;
    top: 4.5rem;
    height: calc(100% - 4.5rem);
    right: -25%;
}

#notificationsBar.show {
    right: 0;
    box-shadow: -2rem 0 3rem 1px rgba(88, 84, 99, 0.08);
}

#labelSubmenu {
    cursor: pointer;
    z-index: 12;
}

.header {
    display: block;
}

/*#sidebar .header { display:table }*/
#pmfoofoo {
    top: 4.5rem;
    height: 0.2rem;
}

@media (max-width: 991px) {
    #toasts {
        left: 0;
        width: 100%;
    }

    #notificationsBar {
        width: 100%;
        right: -100%;
    }

    #pmfoofoo {
        top: 10vh;
        border-top: 4px solid #ec7c16;
        height: 45px;
        background: #f3f4f8;
    }
}

.vue-subnavi {
    overflow-y: hidden;
}

.vue-subnavi ul li a {
    height: 3.5rem;
}

#logo {
    width: 100%;
    height: auto;
    padding: 0;
}

.logo img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.logo-vertical {
    max-width: 3.5rem;
}

.logo-vertical img {
    top: 0;
    transform: translateY(-1.5rem);
}

@media (max-width: 991px) {
    .logo-vertical img {
        top: 50%;
        transform: translateY(-50%);
    }
}

@media (min-width: 1200px) {
    .container {
        width: initial;
    }
}

/*Position*/
.relative {
    position: relative;
}

.absolute {
    position: absolute;
}

.fixed {
    position: fixed;
}

.t0 {
    top: 0;
}

.t1 {
    top: 1rem;
}

.t4 {
    top: 4rem;
}

.t8 {
    top: 8rem;
}

.t100 {
    top: 100%;
}

.l0 {
    left: 0;
}

.l100 {
    left: 100%;
}

.l1 {
    left: 1rem;
}

.r0 {
    right: 0;
}

.r100 {
    right: 100%;
}

.r-1 {
    right: -1rem;
}

.r1 {
    right: 1rem;
}

.b0 {
    bottom: 0;
}

.b-08 {
    bottom: -0.8rem;
}

.b100 {
    bottom: 100%;
}

.b1 {
    bottom: 1rem;
}

.b4 {
    bottom: 4rem;
}

.b6 {
    bottom: 6rem;
}

.w-08 {
    width: 0.8rem;
}

.w-1 {
    width: 1rem;
}

.w-12 {
    width: 1.2rem;
}

.w-16 {
    width: 1.6rem;
}

.w-18 {
    width: 1.8rem;
}

.w-2 {
    width: 2rem;
}

.w-3 {
    width: 3rem;
}

.w-4 {
    width: 4rem;
}

.h-100-2 {
    height: 90%;
    height: calc(100% - 2rem);
}

.h-01 {
    height: 0.1rem;
}

.h-04 {
    height: 0.4rem;
}

.h08 {
    height: 0.8rem;
}

.h-1 {
    height: 1rem;
}

.h-2 {
    height: 2rem;
}

.h-3 {
    height: 3rem;
}

.h-4 {
    height: 4rem;
}

.maxw8 {
    max-width: 8rem;
}

.maxw16 {
    max-width: 16rem;
}

.maxw100 {
    max-width: 100%;
}

.maxh12 {
    max-height: 12rem;
}

.maxh60 {
    max-height: 60vh;
}

.maxh100 {
    max-height: 100%;
}

.minh10 {
    min-height: 10rem;
}

.minh100 {
    min-height: 100%;
}

.w100vw {
    width: 100vw;
}

.h100vh {
    height: 100vh;
}

.ofh {
    overflow: hidden;
}

.ofv {
    overflow: visible;
}

.ofv-y {
    overflow-y: visible;
}

.ofa-y {
    overflow-y: auto;
}

.ofv-x {
    overflow-x: visible;
}

.modal-dialog-scrollable .modal-body.ofv-y {
    overflow: visible;
}

.z1 {
    z-index: 1;
}

.z2 {
    z-index: 2;
}

.z8 {
    z-index: 8;
}

.z9 {
    z-index: 9;
}

.z10 {
    z-index: 10;
}

.z11 {
    z-index: 11;
}

.z12 {
    z-index: 12;
}

/*.Layout*/
.block {
    display: block;
}

.iblock {
    display: inline-block;
}

.box {
    margin-bottom: initial;
}

.box-body {
    padding: 2rem 1.4rem;
}

.box-body-bottom-less {
    padding-bottom: 1rem;
}

.box-antibody {
    margin: -3rem -1.5rem -1rem -1.5rem;
}

.box-antibody-h {
    margin-left: -1.5rem;
    margin-right: -1.5rem;
}

.box-footer {
    display: initial;
    padding: initial;
    width: 100%;
    padding: initial;
    height: auto;
    border-top: 1px solid #ebedf2;
}

.txt-lg-right {
    text-align: right;
}

.flex-fill {
    flex: 1 1 auto;
}

@media (max-width: 991px) {
    .txt-lg-right {
        text-align: initial;
    }
}

.circle:after {
    content: "";
    display: block;
    padding-top: 100%;
}

noscript {
    position: fixed;
    width: 100vw;
    height: 100vh;
}

/*Color*/
:root {
    --dark-blue: #022342;
    --light-blue: #728cb5;
    --lighter-blue: #cdd6e4;
    --blue-new: #337ab7;
}

.color-alarm {
    color: #dc3545;
}

.color-warning {
    color: #ffc107;
}

.color-fault {
    color: #fd7e14;
}

.color-white {
    color: #fff;
}

.bg-white {
    background: #fff;
}

.bglight {
    background: #f3f4f6;
}

.bg-blue-new {
    background-color: #337ab7;
}

.bg-orange {
    background-color: #ec7c16;
}

.color-initial {
    color: #535458;
}

.color-blue {
    color: #728cb5;
}

.bg-light-blue {
    background-color: #728cb5;
}

.color-darkblue {
    color: #022342;
}

.color-lightgrey {
    color: #c3c4c8;
}

.color-error-light {
    color: #f8d7da;
}

.bg-fault {
    background: #fd7e14;
}

.bg-warning {
    background: #ffc107;
}

.bg-alarm {
    background: #dc3545;
}

.bg-error {
    background: #d9534f;
}

.bg-error-light {
    background: #f8d7da;
}

.bg-error-medium {
    background: #f1aeb5;
}

.bg-error-dark {
    background: #dc3545;
}

.bg-warning {
    background: #f0ad4e;
}

.bg-warning-light {
    background: #fff3cd;
}

.bg-success-light {
    background: #d1e7dd;
}

.bg-ok {
    background: #5cb85c;
}

.shadow {
    box-shadow: 0 1px 15px 1px rgba(88, 84, 99, 0.08);
}

.shadow-white-left {
    box-shadow: -2rem 0px 1rem 1px rgba(255, 255, 255, 1);
}

.disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.bg-lightgrey-animated {
    background-image: linear-gradient(90deg,
            #c3c4c8 0px,
            #e3e4e8 15%,
            #c3c4c8 30%);
    background-size: 150%;
}

.bg-lightblue-animated {
    background-image: linear-gradient(90deg,
            #337ab7 0px,
            #e3e4e8 15%,
            #337ab7 30%);
    background-size: 150%;
}

.bg-lightgrey-animated.live,
.bg-lightblue-animated.live {
    animation: skeleton 1.6s infinite linear;
}

.bg-lightgrey-odd:last-child {
    border-bottom: none;
}

.bg-lightgrey-odd:nth-child(odd) {
    background: #f8f9fa;
}

@keyframes skeleton {
    0% {
        background-position: 100%;
    }

    40%,
    100% {
        background-position: -200%;
    }
}

.op02 {
    opacity: 0.2;
}

.op04 {
    opacity: 0.4;
}

.op06 {
    opacity: 0.6;
}

/*Links*/
.link-blue {
    color: #728cb5;
}

.link-blue i {
    opacity: 0.6;
}

.link-hover-lightgrey:hover {
    background: rgba(114, 140, 181, 0.1);
}

.link-lightgrey {
    color: #c3c4c8;
}

.link-alarm {
    color: #dc3545;
}

.link-alarm:hover {
    color: #ac0515;
}

.link-warning {
    color: #ffc107;
}

.link-warning:hover {
    color: #cf8107;
}

.link-fault {
    color: #fd7e14;
}

.link-fault:hover {
    color: #cd4e04;
}

.border-left-blue-new {
    border-left: var(--blue-new) 4px solid;
}

.border-left-transparent {
    border-left: 4px solid rgba(0, 0, 0, 0);
}

/*Text*/
.fs05 {
    font-size: 0.5rem;
}

.fs06 {
    font-size: 0.6rem;
}

.fs07 {
    font-size: 0.7rem;
}

.fs08 {
    font-size: 0.8rem;
}

.fs09 {
    font-size: 0.9rem;
}

.fs1 {
    font-size: 1rem;
}

.fs12 {
    font-size: 1.2rem;
}

.fs14 {
    font-size: 1.4rem;
}

.fs16 {
    font-size: 1.6em;
}

.fs2 {
    font-size: 2rem;
}

.fs24 {
    font-size: 2.4rem;
}

.fs3 {
    font-size: 3rem;
}

.fs4 {
    font-size: 4rem;
}

.fs6 {
    font-size: 6rem;
}

.lh06 {
    line-height: 0.6rem;
}

.lh07 {
    line-height: 0.7rem;
}

.lh08 {
    line-height: 0.8rem;
}

.lh09 {
    line-height: 0.9rem;
}

.lh1 {
    line-height: 1rem;
}

.lh12 {
    line-height: 1.2rem;
}

.lh14 {
    line-height: 1.4rem;
}

.lh2 {
    line-height: 2rem;
}

.lh24 {
    line-height: 2.4rem;
}

.lh3 {
    line-height: 3rem;
}

.lh6 {
    line-height: 6rem;
}

.light {
    font-weight: 300;
}

.normal {
    font-weight: 400;
}

.semibold {
    font-weight: 600;
}

.bold {
    font-weight: 700;
}

.black {
    font-weight: 800;
}

.ls1 {
    letter-spacing: 1px;
}

.ls2 {
    letter-spacing: 2px;
}

.upper {
    text-transform: uppercase;
}

.i {
    font-style: italic;
}

.wb-bw {
    word-break: break-word;
}

/*Buttons*/
.p-btn {
    border-radius: 100%;
    border: 0;
}

.p-btn>i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.p-btn-1 {
    width: 1rem;
    height: 1rem;
}

.p-btn-1>i {
    font-size: 0.8rem;
}

.p-btn-14 {
    width: 1.4rem;
    height: 1.4rem;
}

.p-btn-14>i {
    font-size: 0.8rem;
}

.p-btn-2 {
    width: 2rem;
    height: 2rem;
}

.p-btn-2>i {
    font-size: 1.2rem;
}

.p-btn-3 {
    width: 3rem;
    height: 3rem;
}

.p-btn-3>i {
    font-size: 1.4rem;
}

.p-btn-light {
    background: rgba(114, 140, 181, 0.2);
}

.p-btn-light:hover {
    background: rgba(114, 140, 181, 0.1);
}

.p-btn-lightblue {
    background: rgba(114, 140, 181, 0.2);
    color: #728cb5;
}

.p-btn-lightblue:hover {
    background: rgba(114, 140, 181, 0.1);
}

.p-btn-white {
    color: #728cb5;
    background: #fff;
}

.p-btn-white:hover {
    background: rgba(114, 140, 181, 0.1);
}

.p-btn-white-dark {
    color: #212529;
    background: #fff;
}

.p-btn-white-dark:hover {
    background: rgba(114, 140, 181, 0.1);
}

.p-btn-dark {
    color: #fff;
    background: #01305c;
}

.p-btn-dark:hover {
    color: #fff;
    background: #728cb5;
}

.p-btn-blank {
    color: #728cb5;
    background: transparent;
}

.p-btn-blank:hover {
    background: rgba(114, 140, 181, 0.1);
}

.btn-unset {
    background: transparent;
}

.p-btn-collapsing i {
    display: block;
    transform-origin: center center;
}

.p-btn-collapsing.collapsed i {
    transform: rotate(-90deg) translate(50%, -50%);
}

/*Lists*/
.p-list-style-none {
    list-style-type: none;
}

@media (max-width: 991px) {
    .list-icon_item .dropdown-menu>li {
        display: block;
    }

    .subnavi .nav-tabs>li a {
        line-height: 4rem;
    }
}

/*Forms*/
.p-form-select {
    height: 3rem;
    border: 0;
    border-radius: 0;
}

.p-form-select:focus {
    border-bottom: 1px solid #ec7c16;
    outline: 0;
    box-shadow: none;
}

.outline0,
.outline0:focus {
    outline: 0;
}

/*Lines*/
.bt-light {
    border-top: 1px solid #ebedf2;
}

.bt-grey {
    border-top: 1px solid #d3d4d8;
}

.bb-light {
    border-bottom: 1px solid #ebedf2;
}

.bl-light {
    border-left: 1px solid #ebedf2;
}

.br-light {
    border-right: 1px solid #ebedf2;
}

.bl-error {
    border-left: 0.4rem solid #dc3545;
}

.bl-warning {
    border-left: 0.4rem solid #ffc107;
}

.bl-success {
    border-left: 0.4rem solid #5cb85c;
}

.br02 {
    border-radius: 0.2rem;
}

.br04 {
    border-radius: 0.4rem;
}

.br-04 {
    border-radius: 0.4rem;
}

.br-1 {
    border-radius: 1rem;
}

.br-100 {
    border-radius: 100%;
}

.b-none {
    border: none;
}

/*Elements*/
.cursor-pointer {
    cursor: pointer;
}

/*Widgets*/
.pimm-gauge.widget-gauge-canvas {
    overflow: initial;
}

.pimm-gauge .window {
    overflow: hidden;
}

.pimm-gauge-bar {
    margin-bottom: 0;
}

.widget-gauge-input input {
    width: 3rem;
    height: auto;
    margin: 0;
    padding: 0;
    background: #fff;
    border-radius: 0.2rem;
    border: 1px solid #e3e4fc;
    padding: 0.2rem 0.4rem;
    text-align: center;
}

.widget-gauge-input input::placeholder {
    color: #c3c4cf;
    opacity: 1;
    font-size: 0.8rem;
}

.widget-gauge-input input:active {
    border: 0;
    outline: 0;
}

.widget-gauge-input.min {
    bottom: -5%;
    left: -10%;
}

.widget-gauge-input.less {
    bottom: 40%;
    left: -5%;
}

.widget-gauge-input.okmin {
    bottom: 85%;
    left: 20%;
}

.widget-gauge-input.okmax {
    bottom: 85%;
    right: 20%;
}

.widget-gauge-input.more {
    bottom: 40%;
    right: -5%;
}

.widget-gauge-input.max {
    bottom: -5%;
    right: -10%;
}

.widget-bar-input input {
    width: 3rem;
    height: auto;
    margin: 0;
    padding: 0;
    background: #fff;
    border-radius: 0.2rem;
    border: 1px solid #e3e4fc;
    padding: 0.2rem 0.4rem;
    text-align: center;
}

.widget-bar-input input::placeholder {
    color: #c3c4cf;
    opacity: 1;
    font-size: 0.8rem;
}

.widget-bar-input input:active {
    border: 0;
    outline: 0;
}

.widget-bar-input {
    top: 2rem;
}

.widget-bar-input.min {
    left: -5%;
}

.widget-bar-input.less {
    left: 10%;
}

.widget-bar-input.okmin {
    left: 25%;
}

.widget-bar-input.okmax {
    right: 25%;
}

.widget-bar-input.more {
    right: 10%;
}

.widget-bar-input.max {
    right: -5%;
}

.elem--50p {
    transform: translateX(-50%);
}

.elem--50pY {
    transform: translateY(-50%);
}

.elem-50pY {
    transform: translateY(50%);
}

.elem--centred-right {
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
}

.elem-centred-top {
    top: 50%;
    transform: translateY(-50%);
}

.weather .details {
    padding: 1rem 0 1rem 0;
}

.overview-graph:after {
    content: "";
    display: block;
    padding-top: 33%;
}

/*Dropdown*/
.p-dropdown {
    padding: 0;
    border: 0;
    border-radius: 0;
}

.p-dropdown-link {
    background: #fff;
    padding: 0.8rem 1rem;
}

/*Modals*/
.modal-open .modal.show {
    opacity: 1;
    visibility: visible;
}

.modal-header {
    padding: initial;
}

/*Forms*/
input:focus {
    outline: none;
}

input::placeholder,
textarea::placeholder {
    opacity: 0.6;
    font-style: italic;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
.form-horizontal textarea:focus,
.form-horizontal select:focus {
    border-bottom: 1px solid #ec7c16;
}

@media (min-width: 768px) {
    .form-horizontal .control-label {
        padding-top: 0;
    }
}

/* Swiper */
.swiper-container-dashboard {
    width: 100%;
    height: 100%;
    min-height: 100vh;
    min-height: calc(100vh - 9rem);
}

.swiper-min-height {
    min-height: calc(100vh - 20rem);
}

/*Animations*/
a,
button {
    -webkit-transition: all 200ms ease;
    transition: all 200ms ease;
    border: 0;
    outline: 0;
}

button:focus {
    outline: 0;
}

/*Margins*/
.mp0 {
    margin: 0;
    padding: 0;
}

.m0auto {
    margin: 0 auto;
}

.mh02 {
    margin-left: 0.2rem;
    margin-right: 0.2rem;
}

.mh1 {
    margin-left: 1rem;
    margin-right: 1rem;
}

.mt02 {
    margin-top: 0.2rem;
}

.mt04 {
    margin-top: 0.4rem;
}

.mt06 {
    margin-top: 0.6rem;
}

.mt0 {
    margin-top: 0rem;
}

.mt1 {
    margin-top: 1rem;
}

.mt2 {
    margin-top: 2rem;
}

.mt4 {
    margin-top: 4rem;
}

.mt8 {
    margin-top: 8rem;
}

.mb01 {
    margin-bottom: 0.1rem;
}

.mb04 {
    margin-bottom: 0.4rem;
}

.mb1 {
    margin-bottom: 1rem;
}

.mb2 {
    margin-bottom: 2rem;
}

.mb3 {
    margin-bottom: 3rem;
}

.mb4 {
    margin-bottom: 4rem;
}

.ml0 {
    margin-left: 0;
}

.ml02 {
    margin-left: 0.2rem;
}

.ml04 {
    margin-left: 0.4rem;
}

.ml06 {
    margin-left: 0.6rem;
}

.ml2 {
    margin-left: 2rem;
}

.mr0 {
    margin-right: 0;
}

.mr02 {
    margin-right: 0.2rem;
}

.mr04 {
    margin-right: 0.4rem;
}

.mr1 {
    margin-right: 1rem;
}

.mr2 {
    margin-right: 2rem;
}

.mr-lg-1 {
    margin-right: 1rem;
}

.mt-2-lg-0 {
    margin-top: 2rem;
}

@media (max-width: 991px) {
    .mr-lg-1 {
        margin-right: 0;
    }

    .mt-2-lg-0 {
        margin-top: 0;
    }
}

/*Paddings*/
.ph01 {
    padding-left: 0.1rem;
    padding-right: 0.1rem;
}

.ph02 {
    padding-left: 0.2rem;
    padding-right: 0.2rem;
}

.ph04 {
    padding-left: 0.4rem;
    padding-right: 0.4rem;
}

.ph06 {
    padding-left: 0.6rem;
    padding-right: 0.6rem;
}

.ph1 {
    padding-left: 1rem;
    padding-right: 1rem;
}

.ph2 {
    padding-left: 2rem;
    padding-right: 2rem;
}

.pv02 {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}

.pv04 {
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
}

.pv06 {
    padding-top: 0.6rem;
    padding-bottom: 0.6rem;
}

.pv08 {
    padding-top: 0.8rem;
    padding-bottom: 0.8rem;
}

.pv1 {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.pv14 {
    padding-top: 1.4rem;
    padding-bottom: 1.4rem;
}

.pv2 {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.pv3 {
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.pv6 {
    padding-top: 6rem;
    padding-bottom: 6rem;
}

.pt0 {
    padding-top: 0;
}

.pt01 {
    padding-top: 0.1rem;
}

.pt04 {
    padding-top: 0.4rem;
}

.pt1 {
    padding-top: 1rem;
}

.pt2 {
    padding-top: 2rem;
}

.pt4 {
    padding-top: 4rem;
}

.pb1 {
    padding-bottom: 1rem;
}

.pb2 {
    padding-bottom: 2rem;
}

.pb4 {
    padding-bottom: 4rem;
}

.pb5 {
    padding-bottom: 5rem;
}

.pl0 {
    padding-left: 0;
}

.pl02 {
    padding-left: 0.2rem;
}

.pr0 {
    padding-right: 0;
}

.pr02 {
    padding-right: 0.2rem;
}

.pr1 {
    padding-right: 1rem;
}

/* Maths addition from Niklas */

.unselectable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.opacity-25 {
    opacity: 0.25 !important;
}

.opacity-0 {
    opacity: 0 !important;
}

.hover-zoom {
    transition: transform 0.1s;
}

.hover-zoom:hover {
    transform: scale(1.1);
}

.bg-neutral {
    background: #f3f4f6;
}

.mb-2-5 {
    margin-bottom: 0.75rem;
}

.bg-darkblue {
    background: #01305c;
}