﻿
@import url("https://fonts.googleapis.com/css?family=Montserrat:400,700");


/*
 *
 *   INSPINIA - Responsive Admin Theme
 *   version 2.4
 *
*/
/**************Global setting css start******************/
li.arrow-menu {
    width: 190px;
}
label {
    color: #333;
    font-size: 14px;
    margin: 0;
    padding-top: 4px;
    font-weight: 400;
    font-family: Arial,sans-serif
}

.control-label {
    float: right;
    padding-right: 0;
    direction: rtl;
}

input[type="text"], input[type="date"], input[type="name"], input[type="email"], input[type="password"], textarea, select {
    height: 28px !important;
    border: 1px solid #ccc ;
    border-radius: 4px;
    padding-top: 0;
    padding-bottom: 0;
    color: #333;
    text-align: right;
    direction: rtl;
}

.dx-placeholder {
    color: #333
}

input:focus, textarea:focus, .dx-texteditor.dx-state-focused, .dx-texteditor.dx-state-active, .dx-state-hover, select:focus {
    border-color: #1ab394 !important;
    outline: none
}

.dx-texteditor.dx-state-readonly {
    border-color: #ccc !important;
    border: 0
}

.dx-texteditor {
    border: 0 !important
}

.dx-texteditor-container {
    overflow: inherit !important
}

.light-blue {
    background: #c7ebfd;
    border: 1px solid #ccc;
    padding: 0 5px;
    color: #000;
    border-radius: 4px
}

a {
    cursor: pointer
}

    a:hover, a:focus {
        text-decoration: none
    }

.clear {
    clear: both;
}
/**************Global setting css end******************/
/* BACKGROUNDS */
.gray-bg {
    background-color: #efefef;
}

.white-bg {
    background-color: #ffffff;
}
/* COLORS */
.text-navy {
    color: #1ab394
}

.text-primary {
    color: inherit
}

.text-success {
    color: #1c84c6
}

.text-info {
    color: #23c6c8
}

.text-warning {
    color: #f8ac59
}

.text-danger {
    color: #ed5565
}

.text-muted {
    color: #888
}

.text-white {
    color: #fff
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 100
}

h1 {
    font-size: 30px
}

h2 {
    font-size: 24px
}

h3 {
    font-size: 16px
}

h4 {
    font-size: 14px
}

h5 {
    font-size: 12px
}

h6 {
    font-size: 10px
}

h3, h4, h5 {
    margin-top: 5px;
    font-weight: 600
}
/**********Home page css start*******************/
.homepage-content {
    padding: 0;
    float: right;
    width: 100%
}

.about-top {
    text-align: right
}

h4.main-head {
    font-size: 16px;
    text-transform: uppercase;
    position: relative;
    margin: 0
}

    h4.main-head:after {
        content: '';
        position: absolute;
        width: 50px;
        height: 3px;
        background: #676a6c;
        bottom: -8px;
        right: 0
    }

.about-info {
    padding-right: 0
}

.about-left {
    width: 200px;
    height: 200px;
    overflow: hidden;
    float: right
}

.about-right {
    padding-right: 220px
}

    .about-right p {
        font-size: 15px;
        margin: 0 0 10px 0
    }

.services-top {
    float: right;
    width: 100%;
    margin: 15px 0
}

.service-box a {
    display: inline-block;
    vertical-align: top;
    position: absolute;
    width: 115px;
    right: 0;
    top: 0;
}

.service-box {
    text-align: right;
    position: relative;
}

.service-in {
    float: right;
    width: 100%;
    margin-top: 22px;
    background: #f5f5f5;
    padding: 25px 15px;
}

.service-info {
    padding: 0 130px 0 0;
    display: inline-block;
    vertical-align: top;
}

    .service-info h5 {
        color: #147cc6;
        font-size: 16px;
        margin: 0 0 5px 0;
        font-weight: 600
    }

    .service-info p {
        font-size: 14px;
        margin-bottom: 10px;
        height: 100px;
        overflow: hidden;
    }

