@import url('https://fonts.googleapis.com/css?family=Nunito');
@import url('https://fonts.googleapis.com/css?family=Poiret+One');

body, html {
    background-repeat: no-repeat;
    /*background-image: url('images/pattern.jpg');*/
}

.account-box {
    /*width:20%;
    margin-left: 40%;
    margin-top: 13%;
    border: 2px solid rgba(153, 153, 153, 0.75);
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    -o-border-radius: 2px;
    z-index: 3;
    font-size: 13px !important;
    font-family: "Helvetica Neue" ,Helvetica,Arial,sans-serif;
    background-color: #ffffff;
    padding: 20px;*/
    width: 50%;
    align-content: center;
    text-align: center;
    margin-left: 23%;
    margin-top: 13%;
    border: 2px solid rgba(153, 153, 153, 0.75);
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    -o-border-radius: 2px;
    z-index: 3;
    font-size: 13px !important;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    background-color: #ffffff;
    padding: 60px;
}

.logo {
    width: 138px;
    height: 30px;
    text-align: center;
    margin: 10px 0px 27px 40px;
    background-position: 0px -4px;
    position: relative;
}

.forgotLnk {
    margin-top: 10px;
    display: inline-block;
}

.purple-bg {
    background-color: #6E329D;
    color: #fff;
}

.or-box {
    position: relative;
    border-top: 1px solid #dfdfdf;
    padding-top: 20px;
    margin-top: 20px;
}

.or {
    color: #666666;
    background-color: #ffffff;
    position: absolute;
    text-align: center;
    top: -8px;
    width: 40px;
    left: 90px;
}

.account-box .btn:hover {
    color: #fff;
}

.btn-facebook {
    background-color: #3F639E;
    color: #fff;
    font-weight: bold;
}

.btn-google {
    background-color: #454545;
    color: #fff;
    font-weight: bold;
}

.notice {
    padding: 15px;
    background-color: #fafafa;
    border-left: 6px solid #7f7f84;
    margin-bottom: 10px;
    -webkit-box-shadow: 0 5px 48px -6px rgba(0,0,0,.2);
    -moz-box-shadow: 0 5px 48px -6px rgba(0,0,0,.2);
    box-shadow: 0 5px 48px -6px rgba(0,0,0,.2);
}

.notice-sm {
    padding: 10px;
    font-size: 80%;
}

.notice-lg {
    padding: 35px;
    font-size: large;
}

.notice-success {
    border-color: #80D651;
}

    .notice-success > strong {
        color: #80D651;
    }

.notice-info {
    border-color: #45ABCD;
}

    .notice-info > strong {
        color: #45ABCD;
    }

.notice-warning {
    border-color: #FEAF20;
}

    .notice-warning > strong {
        color: #FEAF20;
    }

.notice-danger {
    border-color: #d73814;
}

    .notice-danger > strong {
        color: #d73814;
    }

/*salman
*/

