﻿@keyframes spinner {
    to {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes spinner {
    to {
        -webkit-transform: rotate(360deg);
    }
}
.pnl_titleCT {
    line-height: 30px;
    font-size: 16px;
    font-weight: 600;
}


.spinner {
    min-width: 24px;
    min-height: 24px;
}

    .spinner:before {
        content: 'Loading…';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 16px;
        height: 16px;
        margin-top: -10px;
        margin-left: -10px;
    }

    .spinner:not(:required):before {
        content: '';
        border-radius: 50%;
        border: 2px solid rgba(0, 0, 0, .3);
        border-top-color: rgba(0, 0, 0, .6);
        animation: spinner .6s linear infinite;
        -webkit-animation: spinner .6s linear infinite;
    }
/*end load more*/

/*Scroll bar*/
/*::-webkit-scrollbar { 
    width: 16px;
}

::-webkit-scrollbar-thumb {
    background-color: #e6e6e6;
}

    ::-webkit-scrollbar-thumb:hover {
        background-color: #CCCCCC;
    }*/

/*End scroll bar*/

/*Switch*/
.onoffswitch {
    position: relative;
    width: 50px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.nfs-width-mini {
    width: 40px;
}

.onoffswitch-checkbox {
    display: none;
}

.onoffswitch-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    height: 22px;
    padding: 0;
    margin: 0;
    line-height: 22px;
    border: 2px solid #CCCCCC;
    border-radius: 22px;
    background-color: #FFFFFF;
    transition: background-color 0.3s ease-in;
}

.nfs-height-mini {
    height: 14px;
    line-height: 14px;
    border-radius: 12px;
}

.onoffswitch-label:before {
    content: "";
    display: block;
    width: 22px;
    margin: 0px;
    background: #FFFFFF;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 26px;
    border: 2px solid #CCCCCC;
    border-radius: 22px;
    transition: all 0.3s ease-in 0s;
}

.nfs-height-mini:before {
    width: 18px;
    right: 17px;
    border-radius: 12px;
}

.onoffswitch-checkbox:checked + .onoffswitch-label {
    background-color: #007CC0;
}

    .onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
        border-color: #007CC0;
    }

        .onoffswitch-checkbox:checked + .onoffswitch-label:before {
            right: 0px;
        }
/*End switch*/

.text-black {
    color: black;
}

.text-warning {
    color: #9F6000;
}

.text-italic {
    font-style: italic;
}

.text-disable {
    color: rgb(112,116,119) !important;
}


.text-over {
    color: red;
}

input.k-textbox, textarea.k-textbox {
    width: 100%;
    /*border-color: #c0c0c0;*/
}

    input.k-textbox:focus, textarea.k-textbox:focus {
        border-color: #94c0d2;
        outline: none;
        box-shadow: 0 0 5px #9ecaed;
    }

.sapMSwt {
    cursor: pointer;
}

.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
    padding: 0px;
}

.row {
    margin: 0px 0px 5px 0px;
}


.km-list > li {
    /*cursor: pointer;*/
    background: rgba(255,255,255,0.8);
    /*border-color: #f2f2f2;*/
    border-bottom: 1px solid #e5e5e5;
    padding:5px;
}

.more {
    border-bottom: 1px solid #e5e5e5 !important;
    height: 40px;
    line-height: 40px !important;
    text-align: center;
    padding: 0 !important;
}

/*More button*/

.km-list .more.k-state-selected {
    background-color: #e5e5e5 !important;
}
/*end*/


.km-list > li:hover {
    /*cursor: pointer;*/
    background: #f7f7f7;
}

.km-list {
    cursor: pointer;
}

    .km-list .k-state-selected {
        background-color: #e6f2f9 !important;
        color: black;
    }

#listView {
    overflow: auto;
}

