@import url("navbar.css");
@import url("sidebar.css");
@import url("mobile.css");
@import url("dropdown.css");
@import url("datepicker.css");
@import url("chart.css");
@import url("pos.css");
@import url("b2b.css");



/*GENERAL COLOR STYLE*/
    html body {
        background:#FFFFFF;
        -webkit-font-smoothing: antialiased;    
        font-family: 'Roboto', sans-serif;
        color:#4e5d6c; 
    }

    .header-navbar.navbar-semi-dark {
            background: -webkit-linear-gradient(#F5F4F5, #f4f5f8);
            background: -moz-linear-gradient(#F5F4F5, #f4f5f8);
            background: -o-linear-gradient(#F5F4F5, #f4f5f8);
            background: linear-gradient(#F5F4F5, #f4f5f8);
        }

    .header-navbar.navbar-semi-dark .navbar-header {
        background: #313643;
        border-bottom:none;
    }

    .main-menu.menu-dark {
        color: #CCC;
        background: #313643
    }

    .main-menu.menu-dark .navigation {
        background: #313643;
        margin-bottom: 35px;
    }

    .main-menu.menu-dark .main-menu-header .menu-search {
        background: #dedddc url(../svg/search.svg) no-repeat 0% 50%;
        padding: .2rem .2rem .2rem 1.8rem;
        width: 115px;
        font-size: .75rem;
        color: #5d5d5d;
        border: 1px solid #cfcecd;
        border-radius: .25rem;
        box-shadow: none;
    }

    .border-custom-color td {
        border-top: inherit;
        border-bottom: inherit
    }

    select.form-control {
        padding-top: 0!important;
        padding-bottom: 0!important
    }

    @-moz-document url-prefix() {
        ul li a .children-in {
            position: relative;
            right: 3px;
            top: -14px
        }
    }

    head {
        clear: both
    }

    head title {
        font-family: "xs 0px, sm 530px, md 768px, lg 992px, xl 1190px"
    }

    [data-usn-if],
    body:after {
        display: none
    }
    .bg-none{background:none;}
    .bg-blue {background: #0087FF;}
    .bg-yellow {background: #fda424}
    .bg-red {background: #fc566a}
    .bg-green {background: #62c26f}
    .bg-white {background: #FFFFFF}
    .bg-gray{background: #313643;
    color:#FFF;
    font-weight: bold}

    .co-blue {color: #0087FF;}
    .co-yellow {color: #fda424}
    .co-red {color: #fc566a}
    .co-green {color: #62c26f}
    .co-white {color: #FFFFFF}




    .wt-content .wizard {
    width: 100%;
    }

    .wt .wizard .content {
        margin-left: 0!important;
    }



    .wt-form ul{
        list-style: none;
        margin:0;
        padding: 0;
    }

    div.wt-form ul li.tab-checkbox{
        left:0px;
        margin-top: 18px;
        margin-left:3px
    }


/*GENERAL COLOR*/

/*PRELOADER*/
    /* The Loader */

    .loader-overlay {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        background-color: #1f212a;
        z-index: 99999999;
    }

    .loaded .loader-overlay {
        -webkit-animation: fade-out 2263038ms ease-out;
        animation: fade-out 2263038ms ease-out;
        opacity: 0;
        display: none;
    }

    .loader {
        position: relative;
        top: 50vh;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 74px;
        height: 74px;
        z-index: 9;
    }

    .spinner {
        width: 100px;
        height: 100px;
        background: url(../ximages/preload.svg);
        background-size: 100px 100px;
        border-radius: 50%;
        position: relative;
        display: inline-block;
    }

    .spinner:after,
    .spinner:before {
        content: "";
        display: block;
        width: 100px;
        height: 100px;
        border-radius: 50%;
    }

    .spinner-1:after {
        position: absolute;
        top: -4px;
        left: -4px;
        border: 6px solid transparent;
        border-top-color: white;
        border-bottom-color: white;
        animation: spinny 1s linear infinite;
    }

    @keyframes spinny {
        0% {
            transform: rotate(0deg) scale(1);
        }
        50% {
            transform: rotate(140deg) scale(1.2);
        }
        100% {
            transform: rotate(360deg) scale(1);
        }
    }
/*PRELOADER*/

/*MOBİL HIDDEN-DIV*/


    @media (max-width:767px) {
        .hidden-div {
            position: absolute;
            overflow: hidden;
            clip: rect(0 0 0 0);
            height: 1px;
            width: 1px;
            margin: -1px;
            padding: 0;
            border: 0;
        }
        
    }

    @media (max-width:1040px) {
        .hidden-div-lg {
            position: absolute;
            overflow: hidden;
            clip: rect(0 0 0 0);
            height: 1px;
            width: 1px;
            margin: -1px;
            padding: 0;
            border: 0;
        }
       
    }


    @media (max-width:440px) {
        .hidden-div-sm {
            position: absolute;
            overflow: hidden;
            clip: rect(0 0 0 0);
            height: 1px;
            width: 1px;
            margin: -1px;
            padding: 0;
            border: 0;
        }
    }

    @media (max-width:780px) {
        .paddingLeftZero {
            padding-left:7px;
            margin-left:7px;
        }
    }


/*MOBİL HIDDEN-DIV*/

/*SCROLLBAR*/

    ::-webkit-scrollbar {
        width: 4px;
        height: 5px;
    }

    ::-webkit-scrollbar-track {
        border-radius: 10px;
        background: rgba(110, 130, 150, 0.1);
    }

    ::-webkit-scrollbar-track:hover {
        border-radius: 10px;
        background: rgba(110, 130, 150, 0.2);
    }

    ::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background: rgba(70, 90, 110, 0.2);
    }

    .body::-webkit-scrollbar-thumb:hover {
        background: rgba(70, 90, 110, 0.4);
    }

    ::-webkit-scrollbar-thumb:active {
        background: rgba(05, 55, 65, .4);
    }


/*SCROLLBAR*/

/*FRAME*/
    .row-frame{
        top:0px;
        bottom:0px;
        overflow-y: auto!important;
        overflow-x: hidden;
        width: 100%;
        height:calc(100vh - 0px);
        -webkit-backdrop-filter: blur(20px);
        -webkit-background-clip: padding-box;
        background-clip: padding-box;
    }

    .wt-frame{
        background-color:#ebeef3;
        display: flex;
        flex-direction: column;
        height:calc(100vh - 2px);
        margin:0;
    }

    .wt-framex{
        background-color:#ebeef3;
        display: flex;
        flex-direction: column;
        height:calc(100vh - 2px);
        margin:0;
    }
    
    .wt-frame-top{
        background-color: #f4f5f8;
        padding:0;
        flex: 0 0 auto;
        background: linear-gradient(0, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;  
        background-color: #f4f5f8;
    }
    .wt-frame-tab{
        height: 70px;
        padding:0;
        flex: 0 0 auto;
        margin-top: 1px;
        margin:0 14px;
    }
    
    .wt-frame-center {
        flex: 1 1 auto;
        position: relative;
        overflow-y: auto;
        overflow-x: hidden;
        padding:0;
        height:calc(100vh - 140px);
        margin:0 14px;
    }

    .wt-frame-center-list {
        flex: 1 1 auto;
        position: relative;
        overflow-y: auto;
        overflow-x: hidden;
        padding:0;
        height:calc(100vh - 100px);
        margin:0 14px;
    }

    .wt-frame-center-angular {
        flex: 1 1 auto;
        position: relative;
        overflow-y: auto;
        overflow-x: hidden;
        padding:0;
        height:calc(100vh - 170px);
        margin:0 14px;
    }

    .wt-frame-bottom {
        flex: 0 0 auto;
        height: 50px;
        padding:0;
        background: linear-gradient(180deg, #cbd3e1, #cbd3e1 51%, transparent 50%) top left / 100% 1px no-repeat;
        background-color: #f4f5f8;
    }

/*FRAME*/

/*TOP-STYLE*/
    .top-buttons div{
        display: inline-flex;
    }

    .bar-buttons{margin-right: 10px;}

    .mob-bar-buttons button,
    .bar-buttons button,
    .big-bar-buttons button{
        width: 28px;
        min-width: 28px;
        line-height: 1px;
        height: 28px;
        border: 0.5px solid #CFCECF;
        border-radius: 5px;
        background: -webkit-linear-gradient(#FDFDFD, #ECECEC) !important;
        font-family: 'ion';
        padding: 4px 0;
        font-size: 1rem;
        margin-top:3px;
        color: #737373;
        outline: none;    
    }

    .bar-buttons button:hover,
    .bar-buttons button:active,
    .mob-bar-buttons button:hover,
    .mob-bar-buttons button:active,
    .big-bar-buttons button:hover,
    .big-bar-buttons button:active{
        color: #565656;
        background: -webkit-linear-gradient(#E5E5E6, #D5D5D5) !important;
        cursor: pointer;
    }

    .mob-bar-buttons button{
        border-radius: 0;
        width: 34px;
        border-right: none;
    }
    .mob-bar-buttons button:first-child{
        border-top-left-radius: .25rem;
        border-bottom-left-radius: .25rem;
    }
    .mob-bar-buttons button:last-child{
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
        border-right: 0.5px solid #CFCECF;
    }

    .big-bar-buttons button{
        width: 100%;
        font-weight: 300;
        font-family: 'Roboto', sans-serif;
        font-size: .85rem;
        padding: 0 14px;
        margin-right: 5px;
    }

    .analyze-btn button{
        font-weight: 300;
    }
    
    .top-text p{
        margin: 0;
        padding: 0;
        font-weight: 300;
        text-align: center;
    }

    .nav-search{
        padding-left: 0rem;
        float: right;
        width: 100%;
        height: 40px;
        padding-top:4px;
        margin-bottom:4px;
    }

    .nav-search-button{
        background: none;
        height: 34px;
        font-size: .8rem;
        padding:0px;
        margin-top:0px;
        border-radius:3px; 
        border: .5px solid rgba(206, 204, 206, 0.75);
    }

    .nav-search-button i{
        font-size:16px;
        color:#686e87;
        padding-right:0px;
        padding-left:0px;
    }


    .nav-search-input{
        height: 34px;
        line-height: 34px;
        padding-left: 7px;
        font-size: .8rem;
        border:none;
        background:
        linear-gradient(180deg, #cbd3e1, #cbd3e1 51%, transparent 50%) top    left  / 100% 1px no-repeat,
        linear-gradient(90deg,  #cbd3e1, #cbd3e1 51%, transparent 50%) top    right / 1px 100% no-repeat,
        linear-gradient(0,      #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat,
        linear-gradient(-90deg, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom left  / 1px 100% no-repeat;
        background-color: rgba(255, 255, 255, 1);
        color:#686e87;        
    }

    .nav-search-r-button{
        border-left:none;
        padding-right:7px;
        padding-left:7px;
    }

    .nav-search-l-button{
        padding-left:7px;
    }


    .nav-search-r-button:hover,
    .nav-search-r-button:focus,
    .nav-search-l-button:hover,
    .nav-search-l-button:focus{
        background: #cbd3e1;
    }

    .nav-search-dropdown{
        padding:10px;
        background: #FFFFFF;
        border:.5px solid #cbd3e1;
        margin-top:2px;
        width:100%;
        
        border-radius: .25rem;
        border: 0.5px solid #cbd3e1;
        -webkit-box-shadow: -1px 1px 8px -1px rgba(203, 211, 225, 1);
        -moz-box-shadow: -1px 1px 8px -1px rgba(203, 211, 225, 1);
        box-shadow: -1px 1px 8px -1px rgba(203, 211, 225, 1);
    }
    
    .nav-search-dropdown li{
        padding-top:4px;
        padding-bottom:4px;
    }
    .nav-search-dropdown li a{
        color:#686e87;
        font-size: .8rem;
        font-weight: 300;
    }

    span#search_concept{
        color:#686e87;
    }

    .nav-search-dropdown li a:hover{
        color:#333;
    }

    ul.mega-dropdown-menu.dropdown-menu.search-detail{
        width: 320px;
        height: calc(100vh - 50px);
        top:41px;
        background-color: #ebeef3;
        -webkit-box-shadow: 10px 0px 14px -9px rgba(203,211,225,0.2);
        -moz-box-shadow: 10px 0px 14px -9px rgba(203,211,225,0.2);
        box-shadow: 10px 0px 14px -9px rgba(203,211,225,0.2);
        border-left:none;
        border-bottom:none;
        border-top:none;
        border-radius: 0px;
        position: absolute;
        z-index: 9999;
        right: -25px;    
    }
    
    .sdb-header{
        padding: 0px 0;
        height: 67px;
        padding-top:20px;
        background: linear-gradient(0, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
    
    }

    .sdb-header div:last-child{
        text-align: right;
    }
    

    .sdb-header div:last-child button{
    margin-right: 14px;
    background:rgba(235, 238, 243, 1);
    border:.5px solid #cbd3e1;
    border-radius: .25rem;
    padding: 5px 10px;
    font-size: .875rem;
    color:#686e87;
    height: 30px;
    }

    .sdb-header div button:hover{
        border:.5px solid #0087ff;
        color:#0087ff;
        cursor: pointer;    
    }


    .sdb-header h1{
        font-size: .825rem;
        font-size: .825rem;
        
        text-transform: capitalize;
        white-space: nowrap;
        color: #263038;
        margin: 0;
        padding: 0;
        line-height: 1;
        white-space: nowrap;
    }

    div#filter-button{
        text-align:left;
        background:rgba(235, 238, 243, 1);
        border:.5px solid #cbd3e1;
        border-radius: .25rem;
        padding: 0;
        font-size: .875rem;
        color:#686e87;
        width:120px;
        height: 30px;
    }

    div:hover#filter-button{
        border:.5px solid #0087ff;
        color:#0087ff;
    }

    #filter-button ul li a:hover {
        color:#0087ff;
    }

    #filter-button ul {
        padding: 0;
        list-style: none;
        position: relative;
        display: inline-block;
    }

    #filter-button ul li {
        float:left;
        height: 30px;
        padding-top:6px;
        width: 120px;
        padding-left:14px;    
    }

    #filter-button ul li:hover {
    cursor:pointer; 
    }
        
    #filter-button ul li a {
    display: block; 
    padding:0px;	
    color:#686e87;
    text-decoration: none;
    }



    #filter-button ul ul {
        display: none;
        background: #FFFFFF;   
        padding:0px;
        width:120px;
        position: absolute;
        z-index:999999;
        top: 30px;
        left:0px;
        border-radius: .25rem;
        border: 0.5px solid #cbd3e1;
        -webkit-box-shadow: -1px 1px 8px -1px rgba(203, 211, 225, 1);
        -moz-box-shadow: -1px 1px 8px -1px rgba(203, 211, 225, 1);
        box-shadow: -1px 1px 8px -1px rgba(203, 211, 225, 1);
    }

    #filter-button ul li:hover > ul {
        display: block;
    }

    #filter-button ul ul li {
        float: none; 
        text-align:left;
        position: relative;
        background: linear-gradient(0, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
        padding: 6px 14px;
        font-size: .75rem;
        height: 30px;
        width: 120px;
    }

    #filter-button ul ul li:hover {
        background:#0087FF;
        color: #FFFFFF;
    }

    #filter-button ul ul ul { 
    position:absolute;
    top:-1px;
    left:100%;
    width:185px;
    color:#686e87; 
    }
    #filter-button ul ul ul li{ 
        width: 185px;
        padding: 6px 0px;
        text-align: left;
    }

    #filter-button ul ul ul li div{
        text-align: left;
        padding-left:5px;
        height: 30px;
    }

    #filter-button ul ul ul li div select{
        width:100%;
        height: 22px;
        padding-right: .75rem\9;
        vertical-align: middle;
        background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23333' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") right .75rem center no-repeat rgba(255, 255, 255, 0.45);
        background-image: none\9;
        background-size: 8px 10px;
        border: .5px solid #cbd3e1;
        border-radius: .25rem;
        -moz-appearance: none;
        font-size: .875rem;
        
        -webkit-box-shadow: inset 0 1px 1px rgba(150, 200, 254, .075);
        box-shadow: inset 0 1px 1px rgba(150, 200, 254, .075);
        -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        -moz-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        -moz-appearance: none;
        appearance: none;
        -webkit-appearance: none;
        color: #686e87;
        padding: 0px 4px;
        margin:0px;
        margin-top:-2px;
    }



    #filter-button ul ul ul li:hover{
        background: #eaf1f7;
        color:#686e87;     
    }
    



    .sdb-cell-1{
        max-width: 60px;
    }
    .sdb-cell-2{
        max-width: 75px;
    }
    .sdb-cell-3{
        max-width: 175px;
    }

    .sdb-cell-2 select{
        max-width: 75px;
        height: 36px;
        padding: 0em 1.75rem 0rem .75rem;
        padding-right: .75rem\9;
        color:#686e87;        
        vertical-align: middle;
        background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23333' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") right .75rem center no-repeat rgba(235, 238, 243, 1);
        background-image: none\9;
        background-size: 8px 10px;
        border: .5px solid #cbd3e1;
        border-radius: .25rem;
        -moz-appearance: none;
        font-size: .875rem;
        
        -webkit-box-shadow: inset 0 1px 1px rgba(150, 200, 254, .075);
        box-shadow: inset 0 1px 1px rgba(150, 200, 254, .075);
        -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        -moz-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        -moz-appearance: none; 
        appearance:none;
        -webkit-appearance: none;
        border-right:none;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .sdb-cell-3 input{
        width: 170px;
        padding: 0rem .5rem;
        height: 36px;
        margin-right:10px;        
        color: #263038;
        font-size: .875rem;
        background-color: rgba(255, 255, 255, 0.45);
        background-image: none;
        background-clip: padding-box;
        border: .5px solid #cbd3e1;
        border-radius: .25rem;
        -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        -moz-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        
        -webkit-box-shadow: inset 0 1px 1px rgba(150, 200, 254, .075);
        box-shadow: inset 0 1px 1px rgba(150, 200, 254, .075);
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }
    

    input.sdb-cell-a{
        width: 79px;
    }

    .sdb-cell-3 select{
        width: 170px;
        height: 36px;
        padding: 0em 1.75rem 0rem .75rem;
        padding-right: .75rem\9;
        vertical-align: middle;
        background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23333' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") right .75rem center no-repeat rgba(255, 255, 255, 0.45);
        background-image: none\9;
        background-size: 8px 10px;
        border: .5px solid #cbd3e1;
        border-radius: .25rem;
        -moz-appearance: none;
        font-size: .875rem;
        
        -webkit-box-shadow: inset 0 1px 1px rgba(150, 200, 254, .075);
        box-shadow: inset 0 1px 1px rgba(150, 200, 254, .075);
        -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        -moz-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        -moz-appearance: none; 
        appearance:none;
        -webkit-appearance: none;
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        color:#686e87;        
    }
    .sdb-cell-3 select:hover,
    .sdb-cell-3 select:focus,
    .sdb-cell-3 input:focus,
    .sdb-cell-3 input:hover{
        background-color: #f4fafe;
        outline: 0;
        border: .5px solid #0087FF;
        color: #7a869e;
        cursor: pointer;
    }

    .sdb-cell-1 h1{
        margin:0;
        padding: 0;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        font-size:.825rem;
        width: 55px;
        
        color:#686e87;
        padding-top:11px;
    }


/*TOP-STYLE*/

/*TAB-CHECKBOX*/
    .tab-checkbox{
        z-index: 1;
        position: absolute;
        right:14px;
    }
   
    .tab-checkbox div{
        display: inline-flex;
        margin-left:10px;
        margin-top:5px;
    }
    .checkbox-title {
        color: #0087ff;
        margin-left:3px;
        float: left;
        font-weight: 300;
        font-size:.925rem;
        line-height: 14px;
    }
    .checkbox-label:hover,
    .checkbox-label:active{
        border:1px solid #0087ff;
    }
    .checkbox-label {
        width: 14px;
        height: 14px;
        cursor: pointer;
        border-radius: 100%;
        display: inline-block;
        border: 1px solid #0087ff;
        background: transparent;
    }
    @keyframes spin {
        from { transform: rotate(0deg); }
        to { transform: rotate(360deg); }
    }

    .checkbox-label-aux {
        width: 10px;
        height: 10px;
        display: none;
        margin: 0 auto;
        cursor: pointer;
        margin-top: 1px;
        border-radius: 100%;
        background-image: -moz-radial-gradient(3px 3px 45deg, circle cover, #0087ff 0%, blue 100%, #0087ff 95%);
        background-image: -webkit-radial-gradient(3px 3px, circle cover, #0087ff, #0087ff);
        background-image: radial-gradient(3px 3px 45deg, circle cover, #0087ff 0%, #0087ff 100%, blue 95%);

        animation-name: spin; 
        animation-duration: 3s; /* 3 seconds */
        animation-iteration-count: infinite; 
        animation-timing-function: linear;
    }
    
    input[type=checkbox]:checked ~ label > .checkbox-label-aux {
        display: block;
    }
/*TAB-CHECKBOX*/

/*FLEX-INNER*/
    .left-content{
        height:calc(100vh - 181px);
        background-color:rgba(255,255,255,1);
        display: flex;
        flex-direction: column;
        border-radius: .25rem;
        -webkit-box-shadow: -1px 1px 8px -1px rgba(203,211,225,1);
        -moz-box-shadow: -1px 1px 8px -1px #3E444E;
        box-shadow: -1px 1px 8px -1px rgba(203,211,225,1);
    }

    .left-content2{
        height:calc(100vh - 125px);
        background-color:rgba(255,255,255,1);
        display: flex;
        flex-direction: column;
        border-radius: .25rem;
        -webkit-box-shadow: -1px 1px 8px -1px rgba(203,211,225,1);
        -moz-box-shadow: -1px 1px 8px -1px rgba(203,211,225,1);
        box-shadow: -1px 1px 8px -1px rgba(203,211,225,1);
        margin-top:14px;
    }

    .left-content-inner{
        height:calc(100vh - 181px);
        background-color:#FFFFFF;
        display: flex;
        flex-direction: column;
        border-radius: .25rem;
    }

    .left-content-inner2{
        height:calc(100vh - 125px);
        background-color:#FFFFFF;
        display: flex;
        flex-direction: column;
        border-radius: .25rem;
    }

    .left-content-inner-header{
        padding:0;
        flex: 0 0 auto;
        background: 
        linear-gradient(0,  #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
        background-color:#f4f6f8;        
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem;
    }

    .left-content-inner-bottom2{
        background: 
        linear-gradient(180deg, #cbd3e1, #cbd3e1 51%, transparent 50%) top    left  / 100% 1px no-repeat;
        background-color:#f4f6f8;
        padding:0;
        flex: 0 0 auto;
        border-bottom-left-radius: .25rem;
        border-bottom-right-radius: .25rem;
    }

    .left-content-inner-center{
        flex: 1 1 auto;
        position: relative;
        overflow-y: auto;
        padding:0;
        height:calc(100vh - 115px);
        background: #FFFFFF;
        border-bottom-left-radius: .25rem;
        border-bottom-right-radius: .25rem;
    }

    .left-content-inner-center-2{
        flex: 1 1 auto;
        position: relative;
        overflow-y: auto;
        padding:0;
        height:calc(100vh - 177px);
        background: #f7fbff;
        border-bottom-left-radius: .25rem;
        border-bottom-right-radius: .25rem;        
    }

    .left-content-inner-bottom{
        padding:0;
        flex: 0 0 auto;
        background: linear-gradient(180deg, #cbd3e1, #cbd3e1 51%, transparent 50%) top left / 100% 1px no-repeat;  
        background-color:#f4f6f8;
    }

    .sales-list-fixed{
        padding:0;
        flex: 0 0 auto;
        background-color:#FFF;
    }

    .right-content{
        height:calc(100vh - 181px);
        background: #ebeef3;
        display: flex;
        flex-direction: column;
    }

    .right-content2{
        height:calc(100vh - 125px);
        background: #ebeef3;
        display: flex;
        flex-direction: column;
        margin-top:14px;
        
    }

    .right-content-center{
        flex: 1 1 auto;
        position: relative;
        overflow-y: auto;
        padding:0;
        height:calc(100vh - 150px);
    }
    .right-content-center-2{
        flex: 1 1 auto;
        position: relative;
        overflow-y: auto;
        padding:0;
        height:calc(100vh - 235px);
    }
/*FLEX-INNER*/

/*INVOICE-TABLE*/

    .sales-table{
        overflow-x: auto;
        padding: 0 1px;
        font-size: .8rem;
    }

    .sales-list{
        margin: 0px 0 0;
        width: 99.75%;
        min-width: 680px;
    }

    .sales-list-btn{
        border:none;
        background: none;
        color:#6d7a97;
        font-size: 1rem;
    }

    .sales-list-btn:hover{
        color:#263038;
        cursor: pointer;
    }

    .sales-list thead th{
        margin: 0;
        height: 36px;
        text-align: left;
        color: #263038;
        background: #f4f6f8;
        padding: 5px 3px 0px 5px;
        font-size: .75rem;
    }
    .sales-list thead th:after {
        position: relative;
        content: '';
        float: right;
        height: 18px;
        top: -3px;
    }

    .sales-list thead th:not(:last-child):after {
        border: 0.5px solid #cbd3e1;
    }
    .sales-list tbody tr:nth-child(odd){
        background-image: linear-gradient(to bottom, #cbd3e1 0%, #cbd3e1 51%, transparent 51%);
        background-size: 100% 1px;
        background-repeat: no-repeat;
        background-color: #FFFFFF;
        
        
    }
    .sales-list tbody tr:nth-child(even) {
        background-color: #f8f9fc;
        background-image: linear-gradient(to bottom, #cbd3e1 0%, #cbd3e1 51%, transparent 51%);
        background-size: 100% 1px;
        background-repeat: no-repeat;        
    }

    .sales-list-cell{
        height: 34px;
    }
        
    .sales-list-cell select{
        padding-left:5px;
        -webkit-appearance: none;
        -ms-progress-appearance: none;
        -moz-appearance: none;
        appearance: none;                   
        border-radius: 0px;
    }
    .sales-list-cell input{
        padding:0px 5px;
        margin:3px 0
    }


    .sales-list-cell select,
    .sales-list-cell input{
        background: rgba(255, 255, 255, 0.5);
        height: 30px;
        width: 100%;
        border: none;
        color: #616161;
        font-size: .75rem;
        border:.5px solid transparent;
        
    }


    .sales-list tbody tr:hover{
        background: #ebeef3;
    }

    .sales-list thead tr th:first-child,
    .sf-1 input{
        padding-left: 14px;
    }
    .sales-list tbody tr:hover td input,
    .sales-list tbody tr:hover td select{
        color: #263038;
        cursor: pointer;
        border:.5px solid #cbd3e1;
        border-radius: .25rem;
    }
    .sales-list tbody tr td select:focus,
    .sales-list tbody tr td input:focus{
        border:.5px solid #0087ff;
        background: #f4fafe;
        box-shadow: none;
        -webkit-box-shadow: none;
        outline: 0px;
        border-radius: .25rem;
    }

    .sf-1{
        width: 12%;
    }
    .sf-2{
        width: 28%
    }
    .sf-3{
        width: 5%;
        font-family: 'Ubuntu Mono', monospace;
    }
    .sf-4{
        width: 9%
    }
    .sf-5{
        width: 5%;
        font-family: 'Ubuntu Mono', monospace;                                
    }
    .sf-6{
        width: 5%;
        font-family: 'Ubuntu Mono', monospace;                                
    }
    .sf-7{
        width: 8%
    }
    .sf-8{
        width: 13%;
        font-family: 'Ubuntu Mono', monospace;                        
    }
    .sf-9{
        width: 13%;
        font-family: 'Ubuntu Mono', monospace;                        
    }
    .sf-10{
        width: 2%
    }
    .fu{
        font-family: 'Ubuntu Mono', monospace;        
    }

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

    .sales-list-search div{
        float: left;
        padding: 4px 5px 4px 5px;
    }
    .sales-list-search div:last-child{
        padding-left:7px;
    }

    .bg-stock-search{
        background: #fff;
        position: relative;
    }
    .bg-stock-search input{
        background-color: #f4fafe;
        font-weight: 400;
        color: #7a869e;
        outline: 0;
        border: .5px solid #0087FF;
        padding:3px 4px 3px 12px;
        border-radius:.25rem;
        margin:0px 0px;
        width: 100%;
        font-size: .75rem;
        height: 36px;
    }

    .bg-stock-search i{
        position: absolute;
        z-index: 4;
        right: 15px;
        font-size: 1.25rem;
        top:8px;
        color: #616161;
    }



    .sl-1{
        width: 12%;
    }
    .sl-2{
        width: 88%;
    }

        @media (max-width:920px) {
            .sl-1,.sl-2{
                width: 100%;
                display: block;
            }
        }


/*INVOICE-TABLE*/

/*INVOICE-DETAILS*/

    div.clist-content.invoice-customer{
        border-bottom:none;
        background: none;
    }
    div.clist-content.invoice-customer:hover{
        background: none;
    }

    .invoice-img img{
        border-radius: 5px;
        margin: 12px 5px 0px 14px;        
    }


    input.invoice-customer-code{
        font-size:.825rem;
        color: #808080;
        background: none;
        border:none;
    }

    .invoice-customer-date{
        width: 100%;
        display: flex;
        justify-content: flex-end;
        padding-right: 14px; 
        padding-top: 0px;
        height: 20px;
        margin-top:10px;
    }

    .invoice-customer-date input{
        flex-direction: column-reverse; 
        color: #313643;
        width: 7.5rem;
        font-weight: bold;
    }

    .invoice-customer-date button{
        color: #313643;
        line-height: 0;
        padding-right:5px;    
    }

    input.invoice-clock{
        width: 3rem;
        justify-content: flex-end;
        text-align: right;
    }

    .invoice-file{
        display: flex;
        justify-content: flex-end;
        width: 100%;
        margin-top: -.25rem
    }

    .invoice-file-no{
        margin-top: .1rem
    }

    .invoice-file-no input{
        border:none;
        background: none;
        width: 8rem;
    }

    .invoice-exchange{
        margin-bottom:10px;
        padding-right: 14px;
    }

    .invoice-exchange input{
        width:5rem;
        text-align: right;
    }

    .invoice-exchange select{
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        font-size: .775rem;
        vertical-align:bottom;
    }
    .o-i{
        width: 240px;
        text-align: right;
        padding: 0 8px;
        font-size: .825rem;
        font-weight: 700;
        text-transform: capitalize;
        white-space: nowrap;
        color: #616161;
        background: none;
        border:none;
    }

    .i-s{
        font-size: .825rem;
        color: #808080;
        background: none;
        border:none;
        padding: 0;
        margin: 0;
    }

    .i-s:hover,
    .i-s:focus{
        background: #FAFFBD;
        border-radius: 5px;
        cursor: pointer;
    }

    button.i-s:hover,
    button.i-s:focus{
            background: none;
    }

    .invoice-price{
        height: 100%;
        display: flex;                   
        flex-direction: column;          
        justify-content: flex-end; 
    }

    .invoice-price ul{
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .invoice-price ul li{
        width: 50%;
        float: left;
    }

    .invoice-price p{
        margin: 0;
        padding: 0;
        text-align: right;
        font-size: .775rem;
    }

    .invoice-price h1{
        text-align: right;
        font-size:3.2rem;
        font-weight:800;
        margin: 0;
        padding: 0;
        font-family: 'Montserrat', sans-serif;                          
    }

    .invoice-price h1 sup{
        font-size:1.3rem;
        font-weight: 300;
    }


    .kdv-label label{
        display: inline-block;
    }
    .invoice-footer ul{
        padding:0px 0;
        background: 
	    linear-gradient(90deg,  #cbd3e1, #cbd3e1 51%, transparent 50%) top    right / 1px 100% no-repeat,
        linear-gradient(-90deg, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom left  / 1px 100% no-repeat; 
        margin:0;

    }

    .invoice-footer ul li{
        display: block;
        text-align: right; 
        padding: 5px 0 5px 0;
        width: 100%;   
        background:
        linear-gradient(0deg, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom   right  / 100% 1px no-repeat;    }

    .invoice-footer ul li p{
        display: inline-block;
        margin: 0;
        padding: 4px 14px;
        font-size: .875rem;
        font-weight: 300;
        color: #7F828B;
    }

    .invoice-footer ul li p:first-child{
        font-weight: bold;
        text-align: left;
        float: left;
    }

    .invoice-footer h1{
        text-align: right;
        font-size: 2.5rem;
        margin: 0;
        padding: 0;
        line-height: 1;
        font-weight: 300;
    }

    .invoice-footer h1 sub{
        font-size:1.4rem;
        font-weight:300;
        bottom:0;
    }

    .invoice-footer h2{
        font-size: .775rem;
        font-weight: 300;
        text-align: right;
        padding: 0;
        margin: 0;
        color: #7F828B;
        padding-top:8px;   
    }

    .invoice-footer h3{
        font-size: 2.5rem;
        padding: 0;
        text-align: right;
        line-height: 1;
        font-weight: 400
    }

    h3.popover-title{
        padding:1rem;
    }

    input#text.small-input{
        width: 100%;
        color: #263038;
        cursor: pointer;
        border: .5px solid #cbd3e1;
        border-radius: .25rem;
        height: auto;
    }

    .invoice-border-bottom{
        background: linear-gradient(0, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
    }

    .invoice-border-bottom div{
        background:linear-gradient(-90deg,  #cbd3e1, #cbd3e1 51%, transparent 50%) bottom left / 1px 100% no-repeat ;       
        padding-left:7px;
        height: 60px;
    }

    .invoice-border-bottom div label{
        color:#4e5d6c;
    }


/*INVOICE-DETAILS*/

/*WT-PAGINATION*/
    div.btn-group.dropup{
        vertical-align: middle;
    }
    div.dropdown-menu.dropdown-menu-right.pagination-box{
        text-align: center;
        min-width: 90px;
    }
    .pagination-dropup{
        color: #8f9db9;
        text-decoration: none;
        padding: 7px 12px;
        border: .5px solid #cbd3e1;
        border-radius:.25rem;
        transition: border-color .2s ease-out;
        background: none;
        width:100px;
    }

    .pagination-dropup:hover,
    .pagination-dropup:focus{
        color: #0087ff;
        border: .5px solid #0087ff;
    }

    .bottom-inner{
        padding-left: 10px;
        padding-right: 16px;
        padding-top: 8px;
    }

    .bottom-inner ul{
        list-style: none;
        margin: 0;
        padding:0;
    }

    .bottom-inner-pagination ol{
        list-style: none;
        margin: 0;
        padding:0;
    }

    .bottom-inner ul li{
        display: inline-block;
        margin: 0;
        padding: 0;
    }

    .bottom-inner-pagination{
        margin:10px 5px;
        float: right;
    }

    .bottom-inner-pagination ol li {
        display: inline-block;
        list-style: none;
        margin: 0px;
        padding: 0px 2px;
        font-size:.825rem;
        text-align: center;
    }

    .bottom-inner-pagination ol li a {
        color: #8f9db9;
        text-decoration: none;
        padding: 7px 12px;
        border: .5px solid #cbd3e1;
        border-radius: .25rem;
        transition: border-color .2s ease-out;
    }

    .bottom-inner-pagination ol li a:hover {
        border-color: #0087FF;
        border-radius: .25rem;
        color: #0087FF;
    }

    .bottom-inner-pagination ol li.current {
        
    }

    .bottom-inner-pagination ol li.current input{
        background: linear-gradient(-180deg, #ebeef3 0%, #ebeef3 98%), radial-gradient(at top left, rgba(255, 255, 255, 0.30) 0%, rgba(0, 0, 0, 0.30) 100%);
        background-blend-mode: screen;
        border:.5px solid #cbd3e1;
        border-radius: .25rem;
        color: #8f9db9;
        font-size:.825rem;
        padding:0 .2rem;
        font-weight: 700;
        width: 34px;  
        height: 30px;
        text-align: center;
 }

    .bottom-inner-pagination ol li a.disabled {
        color: #cbd3e1;
        opacity:1;
        cursor: pointer;
        border: none;
    }        
/*WT-PAGINATION*/

/*FOOTER-BUTTON*/
    .button-loading {
    position: relative;
    }

    .button-loading:before {
    margin: -8px 0 0 -10px;
    width: 16px;
    height: 16px;
    position: absolute;
    left: 18%;
    top: 50%;
    content: '';
    -webkit-border-radius: 24px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 24px;
    -moz-background-clip: padding;
    border-radius: 24px;
    background-clip: padding-box;
    border: rgba(255, 255, 255, 0.25) 2px solid;
    border-top-color: #fff;
    -webkit-animation: animation-rotate 750ms linear infinite;
    -moz-animation: animation-rotate 750ms linear infinite;
    -o-animation: animation-rotate 750ms linear infinite;
    animation: animation-rotate 750ms linear infinite;
    }
    .button-loading span,
    .button-loading:hover span,
    .button-loading:active span {
    color: transparent;
    text-shadow: none;
    }
    @-webkit-keyframes animation-rotate {
        100% {
        -webkit-transform: rotate(360deg);
        }
    }
    @-moz-keyframes animation-rotate {
        100% {
        -moz-transform: rotate(360deg);
        }
    }
    @-o-keyframes animation-rotate {
        100% {
        -o-transform: rotate(360deg);
        }
    }
    @keyframes animation-rotate {
        100% {
        transform: rotate(360deg);
        }
    }


    .footer-btn-group{
            display: flex;
            -webkit-flex-flow: row wrap;
            flex-flow: row wrap;
            justify-content: flex-end;
            padding:2px 14px 5px 14px;
    }

        .footer-btn-group div{
            justify-content: flex-end;
        }
        .bottom-inner-btn{
            margin-right:5px;
        }

        .bottom-inner-btn button{
            width: 32px;
            line-height:0px;
            height: 34px;
            border: .5px solid #cbd3e1;
            border-radius: .25rem;
            background: none;
            font-family: 'ion';
            font-size: 1.15rem;
            color: #8f9db9;
            outline: none;  
            margin:0;
            margin-top:5px;  
        }

        .bottom-inner-btn button:hover,
        .bottom-inner-btn button:active{
            color: #0087ff;
            border: .5px solid #0087ff;
            background: none;
            cursor: pointer;
        }

        .wt-form-button{
            height: 36px;
            line-height:0px;
            border:none;
            border-left: .5px solid #cbd3e1;
            background: none;
            border-top-right-radius: .25rem;
            border-bottom-right-radius: .25rem;
            border-bottom-left-radius: 0px;
            border-top-left-radius: 0px;

            font-family: 'ion';
            font-size: 1.15rem;
            color: #8f9db9;
            outline: none;  
            margin:0;
            padding: 0 1rem;
            position: absolute;
            top:17px;
            right: 14px;
            cursor: pointer;
        }

        button.x-btn{
            border: none;
            padding: 0 1.75rem;
            color: #FFFFFF;
            line-height: 0px;
            font-size:.8rem;
            margin:0;
            border-radius:.25rem;
            float: right;
            height: 34px;
            font-weight:300;
            font-family: 'Roboto', sans-serif;
            margin-left:10px;
            margin-top:5px;
        }
        button.x-btn:hover{
            cursor: pointer;
        }

        button.fason-btn{
            border: none;
            padding: 0 1.75rem;
            color: #FFFFFF;
            line-height: 0px;
            font-size:.8rem;
            margin:0;
            border-radius:.25rem;
            height: 36px;
            font-weight:400;
            cursor: pointer;
            margin-top:3px;        
        }
        

        .ca-footer-btn{
            background: #0087FF;
            box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1);
        } 
        .ca-cancel-btn{background: #263438;}
        .ca-delete-btn{background: #ff4d3b;}
        .ca-pay-btn{background: #2b3dff;}
        .ca-pay2-btn{background: #fc566a;}

        .ca-footer-btn:disabled,
        .ca-cancel-btn:disabled,
        .ca-delete-btn:disabled,
        .ca-pay-btn:disabled,
        .ca-pay2-btn:disabled,
        .ca-cancel-btn.disabled,
        .ca-cancel-btn.disabled:hover,
        .ca-delete-btn.disabled,
        .ca-delete-btn.disabled:hover,
        .ca-pay-btn.disabled,
        .ca-pay-btn.disabled:hover,
        .ca-pay2-btn.disabled,
        .ca-pay2-btn.disabled:hover,
        .ca-footer-btn.disabled,
        .ca-footer-btn.disabled:hover,{
            background: #4e5d6c;
            cursor: not-allowed;
        }

        .ca-footer-btn:active,
        .ca-cancel-btn:active,
        .ca-delete-btn:active,
        .ca-pay-btn:active{
            opacity: 0.8;
            -webkit-animation: neon2 1.5s ease-in-out infinite alternate;
            -moz-animation: neon2 1.5s ease-in-out infinite alternate;
            animation: neon2 1.5s ease-in-out infinite alternate;

            -webkit-box-shadow: inset 0px 0px 1px -1px rgba(255,255,255,1);
            -moz-box-shadow: inset 0px 0px 1px -1px rgba(255,255,255,1);
            box-shadow: inset 0px 0px 1px -1px rgba(255,255,255,1);
        }

        .ca-footer-btn:hover{background: #1578cd;}   
        .ca-cancel-btn:hover{background: #4d636a;}
        .ca-delete-btn:hover{background: #e63c1b;}
        .ca-pay-btn:hover{background: #5e6cff;}
        .ca-pay2-btn:hover{background:#FE848B;}
/*FOOTER-BUTTON*/

/*LIST*/

    .clist-content {
        background:linear-gradient(0,  #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
        padding: 0;
        width: 100%;
        height: 3.75rem;
    }

    .clist-content:hover {
        background-color: #e5f4ff;
        cursor: pointer
    }

    .clist-content-selected {
        background-color: #f7fbff;
    }

    .clist-content-selected:hover {
        background-color: #f7fbff;
    }

    .clist-content ul {
        list-style: none;
        padding: 0 5px;
        margin: 0;
    }

    .clist-content ul li {
        display: inline-block;
        vertical-align: middle;
        padding-top:11px;
        padding-bottom: 11px;
        width: 100%;
    }

    .clist-content ul li img {
        margin-right: .7rem;
        border-radius: 50%;
        float: left;
    }

    .clist-content ul li:first-child {
        padding-right: 5px;
        padding-left: 10px;
        float: left;
    }
  
    .clist-content li h1 {
        font-size: .825rem;
        margin: 0;
        padding: 0;
        text-transform: capitalize;
        font-weight: 400;
        color: #263038;
        line-height: 1;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;  
    }

    .clist-content li h2 {
        margin: 0;
        padding: 0;
        margin-right: 10px;
        padding-right: 10px;
        font-size: .75rem;
        font-weight: 400;
        line-height: 1.75;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        color:#7F828B 
    }
    .clist-content li h3 {
        font-size: .825rem;
        margin: 0;
        padding: 0;
        text-transform: capitalize;
        font-weight: 600;
        color: #0087ff;
        line-height: 1;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;  
    }

    .clist-content-selected li h1 {
        font-size: .825rem;
        margin: 0;
        padding: 0;
        text-transform: capitalize;
        font-weight:bolder;
        max-width: 14rem;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        color: #505050;
    }

    .clist-content-selected li .clist-code {
        margin-right: 10px;
        padding-right: 10px;
        font-size: .725rem;
        color: #616161;
        line-height: 1.45;
        max-width: 80px;

    }

    .clist-down-btn{
        background: none;
        border:none;
    }

    .clist-down-btn:hover{
        cursor: pointer;
        color:#333;
    }

    @media (max-width:1210px) {
        .clist-content li h1 {
            max-width: 9rem;
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
        }
    }



    div.clist-content.clist-case{
        height: 13rem;
        border-radius: .25rem;
        background: linear-gradient(-10deg, #0087ff 0%, #21d4fd 100%);
    }

    div.case-inner-profile{
        height: 5.75rem;
    }
    div.case-inner-profile ul li{
        width: 23%;
    }

    li.circle-button.case-date{
        margin-bottom: 1rem;
        text-align: left;
    }
    select#customSelect.custom-select.block.select-casex{
        width: 80%
    }
    
    .case-transfer h3,
    .case-transfer button{
        display: inline-flex;
    }

    .case-transfer h3{
        font-size: 1.2rem;
        margin: 0;
        padding: 0;
        padding:9px 1px 9px 0px;
        font-weight: 600;
        color:#0087ff;
        height: 34px;
        border-radius: .25rem;
        width:100%;
    }


    .caseinfo-g1 p{
        color:rgba(255, 255, 255, 0.75);
        font-size: .7rem;
        font-weight: bold;
        text-transform: uppercase;        
    }

    .caseinfo-g1 i{
        font-size:1rem;
        color:#FFF;
    }

    p.caseinfo{
        font-size: 1.25rem;
        font-weight: 300;
        color:#FFF;
    }

    .caseinfo-g1 h5{
        font-size:.8rem;
        color:#FFF;
        font-weight: 600;
        text-transform: uppercase;
        padding-top: .5rem;
    }

    span.case-arrow-down{
        position: absolute;
        z-index: 9912;
        right:2rem;
        font-size: 3rem;
        color:#0087ff;
        margin-top:-2.75rem;
    }

    div.case-open{
        border: .5px solid #0087ff;
        border-top: none;
        border-bottom-left-radius: .25rem;
        border-bottom-right-radius: .25rem;
        margin-top: -1px;
        background: #e5f4ff;
    }

  

    .cainfo {
        margin: 0;
        padding: .6rem 1rem;
        width: 100%;
        background:linear-gradient(0,      #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
        
    }

    .cainfo-g1 h1{
        font-size: 1.85rem;
        margin: 0;
        padding: 0;
        font-weight: 300;
        color: #263038;
    }

    .cainfo-g1 h1 span{
        font-size:.8rem;
    }

    .cainfo-g1 h2{
        font-size:.85rem;
        margin:0;
        padding:0;
        font-weight: 300;
        color:#263038;
    }
    .case-xx {
        display: flex;
        justify-content: center;
        flex-direction: column;
        vertical-align: middle;
        height: 140px;
        padding-top:15px;
    }
    .case-xx i{
        font-size:3.5rem;
        color:#cbd3e1;
    }

    .bg-transfer-case{
        background:linear-gradient(90deg,  #cbd3e1, #cbd3e1 50%, transparent 50%) top    right / 1px 100% no-repeat;
        background-color: #f7fbff;
    }


    .case-border{
        border:.5px solid #cbd3e1;
        border-radius: .25rem;
    }
    .case-title,
    .cainfo-g1 h3{
        font-size:1.25rem;
        margin:0;
        padding:0;
        font-weight: 300;
        color:#263038;
    }
    .cainfo-g1 p{
        text-align: left;
        color:#8d98b1;
        font-weight: 300;
    }

    .cainfo-g1 h4{
        font-size: 2rem;
        margin: 0;
        padding: 0rem;
        font-weight: 300;
        color: #FFF;
        width: auto;
        text-shadow: 0px 1px 0px rgba(0, 95, 255, 0.5);
    }

    .cainfo-g1 h4 span{
            font-size: 1rem;
    }

    .minibar {
        display: flex;
        align-items: flex-end;
    }
    
    .minibar-bar {
        position: relative;
        flex: 1;
        margin-left: 14px;
        background-color: #d5deed;
        cursor: pointer;        
        }
    
    .minibar-bar:hover .minibar-fill {
        background-color: #263038;
        cursor: pointer;
    }
    
    .minibar-bar:hover .minibar-tooltip {
        opacity: 1;
        transform: translateY(-20px);
    }
    
    .minibar-tooltip {
        position: absolute;
        top: -20px;
        right: 0;
        width: 60px;
        margin-left: -10px;
        text-align: center;
        background-color: #666;
        color: #eee;
        font-size: 10px;
        font-family: monospace;
        line-height: 12px;
        padding: 4px;
        opacity: 0;
        transition: transform 0.3s;
        transform: translateY(0);
        pointer-events: none;
        z-index: 50;
    }
    
    .minibar--mini {
        height: 68px;
    }
    
    .minibar--mini .minibar-bar {
        max-width:4px;
        height: 100%;
        border-radius: .25rem;
        }
    
    .minibar-fill {
        position: absolute;
        background-color: #0087FF;
        min-height: 5px;
        left: 0;
        right: 0;
        width: 100%;
        bottom: 0;
        border-radius: .25rem;
    }

    .cainfo-g2{
        background:linear-gradient(180deg,      #cbd3e1, #cbd3e1 51%, transparent 50%) top left / 100% 1px no-repeat;
    }

    .cainfo-g2 h1{
        font-size:1.3rem;
        font-weight: 300;
        padding:17px 0;
        color:#263038;
    }

    .cainfo-in ul{
        list-style: none;
        margin:0;
        padding: 0;
        display: -webkit-flex;
        display: flex;
        padding-bottom:22px;
    }

    .cainfo-in ul li{
        margin:0;
        padding: 0;
        padding-right:12px;
    }

    .cainfo-in ul li.table-list{
        width: 100%;
    }

    .cainfo-in i{
        font-size:2.2rem;
        color:#8f9db9;
        line-height:0;
        vertical-align: middle;
    }

    .cainfo-in h1{
        font-size:.875rem;
        color:#0087FF;
        font-weight:300;
        margin:1px 0;        
    }

    .cainfo-in h2{
        font-size:1rem;
        color:#70859b;
        margin:0;
        line-height: 1.25;
    }
    
    .cainfo-in h3{
        font-size:.75rem;
        color:#8f9db9;
        font-weight: 400;
        margin:0;
        line-height: 1.4;
    }

    .cainfo-in p{
        color:#70859b;
        margin:0;
        line-height: 1.85;
        padding-top:.5rem;
        font-weight: 300;
    }

    .img-free-cari {
        content: url("../../public/svg/cari.svg");
    }

    .img-free-stok {
        content: url("../../public/svg/stok.svg");
    }

    .stock-left-table{
        display: table;
        width: 100%;
        margin-top:14px;
        background: linear-gradient(0, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;        
    }

    .stock-left-table-row {
        display: table-row;
    }
    
    .stock-left-table-item {
        border: .5px solid #cbd3e1;
        border-left:none;
        border-bottom:none;
        display: table-cell;
        padding: 3px 10px;
    }
    
    .stock-left-table-item:first-child{
        border-left:.5px solid #cbd3e1;
    }
    
    .stock-left-table-body {
        display: table-row-group;
    }



/*LIST*/

/*CUSTOMER-TABLE*/


    table.sales-list > tbody > tr.view td, table.sales-list > tbody > tr.view th {
    cursor: pointer;
    }
    table.sales-list > tbody > tr.view td{
        height: 34px;
        font-size: .8rem;
        padding: 0 5px;
    }
    table.sales-list> tbody >tr.borclu{
        background-color: #f8f9fc;
    }
    table.sales-list> tbody >tr.alacakli{
        background-color: #FFF;
    }


    table.sales-list > tbody > tr.view td:first-child,
    table.sales-list > tbody > tr.view th:first-child {
    position: relative;
    padding-left: 20px;
    }

    table.sales-list > tbody > tr.view.open td:first-child:before,
    table.sales-list > tbody > tr.view.open th:first-child:before {
    position: absolute;
    top: 50%;
    left: 7px;
    width: 9px;
    height: 16px;
    margin-top: -12px;
    font: 10px ionicons;
    color: #999;
    content: "\f123";
    transition: all .3s ease;
    }

    table.sales-list > tbody > tr.view:hover,
    table.sales-list > tbody > tr.view2:hover,
    table.sales-list.reservation > tbody> tr.view:hover {
    background: #0087FF;
    color: #FFFFFF;
    }
    table.sales-list > tbody > tr.view2 td input{
        height: 24px;
    }
   
    table.sales-list > tbody > tr.view2:hover td input{
        color:#FFFFFF;
    }
    table.sales-list > tbody > tr.view2 td:first-child,
    table.sales-list > tbody > tr.yellow-fix td:first-child{
        padding-left:14px;
    }
    table.sales-list > tbody > tr.view2 td{
        height: 34px;
        font-size: .75rem;
        padding: 0 5px;
    }

    .yellow-fix-btn{
        border:none;
        padding: 4px 10px 5px 10px;
        color: #FFFFFF;
        line-height: 1;
        font-size: .8rem;
        border-radius: 5px;
        font-weight: 300;
        font-family: 'Roboto', sans-serif;
        background: #263438
    }
    
    table.sales-list > tbody > tr.yellow-fix td{
        height: 2rem;
        font-size: .75rem;
        padding: 2px 1px;
        background: #FAFFBD;
        border-bottom:1px solid #FFFFFF;
    }
    table.sales-list > tbody > tr.bg-other td{
        background: #d9d9d9;
    }
    table.sales-list > tbody > tr.yellow-fix:hover td{
        background: #F5F6F7
    }
    .sales-list tbody tr.yellow-fix td input, 
    .sales-list tbody tr.yellow-fix td select{
        border-radius: .25rem;        
        background: rgba(255, 255, 255, 0.6);
        font-weight: 600;
        color: #616161;
        border: .5px solid #bfc0c6;
        padding: 3px 4px 3px 12px;
        border-radius: 5px;
        margin: 0px 0px;
        width: 100%;
        font-size: .75rem;
        height: 30px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    }

    .sales-list tbody tr.yellow-fix:hover td input, 
    .sales-list tbody tr.yellow-fix:hover td select{
        color:#333;
        background: rgba(255, 255, 255, 0.9);
    }

    table.sales-list > tbody > tr.view.open {
        background-color: #edf1fa;
        color:#333;
        background-image: linear-gradient(to bottom, #cbd3e1 0%, #cbd3e1 51%, transparent 51%);
        background-size: 100% 1px;
        background-repeat: no-repeat;
    }
    table.sales-list > tbody > tr.view.open td:first-child:before, 
    table.sales-list > tbody > tr.view.open th:first-child:before {
    transform: rotate(-180deg);
    color: #333;
    }
    table.sales-list > tbody > tr.fold {
    display: none;
    }
    table.sales-list > tbody > tr.fold.open {
    display: table-row;
    background-color: #edf1fa;
    background-image: linear-gradient(to bottom, #cbd3e1 0%, #cbd3e1 51%, transparent 51%);
    background-size: 100% 1px;
    background-repeat: no-repeat;
    }

    .fold-content {
    padding: 0;
    }

    .fold-content-inner{
        width: 100%;
        font-size:.75rem;
        padding-bottom:20px;
    }

    .fold-content-inner div{
        width: 280px;
        padding: 10px 10px 10px 20px;
    }
    .fold-content-inner p{
        margin: 0;
    }
    p.ct-1{
        font-weight: 600;
        font-size:.7rem;
        margin-right:1rem;
        width: 60px;
        padding: 0;
        float: left;
    }
    p.ct-2{
        
        font-size:.75rem;
        width: 160px;
        padding: 0;
        float: left;
    }
/*CUSTOMER-TABLE*/

/*TAB-INNER*/
    .tab-inner-profile {
        padding: 0 1rem;
        width:100%;
        height: 3.75rem;
    }

    .tab-inner-profile ul {
        list-style: none;
        margin: 0;
        padding:12px 0 2px 0;
    }

    .tab-inner-profile ul li {
        display: inline-block;
    }


    .tab-inner-profile ul li h1 {
        
        font-size: .9rem;
        color: #616161;
        margin: 0;
        padding: 0;
    }

    .tab-inner-profile ul li h2 {
        font-size: .825rem;
        
        text-transform: capitalize;
        white-space: nowrap;
        color: #263038;
        margin: 0;
        padding: 0;
        line-height: 1;
        white-space: nowrap;
    }

    .tab-inner-profile ul li h3 {
        margin: 0;
        padding: 0;
        font-size: .8rem;
        line-height: 1.75;
        
        color: #97a8c3;
    }

    .tab-inner-top {
        vertical-align: middle;
    }

    .circle-button {
        float: right;
        text-align: right;
    }

    .circle-button button{
        border-radius: 50%;
        width: 30px;
        height: 30px;
        color: #6d7a97;
        font-size: 1rem;
        line-height: 0;
        border: none;
        margin-right: 10px;
        cursor: pointer;
        background: none;
        border:1px dotted none;
    }

    .circle-button button:hover,
    .circle-button button:focus{
    color:#263038;
    }



    .clist-credit {
        color: #0087ff;
    }

    .clist-loan{
        color: #fc566a;
    }



        .scrtabs-tab-container * {
            box-sizing: border-box; 
        }

        .scrtabs-tab-container {
            height: 48px;
            background:linear-gradient(0,      #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;         
        }

        .scrtabs-tab-container .tab-content {
            clear: left; 
        }

        .scrtabs-tabs-fixed-container {
            float: left;
            height: 48px;
            overflow: hidden;
            width: 100%;             
        }

        .scrtabs-tabs-movable-container {
            position: relative; 
            margin-top:10px;
            
        }

        .scrtabs-tabs-movable-container .tab-content {
            display: none; 
        }

        .scrtabs-tab-scroll-arrow {
            border: 1px solid #dddddd;
            border-top: none;
            color: #428bca;
            cursor: pointer;
            display: none;
            float: left;
            font-size: 12px;
            height: 48px;
            margin-bottom: -1px;
            padding-left: 2px;
            padding-top: 13px;
            width: 20px; 
        }

        .scrtabs-tab-scroll-arrow:hover {
            background-color: #eeeeee; 
        }

        .scrtabs-tab-scroll-arrow.scrtabs-disable {
            color: #ddd;
            cursor: default; 
        }

        .scrtabs-tabs-fixed-container ul.nav-tabs > li {
            white-space: nowrap; 
        }

    .special-button{
        margin-top:1.2rem;
        background: none;
        border:none;
        border-left:1px solid #e8e8e8;
        color:#263038;
        padding:5px 12px;
        width: 100%;
        background: #d7d7d7;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .special-button i{
        font-size:22px;
        line-height: 0;
    }

    .modal-special{
        margin-top:15px;
    }

    .modal-special input{
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }
    .modal-special button{
        width: 50%;
        float: left;
        background: #f7f7f7;
        border:1px solid #cbd3e1;
        padding: .5rem .5rem;
        border-left: none;
    }

    .modal-special button:hover{
        background: #ddd;
    }

    .modal-special button:last-child{
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .new-special input{
        width: 75%;
        float: left;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .new-special button{
        width: 25%;
        float:right;
        background: #f7f7f7;
        border:1px solid #cbd3e1;
        padding: .5rem .5rem;
        border-left: none;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .new-special button:hover{
        background: #ddd;
    }
/*TAB-INNER*/

/*DRODPOWN-ICON*/

    .ca-header-btn-dropdown span{
        height: 16px;
        width: 16px;
        position: absolute;
        z-index:1123199;
        top:0px;
        right:18px;
        margin-top:-15px;
        background: url(../svg/dropdown-up.svg);
        background-repeat: no-repeat;

        display: inline;
    }
    .ca-header-btn-dropdown,
    .ca-header-btn-dropdown:hover{
    background: #FFFFFF;
    border-radius: .25rem;    
    padding:0px;
    margin:0px;
    border: 0.5px solid #cbd3e1;
    -webkit-box-shadow: -1px 1px 8px -1px rgba(203, 211, 225, 1);
    -moz-box-shadow: -1px 1px 8px -1px rgba(203, 211, 225, 1);
    box-shadow: -1px 1px 8px -1px rgba(203, 211, 225, 1);
    }


    .ca-header-btn-dropdown ul{
        list-style: none;
        margin: 0px;
        padding: 0px;
        border-bottom-left-radius:.25rem;
        border-bottom-right-radius:.25rem;
    
    }

    .ca-header-btn-dropdown p{
        font-family: 'Roboto', sans-serif;
        font-size: .875rem;
        line-height: 1.45;
        color:#263038;
        padding-top:10px;
        padding-bottom:3px;
        padding-left:10px;
        font-weight: 600;
        margin:0;
    }

    .ca-header-btn-dropdown ul li{
        padding: 6px 8px;
        margin:0px;
        width: 100%;
        display: inline;
        background: #FFFFFF;
        float: left;
        color:#686e87;
    }

    .ca-header-btn-dropdown ul li:last-child{
        border-bottom-left-radius: .25rem;
        border-bottom-right-radius: .25rem;
    }
    .ca-header-btn-dropdown ul li a{
        color:#263038
    }

    .ca-header-btn-dropdown li:hover{
        background: #ebf6fd;
        color: #0087FF;
        cursor: pointer;
    }

    .ca-header-btn-dropdown ul li:hover a{
            color: #0087FF;
    }

    div.dropdown-menu.open-right.arrow{
        right:0;
    }
/*DRODPOWN-ICON*/

/*FORM*/
    .veri-var input,
    .veri-var select,
    .veri-var input:invalid {
        color: #616161;
        font-weight: bold;
        background-color: rgba(255, 252, 168, .9);
        border: .5px solid rgba(0, 0, 0, .15);
    }

    div.veri-var input:disabled,
    div.veri-var input[readonly]{
        background-color: rgba(255, 252, 168, .5);
        color: #616161;        
    }

    .input-loading {    
        background-color: none;
        background-image: url("http://loadinggif.com/images/image-selection/3.gif");
        background-size: 20px 20px;
        background-position:right 5px center;
        background-repeat: no-repeat;
    }   

    .gi-h{
        height: 52px;
    }

    .group-input{
        width: 100%;
        display: block;
    }


    .group-input input{
        float:left;
        width:80%;
        border-right: none;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .group-input button{
        float: right;
        width: 20%;
        height: 36px;
        padding: .5rem .75rem;
        margin-bottom: 0;
        font-size: .875rem;
        
        line-height: 1.25;
        color: #55595c;
        text-align: center;
        background-color: #eceeef;
        border: 1px solid rgba(0, 0, 0, .15);
        border-bottom-right-radius: .25rem;
        border-top-right-radius: .25rem;
        border-bottom-left-radius: 0px;
        border-top-left-radius: 0px
    }


    .special-button{
        margin-top:1.2rem;
        background: none;
        border:none;
        border-left:1px solid #e8e8e8;
        color:#263038;
        padding:5px 12px;
        width: 100%;
        background: #d7d7d7;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .special-button i{
        font-size:22px;
        line-height: 0;
    }

    .modal-special{
        margin-top:15px;
    }

    .modal-special input{
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }
    .modal-special button{
        width: 50%;
        float: left;
        background: #f7f7f7;
        border:1px solid #cbd3e1;
        padding: .5rem .5rem;
        border-left: none;
    }

    .modal-special button:hover{
        background: #ddd;
    }

    .modal-special button:last-child{
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .new-special input{
        width: 75%;
        float: left;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .new-special button{
        width: 25%;
        float:right;
        background: #f7f7f7;
        border:1px solid #cbd3e1;
        padding: .5rem .5rem;
        border-left: none;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .new-special button:hover{
        background: #ddd;
    }
/*FORM*/

/*MODAL*/

    .modal-content,
    .popover {
        background-clip: padding-box
    }

    .modal {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1050;
        display: none;
        outline: 0
    }

    .modal-footer::after,
    .modal-header::after {
        display: table;
        content: "";
        clear: both
    }
    .modal-slide{
        background: linear-gradient(90deg,  #cbd3e1, #cbd3e1 51%, transparent 50%) top    right / 1px 100% no-repeat
        
    }

    .modal.fade .modal-dialog {
        -webkit-transition: -webkit-transform .3s ease-out;
        -moz-transition: transform .3s ease-out, -moz-transform .3s ease-out;
        -o-transition: transform .3s ease-out, -o-transform .3s ease-out;
        transition: -webkit-transform .3s ease-out;
        -moz-transition: transform .3s ease-out, -moz-transform .3s ease-out;
        -o-transition: transform .3s ease-out, -o-transform .3s ease-out;
        transition: transform .3s ease-out;
        transition: transform .3s ease-out, -webkit-transform .3s ease-out, -moz-transform .3s ease-out, -o-transform .3s ease-out;
        transition: transform .3s ease-out, -webkit-transform .3s ease-out, -moz-transform .3s ease-out, -o-transform .3s ease-out;
        -webkit-transform: translate(0, -25%);
        -moz-transform: translate(0, -25%);
        -ms-transform: translate(0, -25%);
        -o-transform: translate(0, -25%);
        transform: translate(0, -25%)
    }

    .modal.in .modal-dialog {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        transform: translate(0, 0)
    }

    .modal-open .modal {
        overflow-x: hidden;
        overflow-y: auto
    }

    .modal-dialog {
        position: relative;
        width: auto;
        margin: 10px
    }

    .modal-content {
        position: relative;
        background-color: #FFFFFF;
        border: 1px solid rgba(0, 0, 0, .2);
        border-radius: .27rem;
        outline: 0
    }

    .modal-backdrop {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1040;
        background-color: #263038
    }

    .modal-backdrop.fade {
        opacity: 0
    }

    .modal-backdrop.in {
        opacity: .5
    }

    .modal-header {
            padding: .42rem .5rem .42rem 1rem;

            background-color: #f4f6f8;
            border: .5px solid #FFFFFF;
            border-bottom: .5px solid #cbd3e1;
            border-top-left-radius: .25rem;
            border-top-right-radius: .25rem;
    }

    .modal-header .close {
        margin-top: -2px
    }

    .modal-title {
        margin: 0;
        line-height: 1.45;
        width: 95%;
        float:left;
        font-size:.8rem;
        text-transform:capitalize;
        margin: 0;
        color:#263038;
        font-family: 'Roboto', sans-serif;
        font-weight:500;
        text-align: center;
    }


    .modal-body {
        position: relative;
        padding: 15px;
        background-color: #ebeef3;
    }

    .modal-footer {
        padding: .55rem 1rem .55rem 1rem;
        text-align: right;
        background: linear-gradient(180deg, #cbd3e1, #cbd3e1 50%, transparent 50%) top left / 100% 1px no-repeat;
        background-color: #f7f7f7;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .popover,
    .tooltip {
        display: block;
        position: absolute
    }

    .modal-scrollbar-measure {
        position: absolute;
        top: -9999px;
        width: 50px;
        height: 50px;
        overflow: scroll
    }

    .modal-box-bg{
        background-color: rgba(255, 255, 255, 1);
        border-radius: .25rem;
        -webkit-box-shadow: -1px 1px 8px -1px rgba(203, 211, 225, 1);
        -moz-box-shadow: -1px 1px 8px -1px #3E444E;
        box-shadow: -1px 1px 8px -1px rgba(203, 211, 225, 1);
    }



    @media (min-width:530px) {
        .modal-dialog {
            max-width: 600px;
            margin: 30px auto
        }
        .modal-sm {
            max-width: 300px
        }
    }

    @media (min-width:992px) {
        .modal-lg {
            max-width: 980px
        }
    }

 
/*MODAL*/

/*MULTI-SELECT*/
    @-webkit-keyframes fstAnimationEnter {
        from {
            opacity: 0;
            -webkit-transform: translate3d(0, -1em, 0)
        }

        to {
            opacity: 1;
            -webkit-transform: translate3d(0, 0, 0)
        }
    }

    @-moz-keyframes fstAnimationEnter {
        from {
            opacity: 0;
            -moz-transform: translate3d(0, -1em, 0)
        }

        to {
            opacity: 1;
            -moz-transform: translate3d(0, 0, 0)
        }
    }

    @keyframes fstAnimationEnter {
        from {
            opacity: 0;
            -webkit-transform: translate3d(0, -1em, 0);
            -moz-transform: translate3d(0, -1em, 0);
            -ms-transform: translate3d(0, -1em, 0);
            -o-transform: translate3d(0, -1em, 0);
            transform: translate3d(0, -1em, 0)
        }

        to {
            opacity: 1;
            -webkit-transform: translate3d(0, 0, 0);
            -moz-transform: translate3d(0, 0, 0);
            -ms-transform: translate3d(0, 0, 0);
            -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0)
        }
    }

    .fstElement {
        display: inline-block;
        position: relative;
        border:.5px solid #cbd3e1;
        box-sizing: border-box;
        color: #232323;
        font-size: 1.1em;
        background-color: rgba(255, 255, 255, 0.55);
        
        border-radius: .25rem;
    }

    .fstElement > select, .fstElement > input {
        position: absolute;
        left: -999em
    }

    .fstToggleBtn {
        font-size: 1.4em;
        display: block;
        position: relative;
        box-sizing: border-box;
        padding: .71429em 1.42857em .71429em .71429em;
        min-width: 14.28571em;
        cursor: pointer
    }

    .fstToggleBtn:after {
        position: absolute;
        content: "";
        right: .71429em;
        top: 50%;
        margin-top: -.17857em;
        border: .35714em solid transparent;
        border-top-color: #cacaca
    }

    .fstQueryInput {
        -webkit-appearance: none;
        -moz-appearance: none;
        -ms-appearance: none;
        -o-appearance: none;
        appearance: none;
        outline: none;
        box-sizing: border-box;
        background: transparent;
        border: 0
    }

    .fstResults {
        position: absolute;
        left: -1px;
        top: 100%;
        right: -1px;
        max-height: 30em;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        border: 1px solid #D7D7D7;
        border-top: 0;
        background-color: #FFFFFF;
        display: none
    }

    .fstResultItem {
        font-size: .875rem;
        display: block;
        padding: .2em .71429em;
        margin: 0;
        cursor: pointer;
        border-top: 1px solid #FFFFFF
    }

    .fstResultItem.fstUserOption {
        color: #707070
    }

    .fstResultItem.fstFocused {
        color: #FFFFFF;
        background-color: #0087FF;
        border-color: #73baf6
    }

    .fstResultItem.fstSelected {
        color: #FFFFFF;
        background-color: #2694f1;
        border-color: #73baf6
    }

    .fstGroupTitle {
        font-size: 1.4em;
        display: block;
        padding: .5em .71429em;
        margin: 0;
        font-weight: bold
    }

    .fstGroup {
        padding-top: 1em
    }

    .fstGroup:first-child {
        padding-top: 0
    }

    .fstNoResults {
        font-size: 1.4em;
        display: block;
        padding: .71429em .71429em;
        margin: 0;
        color: #999
    }

    .fstSingleMode .fstControls {
        position: absolute;
        left: -1px;
        right: -1px;
        top: 100%;
        padding: 0.5em;
        border: 1px solid #D7D7D7;
        background-color: #FFFFFF;
        display: none
    }

    .fstSingleMode .fstQueryInput {
        font-size: 1.4em;
        display: block;
        width: 100%;
        padding: .5em .35714em;
        color: #999;
        border: 1px solid #D7D7D7
    }

    .fstSingleMode.fstActive {
        z-index: 100
    }

    .fstSingleMode.fstActive.fstElement, .fstSingleMode.fstActive .fstControls,
    .fstSingleMode.fstActive .fstResults {
        box-shadow: 0 0.2em 0.2em rgba(0, 0, 0, 0.1)
    }

    .fstSingleMode.fstActive .fstControls {
        display: block
    }

    .fstSingleMode.fstActive .fstResults {
        display: block;
        z-index: 10;
        margin-top: -1px
    }

    .fstChoiceItem {
        display: inline-block;
        font-size: .8rem;
        position: relative;
        margin: .36rem .41667em .41667em .3rem;
        padding: .13333em .33333em .23333em 1.5em;
        border-radius: .25em;
        border: 1px solid #43A2F3;
        cursor: auto;
        color: #FFFFFF;
        background-color: #0087FF;
        -webkit-animation: fstAnimationEnter 0.2s;
        -moz-animation: fstAnimationEnter 0.2s;
        animation: fstAnimationEnter 0.2s
    }

    .fstChoiceItem.mod1 {
        background-color: #F9F9F9;
        border: 1px solid #D7D7D7;
        color: #232323
    }

    .fstChoiceItem.mod1 > .fstChoiceRemove {
        color: #a4a4a4
    }

    .fstChoiceRemove {
        margin: 0;
        padding: 0;
        border: 0;
        cursor: pointer;
        background: none;
        font-size: 1.16667em;
        position: absolute;
        left: 0;
        top: 50%;
        width: 1.28571em;
        line-height: 1.28571em;
        margin-top: -.64286em;
        text-align: center;
        color: #FFFFFF
    }

    .fstChoiceRemove::-moz-focus-inner {
        padding: 0;
        border: 0
    }

    .fstMultipleMode .fstControls {
        box-sizing: border-box;
        overflow: hidden;
        width: 20em;
        cursor: text
    }

    .fstMultipleMode .fstQueryInput {
        width: 2em;
        padding: .4rem .5rem;
        color: #616161;
        height: 36px;
        font-size: .875rem;
        background-color: rgba(255, 255, 255, 0.55);
        background-image: none;
        background-clip: padding-box;
    }

    .fstQueryInput:hover,
    .fstQueryInput:focus{
        background-color: #f4fafe;
        outline: 0;
        border: .5px solid #0087FF;
        color: #7a869e;
        }

    .fstMultipleMode .fstQueryInputExpanded {
        float: none;
        width: 100%;
    }

    .fstMultipleMode .fstFakeInput {
        font-size: .875rem;
        border-radius: .25rem;
    }

    .fstMultipleMode.fstActive, .fstMultipleMode.fstActive .fstResults {
        box-shadow: 0 0.2em 0.2em rgba(0, 0, 0, 0.1)
    }

    .fstMultipleMode.fstActive .fstResults {
        display: block;
        z-index: 10;
        border-top: 1px solid #D7D7D7
    }

    .fstElement { 
        font-size: 1.2em; 
        margin-bottom:0rem; 
    }
    .fstToggleBtn { 
        min-width: 16.5em;
    }

    .submitBtn { 
        display: none; 
    }

    .fstMultipleMode { 
        display: block; 
    }
    .fstMultipleMode .fstControls { 
        width: 100%; 
		max-height: 100px;
		overflow: auto;
    }



/*MULTI-SELECT*/

/*TC-DIV*/

    .div-tc{
        overflow-x: auto;
    }

    .tc-table{
        display: table;
        width:auto;
        font-size:.85rem
    }
    .tc-table-row{
        display: table-row;        
    }        

    .tc-table-row:nth-child(odd) {
        background:#FFFFFF;
    }
    .tc-table-row:nth-child(even) {
        background:#f8f9fc;
    }

    .tc-table-row:first-child{
        background: #f4f6f8;
    }

    .tc-table-row:nth-child(2){
        background: #f4f6f8;
    }
    .tc-table-body {
        display: table-row-group;
    }
    .tc-table-cell {
        display: table-cell;
        vertical-align: middle;
        background: linear-gradient(0, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
        border-right:1px solid #cbd3e1;
        color: #263038;
        min-width: 240px;
        padding:6px 10px;
        font-size:.75rem;
        font-weight: bold;
        
    }
    .tc-table-cell-first {
        display: table-cell;
        vertical-align: middle;
        background: linear-gradient(0, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
        border-right:1px solid #cbd3e1;
        color: #263038;
        min-width: 120px;
        height: 2.5rem;
    }

    .tc-table-cell-first p{
        font-weight: 600;
        height: 2.5rem;
        padding: 0;
        margin:0;
        margin-left:14px;
        padding-top:8px;
    }

    .tc-table-cell-first ul{
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .tc-table-cell-first ul li{
        display: inline-block;
        padding: 0;
        margin:0;
        width: 37px;
        border-right:1px solid #b5b5b5;
        height: 45px;
    }
    .tc-table-cell-first ul li button:hover{
        color: #263038;
        cursor: pointer;
    }
    .tc-table-cell-first ul li:last-child{
        border-right: none;
    }

    .tc-table-cell-first ul li button{
        background: none;
        border:none;
        width: 37px;
        text-align: center;
        font-size:1.25rem;
        color: #6d7a97;
        margin-top:0px;
        padding-top:11px;
    }

    .tc-table-cell-1{
        width: 180px;
        float: left;
    }

    .tc-table-cell-2{
        width: 39px;
        float: right;
    }

    .tc-table-cell-1 input{
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
        border-right: none;
    }

    .tc-table-cell-1 select{
        height: 36px;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
        border-right: none;        
    }

    .tc-table-cell-2 button{
        border-top-right-radius: .25rem;
        border-bottom-right-radius: .25rem;     
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
   
        width: 39px;
        height: 36px;
        background: #FFFFFF;
        border:.5px solid #cbd3e1;
    }

    .tc-table-cell-1-1{
        width: 220px;
    }

    .tc-group-1{
        max-width: 220px;
    }

    .tc-table-cell-1-1 select{
        height: 33px;
    }

    .tc-special{
        margin-bottom: 0px;
    }

    .tc-group{
        max-width: 180px;
    }

    .group-header{
        padding: 0px;
        margin:0;
        background: #e3e3e3;
    }

    .group-list-header{

        height: 2.5rem;
    }
    .group-list-header div{
        float: left;
        padding: none;
        margin: none;

    }

    .gl-h-b1, .gl-h-b2, .gl-h-b4, .gl-h-b5{
        width: 10%;
        border-right:.5px solid #cbd3e1;
    }

    .gl-h-b3{
        width: 60%;
        border-right:.5px solid #cbd3e1;
    }

    .gl-h-b3 input{
        border:none;
        height: 2.4rem;
    }


    .gl-btn{
        background: none;
        border:none;
        font-size:1.25rem;
        text-align: center;
        width: 100%;
        color:#263038;
        height: 2.5rem;
    }

    .gl-btn:hover,
    .gl-h-b1:hover,
    .gl-h-b2:hover,
    .gl-h-b4:hover,
    .gl-h-b5:hover
    {
        opacity: 0.75;
        background: #ccc;
        cursor: pointer;
    }

    .group-list-center{
        background: linear-gradient(180deg, #cbd3e1, #cbd3e1 51%, transparent 50%) top left / 100% 1px no-repeat;        
        background-color: #FFFFFF;
    }

    .tc-left-center{
        flex: 1 1 auto;
        overflow-x: auto;
        height:calc(100vh - 235px);   
        background: linear-gradient(180deg, #cbd3e1, #cbd3e1 51%, transparent 50%) top left / 100% 1px no-repeat;
    }
    
    .tc-left-header{ 
        flex: 0 0 auto;
        height: 6.05rem;
        background: linear-gradient(0, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
    }

    .tc-left-header input{
        margin-top:.45rem;
    }

    .tc-left-header ul{
        margin:0;
        padding:0;
        list-style: none;
    }

    .tc-left-header ul li{
        padding: 0;
        margin:0;
        display: inline-block;        
    }

    .tc-left-header ul li:last-child{
        float: right;
        padding-top:6px;
    }

    .tc-left-header ul li h1{
        font-size: .825rem;
        margin: 0;
        padding: 0;
        color: #263038;
        padding-top:6px;
    }

    .tc-left-header ul li h2{

        margin: 0;
        padding: 0;
        margin-right: 10px;
        padding-right: 10px;
        font-size: .8rem;
        color:#7F828B
    }

    .tc-left-header ul li button{
        border: .5px solid #cbd3e1;
        border-radius: .25rem;
        background: none;
        padding: 3px 9px;
        margin:0;
        cursor: pointer;
        color: #8f9db9;
        text-decoration: none;
        transition: border-color .2s ease-out;
    }
/*TC-DIV*/

/*ODEME*/
    div.pay-tab-container{
        background-color: #FFFFFF;
        padding: 0 !important;
        margin:0;
        background-clip: padding-box;
    }

    div.pay-tab-menu{
        padding-right: 0;
        padding-left: 0;
        padding-bottom: 0;
        background:linear-gradient(90deg,  #cbd3e1, #cbd3e1 51%, transparent 50%) top right / 1px 100% no-repeat;
        height: 100%;
        background-color:#FFFFFF;
        flex: 1 1 auto;
        position: relative;
        overflow-y: auto;
        padding: 0;
        height: calc(100vh - 178px);
    }

    div.pay-tab-menu div.list-group{
        margin-bottom: 0;
    }
    div.pay-tab-menu div.list-group>a{
        margin-bottom: 0;
        background: linear-gradient(0, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
    }


    div.pay-tab-menu div.list-group>a.active{
        border:none;
        color: #263038;
        background: linear-gradient(0, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat,
        linear-gradient(90deg,  #cbd3e1, #cbd3e1 51%, transparent 50%) top    right / 1px 100% no-repeat;
        background-color: #f7fbff;        
    }


    div.pay-tab-content{
        background: #FFFFFF;
        height: 100%;
        padding-left: 0px;
        padding-top: 0px;
    }

    div.pay-tab div.pay-tab-content:not(.active){
        display: none;
    }

    .pay-tab-select{
        border-bottom: .5px solid #FFFFFF;
        padding: 12px 1rem;
        width: 100%;
        height: 3.78rem;
        border-top-left-radius: .25rem;
        background:#cbd3e1;
        cursor: pointer;
    }

    .pay-tab-select h1{
        font-size: .825rem;
        margin: 0;
        padding: 0;
        text-transform: capitalize;
        
        color: #263038;
        line-height: 1;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .pay-tab-select h2{
        margin: 0;
        padding: 0;
        margin-right: 10px;
        padding-right: 10px;
        font-size: .8rem;
        
        line-height: 1.75;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        color: #7F828B
    }
    .list-group-item span{
        display: block;
        font-size:.8rem;
        color:#0087FF
    }
/*ODEME*/  

/*LOGIN*/
    .login-left{
        background-image: linear-gradient(to right, #0087ff 0%, #6a11cb 100%);
        min-height: 100vh;
    }

    .login-right{
        background:#FFFFFF;
        border-left:.5px solid #cbd3e1;
        height: 100vh;
        display: flex;
        flex-direction: column;
    }
    .lr-center{flex: 1 1 auto;}

    .lr-bottom{ flex: 0 0 auto;}

    .lr-bottom p{
        font-size: .725rem;
    }

    .login-right h1{
        font-size: 2rem;
        font-weight: 600;
        color: #263038;
        padding: 3rem 0 0;
        margin: 0;
    }
    .login-right h2{
        font-size: 1rem;
        
        color: #263038;
        padding: 0;
        margin: 0;
        margin-bottom: 2rem;
    }

    .login-right button{
        display: inline-block;
        background: #0087ff;
        color: #FFFFFF;
        text-decoration: none;
        font-size: .92rem;
        line-height: 38px;
        border-radius: .25rem;
        -webkit-transition: all 0.3s;
        transition: all 0.3s;
        text-align: center;
        width: 100%;
        box-shadow: none;
        border: none;
        cursor:pointer;
        font-weight: bold;
    }

    .login-right button:hover,
    .login-right button:active{
        background: #6a11cb;
    }
    .login-pic-box {
        -webkit-transform: translate(-50%,25%);
        transform: translate(-50%,25%);
        position: absolute;
        top: 50%;
        left: 40%;
    }

    .login-center{
        height: 90vh;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .login-center-div{
        -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center;
    }

    .login-pic-img-1{
        max-height:420px;
    }

    .login-article h1{
        font-weight:800;
        font-size:2.7rem;
        font-family: 'Montserrat', sans-serif;  
        color:#FFFFFF  
    }

    .login-article h2{
        font-family: 'Playfair Display', serif;
        
        display: inline-block;
        max-width: 350px;
        color: #FFFFFF;
        font-size: 18px;
        line-height: 1.4;
        margin:2rem 0;
    }

    .login-paragraph h3{
        font-weight:900;
        font-size:1.3rem;
        font-family: 'Montserrat', sans-serif;  
        color:#FFFFFF;
        margin-top:2rem;    
    }
    .login-paragraph h3 sup{
        font-size:.825rem;
        font-weight: 300;
        font-family: 'Roboto', sans-serif;
    }

    .login-paragraph p{
        color:#FFFFFF;
        max-width: 300px;
        font-weight: 300;
        margin-bottom:1.5rem;
    }

    .login-article-button{
        background:#FFFFFF;
        border:.5px solid #FFFFFF;
        border-radius: .25rem;
        color:#6a11cb;
        font-size:.9rem;
        padding:0 2rem;
        height:38px;
        font-weight:bold;
        cursor: pointer;
    }

    .login-article-button:hover{
        background:none;
        border:.5px solid #FFFFFF;
        color:#FFFFFF;
    }
    .choice{
        display: inline-block;
    }
    .login-fold{
        margin-top: .5rem;
    }

    .login-forget{
        font-weight: 500;
        -webkit-transition: all 0.7s;
        transition: all 0.7s;
        display: inline-block;
        float: right;
    }
/*LOGIN*/

/*LIST-TREEVIEW*/
    .left-tree{
        display: flex;
        flex-direction: column; 
        height:calc(100vh - 125px);
    }

    .left-tree-center{
        flex: 1 1 auto;
        overflow-x: auto;
        height:calc(100vh - 178px);   
        background:
        linear-gradient(180deg, #FFF, #FFF 50%, transparent 50%) top    left  / 100% 1px no-repeat;
    }
    
    .left-tree-header{ 
        flex: 0 0 auto;
        height: 3.85rem;
        background:
        linear-gradient(0,#cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
    }

    .left-tree-header-inner ul{
        list-style: none;
        margin:0;
        padding:0;
    }

    .left-tree-header-inner ul li{
        display: inline-block;
        padding: 0;
        margin:0;
    }

    .left-tree-header-inner ul li:last-child{
        float: right;
        padding-top:12px;
    }

    .left-tree-header-inner ul li h1{
        font-size: .825rem;
        margin: 0;
        padding: 0;
        color: #263038;
        padding-top:12px;
        
    }
    .left-tree-header-inner ul li h2{
        margin: 0;
        padding: 0;
        margin-right: 10px;
        padding-right: 10px;
        font-size: .8rem;
        
        line-height: 1.75;
        color:#7F828B
    }
        

    .left-tree-header button i{
        font-size:1.3rem;
        line-height: 0;
    }
    .left-tree-header button{
        border: .5px solid #cbd3e1;
        border-radius: .25rem;
        background: none;
        padding: 3px 9px;
        margin:0;
        cursor: pointer;
        color: #8f9db9;
        text-decoration: none;
        transition: border-color .2s ease-out;
        font-weight:300;
    }
    .bg-stock-search button:hover,
    .reservation-ticket button:hover,
    .left-tree-header button:hover{
        background: none;
        border:.5px solid #0087ff;
        color:#0087ff;
    }
    
    .tree {
        display: inline-block;
        margin: 0 ;
        padding: 0;
        cursor: pointer;
        margin-top:14px;
        
    }
    .tree ul {
        list-style: none outside none;
        padding: 0;
    }
    .tree li a {
        line-height: 25px;
        font-weight: 300;
    }
   .tree ul ul li ul li:hover{
        color:#0087ff;
    }


    .tree > ul > li > a {
        display: block;
        font-weight: normal;
        position: relative;
        text-decoration: none;
    }


    .tree li.parent > a {
        padding: 0 0 0 28px;
        font-weight: bold;
    }

    .tree li.parent > a:before {
        background-image: url("../svg/plus-tree.svg");
        background-position: 0px center;
        content: "";
        display: block;
        height: 10px;
        left: 0;
        position: absolute;
        top: 6px;
        vertical-align: middle;
        width: 10px;
    }
    .tree ul li.active > a:before {
        background-position: 0 center;
    }
    .tree ul li ul {
        border-left: 1px solid #D9DADB;
        display: none;
        margin: 0 0 0 12px;
        overflow: hidden;
        padding: 0 0 0 25px;
    }
    .tree ul li ul li {
        position: relative;
    }
    .tree ul li a{
        color: #0087ff;
    }
    .tree ul li ul li:before {
        border-bottom: 1px dashed #E2E2E3;
        content: "";
        left: -20px;
        position: absolute;
        top: 12px;
        width: 15px;
    }

/*LIST-TREEVIEW*/

/*LIST-NEW*/
    .clist{
        padding:20px 0;
        background: linear-gradient(0,      #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
    }

    .clist:hover{
        cursor: pointer;
        background:#f8f9fc
    }

    .clist-thead{
        background: linear-gradient(0, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
        background-color: #ebeef0
    }
    .clist-thead h1{
        font-size:.875rem;
        margin:0;
        padding:0;
        font-weight: normal;
    }
    div.clist-customer-1 {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        padding-left: 14px;
    }

    .clist img {
        margin-right: .7rem;
        border-radius: 50%;
        float: left;    
    }

    .clist-content img.card-img,
    .clist img.card-img{
        border-radius: 0%;
    }

    .clist h1 a{
        color: #263038;
    }

    .clist h2 a{
        color: #97a8c3;
    }

    .clist h1 a:hover,
    .clist h2 a:hover{
        text-decoration: underline;
        color:#0087FF
    }

    .clist h1 {
        font-size: .975rem;
        margin: 0;
        padding:0;
        padding-bottom:4px;
        text-transform: capitalize;
        
        color: #263038;
        line-height: 1;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

    .clist small{
        
        font-size: .75rem;
        color: #929daf
    }

    .divider-dash{
        opacity: .7;
        vertical-align: middle;
        color: #929daf;
    }

    .divider-dash::before{
        content: "\f209";
        font-family: "Ionicons";
        margin:0 8px;
        }

    .clist h1 span {
        font-size: .7rem;
        
    }

    .clist h1 i{
        padding-left:5px;
    }

    h1.clist-phone{
        
        color:#4e5d6c;
    }
    .clist h2 {
        margin:0;
        padding: 0;
        margin-right: 10px;
        padding-right: 10px;
        font-size: .8rem;
        color: #97a8c3;
        line-height: 1.75;
    }


    .clist button{
        border-radius: .25rem;
        width: 20px;
        height: 20px;
        color: #929daf;
        font-size:1rem;   
        line-height: 0;
        border: none;
        margin-right:10px;
        cursor: pointer;
        margin-top: 0px;
        background: none;
    }

    .clist-edit-delete{
        border-right: .5px solid #cbd3e1;
        text-align: right;
    }
  
    .clist-edit-delete h1{
        display: block;  
        font-size: .975rem;
        margin: 0;
        padding: 0;
        padding-bottom: 4px;
        text-transform: capitalize;
        color: #929daf;
        line-height: 1;
    }
    .clist-edit-delete h1 span{
        font-weight: 300;
    }


    .chart-info{
        background: linear-gradient(0, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
        background-color: #f7fbff;
    }

    .chart-info h1{
        text-transform: uppercase;
        margin-bottom: 0;
        font-size:.825rem;
        font-weight: 300;
        text-align: center;
    }
    .chart-info h2{
        margin-bottom: 0;
        font-size:1.25rem;
        font-weight: 500;
        text-align: center;
    }
    .compare{
        text-align: center;
    }

    .chart-info-inner{
        background: linear-gradient(0, #cbd3e1, #cbd3e1 51%, transparent 50%) bottom right / 100% 1px no-repeat;
    }

    .chart-info-inner div{    
        border-right:.5px solid #cbd3e1;
    }
    .chart-info-inner div:last-child{    
        border-right:none;
    }

    span.borclu{
        width:9px;
        height: 9px;
        border-radius: 50%;
        border:1px solid #FFFFFF;
        background-image: linear-gradient(to top, #0087ff 0%, #3041ea 100%);
        padding:0;
        margin:0;
        display: inline-block;
        position: absolute;
        z-index:0;
        left:12px;
    }
    span.alacakli{
        width:9px;
        height: 9px;
        border-radius: 50%;
        border:1px solid #FFFFFF;
        background-image: linear-gradient(-225deg, #fc566a 0%, #fc566a 48%, #E73A51 100%);
        padding:0;
        margin:0;
        display: inline-block;
        position: absolute;
        z-index:0;
        left:12px;
    }

    span.blue-text{
        color:#0087ff
    }
    span.red-text{
        color:#fc566a;
    }

    .clist-buttons{
        text-align: center;
        padding-top: 2px;
    }

    .clist-button-blue{
        background: #f8f9fc;
    }

    .clist-button-green{
        background-image: linear-gradient(to top, #0087ff 0%, #04befe 100%);
    }

    .clist-button-purple{
        background-image: linear-gradient(-225deg, #7A54D8 0%, #5753C9 48%, #7A54D8 100%);
    }

    .clist-button-gray{
        background: linear-gradient(-180deg, #BCC5CE 0%, #929EAD 98%), radial-gradient(at top left, rgba(255,255,255,0.30) 0%, rgba(0,0,0,0.30) 100%);
        background-blend-mode: screen;
    }

    .clist-button-green:hover{
        background-image: linear-gradient(to top, #00e3ae 0%, #9be15d 100%);
        border:1px solid #00e3ae;
    }
    .clist-button-purple:hover{
        background-image: linear-gradient(-225deg, #fc566a 0%, #E73A51 48%, #E73A51 100%);
        border:1px solid #E73A51
    }
    .clist-button-gray:hover{
        background: linear-gradient(-180deg, #ffcf00 0%, #ff5c5c 98%), radial-gradient(at top left, rgba(255,255,255,0.30) 0%, rgba(0,0,0,0.30) 100%);
        background-blend-mode: screen;
        border:1px solid #ffcf00
    }

    .clist-last{
        display: flex;
        justify-content: flex-end;
    }

    .clist-total p{
        margin:0;
        padding: 0;
        margin-right: 10px;
        padding-right: 10px;
        font-size: .725rem;
        color: #999;
        
        line-height: 1.3;
    }   
    .clist-total ul{
    list-style: none;
    padding: none;
    margin: none;
    }

    .clist-total ul li{
        display: inline-block;
        width: 100px;
    }
    div.clist-select{
        margin-top:-4px;
    }
    .clist select{
        width: 50px;
        height: 18px;
        -webkit-appearance: none;
        -moz-appearance: none;
        -ms-appearance: none;
        -o-appearance: none;
        appearance: none;
        border:none;
        background:transparent;
        background: url(../svg/dovizz.svg) no-repeat right center;
        background-position: 32px 0;
        font-size: .825rem;
        margin: 0;
        padding: 0;
        text-transform: capitalize;
        font-weight: 700;
        color: #263038;
        line-height: 1;
    }

    .clist-inner-btn{
        margin:0 10px 0 25px;
        padding: 0;
        border:none;
        background: none;
        line-height: 0;
        vertical-align: top;
        color: #263038;
    }
/*LIST-NEW*/

/*WARNING-BOX*/
    .warning-box{
        position: absolute;
        z-index:999999;
        height: 60px;
        border-radius: .25rem;
        background: #fcafba;
        border:.5px solid palevioletred;
        width:96%;
        bottom:0%;
        left:0px;
        color:#fc465c;
        text-align: center;
        padding:20px;
    }
    .warning-box h1{
        font-size:.875rem;
        font-weight: 700;
        padding:0;
        margin:0;
    }

    .warning-box i {
        font-size:2rem;
        line-height: 0;
        position: absolute;
        z-index:9999999;
        top:0px;
        right:5px;
    }

    .wt-popup-bg{
        background: rgba(0, 0, 0, .75);
        position: absolute;
        z-index:99999;
        width: 100%;
        height: 100%;
    }

    .wt-popup{
        background: #FFFFFF;
        width: 300px;
        position:absolute;
        z-index: 9999999999;
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        border-radius: .25rem;
        text-align: center;
        -webkit-box-shadow: 0px 0px 41px 6px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 0px 41px 6px rgba(0,0,0,0.75);
        box-shadow: 0px 0px 41px 6px rgba(0,0,0,0.75);
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem;
    }

    .wt-popup-header{
        background-image: linear-gradient(to right, #f78ca0 0%, #f9748f 19%, #fd868c 60%, #fe9a8b 100%);
        width: 300px;
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem;

    }

    .wt-popup-header img{
        padding: 20px 0;
        opacity: 0.5;
    }

    .wt-popup-header h1{
        font-size:1.85rem;
        
        color:#FFFFFF;
    }

    .wt-popup-header p{
        color: #FFFFFF;
    }

    .wt-popup-content{
        background: rgba(0, 0, 0, 0.1);
        width: 300px;
    }

    .wt-popup-content button{
        width: 100%;
        float: left;
        background: none;
        color:#263038;
        font-weight: 600;
        border:none;
        padding: 15px 0;
    }

    .wt-popup-content button:hover{
        background: rgba(0, 0, 0, 0.1);
        color:#263038;
        cursor: pointer;
    }

    .wpc-1,
    .wpc-2{
        width:50%;
    }

    .wpc-1{
        border-right: 1px solid #cbd3e1;
    }

    .wpc-1:hover{
        border-bottom-left-radius: 7px;
    }

    .wpc-2:hover{
        border-bottom-right-radius:7px;
    }


    .wt-popover{
        top: 0;
        right: 15px;
        z-index: 1060;
        max-width: 236px;
        padding:4px 7px;
        text-align: left;
        text-align: start;
        border-radius: .25rem;
        background-image: linear-gradient(to right, #fc566a 0%, #fc566a 19%, #fc566a 60%, #fc566a 100%);
        border: 1px solid #fc566a;
        color: #FFFFFF;
        position: absolute;
        margin-top:-20px;
    }

    .wt-popover:after {
        content:'';
        bottom:0%;
        right: 8px;
        margin-bottom:-6px;
        position: absolute;
        border-top: solid 5px #fc566a;
        border-left: solid 5px transparent;
        border-right: solid 5px transparent;
    }


    .wt-danger label{
        color: #fc566a;
    }

    .wt-danger input{
        border:1px solid #fc566a;
    }


    .security-div{
        background:#FFFFFF;
        border-radius: .25rem;
        border:.5px solid #cbd3e1;
        max-height:62px;
        text-align: center;
    }

    .security-div ul{
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .security-div ul li{
        display: inline-block;
        padding: 0;
        margin:0;
    }

    .security-div ul li+li{
        float: right;
    }

    .security-div ul li p{
        height: 60px;
        padding-left:1rem;
        font-size:1rem;
        font-weight: bold;
        letter-spacing: .5rem;
        padding-top:6px;
    }

    .security-div ul li button{
        height: 60px;
        width: 36px;
        background: #FFFFFF;
        color:#cbd3e1;
        font-size:1.6rem;
        line-height: 0;
        border:none;
        border-left:.5px solid #cbd3e1;
        border-radius:0px;
        border-bottom-right-radius: .25rem;
        border-top-right-radius: .25rem;

    }

    .security-div ul li button:hover{
        background: #0087ff;
        color:#FFFFFF;
        border-radius:0px;
        border-bottom-right-radius: .25rem;
        border-top-right-radius: .25rem;
    }

/*WARNING-BOX*/

/*FRAME-MOBILE*/
    @media (max-width:767px) {

        .wt-frame {
            padding-top: 36px;
        }
        .wt-framex {
            padding:0px;
        }

        .wt-frame-bottom{
            height: auto;
        }
        .left-content-inner-bottom{
            height: auto;
        }

        .wt-frame-center-angular,
        .wt-frame-center-list {
            height: auto;
            overflow-y: hidden;
            overflow-x: hidden;
        }

        .left-content{
            height: calc(100vh - 190px)
        }
        .left-content-inner{
            height: calc(100vh - 191px);
        }

        html body .content{
        margin-top:0px;
        }
        .bottom-inner-pagination{
            display: flex;
            -webkit-flex-flow: row wrap;
            flex-flow: row wrap;
            justify-content: flex-end;
        }

        .wt-frame-top{
        padding:3px 14px 0px 0px;
        }
        .wt-frame-tab{
            margin:4px 0px;
            height: auto;
        }
        .wt-frame-center-list,
        .wt-frame-center-angular,
        .wt-frame-center{
            margin:0;
        }

        .clist-edit-delete{
            text-align: left;
            border:none;
        }
        .left-content2{
            margin-top:0px;
            height: calc(100vh - 135px);
        }

        .left-content-inner2{
            border-radius: 0px;
            height: calc(100vh - 135px);            
        }
        .clist-edit-delete ul li:first-child{
            padding-left:0px;
            float: left;
        }


    }
    @media (min-width:1600px){
    ul.mega-dropdown-menu.dropdown-menu.search-detail{
        width:410px;
    }
    }
/*FRAME-MOBILE*/

/*PAGE-HELP*/
    .page-help h1{
        text-align: center;
        font-size:.875rem;
        font-weight: 300;
        padding-top:14px;
    }
/*PAGE-HELP*/

/*PRODUCT-CARD*/

    .product-card-text{
        background-image: linear-gradient(120deg, #ffffff 0%, #f4f6f8 100%);
        height: 100%;    
    }

    .product-card{
        display: flex;
        width: 100%;
        text-align: center;    
    }
    .product-card h2{
        font-size:1rem;
        text-align: center;
    }

    .product-card h1{
        font-weight: 600;
        font-size:2rem;
        text-align: center; 
    }
    .product-card p{
        font-size:1rem;
        margin:2rem 0;
        padding:0 2rem;
        font-weight: 300;
    }

    .product-card-title{
        height: 65vh;
        padding-top: 2.5rem;
    }

    .product-card-detail{
        text-align: center;
        margin:1rem 0;
    }

    .product-card-detail div{
        width: 40%;
        float: left;
        margin:0 5%;
    }

    .product-card-detail div:last-child{
        padding-right: 0px;
    }

    .product-card-detail div ul{
        list-style: none;
        margin:0;
        padding:0;
        border:.5px solid #cbd3e1;
        width:100%;
        float: left;
        border-radius: .25rem;
    }

    .product-card-detail div ul li{
        display: inline-flex;
        border-left:.5px solid #cbd3e1;
        padding:14px 7px;
        width: 32%;
        justify-content: center;
        flex-direction: column;
        text-align: center;
    }

    .product-card-detail div ul li:first-child{
        border-left: none;
    }

    .product-card-img{
        height: 100%;
        border-left: .5px solid #cbd3e1;
    }
    .product-card-img-size{
        height: 65vh;
    }
    .product-card-img img{
        max-width: 320px;
        max-height: 480px;
    }
    img.barcode-product{
        max-width: 90px;       
        max-height: 70px;
    }

    .product-price{
        background: linear-gradient(180deg, #cbd3e1, #cbd3e1 51%, transparent 50%) top left / 100% 1px no-repeat;
        margin-top:1rem;
    }

    .product-price-item{
        width: 100%;        
    }

    .product-price-item h1{
        font-size:4rem;
        letter-spacing: -1px;
        margin:0;
        padding:0;
    }

    .product-price-item h3{
        font-weight: 300;
        font-size: .85rem;
        margin:0;
        padding:0;
    }

    .total-price{
        font-family: 'Montserrat', sans-serif;                  
        font-size:5.5rem;        
        font-weight:900;
        padding:0;
        margin:0;
        -webkit-text-fill-color: #4e5d6c;
        -webkit-text-stroke-color:#ebeef3;
        -webkit-text-stroke-width: 3.00px; 
        line-height: 0.4;
    }

    .total-price span{
        font-family: 'Montserrat', sans-serif;                  
        font-size:3.5rem;        
        font-weight:800;
        padding:0;
        margin:0;
        -webkit-text-fill-color: #acb2b7;
        -webkit-text-stroke-color:#ebeef3;
        -webkit-text-stroke-width: 1.00px; 
        text-decoration: underline;
    }


    .total-price small{
        font-size:2rem;        
        font-weight:400;
        padding:0;
        margin:0;
        -webkit-text-fill-color: #4e5d6c;
        -webkit-text-stroke-color:#ebeef3;
        -webkit-text-stroke-width: 0.00px; 
    }

/*PRODUCT-CARD*/

/*BANK*/
    button.bank-button{
        width: 100%;
        border:.5px solid #cbd3e1;
        border-radius: .25rem;
        font-size: .8rem;
    }
    button.bank-button:hover,
    button.bank-button:focus{
        border:.5px solid #0087ff;
        color:#0087ff;
    }

    .bank-label{
        display: flex;
    }

    .bank-label label{
        padding-right: 14px;
    }

    .bank-label button{
        background: #cbd3e1;
        border:.5px solid #cbd3e1;
        border-left:none;
        border-top-right-radius: .25rem;
        border-bottom-right-radius: .25rem;
    }
    .bank-pos-td{
        width: 160px;
    }

    .bank-pos-td button{
        width: 35px;
        font-size: 1rem;
        text-align: center;
        border-left: .5px solid #cbd3e1;
        height: 40px;
    }

    button.bank-button2{
        width: 100%;
        background: none;
        border:.5px solid #cbd3e1;
    }
/*BANK*/





.okay{
    border-radius: .25rem;
    width:100%;
    display: block;
    line-height: 0px;
    height: 200px;
    border: 1px dashed #CFCECF;
    font-size: .75rem;
    color: #737373;
    text-align: center;
    background: -webkit-linear-gradient(#ECECEC, #ECECEC) !important;    
}
.btn-file {
    position: relative;
    background-image: url("../svg/uploadimg.svg");
    background-size: 110px 110px;
    background-repeat: no-repeat;
    background-position: center 10px;
    height: 240px;
}
.btn-file input[type=file] {
    top: 0;
    left: 0;
    min-width: 50px;
    min-height: 140px;
    font-size: 10px;
    text-align: left;
    filter: alpha(opacity=1);
    opacity: 0;
    outline: none;
    cursor: inherit;
    display: block;
}

.form-control[readonly]{
    margin: 0;
    background: rgba(255, 255, 255, 0.45)
}

#img-upload{
    width: 100%;
    border-radius: 5px;
    margin:0px;
}

.img-wd{
   width: 100%;
   display: block;
}

.bd-btn{
    width: 100%;
}

.bd-btn button{
    width: 100%;
    text-align: left;
    padding: 0rem .5rem;
    height: 30px;
    color: #616161;
    font-size: .875rem;
    background-color: rgba(255, 255, 255, 0.45);
    background-image: none;
    background-clip: padding-box;
    border: .5px solid rgba(0, 0, 0, .15);
    border-radius: .25rem;
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -moz-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

.bd-btn button:hover,
.bd-btn button:focus{
    background-color: rgba(255, 255, 255, 1);
    cursor: pointer;
}

.fg{
    margin-bottom:10px;
}

.sl{
    margin-top:5px;
}


.fix-date{
    font-size: .825rem;
    font-weight: bold;
    text-transform: capitalize;
    white-space: nowrap;
    color: #313643;
    margin-top:3px;
}

.pl-pr{
    padding:0 5px;
}

.fhc{
    background: #E5E5E6;
    border-top-left-radius: .25rem;
    border-bottom-left-radius: .25rem;
    text-align: center;
    font-weight: 700;
    padding-top: 6px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    border: 1px solid rgba(0, 0, 0, .075);
    height: 30px;
}

.fh button{
    width: 100%;
    background: #a3a9ad;
    border-radius: .25rem;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    border: 1px solid rgba(0, 0, 0, .075);
    padding: none;
    margin:none;
    color:#505050;
    height: 30px;
    font-weight: bold;
}

.fh button:hover,
.fh button:active{
    background: #818689;
    cursor: pointer;
    color:#313643
}


.group-select{
    width:100%;
}

.group-select select{
    width: 75%;
    float: left;
    height: 36px;
    padding: 0em 1.75rem 0rem .75rem;
    padding-right: .75rem\9;
    color: #616161;
    vertical-align: middle;
    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23333' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") right .75rem center no-repeat rgba(255, 255, 255, 0.35);
    background-image: none\9;
    background-size: 8px 10px;
    border: .5px solid rgba(0, 0, 0, .15);
    border-right: none;
    
    border-top-left-radius: .25rem;
    border-bottom-left-radius: .25rem;
    -moz-appearance: none;
    font-size: .875rem;
}
.group-select button{
    width: 25%;
    float: right;
    height: 36px;
    padding: .5rem .75rem;
    margin-bottom: 0;
    font-size: .875rem;
    
    line-height: 1.25;
    color: #55595c;
    text-align: center;
    background-color: #eceeef;
    border: 1px solid rgba(0, 0, 0, .15);
    border-bottom-right-radius: .25rem;
    border-top-right-radius: .25rem
}

.raf{
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 0px;
}

.agenda-p-cell-start{
    width: 7%;
    height: 20px;
    font-weight: bold;
	display: table-cell;
    text-align: center;
    height: 20px;
    font-size: .7rem;
    vertical-align: middle;
    border-bottom:1px solid #e2e3e4;    
    background: #eee;
}

.agenda-p{
	display: table;
	width: 100%;
}
.agenda-p-row {
	display: table-row;
}

.agenda-p-cell{
    border: 1px solid #e2e3e4;
    border-right: none;
    border-top:none;
	display: table-cell;
    width:3%;
    text-align: center;
    height: 20px;
    font-size: .7rem;
    vertical-align: middle;
    background: #eee
}

.agenda-p-body {
	display: table-row-group;
}

.bg-p-var{
    background: rgba(200, 200, 200, 0.75);
}
.bg-d-var{
    background: rgba(234, 48, 71, 0.5)
}
.bg-r-var{
    background: rgba(46, 87, 232, 0.5)
}
.bg-t-var{
    background: rgba(45, 50, 85, 0.5)
}



    .bg-p-var button,
    .bg-d-var button,
    .bg-r-var button,
    .bg-t-var button{
        border:none;
        background: none;
        cursor: pointer;
        width: 100%;
        opacity: 0;
    }

    .tabntab{
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: 0;
        height: 3.75rem;
    }

    .tabntab label img{
        display: block;
    }

    .tabntab label.boklu {
        background: rgba(255, 255, 255, 0); 
        border-bottom:none;
        padding: 6px 2rem 0 2rem;
        cursor: pointer;
        z-index: 1;
        margin-left: -1px;
        height: 3.75rem;
        font-size: .825rem;
        font-weight: 400;
        color: #4e5d6c;
        text-align: center;
        
    }
    .tabntab label.boklu:first-of-type {
        margin-left: 0;
    }
    .tabntab div.canisi {
        width: 100%;
        margin-top: -1px;
        -webkit-order: 1;
        order: 1;
    }
    .tabntab input[type=radio], 
    .tabntab div.canisi {
        display: none;
    }
    .tabntab input[type=radio]:checked + label.boklu {
        background: rgba(255, 255, 255, 0.4); 
        border:.5px solid #0087ff;
        border-radius: .25rem;
    }

    .tabntab input[type=radio]:checked + label.boklu + div.canisi {
        display: block;
    }

    .first-date{
        line-height: 1.1;
        font-weight: 600;
        color: #616161;
    }

    .tabn-h{
        height: 70vh
    }

    .gc-center{
        flex: 1 1 auto;
        position: relative;
        overflow-y: auto;
        padding: 0;
        height: calc(100vh - 200px);
        background: #F5F6F7;
    }
    .gc-header{
        color: #263038;
        background: #F0F0F0;
        border-bottom: .5px solid #cbd3e1;
        height: 3.5rem;
        padding-left: 14px;
        padding-top: .5rem;
        margin-right: 0px;
    }

    .gc-header select{
        height: 30px;
        padding: 0em 1.75rem 0rem .75rem;
        padding-right: .75rem\9;
        color: #616161;
        vertical-align: middle;
        background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23333' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") right .75rem center no-repeat rgba(255, 255, 255, 0.35);
        background-image: none\9;
        background-size: 8px 10px;
        border: .5px solid rgba(0, 0, 0, .15);
        border-radius: .25rem;
        font-size: .875rem;
        
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;  
        margin-top:-3px
    }


    .onoffswitch {
        position: relative; 
        width: 100%;
        -webkit-user-select:none; 
        -moz-user-select:none; 
        -ms-user-select: none;
        user-select: none;
    }
    
    .onoffswitch-checkbox {
        display: none;
    }
    
    .onoffswitch-label {
        display: block; 
        overflow: hidden; 
        cursor: pointer;
        border: 1px solid #ccc;
        border-radius: 30px;
    }
    
    .onoffswitch-inner {
        width: 200%; 
        margin-left: -100%;
        -moz-transition: margin 0.3s ease-in 0s; 
        -webkit-transition: margin 0.3s ease-in 0s;
        -o-transition: margin 0.3s ease-in 0s; 
        transition: margin 0.3s ease-in 0s;
        
    }
    
    .onoffswitch-inner:before, .onoffswitch-inner:after {
        float: left; 
        width: 50%; 
        height: 30px; 
        padding: 0; 
        line-height: 12px;
        font-size: 12px; 
        color: white; 
        font-family: 'Roboto', sans-serif;
        -moz-box-sizing: border-box; 
        -webkit-box-sizing: border-box; 
        box-sizing: border-box;
        border-radius: 30px;
        box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 2px 0px inset;
        padding-left: 14px;
        padding-top: 8px;
        
    }
    
    .onoffswitch-inner:before {
        content: "Evet";
        padding-left: 15px;
        background: rgba(76,217,100,1);
        color: #FFFFFF;
        border-radius: 50px 0 0 50px;
        padding-top: 8px;
    }
    
    .onoffswitch-inner:after {
        content: "Hayır";
        padding-right: 15px;
        background-color: #EEEEEE; 
        color: #999999;
        text-align: right;
        border-radius: 0 30px 30px 0;
    }
    
    .onoffswitch-switch {
        width: 30px; 
        margin: 0px;
        background: #FFFFFF;
        border: 1px solid #ccc; 
        border-radius: 30px;
        position: absolute; 
        top: 0; 
        bottom: 0; 
        -moz-transition: all 0.3s ease-in 0s; 
        -webkit-transition: all 0.3s ease-in 0s;
        -o-transition: all 0.3s ease-in 0s; 
        transition: all 0.3s ease-in 0s;  
        background-image: -webkit-linear-gradient(top, #ddd 0%, white 100%);
        box-shadow: rgba(0, 0, 0, 0.1) -1px 0px 1px 1px, rgba(255, 255, 255, 0.5) 0 1px 0 1px inset;
    }
    
    .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
        margin-left: 0;
    }
    
    .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
        right: 0px; 
    }

    .in-btn{
        border:none;
        height: 30px;
        width: 100%;
        border:rgba(255, 255, 255, 0.25);
        border-radius: .25rem;
        color:#FFFFFF;
        cursor: pointer
    }

    select.pu-modal{
        background: #FFFFFF;
        padding-left:10px;
        text-align: left;
        font-weight: 300;
        border:1px solid #e2e3e4;
        margin-top:3px;
        margin-bottom:10px;
    }

    table.pu-modal-table{
        min-width: 100%;
    }



    .bl-1{
        border-left:1px solid #9B9B9B;
    }
    
    .h-a{ height:17px;}



    .pluszor{
        right:10px;
    }
    .pluszor2{
        right:30px;
    }