.align-middleCol {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.align-middleRow {
    position: absolute;
    width: 100%;
    height: 100%;
    display: table;
}

.left-section-registration, .right-section-registration {
    float: left;
    max-width: 535px;
    padding: 117px 50px 0 40px;
    width: 100%;
    text-align: left;
}

.contant-inner-registration {
    max-width: 1085px;
    width: 100%;
    margin: auto;
}

.registration-btn {
    margin: 30px 0 0;
}


    .registration-btn a {
        background: #fcb040;
        padding: 23px 0;
        display: inline-block;
        width: 100%;
        border: 1px solid #91afd3;
        border: none;
        color: #fff;
        font-size: 19px;
    }

.btn-info, .btn-primary, .btn-success, .btn-warning, .btn-danger, .btn-gray, .btn-browse {
    color: #fff;
    font-size: 16px;
    text-align: center;
    padding: 8px 20px;
    min-width: 120px;
    position: relative;
}

.btn-success {
    background-image: linear-gradient(to bottom, #fcb040 0%, #fcb040 100%) !important;
    background-repeat: no-repeat !important;
    background-color: #fcb040 !important;
    border-color: #fcb040 !important;
}

.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}

.registration-btn a:hover, .registration-btn a:focus {
    background: #cf9020;
}

.btn.focus, .btn:focus, .btn:hover {
    color: #333;
    text-decoration: none;
}
/*salman*/

/*chandru*/
@-webkit-keyframes spaceboots {
    0% {
        -webkit-transform: translate(2px, 1px) rotate(0deg);
    }

    10% {
        -webkit-transform: translate(-1px, -2px) rotate(-1deg);
    }

    20% {
        -webkit-transform: translate(-3px, 0px) rotate(1deg);
    }

    30% {
        -webkit-transform: translate(0px, 2px) rotate(0deg);
    }

    40% {
        -webkit-transform: translate(1px, -1px) rotate(1deg);
    }

    50% {
        -webkit-transform: translate(-1px, 2px) rotate(-1deg);
    }

    60% {
        -webkit-transform: translate(-3px, 1px) rotate(0deg);
    }

    70% {
        -webkit-transform: translate(2px, 1px) rotate(-1deg);
    }

    80% {
        -webkit-transform: translate(-1px, -1px) rotate(1deg);
    }

    90% {
        -webkit-transform: translate(2px, 2px) rotate(0deg);
    }

    100% {
        -webkit-transform: translate(1px, -2px) rotate(-1deg);
    }
}

.log-status {
    -webkit-animation-name: spaceboots;
    -webkit-animation-duration: 0.8s;
    -webkit-transform-origin: 50% 50%;
    -webkit-animation-iteration-count: 0.7;
    -webkit-animation-timing-function: linear;
}

.error-disturbance .form-control {
    border: solid 2px;
    border-color: #ed1c24;
}

.success-disturbance .form-control {
    border-color: #ccc;
    border: solid 0px;
}

.success-disturbance-policy .form-control {
    border: 1px solid #ccc;
    border-color: #ccc !important;
}

/*loader*/
.loader {
    position: fixed;
    top: calc(50% - 32px);
    left: calc(50% - 32px);
    width: 64px;
    height: 64px;
    border-radius: 50%;
    perspective: 800px;
    z-index: 2;
}

.inner {
    position: absolute;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

    .inner.one {
        left: 0%;
        top: 0%;
        animation: rotate-one 1s linear infinite;
        border-bottom: 3px solid #ffc107;
    }

    .inner.two {
        right: 0%;
        top: 0%;
        animation: rotate-two 1s linear infinite;
        border-right: 3px solid #ffc107 !important;
    }

    .inner.three {
        right: 0%;
        bottom: 0%;
        animation: rotate-three 1s linear infinite;
        border-top: 3px solid #ffc107;
    }

@keyframes rotate-one {
    0% {
        transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
    }

    100% {
        transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
    }
}

@keyframes rotate-two {
    0% {
        transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
    }

    100% {
        transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
    }
}

@keyframes rotate-three {
    0% {
        transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
    }

    100% {
        transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
    }
}

#loading-bar .bar {
    background-color: #ffc107 !important;
}

#loading-bar-spinner .spinner-icon {
    width: 18px;
    height: 18px;
    border: solid 4px transparent;
    border-top-color: #ffc107 !important;
    border-left-color: #ffc107 !important;
    border-radius: 10px;
}
/*backdrop*/
.backdrop {
    position: fixed;
    background: black;
    opacity: 0.6;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.tooltips {
    position: relative;
    display: inline-block;
    /*border-bottom: 1px dotted black;*/
}

    .tooltips .tooltiptext {
        visibility: hidden;
        width: 120px;
        background-color: #23527c;
        color: #fff;
        text-align: center;
        border-radius: 6px;
        padding: 5px 0;
        position: absolute;
        z-index: 1;
        /*bottom: 125%;*/
        top: 185%;
        left: 0%;
        margin-left: -90px;
        opacity: 0;
        transition: opacity 0.3s;
    }

        .tooltips .tooltiptext::after {
            content: "";
            position: absolute;
            top: -9%;
            left: 80%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: transparent transparent #23527c transparent;
        }

/*.tooltips:hover .tooltiptext {
            visibility: visible;
            opacity: 1;
        }*/

/*.onhover:hover {
        background-color: #fbb33d;
    }*/

.onhover {
    cursor: pointer;
    padding: 7px;
    height: 27px;
}

.cover {
    padding: 24px 60px 18px 60px;
    position: absolute;
    bottom: 87px;
}

.termsandcond.tooltiptext {
    visibility: visible;
    opacity: 1;
    top: -270%;
    margin-left: -140px;
}

    .termsandcond.tooltiptext::after {
        top: 70%;
        margin-left: 16%;
        border-width: 10px !important;
        border-color: transparent transparent transparent #23527c;
    }
/*================ COMMON CSS START ================*/
#wrapper {
    overflow-x: hidden;
    width: 100%;
    min-height: 100%;
    margin: 0px auto -38px;
}

