﻿/********
    
    
*********/




#header {
    background-color: #eaeaea !important;
    background-color: #ebf5ff;
    background-image: -moz-linear-gradient(top,#eaeaea,#afafaf);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#ebf5ff ),to(#d8decc));
    background-image: -webkit-linear-gradient(top,#eaeaea,#afafaf);
    background-image: -o-linear-gradient(top,#eaeaea,#afafaf);
    background-image: linear-gradient(to bottom,#eaeaea,#afafaf);
}

#ribbon {
     background-image: linear-gradient(to right, #24a9e0, #00b6d2, #00bead, #3ac07b, #8cbd47, #9ab637, #a7af27, #b4a718, #91a31e, #6e9d2a, #499637, #158d44);
}

    #ribbon .breadcrumb, #ribbon .breadcrumb a {
        color: #545454 !important;
    }

aside {
    display: block;
    background: #686868;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…BoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
    background: -moz-linear-gradient(left,#686868 93%,#635959 100%);
    background: -webkit-gradient(linear,left top,right top,color-stop(93%,#686868 ),color-stop(100%,#635959));
    background: -webkit-linear-gradient(left,#686868 93%,#635959 100%);
    background: -o-linear-gradient(left,#686868 93%,#635959 100%);
    background: -ms-linear-gradient(left,#686868 93%,#635959 100%);
    background: linear-gradient(to right,#686868 93%,#635959 100%);
}

.login-info > span {
    border-bottom-color: #454545;
}

.login-info {
    border-bottom: 1px solid #171a1f;
}

nav ul li a {
    color: #f3f3f3;
}

.login-info a {
    color: #f3f3f3;
}

.header-seperator {
    border: 1px solid #bfc1bb;
}

.btn-header > :first-child > a {
    background-color: #f37021;
    background-image: -webkit-linear-gradient(top,#f37021,#f37021);
    background-image: -moz-linear-gradient(top,#f37021,#f37021);
    background-image: -ms-linear-gradient(top,#f37021,#f37021);
    background-image: -o-linear-gradient(top,#f37021,#f37021);
    background-image: linear-gradient(top,#f37021,#f37021);
    border: 1px solid #ffffff;
    color: #ffffff;
    font-size: 17px;
    margin: 10px 0 0;
}

.page-footer {
    border-top: 1px solid #24a9e0;
    background-image: linear-gradient(to right, #24a9e0, #00b6d2, #00bead, #3ac07b, #8cbd47, #9ab637, #a7af27, #b4a718, #91a31e, #6e9d2a, #499637, #158d44);
}

.minifyme {
    border-bottom: 1px solid #ffffff;
    background: #f37021;
    color: #ffffff;
}

.minified .minifyme {
    border-bottom: 1px solid #f37021;
    background: #f37021;
    color: #ffffff;
}

    .minified .minifyme:hover {
        background: #3c3c3c;
        color: #e4e4e4;
    }

.minifyme:hover {
    background: #3c3c3c;
    color: #e4e4e4;
}

.btn-back {
    background-color: #f37021 !important;
    border-color: #fdc261 !important;
    margin-bottom: 5px;
    color: #fff
}

    .btn-back:hover {
        color: #fff
    }

.jarviswidget-color-blueDark > header {
    border-color: #96c0b7 !important;
    background: #96c0b7;
    color: #fff;
}

body {
    background: #dde4ea !important;
}

.btn-primary {
    background-color: #686868 !important;
    border-color: #4c4747 !important;
}

.btn-success {
    background-color: #730202 !important;
    border-color: #de3a47 !important;
}

#logo {
    margin-top: 7px;
}

    #logo img {
        width: 170px;
    }

.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover {
    background-color: #333 !important;
}

.yellow {
    background-color: yellow;
}

.padding-top-22 {
    padding-top: 22px !important;
}
.margin-top-22 {
    margin-top: 22px !important;
}

.btn-Approve {
    background-color: green !important;
    border-color: green !important;
    color: white;
}

    .btn-Approve.active, .btn-Approve:active, .btn-Approve:hover, .open > .dropdown-toggle.btn-Approve {
        color: #fff !important;
        background-color: #035203 !important;
        border-color: #007900 !important;
    }

label[required]::after {
    content: " *";
    color: red;
}

.separator {
    display: flex;
    align-items: center;
    text-align: center;
}

    .separator::before, .separator::after {
        content: '';
        flex: 1;
        border-bottom: 1px solid #cacaca;
    }

    .separator::before {
        margin-right: .25em;
    }

    .separator::after {
        margin-left: .25em;
    }

img.online {
    border-left-color: #f37021 !important;
}

.ExpiryAlert {
    animation-name: example;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
    0% {
        color: red;
    }

    10% {
        color: black;
    }

    20% {
        color: red;
    }

    30% {
        color: black;
    }

    40% {
        color: red;
    }

    50% {
        color: black;
    }

    60% {
        color: red;
    }

    70% {
        color: black;
    }

    80% {
        color: red;
    }

    90% {
        color: black;
    }

    100% {
        color: red;
    }
}

/* Standard syntax */
@keyframes example {
    0% {
        color: red;
    }

    10% {
        color: black;
    }

    20% {
        color: red;
    }

    30% {
        color: black;
    }

    40% {
        color: red;
    }

    50% {
        color: black;
    }

    60% {
        color: red;
    }

    70% {
        color: black;
    }

    80% {
        color: red;
    }

    90% {
        color: black;
    }

    100% {
        color: red;
    }
}

.smart-rtl .top-right-activity-dropdown {
    left: 16px !important;
    right: auto !important;
}

.ajax-notifications .alert.alert-transparent {
    background-color: white !important;
    border-color: #1f7fae !important;
    color: black !important;
    cursor: pointer;
    margin-bottom: 0px !important;
}

.CloseNoti {
    color: #1f7fae;
    font-size: 35px !important;
    margin-top: 15px;
    margin-right: 10px;
}

.smart-rtl .CloseNoti {
    float: left;
    margin-right: 0px;
    margin-left: 10px;
}

.bg-color-Notification {
    background-color: #e9e9e9 !important;
}

.time_date {
    color: #747474;
    display: block;
    font-size: 12px;
    margin: 0 15px 0;
}

.bg-color-Report {
    background-color: #96c0b7 !important;
}

.dd-handle:hover, .dd-handle:hover + .dd-list .dd-handle {
    background: #c4f1e7 !important;
    border: 1px solid #96c0b7;
    color: #333 !important;
}

.select2-results .select2-highlighted {
    background: #f37021;
    color: #fff;
}

.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
    z-index: 3;
    color: #fff;
    background-color: #f37021;
    border-color: #c36c38;
    cursor: default;
}

#ribbon .breadcrumb li:last-child, #ribbon .breadcrumb > .active {
    color: #ffffff;
    font-weight: bold;
}

.breadcrumb > li + li:before {
    color: #545454;
}
.margin-left-5{
    margin-left : 5px !important;
}
.paddingLR-10 {
    padding-left: 10%;
    padding-right: 10%;
}
.link {
    color: blue;
    text-decoration: underline;
    cursor: pointer;
    width: fit-content;
}
.hide{
    display:none !important;
}
.strike {
    display: block;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    font-weight : bold;
    font-size:15px !important;
}

    .strike > span {
        position: relative;
        display: inline-block;
    }

        .strike > span:before,
        .strike > span:after {
            content: "";
            position: absolute;
            top: 50%;
            width: 9999px;
            height: 1px;
            background: #eee
        }

        .strike > span:before {
            right: 100%;
            margin-right: 15px;
        }

        .strike > span:after {
            left: 100%;
            margin-left: 15px;
        }
.float-right{
    float:right !important;
}
.float-left {
    float: left !important;
}
nav ul li.active > a:before {
    color: #dde4ea !important;
}

.spinner {
    --gap: 5px;
    --clr: #FF671D;
    --height: 23px;
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--gap);
}

    .spinner span {
        background: var(--clr);
        width: 6px;
        height: var(--height);
        animation: grow 1s ease-in-out infinite;
    }

        .spinner span:nth-child(2) {
            animation: grow 1s ease-in-out 0.15s infinite;
        }

        .spinner span:nth-child(3) {
            animation: grow 1s ease-in-out 0.3s infinite;
        }

        .spinner span:nth-child(4) {
            animation: grow 1s ease-in-out 0.475s infinite;
        }

@keyframes grow {
    0%,100% {
        transform: scaleY(1);
    }

    50% {
        transform: scaleY(1.8);
    }
}


.btn_upload {
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    position: relative;
    color: #fff;
    background-color: #ff7602;
    border: 1px solid #f37021;
    padding: 5px 10px;
}

    .btn_upload:hover,
    .btn_upload:focus {
        background-color: #f37021;
    }

/*.upload-container {
    display: flex;
    align-items: flex-start;
 }*/

.btn_upload input {
    cursor: pointer;
    height: 100%;
    position: absolute;
    filter: alpha(opacity=1);
    -moz-opacity: 0;
    opacity: 0;
}

.it {
    height: 100px;
    margin-left: 10px;
    width: 100%;
    object-fit: cover;
}

.btn-rmv1,
.btn-rmv2,
.btn-rmv3,
.btn-rmv4,
.btn-rmv5,
.btn-rmv6,
.btn-rmv7,
.btn-rmv8,
.btn-rmv9,
.btn-rmv10,
.btn-rmv11,
.btn-rmv12,
.btn-rmv13 {
    display: none;
}

.rmv {
    cursor: pointer;
    color: #fff;
    border-radius: 30px;
    border: 1px solid #fff;
    display: inline-block;
    background: rgba(255, 0, 0, 1);
    margin: -6px -10px;
}

    .rmv:hover {
        background: rgba(255, 0, 0, 0.5);
    }


fieldset {
    margin-bottom: 10px;
}

legend.CustomLegend {
    font-weight: 500;
    border-bottom: 0;
}

input[type="radio"] {
    display: none;
}

/* Style the custom radio button */
label.RadioBTN {
    display: inline-block;
    padding: 5px 10px;
    margin: 0 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    cursor: pointer;
}

/* Style the custom radio button when selected */
input[type="radio"]:checked + label.RadioBTN {
    background-color: #158d44;
    border-color: #158d44;
    color: white;
}


/********************************************************************************************************/

.btn_upload {
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    position: relative;
    color: #fff;
    background-color: #ff7602;
    border: 1px solid #f37021;
    padding: 5px 10px;
}

    .btn_upload:hover,
    .btn_upload:focus {
        background-color: #f37021;
    }

/*.upload-container {
    display: flex;
    align-items: flex-start;
}*/

.btn_upload input {
    cursor: pointer;
    height: 100%;
    position: absolute;
    filter: alpha(opacity=1);
    -moz-opacity: 0;
    opacity: 0;
}

.it {
    height: 100px;
    margin-left: 10px;
    width: 100%;
    object-fit: cover;
}

.btn-rmv1,
.btn-rmv2,
.btn-rmv3,
.btn-rmv4,
.btn-rmv5,
.btn-rmv6,
.btn-rmv7,
.btn-rmv8,
.btn-rmv9,
.btn-rmv10,
.btn-rmv11,
.btn-rmv12,
.btn-rmv13 {
    display: none;
}

.rmv {
    cursor: pointer;
    color: #fff;
    border-radius: 30px;
    border: 1px solid #fff;
    display: inline-block;
    background: rgba(255, 0, 0, 1);
    margin: -6px -10px;
}

    .rmv:hover {
        background: rgba(255, 0, 0, 0.5);
    }

/**********************************************************************************************/
.wrapper {
    display: inline-flex;
}

    .wrapper .icon {
        position: relative;
        background: #ffffff;
        border-radius: 50%;
        padding: 15px;
        margin: 0 10px;
        width: 10px;
        height: 10px;
        font-size: 18px;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
        cursor: pointer;
        transition: all 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        -o-border-radius: 50%;
        -webkit-transition: all 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -moz-transition: all 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -ms-transition: all 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -o-transition: all 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    }


    .wrapper .tooltip {
        position: absolute;
        top: 0;
        color: #ff7602;
        font-size: 14px;
        background-color: #686868 !important;
        color: #ffffff;
        padding: 5px 8px;
        box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
        opacity: 0;
        pointer-events: none;
        border-radius: 4px;
        transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -webkit-transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -moz-transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -ms-transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -o-transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        -ms-border-radius: 4px;
        -o-border-radius: 4px;
    }

        .wrapper .tooltip::before {
            position: absolute;
            content: "";
            height: 8px;
            width: 8px;
            background: #fff;
            bottom: -3px;
            left: 50%;
            transform: translate(-50%) rotate(45deg);
            transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
            -webkit-transform: translate(-50%) rotate(45deg);
            -moz-transform: translate(-50%) rotate(45deg);
            -ms-transform: translate(-50%) rotate(45deg);
            -o-transform: translate(-50%) rotate(45deg);
            -webkit-transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
            -moz-transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
            -ms-transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
            -o-transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        }

    .wrapper .icon:hover .tooltip {
        top: -45px;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    .wrapper .icon:hover span,
    .wrapper .icon:hover .tooltip {
        text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.01);
    }

    .wrapper .t1:hover,
    .wrapper .t1:hover .tooltip,
    .wrapper .t1:hover .tooltip::before,
    .wrapper .t2:hover,
    .wrapper .t2:hover .tooltip,
    .wrapper .t2:hover .tooltip::before,
    .wrapper .t3:hover,
    .wrapper .t3:hover .tooltip,
    .wrapper .t3:hover .tooltip::before,
    .wrapper .t4:hover,
    .wrapper .t4:hover .tooltip,
    .wrapper .t4:hover .tooltip::before,
    .wrapper .t5:hover,
    .wrapper .t5:hover .tooltip,
    .wrapper .t5:hover .tooltip::before,
    .wrapper .t6:hover,
    .wrapper .t6:hover .tooltip,
    .wrapper .t6:hover .tooltip::before,
    .wrapper .t7:hover,
    .wrapper .t7:hover .tooltip,
    .wrapper .t7:hover .tooltip::before,
    .wrapper .t8:hover,
    .wrapper .t8:hover .tooltip,
    .wrapper .t8:hover .tooltip::before,
    .wrapper .t9:hover,
    .wrapper .t9:hover .tooltip,
    .wrapper .t9:hover .tooltip::before,
    .wrapper .t10:hover,
    .wrapper .t10:hover .tooltip,
    .wrapper .t10:hover .tooltip::before,
    .wrapper .t11:hover,
    .wrapper .t11:hover .tooltip,
    .wrapper .t11:hover .tooltip::before ,
    .wrapper .t12:hover,
    .wrapper .t12:hover .tooltip,
    .wrapper .t12:hover .tooltip::before ,
    .wrapper .t13:hover,
    .wrapper .t13:hover .tooltip,
    .wrapper .t13:hover .tooltip::before {
        background-color: #686868 !important;
        color: #fff;
    }


#myTabContent2 {
    background: #fff !important;
}
.NextBTN{
    text-align-last: end !important;
}   