﻿.preloader-progress {
	width: 260px;
    height: 20px;
	background-size: 260px 20px;
}
.preloader-progress-bar {
	background-size: 260px 20px;
}

.preloader {
    background-color: #fff;
}

button.dropdown{
    border-radius: 4px !important;
    padding:0;
}
.dropdown-text{
    padding-bottom:5px;
    padding-top:5px;
    padding-left:10px;
    padding-right:10px;
    display:inline-block;
    float:left;
}
.dropdown-button{
    width:32px;
    height:32px;
    float:left;
    display:inline-block;
    padding-bottom:5px;
    padding-top:8px;
    padding-left:5px;
    padding-right:5px;
    background: rgb(176, 176, 182);
    border-radius:0 4px 4px 0;
    color: white;
}

.dropdown-menu {
    overflow: auto;
    max-height: 300px;
}

.text-success{
	-webkit-transition: color 0.65s;
    -o-transition: color 0.65s;
    transition: color 0.65s;
}

.text-danger{
	-webkit-transition: color 0.65s;
    -o-transition: color 0.65s;
    transition: color 0.65s;
}

.bg-red{
    background:#FF6059;   
}

.fa.fa-arrow-up {
	transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);

	-webkit-transition: all 0.65s;
	-o-transition: all 0.65s;
	transition: all 0.65s;
}

.fa.fa-arrow-up.rotateDown {
	transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	-ms-transform: rotate(135deg);
	-o-transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
}

/* Hierarchische Box auch im Header lauffähig*/

h3 .hierarchical-control .tree-view ul .item-details {
	font-size:13px;
	font-weight:normal;
}


/* Pivot Anpassungen  */

/*Anpassung des IGPIvot-Metadataitem (Runde Ecken)*/
.ui-igpivot-metadataitem {
    border-radius:4px !important;
}

.ui-draggable-dragging {
  border-radius:4px !important;
}

/*.ui-igpivot-droparea {
    background-color:@ThemePrimaryColor !important;
    border-color: @ThemePrimaryColorMod !important;
}

.ui.igpivot-header {
    background-color:@ThemePrimaryColor !important;
    border-color: @ThemePrimaryColorMod !important;
}

.ui-iggrid-header {
      background-color:@ThemePrimaryColor !important;
    border-color: @ThemePrimaryColorMod !important;
}*/

.trafficlightcontainer {
    display: inline-block;
    width: 80px;
    height: 200px;
}

.trafficlight {
    background: #222;
    width: 100%;
    height: 100%;
    -ms-border-radius: 10px;
    border-radius: 10px;
    position: relative;
    display: inline-block;
}

.trafficlight > .light {
    -ms-background-size: 5px 5px;
    background-size: 5px 5px;
    width: 59%;
    height: 25%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    position: absolute;
    left: 19%;
    -webkit-transition: opacity 5s;
    -moz-transition: opacity 5s;
    -ms-transition: opacity 5s;
    -o-transition: opacity 5s;
    transition: opacity 5s;
    -ms-opacity: .1;
    opacity: .1;
}

.red {
    background: red;
    background-image: radial-gradient(brown, transparent);
    top: 5%;
    border: dotted 2px red;
    -webkit-box-shadow: 0 0 20px #111 inset, 0 0 10px red;
    -ms-box-shadow: 0 0 20px #111 inset, 0 0 10px red;
    box-shadow: 0 0 20px #111 inset, 0 0 10px red;
}

.yellow {
    background: yellow;
    background-image: radial-gradient(orange, transparent);
    border: dotted 2px yellow;
    top: 36.3%;
    -webkit-box-shadow: 0 0 20px #111 inset, 0 0 10px yellow;
    -ms-box-shadow: 0 0 20px #111 inset, 0 0 10px yellow;
    box-shadow: 0 0 20px #111 inset, 0 0 10px yellow;
}

.green {
    background: green;
    background-image: radial-gradient(lime, transparent);
    border: dotted 2px lime;
    top: 67.5%;
    -webkit-box-shadow: 0 0 20px #111 inset, 0 0 10px lime;
    -ms-box-shadow: 0 0 20px #111 inset, 0 0 10px lime;
    box-shadow: 0 0 20px #111 inset, 0 0 10px lime;
}

.trafficlight > .light.active {
    -ms-opacity: 1;
    opacity: 1;
}

.bg-a{
    background:#384861;
}
.bg-a-sec{
    background:#67809B;
}
.bg-a-accent{
    background:#171d28;
}

.bg-b{
    background:#3954A3;
}
.bg-b-sec{
    background:#A8B3B9;
}
.bg-b-accent{
    background:#011640;
}

.bg-c{
    background:#A6896C;
}
.bg-c-sec{
    background:#3A8AA6;
}
.bg-c-accent{
    background:#A6794B;
}

.bg-d{
    background:#5B7F95;
}
.bg-d-sec{
    background:#65665C;
}
.bg-d-accent{
    background:#003057;
}