.read-btn {
    background: #9acde2;
    background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
    border: 0;
    color: #fff;
    border-radius: 3px;
    padding: 4px 10px 2px 10px;
    font-size: 12px;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s
}

    .read-btn:hover, .read-btn:focus {
        outline: none;
        background: #147cc6;
        background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: -webkit-linear-gradient(top,#147cc6 0%,#43aedf 100%);
        background: linear-gradient(to bottom,#147cc6 0%,#43aedf 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
    }

.footer-top {
    border-top: 1px solid #e7eaec;
    float: right;
    width: 100%;
    padding: 10px 0 0 0
}

.footer-box {
    padding: 0 0 0 50px
}

    .footer-box h4 {
        color: #676a6c;
        font-size: 16px;
        margin: 0 0 10px 0
    }

    .footer-box p {
        font-size: 14px;
        margin-bottom: 10px
    }

ul.contact-list {
    list-style: none;
    float: right;
    margin: 0;
    padding: 0
}

    ul.contact-list li {
        float: right;
        width: 100%
    }

        ul.contact-list li strong {
            float: right;
            margin-left: 10px
        }

.sign-up {
    width: 360px
}

    .sign-up .btn-default {
        border-radius: 0
    }

    .sign-up .form-control:focus {
        border: 1px solid #e5e6e7 !important
    }

.service-box img {
    width: 100%;
}
/**********Home page css end*******************/

/**********Navigation css start**************/
.navi {
    padding: 4px 0 3px 0;
    border-top: 1px solid #f4f4f4;
    border-bottom: 1px solid #f4f4f4
}

.nav > li > a {
    color: #a7b1c2;
    font-weight: 600;
    padding: 14px 20px 14px 25px
}

.nav.navbar-right > li > a {
    color: #999c9e;
    min-height: inherit;
    padding: 0
}

.navbar-static-top {
    padding: 0px 5px 3px 5px;
    min-height: inherit;
}

.nav > li.active > a {
    color: #fff
}

.navbar-default .nav > li > a:hover, .navbar-default .nav > li > a:focus {
    background-color: #0869aa;
    color: white
}

.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
    background: #fff
}

.nav.navbar-top-links > li > a:hover, .nav.navbar-top-links > li > a:focus {
    background-color: transparent
}

.nav > li > a i {
    margin-right: 6px
}

.dropdown-menu {
    border: medium none;
    border-radius: 3px;
    box-shadow: 0 0 3px rgba(86,96,117,.7);
    display: none;
    float: left;
    font-size: 12px;
    left: inherit;
    right: 0;
    list-style: none outside none;
    padding: 0;
    position: absolute;
    text-shadow: none;
    top: 100%;
    z-index: 1000
}

    .dropdown-menu > li > a {
        border-radius: 3px;
        color: inherit;
        line-height: 25px;
        margin: 4px;
        text-align: left;
        font-weight: 400
    }

        .dropdown-menu > li > a.font-bold {
            font-weight: 600
        }

.navbar-top-links .dropdown-menu li {
    display: block
}

    .navbar-top-links .dropdown-menu li:last-child {
        margin-right: 0
    }

    .navbar-top-links .dropdown-menu li a {
        padding: 3px 20px;
        min-height: 0
    }

        .navbar-top-links .dropdown-menu li a div {
            white-space: normal
        }

.navbar-top-links .dropdown-messages, .navbar-top-links .dropdown-tasks, .navbar-top-links .dropdown-alerts {
    width: 310px;
    min-width: 0
}

.navbar-top-links .dropdown-messages {
    margin-left: 5px
}

.navbar-top-links .dropdown-tasks {
    margin-left: -59px
}

.navbar-top-links .dropdown-alerts {
    margin-left: -123px
}

.navbar-top-links .dropdown-user {
    right: 0;
    left: auto
}

.dropdown-messages, .dropdown-alerts {
    padding: 10px 10px 10px 10px
}

    .dropdown-messages li a, .dropdown-alerts li a {
        font-size: 12px
    }

    .dropdown-messages li em, .dropdown-alerts li em {
        font-size: 10px
    }

.nav.navbar-top-links .dropdown-alerts a {
    font-size: 12px
}

.nav-header {
    padding: 33px 25px
}

.nav > li.active {
    border-right: 4px solid #19aa8d;
    background: #0869aa
}

.nav.nav-second-level > li.active {
    border: none
}

.nav.nav-second-level.collapse[style] {
    height: auto !important
}

.nav-header a {
    color: #DFE4ED
}

.nav-header .text-muted {
    color: #fff
}

.navbar-form-custom {
    float: left;
    height: 50px;
    padding: 0;
    width: 200px;
    display: inline-table
}

    .navbar-form-custom .form-group {
        margin-bottom: 0
    }

.nav.navbar-top-links a {
    font-size: 14px
}

.navbar-form-custom .form-control {
    background: none repeat scroll 0 0 rgba(0,0,0,0);
    border: medium none;
    font-size: 14px;
    height: 60px;
    margin: 0;
    z-index: 2000
}

.count-info .label {
    line-height: 12px;
    padding: 2px 5px;
    position: absolute;
    right: 6px;
    top: 12px
}

.nav-second-level li, .nav-third-level li {
    border-bottom: none !important
}

    .nav-second-level li a {
        padding: 7px 10px 7px 10px;
        padding-left: 52px
    }

    .nav-third-level li a {
        padding-left: 62px
    }

    .nav-second-level li:last-child {
        margin-bottom: 10px
    }

.navbar-header {
    float: right;
}

.navbar-right {
    float: left !important;
}

ul.nav.navbar-right {
    padding-top: 3px;
}
/**********Navigation css end**************/

/**********Menu css start**************/
ul.top-links {
    margin: 0;
    padding: 0 0 0 0;
    list-style: none;
    float: right
}

    ul.top-links li {
        display: inline-block;
        font-size: 14px;
        font-weight: 400;
        text-transform: uppercase;
        margin: 0 1px
    }

        ul.top-links li a {
            color: #fff
        }

.navbar-static-top ul.navbar-right li img {
    width: 175px
}

.navbar-default.nav-custom .navbar-nav > li {
    float: right
}

.navbar.navbar-default.nav-custom {
    min-height: inherit;
    margin: 0;
    float: right;
    border: 0
}

.nav-custom .nav > li.active {
    border-right: 0;
    background: transparent
}

.navbar-default.nav-custom .nav > li > a:hover, .navbar-default.nav-custom .nav > li > a:focus {
    background-position: 0 -53px
}

.nav-custom .navbar-collapse.collapse {
    padding: 0
}

.nav-custom.navbar-default .navbar-nav > .active > a, .nav-custom.navbar-default .navbar-nav > .active > a:hover, .nav-custom.navbar-default .navbar-nav > .active > a:focus {
    background: transparent
}

.nav-custom.navbar-default .navbar-nav > .open > a, .nav-custom.navbar-default .navbar-nav > .open > a:hover, .nav-custom.navbar-default .navbar-nav > .open > a:focus {
    color: #fff
}

.nav-custom ul.dropdown-menu.multi-level {
    padding: 5px 0;
    background: #fff
}

.nav-custom ul.dropdown-menu li {
    display: block;
    padding: 0
}

    .nav-custom ul.dropdown-menu li a {
        color: #fff;
        font-size: 12px;
        padding: 0 10px 0 0;
        line-height: 44px;
        margin: 0;
        border-radius: 0;
        text-align: right;
        background: url(src/assets/images/menu-img.png) no-repeat;
        width: 140px;
        height: 53px;
        background-position: 0 0
    }

.nav-custom ul.dropdown-menu.multi-level li a {
    background: transparent;
    color: #333;
    height: auto;
    line-height: inherit;
    padding: 5px 10px
}

    .nav-custom ul.dropdown-menu.multi-level li a .caret {
        float: left;
        margin-top: 7px
    }

.nav-custom ul.dropdown-menu.multi-level li {
    border-bottom: 2px solid #a9a7a7
}

    .nav-custom ul.dropdown-menu.multi-level li:last-child {
        border-bottom: 0
    }

.multi-level .dropdown-menu {
    min-width: 160px
}

.nav-custom ul.dropdown-menu li i {
    margin-left: 5px
}

.nav-custom ul.dropdown-menu li:last-child a {
    border-bottom: 0
}

.nav-custom .dropdown-menu > li > a:hover, .nav-custom .dropdown-menu > li > a:focus {
    background-position: 0 -53px
}

.nav-custom ul.dropdown-menu li.divider {
    background: #43aedf;
    height: 4px;
    margin: 0
}

.dropdown-menu {
    min-width: 140px
}

.navbar-default.nav-custom .navbar-nav > li > a i {
    width: 23px;
    height: 23px;
    border-radius: 50%;
    background: #fff;
    text-align: center;
    line-height: 24px;
    font-size: 12px;
    color: #147cc6;
    vertical-align: middle;
    text-indent: 0;
    margin: 0 0 0 2px
}

.dropdown-submenu {
    position: relative
}

    .dropdown-submenu > .dropdown-menu {
        top: 0;
        right: 100%;
        margin-top: 0;
        margin-left: 0;
        border-radius: 2px;
        margin-right: 0
    }

    .dropdown-submenu:hover > .dropdown-menu {
        display: block
    }

    .dropdown-submenu.open > .dropdown-menu {
        display: block
    }

.navbar-default.nav-custom .navbar-nav > li > a {
    border: 1px solid #fff;
    border-radius: 4px;
    box-shadow: 0 0 4px 1px #fff inset;
    padding: 4px 10px;
    background: url(src/assets/images/menu-img.png) no-repeat;
    width: 140px;
    height: 49px;
    background-position: 0 0;
    text-align: right;
    line-height: 39px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    text-transform: uppercase
}

.nav-custom ul.dropdown-menu.multi-level li {
    position: relative;
}

    .nav-custom ul.dropdown-menu.multi-level li ul {
        position: absolute;
        right: 142px;
        top: 0;
        width: 135px;
        background: #fff;
        box-shadow: 0 -1px 2px #ccc;
        display: none;
        padding: 0;
        margin: 0;
    }

    .nav-custom ul.dropdown-menu.multi-level li:hover ul {
        display: block;
        border: 1px solid #147cc6;
    }

    .nav-custom ul.dropdown-menu.multi-level li ul li {
        padding: 5px;
    }

    .nav-custom ul.dropdown-menu.multi-level li ul .btn-logout {
        margin: 0;
        width: 100%;
        padding: 5px 0;
    }

    .nav-custom ul.dropdown-menu.multi-level li:hover ul li:first-child {
        background: orange;
        text-align: center;
        font-size: 12px;
        font-weight: bold;
        color: #fff;
    }

    .nav-custom ul.dropdown-menu.multi-level li:hover a {
        background: #5bc0de;
        color: #fff;
    }


    .nav-custom ul.dropdown-menu.multi-level li.arrow-menu:hover > a::before {
        content: "\f060";
        font-family: FontAwesome;
        position: absolute;
        left: 5px;
        top: 3px;
        color: #fff;
        font-size: 15px;
        z-index: 1;
    }
/**********Menu css end**************/
/* CIRCLE */
.img-circle {
    border-radius: 50%
}

.btn-circle {
    width: 35px;
    height: 35px;
    padding: 0;
    border-radius: 50%;
    text-align: center;
    font-size: 12px;
    line-height: 35px;
    margin-right:5px;
}

img.circle-border {
    border: 6px solid #FFF;
    border-radius: 50%
}

.border-left-right {
    border-left: 1px solid #e7eaec;
    border-right: 1px solid #e7eaec;
    border-top: none;
    border-bottom: none
}

.border-left {
    border-left: 1px solid #e7eaec;
    border-right: none;
    border-top: none;
    border-bottom: none
}

.border-right {
    border-left: none;
    border-right: 1px solid #e7eaec;
    border-top: none;
    border-bottom: none
}

.full-width {
    width: 100% !important
}

.link-block {
    font-size: 12px;
    padding: 10px
}

.nav.navbar-top-links .link-block a {
    font-size: 12px
}

.link-block a {
    font-size: 10px;
    color: inherit
}

.light-navbar .navbar.navbar-static-top {
    background-color: #ffffff;
}

.ibox {
    clear: both;
    margin-bottom: 0px;
    margin-top: 25px;
    padding: 0;
    border: solid 1px #ccc;
    border-radius: 3px;
    float: right;
    width: 100%
}

    .ibox.collapsed .ibox-content {
        display: none
    }

    .ibox.collapsed .fa.fa-chevron-up:before {
        content: "\f078"
    }

    .ibox.collapsed .fa.fa-chevron-down:before {
        content: "\f077"
    }

    .ibox:after, .ibox:before {
        display: table
    }

.ibox-title {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    color: #fff;
    margin-bottom: 0;
    min-height: 33px;
    padding: 2px 15px;
    background: #9acde2;
    background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
    position: relative
}

.ibox-content {
    background-color: #fff;
    color: inherit;
    padding: 8px 0 0 0;
    border: 5px solid #50b6ff;
    border-radius: 0 0 15px 15px;
    border-top: 0;
}

.ibox-footer {
    color: inherit;
    border-top: 1px solid #e7eaec;
    font-size: 90%;
    background: #fff;
    padding: 10px 15px
}

.ibox-content {
    clear: both
}

.ibox-heading {
    background-color: #f3f6fb;
    border-bottom: none
}

    .ibox-heading h3 {
        font-weight: 200;
        font-size: 24px
    }

.ibox-title h5 {
    display: inline-block;
    float: none;
    font-size: 17px;
    font-weight: 700;
    margin: 0;
    padding: 5px 0 0 0;
    text-overflow: ellipsis;
    vertical-align: middle;
    width: 98%
}

.ibox-title .label {
    float: left;
    margin-left: 4px
}

.panel-primary {
    border-color: #1ab394
}

    .panel-primary > .panel-heading {
        background-color: #1ab394;
        border-color: #1ab394
    }

.panel-success {
    border-color: #1c84c6
}

    .panel-success > .panel-heading {
        background-color: #1c84c6;
        border-color: #1c84c6;
        color: #fff
    }

.panel-info {
    border-color: #23c6c8
}

    .panel-info > .panel-heading {
        background-color: #23c6c8;
        border-color: #23c6c8;
        color: #fff
    }

.panel-warning {
    border-color: #f8ac59
}

    .panel-warning > .panel-heading {
        background-color: #f8ac59;
        border-color: #f8ac59;
        color: #fff
    }

.panel-danger {
    border-color: #ed5565
}

    .panel-danger > .panel-heading {
        background-color: #ed5565;
        border-color: #ed5565;
        color: #fff
    }

.panel-title {
    font-size: inherit
}

/******************new page css start***************************/
.ibox-title.ibox-title-head {
    background: #fff;
    position: relative
}

    .ibox-title.ibox-title-head h5 {
        color: #147cc6;
        margin-top: -27px;
        background: #fff;
        display: inline-block;
        width: auto;
        padding: 0 10px
    }

.ibox-content.ibox-content-new {
    border: 0;
    float: right;
    width: 100%
}

.ibox-title.ibox-title-head-center {
    background: transparent;
    float: right;
    width: 100%;
    text-align: center;
    margin-top: -22px
}

    .ibox-title.ibox-title-head-center h5 {
        color: #fff;
        text-align: center;
        background: #147cc6;
        width: auto;
        margin: 0 auto;
        display: inline-block;
        float: none;
        border-radius: 4px;
        padding: 10px 20px
    }

.radio-in {
    border: 1px solid #c8c8c8;
    outline: none;
    background-color: #fff;
    color: #333;
    vertical-align: baseline;
    padding: 6px 15px 5px 15px;
    border-radius: 4px;
    float: right;
    width: 100%
}

    .radio-in .input-box {
        width: 45%
    }

.radio-from {
    float: right;
    width: 24%
}

.radio-in .control-label {
    width: 100%;
    margin: 0 0 5px 0;
    padding-top: 0 !important
}

.radio-from span {
    display: inline-block;
    margin: 0 5px 2px 0;
    font-size: 14px
}

.radio-from input[type=radio] {
    margin: 0;
    top: 2px;
    position: relative
}

.select-box {
    width: 94.8%;
    height: 28px;
    border-radius: 4px;
    border: 1px solid #ccc
}

    .select-box.select-box-right {
        width: 100%
    }

.input-box {
    width: 100%;
    height: 28px;
    padding: 0 5px !important;
    line-height: 28px
}

.form-split {
    float: right;
    width: 100%
}

.input-one {
    margin-bottom: 8px
}

input[type="date"] {
    width: 100%;
    height: 28px;
    border: 1px solid #ddd;
    border-radius: 4px
}

.top-right {
    position: absolute;
    left: -9px;
    top: -15px;
    text-align: center
}

.btncommon {
    font-size: 15px;
    background: #9acde2;
    background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
    color: #fff;
    border-radius: 4px;
    padding: 0;
    width: 35px;
    height: 26px;
    line-height: 26px;
    border: 0
}

    .btncommon:hover, .btncommon:focus {
        background: #147cc6;
        background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: -webkit-linear-gradient(top,#147cc6 0%,#43aedf 100%);
        background: linear-gradient(to bottom,#147cc6 0%,#43aedf 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0)
    }

.form-spacebottom {
    margin-bottom: 8px;
    float: right;
    width: 100%
}

    .form-spacebottom:last-child {
        margin-bottom: 0
    }

.ibox-title.ibox-title-head.head-center {
    background: transparent;
    float: right;
    width: 100%;
    text-align: center;
}

    .ibox-title.ibox-title-head.head-center h5 {
        font-size: 20px;
        border: 3px solid #ddd;
        border-radius: 8px;
        padding: 7px 15px;
    }
/*************************/
.ibox-content.ibox-content-form {
    padding-top: 0
}

.ibox-content-form .text-box {
    margin-left: 20px;
    width: 35%
}

.ibox-content-form .select-box.select-box-right {
    padding: 0 10px
}

.btncommon-right {
    float: right;
    margin-left: 5px
}

.input-right-text .input-box {
    width: 90%
}

.input-right-text .text-only {
    font-size: 15px;
    background: #ccc;
    color: #333;
    border-radius: 4px;
    padding: 0;
    width: 35px;
    height: 26px;
    line-height: 26px;
    border: 0;
    display: inline-block;
    text-align: center;
    margin-right: 8px;
    vertical-align: top
}

.btngray {
    border: 0;
    padding: 0 10px;
    height: 26px;
    color: #fff;
    width: 100%;
    font-size: 14px;
    border-radius: 4px;
    background: #9acde2;
    background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0)
}

.form-one {
    padding-right: 0
}

.form-in-content {
    border: 1px solid #c8c8c8;
    padding: 15px 15px 0 15px;
    float: left;
    width: 100%;
    border-radius: 4px
}

.form-in-content-left {
    padding-left: 0
}

.input-icon .input-box {
    width: 92%
}

.input-icon .btncommon {
    margin-right: 5px
}

.inputbox-spcbtm {
    margin-bottom: 8px;
    float: right;
    width: 100%;
    position: relative;
    z-index: 1
}

.form-spacebottom-select {
    padding-left: 0
}

    .form-spacebottom-select .select-box {
        width: 100%
    }
/***********************************/
.form-input-three {
    position: relative;
    right: -2px
}

.small-dateinput input[type="date"] {
    width: 83.3%
}

.yellow-color {
    background: rgb(250,250,99);
    border: 1px solid #ccc;
    padding-right: 5px
}

.btncommon.green-color {
    background: green;
    padding: 0 10px;
    width: auto;
    line-height: 28px;
    margin: 0
}

    .btncommon.green-color:hover, .btncommon.green-color:focus {
        background: rgb(3,174,3)
    }

.text-highlight p {
    margin: 5px 0;
    border: 1px solid #ccc;
    padding: 10px;
    font-size: 14px
}

.light-yellow, .light-yellow-text {
    background: rgb(250,250,150)
}

.green-text {
    background: #c0ffc0
}

.text-highlight {
    padding-right: 0
}
/*****************************/
.split-two {
    padding: 0;
    float: right
}

.form-totalsheet {
    padding: 0 100px;
    display: block;
    margin: 0 auto;
    float: none
}

.total-box .input-box {
    padding-right: 5px
}

.total-box {
    margin-bottom: 15px;
    float: right;
    width: 100%
}

.label-text-center {
    text-align: center;
    width: 50%;
    margin: 0 auto 15px auto !important;
    float: none;
    display: block
}

.total-box.total-bottombox {
    margin-top: 43px
}

.total-box .input-right {
    padding-right: 0
}

.gray-btn {
    clear: both;
    float: right;
    width: 110px;
    border: 0;
    background: #ccc;
    border-radius: 4px;
    margin-top: 5px;
    padding: 5px 10px
}

.form-left-field {
    margin-top: 37px
}

.form-threesplit .select-box.select-box-right {
    width: 75%;
    margin-left: 15px
}

.btncommon.orangelight-color {
    background: #ffe0c0;
    padding: 0 50px;
    width: auto;
    line-height: 28px;
    margin: 0 0 0 15px;
    float: left;
    color: #676a6c
}

    .btncommon.orangelight-color:hover, .btncommon.orangelight-color:focus {
        background: #f6d0a8
    }

.btncommon.lightgreen-color {
    background: #c0ffc0;
    padding: 0 50px;
    width: auto;
    line-height: 28px;
    margin: 0 0 0 15px;
    color: #676a6c
}

    .btncommon.lightgreen-color:hover, .btncommon.lightgreen-color:focus {
        background: #a5faa5
    }

.form-threesplit {
    padding: 0
}

h4.note-heading {
    float: right;
    background: green;
    padding: 0 10px;
    line-height: 28px;
    margin: 5px 0 0 0;
    color: #fff;
    border-radius: 4px;
    width: 100px;
    text-align: center
}

    h4.note-heading:hover, h4.note-heading:focus {
        background: rgb(3,174,3)
    }

.note-content {
    margin-right: 130px
}

.select-number .select-box {
    width: 88%
}

.select-number {
    padding-right: 0
}

.number {
    width: 30px;
    background: green;
    color: #333;
    text-align: center;
    margin-left: 15px;
    height: 28px;
    line-height: 28px
}

.blue-num {
    background: #6FC1E6
}

.label-center {
    text-align: center
}

.checklabel-yl {
    background: rgb(250,250,150) none repeat scroll 0 0
}

.label-right.checklabel-yl {
    padding: 5px 5px;
    width: 100%
}

.icon-show {
    text-align: center
}

.icon-show-right {
    margin-right: 15px;
    margin-left: 0;
    background: transparent;
    border: 0;
    width: auto;
    padding: 0
}

    .icon-show-right i {
        color: red;
        font-size: 30px
    }

.gray-btn-auto {
    width: auto;
    float: left
}

.radio-from-full {
    width: 100%;
    margin-top: 20px
}

    .radio-from-full span {
        width: 25%;
        float: right
    }

.ibox {
    position: relative
}

.icon-only {
    position: absolute;
    top: 20px;
    left: 20px
}

.ibox.ibox-new-margin {
    margin: 0 0 5px 0
}

.ibox-content-new-only {
    padding-top: 15px;
    padding-bottom: 15px
}

.input-one-top {
    margin-top: 15px;
    float: right;
    width: 100%
}

.radio-from-block {
    width: 100%;
    margin-bottom: 8px
}

.radio-from.radio-from-inputbox {
    width: 100%
}

.radio-from .radio-halfbox {
    width: 35%;
    float: right;
    display: inline-block
}

.input-box.input-left-small {
    width: 16%;
    margin-right: 15px
}

.radio-from span .radio-halfbox {
    width: 50%
}

.form-spacebottom.less {
    margin-bottom: 6px
}
/******************new page css end***************************/
.banner-image img {
    width: 100%
}

.main-box-nopadding {
    padding: 0;
    float: right;
    width: 100%
}

    .main-box-nopadding .control-label {
        padding-right: 0
    }

    .main-box-nopadding .input-box-right {
        padding-left: 0
    }

.input-icon {
    padding-left: 0
}

ul.listing {
    margin: 0;
    padding: 0
}

    ul.listing.p-0 {
        padding: 0;
    }

.m-r10 {
    margin-right: 10px;
}

.m-b5 {
    margin-bottom: 5px;
}

.m-t42 {
    margin-top: 42px;
}

.m-t64 {
    margin-top: 64px;
}

.m-t0 {
    margin-top: 0;
}

.m-t10 {
    margin-top: 10px;
}

ul.listing li {
    font-size: 15px;
    margin: 0 0 10px 0;
    position: relative;
    padding-right: 30px;
    list-style: none
}

    ul.listing li:after {
        content: "\F005";
        font-family: FontAwesome;
        position: absolute;
        font-size: 15px;
        top: 0;
        right: 0;
        color: #147cc6
    }
/********25 oct*************/
.dx-placeholder {
    line-height: 8px
}

.login-label {
    text-align: right;
    padding-left: 0;
    float: right
}

.form-login-top {
    background: #fff;
    margin: 0 auto;
    padding: 0;
    width: 35%;
    text-align: center;
    border-radius: 5px;
    top: 50px;
    border: 1px solid #6ec0e6;
}

    .form-login-top h2 {
        border-bottom: none;
        font-size: 30px;
        text-align: center;
        padding: 15px 0;
        color: #fff;
        background: #9acde2;
        background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
        margin: 0;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px
    }

.form-login-content {
    padding: 20px 0;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px
}

    .form-login-content h4 {
        margin: 0 0 20px 0;
        font-size: 14px
    }

.form-control, .single-line {
    border-radius: 4px
}

.checkbox-login label {
    float: none;
    text-align: center;
    direction: initial;
    padding: 0 !important;
    margin-bottom: 8px
}

.checkbox-login input#RememberMe {
    margin: 0;
    position: relative;
    top: 2px
}

.btn.btn-login {
    width: auto;
    padding: 5px 10px;
    height: auto;
    background: #6ec0e6;
    color: #fff;
    border: 0;
    box-shadow: none
}

    .btn.btn-login:hover, .btn.btn-login:focus {
        background: #147cc6
    }

a.link-login {
    display: block;
    margin: 8px 0 0 0;
    direction: initial;
    color: #6ec0e6
}

    a.link-login:hover, a.link-login:focus {
        color: #147cc6
    }

.login-top {
    height: 100%
}

.login-inner {
    height: 100%;
    display: table;
    vertical-align: middle;
    width: 100%
}

.login-in-content {
    display: table-cell;
    vertical-align: middle
}

.form-login-top.form-register-top {
    width: 48%
}

.login-top #wrapper {
    min-height: 100%
}

.btn-logout {
    background: #9acde2;
    background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
    border: 0 none;
    border-radius: 4px;
    box-shadow: none;
    color: #fff;
    height: auto;
    margin-top: 8px;
    padding: 0 10px;
    width: auto
}

    .btn-logout:hover, .btn-logout:focus {
        background: #147cc6;
        background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: -webkit-linear-gradient(top,#147cc6 0%,#43aedf 100%);
        background: linear-gradient(to bottom,#147cc6 0%,#43aedf 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0)
    }

.form-login-content .form-group {
    margin-left: 0;
    margin-right: 0;
    width: 100%
}

.header-right {
    float: right;
    padding-bottom: 4px;
}

.input-right-text .text-only {
    float: left
}

.number {
    height: 34px;
    line-height: 20px
}

.label-right.checklabel-yl, .icon-show-right {
    height: 28px
}

.cen-wrp {
    float: right;
    width: 65%
}

.lf-wrp {
    float: left;
    width: 35%
}

.select-number .select-folder .number {
    border-radius: 4px
}

.custom-popup .modal-dialog {
    height: auto;
    margin: 0 auto;
    width: 30%;
    top: 38%
}

.custom-popup .modal-content {
    width: 100%;
    height: 100%;
    float: right
}

.custom-popup .form-folder {
    float: none;
    width: 100%
}

.custom-popup .modal-content {
    padding: 20px
}

.btn-logout.btn-popup {
    clear: both;
    padding: 4px 10px;
    float: right
}

    .btn-logout.btn-popup:hover, .btn-logout.btn-popup:focus {
        color: #fff
    }
/*************************************/
.btn-orange {
    background: orange
}

    .btn-orange:hover, .btn-orange:focus {
        background: #d89e34
    }

.form-group {
    margin-bottom: 8px;
    float: right
}

    .form-group.form-bottom {
        margin-bottom: -7px
    }

.dx-texteditor-input.read-input {
    background: #e0e0e0
}

#calculationTab .dx-tab, #calculationTab1 .dx-tab {
    display: inline-block;
    float: right;
    padding: 6px 2px 1px;
    width: 31.5%;
    border: 2px solid #83c5e1;
    border-radius: 10px 10px 0 0;
    border-bottom: none;
    margin: 0 5px;
    background-color: #c7ebfd
}

.dx-tab-selected .dx-tab-text, .dx-state-hover .dx-tab-text {
    color: orange
}

.dx-tab-selected .dx-icon, .dx-state-hover .dx-icon {
    color: #fff
}

.dx-rtl .dx-show-clear-button .dx-texteditor-input, .dx-rtl.dx-show-clear-button .dx-texteditor-input {
    padding: 0 9px 0 34px !important
}

.enter-width .dx-texteditor-input {
    width: 100%
}

.client-width .dx-texteditor-input {
    width: 100%
}

.form-group.form-bottom {
    position: relative
}

#Mpid {
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 3px;
    margin: 0 auto;
    width: 100px;
    padding: 0 5px
}