.push {
    height: 38px;
}

.user-detail, .nav.navbar-nav > li > a .fa, ul.side-nav li em.dashboard-icon, .content-inner, .border-row, .ibox-list, .ibox-list li, .ibox-list li a, ul.custom-breadcrumb li, .progress-outer, ul.inner-progress li, .ibox-outer, .square-icon, .progress-outer, .square-icon i, ul.inner-progress li a, .login-logo, .content-row-table, .sub-title, .heading-sm, .modal-inner, .modal-btn, .custom-modal, .pages-breadcrumbs, .pages-breadcrumbs li, .details-title span, .detail-innerRow, .detail-area, .edit-data, .delete-data, .refresh-data, .sub-tabs a, .sub-tabs, .sub-tabs li, .detail-contentInner, .fa-plus, .fa-calendar, ul.message-list, ul.message-list, .form-area .form-group .form-radio label, .lless-spaceRow, .options-col.manaul-option, .space-lg, .message-thread, .message-thread li, .ibox-row-lg, .bank-row .table-oth, .ibox-sm, .payInfo-inner, .btn-row, .amount-col, .amount-colSm, .download-data, .heading-smFull, .total-payment, .download-icon, .refresh-icon, .payment-icon, .details-top, ul.detail-list li, .inner-commonRow, .agent-detail .search-col, .ibox-body, .agent-detail, .form-button, .discard-top, .panel-right, .field-value, .foreign-row, .view-data, .border-col b, .btn-border, .bottom-row a, .installment {
    display: inline-block;
    vertical-align: top;
}

.border-box, .border-rowBottom, .detail-box, .plan-ibox, .plan-title, .details-list, .foreign-col {
    display: inline-block;
    vertical-align: top;
    width: 100%;
}



.navbar-header .navbar-toggle .icon-bar, .side-menu, .content-area, .footer, .login-btn button, .btn, .add-more {
    transition: all 0.4s ease 0s;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
}

.footer {
    transition: all 0.5s ease 0.5s;
    -webkit-transition: all 0.5s ease 0.5s;
    -moz-transition: all 0.5s ease 0.5s;
    -o-transition: all 0.5s ease 0.5s;
    -ms-transition: all 0.5s ease 0.5s;
}

.transform {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
}

