﻿.controls {
        margin-top: 10px;
        border: 1px solid transparent;
        border-radius: 2px 0 0 2px;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        height: 32px;
        outline: none;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}

.controls-wo-shadows {
    margin-top: 10px;
    border: 1px solid transparent;
    border-radius: 2px 0 0 2px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    height: 32px;
    outline: none;
}
  
.translations-input {
    padding: 3px; 
    width: 100%;
}
.ok-circle {
    background-color: #20C801;
}

.paddingAll5{
    padding: 5px;
}

.circle-position {
    border-radius: 50%;
    width: 12px;
    height: 12px;
    position: relative;
    display:inline-block;
    margin-right: 10px;
}
#pac-input {
        background-color: #fff;
        font-family: Roboto;
        font-size: 15px;
        font-weight: 300;
        margin-left: 12px;
        padding: 0 11px 0 13px;
        text-overflow: ellipsis;
        width: 300px;
}

.modal-xlg {
    width: 1200px;
}

.status-box {

    position: absolute;
    left: -3px;
    top: -1px;
    padding: 5px 10px;
    border-radius: 0px 0px 5px 0px;
}

#pac-input:focus {
        border-color: #4d90fe;
}

.pac-container {
        font-family: Roboto;
        z-index:2500;
}

.buttonLinkStyle {
    color: #1cb394;
    cursor: pointer;
}

.dtWidth {
    width: 130px !important;
}

.ddMargin {
    margin-left: 140px !important;
}

#changer {
width: 100px;

  -webkit-transition: background 1s ease-out;
  -moz-transition: background 1s ease-out;
  -o-transition: background 1s ease-out;
  transition: background 1s ease-out; 
    
    
}


#changer:active {
    top: 0px;
    left: 0px;
    width: 100%;
    background-size: cover;
    position: fixed;
    z-index: 9999999999;
}

#type-selector {
        color: #fff;
        background-color: #4d90fe;
        padding: 5px 11px 0px 11px;
}

#type-selector label {
        font-family: Roboto;
        font-size: 13px;
        font-weight: 300;
}
#target {
    position:absolute;
    z-index:2500;
        width: 345px;
}


.ibox-tools {
float:right;
}

.ibox-title {
    position:relative;
}

.ibox-buttons {
    float:right;
    position:absolute;
    right:25px;
    top:7px
}

.form-buttons {
    float:right;
    margin-bottom: 5px;
    margin-top: 5px;
    /*height:28px;*/
    
}

.dot-green {
    height: 25px;
    width: 25px;
    background-color: green;
    border-radius: 50%;
    display: inline-block;
}

.dot-red {
    height: 25px;
    width: 25px;
    background-color: red;
    border-radius: 50%;
    display: inline-block;
}

.statusResultFailed {
    background-color: #bf3232;
    border: 1px solid #c91b1b;
    width: 52%;
    float: left;
    border-radius: 10px;
    color: white;
    margin-top: 10px;
    box-shadow: -1px 3px 4px 0px #b7b0b0;
}

.statusResultSuccesfull {
    background-color: #21a031;
    border: 1px solid #21a031;
    width: 52%;
    float: left;
    border-radius: 10px;
    color: white;
    margin-top: 10px;
    box-shadow: -1px 3px 4px 0px #b7b0b0;
}

.list-on-hover:hover {
    color: #555 !important;
    text-decoration: none !important;
    background-color: #d8d8d8 !important;
}

.form-buttons-left {
    margin-bottom: 5px
}

.clear-both {

clear:both;
}


.ibox-border {
    border-bottom:3px solid #e7eaec;
}

.dataTables_length select{
    padding-top:3px;
    

}

fieldset {
    display:block;
    /*float:left;*/
    width:100%;
}

.m-none {
    margin:0px;
}


.pager-table {


}

.pager-table nav{
    float:right;
    margin:0px;
}

.pager-table table{
    margin-bottom:6px;        
}


.pager-table table th:not(.pager-table-sorting-asc):not(.pager-table-sorting-desc) {
    background-color:white !important;
}

.pager-table .pagination{    
    margin:2px 0px;
}