input.readonly-box {
    background: #f7f7f7 none repeat scroll 0 0;
    border: 1px solid #f7f7f7 !important
}

.shift-add-button .dx-datagrid-header-panel {
    overflow: inherit
}

.shift-add-button .dx-toolbar-after {
    left: 35px !important;
    margin: 0;
    padding: 0 !important;
    position: absolute;
    right: inherit !important;
    top: 31px;
    z-index: 9999
}

    .shift-add-button .dx-toolbar-after .dx-toolbar-item:first-child {
        padding-left: 0
    }

.shift-add-button .dx-datagrid-header-panel .dx-button {
    margin-bottom: 0;
    background: transparent;
    border: 0;
    box-shadow: none
}

.shift-add-button .dx-toolbar-text-auto-hide .dx-button .dx-button-content {
    padding: 4px 6px
}

.shift-add-button #TransGrid .dx-datagrid-header-panel {
    margin-top: 0
}

.shift-add-button .dx-rtl .dx-toolbar-after .dx-toolbar-item:first-child {
    padding-left: 0
}

.shift-add-button .dx-button-has-text .dx-button-content {
    line-height: 25px;
    display: inline-block;
    padding: 2px;
    border: 1px solid #ccc;
    background: url(src/assets/images/left-menu.png) no-repeat;
    background-position: center center;
    width: 30px;
    height: 28px;
    text-align: center;
    border-radius: 3px;
    padding: 0 !important
}

.shift-add-button .dx-toolbar-text-auto-hide .dx-button .dx-icon {
    color: #fff;
    font-size: 12px
}

#popupVideo.custom-popup .modal-dialog {
    width: 72%;
    top: 0;
    height: 100%
}

#popupVideo.custom-popup .modal-content {
    height: 100%
}

#popupVideo .ViewerContainer {
    height: auto !important
}

#popupVideo .dx-designer {
    height: auto !important
}

#popupVideo iframe {
    height: 100% !important
}

.custom-popup .modal-header {
    padding: 0 0 10px 0
}

    .custom-popup .modal-header .close {
        margin-top: 0;
        padding-left: 8px;
        float: left
    }

.custom-popup .text-box {
    width: 45%
}

.alert {
    background: #f6f6f6 none repeat scroll 0 0;
    float: right;
    margin: 8px 0;
    padding: 5px 10px;
    width: 100%
}

.closebtn {
    float: left;
    font-size: 13px
}

.btn-logout.btn-popup.btn-icon-popup {
    clear: none;
    margin: 0 0 0 15px;
    width: 31.4%;
    position: relative;
    padding: 10px 12px;
    font-size: 16px
}

    .btn-logout.btn-popup.btn-icon-popup:last-child {
        margin: 0
    }

.color-yellow {
    background: #cc0
}

.color-green {
    background: green
}

.color-orange {
    background: orange
}

.color-yellow:after {
    content: "?";
    font-family: 'FontAwesome';
    font-size: 15px;
    padding-left: 7px
}

.color-green::after {
    content: "?"
}

.color-orange::after {
    content: "?"
}

/**********************************/
.datepicker-rightspace {
    float: right;
    padding-left: 0;
    margin-right: -6px;
    width: 100px
}

    .datepicker-rightspace input {
        width: 100%
    }

.number-right {
    float: right
}

.main-box-topbtm {
    margin-top: 8px
}

.datealign.input-box-right {
    padding-right: 0;
    margin-bottom: 8px
}

.datealign {
    padding-right: 55px
}

.inputright {
    float: right
}

.equal-width label {
    display: block;
    width: 120px
}

.input-smlright {
    width: 50px;
    float: right;
    margin-left: 15px
}

.tab-custom-content {
    padding: 10px 0;
    float: right;
    width: 100%
}

.radiotop-label {
    float: right;
    width: 100%;
    margin-top: 8px
}

.radio-right {
    width: 60%
}

    .radio-right span {
        width: 45%;
        display: inline-block
    }

.fourbox-split {
    float: right;
    width: 100%;
    padding: 0 15px
}

.inputpaddingrem {
    padding: 0;
    float: right;
    width: 100%
}

.label-input-top .dx-texteditor {
    display: inline-block
}

.btn-custom {
    width: 155px;
}

/********************bma*************************/
.summary-box .ibox-content {
    padding-top: 8px
}

.summary-detail {
    float: right;
    margin-top: 20px;
    width: 100%
}

    .summary-detail h4 {
        display: block;
        margin: 0 0 10px 0
    }

tr.dx-row.dx-header-row {
    background: #9cd2ad;
    color: #333
}

#mygrid .dx-header-row:first-child td {
    border-left: 5px solid #ddd
}

.dx-datebox.dx-texteditor {
    display: inline-block;
    vertical-align: middle
}

.startend-top {
    margin: 5px 0
}

.filterbox {
    float: right;
    width: 110px
}

.startbox {
    float: right;
    width: 40%;
    padding-left: 0
}

.startend-top label {
    padding-top: 0 !important
}

.dx-button-has-text .dx-button-content {
    padding: 0 18px 8px !important;
    height: 25px;
    line-height: 25px
}

.form-bottom .full-width-box {
    padding-left: 0
}

/**************login-page-css-3feb ******************/
.colorgraph {
    background: #c4e17f linear-gradient(to right,#c4e17f,#c4e17f 12.5%,#f7fdca 12.5%,#f7fdca 25%,#fecf71 25%,#fecf71 37.5%,#f0776c 37.5%,#f0776c 50%,#db9dbe 50%,#db9dbe 62.5%,#c49cde 62.5%,#c49cde 75%,#669ae1 75%,#669ae1 87.5%,#62c2e4 87.5%,#62c2e4) repeat scroll 0 0;
    border-radius: 5px;
    border-top: 0 none;
    height: 5px
}

.form-login-top h2 {
    border-bottom: none;
    font-size: 25px;
    text-align: center
}

.form-login-top .input-lg {
    height: 46px !important;
    padding: 10px 16px;
    font-size: 14px;
    line-height: 1.3333333;
    border-radius: 6px
}

.login_btn-sec {
    padding: 0 15px;
    margin-top: 10px
}

    .login_btn-sec .btn {
        background: #6ec0e6;
        border: 0
    }

        .login_btn-sec .btn:hover, .login_btn-sec .btn:focus {
            background: #147cc6
        }
/**************login-page-css3-feb End******************/

.dx-overlay.dx-widget.dx-visibility-change-handler.dx-toast {
    position: fixed;
    left: 0;
    right: 0;
    top: 11%;
    height: 50px;
    width: 240px;
    margin: 0 auto
}

    .dx-overlay.dx-widget.dx-visibility-change-handler.dx-toast .dx-overlay-wrapper.dx-toast-wrapper {
        position: static !important
    }

.dx-toast-content.dx-resizable {
    position: static !important;
    width: 100% !important;
    height: 100% !important;
    transform: inherit !important
}

.dx-overlay.dx-widget.dx-visibility-change-handler.dx-toast .dx-toast-icon {
    width: 25px;
    height: 25px;
    float: left
}

.right-form-top {
    float: right
}

    .right-form-top .control-label {
        padding-right: 0
    }

.radiobox-right {
    float: right;
    padding-left: 10px
}

.radio-in .input-box {
    margin-top: 8px
}

.btn-center {
    display: block;
    width: 100%;
    clear: both;
    margin: 0 auto;
    text-align: center
}

    .btn-center .btn-logout {
        height: 25px;
        float: none;
        margin: 20px auto 0 auto
    }

.dxrd-designer-wrapper.dx-ltr .dxrd-right-tabs, .dxrd-designer-wrapper.dx-ltr .dxrd-right-panel-collapse, .dxrd-preview.dxrd-designer-wrapper .dxrd-preview-export-options-wrapper {
    display: none
}

.dxrd-preview.dxrd-designer-wrapper .dxrd-preview-wrapper .dxrd-preview-surface .dxrd-report-preview-holder {
    overflow: hidden
}

.dxrd-preview.dxrd-designer-wrapper.dx-ltr .dxrd-preview-wrapper, .dx-ltr .dxrd-preview-wrapper {
    width: 100% !important
}

/********************************************/
.calculator {
    width: 100%
}

.select-shift-right {
    width: 165px;
    padding-right: 0;
    margin-right: -4px
}

.inputbox-spcbtm .input-box-right {
    width: 41%
}

.startend-top label {
    padding-left: 8px
}

.filterbox-right {
    float: left
}

    .filterbox-right .btn-logout {
        float: left
    }

        .filterbox-right .btn-logout i {
            padding-left: 5px
        }

    .filterbox-right .btn-logout {
        float: left;
        margin-top: 0;
        height: 27px;
        line-height: 27px
    }

        .filterbox-right .btn-logout:hover, .filterbox-right .btn-logout:focus {
            color: #fff
        }

.photo-bottom .btn-logout {
    margin: 0;
    height: 26px;
    line-height: 27px
}

.loader-top {
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    width: 100%;
    margin: 0 auto;
    text-align: center
}

#masterCodeDailog {
    margin-right: 2px
}

.number-btn {
    font-size: 15px;
    background: #6EC0E6;
    color: #fff;
    border-radius: 4px;
    padding: 0;
    width: 35px;
    height: 25px;
    line-height: 25px;
    border: 0;
    vertical-align: top
}

.inputbox-spcbtm .input-box-right.input-smallwidth {
    width: 150px;
    padding-left: 0
}

.checkbox-right {
    padding: 0;
    margin-top: 8px
}

.value-box-bottom .form-spacebottom:last-child {
    margin-bottom: 8px
}

.checkbox-right .dx-checkbox-icon {
    margin-left: 10px
}

/**************Trans css start*****************/
.shift-add-button #TransGrid .dx-toolbar-after {
    top: 2px
}

#TransGrid .dx-datagrid-header-panel .dx-toolbar {
    margin-bottom: 0
}

#TransGrid .dx-toolbar .dx-toolbar-items-container {
    height: auto
}

.startbox .dx-texteditor {
    display: inline-block;
    vertical-align: middle
}

.filterbox-right {
    display: none
}
/**************Trans css end*****************/

/**************Bnh css start*****************/
.select-split {
    margin-bottom: 8px;
    float: right;
    padding: 0
}

    .select-split .label-right {
        width: 30%
    }

.dx-item.dx-multiview-item {
    padding: 8px
}

.calculation .main-box.main-box-topbtm {
    margin-bottom: 8px
}

.margin-top {
    margin-top: 8px
}

.select-split-first .select-shift-right {
    width: 55%
}
/**************Bnh css end*****************/

/**************Bnc css start*****************/
.checkbox-topbottom {
    padding: 2px 0 0 0
}

.labelwidth {
    width: 120px
}
/********************/
.grid-half {
    float: right;
    width: 50%;
}

.labelwidthfix {
    margin-left: 8px;
}

.grid-half h4.heading {
    text-align: right;
}
/***********popup buttons***************/
#btnMoveNoSave, #btnMoveNoSave:hover, #btnMoveNoSave:focus {
    background: #ac2925;
}

.sweet-alert button {
    line-height: 35px;
}

#btnSaveNmove, #btnSaveNmove:hover, #btnSaveNmove:focus {
    background: #449d44;
}

#btnsaveNoMove, #btnsaveNoMove:hover, #btnsaveNoMove:focus {
    background: #398439;
}

#btnCancel, #btnCancel:hover, #btnCancel:focus {
    background: #5bc0de;
}
/**************Bnc css end*****************/

/**************Bnz css start*****************/
.inputbox-half {
    width: 50%;
}
/**************Bnz css end*****************/

.overwrite-inputcolor .dx-texteditor-input {
    background: transparent;
    border: 0 !important
}

.startbox .dx-datebox.dx-texteditor {
    width: 170px
}

.filterbox .dx-button {
    float: left
}

.welcome-message {
    display: inline-block;
    vertical-align: middle;
    padding: 3px 10px 0 0;
    color: #147cc6;
    text-decoration: underline
}

/**************Dates css start*****************/
.padding-rightremove {
    padding-right: 0
}

.rowone-radio {
    float: right;
    padding: 0
}

    .rowone-radio input[type="radio"] {
        float: right;
        margin: 7px 0 0 0
    }

    .box-field {
        float: right;
        padding-right: 2px;
        width: 30%;
        height: 15px;
    }

.last-row {
    float: right;
    width: 100%
}


.btn-logout.btn-common {
    padding: 5px 10px;
    margin: 0;
    position: absolute;
    top: 5px;
    left: 5px;
}
.dx-datagrid-rowsview .dx-row:first-child .btn-logout.btn-common {
    top: 38px;
}
.list-description.list-large {
    max-height: 250px;
    overflow-y: scroll;
}
.inputbox-left .input-box {
    width: 50%
}

.box-field.box-field-custom {
    width: 130px
}

.rowone-radio .input-box-right {
    width: 83.7%;
    padding-left: 0
}

.input-box.inputbox-right {
    width: 66.5%
}

.select-label {
    float: right;
    width: 100%;
    margin-bottom: 8px
}

    .select-label .box-field {
        padding-right: 0
    }

.input-box-right.large-input-box {
    width: 64.5%;
    padding: 0
}

.tworow-radio .label-right {
    padding-right: 15px
}

.four-boxes {
    margin-top: 8px;
    float: right;
    width: 100%
}

.input-box.light-blue-small {
    width: 17%;
    margin-left: 10px
}

.rowone-radio .dx-radiogroup {
    display: inline-block;
    padding-left: 15px;
    vertical-align: middle;
    float: right;
}

.radio-rightshift {
    display: inline-block;
    vertical-align: top;
    width: 89.7%
}

.one-row-radio {
    display: block;
    padding-bottom: 8px;
    float: right;
    width: 100%
}

.two-row-radio {
    float: right;
    width: 100%;
    padding-bottom: 8px
}

.rowone-radio .dx-radiobutton {
    padding-bottom: 8px
}
/**********************/
.dx-accordion {
    padding: 20px !important
}

.dx-accordion-item-opened > .dx-accordion-item-title {
    background-color: #ddd !important
}

.dx-accordion-item-title {
    font-size: 13px !important;
    background: #f0f0f0
}

.padding-rightremove .input-box-right {
    padding-right: 0
}

.box-field .calculator {
    width: 70px;
    float: right
}

.box-field .dx-texteditor {
    width: 70px;
    float: right
}

.dx-texteditor-input {
    min-height: inherit !important
}

.dx-accordion-item {
    border: 1px solid #ddd !important;
    border-top-color: #ddd;
    border-bottom: 0 !important
}

    .dx-accordion-item:last-child {
        border-bottom: 1px solid #ddd !important
    }

.dx-accordion-item-body {
    padding: 8px 15px 8px !important
}

    .dx-accordion-item-body .remarks {
        padding: 0
    }

.select-label .dx-dropdowneditor-button-visible {
    width: 345px
}

.date-page {
    padding-right: 0
}

.dx-popup-title {
    z-index: 1
}