.heading-lg, .dash-ibox h2, ul.inner-progress li a, ul.inner-progress li, .login-bg, .login-input-oth input, .custom-modal .modal-title, .form-control, ul.custom-breadcrumb li strong span, .left-section-login p, .details-title, .list-data, ul.message-list li, .form-area .form-group label.error, .form-radio.radio-btn input[type="radio"] + label, .rating-section, .heading-sm, .heading-md, .right-col .radio-btn input[type="radio"] + label, .table-textLg .table, .pay-info, .pay-info span, .heading-smFull, .ui-widget.ui-widget-content, .heading-xs, ul.detail-list li span, .app-coverage {
    font-family: 'robotoregular';
}

    .ibox-list li b, ul.custom-breadcrumb li strong, .login-btn button, .heading-xl, .detail-innerRow label, .table-textLg .table thead tr th, .details-row b, .detail-bottom b, .content-right h4, .bold-text, ul.detail-list li b, .panel-title > a.text-btn, .text-btn, .installment b, .bottom-row span {
        font-family: 'Roboto';
    }

    .ibox-list, .ibox-outer h2, .table-oth, .btn-primary, .footer, .contant-inner-row, .details-title strong, .list-data span, .list-data a, .form-area .form-group label, .add-more, .alert-popup, .text-link, .detail-bottom h3, .content-right strong, .panel-right b, .border-col b, .table > thead > tr > th, .plan-row .radio-btn input[type="radio"] + label, .full-details th, .details-list ul h5, .dark-text, .pre-info b, .label-bold {
        font-family: 'robotomedium';
    }


/*================ COMMON CSS END ================*/

/*================ HEADER CSS START ================*/
.header {
    background: #3C3B6E;
    padding: 9px 25px;
}

.navbar-brand {
    height: auto;
    padding: 0px;
}

.user-detail {
    color: #91b0d6;
    font-size: 15px;
    margin: 17px 0 0 14px;
}

.header .navbar-right {
    margin: 15px 0 0;
}

.nav.navbar-nav > li > a {
    color: #fff;
    font-size: 16px;
    padding: 0px;
    margin: 0px 20px;
}

.nav.navbar-nav > li:first-child > a {
    margin-left: 0px;
}

.nav.navbar-nav > li:last-child > a {
    margin-right: 0px;
}

.nav.navbar-nav > li > a .fa {
    color: #91b0d6;
    font-size: 20px;
    margin: 1px 5px 0 0;
}

.nav > li > a:focus, .nav > li > a:hover, .nav > li.active > a {
    background: none;
    color: #fcb040;
}

    .nav > li > a:focus .fa, .nav > li > a:hover .fa, .nav > li.active > a .fa {
        color: #fcb040;
    }
/*================ HEADER CSS END ================*/

/*================ SIDE-NAV CSS START ================*/
.gray-bg {
    margin-top: 69px;
}

.side-menu {
    background: #03213b;
    width: 85px;
    float: left;
    position: fixed;
    z-index: 50;
    height: 100%;
    left: 0px;
}

.attach-agent-btn {
    display: none;
}

.side-menu .fa-angle-left {
    position: relative;
}

.side-menu-close {
    left: -85px;
}

    .side-menu-close .fa-angle-left {
        transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        top: 2px;
        left: 3px;
    }

ul.side-nav {
    text-align: center;
    width: 100%;
    margin: 28px 0 0;
}

    ul.side-nav li span {
        display: block;
        padding: 10px 0 0;
    }

    ul.side-nav li em.dashboard-icon {
        height: 33px;
        width: 33px;
        background-position: -5px -36px;
    }

    ul.side-nav li a {
        color: #205179;
        display: inline-block;
        padding: 0;
        width: 100%;
        font-size: 14px;
    }

    ul.side-nav li {
        position: relative;
        margin: 0 0 30px;
    }

        ul.side-nav li.active a {
            color: #fff;
            cursor: pointer;
        }

.aside-menu {
    position: absolute;
    right: -14px;
    width: 14px;
    color: #8595a1;
    background: #03213b;
    line-height: 20px;
    padding: 8px 0px;
    top: 26px;
    cursor: pointer;
    border-radius: 0px 4px 4px 0px;
    -moz-border-radius: 0px 4px 4px 0px;
    -webkit-border-radius: 0px 4px 4px 0px;
    -ms-border-radius: 0px 4px 4px 0px;
}

    .aside-menu .fa {
        font-size: 20px;
    }
/*================ SIDE-NAV CSS END ================*/

/*================ CONTENT AREA START ================*/
.content-area {
    padding-left: 85px;
    min-height: 500px;
}

    .content-area.content-area-full {
        padding-left: 0px;
    }

.content-inner {
    padding: 15px;
    width: 100%;
}