.add-on .input-group-btn > .btn {
    border-left-width: 0;
    left: -2px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.add-on .form-control:focus {
    box-shadow: none;
    -webkit-box-shadow: none;
    border-color: #cccccc;
}



::-webkit-input-placeholder {
    font-style: italic;
    /*color: black;*/
}

:-moz-placeholder {
    font-style: italic;
    color: black;
}

::-moz-placeholder {
    font-style: italic;
    color: black;
}

:-ms-input-placeholder {
    font-style: italic;
    color: black;
}

.btn-panel-bottom {
    background-color: rgba(54,62,67,0.96);
    height: 27px;
    width: 100%;
    bottom: 0px;
    position: absolute;
    padding-top: 0;
    border-top: 0;
    /*border-right: 1px solid #ccc;*/
}


.upper {
    text-transform: uppercase;
}

.left-panel {
    float: left;
    width: 280px;
    height:100%;
}

.right-panel {
   
    height:100%;
}

.right-content {
    background-color: white !important;
}

.sapMLabel {
    font-size: 12px;
    color: #666666;
    /*color: #878787;*/
    font-weight: normal;
}

.SHPTControl-label {
    /*color: rgb(112,116,119);*/
    text-align: right;
    /*font-weight: 500;*/
}

/*#region footer */

.btn-footer {
    width: 40px;
    line-height: 30px !important;
}

/*#endregion */

.input-form {
    background-color: rgba(255,255,255,0.8);
}

.sapMForm {
    margin: 10px 20px;
}

.sapMBarPH {
    /*font-weight: bold;*/
    width: 100%;
    text-align: center;
    color: #4E4E4E;
    height: 3rem;
    line-height: 3rem;
    font-size: 1.2rem;
    /*background-color: #e5e5e5;
    background-color: rgb(229,229,229) !important;*/
    border-bottom: 1px solid #cccccc;
    text-transform: uppercase;
    background-color: #daecf4;
    background-image: none,linear-gradient(to bottom,rgba(255,255,255,.45) 0,rgba(255,255,255,.0) 100%);
    border-bottom-style: double;
    border-bottom-width: 3px;
    border-bottom-color: #94c0d2;
}

.sapListViewTitle {
    color: #333333;
    font-size: 15px;
}

.sapHeaderTitle {
    color: #333333;
    font-size: 12px;
    font-weight: bold;
}


.textbox {
    color: black !important;
    border-color: #c0c0c0 !important;
}

input.k-textbox, textarea.k-textbox, k-input {
    /*height: 30px;*/
    color: black;
    border-color: #abc1de;
}

.k-autocomplete.k-state-default, .k-picker-wrap.k-state-default, .k-numeric-wrap.k-state-default, .k-dropdown-wrap.k-state-default {
    /*height: 30px;
    line-height: 30px;*/
    color: black !important;
    border-color: #c0c0c0;
}

input.k-textbox:focus, textarea.k-textbox:focus {
    border-color: #94c0d2;
    outline: none;
    /*border-color: #9ecaed;*/
    /*box-shadow: 0 0 5px #9ecaed;*/
    box-shadow:none!important;
    background-color:#f5f5f5;
}

.k-combobox.k-header {
    padding: 0px 0px 0px 0px;
    height: 25px !important;
    background-color: white;
    border:none;
    /*border-bottom-width: 1px;*/
}

.grid-group {
    color: blue;
    font-size: 14px;
}

.k-grouping-row td {
    background-color: #F7F7F7 !important;
    border-bottom: 1px solid #c0c0c0;
}
/*row {
            padding: 0;
            margin: 0;
        }*/
.form-group {
    margin-bottom: 5px !important;
    /*margin: 0px 20px 0px 20px;*/
}

.label-center {
    padding-top: 6px;
}

/*column menu*/
.k-column-menu, .k-column-menu .k-item {
    box-shadow: none;
    border-color: #e5e5e5;
    background-color: white;
    font-weight: normal;
    font-size: 12px;
    color: black;
}

/*custom grid*/
/*.k-i-collapse {
    display: none;
}*/





#row1 tr th, #row2 tr th, #row3 tr th, #row4 tr th {
    background-color: white !important;
}

#row2 tr th {
    padding-top: 8px;
    padding-bottom: 0px;
    height: 0;
    vertical-align: bottom;
}

    #row2 tr th label {
        margin: 0;
        padding: 0;
        vertical-align: bottom;
    }

#row3 tr th {
    padding-top: 0px;
    padding-bottom: 0px;
    height: 0;
}