.dx-toolbar-label .dx-toolbar-item-content > div {
    position: relative;
    z-index: 1
}

.pagination > li > a.mcaptiondisplay {
    width: auto !important;
    min-width: 60px;
    text-align: center
}
/**************Dates css end*****************/
.summary-box .ibox {
    float: left;
    width: 100%
}

.summary-box .dx-form {
    padding: 5px
}

.list-unstyled {
    margin: 0;
    padding: 0
}

textarea.message {
    height: 50px !important;
    overflow: hidden;
    resize: none;
    width: 100%
}

.dx-datagrid-rowsview .dx-selection.dx-row > td, .dx-datagrid-rowsview .dx-selection.dx-row:hover > td {
    background-color: #c7ebfd !important
}

.summary-box textarea.dx-texteditor-input {
    height: 50px !important
}

.form-folder.form-topfolder.bcart-top {
    padding-top: 1px;
}

.summary-box .dx-form-group-with-caption .dx-form-group-content {
    padding-top: 10px;
}
/**************popup*******************/
.dx-popup-title.dx-toolbar {
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    color: #fff;
    background: #9acde2;
    background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0)
}

.dx-popup-title .dx-closebutton .dx-icon {
    color: #fff !important
}

.dx-popup-title .dx-closebutton.dx-state-hover {
    background-color: transparent !important;
    border: 0 !important
}

.dx-popup-wrapper.dx-overlay-modal > .dx-overlay-content {
    height: auto !important;
    max-height: inherit !important
}

.dx-overlay-modal .dx-popup-content {
    height: auto !important
}

.dx-popup-content .form-folder {
    padding: 0;
    width: 100%
}

    .dx-popup-content .form-folder .text-box {
        width: 50%
    }



.dx-popup-content:after {
    content: '';
    display: block;
    clear: both
}

.dx-datebox-wrapper-date .dx-popup-content {
    float: none
}

button.close.close-icon {
    position: absolute;
    left: 6px;
    top: 0;
    color: #000;
    opacity: 1
}

.dx-overlay-content .dx-popup-title.dx-toolbar {
    padding: 6px 9px;
}

.dx-rtl.dx-overlay-content .dx-popup-title .dx-closebutton {
    margin: 0;
    width: auto;
    height: auto;
}

.dx-overlay-content .dx-popup-title .dx-closebutton .dx-icon, .close-icon {
    width: 30px;
    height: 30px;
    padding: 0;
    font-size: 15px;
    text-align: center;
    line-height: 31px;
    color: #147cc6 !important;
    background: #fff;
    border-radius: 50%;
}

.close-icon {
    float: left;
    position: absolute;
    top: 3px;
    left: 15px;
    width: 25px;
    height: 25px;
    line-height: 25px;
}

.ibox-topheader {
    position: relative;
}

.result-text {
    background: #cbefcb;
    border-color: green;
    color: green;
}
/***************bma codesec css***********************/
/******************************/
.select-label .btn-logout {
    margin-left: 10px
}

.checkbox-full-right {
    width: 100%;
    float: right
}

.four-boxes .label-right {
    padding-right: 15px
}

.action-bar-mobile {
    display: none
}

.header-left {
    display: none
}

.dx-popup-content .photo-bottom {
    padding: 0
}

.dx-popup-content .text-box ul li label {
    padding-bottom: 3px !important;
    padding-top: 8px !important
}

.social_sc ul {
    text-align: left
}

.dx-datebox-wrapper-calendar .dx-calendar {
    margin: 0 8px 0 8px !important
}

.dx-popup-bottom.dx-toolbar {
    padding: 0 8px 3px 8px !important
}

.dx-calendar-navigator {
    top: 8px !important
}

.dx-datebox-wrapper .dx-popup-bottom .dx-button {
    background: #6ec0e6 !important;
    border-color: #6ec0e6 !important;
    color: #fff !important
}

    .dx-datebox-wrapper .dx-popup-bottom .dx-button .dx-button-content {
        padding: 2px !important;
        line-height: 19px !important
    }

    .dx-datebox-wrapper .dx-popup-bottom .dx-button.dx-state-hover {
        background: #147cc6 !important;
        border-color: #147cc6 !important
    }

.dx-invalid-message dx-invalid-message-always dx-overlay dx-widget dx-visibility-change-handler {
    visibility: visible
}

.dx-datagrid-content .dx-datagrid-table .dx-row .dx-datagrid-invalid .dx-invalid-message.dx-overlay {
    position: static;
    visibility: visible
}

.shift-add-button {
    position: relative
}

h4.heading {
    margin: 0 auto;
    padding: 0 10px;
    text-transform: capitalize;
    font-size: 18px;
    font-weight: 500;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    text-align: center;
    z-index: 1;
    width: 100%;
    color: #000;
    padding-top: 6px
}

/**************bnf***************/
.dx-radiobutton-icon:before {
    border: 1px solid #337ab7 !important
}

.radio-padding {
    padding: 0
}

    .radio-padding .dx-rtl.dx-radiogroup-horizontal .dx-radiobutton {
        margin-left: 5px !important
    }

.small-inputedit {
    padding-left: 0;
    width: 65px;
}

.form-margintop .dx-numberbox {
    width: 150px;
    float: right;
}

.addbox .dx-numberbox {
    width: 150px
}

.btnmargin-right {
    margin: 0 15px 0 0
}

.label-bottomright-width .dx-textbox, .label-bottomright-width .dx-numberbox, .label-bottomright-width .light-blue {
    width: 201px !important
}

.inputbox-spctop {
    margin-top: 8px
}

    .inputbox-spctop .input-box-right {
        padding-right: 10px
    }

/****************bnt******************/
.form-group.main-box-grid {
    margin-bottom: 8px;
    padding: 0 5px
}

.main-box-grid .control-label {
    padding-right: 15px
}

.main-box-grid .input-box {
    width: 168px
}

.inputbox-spcbtm.inputbox-total {
    margin-top: 90px;
}

/*************gird btn css start****************/
.btn-center-padding.btn-center {
    padding: 8px 0
}

.shift-add-button {
    margin-top: 0
}
/*************gird btn css end****************/

.text-box li a .fa-key, .text-box li a .fa-eraser {
    font-size: 12px;
    color: #fff;
    border-radius: 4px;
    padding: 0 12px;
    width: 35px;
    height: 26px;
    line-height: 28px;
    background: #9acde2;
    background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0)
}

.modal {
    z-index: 99999
}

/*************Profile page css start****************/
.profile-top {
    padding: 0 5px
}

.profile.page {
    margin-top: 8px;
}

.profile-img {
    width: 100px;
    height: 100px;
    position: relative
}

    .profile-img img {
        width: 100%;
        display: block;
        border: 1px solid #ccc;
        border-radius: 50%
    }

    .profile-img a {
        width: 30px;
        height: 30px;
        border-radius: 4px;
        background: #9acde2;
        background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
        position: absolute;
        text-align: center;
        line-height: 30px;
        color: #fff;
        font-size: 16px;
        bottom: 0;
        left: 5px
    }

.profile-page {
    padding: 8px;
    direction: rtl;
}

    .profile-page h2 {
        font-size: 16px
    }

.fieldbox {
    float: right;
    width: 100%;
    padding-bottom: 8px
}

.captcha {
    float: right;
    width: 100%
}

    .captcha p {
        font-size: 14px
    }

.fieldbox .dx-texteditor {
    width: 100% !important
}

.profile-middle {
    margin-bottom: 20px;
}
/*************Profile page css end****************/

/*************Contact page css start****************/
.box-content {
    background: #6ec0e6 none repeat scroll 0 0;
    border: 1px solid #CCC;
    border-radius: 0;
    box-shadow: none;
    color: #fff;
    height: auto;
    padding: 5px 10px;
    width: auto;
    margin-left: -4px;
    border-left: 0
}

    .box-content:first-child {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px
    }

    .box-content:last-child {
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
        border-left: 1px solid #ccc
    }

.contact-left {
    padding-right: 0
}

.contact-right {
    padding-left: 0
}
/*************Contact page css end****************/

.head-color {
    direction: rtl;
    background: -moz-linear-gradient(top,rgba(204,204,204,.9) 0%,rgba(255,255,255,.9) 50%,rgba(204,204,204,.9) 100%);
    background: -webkit-linear-gradient(top,rgba(204,204,204,.9) 0%,rgba(255,255,255,.9) 50%,rgba(204,204,204,.9) 100%);
    background: linear-gradient(to bottom,rgba(204,204,204,.9) 0%,rgba(255,255,255,.9) 50%,rgba(204,204,204,.9) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e6cccccc',endColorstr='#e6cccccc',GradientType=0);
    background: -moz-linear-gradient(top,rgba(238,238,238,.9) 0%,rgba(238,238,238,.9) 1%,rgba(255,255,255,.9) 50%,rgba(238,238,238,.9) 100%);
    float: left;
    width: 100%;
    padding: 3px 0;
    position: relative
}

    .head-color ul {
        float: left;
        margin: 0;
        padding-left: 15px;
        position: relative;
        z-index: 2
    }

.dx-datagrid-header-panel .dx-toolbar-after {
    display: none
}

#Remarkdata .dx-datagrid-header-panel .dx-toolbar-after {
    display: inline-block
}

.fieldbox .dx-textarea .dx-texteditor-input {
    height: 100px !important
}

.customSwalBtn {
    background-color: rgba(214,130,47,1);
    border-left-color: rgba(214,130,47,1);
    border-right-color: rgba(214,130,47,1);
    border: 0;
    border-radius: 3px;
    box-shadow: none;
    color: #fff;
    cursor: pointer;
    font-size: 17px;
    font-weight: 500;
    margin: 30px 5px 0 5px;
    padding: 10px 32px
}

#RemarkspopUp .dx-popup-content {
    padding: 0;
   
}

.dx-datagrid-content .dx-datagrid-table {
    float: right
}

#calculationTab1 .tab-custom-content {
    padding: 0
}

.btnicon {
    height: 26px;
    margin: -4px 0px 0 8px;
}

#ShowMessage {
    position: absolute;
    z-index: 1400;
    top: 2%;
    right: 44%;
    margin: 0 auto;
    text-align: center;
    display: none;
    width: 200px;
    background-color: Highlight
}

.dx-popup-wrapper > .dx-overlay-content {
    z-index: 1 !important
}

.sweet-overlay {
    z-index: 99999 !important
}

.dx-tag-container .dx-texteditor-input {
    border: 0 !important
}

.dx-tag-container {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 4px
}

.iconsbox {
    padding-left: 15px;
    padding-top: 6px;
}

.split-margin {
    margin-bottom: 8px
}

    .split-margin .dx-texteditor {
        width: 201px !important
    }

.input-full .dx-texteditor {
    width: 100% !important;
    padding-left: 15px
}

.ibox-top-space .ibox-content.ibox-content-new {
    margin-top: -18px
}

.pdf-left iframe {
    width: 100% !important;
    height: 530px !important
}

.pdf-left-help iframe {
    width: 100% !important;
    height: 900px !important
}

.address-detail {
    padding: 8px 15px
}


/***********popup-sm******************/
.popup-sm .dx-overlay-content {
    width: 420px !important
}

.no-padding {
    padding: 0
}


/***********popup-md******************/
.popup-md .dx-overlay-content {
    width: 750px !important
}

.dx-popup-content .photo_select > ul.list-last {
    margin-top: 8px
}

.dx-popup-content .photo_select > ul.list-equal li label {
    width: 60px
}

.dx-popup-content .photo_select .dx-texteditor {
    width: 145px
}
/***********popup-lg******************/
.popup-lg .dx-overlay-content {
    width: 950px !important
}

.dx-item.dx-toolbar-item {
    max-width: 100% !important
}

.icon-size {
    font-size: 20px;
    margin-left: 10px
}

.invisible {
    text-align: center;
    margin: 0 auto;
    width: 100px;
    height: 100px;
    background-color: #1ff;
    cursor: none
}

.form-login-content .control-label {
    margin: 5px 0;
    text-align: right;
    padding: 0 !important
}

#Remarkdata .shift-add-button .dx-datagrid-header-panel .dx-button {
    margin-top: -46px
}

#Remarkdata .dx-toolbar .dx-toolbar-items-container {
    height: auto
}

#Remarkdata .dx-datagrid-header-panel .dx-toolbar {
    margin-bottom: 0
}

/***********Popover css start****************/
.popover {
    background-color: #90C048;
    z-index: 1;
    color: #fff
}

    .popover.top .arrow:after {
        border-top-color: #90C048
    }

.popover {
    border-top: 1px solid #000;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000
}

.danger-popover .popover {
    background-color: rgba(255,255,255,.25);
    border: 1px solid red
}

.danger-popover .popover-content {
    color: red;
    padding: 4px 14px;
    width: 205px;
}

.danger-popover .popover.bottom > .arrow:after {
    left: 50%
}

.danger-popover .popover.bottom > .arrow {
    margin-left: 0;
    border-bottom-color: red
}
/***********Popover css end****************/

div#popupVideo {
    z-index: 9
}

.dx-popup-wrapper > .dx-overlay-content {
    z-index: 99 !important
}

.hideshow-in {
    position: absolute;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    top: 31px;
    width: 108px;
    height: 0;
    left: 0;
    right: 0;
    background: red;
    z-index: 1;
    margin: 0 auto
}

.dx-datebox-wrapper-calendar {
    z-index: 99999 !important
}

.main-box-nopadding .popover {
    z-index: 1 !important
}

.inputbox-spcbtm.inputbox-last {
    margin-bottom: 0
}

.small-width {
    width: 163px
}

.padding-right-0 {
    padding-right: 0
}

.select-shift-right.select-shift-small {
    width: 150px;
    margin-right: 0
}

.padding-top20 {
    padding-top: 20px
}

.hidden-box {
    height: 28px
}

.inputbox-spcbtm.inputbox-spcbtm-total {
    margin-top: 75px
}

.select-shift-right.select-max-width {
    width: 33%
}

.header-right p {
    margin: 1px 0 0 0;
    padding: 4px 15px;
    background: #c7ebfd;
    display: inline-block;
    border-radius: 2px;
    font-weight: 600;
    border: 1px solid #269fff;
    font-size: 14px
}

.navbar-static-top, .modal-backdrop, .dx-scrollable-wrapper {
    z-index: 0
}

/*************my-style css*********************/
.remarks::after {
    clear: both;
    content: "";
    display: block
}

.add-btn {
    border-radius: 70px;
    background: #5bc0de !important;
    color: #fff !important;
    border: solid 1px #5bc0de !important
}

    .add-btn:hover {
        background: #31b0d5 !important;
        border: solid 1px #2aabd2 !important
    }

/******************************/
.social_sc {
    display: inline-block;
    float: none;
    position: absolute;
    left: 10px;
    top: 1px
}

    .social_sc ul {
        list-style-type: none
    }

        .social_sc ul li {
            display: inline-block;
            padding: 1px;
            vertical-align: middle
        }

            .social_sc ul li a {
                color: #1899ff;
                font-size: 16px;
                display: block;
                font-weight: 400;
                width: 28px;
                height: 24px;
                border-radius: 3px;
                text-align: center;
                line-height: 26px;
                background: #fff;
                box-shadow: 1px -2px 10px #ccc inset;
                -webkit-transition: all 0.2s ease;
                -moz-transition: all 0.2s ease;
                -ms-transition: all 0.2s ease;
                -o-transition: all 0.2s ease;
                transition: all 0.2s ease;
                top: 0;
                position: relative;
                border-radius: 5px;
            }

                .social_sc ul li a.red-color {
                    background: orange;
                    box-shadow: 0 5px #d68c04;
                    color: #fff
                }

                .social_sc ul li a.blue-color {
                    background: #269fff;
                    box-shadow: 0 5px #157ed2;
                    color: #fff
                }

                .social_sc ul li a.green-color {
                    background: #7ad07a;
                    box-shadow: 0 5px #72b172;
                    color: #fff
                }

                    .social_sc ul li a.green-color:hover, .social_sc ul li a.green-color:focus {
                        background: #7ad07a;
                        box-shadow: 0 4px #72b172;
                        color: #fff
                    }

                    .social_sc ul li a.green-color:active {
                        box-shadow: 0 0 #43a943;
                        top: 4px
                    }

                .social_sc ul li a.blue-color:hover, .social_sc ul li a.blue-color:focus {
                    background: #269fff;
                    box-shadow: 0 4px #157ed2;
                    color: #fff
                }

                .social_sc ul li a.blue-color:active {
                    box-shadow: 0 0 #157ed2;
                    top: 4px
                }

                .social_sc ul li a.red-color:hover, .social_sc ul li a.red-color:focus {
                    background: orange;
                    box-shadow: 0 4px #d68c04;
                    color: #fff
                }

                .social_sc ul li a.red-color:active {
                    box-shadow: 0 0 #d68c04;
                    top: 4px
                }