.border-row, .detail-innerRow {
    width: 100%;
    border-bottom: 1px solid #b7bdc4;
    padding-bottom: 18px;
}

.heading-lg {
    font-size: 28px;
    color: #333333;
    margin: 0px;
    padding: 0px;
    float: left;
}

/*.ibox-outer {
    border: 1px solid #b7bdc4;
    font-size: 28px;
    overflow: hidden;
    margin: 20px 0px;
    min-height: 440PX;
    background: #fff;
    text-align: left;
}*/

.ibox-outer {
    border: 1px solid #b7bdc4;
    font-size: 28px;
    overflow: hidden;
    margin: 20px 0px;
    min-height: 0PX;
    background: #fff;
    text-align: left;
}

.ibox-row .ibox-outer {
    width: 93%;
}

.ibox-row .col-md-4:first-child .ibox-outer {
    float: left;
}

.ibox-row .col-md-4:nth-child(3) .ibox-outer {
    float: right;
}

.ibox-outer h2 {
    text-align: center;
    color: #fff;
    font-size: 22px;
    background: #2bb09c;
    margin: 0px;
    padding: 15px 5px;
}

.iboxContent {
    padding: 0 20px;
}

.ibox-row {
    padding: 20px 0px;
    text-align: center;
}

    .ibox-row + .ibox-row {
        padding-top: 0px;
    }

        .ibox-row + .ibox-row .ibox-outer {
            margin-top: 0px;
        }

.ibox-list, .ibox-list li, .ibox-list li a {
    width: 100%;
}

.ibox-list {
    font-size: 15px;
    color: #545759;
}

    .ibox-list li {
        border-bottom: 1px solid #b7bdc4;
        position: relative;
        padding: 20px 0px;
    }

        .ibox-list li:last-child {
            border-bottom: none;
        }

        .ibox-list li a {
            color: #545759;
        }

        .ibox-list li b {
            font-size: 25px;
            float: right;
        }

        .ibox-list li span {
            padding: 5px 0 0 0px;
            line-height: 16px;
            float: left;
        }

        .ibox-list li sub {
            bottom: 0px;
            font-size: 18px;
        }

.ibox-outer.seaGreen h2 {
    background: #2bb09c;
}

.ibox-outer.seaGreen b, .ibox-outer.seaGreen a:hover {
    color: #2bb09c;
}

.ibox-outer.lightCoral h2 {
    background: #ef6c81;
}

.ibox-outer.lightCoral b, .ibox-outer.lightCoral a:hover {
    color: #ef6c81;
}

.ibox-outer.sandyBrown h2 {
    background: #f0ad4e;
}

.ibox-outer.sandyBrown b, .ibox-outer.sandyBrown a:hover {
    color: #f0ad4e;
}

.ibox-outer.lightCoral .ibox-list li span {
    padding: 5px 0px 0 0px;
}


/*================ CONTENT AREA END ================*/






/*======================= INNER PAGE CSS START =============================*/



.header-dropdown {
    float: right;
    position: relative;
    margin: 5px 0 0 10px;
}

    .header-dropdown .dropdown-toggle {
        background: none;
        border: none;
        padding: 10px;
    }

        .header-dropdown .dropdown-toggle .fa {
            color: #91b0d6;
            font-size: 20px;
        }

    .header-dropdown .dropdown-menu {
        left: inherit;
        right: 0;
        border-color: rgba(0, 0, 0, 0);
        padding: 0px;
        box-shadow: none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        -o-box-shadow: none;
        overflow: hidden;
        min-width: 180px;
        top: 53px;
    }

        .header-dropdown .dropdown-menu a {
            color: #545759;
            background: #e7ecf0;
            border-bottom: 1px solid #d3d3d5;
            padding: 15px 12px;
            font-size: 15px;
        }

            .header-dropdown .dropdown-menu a:hover {
                color: #fff;
                background: #032b4a;
            }

    .header-dropdown .dropdown-toggle:hover .fa, .header-dropdown .dropdown-toggle:focus .fa {
        color: #fcb040;
    }

    .header-dropdown .dropdown-menu li:last-child a {
        border-bottom: none;
    }