#row4 tr th {
    padding-top: 0px;
}

/*header*/
.k-grid thead tr th{
    font-size:15px!important;
    color: #505458 !important;
    font-weight: 600 !important;
    /*height: 25px;*/
    
    background-color: #f2f2f2 !important;
    
    border: 1px solid #9a9a9a;
    text-align: left !important;
}
.k-grid thead tr th a {
    color: #505458 !important;
}

div.k-grid-header, div.k-grid-footer {
    background-color: #f2f2f2 !important;
}

/*row content*/
.k-grid tr td {
    color: black;
    /*height: 25px;*/
    /*background-color: rgba(255,255,255,0.8) !important;*/
    /*background-color: white;*/
    border-top: none !important;
    border-left: 1px solid #9a9a9a;
    /*border-right: 1px solid #abc1de;*/
}

    /*.k-alt {
            background-color: rgba(255,255,255,0.8) !important;
            background-color: white;
        }*/

    .k-grid tr td[role="gridcell"] {
        border-bottom: 1px solid #9a9a9a;
            cursor: pointer;
    }

.k-grid {
    /*border-color: #abc1de;*/
    height: 100%;
    border: solid 1px #000000;
}
 
    #right-popupbutton {
        background-color: #f2f2f2;
        height:29px;
        border-top: solid 1px #abc1de;
        border-left: solid 1px #abc1de;
        border-right: solid 1px #abc1de;
    }
.col-right {
    width: 80% !important;
    float: right;
}

#thMeaSure > span {
    width: 80% !important;
    float: right;
}

/*.k-grid-header {
            padding-right: 1px !important;
        }

         .k-grid-footer {
            padding-right: 1px !important;
        }

         .k-grid-content {
            padding-right: 1px !important;
        }*/

/*end custom grid*/

.div-content {
    border-radius: 4px;
    margin: 5px 10px !important;
    padding: 4px 0 14px 0 !important;
}

.k-grid-header .k-header {
    font-size: 12.5px !important;
}

/*.k-grid-header {
    height: 30px
}*/

.blue {
    color: blue;
}

.required {
    color: red;
    font-weight: bold;
}


.border-required {
    border-color: red !important;
}

.k-grid .k-grid-edit-row td {
    padding-top: 1px;
    padding-bottom: 1px;
}

.k-list-container {
    /*border-color: #94c0d2;*/
    background-color: #FFFFFF;
}

.k-state-selected {
    background-color: #e2e4e4;
}

k-grouping-row k-state-selected {
    background-color: #81C784;
}

.header-template tr td {
    background-color: #e5e5e5;
}

.k-grid .k-header-column-menu {
    margin-left: 0px;
}


/*search textbox*/
.search-icon {
    /*position: absolute;*/
    background-color: white;
    text-align: center;
    height: 25px;
    width: 25px;
    cursor: pointer;
    vertical-align: middle;
}

    .search-icon .glyphicon {
        font-size: 15px;
    }

    .search-icon:hover {
        background: #f7f7f7;
    }

.search-area input.k-textbox {
    border: none;
    height: 100%;
    width: 65%;
    padding-left: 10px;
    font-size: 12px;
}

    .search-area input.k-textbox:focus {
        border-color: none;
        outline: none;
        box-shadow: none;
    }

.search-area {
    border: 1px solid #94c0d2;
    height: 25px;
    width: auto;
}

    .search-area:hover {
        border: 1px solid #7ec6e3;
    }

/*end search textbox*/


.k-grid-content table .hight-light {
    background-color: yellow;
    color: #555;
}

.k-header, .k-grid-header-wrap, .k-grid .k-grouping-header, .k-grid-header, .k-pager-wrap, .k-pager-wrap .k-textbox, .k-pager-wrap .k-link, .k-grouping-header .k-group-indicator {
    background-color: white;
}

.full-height {
    /*margin: 2px;*/
    height: calc(100% - 5px);
}

/*css hide icon control*/
.hideArrow {
    padding: 0 0 0 0;
    margin:0;
    border:0;
}

    .hideArrow > .k-input {
        border-radius: 3px 3px 3px 3px;
    }
/*end*/



.sap-label {
    color: rgb(112,116,119);
    font-size:12px;
}