/******************************/

/******************************/
html, body {
    height: 100%;
    direction: rtl;
    text-align: right;
    /* overflow-y: hidden; */
}

    body.full-height-layout #wrapper, body.full-height-layout #page-wrapper {
        height: 100%
    }

.p-0 {
    padding: 0
}

.p-r0 {
    padding-right: 0
}

.p-l0 {
    padding-left: 0;
}

.m-l15 {
    margin-left: 15px
}

.m-0 {
    margin: 0;
}

.m-t5 {
    margin-top: 5px;
}

.m-b0 {
    margin-bottom: 0;
}

#page-wrapper {
    min-height: auto
}

img.profile-pic {
    margin-top: 5px
}

.main-banner {
    padding: 0 5px
}

.footer {
    padding: 0 5px;
    float: left;
    width: 100%;
    position: fixed;
    bottom: 0;
    right: 0;
}

.form-group.space-bottom-remove {
    margin-bottom: 0
}

.note-editor.note-frame .note-editing-area .note-editable {
    height: 150px
}

.small-inputbox {
    width: 50px
}
/**************bmz css start*********************/
.dashboard {
    padding-right: 0
}

.select-folder .dx-texteditor {
    width: 400px;
    float: right
}

.select-folder .btn-logout {
    margin: 0;
    height: 25px;
    float: left
}

.input-box-right {
    float: right;
    height: 28px
}

.dx-datebox {
    width: 150px !important
}

.form-custom-width .control-label {
    width: 140px
}

.form-custom-width .custom-right-width {
    width: 79.6%
}

.iconbox-inner {
    position: absolute;
    left: 25px;
    top: 0;
    color: #147cc6;
    direction: ltr;
    height: 28px;
    line-height: 27px;
}

.icon-inputbox .datepicker {
    float: right;
    text-align: right;
    width: 100%;
    padding-right: 8px;
}

.icon-inputbox {
    position: relative;
    width: 135px;
}
/**************bmz css end*********************/

/**************bma css start*********************/
.panel.panel-default {
    margin-bottom: 0;
    border: 0;
    box-shadow: none;
}

.arrow-box {
    float: left
}

.pagination {
    margin: 0
}

.form-folder.form-topfolder {
    margin-top: -30px
}

.form-folder {
    padding: 0;
    text-align: right;
    float: right;
    width: 60%
}

.client-wrp {
    padding: 4px 0 0 0
}

.text-box {
    display: inline-block;
    float: none;
    vertical-align: top
}

    .text-box ul {
        width: 100% !important;
        padding-right: 0
    }

        .text-box ul li {
            display: inline-block !important;
            vertical-align: middle;
            margin-left: 6px
        }

            .text-box ul li:first-child {
                width: auto;
                margin-right: 0
            }

.photo_select > ul {
    display: inline-block;
    margin: 0;
    text-align: right;
    width: 30%;
    padding: 0;
    direction: rtl;
}

    .photo_select > ul li {
        display: block
    }

        .photo_select > ul li select {
            -moz-appearance: none;
            border: 1px solid #e7e7e7;
            padding: 0 12px;
            width: 100%;
            /* ReSharper disable once InvalidValue */
            color: #a4a4a4
        }

.photo-bottom {
    margin-bottom: 8px
}

.total-left {
    width: 95px;
}

.total-right {
    width: 100px;
}

.icon-right {
    float: right;
    text-align:center;
    margin: 0 0 0 15px;
}

.custom-right-width .icon-right {
    margin-right: -5px;
}
/**************bma css end*********************/

/************BNF css start****************/
.readable-text {
    width: 50px
}
/*.readable-text .dx-texteditor{height:28px!important;border:1px solid #ccc!important;border-radius:4px;color:#333;width:100%;padding:0 8px;line-height:27px}*/
/************BNF css end****************/

/************Contact page css start****************/
.message-height {
    height: 200px
}
/************Contact page css end****************/

.content-height {
    overflow-y: auto;
    direction: ltr;
    position: relative;
}

.info-msg {
    display: inline-block;
    padding: 0 10px;
    font-size: 16px;
    margin: 0;
}

.ibox.ibox-border-none {
    border: 0;
}

.dx-checkbox-container {
    direction: rtl;
}

.dx-checkbox-icon {
    margin-left: 5px;
    float: right;
}

#ui-datepicker-div {
    z-index: 9999 !important;
}

.loader {
    opacity: 1 !important;
    background: url(src/assets/images/custome/rptload.gif) 50% 50% no-repeat hsla(0, 0%, 32%, 0.2) !important;
}

/************Date page css start****************/
.ibox-tools {
    float: left;
    padding-top: 4px;
}
/************Date page css end****************/
.dx-checkbox {
    display: block !important;
}

/************bmz popup*********************/
.btngray.btn-small {
    width: auto;
}
/*.dx-rtl {
    direction: inherit !important;
}*/
.dx-rtl .dx-radiobutton.dx-radiobutton-checked .dx-radiobutton-icon-dot, .dx-rtl.dx-radiobutton.dx-radiobutton-checked .dx-radiobutton-icon-dot {
    margin-left: 6px !important;
}

.iconbox-inner a {
    display: inline-block;
    vertical-align: middle;
    line-height: 16px;
}

.iconbox-inner a {
    background: #6EC0E6;
    color: #fff;
    padding: 0 3px;
    border-radius: 2px;
    height: 16px;
    margin-left: 3px;
}

.dx-popup-content .iconbox-inner {
    top: -2px;
}

.iconbox-inner a i {
    font-size: 14px !important;
    line-height: 13px;
}

.text-highlighted {
    padding: 0 15px;
}

    .text-highlighted p {
        margin: 5px 0;
        background: #dff0d8;
        direction: rtl;
        padding: 5px 10px;
        border-radius: 2px;
    }

.btn-logout span {
    margin-left: 5px;
}

.dx-rtl .dx-numberbox .dx-texteditor-input, td.number-in-grid {
    direction: ltr;
}

.small-width {
    width: 135px;
}
/****************Bcard css start**********************/
.select-small .dx-texteditor {
    width: 250px !important;
    float: right;
}

.dx-dropdowneditor-input-wrapper {
    overflow: inherit !important;
}

.bcart-top .photo_select > ul li:last-child {
    margin: 0;
}
/****************Bcard css end**********************/
.navbar-right .btn-logout {
    font-size: 15px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.dx-datagrid-checkbox-size .dx-checkbox-icon {
    margin: 0px auto;
    float: none;
}

/****************bnb**********************/
.inputbox-spcbtm-total {
    margin-top: 78px;
}

.space-topbottom {
    padding: 15px 15px 17px 15px;
}

.social_sc ul li.action-button a {
    width: auto;
    font-size: 12px;
    padding: 0 5px;
}

    .social_sc ul li.action-button a i {
        float: right;
        padding: 7px 0 0 5px;
    }

.pdf-icon {
    float: right;
    width: 18px;
    position: relative;
    top: 3px;
}

img.ui-datepicker-trigger {
    position: absolute;
    left: 5px;
    top: 6px;
    width: 15px;
}

.radio-direction {
    direction: rtl;
}

    .radio-direction .dx-radio-value-container {
        padding: 0 0px 0 10px;
        direction: initial;
    }

.alignment-minus {
    margin-right: -23px;
}

.divgroup {
    border: 1px solid #ccc;
    margin-bottom: 10px;
    border-radius: 5px;
}

.select-folder.bmz-select-box .dx-texteditor {
    width: 500px;
}

.dx-radiobutton-checked .dx-radiobutton-icon-dot {
    margin-right: 6px;
}

.dx-scrollbar-vertical .dx-scrollable-scroll {
    width: 15px !important;
}

.dx-scrollbar-hoverable .dx-scrollable-scroll.dx-state-invisible .dx-scrollable-scroll-content {
    background: #999 !important;
}

.dx-scrollbar-hoverable.dx-scrollable-scrollbar-active .dx-scrollable-scroll-content, .dx-scrollable-scroll-content {
    background-color: #999 !important;
}

.pdf-left iframe {
    position: relative;
    z-index: 1;
}

.border-outline-box {
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 8px 15px;
    position: relative;
}

    .border-outline-box h4 {
        color: #147cc6;
        background: #fff;
        display: inline-block;
        width: auto;
        padding: 0 10px;
        margin: 0;
        position: absolute;
        top: -11px;
        right: 11px;
    }

.nav-custom ul.dropdown-menu.multi-level li a:hover {
    background: #5bc0de;
    color: #fff;
}

.error-list {
    margin: 0;
    padding: 0 0 10px 0;
    list-style: none;
}

    .error-list li {
        color: red;
        position: relative;
        padding-right: 20px;
        margin-bottom: 8px;
    }

        .error-list li:before {
            content: "\f071";
            font-family: FontAwesome;
            position: absolute;
            top: 3px;
            right: 0;
        }

.trash {
    color: #449d44;
}

.flag {
    color: rgb(248, 148, 6);
}

.panel-body {
    padding: 0px;
}

.panel-footer .pagination {
    margin: 0;
}

.panel td .action-buttons .glyphicon {
    margin-right: 5px;
    font-size: 20px;
}

.panel td .action-buttons i {
    font-size: 20px;
    margin-right: 5px;
}

.panel-body .radio, .checkbox {
    display: inline-block;
    margin: 0px;
}

.panel-body input[type=checkbox]:checked + label {
    text-decoration: line-through;
    color: rgb(128, 144, 160);
}

.list-group-item:hover, a.list-group-item:focus {
    text-decoration: none;
    background-color: rgb(245, 245, 245);
}

.list-group {
    margin-bottom: 0px;
}

/*************************************/
.summary-box .panel-primary {
    border: 0;
    margin: 0;
    box-shadow: none;
}

    .summary-box .panel-primary .panel-heading {
        border: 0;
        background: #147cc6;
        height: 33px;
        padding: 4px 15px;
        line-height: 29px;
        font-weight: 600;
        position: relative;
    }

.summary-box .btn.btn-default {
    background: transparent;
    border: 0;
    color: #fff;
    font-size: 18px;
    padding: 0;
    line-height: 30px;
}

.summary-box .panel-heading > .glyphicon {
    margin: -5px 0 0 10px;
    font-size: 16px;
    vertical-align: middle;
}

.summary-body .list-group {
    padding: 0;
}

.summary-body .list-group-item {
    border-bottom: 0;
    border-top: 1px solid #ddd;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    margin: 0;
}

    .summary-body .list-group-item:nth-child(even) {
        background: #c7ebfd;
        border-right: 2px solid #147cc6;
    }

.summary-body input[type="checkbox"] {
    margin: 5px 0 0 8px;
}

.summary-body .checkbox {
    width: 85%;
}

.summary-box .summary-body .action-buttons {
    width: 70px;
}

.summary-box .checkbox label {
    min-height: inherit;
    padding: 0 20px 0 0;
    display: inline-block;
    line-height: 15px;
    font-size: 13px;
    vertical-align: middle;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
}

.summary-box .panel-footer {
    background: #a1e9a1;
}

    .summary-box .panel-footer h6 {
        color: #333;
        font-size: 15px;
        font-weight: bold;
        margin: 8px 0 0 0;
    }

        .summary-box .panel-footer h6 .label-info {
            margin: 0 0 0 5px;
        }

.summary-box .pagination-sm > li > a, .summary-box .pagination-sm > li > span {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-color: #398439;
    background: #5cb85c;
    color: #fff;
}

.summary-box .pagination > .active > a, .summary-box .pagination > .active > span, .summary-box .pagination > .active > a:hover, .summary-box .pagination > .active > span:hover, .summary-box .pagination > .active > a:focus, .summary-box .pagination > .active > span:focus,
.summary-box .pagination > li > a:hover, .summary-box .pagination > li > span:hover, .summary-box .pagination > li > a:focus, .summary-box .pagination > li > span:focus {
    border-color: #337ab7;
    background: #337ab7;
    color: #fff;
}

.tab-top {
    direction: rtl;
    float: right;
    width: 100%;
}

    .tab-top .nav.nav-tabs {
        margin: 0;
        padding: 0;
        float: right;
        width: 100%;
        background:#fff;
    }

        .tab-top .nav.nav-tabs li {
            float: right;
            border: 0;
            background: transparent;
            width: 19%;
            margin: 0 0 0 4px;
            text-align: center;
            background: #c7ebfd;
            border-radius: 10px 10px 0 0px;
        }

            .tab-top .nav.nav-tabs li.active, .tab-top .nav.nav-tabs li:hover, .tab-top .nav.nav-tabs li:focus {
                background: orange;
            }

            .tab-top .nav.nav-tabs li a {
                padding: 12px 5px 10px 5px;
                color: #147cc6;
                font-weight: 600;
                font-size: 12px;
                line-height: 100%;
                text-transform: uppercase;
                border: 0;
                margin: 0;
                border-radius: 0;
            }

    .tab-top .nav-tabs > li.active > a, .tab-top .nav-tabs > li.active > a:hover, .tab-top .nav-tabs > li.active > a:focus {
        color: #fff;
        background-color: transparent;
        border: 0;
    }

    .tab-top .nav > li > a:hover, .tab-top .nav > li > a:focus {
        text-decoration: none;
        background-color: transparent;
        color: #fff;
    }

    .tab-top .tab-content {
        float: right;
        width: 100%;
    }

    .tab-top .tab-content {
        float: right;
        width: 100%;
        border-top: 0;
        border: 5px solid #50b6ff;
        border-radius: 15px 0 15px 15px;
        padding: 10px;
        background:#fff;
    }

#list-demo {
    border: 1px solid #ddd;
}

.email-img img {
    width: auto;
    max-width: none;
    height: 100%;
    margin: 0px auto;
    display: block;
}

.email-img {
    display: block;
    height: 200px;
    overflow: hidden;
}

.summary-box .dx-list-select-checkbox-container {
    display: none;
}

.list-description .date-text {
    padding: 0 0 0 10px;
    display: inline-block;
    vertical-align: middle;
    color: #c68b1e;
}

.summary-box .dx-item-content.dx-list-item-content {
    position: relative;
}

    .summary-box .dx-item-content.dx-list-item-content > .action-buttons {
        position: absolute;
        top: 12px;
        left: 20px;
    }

/*.listing-view p {
    width: 90%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}*/

.links {
    display: inline-block;
    text-decoration: underline;
    text-transform: capitalize;
}

.orange-text {
    color: #147cc6;
    font-weight: 600;
    text-transform: uppercase;
}

.list-left {
    width: 30%;
}

/*.bcart-info:nth-child(2n+1) {
    background: #c7ebfd;
}*/

.bcart-info {
    padding: 5px 10px;
    border-bottom: 1px solid #ccc;
}

    .bcart-info .list-right {
        font-weight: 600;
    }

.flag.flag-private {
    position: relative;
    right: -23px;
}

.disabled-userkey {
    cursor: not-allowed;
    pointer-events: none
}
/*********************************/
.tab-content .dx-checkbox {
    width: 20px !important;
    height: 20px !important;
    position: relative;
    top: 4px;
}

.tab-content .panel-heading .action-buttons {
    position: absolute;
    top: 2px;
    left: 15px;
}

.listing-view .action-buttons {
    position: absolute;
    top: 0;
    left: 70px;
}

.dx-scrollview-pull-down {
    padding: 15px 0 0 0;
}