.ibox-row-lg {
    width: 100%;
    padding: 50px 0px 20px;
}

    .ibox-row-lg .sub-tabs {
        margin-bottom: 20px;
    }

.form-group .browse label.input-group-btn {
    padding: 0px;
    font-size: 0;
    display: table-cell;
}

.form-group .browse .btn {
    height: 43px;
}


.text-btnOrange, .table-oth-dashboard td a.text-btnOrange {
    color: #fbb542;
    text-decoration: underline;
}

.text-btnBlue, .table-oth-dashboard td a.text-btnBlue {
    color: #185080;
    text-decoration: underline;
}

.text-btnDBlue, .table-oth-dashboard td a.text-btnDBlue {
    color: #104e7e;
    text-decoration: underline;
}

.text-btnOrange, .text-btnBlue, .text-btnDBlue {
    padding: 0px 12px;
    border-right: 1px solid #ccc;
}

.text-btnDBlue {
    border-right: 0;
}


/*======================= INNER PAGE CSS END =============================*/
/*cards css*/

.main-section {
    width: 100%;
    margin: 0 auto;
    text-align: left;
    padding: 0px 5px;
}

.dashbord {
    transition: box-shadow .2s;
    cursor: pointer;
    width: 30%;
    display: inline-block;
    background-color: #fff;
    color: #fff;
    text-align: center;
    margin-top: 50px;
    padding-right: 0%;
    margin-right: 11px;
}

    .dashbord:hover {
        box-shadow: 7px 7px 11px rgba(33,33,33,1);
    }

/*.icon-section i{
	font-size: 30px;
    padding: 10px;
    border: 1px solid #fff;
    border-radius: 50%;
    margin-top: 29px;
    margin-bottom: -11px;
    background-color: #34495E;
}*/
.icon-section i {
    font-size: 30px;
    padding: 10px;
    border: 1px solid #fff;
    border-radius: 50%;
    margin-top: -25px;
    margin-bottom: 10px;
    background-color: #34495E;
}

.icon-section p {
    margin: 0px;
    font-size: 20px;
    padding-bottom: 10px;
}

.detail-section {
    background-color: #2F4254;
    padding: 5px 0px;
}

.dashbord .detail-section:hover {
    background-color: #5a5a5a;
    cursor: pointer;
}

.detail-section a {
    color: #fff;
    text-decoration: none;
}

.dashbord-green .icon-section, .dashbord-green .icon-section i {
    background-color: #16A085;
}

.dashbord-green .detail-section {
    background-color: #149077;
}

.dashbord-orange .icon-section, .dashbord-orange .icon-section i {
    background-color: #F39C12;
}

.dashbord-orange .detail-section {
    background-color: #DA8C10;
}

.dashbord-blue .icon-section, .dashbord-blue .icon-section i {
    background-color: #2980B9;
}

.dashbord-blue .detail-section {
    background-color: #2573A6;
}

.dashbord-red .icon-section, .dashbord-red .icon-section i {
    background-color: #E74C3C;
}

.dashbord-red .detail-section {
    background-color: #CF4436;
}

.dashbord-skyblue .icon-section, .dashbord-skyblue .icon-section i {
    background-color: #8E44AD;
}

.dashbord-skyblue .detail-section {
    background-color: #803D9B;
}
.dashbord-pink .icon-section, .dashbord-pink .icon-section i {

    background-color: #e60073;
}



.dashbord-pink .detail-section 
{
    background-color: #e60073;
}



.dashbord-LightBlue .icon-section, .dashbord-LightBlue .icon-section i 
{
    background-color: #009999;

}


.dashbord-LightBlue .detail-section 
{
    background-color: #009999;

}
.dashbord-darkseagreen .icon-section, .dashbord-darkseagreen .icon-section i {
    background-color: #BA55D3;
}

.dashbord-darkseagreen .detail-section {
    background-color: #BA55D3;
}
/*side nav menu */