.pagination>li:last-child>button {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.pagination>li:first-child>button {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}



.pager-table-info {
    margin-top:10px;    
}

.pager-table-show label {
    font-weight: normal;
    text-align: left;
    white-space: nowrap;
}

.pager-table-show select {
    width: 75px;
    display: inline-block;
    padding-top: 3px;
}

.pager-table-sorting {
    cursor: pointer;    
    background-color:white !important;
}

.pager-table-sorting:after  {
    float:right;
    bottom: 8px;
    right: 8px;
    display: block;
    font-family: 'Glyphicons Halflings';
    opacity: 0.2;
    content: "\e150";    
}

.pager-table-sorting-asc {
    cursor: pointer;    
    background-color:#F5F5F6 !important;
}

.pager-table-sorting-asc:after  {
    float:right;
    bottom: 8px;
    right: 8px;
    display: block;
    font-family: 'Glyphicons Halflings';
    opacity: 0.5;
    content: "\e155";    
}

.pager-table-sorting-desc {
    cursor: pointer;    
    background-color:#F5F5F6 !important;
}

.pager-table-sorting-desc:after  {
    float:right;
    bottom: 8px;
    right: 8px;
    display: block;
    font-family: 'Glyphicons Halflings';
    opacity: 0.5;
    content: "\e156";    
}



.border-top-none {
    border-top:none;
}




.nowrap {
white-space:nowrap;
}

.fc-event {
    cursor:pointer;
}

.selected {
    background-color:#dde99e !important;
}
.xl-modal-window .modal-dialog {
  width: 95%;
}


.wide-modal-window .modal-dialog {
  width: 900px;
}


.cursor-pointer {
    cursor:pointer;
}


.navbar-static-side {
    z-index:1;
}

.label {
    white-space:normal;
}

.hover-object:hover {
    background-color:#f4f4f4;
}

.dl-horizontal dt {
    width:250px;
}

.dl-horizontal dd {
    margin-left:260px;
}


ddt{
    width:35%;float:left
}

ddd{
    margin-left:25%;
    display:block;
    font-weight: bold;
}
ddt-60 {
    width:60%;float:left
}

ddd-60 {
    margin-left:35%;
    display:block;
}
ddt-35 {
    width:35%;float:left
}

ddd-35 {
    margin-left:35%;
    display:block;
}

.dl-horizontal-small dt {
    width:30px;
}

.dl-horizontal-small dd {
    margin-left:50px;
}

.success {
    background-color:#1ab394;
}

.text-success {
    color:#1ab394;
}

.amcharts-export-menu-top-right {
  top: 10px;
  right: 0;
}

.text-light-gray {
    color:#cdcdcd;
}

.border-solid {
    border: 1px solid gray;
}

.instance-status {
    position:absolute; width:18px; 
    height: 18px; 
    border-radius: 9px;
    top: 40px; 
    right: 44px;
}

.instance-status-active {
    background-color: #adff2f;
}

.instance-status-blocked {
    color: #ff0000;
    font-size: 18px;
    background-color: #ffffff;
}

.instance-status-demo-expired {
    background-color: #53a7d8;
}

.instance-status-demo {
    background-color: #ffffff;
    border: 6px solid #adff2f;
}

.widget-active {
    background-color:#233645;
}

.widget-height {
    height:192px;
}
.widget-half-height {
    min-height:140px;
}
.widget-120 {
    min-height:120px;
}

.white-color {
    color:white !important;
}

.inner-li {
    list-style-type: none; 
    border-top: solid 1px; 
    border-left: solid 1px;
}
.outer-li {
    list-style-type: none; 
    border: solid 1px;
}
.left-li-padding {
    padding-left: 15px;
}
.datetime-picker-dropdown {
outline:0;
}

.datetime-picker-dropdown table {

}

.datetime-picker-dropdown table td {
    padding:0px !important;
    border:none !important;

}

.initials-text {
    color: #DFE4ED;
    font-size: 26px;
    position: absolute;
    line-height: 42px;
}
.initials-panel {
    border-radius: 33px;
    height: 42px;
    width: 42px;
    position: relative;
    background-color: #a7b1c2;
    display: flex;
    align-content: center;
    justify-content: center;
}


.datetime-picker-dropdown > li.date-picker-menu div > table .btn-default {
    border: 0;
    background-color: transparent;
    color: black;
}

.datetime-picker-dropdown > li.time-picker-menu div > table {

}

button:focus {outline:0;}

.position-relative {
    position:relative;
}


.btn-gray.btn-outline {
    color: #000000;
}


.btn-gray.btn-outline:hover{
    color: #fff;
}
.btn-gray {
    background-color: #555555;
    border-color: #555555;
    color: #FFFFFF;
}
.btn-gray:hover,
.btn-gray:focus,
.btn-gray:active,
.btn-gray.active,
.open .dropdown-toggle.btn-gray,
.btn-gray:active:focus,
.btn-gray:active:hover,
.btn-gray.active:hover,
.btn-gray.active:focus {
    background-color: #444444;
    border-color: #444444;
    color: #FFFFFF;
}
.btn-gray:active,
.btn-gray.active,
.open .dropdown-toggle.btn-gray {
    background-image: none;
}
.btn-gray.disabled,
.btn-gray.disabled:hover,
.btn-gray.disabled:focus,
.btn-gray.disabled:active,
.btn-gray.disabled.active,
.btn-gray[disabled],
.btn-gray[disabled]:hover,
.btn-gray[disabled]:focus,
.btn-gray[disabled]:active,
.btn-gray.active[disabled],
fieldset[disabled] .btn-gray,
fieldset[disabled] .btn-gray:hover,
fieldset[disabled] .btn-gray:focus,
fieldset[disabled] .btn-gray:active,
fieldset[disabled] .btn-gray.active {
    background-color: #444444;
    border-color: #444444;
}

.hide-bottom-border {
    border-bottom: none!important;
}

.user-category-table-item {
    color: black; 
    list-style-type: none; 
    /*border: 1px solid black;*/ 
    margin-top: -1px
}

.comment-bubble {
    margin-bottom: 10px;
    border-radius: 6px;
    padding: 10px;
    display: inline-block;
}
.comment-bubble-others {
    background-color: #eeeeef;
}
.comment-bubble-me {
    background-color: #eeefff;
}
.comment-bubble-status-change {
    background-color: #feeeee;
}

.comment-date-container {
    border-top: 1px solid #eee; 
    margin-bottom: 30px;
    margin-top: 30px;
}
.comment-center-day {
    right: 48%; 
    position: absolute; 
    margin-top: -20px; 
    background-color: white; 
    padding: 10px;
}

.chat-text-input-area {
    resize: none;
    flex-grow: 8;
    height: 100%;
    display: flex;
    justify-content: space-around;
    background-color: #ffffff;
    padding-right: 0px !important;
    padding-left: 25px;
}
.chat-text-input-area.user-request{
    padding-left: 3.6em !important;
}

.comment-text-area {
    flex-grow: 1;
    height: 100%;
    top: 0.2em;
}

.chat-text-icons {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

#inputtextid {
    resize: none;
    border: 1px #eeefff solid;
    border-right: none;
    padding-left: 8px;
    padding-top: 6px;
}

#inputtextid:focus {
    outline: none !important;
    border: 1px solid #eeeeef;
    box-shadow: 0 0 5px #eeeeef;
    clip-path: inset(-5px 0px -5px -5px);
    border-right: none !important;
}

