/*
.vertical-align {
  display: flex;
  flex-direction: row;
}

.vertical-align > [class^="col-"],
.vertical-align > [class*=" col-"] {
  display: flex;
  align-items: center;     /* Align the flex-items vertically */
/*  justify-content: center; /* Optional, to align inner flex-items
                              horizontally within the column  */
/*}
*/


/*
.vertical-align {
    display: flex;
    align-items: center;
}
*/

.col:not(:first-child,:last-child) {
  padding-right:7px;
  padding-left:7px;
}

.fix-col{
	width: auto;
	margin-top: 10px;
}

.fix-left-margin{
    margin-left: 20px;
}

.left-margin-10 {
    margin-left: 10px;
}


.low-padding{
    padding-right: 7px !important;
    padding-left: 7px !important;
}

.no-padding {
    padding-right: 0px !important;
    padding-left: 0px !important;
}

.no-bottom-margin{
    margin-bottom: 0px;
}

.no-top-margin {
    margin-top: 0px;
}

.no-left-margin {
    margin-left: 0px;
}

.no-right-margin {
    margin-right: 0px;
}

.add-bottom-margin{
    margin-bottom: 20px;
}

.table-auto {
    width: auto;
    display: table;
}

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

.label{
    white-space: normal;
}

.label-wa {
    display: block;
    text-align: left;
}

.highcharts-container {
    touch-action: pan-x !important;
}

.trunc {
    width: inherit;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.overflow-scroll{
    overflow: scroll;
}

.overflow-auto {
    overflow: auto;
}

.hiddenCol {
    display: none;
} 
/*.navbar-collapse{
    width: calc(100% - 7px)
}*/

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 10px;
}

::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background-color: rgba(0,0,0,.5);
    box-shadow: 0 0 1px rgba(255,255,255,.5);
}

table.dataTable tbody td nopadding-lr
{
    padding-left: 0px;
    padding-right: 0px;
}

.Level0 {
    background-color: #92B3D7;
}

.Level0LC {
    background-color: #FDC500;
}

.Level0EG {
    background-color: #21A067;
}

.Level0RS {
    background-color: #E74030;
}

.Level0FoCa {
    background-color: #9B66A5;
}

.Level1 {
    background-color: #AEB0D9;
}

.Level2 {
    background-color: #ECE9E6;
}


@media (min-width: 340px) and (max-width: 399px) {
    .dev-width {
        width: 300px;
    }
}

@media (min-width: 400px) and (max-width: 449px) {
    .dev-width {
        width: 350px;
    }
}

@media (min-width: 450px) and (max-width: 499px) {
    .dev-width {
        width: 400px;
    }
}

@media (min-width: 500px) and (max-width: 549px) {
    .dev-width {
        width: 450px;
    }
}

@media (min-width: 550px) and (max-width: 599px) {
    .dev-width {
        width: 500px;
    }
}

@media (min-width: 600px) and (max-width: 649px) {
    .dev-width {
        width: 550px;
    }
}

@media (min-width: 650px) and (max-width: 699px) {
    .dev-width {
        width: 600px;
    }
}

@media (min-width: 700px) and (max-width: 749px) {
    .dev-width {
        width: 650px;
    }
}

@media (min-width: 750px) and (max-width: 849px) {
    .dev-width {
        width: 700px;
    }
}

@media (min-width: 850px) and (max-width: 949px) {
    .dev-width {
        width: 800px;
    }
}

@media (min-width: 950px){
    .dev-width {
        width: 850px;
    }
}

@media (min-width: 680px) {
    .mid-field {
        width: 300px !important;
    }

    .large-field{
        width: 500px !important;
    }
}

@media (min-width: 992px) {
    .child-container {
        width: 1170px !important;
    }
}

@media (min-width: 1200px) {
    .child-container {
        width: 1320px !important;
    }
}

@media (max-width: 640px) {
    .btn-responsive {
        padding: 4px 9px;
        font-size: 90%;
        line-height: 1.2;
    }

    .add-wrap {
        white-space: normal;
    }

    h1 {
        font-size: 9.0vw;
    }

    h2 {
        font-size: 7.5vw;
    }

    h3 {
        font-size: 6.5vw;
    }

    .pull-right {
        float: none !important;
    }

    .alert-warning {
        line-height: 40px;
        display: block;
    }

    .width-column-max-40 {
        max-width: 40px;
    }

    .width-column-max-50 {
        max-width: 50px;
    }

    .width-column-max-60 {
        max-width: 60px;
    }

    .width-column-max-100 {
        max-width: 100px;
    }

    .width-column-max-180 {
        max-width: 180px;
    }

    .width-column-max-300 {
        max-width: 300px;
    }

    .width-column-max-500 {
        max-width: 500px;
    }

    .width-column-40 {
        min-width: 40px;
    }

    .width-column-50 {
        min-width: 50px;
    }

    .width-column-60 {
        min-width: 60px;
    }

    .width-column-70 {
        min-width: 70px;
    }

    .width-column-80 {
        min-width: 80px;
    }

    .width-column-100 {
        min-width: 100px;
    }

    .width-column-150 {
        min-width: 150px;
    }

    .width-column-180 {
        min-width: 180px;
    }

    .width-column-200 {
        min-width: 200px;
    }

    .width-column-250 {
        min-width: 250px;
    }

    .width-column-300 {
        min-width: 300px;
    }

    .width-column-350 {
        min-width: 350px;
    }

    .width-column-500 {
        min-width: 500px;
    }

    .large-field {
        width: 100%;
    }

}