.dx-list-item .dx-list-item-after-bag.dx-list-static-delete-button-container {
    width: 14px;
    position: relative;
    top: -23px;
    left: 13px;
    font-size: 14px;
}

    .dx-list-item .dx-list-item-after-bag.dx-list-static-delete-button-container .dx-button {
        border: 0;
        margin: 0;
        width: auto;
        background: transparent;
    }

        .dx-list-item .dx-list-item-after-bag.dx-list-static-delete-button-container .dx-button .dx-icon.dx-icon-remove {
            font-size: 14px;
            color: rgb(209, 91, 71);
            width: auto;
            height: auto;
        }

.input-box-right .dx-switch {
    height: auto !important;
}

.input-box-right.input-textarea-box {
    height: auto;
}

.note-editor.note-frame {
    height: 150px;
}

    .note-editor.note-frame .note-editing-area {
        height: 99px;
    }

#divtodo .btn-logout {
    padding: 5px 10px 7px 10px;
}

.calculation.grid-half .dx-rtl .dx-scrollable, .calculation.grid-half .dx-rtl.dx-scrollable {
    height: 126px !important;
    overflow-y: auto;
}

.calculation.grid-half .dx-scrollable-scrollbar.dx-scrollbar-horizontal {
    display: none;
}

.popup-md.popup-todo .dx-overlay-content {
    width: 1000px !important
}

.hide-listing-view {
    max-height: 24px;
   position: relative;
    width: 100%;
    overflow:hidden;
}

.listing-view {
    position: relative;
}

.more-content {
    color: #fff;
    background-color: #337ab7;
    border: 1px solid #2e6da4;
    padding: 0 15px 0 12px;
}
.listing-view.hide-listing-view .more-content::before {
    content: "\f175";
    position: absolute;
    font-family: FontAwesome;
    right: 5px;
    top: 1px;
}
.listing-view .more-content::before {
    content: "\f176";
    position: absolute;
    font-family: FontAwesome;
    right: 5px;
    top: 1px;
}

.listing-view ul {
    margin: 0;
}

.more-content:hover, .more-content:focus {
    background-color: #286090;
    border-color: #204d74;
}

.tabdisabled {
    background: #e8e8e8;
    opacity: 0.7;
    color: #147cc6;
    cursor: not-allowed;
    pointer-events: none;
}

.banner-lawyer {
    display: block;
    height: 575px;
    overflow: hidden;
    background: #e6f6ff;
}

    .banner-lawyer img {
        width: 100%;
    }

#TodoLIST .dx-datagrid-rowsview .dx-row > td {
    overflow: inherit;
}

.report-link {
    display: inline-block;
    vertical-align: middle;
    position: relative;
}

.report-content {
    display: none;
    position: absolute;
    border: 1px solid #e6e6e6;
    left: 0;
    width: 358px;
    top: 18px;
    border-radius: 4px;
    padding: 5px;
    z-index: 1;
    background: #50b6ff;
}

.report-info h5 {
    margin: 0 0 2px 0;
    font-size: 12px;
    color: #fff;
    font-weight: bold;
}

.report-info i {
    font-size: 15px !important;
    color: #fff;
}



/*************calculator css*******************/
.calculator {
    width: 100%;
    height: 320px;
    background-color: #c7ebfd;
    border-radius: 4px;
}

    .calculator td {
        padding: 5px;
    }

#display {
    width: 100%;
    height: 40px;
    text-align: right;
    background-color: #d2d2d2;
    font-size: 18px;
    left: 2px;
    top: 2px;
    color: #535353;
    border: 0;
    padding: 0 5px;
    border: 2px solid #4f4f4f;
}
    #display:hover, #display:focus {
        border-color: #147cc6 !important;
    }
.btnTop {
    color: white;
    background-color: #e79e19;
    font-size: 18px;
    margin: auto;
    width: 95px;
    height: 50px;
    border: 0;
}
.btnNum {
    color: white;
    background-color: #5aa0db;
    font-size: 18px;
    margin: auto;
    width: 95px;
    height: 50px;
    border: 0;
}

.btnMath {
    color: white;
    background-color: #68b768;
    font-size: 18px;
    margin: auto;
    width: 95px;
    height: 50px;
    border: 0;
}

.btnOpps {
    color: white;
    background-color: orange;
    font-size: 18px;
    margin: auto;
    width: 95px;
    height: 50px;
    border: 0;
}
/*.photo_select > ul li.keybox {
    margin-right: 70px;
}*/
.report-info a {
    margin-left: 8px;
}

    .report-info a .fa-check {
        color: #449d44;
    }

    .report-info a .fa-times {
        color: #d9534f;
    }

.email-highlist ul {
    margin: 0;
    padding: 15px;
    border: 2px dashed #147cc6;
    list-style: none;
    text-align: center;
    background: #c7ebfd;
}

    .email-highlist ul li {
        color: #147cc6;
        font-weight: 500;
        margin: 5px 0;
        font-size: 20px;
        text-shadow: 0 0 4px #5792bc;
    }

.btn-logout.btnbox-icon {
    height: 26px;
    display: inline-block;
    vertical-align: middle;
    margin-top: 5px;
    line-height: 25px;
    font-size: 12px;
}

    .btn-logout.btnbox-icon:hover, .btn-logout.btnbox-icon:focus {
        background: #9acde2;
        background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
        color: #fff;
    }

.control-label.onlylabel {
    padding-top: 8px;
    height: 36px;
}

.align-middle-box .btn-common {
    width: 100%;
    margin: 0 0 5px 0;
    border-radius: 7px;
    position: static;
}
.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span :focus {
    background: #e0e0e0;
}

.select-number {
    margin-top: -30px;
}

    .select-number.select-top-width {
        margin-top: -8px;
    }

#RP .dx-radiobutton {
    margin-left: 5px;
}

.margin-right-more {
    margin-right: 50px;
}

.checkbox-split .dx-checkbox {
    display: inline-block !important;
    vertical-align: middle;
    margin-left: 5px;
    width: 22%;
}

ul.listing.list-check li:after {
    content: "\f0a5";
}

.margin-right-35 {
    margin-right: 35px;
}

.inline-block {
    display: inline-block;
    vertical-align: middle;
    float: right;
}

    .inline-block .dx-checkbox-container {
        direction: inherit;
    }

    .inline-block .dx-checkbox-text {
        margin-left: 0;
        padding-left: 0;
        white-space: inherit;
        padding-right: 35px;
    }

.input-small-new {
    width: 100px;
}

.ibox-content.ibox-top-padding {
    margin-top: -20px;
}

.btn-img span {
    display: inline-block;
}
#TodoLIST .dx-datagrid-rowsview .dx-row > td {

 position:relative;}

    .lock-box-in .text-info {
        font-size: 14px;
        padding-left: 5px;
        color: #333;
        text-transform: capitalize;
        font-weight:normal;
    }
.lock-box-in {
    font-weight: bold;
    color: #337ab7;
    display: inline-block;
    vertical-align: top;
}
.list-description span {
    color: #337ab7;
    font-weight: bold;
}
#TodoLIST .dx-datagrid-headers {
    display: none;
}
/*************Beenu*******************/
ul.new-list_info {
    margin: 0;
    padding: 0;
    height: 408px;
    overflow: auto;
}


    ul.new-list_info li {
    }
ul.listing.infolist li {
    text-align: right;
    float: right;
}
.btn-link {
    font-weight: bold;
    text-decoration: underline;
}
/**************************************/
.todolist {
    margin: 0;
    padding: 0;
    list-style: none;
}
.todolist li {
display:inline-block; vertical-align:top;
}
    .todolist li a {
        color: #fff;
        line-height: 26px;
        display: block;
    }
#TodoLIST table td {
    padding: 5px 10px;

}
.list-description .table-label {
    width: 61px;
    padding: 0;
    font-weight: bold;
    text-transform: capitalize;
}
/*.status-box {
 width:75px; padding-right:10px;}
.priority-box {
    width: 63%;
    white-space: nowrap;
    overflow: hidden;
    height: 32px;
    text-overflow: ellipsis;
}*/
.todolist li:nth-child(1) {
    width: 40px;
}
.todolist li:nth-child(2) {
    width: 56px;
}
.todolist li:nth-child(3) {
    width: 75px;
}
.todolist li:nth-child(4) {
    width: 75px;
}
.todolist li:nth-child(5) {
    width: 75px;
}
.checkbox-grid {
    display: inline-block;
    vertical-align: top;
}
.text-info.low {
    width: 16px;
    height: 25px;
    background: #fff;
    border: 1px solid #147cc6;
    border-radius: 0;
    padding: 0;
    display: block;
    position: relative;
}
.text-info.medium {
    width: 16px;
    height: 25px;
    background: #fff;
    border: 1px solid #147cc6;
    border-radius: 0;
    padding: 0;
    display: block;
    position: relative;
}
.text-info.high {
    width: 16px;
    height: 25px;
    background: #fff;
    border: 1px solid #147cc6;
    border-radius: 0;
    padding: 0;
    display: block;
    position: relative;
}
    .text-info.low::before, .text-info.medium::before, .text-info.high::before {
        content: '';
        position: absolute;
        width: 10px;
        height: 5px;
        background: green;
        bottom: 2px;
        left: 2px;
    }
.text-info.medium::before {
    content: '';
    height: 11px;
}
.text-info.high::before {
    content: '';
    height: 19px;
}
.priority .text-info.low::before, .priority.text-info.medium::before, .priority .text-info.high::before {
    background: orange;
}
    /*.lock-box-in .low {
    background: green;
    border: 0;
    border-radius: 30px;
    padding: 0 8px 3px 8px;
    color: #fff;
    text-transform:capitalize;
}
.lock-box-in .medium {
    background: orange;
    border: 0;
    border-radius: 30px;
    padding: 0 8px 3px 8px;
    color: #fff;
    text-transform: capitalize;
}
.lock-box-in .high {
    background: #d83d3d;
    border: 0;
    border-radius: 30px;
    padding: 0 8px 3px 8px;
    color: #fff;
    text-transform: capitalize;
}*/
    .lock-box-in .low:hover, .lock-box-in .low:focus,
    .lock-box-in .medium:hover, .lock-box-in .medium:focus,
    .lock-box-in .high:hover, .lock-box-in .high :focus {
        color: #fff;
    }
.tab-top .nav.nav-tabs li a span {
    margin-left: 5px;
}
.tab-top .nav.nav-tabs li a span i {
    margin: 0px;
}
    .tab-top .nav.nav-tabs li a span:last-child {
     margin:0 3px 0 0;}

.big-image {
    border: 1px solid #147cc6;
    width: 32px;
    height: 32px;
    overflow: hidden;
    float: right;
    border-radius: 5px;
    position: relative;
}
.big-image img, .small-image img {
    width: 100%;
}
.photo-gallery {
 position:relative; float:right;}
.small-image {
    border: 1px solid #147cc6;
    width: 32px;
    height: 32px;
    overflow: hidden;
    float: right;
    border-radius: 50%;
}
.photobox-list {
    margin: 10px 0;
}
    .photobox-list a.count-info {
        width: 25px;
        height: 25px;
        line-height: 25px;
        text-align: center;
        background: #147cc6;
        border-radius: 50%;
        color: #fff;
        float: right;
        margin-top: 5px;
    }
.image-popover {
    position: absolute;
    width: 120px;
    border: 1px solid #147cc6;
    top: 0;
    right: 0;
    background: #e5e5e5;
    text-align: right;
}
ul.popoverlist {
    margin: 0;
    padding: 0;
    list-style: none;
}
ul.popover-list li {
    position: absolute;
    font-size: 15px;
    top: 0;
    right: 0;
    color: #147cc6;
}


#TodoLIST .dx-datagrid-rowsview .dx-row > td {
    padding: 0;
}
.list-tbl  {
    width:100%; border-collapse:collapse;
}
.thead-row {
    border: 0;
    background: #147cc6;
    height: 33px;
    padding: 0;
    font-weight: 600;
    position: relative;
    color: #fff;
}
.thead-col {
    padding: 0 10px;
    text-align: right;
    color:#fff;
    display: inline-block;
    vertical-align: middle;
    line-height:28px;
}
    .list-tbl .btn-success, .list-tbl .btn-success i {
        color: #fff;
    }
.tbody-col {
 display:inline-block; vertical-align:top; padding:5px 10px;}
.list-tbl thead {
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
}
#TodoLIST .dx-datagrid-rowsview.dx-last-row-border {
    border: 0;
}
.action-buttons { display:inline-block;
}
.meeting-person {
    color: #337ab7;
    font-weight: 600;
}
.report-info {
    text-align: right;
}
.col-one {
 width:35px;}
.col-two {
 width:10%;}
.col-three {
    width: 12%;
}
.col-four {
    width: 15%;
}
.col-five { width:24%;
}
.col-six {
    float: left; padding:2px 0 0 10px;
}
    .col-six .btn-sm {
        width: 29px;
        height: 28px;
        padding: 0;
        text-align: center;
        line-height: 28px;
        margin-right: 5px;
    }
        .col-six .btn-sm.btn {
            line-height:24px;
        }
        .col-seven {
            width: 35%;
        }
.large-img {
 display:none;}
.small-image:hover .large-img {
    display: block;
    border: 1px solid #147cc6;
    width: 40px;
    height: 40px;
    position: absolute;
    top: 0;
    z-index: 1;
    background: #fff;
    overflow:hidden;
}
.large-img img {
    max-width: inherit;
    width: auto;
    height: 100%;
}
.dx-datagrid {
    border-radius: 0 0 15px 15px;
}
.dx-overlay-content .dx-popup-title.dx-toolbar {
    border-bottom: 0;
}
.dx-overlay-modal .dx-popup-content {
    border: 5px solid #efd7ad;
    border-top: 0;
    border-radius: 0 0 15px 15px;
}
.dx-popup-wrapper.dx-overlay-modal > .dx-overlay-content {
    border-radius: 15px;
    box-shadow: none; 
}
.dx-popup-wrapper.dx-overlay-modal.popup-fullbox > .dx-overlay-content {
    direction: rtl;
}

.dx-popup-title.dx-toolbar {
    border-radius: 15px 15px 0 0;
}
.vsmall-width {
    width: 93px; margin-left:15px;
}
.list-tbl .thead-none {
   display:none;
}
#TodoLIST .dx-datagrid-rowsview {
  overflow:inherit;
} 
@media only screen and (max-width:1680px) {
    .btnTop, .btnNum, .btnMath, .btnOpps {
        width: 65px;
    }
}

@media only screen and (max-width:1366px) {
    .tab-top .nav.nav-tabs li a {
        padding: 12px 2px 10px 2px;
        font-size: 11px;
    }

    ul.new-list_info {
        width: 400px;
    }
   
}

/*bugfix .dx-widget.dx-rtl {
        direction: ltr;
}*/
#supportemailFrm .dx-widget.dx-rtl {
    direction: rtl;
}
.info-msg.info-percentage {
    direction: ltr;
}
.red-arrow {
    color: red;
}
.green-arrow {
    color: green;
}
.sa-confirm-button-container .confirm {
    background-color: #99e180 !important;
}
.sa-button-container .cancel {
    background-color:#f29f44 !important;
}
.sweet-alert .sa-icon.sa-warning {
    border-color: #f20f27;
}
.col-one span {
    background: #147cc6;
    display: inline-block;
    padding: 0px 6px;
    color: #fff;
}
.date-row .tbody-col {
    color: green;
    width: 20%;
}
.large-width {
    width: 320px;
}
.vsmall-width {width:45px;}

.childGrid .btn-logout.btn-common {
    position: static;
}

/***************************************/
.form-group.five-column {
    width: 20%;
    padding:0 15px;
}
.form-group.four-column {
    width: 25%;
    padding: 0 15px;
}
.box-section-top, .box-section-bottom {
    width: 100%;
    display: block;
}
.btn-box {
    margin-top:10px;
}
.btn-box .btn-logout.btn-common {
    position: static;
    margin: 0 0 0 10px;
}
.box-section-top .input-box-right {
    width: 110px;
    margin-left:10px;
}
.icon-right.number-leftspace {
    margin:0 15px 0 0;
}
.box-section-top.box-padding {
    padding: 23px 0 5px 0;
}
.form-group.form-full-width {
    width: 100%;
}