.chat-text-container {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #eeeeef;
    margin-left: 10px;
    width: 94%;
    padding: 0px;
    margin: 0px;
}

.chat-text-icons {
    resize: none;
    border: 1px #eeefff solid;
    border-left: none;
}

#inputtextid::-webkit-scrollbar {
    display: none;
}

.input-comment-icons {
    font-size: 22px;
    margin: 8px 15px 0 0;
}

.obsolete-config {
    position: absolute;
    right: 40px;
    margin-top: 10px;
    font-size: 24px;
}

.chat-file-icon:before {
    position: relative;
    left: -0.8em;
    top: -0.2em;
}
.chat-delete-file-icon:before{
    position: relative;
    top: -0.2em;
    left: -0.5em;
}

.file-title {
    width: 50px;
    display: -webkit-box; 
    -webkit-line-clamp: 1; 
    -webkit-box-orient: vertical;
    overflow: hidden; 
    text-overflow: ellipsis;
}
.line-ellipsis {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.color-black {
    color: black;
}
.sub-cpo-mini-widget {
    color: white;
    border-radius: 10px;
    padding: 7px 10px;
    margin-right: 15px;
    max-width: 120px;
}

.labelSubCpoBlue {
    background: #0085cc;
    color:white;
}

.labelSubCpoGreen {
    background: #00b793;
    color: white;
}

.labelSubCpoRed {
    background: #ff4461;
    color: white;
}

.bigCap:first-letter {
    text-transform: capitalize;
}

.label-soft-blue {
    background: #5FA3CE;
    color: white;
}
.label-white {
    background: white;
    color: black;
}
.label-gray {
    background: #B1B1B1;
    color: white;
}
.sub-cpo-mini-popup-div {
    vertical-align: top;
    display: inline-block;
    word-wrap: break-word;
    padding-right: 10px;
    min-height: 180px;
}
.text-soft-blue {
    color: #5FA3CE;
}
.checkbox-mid {
    height: 15px;
    width: 15px
}
.bottom-border-white2 {
    border-bottom: white 2px solid;
}
.top-border-white2 {
    border-top: white 2px solid;
}
.form-group-flex {
    align-items: center;
    display: flex;
}
.form-header {
    z-index: 3;
    position: fixed;
    background: #F3F3F4;
    padding: 5px 0;
    top: 0;
    margin: 0;
    left: 245px;
    display: none;
}
@media (max-width: 768px) {
    .form-header {
        left: 25px;
    }
}
@media (min-width: 768px) {
    .form-header {
        left: 245px;
    }
}

.ta-editor.form-control.myform1-height, .ta-scroll-window.form-control.myform1-height {
    min-height: 200px;
    height: auto;
    overflow: auto;
    font-family: inherit;
    font-size: 100%;
}

.form-control.myform1-height > .ta-bind {
    height: auto;
    min-height: 200px;
    padding: 6px 12px;
}
.time-conditions-table {
    max-width: 800px;
    margin-left: auto;
}
.weekday-title-top {
    display: inline;
    position: absolute;
    top: 0px;
    left: 5px;
}
.weekday-header {
    vertical-align: bottom !important;
    position: relative;
    font-weight: normal;
}
.ibox-title-flex-between {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
}
.permission-table-cell {
    cursor: pointer;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
}
.show-new {
    background-color: #F3F3F4;
}
.drag-over {
    border: 1px dashed #000;
}

.subcpo-pricing-widget {
    background: white;
    border-radius: 6px;
    padding: 12px;
    margin: 10px;
    position: relative
}
.subcpo-pricing-widget-save {
    position: absolute;
    right: 39px;
    bottom: 15px;
}
.subcpo-pricing-widget-desc {
    padding: 5px 15px 0px 15px;
}
.lobby-icon-size {
    font-size: 3vh;
}
.lobby-p {
    padding: 1.5vh 2vh!important;
}
.lobby-online-head {
    font-size: 4.5vh;
    font-weight: bold;
    margin: 0px;
}
.lobby-online-head-statistics {
    font-size: 1.5vh;
    margin: 0px;
}
.lobby-online-text {
    font-size: 1.3vh;
    font-weight: bold;
}
.lobby-dashboard-row-flex {
    display: flex;
    justify-content: space-evenly;
    align-items: center
}

.lobby-instance-logo {
    height: 3vh;
    position: absolute;
    right: 10vw;
    top: 1vh;
}
.lobby-navbar {
    margin-bottom: 0;
    height: 5vh !important;
    min-height: 1px!important;
}
.lobby-p-lg {
    padding: 2vh 30px;
}

a:not([href]) {
    /*color: #676a6c;*/
}

.btn-strip {
    background-color: inherit;
    border: none;
}

.lobby-grid {
    padding: 2vh 2vw;
    width: 100vw;
    height: 100%;
    background-color: #F7F7F7;
    display: grid;
    grid-template-columns: 47.5vw 47.5vw;
    grid-column-gap: 1vw;
    grid-row-gap: 2vh;
}

.lobby-grid-item {
    background-color: inherit;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}
.lobby-grid-item-bottom {
    height: 40vh;
}
.lobby-grid-item-top {
    height: 45vh;
}
.lobby-grid-item-signature {
    height: 2vh;
    color: #0D1336;
}

.online-data-container {
    width: 100%;
    height: 100%;
    background-color: inherit;
    display: inline-grid;
    grid-template-columns: 37% 1fr 1fr;
    grid-auto-rows: 47%;
    grid-column-gap: 5%;
    grid-row-gap: 6%;
}
.online-data-item {
    /*display: inline-flex;*/
    text-align: center;
    align-items: center;
    justify-content: center;
}
.online-data-first {
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 1;
    grid-row-end: 3;
}

.online-data-rest {
    padding: 3vh 2vh 2vh 2vh;
}

.statistics-container {
    padding: 1% 3% 1% 2%;
    width: 100%;
    height: 100%;
    background-color: #fff;
    display: inline-grid;
    grid-template-columns: 100%;
    grid-auto-rows: 3%;
    grid-row-gap: 1%;
}

.statistics-item-table1 {
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 1;
    grid-row-end: 4;
    font-size: 2vh;
}
.statistics-item-table2 {
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 4;
    grid-row-end: 7;
    font-size: 2vh;
}
.statistics-item-table3 {
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 7;
    grid-row-end: 17;
}
.statistics-item-table4 {
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 17;
    grid-row-end: 27;
}

.infrastructure-container {
    padding: 1% 2% 1% 1%;
    width: 100%;
    height: 100%;
    background-color: #fff;
    display: inline-grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 47%;
    grid-column-gap: 6%;
    grid-row-gap: 1%;
}

.infrastructure-item {
    align-items: center;
    justify-content: center;
    font-size: 3.4vh;
    padding: 2vh 2vh 2vh 2vh;
    text-align: center;
    margin-top: 2vh;
    margin-bottom: 1.5vh;
}
.infrastructure-item-title {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 1;
    grid-row-end: 1;
    font-size: 2vh;
}
.infrastructure-item-graph {
    grid-column-start: 1;
    grid-column-end: 5;
    grid-row-start: 2;
    grid-row-end: 2;
    font-size: 1.6vh;
}

.customer-container {
    padding: 1% 2% 1% 1%;
    width: 100%;
    height: 100%;
    background-color: #fff;
    display: inline-grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 12%;
    grid-column-gap: 4%;
    grid-row-gap: 1%;
}

.customer-item-title {
    grid-column-start: 1;
    grid-column-end: 5;
    grid-row-start: 1;
    grid-row-end: 1;
    font-size: 2vh;
}

.customer-item {
    padding: 1vh 1.5vh 1vh 1.5vh;
    margin: 0.1vh 1vh 3.5vh 1vh;
    grid-row-start: 2;
    grid-row-end: 5;
    font-size: 3vh;
    text-align: center;
}

.customer-item-graph {
    grid-column-start: 1;
    grid-column-end: 5;
    grid-row-start: 5;
    grid-row-end: 8;
    font-size: 1.6vh;
}
.lobby-color {
    background-color: #0D1336;
    color: white;
}
.lobby-color-inverted {
    background-color: white;
    color: #0D1336;
}
.online-data-para {
    font-size: 1.8vh;
    line-height: 2vh;
    font-weight:normal
}
.infrastructure-para {
    font-size: 1.7vh;
    line-height: 2vh;
    font-weight: normal
}
.customer-data-para {
    font-size: 1.5vh;
    line-height: 1.7vh;
    font-weight: normal;
    margin-top: 1.5vh;
}
.online-data-icon {
    font-size: 3vh;
}
.online-data-count {
    font-size: 4.5vh;
}

.online-data-first-center {
    position: absolute;
    top: 40%;
    text-align: center;
    width: 100%;
}

.online-data-first-top {
    position: absolute;
    top: 5%;
    left: 3%;
    font-size: 2vh;
}

.statistics-table-left {
    width: 6%;
}

.statistics-table-rest {
    width: 32%;
    text-align: center;
    padding: 1vh;
}
.table-body-font {
    font-size: 2.1vh;
}

#DeleteTypeDiv input[type=radio]{
    margin: 3px 0 0;
}
.added-explanation-div{
    padding-left: 2.5em;
    margin: -7px 0 10px
}
.added-explanation-checkbox-div{
    padding-left: 2.5em;
    margin: 6px 0 10px
}
.deletion-type-label{
    display: flex; align-items: self-start;
}
.deletion-type-name{
    padding-left: 1.5em;
}
.padding-x-0{
    padding-left: 0px;
    padding-right: 0px;
}

.text-area-field {
    min-height: 100px;
    min-width: 350px;
    max-width: 350px;
    max-height: 100px;
}

.padding-top-7 {
    padding-top: 7px;
}

.p-x-10 {
    padding-left: 10px;
    padding-right: 10px;
}

.p-y-20 {
    padding-top: 20px;
    padding-bottom: 20px;
}

@media (max-width: 768px) {
    .form-buttons-responsive {
        display: grid;
        float: none;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 10px;
    }
}