﻿/*---------------------------------------Error message css------------------------------*/
.error {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
    width: 320px;
    padding: 12px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: start;
    background: #810e06;
    border-radius: 8px;
    box-shadow: 0px 0px 5px -3px #111;
    position: fixed;
    top: 0;
    right: 20px;
    transform: translateY(-100%);
    z-index: 1000;
    transition: transform 0.5s ease-out;
}

.error__icon {
    width: 20px;
    transform: translateY(-2px);
    margin-right: 8px;
}

    .error__icon i {
        color: #fff;
        font-size: 22px;
    }

.error__title {
    font-weight: 500;
    font-size: 14px;
    color: #fff;
}

.error__close {
    width: 20px;
    cursor: pointer;
    margin-left: auto;
}

    .error__close i {
        color: #fff;
        font-size: 22px;
    }
/*//----------------------------------------For seccess Message----------------------------*/

.Success {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
    width: 320px;
    padding: 12px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: start;
    background: rgb(10, 162, 58);
    border-radius: 8px;
    box-shadow: 0px 0px 5px -3px #111;
    position: fixed;
    top: 0;
    right: 20px;
    transform: translateY(-100%);
    z-index: 1000;
    transition: transform 0.5s ease-out;
}

.Success__icon {
    width: 20px;
    transform: translateY(-2px);
    margin-right: 8px;
}

    .Success__icon i {
        color: #fff;
        font-size: 22px;
    }

.Success__title {
    font-weight: 500;
    font-size: 14px;
    color: #fff;
}

.Success__close {
    width: 20px;
    cursor: pointer;
    margin-left: auto;
}

    .Success__close i {
        color: #fff;
        font-size: 22px;
    }
/*---------------------------------to disable buttons--------------------------*/
.disable-hover {
    cursor: not-allowed !important;
    animation: shake 0.2s linear 1 !important;
}

    .disable-hover:hover {
        cursor: not-allowed !important;
        animation: shake 0.2s linear 1 !important;
    }

.red-bg {
    background-color: red !important;
    color: white !important;
}

@keyframes shake {
    0% {
        transform: rotate(0deg);
    }

    33% {
        transform: rotate(10deg);
    }

    66% {
        transform: rotate(-10deg);
    }

    100% {
        transform: rotate(10deg);
    }
}

.monthSearch{
    border:none;
    background:none;
    margin:0;
    padding:0;
}
    .monthSearch i {
        font-size:24px;

    }
/*--------------------------------spinner---------------------------------*/
/* Normal Usage */
.spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 9999999;
}

.spinner:before {
    transform: rotateX(60deg) rotateY(45deg) rotateZ(45deg);
    animation: 750ms rotateBefore infinite linear reverse;
    
}

    .spinner:after {
        transform: rotateX(240deg) rotateY(45deg) rotateZ(45deg);
        animation: 750ms rotateAfter infinite linear;
       
    }

    .spinner:before,
    .spinner:after {
        box-sizing: border-box;
        content: '';
        display: block;
        position: absolute;
        margin-top: -5em;
        margin-left: -5em;
        width: 10em;
        height: 10em;
        transform-style: preserve-3d;
        transform-origin: 50%;
        transform: rotateY(50%);
        perspective-origin: 50% 50%;
        perspective: 340px;
        background-size: 10em 10em;
        background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjI2NnB4IiBoZWlnaHQ9IjI5N3B4IiB2aWV3Qm94PSIwIDAgMjY2IDI5NyIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4bWxuczpza2V0Y2g9Imh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaC9ucyI+CiAgICA8dGl0bGU+c3Bpbm5lcjwvdGl0bGU+CiAgICA8ZGVzY3JpcHRpb24+Q3JlYXRlZCB3aXRoIFNrZXRjaCAoaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoKTwvZGVzY3JpcHRpb24+CiAgICA8ZGVmcz48L2RlZnM+CiAgICA8ZyBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBza2V0Y2g6dHlwZT0iTVNQYWdlIj4KICAgICAgICA8cGF0aCBkPSJNMTcxLjUwNzgxMywzLjI1MDAwMDM4IEMyMjYuMjA4MTgzLDEyLjg1NzcxMTEgMjk3LjExMjcyMiw3MS40OTEyODIzIDI1MC44OTU1OTksMTA4LjQxMDE1NSBDMjE2LjU4MjAyNCwxMzUuODIwMzEgMTg2LjUyODQwNSw5Ny4wNjI0OTY0IDE1Ni44MDA3NzQsODUuNzczNDM0NiBDMTI3LjA3MzE0Myw3NC40ODQzNzIxIDc2Ljg4ODQ2MzIsODQuMjE2MTQ2MiA2MC4xMjg5MDY1LDEwOC40MTAxNTMgQy0xNS45ODA0Njg1LDIxOC4yODEyNDcgMTQ1LjI3NzM0NCwyOTYuNjY3OTY4IDE0NS4yNzczNDQsMjk2LjY2Nzk2OCBDMTQ1LjI3NzM0NCwyOTYuNjY3OTY4IC0yNS40NDkyMTg3LDI1Ny4yNDIxOTggMy4zOTg0Mzc1LDEwOC40MTAxNTUgQzE2LjMwNzA2NjEsNDEuODExNDE3NCA4NC43Mjc1ODI5LC0xMS45OTIyOTg1IDE3MS41MDc4MTMsMy4yNTAwMDAzOCBaIiBpZD0iUGF0aC0xIiBmaWxsPSIjMDAwMDAwIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIj48L3BhdGg+CiAgICA8L2c+Cjwvc3ZnPg==);
       
    }
/* sitNSpin.less */
@keyframes rotateBefore {
    from {
        transform: rotateX(60deg) rotateY(45deg) rotateZ(0deg);
    }

    to {
        transform: rotateX(60deg) rotateY(45deg) rotateZ(-360deg);
    }
}

@keyframes rotateAfter {
    from {
        transform: rotateX(240deg) rotateY(45deg) rotateZ(0deg);
    }

    to {
        transform: rotateX(240deg) rotateY(45deg) rotateZ(360deg);
    }
}