/********************************************/
.height-auto {
    height:auto;
}
/*.input-box-right #TEUR {
    width: 95%;
}*/
.btn-logout.btn-height {
    height: 30px;
    line-height: 30px;
    margin: 0;
}
.input-box-right #TEUR textarea.dx-texteditor-input {
    height: 75px !important;
}
a.ibtnDel.btn-danger {
    padding: 0;
    height: 28px;
    width: 30px;
    line-height: 26px;
}
#tabs.dx-tabpanel .dx-tab {
    width: 50%;
    white-space: inherit;
    display: inline-block;
}
#TransBingoGrid .dx-datagrid-header-panel {
    display: none;
}

.more-detail {
    float: right;
    width: 18%;
    background: #f9f9f9;
    border-radius: 20px;
    margin-left:10px;
}
    .more-detail .dx-accordion-item {
        height: 40px !important;
    }
    .more-detail .dx-accordion-item-title {
        font-size: 13px !important;
        font-weight: 500;
        /*background: #9acde2;
        background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);*/
        color: #fff;
        line-height: 100%;
        padding: 8px 10px;
        background: #9acde2;
        background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
    }
    
    .more-detail .dx-accordion-item-opened > .dx-accordion-item-title {
        background: #147cc6;
        background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: -webkit-linear-gradient(top,#147cc6 0%,#43aedf 100%);
        background: linear-gradient(to bottom,#147cc6 0%,#43aedf 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
    }
    .more-detail .dx-accordion-item.dx-state-hover .dx-accordion-item-title {
        background: #147cc6;
        background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
        background: -webkit-linear-gradient(top,#147cc6 0%,#43aedf 100%);
        background: linear-gradient(to bottom,#147cc6 0%,#43aedf 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
    }
    .more-detail .dx-accordion-item-body {
        padding: 0 !important;
    }
    .more-detail .dx-accordion-item.dx-item-selected {
        height: auto !important;
    }
.more-btn {
    border-radius: 4px;
    box-shadow: none;
    padding: 4px 10px;
    background: url(src/assets/images/menu-img.png) no-repeat;
    width: 100%;
    height: 49px;
    background-position: right top;
    line-height: 39px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    text-transform: uppercase;
    border: 0;
    display: block;
    text-align: right;
    box-shadow: none;
    margin: 5px 0;
    padding: 4px 18px;
}

#remarksNote .dx-accordion-item-body { position:relative;}

    #masterDetails .select-small .dx-texteditor {
        width: 186px !important;
    }
.bcard-info-right {
    float: right;
    width: 100%;
}
    .bcard-info-right .input-box-right {
        display: inline-block;
        width: 42%;
    }
.more-detail .dx-accordion {
    padding: 0 10px 10px 10px !important;
}
ul.option-list {
    margin: 0;
    padding: 0;
    list-style: none;
}
    ul.option-list li {
        padding: 3px 2px 0 0px;
    }
        ul.option-list li a {
            background: #c7ebfd;
            border: 0 none;
            border-radius: 4px;
            box-shadow: none;
            color: #333;
            height: auto;
            display: block;
            padding: 5px 12px 5px 4px;
        }
        ul.option-list li:hover a {
            background: #a2e0ff;
        }
        ul.option-list li:hover {
            background: transparent;
        }
.more-detail .dx-accordion-item {
    border: 0 !important;
    border-top-color: #ddd;
    border-bottom: 3px solid #fff !important;
}
.dashboard.bcard-dashboard {
    width: 80%; padding:0;
}
.bcard-dashboard #Mpid {
    left: 215px;
}
.bcard-dashboard .bcart-top .photo_select .dx-texteditor {
    width: 150px;
}
.bcard-dashboard .pagination > li > a, .bcard-dashboard .pagination > li > span {
    padding: 4px 8px;
}
.expand-all {
    padding: 0px;
    position: relative;
    margin: 0;
}
    .dx-accordion-item-title:before {
    font-weight: normal;
    color: #fff;
    content: "\f016";
    font-family: DXIcons;
    font-size: 12px;
    margin-left: 9px;
    margin-right: 0;
    line-height: 17px;
}
.expand-all:before {
    font-weight: normal;
    color: #fff;
    content: "\f014";
    font-family: DXIcons;
    font-size: 16px;
    margin-right: 0;
    background: #147cc6;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    display: inline-block;
    text-align: center;
    line-height: 25px;
    margin-top: -3px;
    margin-left: -10px;
}
    .expand-all.expand-active:before {
        content: "\f016";
    }
.bcard-dashboard .text-box ul li.floder-box {
    margin-left: 1px;
}
.bcard-dashboard .keybox .m-r10 {
    margin-right: 5px;
}
.bcard-dashboard .text-box li a .fa-key, .bcard-dashboard .text-box li a .fa-eraser,
.bcard-dashboard .next-row .fa-search, .bcard-dashboard .text-box .fa-list {
    padding: 0 6px;
    width: 25px;
}
/*.bcard-dashboard .bcart-top .photo_select .dx-texteditor#CODE {
    width: 75px;
}*/
.bcard-dashboard .bcart-top .photo_select .dx-texteditor#CLIENTTIKREF {
    width: 75px;
}
ul.option-list li .badge {
    float: left;
    background: #fff;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    color: #333;
    text-align: center;
    border: 0;
    line-height: 22px;
    font-size: 10px;
    margin-top: -2px;
    padding: 0;
}

.align-middle-box .btn-common span {
    margin: 0 auto;
    display: block;
    width: 100%;
    text-align: center;
}
    .align-middle-box .btn-common span img.pdf-icon {
        position: static;
        float: none;
    }
.overflow-txt .input-box {
    white-space: nowrap;
    text-overflow: ellipsis;
    /*overflow: auto;*/
}
.more-detail .dx-accordion-item-title:before {
    font-weight: normal;
    color: #fff;
    content: "\f016";
    font-family: DXIcons;
    font-size: 12px;
    margin-left: 9px;
    margin-right: 0;
    line-height: 17px;
}
.popup-sm .dx-overlay-content .photo_select.text-box {
    width: 100%;
    margin: 5px 0;
}

.background-fixed {
    position: relative;
}
.background-text.listing {
    position: absolute;
    z-index: 1;
    right: 25px;
    width: 100%;
    top: 35%;
    opacity:0.5;
}
.background-fixed .ibox-content {
    border-radius: 15px;
    border-top: 5px solid #50b6ff;
}
#perkofdata h4.heading {
    position: relative;
    z-index: 1;
    width: auto;
    float: left;
    text-align: inherit;
}
.togglebtn.btn-logout {
    float: left;
    padding: 5px 10px;
    margin: 0;
    position: absolute;
    left: 15px;
    top: -38px;
}
.home-hideshow-content .dashboard {
    width: 80%;
    padding: 0;
}
.home-hideshow-content.homepage-content.homeadd .about-top {
    width: 100%;
}
.home-hideshow-content.homepage-content.open .about-top {
    width: 66%;
}
.home-hideshow-content.homepage-content.open .dashboard {
    width: 100%;
}
.home-hideshow-content .btnshow.togglebtn.btn-logout {
    display: inline-block !important;
}
.home-hideshow-content .more-detail.open {
    width: 30px;
    background: #9acde2;
    background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
    position: relative;
    border-radius: 5px;
}
.home-hideshow-content.homepage-content.open .dashboard {
    width: calc(100% - 40px);
}


.home-hideshow-content.homepage-content.homeadd .about-top {
    width: calc(100% - 30px);
}
.home-hideshow-content.homeadd .summary-box {
    width: 30px;
    padding: 0;
    background: #9acde2;
    background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
    position: relative;
    border-radius:5px;
}
    .home-hideshow-content.homeadd .summary-box .tab-top {
        opacity: 0;
    }

.homepage-content.home-hideshow-content button.togglebtn {
    border: 0;
    color: #fff;
    width: 100%;
    padding: 0px 10px;
    font-size: 30px;
    height: 100%;
    line-height: 28px;
    margin-bottom: 5px;
    border-radius: 5px;
    background: transparent;
    position: absolute;
    z-index: 1;
    display: block;
    top: 50%;
    transform: translate(0, -50%);
}
.home-hideshow-content button.togglebtn:hover, .home-hideshow-content button.togglebtn:focus {
    outline: none;
}
.home-hideshow-content .more-detail {
    position: relative;
}
    .home-hideshow-content .more-detail.open .ibox-title, .home-hideshow-content .more-detail.open #accordion {
        opacity: 0;
    }
.home-hideshow-content .summary-box.open {
    width: 30px;
    padding: 0;
    border-radius:5px;
}


.home-hideshow-content.homepage-content.homeadd.openleft .about-top {
    width: calc(100% - 34%);
}
    .home-hideshow-content.homepage-content.homeadd.openleft .about-top .dashboard.bcard-dashboard {
        width: calc(100% - 40px);
    }
.home-hideshow-content.homeadd.openleft .summary-box {
    width: 33%;
    background: transparent;
}
    .home-hideshow-content.homeadd.openleft .summary-box .tab-top {
        opacity: 1;
    }
.home-hideshow-content.homeadd.openleft button.togglebtn {
    position: static;
    background: #9acde2;
    background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
}
.home-hideshow-content.homeadd.openleft .open button.togglebtn {
    background: transparent;
}
.home-hideshow-content.homepage-content.homeadd .more-detail button.togglebtn {
    position: static;
    background: #9acde2;
    background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
    transform:none;
}
.home-hideshow-content.homepage-content.homeadd.openleft .more-detail button.togglebtn {
    background: transparent;
    position: absolute;
    transform: translate(0, -50%);
}
.home-hideshow-content.homepage-content.openleft .dashboard {
    width: calc(100% - 40px);
}
.homepage-content button.togglebtn { display:none;}
.togglebtn i.fa-chevron-circle-left {
    color: #fff;
    position: relative;
    left: 8px;
}
.togglebtn i.fa-chevron-circle-right {
    color: #fff;
    position: relative;
    right: -8px;
}
.dx-popup-content .text-box ul li:first-child {
    width: 90px;
}
#popupTikref .dx-overlay-content .dx-popup-content {
    border: 5px solid #43aedf;
}
.dx-popup-content .text-box ul li {
    width: calc(100% - 95px);
    margin: 0;
}
.dx-popup-content .text-box ul li .dx-texteditor {
    width: 100%;
}
#errorNotice {
    background-color: #f2dede;
}
#errorNotice a.close {
    right: -4px;
}
.tikref-innerbox {
    background: #fff7ea;
    margin: -20px;
    padding: 20px;
}
#Bcard2Grid {
    overflow: auto;
}

.dx-rtl .dx-datagrid-content .dx-datagrid-table {
    width: 100%;
}
.dx-rtl[aria-label="Data grid"] {
    direction: ltr;
}
.PerkofOpopUpOnBcard .head-color h4.heading {
    text-align: right;
}


@media all and (-ms-high-contrast:none) {
    /* IE10 */
    /*::-ms-backdrop, .dx-overlay-modal.dx-popup-wrapper > .dx-overlay-content {
        right: 0;
        direction: rtl;
    }*/

    
    /**::-ms-backdrop, .dx-overlay-wrapper.popupIEOnly {
        right: 0;
    }
    *::-ms-backdrop, .dx-overlay-modal.dx-popup-wrapper > .dx-overlay-content {
        right: 0;
        direction: rtl;
    }

    *::-ms-backdrop, .popupIEOnly .dx-overlay-shader {
        direction: ltr;
    }


    ::-ms-backdrop, .dx-popup-wrapper.dx-overlay-modal.popupIEOnly > .dx-overlay-content {
        right: 0;
        direction: ltr;
    }*/
    /*::-ms-backdrop, #RemarkspopUp .dx-popup-content, ::-ms-backdrop, .dx-overlay .dx-popup-content {
        direction: ltr;
    }*/

    ::-ms-backdrop, .PerkofOpopUpOnBcard .dx-popup-content {
        direction: ltr;
    }
    ::-ms-backdrop, .PerkofOpopUpOnBcard .head-color h4.heading {
        text-align:right;
    }
    ::-ms-backdrop, #CommanchildGridPopup .dx-overlay-modal.dx-popup-wrapper > .dx-overlay-content {
        right: inherit !important;
        direction: rtl !important;
    }

    /*  IE11 */

        ::-ms-backdrop, .dx-overlay-modal.dx-popup-wrapper > .dx-overlay-content [aria-label='Data grid'].dx-rtl {
            direction:rtl;
        }
}

/*css added by devendra jain on 25-6-19*/
#accordion-container ul.option-list li{ padding-right:0;}
#accordion-container ul.option-list li.divider {
    height: 4px;
    padding: 0;
}
#divAccordion .dx-item-content.dx-accordion-item-title {
    border-radius: 15px 15px 0px 0px;
    font-size: 16px !important;
    font-weight: 700;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    [aria-label='Data grid'].dx-rtl#BmmBaseGRID {
        direction: rtl;
    }
}


.basicperofbtn {
    margin-right: -4px;
    text-align: center;
    padding: 2px 0;
}
div#DESCRIPTION {
    width: 75%;
    float: right;
}
.desc-btn {
    float: left;
    margin: 0 15px 0 0;
}
input.dx-texteditor-input {
    height: 28px !important;
    border: 1px solid #ccc ;
    border-radius: 4px;
    padding-top: 0;
    padding-bottom: 0;
    color: #333;
    text-align: right;
    direction: rtl;
}
.readable-text {
    width: 40px;
}
.shift-add-button.form-in-content h4.heading {
    text-align: right;
}
@media (max-width:1399px){
    .pagination > li > a, .pagination > li > span {
        padding: 3px 6px !important;
    }
    .text-box ul li{margin-left:4px;}
    .photo_select .dx-texteditor {
        width: 100px !important;
    }
    .next-row .fa-search, .text-box .fa-list {
        padding: 0 7px !important;
        width: 26px!important;
    }
}

video::-webkit-media-controls-fullscreen-button {
    display: none;
}
.dx-overlay-wrapper {
    z-index: 1700 !important;
}

#MasterpopUp .dx-state-invisible { display:block !important;
}
#CommanchildGridPopup {
    position: relative;
    z-index: 9999;
}

.dx-datagrid {
    float: left;
}
.validation-message {
    color: #ed5565;
}

/***************GID HOME PAGE START******************/
.header {
    border-bottom: 1px solid #f4f4f4;
    padding: 15px 0;
}
.rowmargin {
    display: flex;
}
.profile-icon {
    width: 28px;
    height: 28px;
    display: inline-block;
    vertical-align: middle;
    background: #337ab7;
    border-radius: 50%;
    text-align: center;
    color: #fff;
    font-size: 14px;
    line-height: 28px;
    margin-left: 5px;
}
.profile-icon:hover, .profile-icon:focus {
    color: #fff;
}
.header_left label {
    padding: 0;
    display: inline-block;
    vertical-align: middle;
}