.main-menu .fa-2x {
    font-size: 2em;
}

.main-menu .fa {
    position: relative;
    display: table-cell;
    width: 85px;
    height: 36px;
    text-align: center;
    vertical-align: middle;
    font-size: 20px;
}


/*.main-menu:hover,nav.main-menu.expanded {
width:250px;
overflow:visible;
}*/

.main-menu {
    background: #212121;
    /*background:#B22234;*/
    /*border-right:1px solid #e5e5e5;*/
    border-right: 1px solid #212121;
    position: fixed;
    top: 0;
    bottom: 0;
    height: 100%;
    left: 0;
    width: 60px;
    overflow: hidden;
    -webkit-transition: width .8s linear;
    transition: width .8s linear;
    -webkit-transform: translateZ(0) scale(1,1);
    z-index: 1000;
}

    .main-menu > ul {
        margin: 7px 0;
    }

    .main-menu li {
        position: relative;
        display: block;
        width: 250px;
    }

        .main-menu li > a {
            position: relative;
            display: table;
            border-collapse: collapse;
            border-spacing: 0;
            /*color:#999;*/
            color: #fff;
            font-family: arial;
            font-size: 14px;
            text-decoration: none;
            -webkit-transform: translateZ(0) scale(1,1);
            -webkit-transition: all .1s linear;
            transition: all .1s linear;
        }

    .main-menu .nav-icon {
        position: relative;
        display: table-cell;
        width: 60px;
        height: 36px;
        text-align: center;
        vertical-align: middle;
        font-size: 18px;
    }

    .main-menu .nav-text {
        position: relative;
        display: table-cell;
        vertical-align: middle;
        width: 190px;
        font-family: 'Titillium Web', sans-serif;
    }

    .main-menu > ul.logout {
        position: absolute;
        left: 0;
        bottom: 0;
    }

.no-touch .scrollable.hover {
    overflow-y: hidden;
}

/*.no-touch .scrollable.hover:hover {
overflow-y:auto;
overflow:visible;
}*/

a:hover, a:focus {
    text-decoration: none;
}