.bg-e{
    background:#DAC198;
}
.bg-e-sec{
    background:#C9433A;
}
.bg-e-accent{
    background:#A5BECB;
}

.bg-f{
    background:#989CA6;
}
.bg-f-sec{
    background:#D9CBBF;
}
.bg-f-accent{
    background:#323540;
}

.bg-g{
    background:#8C2A32;
}
.bg-g-sec{
    background:#736A51;
}
.bg-g-accent{
    background:#70732F;
}

.bg-h{
    background:#0AB8F3;
}
.bg-h-sec{
    background:#D70402;
}
.bg-h-accent{
    background:#0387DA;
}

.bg-grey {
	background-color: lightgray !important;
	-webkit-transition: background-color 0.65s;
    -o-transition: background-color 0.65s;
    transition: background-color 0.65s;
}

.btn-showRule {
	border:0px;
    width:36px;  
    margin-right:10px;
}

.btn-setRuleCode {
    height:36px;
    margin:3px;
}


/*##########################################
######## pcon message styles #############
##########################################*/

.pcon-message.unread {
    font-weight: 900;
}

/*###### legend pcon message styles #######*/

.table.pcon-mlr-table > tbody td {
    border-left: solid 1px #eeeeee;
    border-right: solid 1px #eeeeee;
    text-align: center;
}

.table > thead > tr > th{
    vertical-align: middle;
}

.in-box-margin-left {
    margin-left:14px;
}

.form-control-mb {
    margin-bottom:12px;
}


/*###### Fix für Scrolling in Chrome (Scrollt im UIGrid immer bis ganz nach unten)*/
.ui-grid-viewport {
    overflow-anchor: none!important;
}



/*###### Topbar quickfix TK ######*/
.navbar-right {
    width:180px;
}

/*##### Selection for PNO-Screen*/
.selectedPNO {
    border:solid!important;
    border-color:blue!important
}


.trimlevelButton {
    width:120px;
}

.trimlevelButtonMV {
    width:600px;
}

.trimlevelDot {
    width:10px;
    height:10px;
    border-radius:10px;
    margin-right:5px;
}

.trimlevelHeader {
    height:130px;
}

.trimlevelHeaderExpanded {
    height:210px;
}

.trimlevelExpandButton {
    margin-top:60px;
    margin-left:10px;
}

.trimlevelExpandButtonExpanded {
    margin-top:150px;
    margin-left:10px;
}


.colorRed {
    color: red;
}

/*##########################################
########## pcon print styles ###############
##########################################*/

.printSchirm {
    list-style: none;
}

.printFlex {
    display: flex;
    flex-wrap: wrap;
}
.printSpaceBetween{
    justify-content: space-between;
}
.printAligment {
    align-self: center;
}
.printColumn {
    flex-direction: column;
}

.printFooter{
    min-height: 48px;
}

.printSpace {
    margin-left: 4px;
    margin-right: 4px;
}
.printButton{
    margin-top: 10px;
    margin-bottom: 10px;
}

.printContainerArea {
    /* set min-height to enable drop opportunity */
    min-height: 30px;
}

.printContainerWidth {
    max-width: 250px;
}

.printContainerTitel {
    margin-right: 8px;
    margin-left: 8px;
}
.printContainerTitel > h3 {
    margin-top: 0px;
    padding: 10px;
}

.printContainerBackground {
    border-bottom: solid;
    border-bottom-width: .2px;
    border-width: 1px;
    border-color: lightgray;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
    box-shadow: 0 1px 2px rgba(0,0,0,0.15);
    background-color: lightskyblue;
}
.printItemsWidth{
    width: 160px;
}
.printItemsMagin{
    margin: 8px 0px;
}
.printItemStyle {
    text-align:center;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}
.printItemTexbox{
    margin-top: 8px;
}
.printBorderGrey {
    border-style: solid;
    border-width: 1px;
    border-color: lightgray;
    margin-bottom: 6px;
}

.printTitle {
    width: 98%;
}

.dndPlaceholder {
    display: initial; /*Standard block but this causes grafic issues*/
    background-color: rgb(35, 183, 229);
    min-height: 42px;
}


@media only screen and (max-width: 1275px) {
    ul.printSchirm{
        padding-left: 10px;
        padding-right: 10px;
    }
}


@media only screen and (max-width: 1243px) {
    .printFooter {
        min-height: 72px;
    }
}

@media only screen and (max-width: 1015px) {
    .printLowScreenOrder{
        display: flex;
        flex-direction: column;
    }
}

@media only screen and (max-width: 872px) {
    .printFooter {
        min-height: 92px;
    }
}


@media only screen and (min-width: 1450px) {
    .PrintMarginRight {
        margin-right: 51px;
    }
}

@media only screen and (min-width: 1450px) {
    .PrintMarginLeft {
        margin-left: 36px;
    }
}