.Logout, .get-it-btn, .Login {
    background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
    border: 0 none;
    border-radius: 4px;
    box-shadow: none;
    color: #fff;
    padding: 0 10px;
    width: auto;
    height: 28px;
    line-height: 25px;
    display: inline-block;
    vertical-align: middle;
    text-transform: capitalize;
}
.Logout:hover, .Logout:focus,
.get-it-btn:hover, .get-it-btn:focus,
.Login:hover, .Login:focus {
    background: #147cc6;
    color: #fff;
    background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: -webkit-linear-gradient(top,#147cc6 0%,#43aedf 100%);
    background: linear-gradient(to bottom,#147cc6 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
}
.Login { margin: 0 0 0 5px; }
.text_field {
    display: inline-block;
    vertical-align: middle;
}
.body-content-in { padding: 50px 30px; }
.logo_GID {
    width: 150px;
    height: 150px;
    display: block;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 0 10px #eee;
    border-radius: 50%;
}
.logo_GID img {
    width: auto;
    text-align: center;
    display: block;
    margin: 0 auto;
    padding-top: 30px;
}
.content-boxes {
    margin: 30px auto;
    text-align: center;
    width: 1000px;
}
.content-cols {
    height: 200px;
    box-shadow: 0 0 10px #eee;
    border-radius: 10px;
    float: left;
    width: 32%;
    margin-right: 20px;
    margin-bottom: 20px;
}
.content-cols:nth-child(3n) { margin-right: 0; }
.content-cols span {
    display: block;
    height: 150px;
    border-radius: 10px 10px 0 0;
    padding-top: 35px;
}
.blue-box span {background: #4285f4;}
.red-box span {background: #ee4333;}
.yellow-box span {background: #fbbc05;}
.content-cols label {
    padding: 10px;
    display: block;
    font-size: 20px;
    border-radius: 0 0 10px 10px;
    background: #fff;
}
.delay-1 {
animation-delay: .25s;
}
.delay-2 {
animation-delay: .5s;
}
.delay-3 {
animation-delay: .75s;
}
.delay-4 {
animation-delay: 1s;
}
.delay-5 {
animation-delay: 1.2s;
}
.footer-newtop {
    border-top:1px solid #f4f4f4;
    padding: 15px 0;
    position: fixed;
    bottom: 0;
    width: 100%;
    background: #fff;
    z-index: 1;
}
.footer-newtop p {margin: 0;}
.footer-left { text-align: right; }
.footer-center { text-align: center; }
.footer-right { text-align: left; }
.body-content {
    padding-bottom: 55px;
}
.header_left .text_field {
    width: 180px;
}
/***************GID HOME PAGE END******************/

/***************INNER PAGE START******************/
.innerheader-up {
    background: #006a9a;
    padding: 10px;
}
.inner-hright a {
    background: #f9f9f9;
    width: 150px;
    padding: 8px 20px;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    margin-right: 10px;
}
.inner-hright a img {
    width: 40px;
    margin: 0 auto;
}
.inner-hright label {
    color: #fff;
    font-size: 16px;
    padding: 0;
}
.inner-hcenter h2 {
    font-size: 20px;
    text-align: center;
    color: #fff;
    font-weight: bold;
    margin: 0;
    padding-top: 13px;
}
.inner-hleft a {
    color: #fff;
    padding: 0px 5px 0 8px;
    line-height: 16px;
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    margin-top: 18px;
    position: relative;
}
.inner-hleft a:before {
    content: '';
    position: absolute;
    height: 16px;
    left:0;
    top:2px;
    background: #fff;
    width: 1px;
}
.inner-hleft a:last-child:before { display: none; }
.innerheader_center {
    text-align: center;
}
.innerheader_center h4 {
    display: inline-block;
    vertical-align: middle;
}
.header-input {
    display: inline-block;
    vertical-align: middle;
    margin: 0 10px 0 0;
    width: 150px;
}
.header-input span {
    position: absolute;
    right: 10px;
}
.header-input .form-control {
    height: 28px !important;
    border: 1px solid #ccc ;
    border-radius: 4px;
    padding: 0 40px 0 0;
    color: #333;
    text-align: right;
    direction: rtl;
    font-weight: normal;
}
.header-check {
    display: inline-block;
    vertical-align: middle;
}
.innerheader-bottom {
    padding: 10px 0;
}


.header-check input[type=checkbox]:not(old){
  /*width     : 2em;*/
  margin    : 0;
  padding   : 0;
  font-size : 1em;
  opacity   : 0;
}

.header-check input[type=checkbox]:not(old) + label{
  display      : inline-block;
  margin-left  : -2em;
  line-height  : 1.5em;
}

.header-check input[type=checkbox]:not(old) + label > span {
  display          : inline-block;
  margin           : 0 0 0 10px;
  width: 22px;
  height: 22px;
  border-radius: 2px;
  border: 1px solid #ddd;
  background-color: #fff;
  vertical-align   : bottom;
}

.header-check input[type="checkbox"]:not(old):checked + label > span::before {
    content: '✓';
    display: block;
    width: 20px;
    color: #337ab7;
    font-size: 18px;
    line-height: 22px;
    text-align: center;
    font-weight: bold;
}


/***************INNER PAGE END******************/





/* CSS Document */

* { margin: 0; padding: 0; list-style: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box }
img { max-width: 100%; height: auto; outline: 0; vertical-align: middle }
body, html {  font-family: 'Ubuntu', sans-serif; }
a, a:focus { outline: 0 }
a:focus, a:hover { text-decoration: none }
a { text-decoration: none }
h1, h2, h3, h4, h5, h6, ol, p, ul { margin: 0; padding: 0 }
h1 { font-size:45px; line-height:55px; font-weight: 600; color: #fff; text-align: left; }
h2 { font-size: 40px; line-height: 32px; font-weight:400; color: #333 }
h3 { font-size: 32px; color: #036db7; font-weight: 600 }
h4 { font-size: 22px; color: #333; line-height:30px; }
p { color: #404041; line-height:28px;}
ul li { list-style: none }
/* common css */

header {
    /* padding: 20px 0px; */
    box-shadow: 0 0 6px rgba(0,0,0,0.2);
}

header .container {
    max-width: 1670px;
    width: 100%;
    margin: 0 auto;
}

.headerIn ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
}
.headerIn ul li {
    margin-left: 25px;
}

.usercls {width:40px;height: 40px;border:1px solid #757575;border-radius:50%;    display: inline-block;
    text-align: center;
    color: #757575;
    font-size: 20px;
    line-height: 35px}

    .headerIn ul li a{position: relative;}

    .downarrwo {
        color: #757575;
        font-size: 20px;
        margin-left: 10px;
    }

    a.logincls {
      width: 100px;
              text-align: center;
        height: 40px;
        line-height: 40px;
        border-radius: 5px;
        border: 1px solid #757575;
        display: inline-block;
        font-size: 20px;
        color: #757575;
    }

    .midSection {
        padding: 50px 0px 100px 0px;
        overflow: hidden;
        background: rgb(234,243,246);
        background: -moz-linear-gradient(left, rgba(234,243,246,1) 0%, rgba(180,197,214,1) 100%);
        background: -webkit-linear-gradient(left, rgba(234,243,246,1) 0%,rgba(180,197,214,1) 100%);
        background: linear-gradient(to right, rgba(234,243,246,1) 0%,rgba(180,197,214,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eaf3f6', endColorstr='#b4c5d6',GradientType=1 );
    }
.GIDHomeIn{position: relative; max-width:920px; width:100%; height:800px; margin:0 auto; background:url(../images/roundbase.png)center center no-repeat;}


.gidCircle{width:230px; height: 230px;text-align: center; border-radius:50%;box-shadow: 0 0 10px #eee; display: inline-block;    border: 12px solid #fff;    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;}

.gradient{
    background: -moz-linear-gradient(top,  rgba(101,101,101,0.2) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(101,101,101,0.2) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(101,101,101,0.2) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#656565', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */ 
    }
.gidlogo{background:url(../images/circleArrow.png)center center no-repeat; width: 190px; height: 190px;    border: 5px solid #fff; line-height:160px;background-size: cover;}
.whitebg{background-color:#fff;}

.centercls{position: absolute; top: 50%;left:50%; transform: translate(-50%, -50%);}
.GIDHomeIn a .circletext {
    display: block;
    
}
.GIDHomeIn a:hover {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
    -ms-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
    -o-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
}
.circletext {
    font-size: 20px;
    color: #585858;
    display: block;
    margin-top: 10px;
}


.management,
.bingo,
.calendar,
.contract,
.accounting{  position: absolute;}


.management {
    right: 15.8%;
    top: 9%;
}
.bingo {
    right: 2%;
    top: 53.6%;
}

.calendar {
    right: 38%;
    top: auto;
    bottom: 0%;
}

.contract {
    right: auto;
    left: 5%;
    top: auto;
    bottom: 23%;
}

.accounting {
    right: auto;
    left: 14%;
    top: 10%;
    bottom: auto;
}



  .tooltips {
        visibility: hidden;
        width:300px;
        background-color:#fff;
        color: #585858;
        text-align: center;
        border-radius: 6px;
        padding: 5px 0;
        position: absolute;
        z-index: 1;
        top: -5px;
        left: 120%;
        box-shadow: 0 0 10px #eee;
        font-size: 18px;
        line-height: 28px;
        text-align: left;
        padding:15px;
    
      }
      
      .tooltips::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 100%;
        margin-top: -5px;
        border-width:10px;
        border-style: solid;
        border-color: transparent #fff transparent transparent;
      }
      .GIDHomeIn a:hover .tooltips {
        visibility: visible;
      }

     
/* CSS Document */
html{direction: rtl;}
* { margin: 0; padding: 0; list-style: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box }
img { max-width: 100%; height: auto; outline: 0; vertical-align: middle }
body, html {  font-family: 'Ubuntu', sans-serif; }
a, a:focus { outline: 0 }
a:focus, a:hover { text-decoration: none }
a { text-decoration: none }
h1, h2, h3, h4, h5, h6, ol, p, ul { margin: 0; padding: 0 }
h1 { font-size:45px; line-height:55px; font-weight: 600; color: #fff; text-align: left; }
h2 { font-size: 40px; line-height: 32px; font-weight:400; color: #333 }
h3 { font-size: 32px; color: #036db7; font-weight: 600 }
h4 { font-size: 22px; color: #333; line-height:30px; }
p { color: #404041; line-height:28px;}
ul li { list-style: none }
/* common css */
/* .midSection{max-width: 900px;margin: 0 auto; display: block;} */
.ibox-title{
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    color: #fff;
    margin-bottom: 0;
    min-height: 33px;
    padding: 2px 15px;
    background: #9acde2;
    background: -moz-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: -webkit-linear-gradient(top,#9acde2 0%,#43aedf 100%);
    background: linear-gradient(to bottom,#9acde2 0%,#43aedf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9acde2',endColorstr='#43aedf',GradientType=0);
    position: relative;
}
.ibox-title h5 {
    display: inline-block;
    float: none;
    font-size: 17px;
    font-weight: 700;
    margin: 0;
    padding: 5px 0 0 0;
    text-overflow: ellipsis;
    vertical-align: middle;
    width: 98%;
}
.social_sc {
    display: inline-block;
    float: none;
    position: absolute;
    left: 10px;
    top: 1px;
}
.ibox-content {
    background-color: #fff;
    color: inherit;
    padding: 8px 0 0 0;
    border: 5px solid #50b6ff;
    border-radius: 0 0 15px 15px;
    border-top: 0;
    display: inline-block;
    width: 100%;
}
.control-label{
    float: right;
    padding-right: 0;
    direction: rtl;
}
.form-group {
    margin-bottom: 8px;
    float: right;
}
label {
    color: #333;
    font-size: 14px;
    margin: 0;
    padding-top: 4px;
    font-weight: 400;
    font-family: Arial,sans-serif;
}
input.dx-texteditor-input,
select.dx-texteditor-input,
textarea.dx-texteditor-input{
    height: 28px !important;
    border: 1px solid #ccc ;
    border-radius: 4px;
    padding-top: 0;
    padding-bottom: 0;
    color: #333;
    text-align: right;
    direction: rtl;
    width: 100%;
    padding-left: 5px;
    padding-right: 5px;
}
textarea.dx-texteditor-input{height: auto !important;}
.flex{display: flex;}
.btn{height: 28px;
padding: 1px 12px;}
.checkbox-inline ,
.radio-inline{position: relative;padding-right: 20px;}
.checkbox-inline input,
.radio-inline input{position: absolute;right: 0px;}
.btn-group{margin-bottom: 10px;}
.table{margin-bottom: 8px;}
table th{text-align: right}
.pl-15{padding-left: 15px;}


/* dash board suit */

header {
    /* padding: 20px 0px; */
    box-shadow: 0 0 6px rgba(0,0,0,0.2);
    background:#fff;
}

header .container {
    max-width: 1670px;
    width: 100%;
    margin: 0 auto;
}

.headerIn ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
}
.headerIn ul li {
    margin-left: 25px;
}

.usercls {width:40px;height: 40px;border:1px solid #757575;border-radius:50%;    display: inline-block;
    text-align: center;
    color: #757575;
    font-size: 20px;
    line-height: 35px}

    .headerIn ul li a{position: relative;}
    .container.headerIn {
        padding-top: 15px;
    }
    .downarrwo {
        color: #757575;
        font-size: 20px;
        margin-left: 10px;
    }

    a.logincls {
      width: 100px;
              text-align: center;
        height: 40px;
        line-height: 40px;
        border-radius: 5px;
        border: 1px solid #757575;
        display: inline-block;
        font-size: 20px;
        color: #757575;
    }

    .midSection {
        padding:0px;
        overflow: hidden;
        background: rgb(234,243,246);
        background: -moz-linear-gradient(left, rgba(234,243,246,1) 0%, rgba(180,197,214,1) 100%);
        background: -webkit-linear-gradient(left, rgba(234,243,246,1) 0%,rgba(180,197,214,1) 100%);
        background: linear-gradient(to right, rgba(234,243,246,1) 0%,rgba(180,197,214,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eaf3f6', endColorstr='#b4c5d6',GradientType=1 );
        
    }
    a.gidCircle.gradient.whitebg.centercls.gidlogo img {
        margin-top: 15px;
    }
    .GIDInner {
        /* position: absolute;
        left: 50%;
        top: 45%;
        transform: translate(-50%, -50%);
        width: 100%; */
    }
.GIDHomeIn{position: relative; max-width:920px; width:100%; height:800px; margin:0 auto; background:url(../images/roundbase.png)center center no-repeat;transform: scale(0.8);
-webkit-transform: scale(0.8);-moz-transform: scale(0.8);-ms-transform: scale(0.8);-o-transform: scale(0.8);}


.gidCircle{width:230px; height: 230px;text-align: center; border-radius:50%;box-shadow: 0 0 10px #eee; display: inline-block;    border: 12px solid #fff;    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;}

.gradient{
    background: -moz-linear-gradient(top,  rgba(101,101,101,0.2) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(101,101,101,0.2) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(101,101,101,0.2) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#656565', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */ 
    }
.gidlogo{background:url(../images/circleArrow.png)center center no-repeat; width: 190px; height: 190px;    border: 5px solid #fff; line-height:160px;background-size: cover;}
.whitebg{background-color:#fff;}

.centercls{position: absolute; top: 50%;left:50%; transform: translate(-50%, -50%);}
.GIDHomeIn a .circletext {
    display: block;
    
}
.GIDHomeIn a:hover {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
    -ms-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
    -o-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
}
.circletext {
    font-size: 20px;
    color: #585858;
    display: block;
    margin-top: 10px;
}


.management,
.bingo,
.calendar,
.contract,
.accounting{  position: absolute;}


.management {
    right: 15.5%;
    top: 10%;
}
.management.disable-box {opacity:1 !important;}
a.gidCircle.gradient.whitebg.management.disable-box {
    position: relative;
}
a.gidCircle.gradient.whitebg.management.disable-box:after {
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.4);
    width: 100%;
    height: 100%;
    content: "";
    border-radius: 50%;
}


.blurcls:after {
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.4);
    width: 100%;
    height: 100%;
    content: "";
    border-radius: 50%;
    cursor: not-allowed;
}

.bingo {
    right: 2%;
    top: 53.6%;
}

.calendar {
    right: 38%;
    top: auto;
    bottom: 0%;
}

.contract {
    right: auto;
    left: 5%;
    top: auto;
    bottom: 23%;
}

.accounting {
    right: auto;
    left: 14%;
    top: 10%;
    bottom: auto;
}



  .tooltips {
        visibility: hidden;
        width:300px;
        background-color:#fff;
        color: #585858;
        text-align: center;
        border-radius: 6px;
        padding: 5px 0;
        position: absolute;
        z-index: 1;
        top: -5px;
        left: 120%;
        box-shadow: 0 0 10px #eee;
        font-size: 18px;
        line-height: 28px;
        text-align: left;
        padding:15px;
    
      }
      
      .tooltips::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 100%;
        margin-top: -5px;
        border-width:10px;
        border-style: solid;
        border-color: transparent #fff transparent transparent;
      }
      .GIDHomeIn a:hover .tooltips {
        visibility: visible;
      }

      .inputfieldin{ display:-webkit-box;display:-ms-flexbox;display:flex;}
      .inputfieldin label {
        max-width: 80px;
        width: 100%;
        margin-right: 10px;
    }