/*@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,300);*/
/*@charset "UTF-8";*/
/*------custom scroll----*/
::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #999999;
}

::-webkit-scrollbar-thumb {
    min-height: 28px;
    background: #323C47;
}

/*------------------------*/
/*::selection {*/
/*background: transparent;*/
/*/!*color: #FFF;*!/*/
/*}*/

/*@font-face {*/
/*font-family: 'digital-7regular';*/
/*src: url('../fonts/digital-7-webfont.eot');*/
/*src: url('../fonts/digital-7-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/digital-7-webfont.woff') format('woff'), url('../fonts/digital-7-webfont.ttf') format('truetype'), url('../fonts/digital-7-webfont.svg#digital-7regular') format('svg');*/
/*}*/

/*@font-face {*/
/*font-family: 'lucida_granderegular';*/
/*src: url('../fonts/lucidagrande-webfont.eot');*/
/*src: url('../fonts/lucidagrande-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/lucidagrande-webfont.woff') format('woff'), url('../fonts/lucidagrande-webfont.ttf') format('truetype'), url('../fonts/lucidagrande-webfont.svg#lucida_granderegular') format('svg');*/

/*}*/

/*@font-face {*/
/*font-family: 'robotoregular';*/
/*src: url('../fonts/Roboto-Regular-webfont.eot');*/
/*src: url('../fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),*/
/*url('../fonts/Roboto-Regular-webfont.woff') format('woff'),*/
/*url('../fonts/Roboto-Regular-webfont.ttf') format('truetype'),*/
/*url('../fonts/Roboto-Regular-webfont.svg#robotoregular') format('svg');*/
/*font-weight: normal;*/
/*font-style: normal;*/
/*}*/

@font-face {
    font-family: 'oswald';
    src: url('../fonts/oswald-webfont.woff') format('woff');
}

html, body {
    /*background: url("../../assets/img/ticks.png") repeat #ECECEC;*/
    /*background: url("../../assets/img/crossword.png") repeat #ECECEC;*/
    background-color: #ECECEC;
    min-height: 100% !important;
    height: auto;
    font-family: Arial;
    margin: 0;
    padding: 0;

}
body {
    margin: 0;
    color: #676a6c;
    overflow-x: hidden;
}
.frontPage {
    padding-top: 0;
    background-image: url("../img/whitey.png");
    background-repeat: repeat;
    background-attachment: fixed;
}
.btmLogin {
    font-size: 12px;
    display: block;
    text-align: center;
    margin-bottom: 30px;
}
.btmLogin a {
    display: block;
    margin-bottom: 5px;
}



/*ADDITIONAL STYLE*/
.p0 {padding: 0 !important;}

.pL0 {padding-left: 0 !important;}
.pL015{padding-left: 15px !important;}
.pB10{padding-bottom: 10px !important;}

.pTLB0 {padding: 10px 15px 10px !important;}

/* Bts Pembayaran*/
.bB{border-bottom:1px solid #e2e2e2};




/*LOGIN STYLE*/
.frontPageCont {
    margin: 60px 0;
}
.frontPageCont .alert:before {
    font-family: FontAwesome;
    content: '\f06a';
    margin-right: 5px;
}
.frontPageCont .loginForm {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.12);
    background-color: #fff;
    padding: 25px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    margin-bottom: 30px;
}
.frontPageCont .login-form-header {
    -webkit-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
    padding: 15px 0 0 0;
    margin-left: -25px;
    margin-right: -25px;
    margin-top: -25px;
    margin-bottom: 25px;
    text-align: center;
}
.frontPageCont .login-form-header h3 {
    font-family: oswald;
    color: #629007;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 21px;
    padding-bottom: 10px;
    margin: 10px 0 0;
    border-bottom: 1px solid #EFEEEE;
}
.frontPageCont .login-form-header h3 small {
    display: block;
    font-size: 17px;
    font-weight: bold;
    padding-top: 0;
    color: #0E6F6E;
}



.frontPageCont .login-form-content .hint a {
    font-size: 13px;
    color: #969696;
    padding: 0 5px;
}

.frontPageCont .login-form-content .hint a:hover {
    color: dodgerblue;
}

.frontPageCont .login-form-footer {
    padding: 25px;
    /*margin-top: 25px;*/
    margin-left: -25px;
    margin-right: -25px;
    margin-bottom: -25px;
    -webkit-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
    border-bottom: 2px solid #629007;
}

.wrapper {
    height: 100%;
}

.btnmenu {
    display: none;
}

/*.leftContainer {*/
/*/!*margin-left: 250px;*!/*/
/*background: #ECECEC;*/
/*height: 100%;*/
/*-webkit-transition: all 1s ease;*/
/*-moz-transition: all 1s ease;*/
/*-o-transition: all 1s ease;*/
/*-ms-transition: all 1s ease;*/
/*transition: all 1s ease;*/
/*}*/

/*.leftContainer.fullwidth {*/
/*margin-left: 0px;*/
/*height: 100%;*/
/*}*/

/*.leftContent {*/
/*/!*margin-left: 255px;*/
/*margin-right: 5px;*!/*/
/*margin: 0px 5px 0px 5px;*/
/*padding: 10px 0 10px 0;*/
/*min-width: 200px;*/
/*}*/