nav {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

    nav ul, nav li {
        outline: 0;
        margin: 0;
        padding: 0;
    }

    .main-menu li:hover > a, nav.main-menu li.active > a, .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus, .no-touch .dashboard-page nav.dashboard-menu ul li:hover a, .dashboard-page nav.dashboard-menu ul li.active a {
        color: #fff;
        background-color: #5fa2db;
    }

.area {
    float: left;
    background: #e2e2e2;
    width: 100%;
    height: 100%;
}

@font-face {
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 300;
    src: local('Titillium WebLight'), local('TitilliumWeb-Light'), url(http://themes.googleusercontent.com/static/fonts/titilliumweb/v2/anMUvcNT0H1YN4FII8wpr24bNCNEoFTpS2BTjF6FB5E.woff) format('woff');
}


.hide-side-menu {
    display: none;
}

.main-page-background-colour {
    background-color: #022b49 !important;
    /*background: -webkit-repeating-linear-gradient(
  -55deg,
  #222,
  #222 10px,
  #333 10px,
  #333 20px
);*/
}

/*.design-list-hover :hover{
    background-color:#efa9aa; 
}*/

.tableSelected {
    background: blanchedalmond;
}

.ui-select-bootstrap .ui-select-toggle > a.btn {
    margin-top: 5px;
}

.select2 > .select2-choice.ui-select-match {
    /* Because of the inclusion of Bootstrap */
    height: 29px;
}

.selectize-control > .selectize-dropdown {
    top: 36px;
}
/* Some additional styling to demonstrate that append-to-body helps achieve the proper z-index layering. */
.select-box {
    background: #fff;
    position: relative;
    z-index: 1;
}

.ui-select-bootstrap .ui-select-match-text {
    width: 100%;
    padding-right: 1em;
    overflow: hidden;
    text-overflow: ellipsis;
}

.heading-liner {
    border-bottom: solid 1px black;
    margin-top: -5px;
}

.top-space {
    margin-top: 10px;
}

.secure {
    -webkit-text-security: disc;
}

.check-box-container {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    /* Hide the browser's default checkbox */
    .check-box-container input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
    }

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
}

/* On mouse-over, add a grey background color */
.check-box-container:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.check-box-container input:checked ~ .checkmark {
    background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.check-box-container input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.check-box-container .checkmark:after {
    left: 9px;
    top: 5px;
    width: 7px;
    height: 12px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.show-select-spinner {
    background: none !important;
    border: none !important;
    float: right;
    position: absolute;
    margin-top: -29px;
    margin-left: 222px;
}

.panel-default > .panel-heading {
    background-image: linear-gradient(to bottom, #B22234 0%, #B22234 100%) !important;
    color: white !important;
}

.pagination > li > a,
.pagination > li > span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #428bca;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
}

    .pagination > li > a:hover,
    .pagination > li > span:hover,
    .pagination > li > a:focus,
    .pagination > li > span:focus {
        color: #2a6496;
        background-color: #eee;
        border-color: #ddd;
    }

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    z-index: 2;
    color: #fff;
    cursor: default;
    background-color: #B22234 !important;
    border-color: #B22234 !important;
}

.main-background-colour {
    background-color: #f4f7fa;
}

.blink_me {
    animation: blinker 1s linear infinite;
    background-color: lightsalmon;
}

@keyframes blinker {
    50% {
        opacity: 0;
    }
}

.profile-cursor {
    cursor: pointer;
}

.sidemenu-tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

    .sidemenu-tooltip .tooltiptext {
        visibility: hidden;
        width: 120px;
        background-color: #555;
        color: #fff;
        text-align: center;
        padding: 5px 0;
        border-radius: 6px;
        /* Position the tooltip text */
        position: absolute;
        z-index: 1;
        bottom: 125%;
        left: 50%;
        margin-left: -60px;
        /* Fade in tooltip */
        opacity: 0;
        transition: opacity 0.3s;
    }

        .sidemenu-tooltip .tooltiptext::after {
            content: "";
            position: absolute;
            top: 100%;
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: #555 transparent transparent transparent;
        }

    .sidemenu-tooltip:hover .tooltiptext {
        visibility: visible;
        opacity: 1;
    }

.loader-class-pol {
    font-size: 79px;
    margin-left: 424px;
    margin-top: 155px;
}

.contant-inner-row {
    border-bottom: 1px solid #ccc;
    display: inline-block;
    padding: 20px 0;
    width: 100%;
    color: #535658;
}

    .contant-inner-row > span {
        float: right;
    }

    .contant-inner-row strong {
        color: #3e3f41;
    }

    .contant-inner-row:last-child {
        border: none;
    }

.highlight-color-insured-policy {
    background-color: lightblue;
    padding: 4px;
}

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

    .switch input {
        display: none;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #2196F3;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }

::-ms-clear {
    display: none;
}

input[type=text]::-ms-clear {
    display: none;
}

.greenprocessbill {
    color: green;
    cursor: pointer;
}

.greeneditbill {
    color: orange;
    cursor: pointer;
}


.greyprocessbill {
    color: grey;
    cursor: not-allowed;
}

 .tooltip1 {
        position: relative;
        display: inline-block;
    }

        .tooltip1 .tooltiptext {
            visibility: hidden;
            width: 120px;
            background-color: #555;
            color: #fff;
            text-align: center;
            border-radius: 6px;
            padding: 5px 0;
            position: absolute;
            z-index: 1;
            bottom: 125%;
            left: 50%;
            margin-left: -60px;
            opacity: 0;
            transition: opacity 0.3s;
        }

            .tooltip1 .tooltiptext::after {
                content: "";
                position: absolute;
                top: 100%;
                left: 50%;
                margin-left: -5px;
                border-width: 5px;
                border-style: solid;
                border-color: #555 transparent transparent transparent;
            }

        .tooltip1:hover .tooltiptext {
            visibility: visible;
            opacity: 1;
        }