.sap-label-bold {
    font-weight: 600;
    font-size: 14px;
line-height: 20px;
}



md-tabs.md-default-theme md-ink-bar, md-tabs md-ink-bar {
    color: #009de0 !important;
    background-color: #009de0 !important;
}

.md-tab > md-icon {
    /*color: whitesmoke;*/
    margin-bottom: 5px;
    background-color: white;
    border: 1px solid #009de0;
    border-radius: 100px;
}

    .md-tab > md-icon > .tab-icon {
        color: #009de0;
    }

md-tabs.md-default-theme .md-tab.md-active md-icon {
    background-color: #009de0;
    border: none;
}

    md-tabs.md-default-theme .md-tab.md-active md-icon > .tab-icon {
        color: white;
    }

.info-common {
    background-color: #e6f2f9;
    margin: 0px !important;
    font-size: 16px !important;
}

.info-tabs {
    background-color: #e6f2f9;
}

.md-tab-detail-content-first{
    height:50px;
}

.md-tab-detail-content-second{
    height:35px;
    width:1100px;
    /*float: right;*/
    background: #c0c0c0;
    text-align: right;
}


.launchpadTitle {
    /*text-transform: uppercase;*/
    color: #666666;
    font-family: Arial, Helvetica, sans-serif;
    /*font-size: 16px;*/
}

 .k-menu{
        background-color: #f2f2f2 !important;
        border: none !important;
    }

.glyphicon {
    cursor: pointer
}


.k-splitter .k-scrollable {
    overflow: hidden;
}

.k-grid-toolbar:first-child, .k-grouping-header + .k-grid-toolbar {
    border-width: 0 0 1px;
    background-color: #f2f2f2 !important;
    height: 25px;
    padding: 0 5px;
    margin: 0;
    line-height: 25px;
    text-transform: uppercase;
}

.tinnhan {
    background-color: yellowgreen;
}

.k-tabstrip .k-tabstrip-items {
    padding: 0;
}

.k-header, .k-grid-header-wrap, .k-grid .k-grouping-header, .k-grid-header, .k-pager-wrap, .k-pager-wrap .k-textbox, .k-pager-wrap .k-link, .k-grouping-header .k-group-indicator {
    background-color: none !important;
}

.k-tabstrip-wrapper {
    height: calc(100% - 32px);
}

.k-tabstrip {
    height: 100%;
}

    .k-tabstrip .k-content.k-state-active {
        background-color: #fff;
        color: #787878;
        height: 100%;
    }

.k-tabstrip-items .k-state-default .k-link, .k-tabstrip-items .k-state-disabled .k-link, .k-panelbar > li.k-state-default > .k-link {
    text-transform: uppercase;
    font-weight: 600;
}

.k-state-hover, .k-state-hover:hover, .k-splitbar-horizontal-hover:hover, .k-splitbar-vertical-hover:hover, .k-list > .k-state-hover, .k-scheduler .k-scheduler-toolbar ul li.k-state-hover, .k-pager-wrap .k-link:hover, .k-dropdown .k-state-focused, .k-imagebrowser-dropzone, .k-mobile-list .k-item > .k-link:active, .k-mobile-list .k-item > .k-label:active, .k-mobile-list .k-edit-label.k-check:active, .k-mobile-list .k-scheduler-timezones .k-edit-field:nth-child(2):active, .k-mobile-list .k-recur-view .k-check:active {
    color: #fff !important;
}

.k-tabstrip > .k-content, .k-panelbar .k-tabstrip > .k-content {
    padding: 0 !important;
    margin: 0 !important;
}

.k-tabstrip-wrapper .k-header {
    background-color: rgba(255, 192, 128,1);
}

.k-tabstrip-wrapper .k-widget {
    border: none;
    color: #000000;
}

.k-tabstrip-items .k-state-active, .k-ie7 .k-tabstrip-items .k-state-active .k-loading {
    color: #fff;
    background-color: #68C39F;
}

    .k-tabstrip-items .k-state-active .k-link {
        color: #fff;
    }
.bg-dtzsoft {
    background-color: rgba(255, 192, 128,1);
    height: 100%;
}