/*SIDE MENU STYLE*/
.leftbar {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+9,6d6d6d+100 */
    /*background: rgb(0,0,0); 
    background: -moz-linear-gradient(45deg,  rgba(0,0,0,1) 0%, rgba(0,0,0,1) 9%, rgba(109,109,109,1) 100%); /* FF3.6-15 */
    /*background: -webkit-linear-gradient(45deg,  rgba(0,0,0,1) 0%,rgba(0,0,0,1) 9%,rgba(109,109,109,1) 100%); /* Chrome10-25,Safari5.1-6 */
    /*background: linear-gradient(45deg,  rgba(0,0,0,1) 0%,rgba(0,0,0,1) 9%,rgba(109,109,109,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#6d6d6d',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#38646b+0,2b6068+35,005e6d+100 */
	background: #38646b; /* Old browsers */
	background: -moz-linear-gradient(-45deg,  #38646b 0%, #2b6068 35%, #005e6d 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(-45deg,  #38646b 0%,#2b6068 35%,#005e6d 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(135deg,  #38646b 0%,#2b6068 35%,#005e6d 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#38646b', endColorstr='#005e6d',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */



    width: 250px;
    position: fixed;
    z-index: 990;
    top: 60px;
    height: 100%;
}

.leftbar .left-aside-container {
    padding-bottom: 30px;
}

.user-profile-container {
    /*background-color: #232323;*/
    background-color: #005e6d;
}

.user-profile-container .user-profile {
    display: table;
    padding: 10px 0 20px;
    width: 100%;
    /*border-bottom: 1px solid #0A0A0A;
    border-top: 1px solid #3C3B3B;*/
	border-bottom: 1px solid #005e6d;
    border-top: 1px solid#016979;
}
.btnLogout,
.btnAccount,
.btnAPI {
    /*background: #000;*/
    padding: 3px 6px;
    font-size: 12px;
    margin: -3px 10px 0 5px;
    /*border-bottom: 2px solid #232323;*/
    cursor: pointer;
    color: #fff;
    text-decoration: none !important;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
}
.btnLogout {
    margin: 0;
}

.btnLogout i,
.btnAccount i,
.btnAPI i {
    margin-right: 3px;
}
.topbar-right .btnLogout {
    background: transparent;
    border: 0;
    box-shadow: none;
    display: none !important;
}
.left-aside-toggle .topbar-right .btnLogout {
    display: block !important;
}


.btnLogout:hover {
    background: red !important;
}
.btnAccount:hover {
    border-radius: 0 !important;
    color: #08F308;
    border-bottom: 2px solid green;
}
.btnAPI:hover {
    color: orange;
    border-radius: 0 !important;
    border-bottom: 2px solid orange;
}

/*.user-profile-container .user-profile > div {*/
/*display: table-cell;*/
/*vertical-align: middle;*/
/*}*/

.user-profile-container .user-profile .admin-user-thumb {
    background: url("../../assets/img/framePhoto.png") no-repeat 0 0 scroll transparent;
    width: 93px;
    height: 122px;
    z-index: 1;
    /* left: -17px; */
    display: block;
    margin: 0 auto;
}
.adminPhoto {
    /*display: table;*/
    /*margin: 0 auto;*/
    /*position: relative;*/

    position: relative;
    float: left;
}
.frameAdmin {
    /*background: url("../../assets/img/framePhoto.png") no-repeat 0 0 scroll transparent;*/
    /*width: 93px;*/
    /*height: 122px;*/
    /*margin-top: -10px;*/
    /*z-index: 1;*/

    background: url("../../assets/img/framePhoto.png") no-repeat 0 0 scroll transparent;
    width: 93px;
    height: 92px;
    margin-top: -18px;
    margin-left: -10px;
    z-index: 1;
}
.editPhoto {
    position: absolute;
    top: 21px;
    color: #edecec;
    left: 20px;
    text-align: center;
    font-size: 12px;
    background-color: rgba(0, 0, 0, 0.5);
    width: 54px;
    height: 0;
    line-height: 54px;
    display: block;
    opacity: 0;
    -webkit-transition: height .3s;
    -moz-transition: height .3s;
    -ms-transition: height .3s;
    -o-transition: height .3s;
    transition: height .3s;
}
.frameAdmin:hover .editPhoto {
    opacity: 1;
    height: 54px;
    color: #fff;
}
.saveAvatarGroup {
    top: 40px;
    right: 20px;
    display: none;
}
.saveAvatarGroup {
    /*position: absolute;*/
    /*top: 40px;*/
    /*right: 20px;*/
    /*display: none;*/

    overflow: hidden;
    height: 56px;
    position: absolute;
    top: 1px;
    left: 9px;
    width: 57px;
}
.imgWrapper {
    overflow: hidden;
    height: 56px;
    position: absolute;
    top: 0px;
    left: 9px;
    width: 57px;

}
.adminPhoto img {
    max-width: 100%;
    min-width: 100%;
    max-height: 100%;
}


.user-profile-container .user-profile .admin-user-thumb img {
    /*width: 48px;*/
    /*height: 48px;*/
    /*-webkit-border-radius: 100%;*/
    /*-moz-border-radius: 100%;*/
    /*border-radius: 100%;*/
}

.user-profile-container .user-profile .admin-user-info {
    /*padding: 5px 4px 5px;*/
    /*color: #fff;*/
    /*font-family: Arial;*/
    /*font-size: 12px;*/
    /*margin-top: -40px;*/
    /*text-align: center;*/

    padding: 5px 4px 5px;
    color: #fff;
    font-family: Arial;
    font-size: 12px;
    margin-left: -9px;
    float: left;
    text-align: left;
}

.user-profile-container .user-profile .admin-user-info ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.user-profile-container .user-profile .admin-user-info ul li {
    line-height: normal;
    margin-bottom: 5px;
}

.user-profile-container .user-profile .admin-user-info ul li a {
    color: #04C1F9;
}
.user-profile-container .user-profile .admin-user-info ul li b,
.user-profile-container .user-profile .admin-user-info ul li a:hover {
    color: #fff;
}

.user-profile-container .admin-bar {
    text-align: center;
    border-top: 1px solid #5A5A5A;
    border-bottom: 1px solid #101010;
}

.user-profile-container .admin-bar ul {
    padding: 0;
    margin: 0;
}

.user-profile-container .admin-bar ul li {
    list-style: none;
    display: inline-block;
}

.user-profile-container .admin-bar ul li a {
    position: relative;
    width: 41px;
    padding: 12px 10px;
    display: inline-block;
    color: #969696;
    text-align: center;
    outline: none;
    margin: 2px;
    border-radius: 3px;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
.user-profile-container .admin-bar ul li a:hover {
    background: rgba(10, 10, 10, 0.23);
}
.user-profile-container .admin-bar ul li a:hover i{
    color: #97EA3F;
}

.user-profile-container .admin-bar ul li a i {
    display: inline-block;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
.dateTime {
    padding: 10px;
    /*border-bottom: 1px solid #0A0A0A;*/
}
.dateTime .timesGroup .timeCount {
    color: #F5D704;
    font-size: 18px;
    line-height: 18px;
    font-family: 'digital-7regular', serif;
    text-shadow: 0 1px 1px #000000;
    font-weight: bold;
    margin-left: 5px;
}
.dateTime .dateGroup .date {
    font-size: 12px;
    line-height: 18px;
    color: #ffffff;
    font-family: Arial;
}
.nowDay:before {
    font-family: fontawesome;
    font-weight: normal;
    content: '\f274';
    margin-right: 5px;
}

.dateTime .dateGroup .date span {
    margin-right: 3px;
    font-weight: bold;
}









/*NAV ACCORDION*/
.list-accordion {
    padding: 0;
    font-size: 13px;
}

.list-accordion .list-title {
    background-color: #000;
    font-family: Arial;
    font-size: 12px;
    text-transform: uppercase;
    padding: 8px 15px;
    border-top: rgba(0, 0, 0, 0.12) 1px solid;
    border-bottom: rgba(0, 0, 0, 0.12) 1px solid;
    font-weight: 500;
    color: #666666;
}
.list-accordion .list-title p {
    background: #292929;
    text-transform: initial;
    color: #BFBFBF;
    padding: 10px;
    border-top: 1px solid #3C3B3B;
    border-bottom: 1px solid #151515;
    margin: -9px -15px 5px;
}
.list-accordion .list-title p:before {
    font-family: FontAwesome;
    content: '\f002';
    font-weight: normal;
    font-size: 15px;
    margin-right: 5px;
}

.list-accordion .list-title .label {
    position: relative;
    font-size: 12px;
    top: -1px;
    font-weight: 500;
}
.list-accordion .list-title a:before {
    font-family: FontAwesome;
    content: '\f021';
    margin-right: 5px;
}

.list-accordion li {
    position: relative;
    list-style: none;
}

.list-accordion li > a {
    display: block;
    position: relative;
}

.list-accordion li > a > .label {
    position: relative;
    top: -1px;
    left: 4px;
    font-weight: 500;
    font-size: 12px;
}

.list-accordion li ul {
    /*background: #0E0E0E;*/
    background: #003038;
    display: none;
    position: relative;
    padding-left: 20px;
    padding-bottom: 25px;
}

.list-accordion li ul li {
    position: relative;
}

.list-accordion li ul li a {
    /*color: #868686;*/
    color: #ffffff;
    position: relative;
    padding: 8px 15px;
}

.list-accordion li ul li a .acc-icon {
    top: 7px;
}

.list-accordion li ul li a:hover,
.list-accordion li ul li a:focus {
    text-decoration: none;
    /*color: #08F308;*/
    color: #ffffff;;
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
}

.list-accordion > li > a {
    /*background-color: #2c2c31;*/
	/*background-color: #940608;*/
	background-color: #005e6d;
    text-transform: uppercase;
    font-size: 11px;
    color: #fff;
    padding: 6px 15px;
    text-align: right;
    display: block;
    /*border-bottom: 1px solid #101010;
    border-top: 1px solid #424242;*/
	border-bottom: 1px solid #015867;
    border-top: 1px solid #006d80;
    vertical-align: middle;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
.list-accordion > li > a span{
    text-align: left;
    display: block;
}

.list-accordion > li > a.acc-parent.active {
    /*background-color: #3a3b44;*/
    background-color: #024d58;
    color: #ffffff;
}

.list-accordion > li > a > i {
    padding-right: 6px;
    font-size: 18px;
    position: relative;
    top: 1px;
}

.list-accordion > li > a:hover,
.list-accordion > li > a:focus {
    /*background-color: #3a3b44;*/
    background-color: #024d58
    text-decoration: none;
    color: #efefef;
}

.list-accordion > li.nochild > a:after {
    display:none;
}

.list-accordion > li > a:after {
    font-family: FontAwesome;
    content: "\f105";
    float: right;
    display: inline-block;
    margin-top: -16px !important;
    /*color: red;*/
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
.list-accordion > li > a.active:after {
    content: "\f107";
}


.tree-style li ul:after {
    content: "";
    height: 100%;
    width: 0;
    border-left: #3a3b44 1px solid;
    position: absolute;
    top: 0;
    left: 20px;
}

.tree-style li ul li a:before {
    content: "\f10c";
    font: normal 14px/1 'FontAwesome';
    height: 100%;
    position: absolute;
    top: 16px;
    font-size: 6px;
    z-index: 100;
    left: -2px;
    color: #3a3b44;
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
}

.tree-style li ul li a:hover:before,
.tree-style li ul li a:focus:before {
    color: #0AB70A;
    top: 14px;
    font-size: 8px;
    left: -3px;
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
}

.tree-style li ul li a:after {
    content: "";
    height: 1px;
    position: absolute;
    top: 18px;
    font-size: 6px;
    left: -1px;
    width: 14px;
    border-bottom: #3a3b44 1px solid;
}

/*TOP HEADER STYLE*/
.topbar {
    background: #fff;
    height: 60px;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 1040;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16);
}

.topbar .topbar-left {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#b1ba09+0,629007+100 */
    /*background: rgb(177,186,9); /!* Old browsers *!/*/
    /*background: -moz-linear-gradient(-45deg,  rgba(177,186,9,1) 0%, rgba(98,144,7,1) 100%); /!* FF3.6+ *!/*/
    /*background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(177,186,9,1)), color-stop(100%,rgba(98,144,7,1))); /!* Chrome,Safari4+ *!/*/
    /*background: -webkit-linear-gradient(-45deg,  rgba(177,186,9,1) 0%,rgba(98,144,7,1) 100%); /!* Chrome10+,Safari5.1+ *!/*/
    /*background: -o-linear-gradient(-45deg,  rgba(177,186,9,1) 0%,rgba(98,144,7,1) 100%); /!* Opera 11.10+ *!/*/
    /*background: -ms-linear-gradient(-45deg,  rgba(177,186,9,1) 0%,rgba(98,144,7,1) 100%); /!* IE10+ *!/*/
    /*background: linear-gradient(135deg,  rgba(177,186,9,1) 0%,rgba(98,144,7,1) 100%); /!* W3C *!/*/
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b1ba09', endColorstr='#629007',GradientType=1 ); /!* IE6-9 fallback on horizontal gradient *!/*/
    /*background: rgb(222, 222, 222);*/
	background-color: white;
    width: 250px;
    padding: 0 6px;
}

.topbar .topbar-left .left-branding,
.topbar .topbar-left .branding-right {
    list-style: none;
    padding: 0;
    margin: 0;
}

.topbar .topbar-left .left-branding > li {
    height: 60px;
    display: block;
    list-style: none;
    float: left;
}

.topbar .topbar-left .left-branding > li .logo {
    margin-top: -5px;
    margin-left: 10px;
    /* height: 50px; */
    /* width: 100%; */
    /* overflow: hidden; */
}

.topbar .topbar-left .left-branding > li .logo > a {
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    margin-top: 10px;
    display: block;
    float: none;
    outline: none;
    text-decoration: none;
    height: 50px;
    width: 100%;
    overflow: hidden;
}
.topbar .topbar-left .left-branding > li .logo > a img {
    max-width: 100%;
    max-height: 100%;
}

.topbar .topbar-left .left-toggle-switch {
    width: 44px;
    height: 60px;
    display: inline-block;
    cursor: pointer;
    text-align: center;
    color: #ffffff;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    transition: all 300ms linear;
}
.left-aside-toggle .topbar .topbar-left .left-toggle-switch {
    color: red;
}

.topbar .topbar-left .left-toggle-switch:before,
.left-aside-toggle .left-toggle-switch:before {
    font-family: FontAwesome;
    width: 44px;
    height: 60px;
    display: inline-block;
    line-height: 60px;
    font-size: 18px;
}
.topbar .topbar-left .left-toggle-switch:before {content: '\f0c9';color: #5a5a5a;}
.left-aside-toggle .topbar .topbar-left .left-toggle-switch:before {content: '\f00d';}
/*.left-aside-toggle .topbar .topbar-left .left-toggle-switch:before {content: '\f142';}*/

/*.topbar .topbar-left .left-toggle-switch i {*/
/**/
/*}*/

/*Topbar Right*/
.topbar .topbar-right {
    padding: 0px 6px;
}

.topbar .topbar-right .left-bar-switch {
    padding: 0px;
    margin: 0px;
    display: none;
    list-style: none;
    width: 44px;
    height: 60px;
    cursor: pointer;
    text-align: center;
    color: #757575;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    transition: all 300ms linear;
}

.topbar .topbar-right .left-bar-switch i {
    width: 44px;
    height: 60px;
    display: inline-block;
    line-height: 60px;
    font-size: 24px;
}

.topbar .topbar-right .left-bar-switch:hover,
.topbar .topbar-right .left-bar-switchfocus {
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    background-color: rgba(0, 0, 0, 0.05);
}

.topbar .topbar-right .top-right-icons {
    margin: 20px 20px 0;
    padding: 0;
    text-align: right;
}
/*.left-aside-toggle .topbar .topbar-right .top-right-icons {*/
/*margin: 20px 0 0;*/
/*}*/

.topbar .topbar-right .top-right-icons > li {
    display: inline-block;
    list-style: none;
    float: left;
    margin: 0 5px;
    font-size: 12px;
}
.topbar .topbar-right .top-right-icons > li:last-child {
    margin: 0;
}
.topbar .topbar-right .top-right-icons > li:last-child:hover i {
    color: red;
}

.topbar .topbar-right .top-right-icons > li > a {
    position: relative;
    /*width: 35px;*/
    /*height: 60px;*/
    display: inline-block;
    cursor: pointer;
    text-align: center;
    color: #757575;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    transition: all 300ms linear;
}
.flagLag {
    height: 20px;
    line-height: 24px;
    padding: 0 5px;
}
.icoFlag {
    background: url("../../assets/img/waw.png") no-repeat;
    width: 20px !important;
    height: 16px !important;
}
.icoFlag:hover,
.icoFlag.active {
    background-color: #46B504 !important;
}
.icoFlag#id {
    background-position: -18px 0;
}
.icoFlag#en {
    background-position: 0 0;
}

.topbar .topbar-right .top-right-icons > li > a .noty-bubble {
    border-radius: 13px;
    right: 4%;
    top: -10px;
    display: inline-block;
    height: 18px;
    width: 18px;
    line-height: 18px;
    font-size: 10px;
    background-color: #ff5252;
    position: absolute;
    font-weight: 600;
    color: #ffffff;
}

.topbar .topbar-right .top-right-icons > li > a .more-noty {
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    width: 10px;
    height: 10px;
    right: 10px;
    top: 10px;
    display: inline-block;
    text-align: center;
    font-size: 10px;
    background-color: #ff5252;
    position: absolute;
    font-weight: 400;
}

.topbar .topbar-right .top-right-icons > li > a > i {
    /*width: 44px;*/
    /*height: 60px;*/
    /*display: inline-block;*/
    /*line-height: 60px;*/
    font-size: 14px;
}

.topbar .topbar-right .top-right-icons > li > a:hover,
.topbar .topbar-right .top-right-icons > li > a:focus {
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    /*background-color: rgba(0, 0, 0, 0.05);*/
}
.btn-notification .fa {
    color: #918B8B;
    -webkit-transition: .4ms;
    -moz-transition: .4ms;
    -ms-transition: .4ms;
    -o-transition: .4ms;
    transition: .4ms;
}
.btn-notification:hover .fa {
    color: green;
}

.apps-dropdown .dropdown-menu,
.more-dropdown .dropdown-menu {
    border-top: #ddd 1px solid;
    display: block;
    visibility: hidden;
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transform: scale(0);
    -webkit-transform: scale(0);
    transform-origin: right top;
    -webkit-transform-origin: right top;
    padding-bottom: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    right: 0px;
    left: auto;
    width: 237px;
}

.apps-dropdown .dropdown-menu > li > a,
.more-dropdown .dropdown-menu > li > a {
    position: relative;
    color: #666;
}

.apps-dropdown .dropdown-menu > li > a:hover,
.more-dropdown .dropdown-menu > li > a:hover,
.apps-dropdown .dropdown-menu > li > a:focus,
.more-dropdown .dropdown-menu > li > a:focus,
.apps-dropdown .dropdown-menu > li > a:active,
.more-dropdown .dropdown-menu > li > a:active,
.apps-dropdown .dropdown-menu > li > a.active,
.more-dropdown .dropdown-menu > li > a.active {
    background-color: #f5f5f5;
    color: #17bab8;
    text-decoration: none;
}

.apps-dropdown .dropdown-menu:after,
.more-dropdown .dropdown-menu:after,
.apps-dropdown .dropdown-menu:before,
.more-dropdown .dropdown-menu:before {
    bottom: 100%;
    left: 91%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.apps-dropdown .dropdown-menu:after,
.more-dropdown .dropdown-menu:after {
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #fff;
    border-width: 8px;
    margin-left: -8px;
}

.apps-dropdown .dropdown-menu:before,
.more-dropdown .dropdown-menu:before {
    border-color: rgba(238, 238, 238, 0);
    border-bottom-color: #eee;
    border-width: 10px;
    margin-left: -10px;
}

.apps-dropdown.open .dropdown-menu,
.more-dropdown.open .dropdown-menu {
    visibility: visible;
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transform: scale(1);
    -webkit-transform: scale(1);
}

.apps-dropdown .apps-shortcut {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

.apps-dropdown .apps-shortcut > li {
    width: 96px;
    height: 96px;
    float: left;
    margin: 10px 15px 5px 15px;
    display: inline-block;
}

.apps-dropdown .apps-shortcut > li:nth-child(2n) {
    margin-left: 0px;
}

.apps-dropdown .apps-shortcut > li > a {
    position: relative;
    width: 96px;
    height: 96px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    background-color: #f5f5f5;
    color: #666;
    display: inline-block;
    float: left;
    text-align: center;
}

.apps-dropdown .apps-shortcut > li > a .apps-label {
    display: block;
    font-size: 12px;
}

.apps-dropdown .apps-shortcut > li > a .apps-noty {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    right: 7px;
    top: 6px;
    display: inline-block;
    padding: 3px 4px;
    font-size: 10px;
    background-color: #ff5252;
    position: absolute;
    font-weight: 600;
    color: #ffffff;
}

.apps-dropdown .apps-shortcut > li > a i {
    width: 96px;
    height: 60px;
    padding-top: 6px;
    margin-bottom: 3px;
    display: inline-block;
    line-height: 60px;
    font-size: 24px;
}

.apps-dropdown .apps-shortcut > li > a:hover,
.apps-dropdown .apps-shortcut > li > a:focus,
.apps-dropdown .apps-shortcut > li > a:active,
.apps-dropdown .apps-shortcut > li > a.active {
    background-color: #f1f1f1;
    color: #17bab8;
    text-decoration: none;
}

.apps-dropdown .more-apps {
    padding: 0px;
    margin: 12px 0px 0px 0px;
}

.apps-dropdown .more-apps > li {
    display: block;
    list-style: none;
}

.apps-dropdown .more-apps > li:nth-child(1) {
    border-top: #eee 1px solid;
}

.apps-dropdown .more-apps > li:last-child > a {
    border-bottom: 0px;
}

.apps-dropdown .more-apps > li > a {
    position: relative;
    padding: 10px 15px;
    display: block;
    border-bottom: #eee 1px solid;
    color: #666;
}

.apps-dropdown .more-apps > li > a .apps-noty {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    right: 15px;
    top: 10px;
    display: inline-block;
    padding: 3px 4px;
    font-size: 10px;
    background-color: #ff5252;
    position: absolute;
    font-weight: 600;
    color: #ffffff;
}

.apps-dropdown .more-apps > li > a:hover,
.apps-dropdown .more-apps > li > a:focus,
.apps-dropdown .more-apps > li > a:active,
.apps-dropdown .more-apps > li > a.active {
    text-decoration: none;
    background-color: #f5f5f5;
    color: #17bab8;
}

.apps-dropdown .more-apps > li > a i {
    padding-right: 5px;
}

.more-dropdown .more-apps {
    padding: 0px;
}

.more-dropdown .more-apps > li {
    display: block;
    list-style: none;
}

.more-dropdown .more-apps > li:last-child > a {
    border-bottom: 0px;
}

.more-dropdown .more-apps > li > a {
    position: relative;
    padding: 10px 15px;
    display: block;
    border-bottom: #eee 1px solid;
}

.more-dropdown .more-apps > li > a .apps-noty {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    right: 15px;
    top: 10px;
    display: inline-block;
    padding: 3px 4px;
    font-size: 10px;
    background-color: #ff5252;
    position: absolute;
    font-weight: 600;
    color: #ffffff;
}

.more-dropdown .more-apps > li > a:hover,
.more-dropdown .more-apps > li > a:focus,
.more-dropdown .more-apps > li > a:active,
.more-dropdown .more-apps > li > a.active {
    text-decoration: none;
    background-color: #f5f5f5;
}

.more-dropdown .more-apps > li > a i {
    padding-right: 5px;
}

.notifications-dropdown .dropdown-menu {
    border-top: #ddd 1px solid;
    display: block;
    visibility: hidden;
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transform: scale(0);
    -webkit-transform: scale(0);
    transform-origin: right top;
    -webkit-transform-origin: right top;
    padding-bottom: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    right: 0;
    top: 30px;
    left: auto;
    width: 320px;
    padding-top: 0;
    margin-right: -14px;
}
.notifications-dropdown.open .fa {
    color: green;
}

.notifications-dropdown .dropdown-menu.notifications-tabs .nav {
    border-bottom: #ddd 1px solid;
}

.notifications-dropdown .dropdown-menu.notifications-tabs .nav > li > a {
    padding: 15px 15px;
    text-transform: uppercase;
}

.notifications-dropdown .dropdown-menu:after,
.notifications-dropdown .dropdown-menu:before {
    bottom: 100%;
    left: 90%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.notifications-dropdown .dropdown-menu:after {
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #fff;
    border-width: 8px;
    margin-left: -8px;
}

.notifications-dropdown .dropdown-menu:before {
    border-color: rgba(238, 238, 238, 0);
    border-bottom-color: #eee;
    border-width: 10px;
    margin-left: -10px;
}

.notifications-dropdown .dropdown-menu .message-list-container {
    max-height: 400px;
    overflow-y: auto;
}

.notifications-dropdown .dropdown-menu .message-list-container > ul {
    padding: 0px;
    margin: 0px;
}

.notifications-dropdown .dropdown-menu .message-list-container > ul > li {
    /*display: table;*/
    padding: 0px;
    border-bottom: #eee 1px solid;
    background: #f9f9f9;
}

.notifications-dropdown .dropdown-menu .message-list-container > ul > li > a {
    display: block;
    font-size: 12px;
    color: #444444;
    text-decoration: none;
    padding: 5px 15px;
    margin-top: -20px;
}

.notifications-dropdown .dropdown-menu .message-list-container > ul > li > a:hover {
    text-decoration: none;
    color: #17bab8;
}

.notifications-dropdown .dropdown-menu .message-list-container > ul > li:hover,
.notifications-dropdown .dropdown-menu .message-list-container > ul > li:active,
.notifications-dropdown .dropdown-menu .message-list-container > ul > li:focus {
    background: #fff;
    text-decoration: none;
}

.notifications-dropdown .dropdown-menu .message-list-container h4 {
    font-size: 14px;
    font-weight: 500;
    padding: 15px;
    margin: 0px;
    border-bottom: #eee 1px solid;
}

.notifications-dropdown .dropdown-menu .notification-wrap {
    height: 400px;
    overflow-y: auto;
}

.notifications-dropdown .dropdown-menu .notification-wrap > ul {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

.notifications-dropdown .dropdown-menu .notification-wrap > ul > li > a {
    width: 100%;
    display: table;
    padding: 15px;
    font-size: 12px;
    color: #444444;
    background: #f9f9f9;
    text-decoration: none;
    border-bottom: #eee 1px solid;
}

.notifications-dropdown .dropdown-menu .notification-wrap > ul > li > a > span {
    display: table-cell;
    vertical-align: middle;
}

.notifications-dropdown .dropdown-menu .notification-wrap > ul > li > a > span.ni {
    width: 44px;
    height: 44px;
    display: inline-block;
    line-height: 44px;
    text-align: center;
    font-size: 18px;
    color: #fff;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
}

.notifications-dropdown .dropdown-menu .notification-wrap > ul > li > a:hover {
    background: #fff;
}

.notifications-dropdown .dropdown-menu h4 {
    font-size: 14px;
    font-weight: 500;
    padding: 15px;
    margin: 0px;
    border-bottom: #eee 1px solid;
}

.notifications-dropdown.open .dropdown-menu {
    visibility: visible;
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transform: scale(1);
    -webkit-transform: scale(1);
}

.message-thumb {
    width: 40px;
    height: 40px;
    display: table-cell;
    vertical-align: middle;
}

.message-thumb img {
    width: 40px;
    height: 40px;
    padding: 2px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
}

.message-thumb .message-letter {
    width: 40px;
    height: 40px;
    padding: 2px;
    color: #fff;
    line-height: 34px;
    font-weight: 300;
    text-align: center;
    display: inline-block;
    font-size: 24px;
    text-transform: uppercase;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
}

.message-intro {
    display: inline-block;
    /*width: 240px;*/
    display: table-cell;
    vertical-align: middle;
    /*padding-left: 0px !important;*/
}

.message-meta {
    font-weight: 500;
    font-style: italic;
    font-size: 12px;
}

.message-time {
    display: block;
    color: #999999;
}

.btn-link.btn-view-all {
    font-size: 12px;
    color: #444444;
    padding: 15px 20px;
    font-weight: 500;
}

.btn-link.btn-view-all:hover,
.btn-link.btn-view-all:active,
.btn-link.btn-view-all:focus {
    background-color: #f5f5f5 !important;
    color: #17bab8 !important;
    text-decoration: none;
}

.iconic-view .topbar .topbar-left {
    padding: 0px 0px;
}

.iconic-view .topbar .topbar-left .left-toggle-switch {
    background-color: #17bab8;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    width: 60px;
    height: 60px;
    color: #ffffff;
}

.iconic-view .topbar .topbar-left .left-toggle-switch i {
    width: 60px;
    height: 60px;
    line-height: 60px;
    font-size: 24px;
}

.iconic-view .topbar .topbar-left .left-toggle-switch:hover i,
.iconic-view .topbar .topbar-left .left-toggle-switchfocus i {
    background-color: rgba(0, 0, 0, 0.05);
}

.language-dropdown {
    width: auto !important;
    height: 60px;
}

.language-dropdown > a {
    width: auto !important;
    display: inline-block;
    padding-top: 16px;
    padding-left: 15px !important;
    padding-right: 15px !important;
}

.language-dropdown > a:hover,
.language-dropdown > a:focus {
    text-decoration: none;
}

.language-dropdown .dropdown-menu {
    width: 200px !important;
    border-top: #ddd 1px solid;
    display: block;
    visibility: hidden;
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transform: scale(0);
    -webkit-transform: scale(0);
    transform-origin: right top;
    -webkit-transform-origin: right top;
    padding-bottom: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    right: 0px;
    left: auto;
    width: 237px;
}

.language-dropdown .dropdown-menu > li > a {
    position: relative;
    color: #666;
}

.language-dropdown .dropdown-menu > li > a:hover,
.language-dropdown .dropdown-menu > li > a:focus,
.language-dropdown .dropdown-menu > li > a:active,
.language-dropdown .dropdown-menu > li > a.active {
    background-color: #f5f5f5;
    color: #17bab8;
    text-decoration: none;
}

.language-dropdown .dropdown-menu:after,
.language-dropdown .dropdown-menu:before {
    bottom: 100%;
    left: 91%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.language-dropdown .dropdown-menu:after {
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #fff;
    border-width: 8px;
    margin-left: -8px;
}

.language-dropdown .dropdown-menu:before {
    border-color: rgba(238, 238, 238, 0);
    border-bottom-color: #eee;
    border-width: 10px;
    margin-left: -10px;
}

.language-dropdown.open .dropdown-menu {
    visibility: visible;
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transform: scale(1);
    -webkit-transform: scale(1);
}

.language-dropdown .language-lists {
    padding: 0px;
}

.language-dropdown .language-lists > li {
    display: block;
    list-style: none;
}

.language-dropdown .language-lists > li:last-child > a {
    border-bottom: 0px;
}

.language-dropdown .language-lists > li > a {
    position: relative;
    padding: 10px 15px;
    display: block;
    border-bottom: #eee 1px solid;
}

.language-dropdown .language-lists > li > a:hover,
.language-dropdown .language-lists > li > a:focus,
.language-dropdown .language-lists > li > a:active,
.language-dropdown .language-lists > li > a.active {
    text-decoration: none;
    background-color: #fff;
}

.language-dropdown .language-lists > li > a i {
    padding-right: 5px;
}

.language-flag {
    position: relative;
    width: 24px;
    height: 18px;
    display: inline-block;
    display: block;
}

.language-flag .flag-icon {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 3px;
    left: 0px;
    background-size: cover;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.language-title {
    position: relative;
    top: -1px;
    text-transform: uppercase;
    margin-left: 6px;
    display: inline-block;
}

.language-lists .language-flag {
    position: relative;
    width: 24px;
    height: 18px;
    display: inline-block;
    display: block;
}

.language-lists .language-flag .flag-icon {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 3px;
    left: 0px;
    background-size: cover;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border: #eee 1px solid;
}

.language-lists .language-title {
    position: relative;
    top: -1px;
    text-transform: capitalize;
    margin-left: 6px;
    display: inline-block;
}




/*TABCUSTOMS*/
#tabCustom {
    margin: 0 -15px;
    padding: 0 15px;
}


/*TABLE MINI FOR MOBILE*/
.table.mini {
    border: 1px solid #ddd;
    margin-bottom: 5px;
}
.table.mini thead th {
    width: auto !important;
    text-align: center;
    text-transform: uppercase;
    display: flex;
    border-bottom: 0;
}
.table.mini.noAction thead th label {
    position: absolute;
    left: 10px;
}

.table.mini thead th.no,
.table.mini tbody td.no {
    /*background-color: red !important;*/
    min-width: 39px;
    max-width: 39px;
    padding: 8px 0;
    display: inline-block;
    float: left;
    text-align: center;
}

/*.table.mini thead th.title {*/
/*border-left: 1px solid #ddd;*/
/*}*/
.table.mini thead th.sorting_asc {
    background: #E6F7A9;
}
.table.mini thead th.sorting_desc {
    background: #B4DCF7;
}

.table.mini thead tr {
    background: #F4F4F4;
}
.table.mini thead th.title,
.table.mini tbody td.show {
    display: block;
}
.table.mini tbody td.show {
    padding: 0;
    position: relative;
}
.table.mini tbody td.active {
    background-color: #fff;
}
.conditions {
    display: none;
}
.toggles {
    background: rgb(252, 252, 252);
    width: 38px;
    height: 100%;
    min-height: 34px;
    line-height: 35px;
    display: inline-block;
    text-align: center;
    border-left: 1px solid #ddd;
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
}
.toggles:active {
    background-color: #88c906;
}

.table.mini tbody td.active .toggles {
    background-color: #71A705;
    color: #fff;
}
.table.mini tbody td.show .toggles:before,
.table.mini tbody td.active .toggles:before {
    font-family: FontAwesome;
}
.table.mini tbody td .toggles:before {
    content: '\f078';
}
.table.mini tbody td.active .toggles:before {
    content: '\f077';
}
.table.mini tbody td .children {
    background: #FDFCE2;
    position: relative;
    border: 0;
    float: left;
    width: 100%;
    margin-top: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 10px 0 0;
    border-top: 2px solid #71A705;
    display: none;
}
/*.table.mini tbody td.active .children,*/
/*.table.mini tbody td.active .children span {*/
/*display: block;*/
/*}*/

.table.mini tbody td.active .children .head {
    font-weight: bold;
}

/*.table.mini tbody td.active .children {*/
/*display: block;*/
/*}*/
.separate {
    float: right;
    font-style: normal;
}

.table.mini tbody td.show span.title {
    font-size: 13px;
    padding: 8px;
    display: block;
    white-space: normal;
    text-align: left;
    margin-right: 37px;
    border-left: 1px solid #ddd;
    margin-left: 40px;
}

.table.mini tbody td.show span.title input[type='checkbox']{
    position: absolute;
    left: 10px;
    top: 11px;
}
.table.mini tbody td.show span.title {
    border-left: 0;
    margin-left: 0;
}
.table.mini tbody td.show span.title {
    color: #313131;
}
.table.mini tbody td.active span.title {
    font-weight: bold;
    color: red;
}
.table.mini tbody td.show a.block {
    min-height: inherit;
    padding: 0;
}

.table.mini tbody td .list {
    display: block;
}
.table.mini tbody td .list:last-of-type {
    border-top: 1px dashed #71A705;
    display: block;
    margin-top: 10px;
    padding-top: 5px;
}
.table.mini.noAction tbody td .list:last-of-type {
    border-top: 0;
}
.table.mini tbody td .list:last-of-type .head {
    display: none !important;
}
.table.mini.noAction tbody td .list:last-of-type .head {
    display: block !important;
}
.table.mini tbody td .list:last-of-type .val {
    display: table;
}
.table.mini tbody td .list:last-of-type .val a {
    background: #ddd;
    width: 40px;
    line-height: 27px;
    text-align: center;
    padding: 6px 10px;
    margin: 5px 2px;
    border: 0;
    display: inline-block;
    font-size: 20px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-decoration: none;
    cursor: pointer;
}
.table.mini tbody td .list:last-of-type .val a.btnAction {
    width: auto;
    color: #fff !important;
    /*text-transform: uppercase;*/
}
.table.mini tbody td .list:last-of-type .val a.ico2Remove{
    background: #F56D6D;
    color: #000;
    border-color: #F14C4C;
}
.table.mini tbody td .list:last-of-type .val a.ico2Edit{
    background: #04A9A9;
    color: #000;
    border-color: #059E9E;
}
.table.mini tbody td .list:last-of-type .val a.ico2View {
    background: #C1C504;
    color: #000;
    border-color: #ABAF07;
}








/*TABLE RESIZE CUSTOM*/
.overflowsCustom {
    overflow-x: auto;
    overflow-y: hidden;
    margin-bottom: 10px;
}

.tableContainer {
    width: 100%;
    margin-bottom: 5px;
    border-bottom: 1px solid #ddd;
    font-size: 13px;
}
.mobGridTable .btnAction,
.tableContainer .btnAction {
    padding: 1px 5px;
    margin: 2px 1px 0 0;
    /*height: 23px;*/
    display: inline-block;
    line-height: 19px;
    text-align: center;
    border-radius: 2px;
    cursor: pointer;
    text-decoration: none;
    -webkit-transition: .4s;
    -moz-transition: .4s;
    -ms-transition: .4s;
    -o-transition: .4s;
    transition: .4s;
}
.actions .btnAction {
    padding: 1px 5px;
    margin: 4px 1px 0 0;
    height: 20px;
    display: inline-block;
    line-height: 15px;
}
.tableContainer .btnAction.ico2Remove{
    background: #F56D6D;
    color: #fff;
    border: 1px solid #F14C4C;
}
.tableContainer .btnAction.ico2Edit{
    background: #04A9A9;
    color: #fff;
    border: 1px solid #059E9E;
}
.tableContainer .btnAction.ico2View{
    background: #EA9904;
    color: #FFF;
    border: 1px solid orange;
}
.tableContainer .btnAction.ico2Link{
    background: #076C07;
    color: #FFF;
    border: 1px solid #076C07;
}
.tableContainer .btnAction.ico2Item{
    background: #3756C7;
    color: #FFF;
    border: 1px solid #2742a9;
}
.tableContainer .btnAction.ico2View:hover,
.tableContainer .btnAction.ico2Edit:hover,
.tableContainer .btnAction.ico2Remove:hover,
.tableContainer .btnAction.ico2Link:hover,
.tableContainer .btnAction.ico2Item:hover {
    background: #333;
    color: #fff;
    border: 1px solid #333;
    /*font-weight: bold;*/
}

.mobGridTable .btnAction.ico2Item {
    background: #3756C7;
    color: #FFF;
    border: 1px solid #2742a9;
}
.mobGridTable .btnAction.ico2View {
    background: #EA9904;
    color: #FFF;
    border: 1px solid orange;
}
.mobGridTable ul li  {
    padding-bottom: 15px;
    border-bottom: 1px solid #ddd;
}

.type1 tr {
    float: none;
    display: inline-block;
}
.type1 .tableBody tr {
    border-bottom: 1px solid #E4E4E4;
    border-right: 1px solid #BAB7B7;
    width: 100% !important;
}
.type1 .tableBody tr:last-of-type {
    border-bottom: 0;
}
.type2 tr {
    float: inherit;
}
.type3 tr {
    float: none;
    display: block;
}

.tableContainer .tableHead {
    background: url("../../assets/img/pattern/pattern1.png") repeat #696969;
}

.tableContainer .tableHead tr {
    background: url("../../assets/img/pattern/pattern1.png") repeat #696969;
    border-bottom: 1px solid #323232;
}
.tableContainer .tableHead>tr>th {
    background: url("../../assets/img/pattern/pattern1.png") repeat #696969 !important;
    font-family: Arial;
    color: #fff;
    text-transform: uppercase;
    font-size: 12px;
    height: 40px !important;
    line-height: 40px !important;
    position: relative;
    border-right: 1px solid #45484C;
    border-top: 1px solid #45484C;
    border-bottom: 0;
    cursor: pointer;
    white-space: nowrap;
}
.tableContainer .tableHead>tr>th span:first-child {
    overflow: hidden;
    display: block;
}

/*.tableContainer .tableHead>tr>th:last-of-type {*/
/*border-right: 0;*/
/*}*/
/*<span class="stg"><i class="fa fa-cog"></i></span>*/
.tableContainer .tableHead>tr>th.actions span.stg:first-child {
    float: right;
    display: inline-block;
    width: 30px;
    text-align: center;
}
.tableContainer .tableHead>tr>th.actions span.stg:first-child .fa {
    position: relative;
    top: 2px;
    color: #fff;
    left: auto;
    margin-left: inherit;
    font-size: 17px;
    cursor: pointer;
}


.tableContainer .tableHead>tr>th.actions,
.tableContainer .tableBody>tr>td.actions {
    position: absolute;
    left: 0;
    cursor: default;
}
.tableContainer .tableBody>tr>td.actions {
    background-color: #fff;
    border-left: 1px solid #E4E4E4;
    cursor: default;
    text-align: center;
}
.tableContainer .tableBody>tr:nth-child(odd) {
    background-color: #F3F3F3;
}
.tableContainer .tableBody tr:hover {
    background-color: #DEF3B3 !important;
}
.tableContainer .tableHead>tr>th:first-child,
.tableContainer .tableBody>tr>td:first-child {
    margin-left: 155px;
}
.tableContainer.noAction .tableHead>tr>th:first-child,
.tableContainer.noAction .tableBody>tr>td:first-child {
    margin-left: 0;
}
.tableContainer.noAction .tableBody>tr>td:first-child {
    border-left: 1px solid #BAB7B7;
}
.tableContainer .tableHead>tr>th:last-of-type .tableResize{
    display: none;
}
.tableContainer.noAction .tableHead>tr>th:last-of-type .tableResize{
    display: inline-block;
}
.tableContainer  .contentTable>td.minHead,
.tableContainer  .tableHead>tr>th.minHead {
    width: 35px !important;
    padding: 1px 5px;
    text-align: center;
}
.tableContainer  .contentTable>td.title,
.tableContainer  .tableHead>tr>th.title {
    width: 250px;
}
.tableContainer  .contentTable>td.link,
.tableContainer  .tableHead>tr>th.link {
    width: 250px;
}
.tableContainer  .contentTable>td.actionLink,
.tableContainer  .tableHead>tr>th.actionLink {
    width: 415px;
}
.tableContainer  .contentTable>td.desc,
.tableContainer  .tableHead>tr>th.desc,
.tableContainer  .contentTable>td.url,
.tableContainer  .tableHead>tr>th.url {
    width: 160px;
}
.tableContainer  .tableHead>tr>th.sorting.asc,
.tableContainer  .tableHead>tr>th.sorting.desc {
    color: orange;
}

.tableContainer  .contentTable>td.type,
.tableContainer  .contentTable>td.date,
.tableContainer  .tableHead>tr>th.type,
.tableContainer  .tableHead>tr>th.date {
    width: 111px;
    min-width: 111px !important;
}

.tableContainer  .tableHead>tr>th.date .tableResize{
    display: none;
}

/*.tableContainer  .tableHead>tr>th:first-child .tableResize,*/
/*.tableContainer  .tableHead>tr>th.minHead:after {*/
/*display: none;*/
/*}*/

.type1 .tableHead>tr>th,
.type1 .contentTable>td {
    width: 155px;
    height: 30px;
    line-height: 26px;
    padding: 1px 5px 1px 10px;
    float: left;
    white-space: nowrap;
}
.type1.midHeight .tableHead>tr>th,
.type1.midHeight .contentTable>td {
    height: 44px;
    line-height: 44px;
}
.type1.midHeight .contentTable>td {
    text-align: center;
}
.type1 .tblHead>th.actions.midcus,
.type1 .contentTable>td.actions.midcus {
    width: 175px;
}
.type1 .tblHead th.channels,
.type1 .contentTable>td.channels {
    width: 200px;
    min-width: 115px !important;
}

.type1 .contentTable>td.channels {
    background: #fff;
    white-space: normal;
    line-height: 17px;
    text-align: center;
    padding: 0;
}
.type1 .contentTable>td.channels strong {
    background: #FFFFFF;
    color: #888484;
    display: block;
    padding: 6px 0;
    text-transform: uppercase;
    font-family: Arial;
    font-size: 12px;
}
/*.type1 .tableHead>tr>th:first-child,*/
/*.type1 .contentTable>td:first-child {*/
/*max-width: 60px;*/
/*}*/
.type2 .tableHead>tr>th,
.type2 .contentTable>td {
    /*background-color: #fff;*/
    width: 108px;
    height: 40px;
    line-height: 34px;
    padding: 2px 5px 2px 10px;
    float: inherit;
    white-space: nowrap;
}

.tableContainer .contentTable>td {
    /*border-left: 1px solid rgba(203, 203, 203, 0.52);*/
    border-left: 1px solid #FFFFFF;
    border-right: 1px solid #BAB7B7;
    overflow: hidden;
    border-top: 0;
}


.tableContainer .tableHead .tableResize {
    background: url("../../assets/img/handle.png") no-repeat 0 15px scroll transparent;
    position: absolute;
    right: -9px;
    top: 0;
    width: 16px;
    height: 42px;
    cursor: e-resize;
    z-index: 1;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
    opacity: 0;
    overflow: inherit;
}
.tableContainer .tableHead .tableResize:hover {
    opacity: 1;
}

.tableContainer .tableHead .headOption {
    /* background-color: red; */
    float: right;
    margin: 10px 0 0;
    /*position: relative;*/
    text-align: center;
    line-height: 20px;
    z-index: 1;
    cursor: pointer;
    font-weight: normal;
}

.tableContainer .tableHead .headOption:before {
    font-family: FontAwesome;
    content: '\f013';
    color: #fff;

}

.tableContainer .tableHead .wraphead {
    position: absolute;
    top: 100%;
    right: 0;
    background-color: #b4dbed;
    padding: 3px;
    overflow: auto !important;
    z-index: 10;
    min-width: 100px;
}

.tableContainer .tableHead .fa {
    position: absolute;
    top: -2px;
    left: 50%;
    margin-left: -5px;
    color: #b4d909;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
.tableContainer .tableHead .fa-sort-up {
    top:5px;
}



/*CHECKBOX SWITCH*/
.channelCont {
    /*border: 1px solid #ddd;*/
}
.channelList {
    border-bottom: 1px solid #ddd;
    line-height: 40px;
}

.logoChannel {
    background: #fff;
    width: 100%;
    height: 44px;
    overflow: hidden;
    float: left;
    text-align: center;
    margin: 0 0 5px 0;
    z-index: 99;
}
.mobGridTable .logoChannel {
    width: auto;
    height: 75px;
    text-align: left;
}
.mobGridTable .switch {
    margin-top: 25px !important;
}

.logoChannel img {
    max-width: 100%;
    max-height: 100%;
}
.channelList strong {
    margin-top: 5px;
    display: block;
}
.hoverChannels {
    position: relative;
    margin-right: 10px;
    cursor: wait;
}
/*.hoverChannels:hover .logoChannel {*/
/*display: block;*/
/*}*/



.switch {
    background-color: red;
    position: relative;
    display: block;
    vertical-align: top;
    height: 20px;
    padding: 3px;
    margin: 0 auto 3px auto;
    background: linear-gradient(to bottom, #eeeeee, #FFFFFF 25px);
    background-image: -webkit-linear-gradient(top, #eeeeee, #FFFFFF 25px);
    border-radius: 18px;
    box-shadow: inset 0 -1px white, inset 0 1px 1px rgba(0, 0, 0, 0.05);
    cursor: pointer;
}
.switch.channel {
    width: 59px;
    margin: 9px auto 3px auto;
}
.switch.compared {
    width: 118px;
    margin: -4px auto 3px auto;
}
.switch-input {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
}
.switch-label {
    position: relative;
    display: block;
    height: inherit;
    font-size: 10px;
    text-transform: uppercase;
    background: #eceeef;
    border-radius: inherit;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.15);
}
.switch-label:before, .switch-label:after {
    position: absolute;
    top: 50%;
    margin-top: -.5em;
    line-height: 1;
    -webkit-transition: inherit;
    -moz-transition: inherit;
    -o-transition: inherit;
    transition: inherit;
}
.switch-label:before {
    content: attr(data-off);
    right: 11px;
    color: #aaaaaa;
    text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}
.switch-label:after {
    content: attr(data-on);
    left: 11px;
    color: #FFFFFF;
    text-shadow: 0 1px rgba(0, 0, 0, 0.2);
    opacity: 0;
}
.switch-input:checked ~ .switch-label {
    background: #85AB15;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 0 3px rgba(0, 0, 0, 0.2);
}
.long.switch-input:checked ~ .long.switch-label {
    background: #BE0606;
}
.switch-input:checked ~ .switch-label:before {
    opacity: 0;
}
.switch-input:checked ~ .switch-label:after {
    opacity: 1;
}
.switch-handle {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 17px;
    height: 17px;
    background: linear-gradient(to bottom, #FFFFFF 40%, #f0f0f0);
    background-image: -webkit-linear-gradient(top, #FFFFFF 40%, #f0f0f0);
    border-radius: 100%;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
}
.switch-handle:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -6px 0 0 -6px;
    width: 12px;
    height: 12px;
    background: linear-gradient(to bottom, #eeeeee, #FFFFFF);
    background-image: -webkit-linear-gradient(top, #eeeeee, #FFFFFF);
    border-radius: 6px;
    box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);
}
.switch-input:checked ~ .switch-handle {
    left: 38px;
    box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}
.long.switch-input:checked ~ .long.switch-handle {
    left: 96px;
    box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

/* Transition
========================== */
.switch-label, .switch-handle {
    transition: All 0.3s ease;
    -webkit-transition: All 0.3s ease;
    -moz-transition: All 0.3s ease;
    -o-transition: All 0.3s ease;
}


/*LIST EXPORT*/
.listExport a {
    /*background: #F1F1F1;*/
    width: 200px;
    height: 120px;
    border: 1px solid #ddd;
    color: #555;
    margin: 10px 5px;
    text-align: center;
    overflow: hidden;
    font-weight: bold;
    display: inline-block;
    position: relative;
}
.listExport a img {
    max-width: 100%;
    max-height: 100%;
    margin-bottom: 5px;
    display: block;
}
.listExport a span {
    background: #EFEFEF;
    padding: 5px 10px;
    border-top: 1px solid #ddd;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
}
.listExport a:hover span {
    background: #006900;
    color: #fff;
}













.bHeaderTop .top {
    height: 42px;
    font-size: 25px;
    padding: 5px;
    min-width: 300px;
    /*height: 60px;*/
    /*background-color: #ffffff;*/
    /*position: fixed;*/
    /*width: 100%;*/
    /*top: 0;*/
    /*z-index: 1040;*/
    /*box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16);*/
}

.bHeaderTop .bottom {
    height: 84px;
    background: white;
    padding-top: 2px;
    min-width: 200px;
    margin-top: 70px;
}

.bHeaderTop .bottom .searchContent {
    /*padding: 5px 0 5px 10px;
    border: 1px solid #ECECEC;*/
    /*margin-left: 255px;*/
    /*margin-top: 2px;
    margin-right: 3px;*/
}

.bHeaderTop .bottom .searchContent .breadcumb {
    color: rgb(111, 105, 105);
    margin-left: 11px;
    font-size: 14px;
}

.bHeaderTop .bottom .searchContent .breadcumb .active {
    font-weight: bold;
}








/*SECTION CONTAINER*/
.main-container {
    padding: 60px 15px 50px 15px;
    border-bottom: 1px solid #C3C3C3;
    min-height: 580px;
}
.container-fluid {
    opacity: 0;
}

.leftbar-view .main-container {
    margin-left: 250px;
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
}

.leftbar-view.left-aside-toggle .leftbar {
    -webkit-transform: translate(-250px, 0) !important;
    -moz-transform: translate(-250px, 0) !important;
    -o-transform: translate(-250px, 0) !important;
    -ms-transform: translate(-250px, 0) !important;
    transform: translate(-250px, 0) !important;
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
}

.leftbar-view.left-aside-toggle .main-container {
    margin-left: 0px !important;
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
}

/*BREADCUMB*/
.page-header {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e9e9ce+0,fcfff4+100 */
    background: rgb(233,233,206); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(233,233,206,1) 0%, rgba(252,255,244,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(233,233,206,1)), color-stop(100%,rgba(252,255,244,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(233,233,206,1) 0%,rgba(252,255,244,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(233,233,206,1) 0%,rgba(252,255,244,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(233,233,206,1) 0%,rgba(252,255,244,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(233,233,206,1) 0%,rgba(252,255,244,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e9e9ce', endColorstr='#fcfff4',GradientType=0 ); /* IE6-9 */

    /*background: #fff;*/
    padding: 10px;
    border-bottom: 0;
    margin: 0;
    margin-bottom: 15px;
    border-bottom: 1px solid #D4D3D3;
}

.page-header.full-block {
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    border-radius: 0 !important;
    margin-left: -30px;
    margin-right: -30px;
    margin-top: 0;
    padding: 10px 15px;
}

.page-header h1, .page-header h2, .page-header h3, .page-header h4, .page-header h5, .page-header h6 {
    font-family: oswald;
    color: #555;
    margin-left: 20px;
    font-size: 18px;
    font-weight: bold;
}

.page-header h2,
.page-header label {
    font-family: oswald;
    margin: 5px 0 3px;
    color: #555555;
}
.page-header select {
    max-height: 300px;
    overflow: auto;
}
.page-header .list-page-breadcrumb {
    margin: 0;
    padding: 0;
}

.page-header .viewListProduct {
    color: #000;
    float: right;
    list-style: none;
}
.page-header ul.viewListProduct li {
    font-weight: bold;
    text-align: right;
    font-size: 12px;
}
.page-header ul.viewListProduct li p {
    margin: 0 0 5px;
    font-weight: normal;
}
.page-header ul.viewListProduct li a {
    clear: both;
    background: green;
    color: #fff;
    padding: 2px 5px;
    font-weight: normal;
    font-size: 12px;
    border-radius: 3px;
    margin-left: 15px;
    text-decoration: none;
}


.page-header .list-page-breadcrumb li {
    list-style: none;
    display: inline-block;
    font-size: 12px;
}

.page-header .list-page-breadcrumb li a {
    color: #009FFF;
}
.page-header .list-page-breadcrumb li:first-child a:before {
    font-family: FontAwesome;
    content: '\f015';
    margin-right: 3px;
}

.formContent, .listContent {
    background: #fff;
    border-bottom: 2px solid #7C9E08;
    margin-bottom: 30px;
    padding: 15px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
.boxHeader {
    border-bottom: #eee 1px solid;
    padding: 0 15px 10px;
    margin: auto -15px 10px;
}
.boxHeader .hlp {
    color: #BDB9B9;
    cursor: pointer;
    text-decoration: none;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.boxHeader .hlp:focus,
.boxHeader .hlp:focus {
    color: #79B308;
}

.boxHeader h1, .boxHeader h2, .boxHeader h3, .boxHeader h4, .boxHeader h5, .boxHeader h6, .boxWall h3 {
    margin-top: 0;
    margin-bottom: 0;
    font-family: Oswald;
    font-size: 16px;
    text-transform: uppercase;
    display: inline-block;
    color: #016901;
}

.boxContent {
    min-height: 100px;
    min-width: 175px;
    /*padding: 10px;*/
    background: white;
    /*overflow: hidden;*/
    /*border-bottom: solid 1px #B72018;*/
    /*border-top: solid 1px #B72018;*/
}
.boxContent.mobType {
    /*display: none;*/
}
.boxContent.mobType .srcGrid {
    padding: inherit;
    float: none;
}
.boxContent.mobType .srcGrid div {
    margin: 0 5px 5px 0;
    float: left;
}
.relative {
    position: relative;
}
.boxContent.mobType .srcGrid .fa {
    position: absolute;
    right: 0;
    background: #71A705;
    border: 1px solid #649306;
    color: #fff;
    width: 35px;
    height:  30px;
    line-height: 30px;
    text-align: center;
    margin: 0 0 0 -4px;
    border-radius: 0 3px 3px 0;
    cursor: pointer;
    display: inline-block;
}

.boxBottom {
    text-align: right;
    border-top: 1px solid #E1E1E1;
    margin: 0 -15px -15px;
    padding: 10px 30px;
}

/*.formContent .boxContent .tableCanvas {*/
/*overflow-x: auto;*/
/*}*/

/*.formContent .boxContent table {*/
/*border: 1px solid #ddd;*/
/*width: 100%;*/
/*min-width: 768px;*/
/*}*/

/*.formContent .boxContent table tr:nth-of-type(even) {*/
/*background-color: #F1F1F1;*/
/*}*/

/*.formContent .boxContent table th {*/
/*padding: 8px;*/
/*border-left: 1px solid #ddd;*/
/*/!*min-width: 100px;*!/*/
/*}*/

/*.formContent .boxContent table td {*/
/*padding: 8px;*/
/*border-top: 1px solid #ddd;*/
/*border-left: 1px solid #ddd;*/
/*}*/

/*.formContent .boxContent table td:nth-child(1), .formContent .boxContent table th:nth-child(1) {*/
/*border-left: none;*/
/*}*/

.boxFooter {
    margin-bottom: 0px;
    padding: 7px 5px 7px 5px;
    height: 40px;
    color: white;
    background: rgb(145, 18, 18); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(145, 18, 18, 1) 0%, rgba(178, 23, 23, 1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(145, 18, 18, 1)), color-stop(100%, rgba(178, 23, 23, 1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(145, 18, 18, 1) 0%, rgba(178, 23, 23, 1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(145, 18, 18, 1) 0%, rgba(178, 23, 23, 1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(145, 18, 18, 1) 0%, rgba(178, 23, 23, 1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(145, 18, 18, 1) 0%, rgba(178, 23, 23, 1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#911212', endColorstr='#b21717', GradientType=0); /* IE6-9 */

}

.showHideBoxIcon {
    float: right;
    padding-top: 2px;
    padding-right: 10px;
}

.srcGrid {
    padding: 0 0 10px;
    /*margin-left: 10px;*/
}


/*FORM CONTROL*/
.form-control {
    /*height: 30px;*/
    font-size: 13px;
    margin-bottom: 5px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    outline: none;
}

.searchControl {
    padding: 0 0 10px;
    float: left;
    display: flex;
    position: relative;
}
.searchControl input {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}
.searchControl .filterBtn {
    background: #016901;
    border: 1px solid #3B880E;
    color: #fff;
    /*width: 35px;*/
    font-size: 13px;
    height: 30px;
    line-height: 25px;
    text-align: center;
    margin: 0 0 0 5px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    cursor: pointer;
    display: inline-block;
}
.searchControl .filterBtn:before {
    font-family: FontAwesome;
    content: '\f002';
    margin-right: 5px;
}

.searchControl .filterExport {
    background: #026594;
    border: 1px solid #026594;
    color: #fff;
    /*width: 35px;*/
    font-size: 13px;
    height: 30px;
    line-height: 25px;
    text-align: center;
    margin: 0 0 0 5px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    cursor: pointer;
    display: inline-block;
	padding: 2px 10px;
}

.searchControl .filterExport  a:hover{
	text-decoration:none;
}

.searchControl .filterExport:before{
	font-family: FontAwesome;
    content: '\f1c3';
    margin-right: 5px;
}

.srcGrid select {
    background: #FBFDDC;
    min-width: 100px;
    width: auto;
    color: grey;
    padding: 3px;
    display: inline-block;
    border-radius: 2px;
    float: left;
    margin-right: 5px;
}

.srcGrid input[type='text'] {
    background: #FBFDDC;
    padding: 5px 40px 5px 5px;
    display: inline-block;
    width: auto;
    min-width: 220px;
}

.srcGrid input[type='button'] {
    padding: 5px;
    display: inline-block;
    width: auto;
}


.input-daterange input {
    height: 30px;
    border-right: 0;
    border-left: 0;
}
.input-daterange .input-group-addon,
.input-group  .input-group-addon {
    padding: 0 5px;
}
/*.input-group-addon:first-child {*/
/*border-right: 1px solid #ddd;*/
/*}*/
/*.input-group-addon:last-child {*/
/*border-right: 1px solid #ddd;*/
/*}*/




#makerForm,
#seriesForm {
    display: block;
    background: #F3F6C3;
    padding: 10px 0;
    margin: 10px 10px 0;
    display: none;
}


.borTop {
    border-top: 1px solid #DDDDDD;
    margin: 10px 0;
}

/*PAGGING CUSTOMS*/
/*div[class^='paging'] {*/
.pagingCustom {
    float: right;
    display: inline-block;
    font-size: 12px;
}
.pagingCustom input[type='text']{
    width: 50px;
    text-align: center;
    margin-right: 25px;
}

.pagingCustom a {
    background: #F3F3F3;
    color: #696969;
    font-weight: bold;
    display: inline-block;
    margin: 0 2px;
    padding: 0 7px;
    border: 1px solid #DDD;
    /*border-bottom: 2px solid #D5D6D3;*/
    cursor: pointer;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -webkit-transition: 5ms;
    -moz-transition: 5ms;
    -ms-transition: 5ms;
    -o-transition: 5ms;
    transition: 3ms;
    text-decoration: none;
}
.pagingCustom a:hover {
    background: #fff;
    color: #000;
}
.pagingCustom a.active {
    background: #006900;
    border: 1px solid #006900;
    color: #fff;
}

.pagingCustom a.icoFirst:before,
.pagingCustom a.icoBack:before,
.pagingCustom a.icoNext:before,
.pagingCustom a.icoLast:before {
    font-family: FontAwesome;
}
.pagingCustom a.icoFirst:before {content: '\f049'}
.pagingCustom a.icoBack:before {content: '\f04a'}
.pagingCustom a.icoNext:before {content: '\f04e'}
.pagingCustom a.icoLast:before {content: '\f050'}


.icotabs li a {
    color: #555;
    padding: 6px 6px;
}
.icotabs li a:before,
.icotabs li:first-child a:before {
    font-family: FontAwesome;
    margin-right: 5px;
    color: #555;
}
.icotabs li a:before  {
    content: '\f024';
}
.icotabs li:first-child a:before {
    content: '\f007';
}
.icotabs li:nth-last-child(2) a:before {
    content: '\f084';
}


.tab-content .boxList {
    background: #F1F1F1;
    border: 1px solid #ddd;
    color: #555;
    margin: 10px 0;
    padding-bottom: 20px;
}
.tab-content .boxList2{
    color: #555;
    padding-bottom: 20px;
    padding-top: 10px;
}
.tab-content .boxList2 h4 {
    padding: 0 0 10px;
    border-bottom: 1px solid #ddd;
    font-family: Oswald;
    font-weight: normal;
}
.tab-content .boxList .form-header {
    background: #fff;
    /*height: 100px;*/
    text-align: center;
    /*border-bottom: 1px solid #ddd;*/
    margin: 0 -15px 10px;
    overflow: hidden;
}
.tab-content .boxList .form-header img {
    max-height: 100%;
}


/*VALIDATE CUSTOM*/
.field-mandatory label i {
    font-weight: bold;color: red;
}
.validateCustom .msgVal {
    display: block;
    font-size: 12px;
    color: red;
    font-style: italic;
    font-weight: normal;
}



div[class^='pageLable'] {
    /*padding-top: 10px;*/
    display: inline-block;
    font-size: 12px;
}

div[id^='imagePreviewfImage'] img {
    width: 100%;
}

.logout {
    cursor: pointer;
}


/*INLINE CUT HERE*/
.listAutocomplete {
    padding: 5px;
    border-bottom: dashed 1px #E4E4E4;
}



.list-title {
    text-align: center !important;
    color: #fff !important;
    font-weight: bold !important;
}
.list-title > a {
    background: #006900 !important;
    font-size: 12px !important;
    border: 0 !important;
    display: table !important;
    padding: 3px 8px !important;
    margin: 10px auto 5px !important;
    text-align: center !important;
    color: #fff !important;
    border-radius: 3px !important;
    text-transform: capitalize;
    font-weight: normal;
}
.list-title > a:after {
    display: none !important;
}

.p0 {
    padding: 0 !important;
}
.pLR0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.mB0 {margin-bottom: 0 !important;}
.mB5 {margin-bottom: 5px !important;}
.mT10 {margin-top: 10px !important;}
.mT15 {margin-top: 15px !important;}
.mB15 {margin-bottom: 15px !important;}
.mB40 {margin-bottom: 40px !important;}
.pT15 {padding-top: 15px !important;}






/*FOOTER CONT*/
.footer {
    background: #F3F3F3;
    font-size: 11px;
    border-top: 1px solid #FFF;
    height: 40px;
    line-height: 20px;
    padding: 0 15px;
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    margin-left: 250px;
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);;
}
.footer p {
    margin-top: 10px !important;
}
.left-aside-toggle .footer {
    margin-left: 0;
}
/*.left-aside-toggle .left-toggle-switch .fa {*/
/*margin-left: 0;*/
/*}*/




/*WIDGET & GRAPH*/
.widget-wrap {
    background: #fff;
    padding: 10px 0;
    margin-bottom: 10px;
    border-bottom: 2px solid #7C9E08;
}








/*ALL FORM CONTENT*/
/*FILE*/
.fileUpload {
    background: #FFFFFF;
    height: 41px;
    position: relative;
    overflow: hidden;
    padding: 10px;
    border-radius: 3px;
    border: 1px solid #CCC;
    box-shadow: 0 1px 4px -1px #ddd inset;
}
.boxList2 .fileUpload {
    height: 40px;
}
.fileUpload span {
    background-color: #016901;
    color: #fff;
    height: 31px;
    line-height: 31px;
    outline: none;
    position: absolute;
    top: 4px;
    padding: 0 10px;
    margin: 0 4px;
    border-radius: 2px;
    cursor: pointer;
    z-index: 1;
}
.boxList2 .fileUpload span {
    height: 34px;
    line-height: 33px;
    top: 2px;
    left: 0;
}
.fileUpload small {
    height: 35px;
    line-height: 35px;
    margin-left: 83px;
    position: absolute;
    font-size: 13px;
    top: 2px;
    left: 0;
    right: 5px;
}
.fileUpload input.upload {
    background-color: #17bab8;
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
}

.formLabel {
    font-weight: normal;
    display: block;
    margin-top: 3px;
}
.formLabel i {
    margin-left: 5px;
    margin-top: 4px;
    float: right;
    margin-right: -20px;
    padding: 2px;
    border-radius: 20px;
    cursor: pointer;
}

.labelPembayaran {
	width:100px;
	text-align:center;
}


.overSpin {
    background: rgb(255, 255, 255);
    position: fixed;
    top: 55px;
    left: 250px;
    right: 0;
    bottom: 0;
    z-index: 99;
    display: none;
}
.overSpin h2 {
    color: #026A02;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -20px 0 0 -50px;
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s;
}
.left-aside-toggle .overSpin {
    left: 0;
}
/*SPINNER CUSTOM*/
.sk-spinner-cube-grid.sk-spinner {
    width: 50px;
    height: 50px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -80px 0 0 -15px;
}
.sk-spinner-cube-grid .sk-cube {
    width: 33%;
    height: 33%;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    background-color: #026A02;
    float: left;
    -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
    animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
}
.sk-spinner-cube-grid .sk-cube:nth-child(1) {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
}
.sk-spinner-cube-grid .sk-cube:nth-child(2) {
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s;
}
.sk-spinner-cube-grid .sk-cube:nth-child(3) {
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
}
.sk-spinner-cube-grid .sk-cube:nth-child(4) {
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s;
}
.sk-spinner-cube-grid .sk-cube:nth-child(5) {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
}
.sk-spinner-cube-grid .sk-cube:nth-child(6) {
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s;
}
.sk-spinner-cube-grid .sk-cube:nth-child(7) {
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
}
.sk-spinner-cube-grid .sk-cube:nth-child(8) {
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s;
}
.sk-spinner-cube-grid .sk-cube:nth-child(9) {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
}
@-webkit-keyframes sk-cubeGridScaleDelay {
    0%,
    70%,
    100% {
        -webkit-transform: scale3D(1, 1, 1);
        transform: scale3D(1, 1, 1);
    }
    35% {
        -webkit-transform: scale3D(0, 0, 1);
        transform: scale3D(0, 0, 1);
    }
}
@keyframes sk-cubeGridScaleDelay {
    0%,
    70%,
    100% {
        -webkit-transform: scale3D(1, 1, 1);
        transform: scale3D(1, 1, 1);
    }
    35% {
        -webkit-transform: scale3D(0, 0, 1);
        transform: scale3D(0, 0, 1);
    }
}

/*ICON BUTTON*/
.icoAdd:before,
.icoNew:before,
.icoSave:before,
.icoCancel:before,
.icoRemove:before,
.icoLog:before,
.icoBack:before,
.icoChange:before,
.icoEdit:before,
.icoChangePass:before,
.icoSearch:before,
.icoDownload:before,
.icoBefore:before,
.icoSignOut:before {
    font-family: FontAwesome;
    margin-right: 5px;
    font-size: 13px;
}
.icoAdd:before,
.icoNew:before {
    content: '\f067';
}
.icoSearch:before {
    content: '\f002';
}
.icoSignOut:before {
    content: '\f08b';
}
.icoLog:before {
    content: '\f090';
}
.icoDownload:before {
    content: '\f019';
}
.icoEdit:before {
    content: '\f044';
}
.icoChangePass:before {
    content: '\f019';
}
.icoBefore:before {
    content: '\f060';
}
.icoSave:before {
    content: '\f0c7';
}
.icoCancel:before,
.icoBack:before {
    content: '\f05e';
}
.icoRemove:before {
    content: '\f1f8';
}
.icoChange:before {
    content: '\f040';
}


.line {
    border-bottom: 1px dashed #ddd;
}
.boxWall {
    border: 1px solid #ddd;
    margin: 15px 0 30px;
}
.boxWall h3 {
    display: block;
    border-bottom: 1px solid #ddd;
    padding: 10px 10px;
}
.boxWall .lists{
    padding: 5px 0 0;
}
.boxWall .lists:last-child .line {
    border-bottom: 0;
    margin-bottom: 0;
}
.boxWall .lists:hover {
    background: #f5ffe1;
}

.boxWall form {
    margin: 10px 0 15px;
}

.gridInfo {
    font-size: 13px;
}
.gridInfo small {
    display: block;
    color: dodgerblue;
    font-weight: bold;
}
.gridInfo .side:nth-last-child(2) {
    border-left: 1px solid #ddd;
}

.permmisions p:before {
    font-family: FontAwesome;
    content: '\f00c';
    margin-right: 5px;
    font-weight: bold;
    color: green;
}

.userProfile.imgBox {
    background: #E4E4E4;
    width: 170px;
    height: 160px;
    margin: 0 10px 20px 0;
    border: 1px solid #ddd;
    /* border-radius: 90px; */
    padding: 0;
    text-align: center;
    overflow: hidden;
    float: left;
}
.boxList .userProfile.imgBox {
    width: 100%;
    height: 220px;
    padding: 15px;
}
.borLines {
    border-bottom: 1px solid #ddd;
    display: block;
    margin-bottom: 15px;
}

.userProfile.imgBox img {
    margin: 0 auto;
    max-width: 100%;
    max-height: 100%;
}



/*BUTTON CUSTOM*/
.btn {
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.btn.btn-xs {
    padding: 2px 5px !important;
}
.btn.btn-sm {
    padding: 5px 10px;
}
.btn.btn-md {
    padding: 10px;
}

.btnSoftgreen {
    background: #006900;
    color: #fff;
}
.btnSoftgreen:hover, .btnSoftgreen:active:hover, .btnSoftgreen:focus {
    background: #008400;
    outline: none;
    color: #fff;
}
.btnSoftgreen:active {
    background-color: #79B308;
    background-image: -webkit-radial-gradient(circle, #79B308 10%, #79B308 11%);
    background-image: radial-gradient(circle, #79B308 10%, #79B308 11%);
    background-repeat: no-repeat;
    background-size: 1000%;
}


.btnDarkgreen {
    background-color: #0e6f6e;
    color: #fff;
}
.btnDarkgreen:hover, .btnDarkgreen:active:hover, .btnDarkgreen:focus {
    background-color: #119e9d;
    outline: none;
    color: #fff;
}
.btnDarkgreen:active {
    background-color: #108180;
    background-image: -webkit-radial-gradient(circle, #108180 10%, #139c9b 11%);
    background-image: radial-gradient(circle, #108180 10%, #139c9b 11%);
    background-repeat: no-repeat;
    background-size: 1000%;
}

.btnDarkpurple {
    background-color: #3756C7;
    color: #fff;
}
.btnDarkpurple:hover, .btnDarkpurple:active:hover, .btnDarkpurple:focus {
    background-color: #4261fd;
    outline: none;
    color: #fff;
}
.btnDarkpurple:active {
    background-color: #4566ff;
    background-image: -webkit-radial-gradient(circle, #405ff4 10%, #3756C7 11%);
    background-image: radial-gradient(circle, #405ff4 10%, #3756C7 11%);
    background-repeat: no-repeat;
    background-size: 1000%;
}


.btnDarkorange {
    background: #EA9904;
    color: #FFF;
}
.btnDarkorange:hover, .btnDarkorange:active:hover, .btnDarkorange:focus {
    background-color: #f19e04;
    outline: none;
    color: #fff;
}
.btnDarkorange:active {
    background-color: #EA9904;
    background-image: -webkit-radial-gradient(circle, #AFA902 10%, #d3cd02 11%);
    background-image: radial-gradient(circle, #AFA902 10%, #d3cd02 11%);
    background-repeat: no-repeat;
    background-size: 1000%;
}


.btnDarkyellow {
    background-color: #AFA902;
    color: #fff;
}
.btnDarkyellow:hover, .btnDarkyellow:active:hover, .btnDarkyellow:focus {
    background-color: #d3cd02;
    outline: none;
    color: #fff;
}
.btnDarkyellow:active {
    background-color: #d3cd02;
    background-image: -webkit-radial-gradient(circle, #AFA902 10%, #d3cd02 11%);
    background-image: radial-gradient(circle, #AFA902 10%, #d3cd02 11%);
    background-repeat: no-repeat;
    background-size: 1000%;
}


.btnDarkred {
    background: #F55151;
    color: #fff;
}
.btnDarkred:hover, .btnDarkred:active:hover, .btnDarkred:focus {
    background: #ff807d;
    outline: none;
    color: #fff;
}
.btnDarkred:active {
    background-color: #DC0303;
    background-image: -webkit-radial-gradient(circle, #D81818 10%, #DC0303 11%);
    background-image: radial-gradient(circle, #D81818 10%, #DC0303 11%);
    background-repeat: no-repeat;
    background-size: 1000%;
}


.btnDarkcyan {
    background: #04A9A9;
    color: #fff;
}

.btnDarkcyan:hover, .btnDarkcyan:active:hover, .btnDarkcyan:focus {
    background: #05bbbb;
    outline: none;
    color: #fff;
}

.btnDarkcyan:active {
    background-color: #049eaf;
    background-image: -webkit-radial-gradient(circle, #04B2C5 10%, #04B2C5 11%);
    background-image: radial-gradient(circle, #04B2C5 10%, #04B2C5 11%);
    background-repeat: no-repeat;
    background-size: 1000%;
}




.tooltip-inner {
    max-width: 350px;
    /* If max-width does not work, try using width instead */
    /*width: 350px;*/
}

.amountprice {
    text-align: right;
}





/*ANIMATION*/
.bounce {
    -webkit-animation: bobber 1.5s infinite;
    -moz-animation: bobber 1.5s infinite;
    animation: bobber 1.5s infinite;

}



@media (max-width: 1200px) {
    .gridInfo .side:nth-last-child(2) {
        border-left: 0;
    }
}
@media (max-width: 1000px) {
    .leftbar-view .leftbar {
        -webkit-transform: translate3d(-250px, 0, 0);
        transform: translate3d(-250px, 0, 0);
    }

    .leftbar-view .main-container {
        margin-left: 0;
    }
    .overSpin {
        left: 0;
    }
    .formLabel i {
        margin-right: 0;
        float: none;
    }

}

@media (max-width: 768px) {
    .mobGridTable .logoChannel {
        text-align: center;
        float: none;
        display: inline-block;
        width: 125px;
        height: auto;
    }
    .switch.channel {
        margin: 18px 0 0 !important;
        display: inline-block;
        float: right;
    }
    .page-header .viewListProduct {
        float: left;
        padding-left: 0;
    }
    .page-header ul.viewListProduct li p {
        text-align: left;
    }
    .footer {
        text-align: center !important;
        position: static;
        margin-left: 0;
        height: auto;
        padding: 5px 15px;
    }
    .pagingCustom a {
        padding: 5px 10px;
    }
    .table.mini tbody td.show span.title {
        padding: 13px 11px;
        margin-right: 50px;
    }
    .table.mini tbody td.show span.title.checkboxs {
        padding-left: 30px;
    }
    .toggles {
        width: 50px;
        min-height: 45px;
        line-height: 45px;
    }
    .table.mini tbody td.show {
        min-height: 45px;
    }
    .list-accordion > li > a {
        padding: 15px 15px;
    }
    .pageLable1 {
        display: block !important;
        text-align: center;
        margin-top: 5px;
    }
    .pagingCustom {
        float: none;
        display: block;
        margin: 5px auto 0;
        text-align: center;
        font-size: 12px;
    }
    .mobGridTable .conditions {
        margin: 5px 0;
        display: block;
    }
    .page-header .listprod {
        background: #fff;
        padding: 5px 10px;
        margin-bottom: -10px;
        border-top: 1px dashed #B5B3B3;
    }
    .boxContent a.btn {
        padding: 5px 10px;
        display: inline-block;
        float: none !important;
        margin-bottom: 10px;
    }
    .srcGrid {
        float: none;
        display: block;
    }
}
@media (max-width: 640px) {
    .separate {display: none}
    .table.mini tbody td.active .children .head,
    .table.mini tbody td.active .children .val {
        width: 100%;
        display: block;
        float: none;
    }
    .srcGrid select {
        margin-bottom: 5px
    margin-right: 0;
    }
}
@media (max-width: 480px) {
    .separate {display: none}
    .table.mini tbody td.active .children .head,
    .table.mini tbody td.active .children .val {
        width: 100%;
        display: block;
        float: none;
    }
    .srcGrid select {
        width: 100%;
        margin-bottom: 5px
    }
    .searchControl {
        width: 100%;
    }
    .srcGrid input[type='text'] {
        width: 100%;
    }
}