form {
    height: 97%;
}
.pac-container {
    z-index: 100000;
}
/***HEADER***/
nav.navbar-default.navbar-static-side {
    transition: all 0s !important;
}
.nav-header {
    padding: 0px;
    display:flex;
}
.comp-logo, .comp-logo2 {
    float: left;
    padding: 5px;
}
.comp-logo i
{
    font-size: 21px;
    color:White;
}
.comp-logo2
{
    width:100%;
    text-align:center;
}
.profile-element {
    float: left;
    padding: 5px;
}
body.mini-navbar .comp-logo
{
    display:none;
}
.logo-element {
    padding: 0;
}
.no-pad
{
    padding:0;
}
.no-mar
{
    margin:0;
}

/**BODY**/
div#page-wrapper {
    transition: all 0s !important;
}
.md-skin .wrapper-content {
    padding: 0;
    margin-top: -5px;
}
/**CONTROLS**/
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}
.form-control.invalid
{
    border-color: #e65f5f !important;
}
.nav > li.active-mask {
    background: #cafff44d;
    border-left:none !important;
}
.nav > li.active {
    border-left: 4px solid #19aa8d;
    border-left: none !important;
}
/*.nav > li.active-mask * {
    color:White;
}*/
.checkbox label, .radio label
{
    margin: 5px 0;
    cursor:pointer;
}
.checkbox label:after, 
.radio label:after {
    content: '';
    display: table;
    clear: both;
}

.checkbox .cr, .radio .cr {
    position: relative;
    display: inline-block;
    background: #eee;
    width: 25px;
    height: 25px;
    float: left;
    margin-right: .5em;
    border: 1px solid #e0e0e0;
    transition:all ease-in .2s;
    cursor:pointer;
}

.radio .cr {
    border-radius: 50%;
}

.checkbox .cr .cr-icon,
.radio .cr .cr-icon {
    position: absolute;
    font-size: .8em;
    line-height: 0;
    top: 50%;
    left: 20%;
        color: white;
    font-size: 20px;
    position: relative;
    top: 10px;
    left: 0;
    display: block;
    text-align: center;
}

.radio .cr .cr-icon {
    margin-left: 0.04em;
}

.checkbox label input[type="checkbox"],
.radio label input[type="radio"] {
    display: none;
}

.checkbox label input[type="checkbox"] + .cr > .cr-icon,
.radio label input[type="radio"] + .cr > .cr-icon {
    transform: scale(3) rotateZ(-20deg);
    opacity: 0;
    transition: all .3s ease-in;
    color:Gray;
}

.checkbox label input[type="checkbox"]:checked + .cr > .cr-icon, .radio label input[type="radio"]:checked + .cr > .cr-icon {
    transform: scale(1) rotateZ(0deg);
    opacity: 1;
    color:#1ab394;
}

.checkbox label input[type="checkbox"] + .cr ,
.radio label input[type="radio"] + .cr {
    
}

.checkbox label input[type="checkbox"]:checked + .cr , .radio label input[type="radio"]:checked + .cr 
{
    box-shadow: 0 0 1000px white inset;
    border: 1px solid #1ab394;
}

.checkbox label input[type="checkbox"]:disabled + .cr,
.radio label input[type="radio"]:disabled + .cr {
    opacity: .5;
}

.input-addon-r {
    position: relative;
}
	.input-addon-r input:first-child {
    width: 80%;
	text-align:right;
}
.input-addon-r input {
	text-align:right;
}
	.addon-r{
	position: absolute;
    right: 0;
    width: 20%;
	}
	.center-block {
    display: block;
    margin: auto;
    float: none;
}

span.input-hint {
	opacity:0;
    position: absolute;
    top: 10px;
    width: auto;
    padding: 5px;
    background: #ffffeb;
    border: 1px solid #ccccb7;
    border-radius: 5px;
    z-index: 0;
    left: 0;
	box-shadow: 0 2px 3px silver;
	transition:all ease-in 0s;
}

span.input-hint.error {
	background: #f7baba;
}
span.input-hint::after {
	content: "";
    position: absolute;
    top: -5px;
    left: calc(50% - 5px);
    height: 5px;
    width: 5px;
    border-bottom: 5px solid #ccccb7;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
}

input:focus + span.input-hint {
	opacity:1;
	top: 40px;
	z-index:9;
	transition:all cubic-bezier(0.59, 1.54, 1, 1) .3s;
}

/*.animated-icon{
	animation: float 3s ease-in-out infinite;
}*/

@keyframes float {
    0% {
        box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6);
        transform: translatey(0px);
    }

    50% {
        box-shadow: 0 7px 15px 0px rgba(0,0,0,0.3);
        transform: translatey(-3px);
    }

    100% {
        box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6);
        transform: translatey(0px);
    }
}
.md-skin .ibox {
    clear: both;
    margin-bottom: 5px !important;
}
.ibox-content {
    padding: 10px;
    /*position:relative;*/
}

    .bottom-rounded {
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
}
/* body.u-theme-silver .ibox-btn, body.u-theme-silver .ibox-title { */
    /* background: linear-gradient(#eceaea,#ededed); */
    /* background: linear-gradient(#ffd4a5,#ffd4a5)  !important; */
/* } */

/* body.u-theme-silver .page-heading { */
    /* background: linear-gradient(#e1e1e1,#e3e3e3); */
    /* background: linear-gradient(#f8ac59,#f8ac59) !important; */
/* } */

/* .ibox-title { */
    /* border-color: #ffd4a5 !important; */
	/* } */
/* body.u-theme-silver .ibox { */
    /* box-shadow: 0 0 4px silver; */
    /* background: #ffd4a5 !important; */
/* } */

/* body.u-theme-silver .ibox { */
    /* box-shadow: 0 0 6px #a0a0a0 !important; */
    /* background: #ffd4a5 !important; */
/* } */

.field-group {
    font-weight: 400;
    position: absolute;
    top: -24px;
    border: 1px solid #c0c0c0;
    display: inline-block;
    padding-top: 1px;
    padding: 1px 5px 0 5px;
    color: #064f63;
    border-radius: 3px;
    font-size: 12px;
    background: #d1f4ff;
}
.form-boxed {
    border: 1px solid silver;
    padding: 0 10px 10px 10px;
    display: inline-block;
    border-radius: 2px;
    margin-top: 10px;
    padding-top: 10px;
}
.col-sm-6.form-boxed:nth-child(2) {
    margin-left: 5px;
}

.btn:focus {
    box-shadow: 0 0 14px grey !important;
}
button.btn:focus {
    background: #1ab394;
    color: white;
}
 /**PRINT**/
    .print-this-page
    {
        display:none;
    }
    .print-this-page.active
    {
        display:block;
        position:fixed;
        top:0;
        left:0;
    }

    .print-this-page .print-preview
    {
        width: 0;
        height: 0;
        background: white;
        overflow-y: auto;
        transition:all cubic-bezier(1,1.84,.56,.7) .3s;
        margin:0;
        position:relative;
    }
    .print-this-page.active .print-preview {
        display:block;
        z-index:99999999;
        margin: 10px auto;
    }

    /***DEFAULT***/
    #FadedBackDrop
    {
        display:none;
        position:fixed;
        z-index:99;
        height:100%;
        width:100%;
        top:0;
        left:0;
        background:#000000b3;
    }

.auto-form-height{
height:auto !important;
}
/*TABLE ACTION*/
table:focus {
    border: none;
    outline: none;
}
.auto-table-height
{
    overflow: auto;
    display: block;
}
.table-responsive {
    display: block;
    width: 99.99% !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}
