/**********************/
.border-jangro {
  border-color: #024638 !important;
}
.text-jangro {
  color: #024638 !important;
}
.border-left-jangro {
  border-left: 0.25rem solid #024638 !important;
}
.border-bottom-jangro {
  border-bottom: 0.25rem solid #024638 !important;
}
.form-control::placeholder {
    font-style:italic;
    font-size:smaller;
}
/*********************/

#notification {
    visibility: hidden;
    position: fixed;
    z-index: 1;
    top: 30px;
    width: 347px;
}
#notification.issue {
    background-color:#F5333F!IMPORTANT;
}
#notification.show {
    visibility:visible; /* Show the notification */
    /* Add animation:Take 0.5 seconds to fade in and out the notification.
    However, delay the fade out process for 2.5 seconds */
    -webkit-animation:fadein 0.5s, fadeout 0.5s 2.5s;
    animation:fadein 0.5s, fadeout 0.5s 2.5s;
}
/* Animations to fade the notification in and out */
@-webkit-keyframes fadein {
    from {
        top:0;
        opacity:0;
    }
    to {
        top:30px;
        opacity:1;
    }
}

@keyframes fadein {
    from {
        top:0;
        opacity:0;
    }
    to {
        top:30px;
        opacity:1;
    }
}

@-webkit-keyframes fadeout {
    from {
        top:30px;
        opacity:1;
    }
    to {
        top:0;
        opacity:0;
    }
}

@keyframes fadeout {
    from {
        top:30px;
        opacity:1;
    }
    to {
        top:0;
        opacity:0;
    }
}

#loading {
    position:fixed;
    display:none;
    width:100%;
    height:100%;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,0.5);
    z-index:1100;
}
#loading img {
    position:absolute;
    top:20%;
    left:40%;
    border:solid 2px #333;
}

.loading-bk {
    background:linear-gradient(-45deg, #d1e0ed, #00549F, #d1e0ed);
    background-size:400% 400%;
    animation:loading-bk 5s ease infinite;
}

@keyframes loading-bk {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

#currenttime .blink {
    animation:blinker 1s linear infinite;
}
@keyframes blinker {
    50% {
        opacity:0;
    }    
}

.bg-login-image {
    /* background-image:url("https://images.unsplash.com/photo-1518020382113-a7e8fc38eac9?q=80&w=600"); */
    background-image:url("/assets/images/rose-800.png");
}
#loginform.user .btn-user {
    font-size:1rem;
}

.logo-wrapper {
    background: #ceff90;
    flex-direction: column;

    @media (min-width: 320px) {
        border-radius: 0.375rem 0.375rem 0 0;
    }
    @media (min-width: 992px) {   
        border-radius: 0.375rem 0 0 0.375rem;
    }
    .logo {
        @media (min-width: 320px) {
            max-width: 200px;
        }
        @media (min-width: 768px) {
            max-width: 300px;
        }
        @media (min-width: 992px) {
            max-width: 400px;
        }

    }
}

.dt-length label {
    margin-left:1rem;
}

.dt-empty {
    background:#e7bd26;
    color:#fff;
}

.small-important {
    font-size:80%!important;
    font-weight:400!important;
}

table .dt-type-numeric {
    text-align:center!important;
}

/* .topbar .navbar-search input {
    width:25%;
    font-size:1rem;
}
.topbar .navbar-search select {
    width:15%;
} */

.sidebar .sidebar-brand {
    height:6.5rem;
}

#message .text-white-50 {
    color:#fff!important;
}
#message a {
    color:#fff;
    text-decoration:underline;
}

#userDropdown i:hover {
    font-weight:700!important;
}

.changecriteria .form-select {
    padding-right:2rem;
}
.changecriteria .btn, #searchform .btn {
    padding: 0rem 0.75rem;
}
#searchform a.btn {
    padding-top:0.2rem;
}
.tooltip-inner {
    background-color:#fff;
    color:#000;
    box-shadow:0px 0px 4px black;
    opacity:1 !important;
}
.tooltip.bs-tooltip-right .tooltip-arrow::before {
    border-right-color:#fff !important;
}
.tooltip.bs-tooltip-left .tooltip-arrow::before {
    border-left-color:#fff !important;
}
.tooltip.bs-tooltip-bottom .tooltip-arrow::before {
    border-bottom-color:#fff !important;
}
.tooltip.bs-tooltip-top .tooltip-arrow::before {
    border-top-color:#fff !important;
}

#sales #order-tabs li {
    list-style:none;
    float:left;
    padding:10px;
    background:#d1e0ed;
    border-right:solid 1px #e3e6f0;
}
#sales #order-tabs li a {
    color:#5a5c69;
}
#sales #order-tabs li a:hover {
    text-decoration:none;
}
#sales #order-tabs li:not(.ui-tabs-active):hover {
    background:#b3d0e9;
}
#sales #order-tabs li.ui-tabs-active {
    background:#00549F;
    font-weight:bold;
}
#sales #order-tabs li.ui-tabs-active a {
    color:#fff;
}
#sales #orders_total_info i {
    margin-left:2px;
    margin-right:3px;
}

#users .input-group-append .btn-light {
    border-color:#d1d3e2;
    border-left:0;
}

.form-multi-select button {
    background:#fff;
    border:1px solid #d1d3e2;
}
.form-multi-select button .filter-option-inner-inner {
    color:inherit;
}

#orders .dt-scroll-head { 
    overflow: visible !important; 
}

#api-results .api-results {
    max-height:500px;
    overflow:auto;
}