.scrollable {
    display: block;
    oveflow:auto;
}
.no-border-right {
    border-right: 1px solid transparent !important;
}
.text-absolute {
    position: absolute;
}
.u-table th, .u-table td {
    padding: 1px 8px;
}
.u-table tbody tr:hover {
    background-color: rgb(255, 243, 220) !important;
}
.relative-box {
    position: relative;
}
.padding-r-15 {
    padding-right: 15px !important;
}
.padding-l-15 {
    padding-left: 15px !important;
}
.text-custom-action {
    position: absolute;
    top: 5px;
    left: -3px;
    width: 55px;
    display: block;
    text-align: center;
}
.page-link {
    position: relative;
    display: block;
    padding: .44rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #007bff;
    background-color: #fff;
    border: 1px solid #dee2e6;
}
/*.dataTables_paginate.paging_simple_numbers {
    padding-top: 18px;
}*/
.no-pad-r {
    padding-right: 0 !important;
}
/*TOGGLE-FLYIN-RADIO*/
.btn-radio-style-flyin {
    cursor: pointer;
    position: relative;
    width: 120px;
    height: 35px;
}

    .btn-radio-style-flyin span {
        position: absolute;
        width: 120px;
        height: 35px;
        display: block;
        border-radius: 4px;
        background: #379ac7;
        padding: 0;
        margin: 0;
        box-shadow: 0px 0px 3px black inset;
        top: 0;
        left: 0;
        transition: all ease-in-out .3s;
    }

    .btn-radio-style-flyin label.label-text {
        font-size: 12px;
        top: -22px;
        height: 20px !important;
        padding: 1px 10px !important;
        left: -7px;
        position: relative;
        font-weight: 600;
    }

    .btn-radio-style-flyin span::after {
        content: "Credit";
        position: absolute;
        top: 0;
        left: 0;
        height: 35px;
        width: 60px;
        border-radius: 4px !important;
        background: white;
        box-shadow: 0px 0px 1px #353535, 0px 0px 5px #252525, 2px 0px 3px grey inset;
        transition: cubic-bezier(0.91, 0.8, 0.38, 1.1) .6s;
        background: linear-gradient(#e6e6e6,#ffffff);
        padding: 6px 0;
        font-size: 15px;
        text-align: center;
        font-weight: 600;
    }

    .btn-radio-style-flyin input:checked + span {
        background: #37b99b;
        box-shadow: 0px 0px 3px black inset;
    }

    .btn-radio-style-flyin > input:checked + span::after {
        content: "Cash";
        left: 60px;
    }

    .btn-radio-style-flyin input + span i:last-child {
        opacity: 0;
        position: absolute;
        top: 5px;
        left: 50px;
        font-size: 25px;
        transition: all cubic-bezier(0.51, -0.37, 0.6, 1.58) .8s;
        color: white;
    }

    .btn-radio-style-flyin input + span i:first-child {
        opacity: 1;
        position: absolute;
        top: 5px;
        left: 77px;
        font-size: 25px;
        transition: all cubic-bezier(0.51, -0.37, 0.6, 1.58) .8s;
        color: white;
    }

    .btn-radio-style-flyin input:checked + span i:last-child {
        opacity: 1;
        position: absolute;
        top: 5px;
        left: 17px;
        font-size: 25px;
        transition: all cubic-bezier(0.51, -0.37, 0.6, 1.58) .8s;
        color: white;
        transform: rotate(360deg);
    }

    .btn-radio-style-flyin input:checked + span i:first-child {
        opacity: 0;
        position: absolute;
        top: 5px;
        left: 17px;
        font-size: 25px;
        transition: all cubic-bezier(0.51, -0.37, 0.6, 1.58) .8s;
        color: white;
        transform: rotate(360deg);
    }
    /*BUTTONS*/
    /*TOGGLE BUTTONS*/
    /*STYLE-FLYIN-TOGGLE-*/
    .btn-radio-style-iphone {
            cursor: pointer;
            position: relative;
            width: 120px;
            height: 35px;
        }

            .btn-radio-style-iphone span {
                position: absolute;
                width: 120px;
                height: 25px;
                display: block;
                border-radius: 4px;
                background: #379ac7;
                padding: 0;
                margin: 0;
                box-shadow: 0px 0px 3px black inset;
                top: 0;
                left: 0;
                transition: all ease-in-out .3s;
            }

            .btn-radio-style-iphone label.label-text {
                font-size: 12px;
                top: -22px;
                height: 20px !important;
                padding: 1px 10px !important;
                left: -7px;
                position: relative;
                font-weight: 600;
            }

        .btn-radio-style-iphone span::after {
            content: "Credit";
            position: absolute;
            top: 0;
            left: 0;
            height: 26px;
            width: 60px;
            border-radius: 4px !important;
            background: white;
            box-shadow: 0px 0px 1px #353535, 0px 0px 5px #252525, 2px 0px 3px grey inset;
            transition: cubic-bezier(0.91, 0.8, 0.38, 1.1) .6s;
            background: linear-gradient(#e6e6e6,#ffffff);
            padding: 2px 0;
            font-size: 15px;
            text-align: center;
            font-weight: 600;
        }

            .btn-radio-style-iphone input:checked + span {
                background: #37b99b;
                box-shadow: 0px 0px 3px black inset;
            }

            .btn-radio-style-iphone > input:checked + span::after {
                content: "Cash";
                left: 60px;
            }

        .btn-radio-style-iphone input + span i.cash-icon {
            opacity: 0;
            position: absolute;
            top: 5px;
            left: 80px;
            font-size: 18px;
            transition: all ease-in-out .5s;
            color: white;
        }

        .btn-radio-style-iphone input + span i.credit-icon {
            opacity: 1;
            position: absolute;
            top: 5px;
            left: 81px;
            font-size: 18px;
            transition: all ease-in-out .5s;
            color: white;
        }

        .btn-radio-style-iphone input:checked + span i.cash-icon {
            opacity: 1;
            position: absolute;
            top: 4px;
            left: 20px;
            font-size: 18px;
            transition: all ease-in-out .5s;
            color: white;
            transform: rotate(720deg);
        }

        .btn-radio-style-iphone input:checked + span i.credit-icon {
            opacity: 0;
            position: absolute;
            top: 5px;
            left: 21px;
            font-size: 18px;
            transition: all ease-in-out .5s;
            color: white;
            transform: rotate(720deg);
        }
/*STYLE-IPHONE*/
.btn-checkbox-style-iphone + label, .btn-checkbox-style-iphone label {
    margin-bottom: 0 !important;
}

/*.btn-checkbox-style-iphone {
    cursor: pointer;
    position: relative;
    width: 50px;
    height: 25px;
    margin-bottom: 0 !important;
}*/
.btn-checkbox-style-iphone {
    margin-left:5px;
    cursor: pointer;
    position: relative;
    width: 50px;
    height: 25px;
    margin-bottom: 0 !important;
}
/*.btn-checkbox-style-iphone input + span, .btn-checkbox-style-iphone input + label span {
    position: absolute;
    width: 45px;
    height: 25px;
    display: block;
    border-radius: 16px;
    background: #ffffff;
    padding: 0;
    margin: 0;
    border: 1px solid #dedede;
    top: 0;
    left: 0;
    transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color .3s ease 0s;
}*/
.btn-checkbox-style-iphone input + span, .btn-checkbox-style-iphone input + label span {
    position: absolute;
    width: 45px;
    height: 25px;
    display: block;
    border-radius: 16px;
    background: #ffffff;
    padding: 0;
    margin: 0;
    border: 1px solid #dedede;
    top: 0;
    left: 4px;
    transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color .3s ease 0s;
}
.btn-checkbox-style-iphone input + span::after,.btn-checkbox-style-iphone input + label span::after {
    content: "";
    position: absolute;
    top: 0px;
    left: -1px;
    height: 23px;
    width: 23px;
    border-radius: 22px !important;
    background: white;
    box-shadow: 0 0px 3px rgba(0,0,0,0.4);
    transition: all ease-in-out .3s;
    transition: all cubic-bezier(0.7, 0.89, 0, 1.03) .3s;
}
.btn-checkbox-style-iphone input:checked + span,.btn-checkbox-style-iphone input:checked + label span {
    background-color: rgb(24, 190, 159);
    border-color: rgb(8, 173, 142);
    transition: border 0.4s ease 0s, box-shadow 0.5s ease .1s, background-color 2s ease 0s;
    box-shadow: rgb(24, 189, 159) 0px 0px 0px 21px inset;
}
.btn-checkbox-style-iphone input:checked + span::after,.btn-checkbox-style-iphone input:checked + label span::after {
    left: 22px;
}
.btn-checkbox-style-iphone + label, .btn-checkbox-style-iphone label {
    position: relative;
    top: 3px;
    margin-right: 10px;
    color: #444444;
    left: -4px;
}
/*.btn-checkbox-style-iphone span:nth-child(2).active
{
    background-color: rgb(24, 190, 159);
    border-color: rgb(24, 190, 159);
    transition: border 0.4s ease 0s, box-shadow 0.5s ease .1s, background-color 2s ease 0s;
    box-shadow: rgb(24, 189, 159) 0px 0px 0px 21px inset;
}*/
.btn-checkbox-style-iphone input {
    position: absolute;
    visibility: hidden;
}

.btn-checkbox-style-iphone input:focus + label span {
    outline: 1px dashed #29a2c0;
    outline-offset: 2px;
}
label.btn-checkbox-style-iphone input
{
    visibility: hidden;
}
/*ADDON-BUTTON*/
.addon-right {
    position: relative;
    padding-right: 40px;
}

    .addon-right ~ .addon-btn {
        display: table-cell;
        position: absolute;
        right: 0;
        top: 0;
        height: 100%;
        font-size: 13px;
        background: #f7f7f7;
        color: #464545;
        border: 1px solid #121212;
        z-index: 9;
        cursor: pointer;
        transition: all ease-in .1s;
        padding: 3px;
        top: 0;
        right: 0;
    }

    .addon-right ~ .addon-btn, .addon-right + ul ~ .addon-btn {
        min-width: 25px;
        color: white !important;
        vertical-align: middle;
        border-radius: 0 3px 3px 0;
        display: table-cell;
        position: absolute;
        height: 100%;
        font-size: 12px;
        background: #136c84;
        border: 1px solid #064f63;
        z-index: 9;
        cursor: pointer;
        transition: all ease-in .1s;
        padding: 5px;
        line-height: 15px;
        top: 0;
        right: 0;
    }
input:disabled ~ .addon-btn, select:disabled ~ .addon-btn {
    background: #aab4b7;
    border: 1px solid #d2d2d2;
}
.addon-btn:hover {
    background: #3e9eb7;
    color: white !important;
}
.addon-btn:active {
    background: #6bbb8c;
    box-shadow: 0 0 4px 2px #00000057 inset;
}

.addon-btn.open-popup:hover span.btn-plus::after, .addon-btn:hover span.btn-plus::before {
    transform: scale(.9,.9);
}

.addon-btn:active, .addon-btn:focus {
    background: #77b791;
}

.addon-btn.open-popup:active span.btn-plus::after, .addon-btn:active span.btn-plus::before, .addon-btn.open-popup:focus span.btn-plus::after, .addon-btn:focus span.btn-plus::before {
    transform: scale(.9,.9);
}

.addon-btn.open-popup:active span.btn-plus::after, .addon-btn.open-popup:focus span.btn-plus::after {
    transition-delay: .0s;
    transform: rotate(180deg);
    top: 14px;
    right: 7px;
    width: 18px;
}

.addon-btn.open-popup:active span.btn-plus::before, .addon-btn.open-popup:focus span.btn-plus::before {
    transition-delay: .2s;
    height: 14px;
    position: absolute;
    top: 8px;
    background: transparent;
    border: 1px solid;
}

.addon-btn.open-popup:hover span.btn-plus::after {
    transition-delay: .0s;
    transform: rotate(180deg);
    top: 12px;
    right: 7px;
    width: 18px;
}

.addon-btn.open-popup:hover span.btn-plus::before {
    transition-delay: .2s;
    height: 14px;
    position: absolute;
    top: 8px;
    background: transparent;
    border: 1px solid;
}

.addon-btn span.btn-plus::after {
    content: "";
    height: 1px;
    width: 20px;
    position: absolute;
    top: 14px;
    right: 6px;
    background: white;
    transition: all ease-in .3s;
}

.addon-btn span.btn-plus::before {
    content: "";
    height: 1px;
    width: 20px;
    position: absolute;
    top: 14px;
    right: 6px;
    background: white;
    transform: rotate(90deg);
    -webkit-transition-duration: .3s;
    -webkit-transition-delay: .0s;
    transition-duration: .3s;
    transition-delay: .0s;
}
/*TRASH-ICON-ANIMATED*/
.icon-trash .trash-lid {
    width: 62%;
    height: 10%;
    position: absolute;
    left: 50%;
    margin-left: -31%;
    top: 10%;
    background-color: #676a6c;
    border-top-left-radius: 80%;
    border-top-right-radius: 80%;
    transform-origin: center left;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    transition: all ease-in .3s;
}

.icon-trash .trash-lid:after {
    content: "";
    width: 26%;
    height: 100%;
    position: absolute;
    left: 50%;
    margin-left: -13%;
    margin-top: -10%;
    background-color: inherit;
    border-top-left-radius: 30%;
    border-top-right-radius: 30%;
    -webkit-transform: rotate(-1deg);
    -moz-transform: rotate(-1deg);
    -ms-transform: rotate(-1deg);
    transform: rotate(-1deg);
}

.icon-trash .trash-container {
    width: 56%;
    height: 65%;
    position: absolute;
    left: 50%;
    margin-left: -28%;
    bottom: 10%;
    background-color: #676a6c;
    border-bottom-left-radius: 15%;
    border-bottom-right-radius: 15%;
    transition: all ease-in .3s;
}

.icon-trash .trash-container:after {
    content: "";
    width: 110%;
    height: 12%;
    position: absolute;
    left: 50%;
    margin-left: -55%;
    top: 0;
    background-color: inherit;
    border-bottom-left-radius: 45%;
    border-bottom-right-radius: 45%;
}

.icon-trash .trash-line-1 {
    width: 6%;
    width: 6%;
    height: 50%;
    position: absolute;
    left: 38%;
    margin-left: -2%;
    bottom: 17%;
    background-color: white;
}

.icon-trash .trash-line-2 {
    width: 6%;
    height: 50%;
    position: absolute;
    left: 50%;
    margin-left: -2%;
    bottom: 17%;
    background-color: white;
}

.icon-trash .trash-line-3 {
    width: 6%;
    height: 50%;
    position: absolute;
    left: 62%;
    margin-left: -2%;
    bottom: 17%;
    background-color: white;
}

.icon-trash:hover .trash-lid {
    transform: rotate(-20deg);
    top: 1px;
    background: #ed5565;
}

.icon-trash:hover .trash-container {
    background: #ec5050;
}

.icon-trash:hover {
    -webkit-animation-name: floating-can; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
    animation-name: floating-can;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-delay: .5s;
}
/*MODAL*/
.modal-content {
    background-clip: padding-box;
    background: linear-gradient(rgb(234, 234, 234), rgb(230, 230, 230));
    border: none;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    outline: 0 none;
    position: relative;
    overflow: hidden;
}
.modal-footer {
    background: linear-gradient(rgb(218, 218, 218), rgb(199, 199, 199)) !important;
}
.modal-footer {
    display: flex;
    justify-content: center;
}
/*AUTO-EXTENDER*/
.autoextender + ul {
    z-index: 999999999;
    position: fixed !important;
}
.autoextender-container {
    z-index: 999999999;
}
/*SCROLLER-STYLE*/
/*SLIM-SCROLLBAR*/
.slim-scrollbar::-webkit-scrollbar-track
{
	/*background-color: red;*/
}

.slim-scrollbar::-webkit-scrollbar
{
	width: 7px;
	height: 10px;
	background-color: gray;	
}

.slim-scrollbar::-webkit-scrollbar-thumb
{
	background-color: silver;
}
/*CHECKBOX-LIST*/
.checkbox-list
{
    padding: 0;
    margin: 20px 10px 0 10px;
    border: 1px solid silver;
    border-radius: 0px;
    box-shadow: 0 0px 6px grey inset;
}
.checkbox-list .scrolling-section-static
{
    height: 100px;
    overflow-y: auto;
}
.checklist-header a
{
    padding: 2px 4px;
    font-weight: 600;
    color: white;
    width: 49%;
    display: inline-block;
}
.checklist-header a:first-child
{
    padding-left: 6px;
    text-align: left;
}
.checklist-header a:last-child
{
    text-align: right;
}
.checklist-header
{
    background: #1ab394;
}
.checkbox-list table
{
    display: table;
    width: 100%;
}
.checkbox-list table tr:hover
{
    background: #ffffe8;
    cursor: pointer;
}
.checkbox-list table tr input[type=checkbox]
{
    visibility: hidden;
}
.checkbox-list table tr td
{
    position: relative;
    border-bottom: 1px solid #d6d6d6;
}
.checkbox-list table tr input[type=checkbox]:checked + label:hover
{
    background: #4bc794;
}
.checkbox-list table tr input[type=checkbox]:checked + label
{
    color: #ffffff;
    background: #4cd099;
}
.checkbox-list table tr input[type=checkbox] + label
{
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    margin: 0;
    padding: 1px 5px 1px 5px;
    cursor: pointer;
    overflow: hidden;
}
.checkbox-list table tr input[type=checkbox] + label::after
{
    transition: all ease-in .3s;
    transform: rotate(-180deg);
    position: absolute;
    top: 6px;
    right: -10px;
    content: '';
    display: block;
    width: 5px;
    height: 10px;
    border: solid black;
    border-width: 0 2px 2px 0;
}
.checkbox-list table tr input[type=checkbox]:checked + label::after
{
    position: absolute;
    top: 6px;
    right: 10px;
    content: '';
    display: block;
    width: 5px;
    height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
/*REPORT-FILTER*/
.filter {
    background: #f4f4f4;
    display: none;
    position: absolute;
    z-index: 99;
    top: 46px;
    right: 0px;
    box-shadow: 0 2px 6px #484848;
    width: 300px;
    border-radius: 4px;
    padding-bottom: 5px;
}
.filter * {
	font-size: 12px;
	font-weight: 600;
}
.filter input, .filter select {
    font-size: 12px;
    font-weight: 400;
    padding: 2px 5px;
    border-radius: 3px !important;
}
.filter span.filter-label {
	margin-left: 5px;
	padding-top: 5px;
	display: block;
}
.full-width {
    width: 100% !important;
    display: inline-block;
}
.sort {
    background: linear-gradient(#eaeaea, gainsboro);
    display: none;
    position: absolute;
    z-index: 99;
    top: 35px;
    right: 35px;
    box-shadow: 0 2px 6px #484848;
    width: 300px;
    border-radius: 4px;
}
.filter::before {
	content: "";
	position: absolute;
	top: -6px;
	right: 10px;
	height: 18px;
	width: 18px;
	background: #f4f4f4;
	transform: rotate(45deg);
	box-shadow: -2px -2px 2px -2px;
}
.sort::before {
	content: "";
	position: absolute;
	top: -6px;
	right: 10px;
	height: 18px;
	width: 18px;
	background: #e9e9e9;
	transform: rotate(45deg);
	box-shadow: -2px -2px 2px -2px;
}
.filter .panel-body, .sort .panel-body {
    display: flex;
    padding: 15px 0;
}
.fa-filter {
    position: relative;
    cursor: pointer;
}

.filter-icon:hover {
    color: #79dbec;
}

.filter-icon.active {
    color: #1ab394;
}

.filter-data {
    display: block;
}

.filter-icon {
    cursor: pointer;
    font-size: 20px !important;
    padding: 2px;
    background: #f2f2f2;
    height: 25px;
    width: 25px;
    text-align: center;
    border-radius: 3px;
    border: 1px solid #d8d8d8;
    color: #cbcbcb;
}

.filter-section {
    display: table;
    padding: 10px 0 20px;
}

.fliter-section {
    padding: 8px 8px 4px 8px;
    background: white;
    border-bottom: 1px solid #efefef;
    background: #f7f7f7;
    display: inline-block;
    float: left;
}
.selected-filetrs {
    display: block;
    width: calc(100% - 70px);
    float: left;
}

.filter-field {
    padding: 0 3px;
    padding-right: 3px;
    display: block;
    float: left;
    background: linear-gradient(#eaeaea 26%,#b5b5b5 60% );/*linear-gradient(#c3e2d2 25%,#86b1ab 66% ); /*linear-gradient(#ade8b7,#30a292); linear-gradient(#dcdcdc,#ffffff);*/
    padding-right: 30px;
    position: relative;
    margin-right: 5px;
    margin-bottom: 3px;
    border-radius: 2px;
    -webkit-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    transform: rotateY(0deg);
    /*transition: all cubic-bezier(.92,-0.54,.67,1.01) .8s;*/
    transition: box-shadow ease-in .2s;
}

.filter-field:hover {
	box-shadow: 0 0 4px gray;
}

.filter-field.rotate-remove {
	-webkit-transform: rotateY(90deg);
	-ms-transform: rotateY(90deg);
	transform: rotateY(90deg);
}

.field-name {
    font-size: 11px;
    color: #000000;
    padding: 4px;
    border-right: 1px solid #7b7b7b;
    float: left;
    font-weight: 600;
}

.field-text {
    font-size: 11px;
    color: black;
    padding: 4px;
    float: left;
}

.filter-field span.delete:not(.disabled):hover {
    color: #db5151;
    background: white;
    cursor: pointer;
}

.filter-field span.delete {
    position: absolute;
    top: 3px;
    right: 4px;
    height: 16px;
    width: 16px;
    background: #636363;
    border-radius: 2px;
    text-align: center;
    font-weight: bold;
    color: white;
    font-family: inherit;
    cursor: auto;
    font-size: 10px;
    /* box-shadow: 0 0 4px white inset; */
    padding-top: 2px;
    line-height: 14px;
}
/*INPUT-VALIDATION*/
input.required, select.required {
    border-left: 2px solid red !important;
}
/*LEFT-MENU*/
.menu-bg {
    background: url('../img/gallery/Diesel-Fuel-Delivery-1-1.jpg');
    background-size: cover;
    background-position: 65%;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0.4;
}

li.nav-par.active > a {
    background: rgb(6, 79, 99) !important;
    color: white !important;
}
li.nav-par.active.hover > a {
    background: rgb(169, 69, 69) !important;
    color: white !important;
}
ul#side-menu li {
    border-bottom: 1px solid #0000002b;
    display: block;
    width: 100%;
}
ul.no-border-list li
{
   border-bottom: none !important; 
}
ul.nav.nav-second-level.collapse.in > li.active > a:first-child {
    background: #136c84;
    color: white !important;
}
li.nav-par.active a {
    color: white !important;
}
.md-skin .nav.metismenu li a {
    color: #3e3f40;
    padding: 0 10px 0 0;
    font-weight: 700;
    font-size: 14px;
    display: flex;
    line-height: 40px;
    position: relative;
}
.nav.metismenu li a i {
    margin-right: 0;
    padding: 14px 0;
    border-right: 1px solid #0000002b;
    width: 42px;
    text-align: center;
}
.nav.metismenu  li  a span {
    padding: 0 10px;
}
.metismenu .arrow {
    float: right;
    line-height: 1.42857;
    padding: 11.5px 0 !important;
    position: absolute;
    right: 10px;
}
.md-skin .navbar-default .nav > li > a:hover, .md-skin .navbar-default .nav > li > a:focus {
    font-weight: 700;
    /*color: white !important;*/
}
.md-skin .nav.metismenu li a:hover > i {
    color: white;
    box-shadow: 0 0 53px #000000 inset;
}
li.nav-par.active > a:hover > i {
    /*background: #229c64 !important;*/
}
.md-skin .navbar-default .nav > li > a:hover i, .md-skin .navbar-default .nav > li > a:focus i {
    /*background: #cca95b;*/
}
.md-skin .nav.metismenu > li.active > a, .md-skin .nav > li.active > a:focus {
    color: #ffffff;
    font-weight: 700;
}
.md-skin .nav.metismenu > li.active {
    /* background: #87daca; */
    background: rgba(25, 105, 117, 0.56);
}
.md-skin .nav.metismenu > li.active {
    /* background: #87daca; */
    background: rgb(6, 123, 158);
}
.md-skin .nav.metismenu > li.active li.active {
    /* background: #e1f5f1; */
    background: rgba(80, 205, 230, 0.48);
}
.md-skin .nav.metismenu > li.active li.active li.active {
    background: #7dd5eaad;
}
.md-skin .nav.metismenu > li.active li.active li.active > a {
    background: #238ca9;
    color: white;
}
.nav.metismenu li a i.fa.fa-angle-right + span {
    font-weight: 300;
    font-size: 14px;
    line-height: 22px;
    width: 149px;
    display: inline-block;
    white-space: pre-wrap;
    padding: 10px;
}
.md-skin .navbar-default .nav > li > a:hover, .md-skin .navbar-default .nav > li > a:focus {
    font-weight: 700;
    color: #033d4e;
}
.nav.metismenu li a i.fa-angle-right {
    font-weight: 600;
    border-right: 1px solid #0000002b;
    position: relative;
}
.nav.metismenu li a i.fa-angle-right:before {
    content: "\f105";
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
i.fa.fa-angle-right ~ span.arrow {
    display: none;
}
ul#side-menu a.current:after {
    content: "";
    position: absolute;
    height: 10px;
    width: 10px;
    display: block;
    background: #ff3b3b;
    border-radius: 100%;
    right: 10px;
    border: 1px solid white;
    top: calc(50% - 5px);
    animation: blink-animation 1s steps(5, start) infinite;
    -webkit-animation: blink-animation 1s steps(5, start) infinite;
}
@keyframes blink-animation {
    to {
        visibility: hidden;
    }
}

@-webkit-keyframes blink-animation {
    to {
        visibility: hidden;
    }
}
/*REPORT*/
@-moz-keyframes led-blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
/* Firefox */
@-webkit-keyframes led-blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
/* Webkit */
@-ms-keyframes led-blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
/* IE */
@keyframes led-blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
ul.sort-list {
    padding: 0;
    margin: 0;
    list-style-type: none;
    background: linear-gradient(white, #e6e6e6);
    border-radius: 4px;
    box-shadow: 0 0 5px grey inset;
    overflow:hidden;
}
ul.sort-list li {
	padding: 0;
	margin: 0;
}
ul.sort-list li label {
	margin: 0;
	padding: 3px 10px;
	display: block;
	cursor: pointer;
	position: relative;
	font-weight: 600;
	font-size: 12px;
	border-bottom: 1px solid gainsboro;
}
		ul.sort-list li label input[type=radio], ul.sort-list li label input[type=checkbox] {
	opacity: 0;
	position: absolute;
}

ul.sort-list li label input[type=radio]:checked + span, ul.sort-list li label input[type=checkbox]:checked + span {
	height: 100%;
	width: 100%;
	border-bottom: 1px solid limegreen;
	position: absolute;
	top: 0;
	right: 0;
	transition: all ease-in .2s;
}
span .asc, span .desc {
	visibility: hidden;
	position: absolute;
	right: 5px;
	top: 6px;
	font-size: 12px;
	font-weight: 100;
	color: #3ab394;
}
input:checked.desc + span .desc {
	visibility: visible;
}
input:checked.asc + span .asc {
	visibility: visible;
}
ul.sort-list li label:hover {
	background: rgba(206, 206, 206, 0.44);
}
    
/*FLEX-BOX*/
.flex-box {
    display: flex;
}
/*FIXED-HEADER-TABLE*/
/*.u-table tr:first-child th:first-child {
    text-align: center;
    width: 50px;
}*/
/*.table-responsive
{
    max-height:400px;
}*/
.hide-scroll-v
{
    overflow-y: hidden;
}
.fixed {
    transition: opacity ease-in .2s;
    display: none;
    position: fixed;
    background: linear-gradient(#f3f3f3, #d8d8d8);
    height: 25px;
    padding: 2px 8px 2px 4px;
    text-align: center;
    border: 1px solid #d6d6d6;
    opacity: 1;
    line-height: 20px;
    z-index:9;
}
tr:first-child th:not(:last-child) .fixed
{
    border-right: none;
}
.fixed.oveflowing 
{
    opacity: 0;
}
/*PRINT-PAGE*/
.print-page {
    display: block;
    max-width: 800px;
    position: fixed;
    transition: all cubic-bezier(0.16, 1.35, 0.9, 0.95) .4s;
    height: 0;
    width: 100%;
    left: 50%;
    top: -100%;
    transform: translateX(-50%);
    z-index: 99999;
    transition: all ease-in 1s;
    border-radius: 5px;
    overflow: hidden;
    background: white;
    box-shadow: 0 2px 15px #00000066;
}
.print-page .export-btns {
    padding: 10px;
    background: linear-gradient(#e2e2e2,#e4e4e4);
    display: inline-block;
    width: 100%;
}
.print-page .content {
    overflow-y: auto;
    overflow-x: hidden;
    padding: 10px;
    background: white;
    display: inline-block;
    width: 100%;
}
.print-page > .export-btns > i {
    height: 25px;
    width: 25px;
    padding: 6px 8px;
    background: #f76767;
    border-radius: 3px;
    color: white;
}
.btn-export {
    margin-right: 5px;
    font-weight: 500;
    padding: 3px 8px;
    border-radius: 3px;
    color: white !important;
    display: inline-block;
    cursor:pointer;
}
.btn-export::selection
{
    background:transparent;
}
.print-page .content > *
{
    width: 100%;
    overflow: auto;
    height: 100%;
}
.print-page.active {
    display: block;
    transition: all cubic-bezier(0.16, 1.35, 0.9, 0.95) .4s;
    height: calc(100% - 20px);
    top: 10px;
    transform: translateX(-50%);
    z-index: 99999;
}
.btn-export.pdf {
    background: linear-gradient(#f53636,#ac0808);
}
.btn-export.excel {
    background: linear-gradient(#69e669,forestgreen);
}
.btn-export.print {
    background: linear-gradient(darkorange,#ca7104);
}
.btn-export.mail {
    background: linear-gradient(#78a5f7,#325ba5);
}
.btn-export:hover,.btn-export:focus  {
    box-shadow: 0 4px 6px #00000080;
}
.btn-export:active {
    position:relative;
    top:1px;
    box-shadow: 0 2px 2px #00000080;
}
.print-backdrop {
    transition: all ease .5s;
    visibility: hidden;
    opacity: 0;
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 9999;
    background: #2b2b2be6;
}
.print-page.active + .print-backdrop {
    visibility:visible;
    opacity:1;
}
/*HIDE FORM HEADER-TITLE*/
.ibox-title {
    display: none;
}
.u-table tr.selected-row td {
    background: #0ea3e0;
    color: white !important;
}
.no-wrap-cells th, .no-wrap-cells td
{
    white-space: nowrap;
}
.faded-bg {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(0,0,0,.4);
    z-index:9999;
}
.faded-bg p {

    color: White;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    font-size: 11px;

}
.bold-last-row tr:last-child * {
    font-weight: bold;
}

.col-lg-0 {
    height: 0;
}
.loading-circle {

    height: 30px;
    width: 30px;
    border-radius: 20px;
    border: 4px dashed silver;
    display: block;
    margin: auto;
        margin-bottom: auto;
    margin-bottom: 10px;
    -webkit-animation-name: spin;
    -webkit-animation-duration: 4000ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: spin;
    -moz-animation-duration: 4000ms;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: spin;
    -ms-animation-duration: 4000ms;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    animation-name: spin;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;

}

input + ul {
    z-index: 9;
}
.clear-date-btn {
    position: absolute;
    top: 4px;
    right: 0;
    padding: 0px;
    background: #bcc0c5;
    width: 12px;
    height: 12px;
    color: white;
    text-align: center;
    border-radius: 10px;
    font-size: 10px;
    margin: 6px 5px;
    cursor: pointer;
    z-index: 9;
}
.clear-date-btn:hover {
    background: red;
}
.popup-box {
    display: none;
    position: absolute;
    padding: 5px;
    background: #ffffff;
    border-radius: 5px;
    box-shadow: 0 2px 6px;
    z-index: 9;
    top: 17px;
    right: 5px;
    width: 200px;
}
.popup-box::before {
    content: "";
    position: absolute;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #a7a7a7;
    top: -7px;
    left: calc(100% - 20px);
}
.popup-box-btn {
    position: absolute;
    top: -11px;
    right: 8px;
    text-align: center;
    background: #0c647b;
    height: 19px;
    width: 19px;
    border-radius: 10px;
    line-height: 19px;
    color: white;
    font-size: 10px;
}
.popup-box-btn:hover {
    background: #4eb372;
}
#right-sidebar {
    top: 50px;
    overflow:visible;
    transition:all ease-in .4s;
}
.tab-btn.active {
    background: #f9f9f9 !important;
    color: black !important;
}
.nav.navbar-top-links.navbar-right li a:hover {
    background: #188a73;
}
#right-sidebar .form-group.mt-1 label:first-child {
    width: 75%;
}
.user-preference-btn:hover {
    transition: all ease-in .2s;
}
.user-preference-btn {

    padding: 2px 10px;
    transform: rotate(--90deg);
    position: relative;
    left: -76px;
    transform: rotate(-90deg);
    position: absolute;
    top: 95px;
    border-radius: 4px 4px 0 0;
    background: linear-gradient(#22c2f6,#009dbf);
    color: #fbfbfb !important;
    box-shadow: 0px -1px 2px #0003;
    z-index: 99;
    border-bottom: 1px solid #06a3c8;

}
.user-preference-btn i
{
    margin-right:4px;
}

.whatsnew span {
    font-weight: 600;
    color: #6ab077;
    font-family: arial;
}
.whatsnew:hover .newfeature {
    
}
.newfeature 
{
    display:none;
    height: auto;
    overflow: hidden;
    position: absolute;
    top: 50px;
    right: 25px;
    -moz-transition: height ease-in-out .4s;
    -webkit-transition: height ease-in-out .4s;
    -o-transition: height ease-in-out .4s;
    transition: height ease-in-out .4s;
    background: linear-gradient(#f8f8f8, silver);
    z-index: 999;
    box-shadow: 0 2px 6px #484848;
    max-width: 400px;
    border-radius: 4px;
    width: 100%;
}
.newfeature ol {
    padding: 10px 20px;
}
.newfeature li {
    text-align: left;
    white-space: normal;
}
/*REPORT GROUPS*/
.report-group * {

    font-weight: bold;
    color: #0056b3;

}

.report-header * {
font-weight: bold;
color: #676a6c;
}
.report-total
{
    
}
.report-total *
{
    font-weight:bold;
}
/*ANIMATION*/
/*SPIN*/
@-ms-keyframes spin { 
        from { 
            -ms-transform: rotate(0deg); 
        } to { 
            -ms-transform: rotate(360deg); 
        }
    }
    @-moz-keyframes spin { 
        from { 
            -moz-transform: rotate(0deg); 
        } to { 
            -moz-transform: rotate(360deg); 
        }
    }
    @-webkit-keyframes spin { 
        from { 
            -webkit-transform: rotate(0deg); 
        } to { 
            -webkit-transform: rotate(360deg); 
        }
    }   
    
    /*DASHBOARD*/
.inline-full-width {
    display: inline-block;
    width: 100%;
}

.statistic-box {
    margin: 0;
    float: left;
    perspective: 1000px;
}

    .statistic-box h1, .statistic-box h2, .statistic-box h3, .statistic-box h4, .statistic-box h5, .statistic-box h6 {
        margin: 0;
        padding: 0;
        font-weight: bold;
    }

.bg-c-green {
    background: -webkit-gradient(linear,left top,right top,from(#3d6ca3),to(#7cf880));
    background: linear-gradient(45deg, #3d6ca3, #7cf880);
}

.bg-b-p {
    background: -webkit-gradient(linear,left top,right top,from(#3a82b3),to(#d775c2));
    background: linear-gradient(to right,#3a82b3,#d775c2);
}

.bg-y-r {
    background: linear-gradient(to right,#c2870a,#d1487b);
}

.bg-skyblue {
    background: -webkit-gradient(linear,left top,right top,from(#00a1ff),to(#00a1ff));
    background: linear-gradient(#00a1ff,#00a1ff);
}

.bg-violet {
    background: -webkit-gradient(linear,left top,right top,from(#466fcc),to(#466fcc));
    background: linear-gradient(#466fcc,#466fcc);
}

.bg-yellow {
    background: -webkit-gradient(linear,left top,right top,from(#ffbc00),to(#ffbc00));
    background: linear-gradient(#ffbc00,#ffbc00);
}

.bg-d-green {
    background: -webkit-gradient(linear,left top,right top,from(#3bb05a),to(#3bb05a));
    background: linear-gradient(#3bb05a,#3bb05a);
}

.bg-red {
    background: -webkit-gradient(linear,left top,right top,from(#ef3333),to(#ef3333));
    background: linear-gradient(#ef3333,#ef3333);
}

.card {
    border-radius: 5px;
    -webkit-box-shadow: 0 1px 20px 0 rgba(69,90,100,.08);
    box-shadow: 0 1px 20px 0 rgba(69,90,100,.08);
    border: none;
    margin-bottom: 30px;
}

.card {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: .25rem;
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transform-style: preserve-3d;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: transform 0.5s;
    -webkit-transition: transform 1s;
    -moz-transition: transform 1s;
    -o-transition: transform 1s;
    position: relative;
    transform-style: preserve-3d;
    will-change: transform;
}

.statistic-box:hover .card {
    transform: rotate3d(15, 15, 1, 15deg);
}

.card-block {
    padding: 1.25rem;
}

.align-items-end {
    -ms-flex-align: end !important;
    align-items: flex-end !important;
}

.update-card .card-footer {
    background-color: transparent;
    border-top: 1px solid #fff;
}

.card .card-header {
    background-color: #fff;
    border-top: none;
}

.card-header:last-child {
    border-radius: 0 0 calc(.25rem - 1px) calc(.25rem - 1px);
}

.card-header {
    padding: .75rem 1.25rem;
    background-color: rgba(0,0,0,.03);
    border-top: 1px solid rgba(0,0,0,.125);
}

.feather {
    font-family: feather !important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.statistic-box .card .row.align-items-center h2, .statistic-box .card .row.align-items-center h3, .statistic-box .card .row.align-items-center h5 {
    transform: translateZ(10px) scale(0.999);
}
.user-preference-btn {
    display: none;
}
/*ACCORDATION-FORM*/
.accordion--form {
    width: 100%;
}

.accordion--form__fieldset {
    border: 0;
    margin: 0 0 1px 0;
    padding: 0;
}

.accordion--form__legend-active {
    background: linear-gradient(#19c0a082, #069e8c85);
    color: #fff;
    border-radius: 3px;
}

.accordion--form__legend-active {
    background: linear-gradient(#1cbd9f, #37c3a8) !important;
    color: #fff;
    border-radius: 3px 3px 0 0 !important;
    background-color: white;
}

.accordion--form__legend {
    background: linear-gradient(#c3c3c3,#bbb9b9);
    color: #fff;
    display: block;
    margin: 0;
    padding: 5px 10px;
    width: 100%;
    border-radius: 3px;
    font-weight: 300;
}

legend {
    cursor: pointer !important;
    display: block;
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin-bottom: .5rem;
    font-size: 1.05rem;
    line-height: inherit;
    white-space: normal;
}

.accordion--form__wrapper {
    max-height: 0;
    height: auto;
    overflow: hidden;
    transition: all ease-in-out .2s;
}

.accordion--form__wrapper-active {
    max-height: 500px;
    padding: 40px 10px 10px 10px;
    transition: all ease-in-out .5s;
    background: white;
    border-radius: 0 0 5px 5px;
    margin-bottom: 10px;
}

.accordion--form__row {
    margin-bottom: 15px;
    padding-right: 5px;
    padding-left: 5px;
    float: left
}

.accordion--form__label {
    display: inline-block;
    margin-bottom: 5px;
}

.accordion--form__text {
    color: #000;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    padding: 5px 10px;
}

.accordion--form__textarea {
    color: #000;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    padding: 5px 10px;
}

.accordion--form__submit {
}
/*input,textarea{
    width:100%;
}*/
.accordion--form__invalid {
    background-color: #fd7474;
    color: #fff;
    display: none;
    margin: 20px 0;
    padding: 5px 10px;
    width: 100%;
    border-radius: 3px;
}

.accordion--form__next-btn, .accordion--form__prev-btn {
    background-color: #219888;
    border-radius: 3px;
    color: #fff !important;
    cursor: pointer;
    display: inline-block;
    margin: 0 2px 0 0;
    padding: 5px 10px;
    text-align: center;
}
.btn-sm.btn-primary {
    background-color: #219888;
    border-radius: 3px;
    color: #fff !important;
    cursor: pointer;
    display: inline-block;
    margin: 0 2px 0 0;
    padding: 5px 10px;
    text-align: center;
}
    .accordion--form__next-btn:hover,
    .accordion--form__prev-btn:hover {
        background-color: #000;
    }

legend.accordion--form__legend i.fa {
    width: 30px;
    text-align: center;
}
fieldset h4 {
    margin: 0 0 30px 10px;
    border-bottom: 1px solid #efefef;
    padding-bottom: 3px;
}
/*ACTION-ICONS*/
.fa.fa-print.icon {

    height: 28px;
    width: 28px;
    background: white;
display: inline-block;
border-radius: 100%;
text-align: center;
color:#176459;
    font-size: 18px;
    margin: 3px;
    padding: 5px;
}
.fa.fa-print.icon:hover {
    color: white;
background:#176459;
}
/*PAGINATION-CONTROLS-REPORT*/
.report-footer-controls {
    margin-top: 10px;
    text-align: center;
}
.report-footer-controls .dataTables_length select {
    padding: 0;
}
.report-footer-controls > * {
    display: inline-block;
}
.dataTables_info {
    margin-top: 20px;
}
.dataTables_paginate.paging_simple_numbers {
    float: right;
    top: 10px;
    position: relative;
}
div#page-wrapper {
    padding-top: 65px !important;
}
body.navbar-top div#page-wrapper {
    padding-top: 90px !important;
    margin-left: 0;
}
/*SCROLLBAR*/
/* width */
::-webkit-scrollbar {
    width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f4f4f4;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: silver;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #555;
}
/*LOADING-ANIMATION*/
.loading-message .spinner {
    width: 40px;
    height: 40px;
    background: #74a6f2;
    padding: 0;
}

    .loading-message .spinner div {
        width: 6%;
        height: 16%;
        background: #FFF;
        position: absolute;
        left: 49%;
        top: 43%;
        opacity: 0;
        -webkit-border-radius: 50px;
        -webkit-box-shadow: 0 0 3px rgba(0,0,0,0.2);
        -webkit-animation: fade 1s linear infinite;
    }

@-webkit-keyframes fade {
    from {
        opacity: 1;
    }

    to {
        opacity: 0.25;
    }
}

.loading-message .spinner div.bar1 {
    -webkit-transform: rotate(0deg) translate(0, -130%);
    -webkit-animation-delay: 0s;
}

.loading-message .spinner div.bar2 {
    -webkit-transform: rotate(30deg) translate(0, -130%);
    -webkit-animation-delay: -0.9167s;
}

.loading-message .spinner div.bar3 {
    -webkit-transform: rotate(60deg) translate(0, -130%);
    -webkit-animation-delay: -0.833s;
}

.loading-message .spinner div.bar4 {
    -webkit-transform: rotate(90deg) translate(0, -130%);
    -webkit-animation-delay: -0.7497s;
}

.loading-message .spinner div.bar5 {
    -webkit-transform: rotate(120deg) translate(0, -130%);
    -webkit-animation-delay: -0.667s;
}

.loading-message .spinner div.bar6 {
    -webkit-transform: rotate(150deg) translate(0, -130%);
    -webkit-animation-delay: -0.5837s;
}

.loading-message .spinner div.bar7 {
    -webkit-transform: rotate(180deg) translate(0, -130%);
    -webkit-animation-delay: -0.5s;
}

.loading-message .spinner div.bar8 {
    -webkit-transform: rotate(210deg) translate(0, -130%);
    -webkit-animation-delay: -0.4167s;
}

.loading-message .spinner div.bar9 {
    -webkit-transform: rotate(240deg) translate(0, -130%);
    -webkit-animation-delay: -0.333s;
}

.loading-message .spinner div.bar10 {
    -webkit-transform: rotate(270deg) translate(0, -130%);
    -webkit-animation-delay: -0.2497s;
}

.loading-message .spinner div.bar11 {
    -webkit-transform: rotate(300deg) translate(0, -130%);
    -webkit-animation-delay: -0.167s;
}

.loading-message .spinner div.bar12 {
    -webkit-transform: rotate(330deg) translate(0, -130%);
    -webkit-animation-delay: -0.0833s;
}

.spinner.success:after {
    height: 12px;
    width: 20px;
    content: "";
    position: absolute;
    border-left: 5px solid white;
    border-bottom: 5px solid white;
    transform: rotate(-45deg);
    top: 13px;
    left: 11px;
}

.spinner.success > * {
    display: none;
}
/*LOADING-MESSAGE*/
.flex-box {
    display: flex;
}

.loading-message {
    position: fixed;
    width: 100%;
    left: 0;
    top: -65px;
    height: 0;
    text-align: center;
    background: #00000017;
    z-index: 99999;
    cursor: wait;
}

.loading-message-info {
    position: relative;
    font-size: 14px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 10px;
    background: white;
    color: gray;
}

.loading-message .spinner {
    background: #74a6f2;
    padding: 0;
    height: 100%;
    min-height: 40px;
    width: 40px;
}

.loading-message.show {
    height: 100%;
    top: 0;
}

.loading-message.no-load {
    height: 0;
}

.loading-message > .loading-message-box {
    display: inline-block;
    margin: 10px;
    position: relative;
    border-radius: 5px;
    overflow: hidden;
    top: -60px;
    transition: all cubic-bezier(0.13, 0.55, 0.62, 1.17) .3s;
    box-shadow: 0 0 4px 1px #00000094;
}

.loading-message.show > .loading-message-box {
    top: 0;
}

.loading-message-img {
    position: relative;
}

.loading-message-info {
    position: relative;
    font-size: 14px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 10px;
    background: white;
    color: #4e4e4e;
}

    .loading-message-info p {
        margin: 0;
    }

.spinner.success {
    background: #80c07c;
}

.spinner.failure {
    background: #ca6666;
}

/**NOTIFICATIONS**/
@keyframes ding {
    0% {
        transform: rotate(25deg);
    }

    12.5% {
        transform: rotate(-20deg);
    }

    25% {
        transform: rotate(15deg);
    }

    37.5% {
        transform: rotate(-20deg);
    }

    50% {
        transform: rotate(5deg);
    }

    62.5% {
        transform: rotate(-3deg);
    }

    75% {
        transform: rotate(2deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

.toggleNotifications {
    position: relative;
    display: inline-flex;
    float: right;
    width: 48px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .toggleNotifications .show:hover {
        background: rgb(206, 44, 44);
        cursor: pointer;
        color: white;
    }

    .toggleNotifications .show {
        flex: 1;
        margin: 3px 3px;
        height: 25px;
        max-width: 25px;
        text-align: center;
        border: 1px solid #ffffff;
        border-radius: 50%;
        background: white;
        font-size: 15px;
        transition: all 0.2s;
        color: #c14747;
    }

        .toggleNotifications .show i.fa-bell {
            line-height: 23px;
        }

        .toggleNotifications .show i.fa-bell {
            line-height: 23px;
        }

            .toggleNotifications .show i.fa-bell.ding {
                animation: ding 1.5s ease infinite;
                transform-origin: top center;
            }

        .toggleNotifications .show i {
            line-height: 38px;
        }

.count {
    position: absolute;
    top: -3px;
    right: 26px;
}

    .count .num {
        position: absolute;
        top: 0px;
        left: 0px;
        background: #4ba756;
        border-radius: 50%;
        width: 18px;
        color: white;
        height: 18px;
        font-weight: bold;
        text-align: center;
        line-height: 16px;
        font-size: 11px;
        box-shadow: 0px 4px 3px rgba(0, 0, 0, 0.25);
        border: 1px solid rgba(255, 255, 255, 0.96);
        transition: all 0.3s;
    }

.notifications {
    position: absolute;
    top: 46px;
    right: -3px;
    width: 300px;
    background: #fff;
    border: 1px solid #a5a5a5;
    border-top: 1px solid #b53333;
    border-radius: 7px;
    box-shadow: 0px 6px 5px rgba(0, 0, 0, 0.5);
    transition: all 0.2s;
    z-index: 99999;
    visibility: hidden;
    opacity: 0;
}

    .notifications:after {
        display: none;
        content: ' ';
        position: absolute;
        top: -15px;
        right: 22px;
        width: 0px;
        height: 10px;
        border-right: 7px solid transparent;
        border-left: 7px solid transparent;
        border-bottom: 7px solid #fff;
        pointer-events: none;
    }

    .notifications:before {
        content: ' ';
        position: absolute;
        top: -10px;
        right: 26px;
        width: 0px;
        height: 10px;
        border-right: 7px solid transparent;
        border-left: 7px solid transparent;
        border-bottom: 7px solid #b53333;
        pointer-events: none;
    }

    .notifications .btnbar {
        position: relative;
        height: 40px;
        background: linear-gradient(rgb(189, 55, 55), rgb(119, 24, 24));
        box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25);
        border-radius: 5px 5px 0 0 !important;
    }

        .notifications .btnbar .text {
            line-height: 40px;
            padding: 0px 20px;
            position: absolute;
            top: 0px;
            transition: all 1s;
            font-weight: bold;
            color: white;
        }

            .notifications .btnbar .text.empty {
                opacity: 0;
            }

        .notifications .btnbar .delete {
            position: absolute;
            right: 15px;
            top: 4px;
            width: 30px;
            height: 30px;
            background: rgb(255, 255, 255);
            border-radius: 50%;
            text-align: center;
            border: 2px solid rgb(138, 134, 134);
            transition: all 0.2s;
        }

            .notifications .btnbar .delete i {
                line-height: 29px;
                height: 30px;
                width: 25px;
                font-size: 17px;
                text-align: center;
                color: #d8301e;
            }

                .notifications .btnbar .delete i.empty {
                    opacity: 0;
                }

            .notifications .btnbar .delete:hover i.fa-trash {
                color: white;
            }

            .notifications .btnbar .delete:hover {
                background: rgba(169, 53, 37, 0.95);
                cursor: pointer;
            }

    .notifications .note {
        padding: 0px 10px;
        /* height: 30px; */
        line-height: 30px;
        border-bottom: 1px solid #eaeaea;
        transition: all 0.2s;
        overflow: hidden;
        /* max-height: 40px; */
        color: #101010;
        font-weight: 500;
        position: relative;
        font-size: 12px;
        white-space: pre-wrap;
    }

.groupofnotes .note:last-child {
    border-radius: 0 0 5px 5px;
}

.notifications .btnbar .delete i.fa-undo {
    color: white;
    position: relative;
    top: -30px;
}

.notifications .note:first-of-type {
    margin-top: 0px;
}

.notifications .note.read {
    color: #CDCDCD;
}

.notifications .note:hover i {
    color: white;
}

.notifications .note:hover {
    background: rgb(70, 187, 255);
    cursor: pointer;
    color: white;
    border-bottom: 1px solid #3cacec;
}

.notifications .note i.material-icons {
    position: relative;
    top: -2px;
    margin-right: 5px;
    vertical-align: middle;
    color: #3a3a3a !important;
    width: 15px;
    font-size: 14px;
    height: 24px;
    width: 24px;
    background: #5190ef;
    padding: 3px 0;
    border-radius: 16px;
    text-align: center;
    border: 1px solid #ffffff;
    color: #ffffff !important;
}

.notifications .note .notification-count {
    border: 1px solid white;
    /* width: 16px; */
    height: 16px;
    position: absolute;
    right: 10px;
    top: 6.5px;
    line-height: 15px;
    text-align: center;
    font-size: 11px;
    background: #f18181;
    border-radius: 10px;
    color: white;
    font-family: arial;
    font-weight: 300;
    padding: 0 4px;
}

.note.none .notification-count {
    background: #9a149c;
}

.note.Low .notification-count {
    background: #1baf3b;
}

.note.medium .notification-count {
    background: #65adea;
}

.note.high .notification-count {
    background: #ff8100;
}

.note.urgent .notification-count {
    background: #e63131;
}

#navtoggle {
    display: none;
}

    #navtoggle:checked ~ .toggleNotifications .notifications {
        opacity: 1;
        visibility: visible;
    }

#deletetoggle {
    display: none;
}

    #deletetoggle:checked ~ .toggleNotifications .notifications .groupofnotes .note {
        max-height: 0px;
    }

        #deletetoggle:checked ~ .toggleNotifications .notifications .groupofnotes .note:nth-of-type(1) {
            transition-delay: 0.2s;
        }

        #deletetoggle:checked ~ .toggleNotifications .notifications .groupofnotes .note:nth-of-type(2) {
            transition-delay: 0.4s;
        }

        #deletetoggle:checked ~ .toggleNotifications .notifications .groupofnotes .note:nth-of-type(3) {
            transition-delay: 0.6s;
        }

        #deletetoggle:checked ~ .toggleNotifications .notifications .groupofnotes .note:nth-of-type(4) {
            transition-delay: 0.8s;
        }

    #deletetoggle:checked ~ .toggleNotifications .notifications .btnbar .delete {
        transition-delay: 1s;
        background: #28bf73;
    }

    #deletetoggle:checked ~ .toggleNotifications .notifications .btnbar .full {
        opacity: 0;
    }

    #deletetoggle:checked ~ .toggleNotifications .notifications .btnbar .empty {
        opacity: 1;
        transition-delay: 1s;
    }

    #deletetoggle:checked ~ .toggleNotifications .count .num {
        opacity: 0;
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px);
    }

        #deletetoggle:checked ~ .toggleNotifications .count .num:nth-of-type(4) {
            transition-delay: 0.25s;
        }

        #deletetoggle:checked ~ .toggleNotifications .count .num:nth-of-type(3) {
            transition-delay: 0.3333333333s;
        }

        #deletetoggle:checked ~ .toggleNotifications .count .num:nth-of-type(2) {
            transition-delay: 0.5s;
        }

        #deletetoggle:checked ~ .toggleNotifications .count .num:nth-of-type(1) {
            transition-delay: 1s;
        }

.note.show-all {
    text-align: center;
    background: #ececec;
    border: none;
    font-weight: bold;
    color: gray;
    text-transform: uppercase;
    font-size: 11px;
}

    .note.show-all a {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
    }

    .note.show-all .fa-external-link {
        color: transparent;
    }

    .note.show-all:hover .fa-external-link {
        color: white;
    }
/**DOWNLOAD-OPTION**/
.title-action .fa-download {
    color: white;
}
.download-option-box {
    display: none;
    opacity: 0;
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: linear-gradient( #00000021, #0000002b);
    z-index: 99;
}
.title-action .fa-download {
    height: 25px;
    font-size: 14px;
    width: 25px;
    background: #f2f2f2;
    line-height: 26px;
    position: relative;
    right: -7px;
    border-radius: 5px;
    text-align: center;
    color: #5d5757;
}
.ibox-title .action-center {
    display: inline-flex;
    margin-right: 10px;
    top: 6px;
    right: 5px;
}
.download-option-box.active {
    display: block;
    z-index: 999;
    opacity: 1;
}

.download-option-box .download-option-container {
    min-width: 300px;
    max-width: 450px;
    min-height: 200px;
    width: 100%;
    max-height: calc(100vh - 100px);
    position: absolute;
    background: white;
    border-radius: 10px;
    overflow: auto;
    box-shadow: 0 4px 15px #000000e0;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.download-option-container:after {
    content: 'Download Options';
    position: absolute;
    bottom: 0;
    left: 0;
    color: white;
    background: linear-gradient(#ababab,#a7a7a7);
    text-align: center;
    width: 100%;
    text-transform: uppercase;
    padding: 5px;
}
.btn-full-width {
    width: 100%;
}
.btn-full-height {
    height: 25px;
    line-height: 17px;
}
.download-option-container.empty {
    background-image: url('../img/Empty-Recods.png');
    background-size: 85px;
    background-repeat: no-repeat;
    background-position: 50% 35%;
}

    .download-option-container.empty:after {
        content: 'No records found';
        position: absolute;
        bottom: 52px;
        font-size: 13px;
        color: #888888;
        font-weight: 300;
        text-align: center;
        width: 100%;
    }

.download-option-box .download-option-container ul {
    margin: 0;
    padding: 0;
    display: block;
    text-align: center;
    padding: 20px 0;
}

.close-download-box {
    background: linear-gradient(#f54848f2,#8c1414fc);
    height: 70px;
    width: 70px;
    position: absolute;
    right: 8px;
    top: 5px;
    border-radius: 10%;
    cursor:pointer;
    transition:all ease-in-out .2s;
}
.close-download-box:hover {
    background: linear-gradient(#f54848f2, #8c1414fc 50%);
}
.close-download-box:before {
    position: absolute;
    content: "";
    height: 60px;
    width: 2px;
    background: #ffffffa8;
    top: 6px;
    right: 34px;
    transform: rotate(45deg);
}

.close-download-box:after {
    position: absolute;
    content: "";
    height: 60px;
    width: 2px;
    background: #ffffffa8;
    top: 6px;
    right: 34px;
    transform: rotate(-45deg);
}

.download-option-box .download-option-container ul li {
    display: inline-block;
    padding: 13px;
    width: 97px;
    height: 97px;
    position: relative;
    border: 1px solid #cccccc;
    margin: 10px;
    margin-bottom: 25px;
    border-radius: 15px;
    transition: all ease-in-out .1s;
}

.download-option-box .download-option-container ul li:hover {
    box-shadow: 0 0 0 3px #2f2f2f, 0 5px 6px #2d2d2d;
}

.download-option-box .download-option-container ul li input, .download-option-box .download-option-container ul li a {
    position: absolute;
    top: 0;
    left: 0;
    height: 100% !important;
    width: 100% !important;
    opacity: 0;
    border: none;
    border-radius: 15px;
}

li.download-excel {
    background-image: url(../img/file-type-icons.png);
    background-size: 285px;
    background-position: 189px 0px;
}

li.download-pdf {
    background-image: url(../img/file-type-icons.png);
    background-size: 285px;
    background-position: 285px -95px;
}

li.download-word {
    background-image: url(../img/file-type-icons.png);
    background-size: 285px;
    background-position: 95px 0px;
}

li.download-csv {
    background-image: url(../img/file-type-icons.png);
    background-size: 285px;
    background-position: 191px -95px;
}

li.download-email {
    background-image: url(../img/file-type-icons.png);
    background-size: 285px;
    background-position: 0 0;
}

li.print-report {
    background-image: url(../img/file-type-icons.png);
    background-size: 285px;
    background-position: -190px -96px;
}

li.download-json {
    background-image: url(../img/json.png);
    background-size: 95px;
    background-position: 0 0;
}
.download-option-box .download-option-container ul li:after {
    content: attr(data-name);
    position: absolute;
    bottom: -23px;
    width: 100px;
    left: -3px;
    font-weight: 400;
    color: black;
    font-size: 13px;
}

.download-option-container h4 {
    padding: 10px;
    margin: 0;
    background: #24204c;
    text-align: center;
    font-weight: bold;
    color: white;
    position: absolute;
    width: 100%;
    bottom: 0;
}
/*SUPPORT*/
.call-us {
    position: relative;
    top: -11px;
    color: #ffffff !important;
    padding: 4px 8px 3px 4px;
    /* background: #ffffff75; */
    border-radius: 20px;
    margin-right: 10px;
    font-weight: bold;
}
.call-us .call-us-circle {
    width: 20px;
    height: 20px;
    display: inline-block;
    text-align: center;
    padding: 0px;
    border-radius: 100%;
    margin-right: 4px;
    position: relative;
    top: 0px;
    left: -2px;
}
.call-us:hover {
    color: #5fc56c;
}
/*.call-us:hover {
    background: white;
}*/
.call-us:hover .call-us-circle {
    color: #5fc56c;
    background: white;
    transition: all ease-in-out .2s;
    -webkit-animation: ripple 0.7s linear infinite;
    animation: ripple 0.7s linear infinite;
}

.call-us:hover i.fa-phone {
    animation: phone-shake 500ms infinite;
    -webkit-animation: phone-shake 500ms infinite;
}
/***ANIMATIONS***/
@-webkit-keyframes ripple {
    0% {
        box-shadow: 0 0 0 0 rgba(101, 255, 120, 0.3), 0 0 0 1em rgba(101, 255, 120, 0.3), 0 0 0 3em rgba(101, 255, 120, 0.3), 0 0 0 5em rgba(101, 255, 120, 0.3);
    }

    100% {
        box-shadow: 0 0 0 1em rgba(101, 255, 120, 0.3), 0 0 0 3em rgba(101, 255, 120, 0.3), 0 0 0 5em rgba(101, 255, 120, 0.3), 0 0 0 8em rgba(101, 255, 120, 0);
    }
}

@keyframes ripple {
    0% {
        box-shadow: 0 0 0 0 rgba(101, 255, 120, 0.3), 0 0 0 1em rgba(101, 255, 120, 0.3), 0 0 0 3em rgba(101, 255, 120, 0.3), 0 0 0 5em rgba(101, 255, 120, 0.3);
    }

    100% {
        box-shadow: 0 0 0 1em rgba(101, 255, 120, 0.3), 0 0 0 3em rgba(101, 255, 120, 0.3), 0 0 0 5em rgba(101, 255, 120, 0.3), 0 0 0 8em rgba(101, 255, 120, 0);
    }
}

@keyframes phone-shake {
    0% {
        transform: translate(-1px, 0px) rotate(0deg);
    }

    5% {
        transform: translate(1px, 0px) rotate(0deg);
    }

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

    15% {
        transform: translate(1px, 0px) rotate(0deg);
    }

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

    25% {
        transform: translate(1px, 0px) rotate(0deg);
    }

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

    35% {
        transform: translate(1px, 0px) rotate(0deg);
    }

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

    45% {
        transform: translate(1px, 0px) rotate(0deg);
    }

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

    55% {
        transform: translate(0px, 0px) rotate(0deg);
    }

    100% {
        transform: translate(0px, 0px) rotate(0deg);
    }
}
/*PETRO-LOADING*/
.loader-back {
    /* display: none; */
    position: fixed;
    height: 100%;
    width: 100%;
    background: #000000d6;
    z-index: 99999999;
}
.loader-animation {
    width: 193px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
/*METER*/
.dispense-machine {
    margin-top: 68px;
    transform: translateY(-50%);
}

.dispense-machine .odometer {
    text-align: center;
    font-size: 30px;
    text-shadow: 0 -1px rgba(0, 0, 0, 0.9);
    color: rgba(255, 255, 255, 0.9);
    margin: auto;
    margin-bottom: auto;
    margin-bottom: 15px;
    display: inline-block;
    background: #222;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    -moz-box-shadow: inset 0 2px 8px -2px #000;
    -webkit-box-shadow: inset 0 2px 8px -2px #000;
    box-shadow: inset 0 3px 10px -2px #000;
    border: 4px solid #3c3c3c;
    position: relative;
    font-weight: 400;
    text-shadow: -1px 2px 1px #939393, 0 2px 3px #000;
    height: 44px;
}

/*.dispense-machine .odometer::before {
    content: "SALE";
    position: absolute;
    left: -65px;
    font-size: 20px;
    color: black;
    font-weight: bold;
    text-shadow: 0 2px 1px #fefefe, 0 2px 3px #000;
    top: 4px;
}*/

/*.dispense-machine .odometer::after {
    position: absolute;
    right: -55px;
    font-size: 20px;
    color: black;
    font-weight: bold;
    text-shadow: 0 2px 1px #fefefe, 0 2px 3px #000;
    top: 4px;
    content: "LTR.";
}*/

.dispense-machine .digit {
    display: inline-block;
    height: 1em;
    width: 1em;
    overflow: hidden;
    border-right: 1px solid rgba(0, 0, 0, 0.5);
    border-left: 1px solid rgba(255, 255, 255, 0.05);
    padding: 0 0.2em;
}

    .dispense-machine .digit:first-child {
        border-left: none;
    }

.dispense-machine .digit-container {
    line-height: 1em;
    -webkit-animation: slide infinite linear;
    animation: slide infinite linear;
}

.dispense-machine .digit-one {
    -webkit-animation-duration: 1000ms;
    animation-duration: 1000ms;
}

.dispense-machine .digit-ten {
    -webkit-animation-duration: 10000ms;
    animation-duration: 10000ms;
}

.dispense-machine .digit-hundred {
    -webkit-animation-duration: 100000ms;
    animation-duration: 100000ms;
}

.dispense-machine .digit-thousand {
    -webkit-animation-duration: 1000000ms;
    animation-duration: 1000000ms;
}

.dispense-machine .digit-ten-thousand {
    -webkit-animation-duration: 10000000ms;
    animation-duration: 10000000ms;
}

@-webkit-keyframes slide {
    from {
        -webkit-transform: translateY(-10em);
    }

    to {
        -webkit-transform: translateY(0);
    }
}

@keyframes slide {
    from {
        transform: translateY(-10em);
    }

    to {
        transform: translateY(0);
    }
}


.dispense-machine .nozzle-holder.petrol::before {
    content: "PETROL";
    position: absolute;
    top: -40px;
    font-size: 20px;
    font-weight: bold;
    color: #139000;
    left: 3px;
    text-shadow: 0 2px 0px #151515, 0 2px 3px #333;
}

.dispense-machine .pipe-1::before {
    position: absolute;
    width: 113px;
    height: 580px;
    top: -373px;
    left: -150px;
    border: 24px solid #303030;
    border-top-color: rgb(75, 68, 68);
    border-top-style: solid;
    border-top-width: 24px;
    border-top-color: rgb(75, 68, 68);
    border-top-style: solid;
    border-top-width: 24px;
    border-top-color: rgb(75, 68, 68);
    border-top-style: solid;
    border-top-width: 24px;
    border-radius: 68px;
    border-top: 20px solid #303030;
    content: "";
    transform: rotate(3deg);
    z-index: -1;
    background: transparent;
}

.dispense-machine .pipe-1::after {
    position: absolute;
    width: 156px;
    height: 156px;
    top: 54px;
    left: -169px;
    border: 24px solid #303030;
    border-top-color: rgb(75, 68, 68);
    border-top-style: solid;
    border-top-width: 24px;
    border-left-color: rgb(75, 68, 68);
    border-left-style: solid;
    border-left-width: 24px;
    border-top-color: rgb(75, 68, 68);
    border-top-style: solid;
    border-top-width: 24px;
    border-left-color: rgb(75, 68, 68);
    border-left-style: solid;
    border-left-width: 24px;
    border-top-color: rgb(75, 68, 68);
    border-top-style: solid;
    border-top-width: 24px;
    border-left-color: rgb(75, 68, 68);
    border-left-style: solid;
    border-left-width: 24px;
    border-radius: 86px;
    border-left: 20px solid transparent;
    content: "";
    transform: rotate(2deg);
    background: transparent;
    border-top: 20px solid transparent;
    box-shadow: 10px 13px 9px #23212199;
}

.dispense-machine .pipe-2::before {
    position: absolute;
    width: 215px;
    height: 620px;
    top: -390px;
    right: -140px;
    border: 24px solid #303030;
    border-top-color: rgb(75, 68, 68);
    border-top-style: solid;
    border-top-width: 24px;
    border-radius: 106px;
    border-top: 20px solid transparent;
    content: "";
    transform: rotate(-2deg);
    z-index: -1;
    background: transparent;
}

.dispense-machine .pipe-2::after {
    position: absolute;
    width: 121px;
    height: 129px;
    top: 90px;
    right: -143px;
    border: 24px solid #303030;
    border-top-color: rgb(75, 68, 68);
    border-top-style: solid;
    border-top-width: 24px;
    border-right-color: rgb(75, 68, 68);
    border-right-style: solid;
    border-right-width: 24px;
    border-radius: 113px;
    border-right: 20px solid transparent;
    content: "";
    transform: rotate(-50deg);
    background: transparent;
    border-top: 20px solid transparent;
    box-shadow: -15px -3px 9px #23212199;
}

.dispense-machine .nozzle.diesel {
    position: relative;
    top: 86px;
    height: 85px;
    width: 36px;
    background: linear-gradient( #aa3905 37px, #3b0000 100px);
    left: -8px;
    z-index: 2;
    border-radius: 10px 10px 25px 25px;
    border-bottom: 18px solid #aa2805;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    transform: rotate(0deg);
    box-shadow: -11px 10px 9px #23212199;
}
/*TABLE*/
table .fa-trash {
    color: #d45555;
}
table .fa-trash:hover {
    color: red;
}
table .fa-edit {
    color: #56d287;
}
table .fa-edit:hover {
    color: #1291ff;
}
/*MODAL*/
.modal-dialog {
    margin-top: 80px;
}
/**TABLE-ROWS-ANNOTATION**/
.table-scroll-annotation {
    position: absolute;
    right: 35px;
    top: calc(50% + 20px);
    background: #313131eb;
    color: #ffffff;
    border-radius: 5px;
    box-shadow: 0 0 8px grey;
}

.table-scroll-annotation .annotation-top, .table-scroll-annotation .annotation-bottom {
    text-align: left;
    padding: 3px 7px;
    font-weight: 500;
    cursor: pointer;
    font-size: 11px;
}

.annotation-top:hover {
    background: #e47d7d;
    border-radius: 5px 5px 0 0;
}

.annotation-bottom:hover {
    background: #e47d7d;
    border-radius: 0 0 5px 5px;
}

.table-scroll-annotation .annotation-top .fa, .table-scroll-annotation .annotation-bottom .fa {
    float: right;
    line-height: 16px;
}

.table-scroll-annotation .annotation-top {
    border-bottom: 1px solid #ffffff94;
}
.table-scroll-annotation .annotation-top span, .table-scroll-annotation .annotation-bottom span {
    padding-right: 5px;
    margin-right: 5px;
}
.table-scroll-annotation:after {
    /* content: ""; */
    position: absolute;
    right: -5px;
    border-left: 5px solid #292929e8;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    top: 11px;
}
/*ROW-HIGHLIGHT-RULES*/
/*RULE-1--LAST-DATE*/
tr.closing-balance-row td {
    font-weight: bold;
    color: #61041a;
}
tr.closing-balance-row {
    background: #a8ebff;
}
/*RULE-2--CREDIT-DEBIT*/
.highlight-credit-row {
    background: #fff1f1 !important;
}
.highlight-credit-row td {
    font-weight: 600;
    color: #6d2020 !important;
}
/*ENTRY_FORM_TOTAL_BOX*/
.pos-bottom {
    width: 98%;
    position: absolute;
    bottom: 12px;
}
.pos-bottom span {
    color: #444444;
}
.pos-bottom span {
    color: #444444;
}
.flex-box .form-boxed {
    flex: none;
    width: calc(50% - 3px);
}
.flex-box .form-boxed:first-child {
    margin-right: 3px;
}
.flex-box .form-boxed:last-child {
    margin-left: 3px;
}
.input-help {
    font-size: 10px;
    color: #ff0f0f !important;
    position: relative;
    top: 0px;
}
.ibox-title h5 i {
    display: none;
}
/*HIDE-SHOW-MENU*/
nav.navbar-default.navbar-static-side {
    width: 220px;
    transition: width cubic-bezier(0, 1.43, 0.54, 0.93) .4s !important;
}

div#page-wrapper {
    margin-left: 220px;
    transition: margin cubic-bezier(0, 1.43, 0.54, 0.93) .4s !important;
}
body.magic-menu nav.navbar-default.navbar-static-side {
    width: 1px;
    transition: width cubic-bezier(0, 1.43, 0.54, 0.93) .4s !important;
}
body.magic-menu div#page-wrapper {
    margin-left: 0;
    transition: margin cubic-bezier(0, 1.43, 0.54, 0.93) .4s !important;
}
body.magic-menu nav.navbar-default.navbar-static-side:hover {
    width: 220px;
}
body .nav-toggle-par .fa-angle-right {
    display: none;
}
body .nav-toggle-par .fa-bars {
    display: block;
}
body.magic-menu .nav-toggle-par .fa-angle-right {
    display: block;
}
body.magic-menu .nav-toggle-par .fa-bars {
    display:none;
}

body.magic-menu nav.navbar-default.navbar-static-side:hover ~ #page-wrapper {
    margin-left: 220px;
}
/*COMPANY-NAME-PROFILE-ITEM*/
.company-name-item {
    background: #eaeaea;
}
.company-name-item * {
    color: #4a4a4a;
}
.company-name-item:hover a {
    background: #eaeaea;
    color: #4a4a4a;
    cursor: text;
    background: #eaeaea !important;
}
.company-name-item a:hover {
    background: #eaeaea;
    color: #4a4a4a !important;
    cursor: text;
    background: #eaeaea !important;
    border-bottom: 1px solid transparent !important;
}
.company-name-item a:hover * {
    color: #4a4a4a !important;
}
.editable-rows tr:not(:first-child):hover {
    outline: 1px solid #d43a3a;
    cursor: cell;
}
.table-item-added tr:first-child th, .table-item-added tr:first-child th .fixed {
    background: #d7f6ff !important;
}
.block-element {
    position: relative;
}
.block-element:after {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    background: #ffffff8a;
}
/**SHORTCUT-BUTTON-STYLES**/
.save-record {
    position: relative;
}

.save-record:after {
    content: "  Ctrl + S";
    font-size: 11px;
    color: #ffbf2f;
    font-weight: 600;
    border: 1px solid;
    border-radius: 3px;
    padding: 1px 3px 0 1px;
    margin-left: 5px;
}
/**SEARCH-TABLE-RECORDS**/
.table-search-box {
    display: inline-block;
    height: 25px;
    width: 25px;
    margin-right: 5px;
    overflow: hidden;
    font-size: 14px;
    line-height: 22px;
    position: relative;
    background: #f2f2f2;
    right: -6px;
    border-radius: 5px;
    text-align: center;
    transition: all ease-in-out .3s;
}
.table-search-box.expand-input {
    width: 180px;
    transition: all ease-in-out .3s;
}
.table-search-box #search_table_data {
    background: #f2f2f200;
    height: 25px;
    border: none;
    z-index: 1;
    padding: 0 25px 0 5px;
}
.table-search-box .fa-search {
    position: absolute;
    top: 0;
    right: 0;
    padding: 6px;
    color: #4c4b4b;
    z-index: 0;
}
.table-search-box .fa-search:hover {
    cursor: pointer !important;
    color: red;
}
/**TABLE-CELL-LIVE-ANIMATION**/
.live-calculation {
    position: relative;
    overflow: hidden;
}
    .live-calculation:after {
        content: "";
        position: absolute;
        height: 2px;
        width: 100%;
        bottom: 0;
        left: 0;
        border-bottom: 2px solid #4ad411 !important;
        border-radius: 5px;
        transition: all ease .5s;
        -webkit-animation-name: live-border;
        -webkit-animation-iteration-count: infinite;
        -webkit-animation-duration: 2s; /* Safari 4.0 - 8.0 */
        animation-name: live-border;
        animation-iteration-count:infinite;
        animation-duration: 2s;
    }

/* Safari 4.0 - 8.0 */
@-webkit-keyframes live-border {
    0% {
        left: 100%;
    }
    100% {
        left: -100%;
    }
}

/* Standard syntax */
@keyframes live-border {
    0% {
        left: 100%;
    }
    100% {
        left: -100%;
    }
}
.fixed-bottom-total {
    position: fixed;
    bottom: 11px;
    font-size: 10px;
    color: #03944a;
    padding: 0 5px;
    text-align: right;
}
.no-record-found-in-search {
    display: block;
    text-align: center;
    font-size: 12px;
    color: #ababab;
}
/***EDITABLE-TABLE***/
table.editable-table select, table.editable-table input, table.editable-table textarea {
    width: 100%;
    margin: 0;
    padding: 0 5px;
    border: none !important;
    background: transparent;
    outline: none !important;
    color: #1d1d1d !important;
    font-weight: 400 !important;
}
table.editable-table select:focus, table.editable-table input:focus, table.editable-table textarea:focus, table.editable-table select:active, table.editable-table input:active, table.editable-table textarea:active {
    color: #0072ff !important;
    margin: 0;
    border: none !important;
}
table.editable-table select:active, table.editable-table input:active, table.editable-table textarea:active {
    outline: none !important;
}
table.editable-table td {
    padding:0!important;
}
table.editable-table tr.active {
    outline: 1px solid #089aef;
    background-color: rgb(255, 243, 220) !important;
}
.editable-table input:focus, .editable-table select:focus, .editable-table textarea:focus {
    outline: 2px solid #089aef !important;;
}
    table .editable-table tr.active td:first-child {
    border-left: 1px solid #089aef !important;
}

table.editable-table ::-webkit-input-placeholder { /* Edge */
    color: #9c9c9c !important;
}

table.editable-table :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #9c9c9c !important;
}

table.editable-table ::placeholder {
    color: #9c9c9c !important;
}
.editable-table-select {
    position: relative;
    display: list-item;
}

.editable-table-select select {
    padding-right: 19px !important;
    z-index: 5;
    position: absolute;
    top: 0;
    left: 0;
}

.editable-table-select .editable-table-select-arrow {
    height: 18px;
    width: 18px;
    background: url('../img/arrow-down.png');
    position: absolute;
    right: 0;
    top: 0;
    background-size: 9px;
    background-repeat: no-repeat;
    background-position: 50%;
    border-left: 1px solid gainsboro;
    z-index: 0;
}
/*DELETE-ROW*/
.editable-table td{
    position:relative;
}
.editable-table .delete-row:hover {
    background: red;
}

.editable-table tr:hover td .delete-row {
    display: block;
}

.editable-table .delete-row {
    display: none;
    position: absolute;
    right: 0px;
    top: 0;
    padding: 3px 5px;
    background: #ec6565;
    color: white;
    cursor: pointer;
}
/**QUICKPANEL-RIGHT**/
.quick-right-panel {
    opacity:.5;
    position: fixed;
    padding-left: 4px;
    z-index: 9999;
    background: #ffffff;
    top: 0;
    right: -278px;
    height: 100vh;
    min-width: 280px;
    box-shadow: -2px 0 4px #00000026;
    transition: all cubic-bezier(0.45, -0.07, 0.6, 1.06) .2s !important;
    padding-right: 30px;
}
    .quick-right-panel.open {
        right: -30px;
        opacity: 1;
        padding-left:0;
    }
.quick-right-panel h4 {
    color: #393939;
    font-size: 20px;
    padding: 10px;
    border-bottom: 1px solid;
    margin: 0;
}

.quick-right-panel .quick-controls .back-button {
    margin: 5px 0 5px 5px;
    height: 30px;
    width: 30px;
    text-align: center;
    line-height: 30px;
    border-radius: 4px;
    background: white;
    display: inline-block;
    color: #094151;
    background: #064f63;
    color:white;
}
.quick-right-panel .quick-controls .back-button:hover
{
    background: #e47d7d;
    color:White
}
.quick-controls {
    display: flex;
    text-align: left;
}

.quick-right-panel .quick-controls {
    margin: 6px 0;
    padding:0 6px;
}

.quick-right-panel .quick-controls .quickest-link {
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    color: #393939;
    padding: 0;
    margin: 0;
    display: inline-table;
    padding: 9px;
}
.quick-right-panel .quick-list-container {
    height: calc(100vh - 97px);
    background: #f1f1f1;
        /*background: url(https://media.istockphoto.com/vectors/abstract-wavy-background-with-text-place-technology-modern-template-vector-id931653936);*/
    background-repeat: no-repeat;
    background-size: cover;
}
.quick-right-panel .quick-link-list {
    overflow: auto;
}

.quick-right-panel .quick-link-list ul {
    list-style: none;
    padding: 0;
}

.quick-right-panel .quick-link-list ul li a {
    font-size: 14px;
    padding: 5px 10px;
    display: block;
    background: #3795b1;
    border-radius: 5px 0 0 5px;
    transition: all ease-in-out .2s;
    color: white;
}
.quick-right-panel .quick-link-list ul li a:hover {
    background: #e47d7d;
    color: white;
    padding-left: 20px;
}

.quick-right-panel .quick-link-list ul li {
    margin: 5px 0 5px 10px;
}
.quick-right-panel .quick-panel-handle {
    content: "";
    left: -15px;
    top: calc(50% - 18px);
    height: 79px;
    width: 15px;
    background: #777777;
    position: absolute;
    border-radius: 50px 0 0 50px;
    box-shadow: -2px 0 4px #0000003b;
}
.quick-right-panel .quick-panel-handle .fa {
    transform: rotate(0deg);
    transition: all cubic-bezier(0.49, 1.84, 0.6, 0.81) .8s;
}
.quick-right-panel.open .quick-panel-handle .fa {
    transform: rotate(180deg);
    transition: all cubic-bezier(0.49, 1.84, 0.6, 0.81) .8s;
}
.quick-right-panel .quick-panel-handle {
    left: -13px;
}

.quick-right-panel.open .quick-panel-handle {
    left:-15px;
}
.quick-right-panel .quick-panel-handle:hover {
    background: #e47d7d;
    color: white;
}
.quick-right-panel .quick-panel-handle .fa {
    line-height: 79px;
    padding: 0 4px;
    color: #ffffff;
}
/*QUICKLINK-HINT*/
.quickpanel-hint {
    position: fixed;
    height: 135px;
    width: 172px;
    top: 10%;
    right: 0;
    background: white;
    border-radius: 4px 0 0 4px;
    box-shadow: -2px 0 4px #0000007d;
    display:none;
}
.quick-right-panel .quickpanel-hint 
{
}
.quickpanel-hint .dashboard-emoji {
}

.quickpanel-hint .dashboard-emoji img {
    object-fit: cover;
    width: 100%;
    padding: 5px;
}

.quickpanel-hint h5 {
    text-align: center;
    border-bottom: 1px solid #e6e6e6;
    padding-bottom: 3px;
    margin-bottom: 5px;
}
.quickpanel-hint h5 i {
    position: absolute;
    left: 5px;
    font-size: 9px;
    padding: 2px 5px;
    background: #ffd300;
    border-radius: 10px;
    color: #575757;
}
.quickpanel-hint .quickpanel-emoji {
    position: absolute;
    top: 40.5px;
    right: 25px;
    width: 28.1px;
    overflow: hidden;
}
.quickpanel-hint .quickpanel-emoji img {
    position: relative;
    padding: 0;
    left: 26.5px;
    animation-name: quickpanel-animate;
    animation-duration: 2s;
    animation-delay:2s;
    animation-fill-mode: forwards;
}
.screen {
    height: 76px;
    width: 122px;
    position: absolute;
    top: 40px;
    left: 25px;
    overflow: hidden;
}
.cursor-icon {
    height: 15px;
    width: 10px;
    position: absolute;
    top: 59px;
    left: 0;
    animation-name: cursor-animate;
    animation-fill-mode: forwards;
    animation-duration: 4s;
}
.cursor-icon img {
    width: 10px !important;
    height: 15px;
    padding: 0 !important;
    position: relative;
    top: -3px;
}

@keyframes cursor-animate {
  0%   {left:0px; top:60px;}
  50% {left:121px; top:35px;}
  80% {left:112px; top:32px;}
  90% {left:112px; top:33px;}
  100% {left:112px; top:34px;}
}
@keyframes quickpanel-animate {
  0%   {left:26.5px;}
  100% {left:0px;}
}

.quick-right-panel h6 {
    font-size: 15px;
    margin: 10px 0 5px 10px;
    border-bottom: 1px solid #0f6b84;
    font-weight: 400;
    color: #0f6b84;
}

/*****TOP-MENU*****/
#menu-bar {
    display:none;
    background:white;
}
body.navbar-top #menu-bar {
    display: block;
}
ul.main-menu {
    list-style-type: none;
    margin: 0px 0px 10px 0px;
    padding: 0px;
}
li.navbar-top-right-item {
    float: right;
    height: 28px;
    line-height: 17px !important;
    padding: 5px 10px !important;
    color: #25758f;
}
    ul.main-menu > li {
        margin: 0;
        display: inline;
        list-style-type: none;
        padding: 5px 4px 7px 6px;
        line-height: 28px;
        vertical-align: middle;
        cursor: default;
        outline: none;
        border-style: solid;
        border-width: 1px 1px 0 1px;
        border-color: transparent;
    }

        ul.main-menu > li.active-menu {
            background-color: #fff;
            border-color: #ccc;
            -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
            -moz-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
            box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
        }
    ul.main-menu a {
        color: #000;
    }
    ul.main-menu ul li a {
        color: #000;
        text-decoration: none;
        display: block;
        white-space: nowrap;
    }

    ul.main-menu li ul li a span {
        font-size: 11px;
        color: #999;
        float: right;
        right: 10px;
        left: auto;
        position: absolute;
    }

    /* SUBMENU */
    ul.main-menu > li ul {
        list-style-type: none;
        padding: 0;
        margin: 0;
        display: none;
        border-width: 1px;
        border-style: solid;
        border-color: #ccc;
        background-color: #fff;
        -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
        -moz-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
        box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
    }

    ul.main-menu li ul li {
        display: list-item;
        margin: 0;
        line-height: 26px;
        padding-right: 40px;
        min-width: 100px;
        cursor: pointer;
        text-indent: 30px;
        white-space: nowrap;
    }

    ul.main-menu li:hover {
        background-color: whiteSmoke; /*#fef7cb;*/
    }

    ul.main-menu li.active-menu:hover {
        background-color: #fff;
    }

    ul.main-menu li ul li.disabled, ul.main-menu li ul li.disabled:hover, ul.main-menu li ul li.disabled a {
        color: #ddd;
        cursor: default;
        background-color: #fff;
    }

    ul.main-menu li.separator {
        border-top: 1px solid #ddd;
        margin-top: 5px;
        margin-bottom: 5px;
    }

.submenu {
    background-image: url(../img/menu-right-arrow.png);
    background-repeat: no-repeat;
    background-position: right center;
}

/******GOOGLE-TRANSLATOR******/
.goog-lang-holder {
    height: 19px;
    width: 100%;
}

a.goog-logo-link {
    display: none;
}
#side-menu .goog-lang-holder {
    height: 30px;
    padding: 7px;
    background: white;
    width: 100%;
    position: relative;
}
.skiptranslate.goog-te-gadget {
    color: transparent !important;
}
#side-menu .goog-lang-icon {
    position: absolute;
    top: 0px;
    width: 43px;
    font-size: 23px;
    color: #2669b3;
}
.goog-lang-icon {
    position: absolute;
    top: 3px;
    width: 43px;
    font-size: 23px;
    color: #2669b3;
}
select.goog-te-combo {
    margin: 7px;
    color: #656e6e;
    display: block;
    width: 100%;
    height: 26px;
    padding: 0 12px;
    padding-left: 35px;
    line-height: 25px;
    font-size: 13px;
    color: #555;
    background-color: #fff0;
    background-image: none;
    border: 1px solid #eceaea;
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    max-width: 100%;
    position: relative !important;
    top: -8px;
}

select.goog-te-gadget .goog-te-combo:focus {
    background: white;
    border: 2px solid #246bb9;
    outline: none;
}

select.goog-te-combo, select.goog-te-combo:focus {
    outline: none;
    border: none !important;
    outline: none;
}
iframe {
    display: none;
}
div#goog-gt-tt {
    display: none !important;
}
.goo-language-control {
    border: none;
    position: relative;
    top: 0px;
    height: 30px;
    border-top: none;
    border-bottom: none;
    width: 150px;
}
a.goog-logo-link {
    display: none;
    opacity: 0;
}





























































.form-block {
    display: block;
    padding-bottom: 10px;
}

.form-container {
    display: block;
    position: relative;
    width: 100% !important;
}

.form-tab {
    display: none;
}

.form-tab-container {
    padding: 10px;
    border-top: 1px solid #c0c0c0;
    border-radius: 0 0 5px 5px;
    padding-bottom: 60px;
    display: inline-block;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.relative-bottom-controls.form-tab-container {
    padding-bottom: 0;
    padding: 0;
    overflow: visible;
}

.form-tab.active {
    display: block !important;
}

.form-tab-btn i {
    color: #7d7d7d;
    font-size: 14px;
    position: relative;
    top: 1px;
}

.form-tab-btn.active, .form-tab-btn:hover {
    /* border: 1px solid #567290; */
    color: #525252 !important;
}

.form-tab-btn.active {
    border-color: transparent;
    /* outline: rgb(86, 114, 144) solid 2px !important; */
    color: rgb(0, 0, 0) !important;
    /* outline-style: auto !important; */
}

    .form-tab-btn.active .fa, .form-tab-btn:hover .fa {
        border-radius: 10px;
        color: #288af3;
    }

    .form-tab-btn.active:after {
        height: 2px;
        width: 100%;
        position: absolute;
        bottom: -2px;
        background: #288af3;
        content: "";
        left: 0;
        z-index: 9;
    }

.formtab-holder {
    display: inline-block;
    width: 100%;
    position: relative;
    top: 8px;
    z-index: 0;
}

.form-tab-btn {
    position: relative;
    display: inline-block;
    margin-bottom: 0;
    padding: 3px 5px 9px 3px;
    margin: 5px 10px;
    background: transparent;
    margin-right: 0;
    color: #232323;
    font-weight: 500;
    font-size: 12px;
    /* border: 1px solid #c7c7c7; */
    cursor: pointer;
    transition: all ease-in-out .1s;
    float: left;
}

    .form-tab-btn.list-btn {
        padding: 9px;
        background: #f2f2f2;
        margin-left: 0;
        margin: 4px 0 0 0;
    }

        .form-tab-btn.list-btn.active:after {
            display: noneauto
        }

        .form-tab-btn.list-btn.active {
            background: #318af3 !important;
        }

            .form-tab-btn.list-btn.active i {
                color: white;
            }

            .form-tab-btn.active + .form-tab-btn.list-btn, .form-tab-btn.list-btn.active:not(.static-show-tabbtn) {
                display: inline-block;
            }

        .form-tab-btn.list-btn:not(.static-show-tabbtn) {
            display: none;
        }

.captionless-form.border-box-light {
    display: flex;
    width: 100%;
    padding: 0;
}
.captionless-form .form-boxed {
    width: 100% !important;
}

.datepicker.datepicker-dropdown.dropdown-menu.datepicker-orient-left.datepicker-orient-top {
    z-index: 9999 !important;
}