.progress { position: relative; height: 4px; display: block; width: 100%; background-color: #acece6; border-radius: 2px; margin: 0.5rem 0 1rem 0; overflow: hidden; }
    .progress .determinate { position: absolute; top: 0; left: 0; bottom: 0; background-color: #26a69a; transition: width .3s linear; }
    .progress .indeterminate { background-color: #26a69a; }
        .progress .indeterminate:before { content: ''; position: absolute; background-color: inherit; top: 0; left: 0; bottom: 0; will-change: left, right; -webkit-animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite; animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite; }
        .progress .indeterminate:after { content: ''; position: absolute; background-color: inherit; top: 0; left: 0; bottom: 0; will-change: left, right; -webkit-animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite; animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite; -webkit-animation-delay: 1.15s; animation-delay: 1.15s; }
.login_preloader { position: absolute; background: #000; opacity: 0.6; z-index: 99999; bottom: 0; right: 0; /* margin-right: 37px; */ margin-bottom: 3px; padding: 5px 57px; }


@-webkit-keyframes indeterminate {
    0% { left: -35%; right: 100%; }
    60% { left: 100%; right: -90%; }
    100% { left: 100%; right: -90%; }
}

@keyframes indeterminate {
    0% { left: -35%; right: 100%; }
    60% { left: 100%; right: -90%; }
    100% { left: 100%; right: -90%; }
}

@-webkit-keyframes indeterminate-short {
    0% { left: -200%; right: 100%; }
    60% { left: 107%; right: -8%; }
    100% { left: 107%; right: -8%; }
}

@keyframes indeterminate-short {
    0% { left: -200%; right: 100%; }
    60% { left: 107%; right: -8%; }
    100% { left: 107%; right: -8%; }
}

.left { float: left !important; }
.right { float: right !important; }



@-webkit-keyframes container-rotate {
    to { -webkit-transform: rotate(360deg); }
}

@keyframes container-rotate {
    to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}


@-webkit-keyframes fill-unfill-rotate {
    12.5% { -webkit-transform: rotate(135deg); }
    25% { -webkit-transform: rotate(270deg); }
    37.5% { -webkit-transform: rotate(405deg); }
    50% { -webkit-transform: rotate(540deg); }
    62.5% { -webkit-transform: rotate(675deg); }
    75% { -webkit-transform: rotate(810deg); }
    87.5% { -webkit-transform: rotate(945deg); }
    to { -webkit-transform: rotate(1080deg); }
}

@keyframes fill-unfill-rotate {
    12.5% { -webkit-transform: rotate(135deg); transform: rotate(135deg); }
    25% { -webkit-transform: rotate(270deg); transform: rotate(270deg); }
    37.5% { -webkit-transform: rotate(405deg); transform: rotate(405deg); }
    50% { -webkit-transform: rotate(540deg); transform: rotate(540deg); }
    62.5% { -webkit-transform: rotate(675deg); transform: rotate(675deg); }
    75% { -webkit-transform: rotate(810deg); transform: rotate(810deg); }
    87.5% { -webkit-transform: rotate(945deg); transform: rotate(945deg); }
    to { -webkit-transform: rotate(1080deg); transform: rotate(1080deg); }
}

@-webkit-keyframes left-spin {
    from { -webkit-transform: rotate(130deg); }
    50% { -webkit-transform: rotate(-5deg); }
    to { -webkit-transform: rotate(130deg); }
}

#spinnerContainer.cooldown { -webkit-animation: container-rotate 1568ms linear infinite,fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1); animation: container-rotate 1568ms linear infinite,fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1); }
.preloader-wrapper { display: inline-block; position: relative; width: 48px; height: 48px; }
    .preloader-wrapper.big { width: 30px; height: 30px; }
    .preloader-wrapper.active { -webkit-animation: container-rotate 1568ms linear infinite; animation: container-rotate 1568ms linear infinite; }
.spinner-layer { position: absolute; width: 100%; height: 100%; opacity: 0; border-color: #26a69a; }
.spinner-blue, .spinner-blue-only { border-color: #fff; }
.active .spinner-layer.spinner-blue { -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both,blue-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both,blue-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }
.active .spinner-layer.spinner-red { -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both,red-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both,red-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }
.active .spinner-layer.spinner-yellow { -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both,yellow-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both,yellow-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }
.active .spinner-layer.spinner-green { -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both,green-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both,green-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }
.active .spinner-layer, .active .spinner-layer.spinner-blue-only, .active .spinner-layer.spinner-red-only, .active .spinner-layer.spinner-yellow-only, .active .spinner-layer.spinner-green-only { opacity: 1; -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }
.gap-patch .circle { width: 1000%; left: -450%; }
.circle-clipper { display: inline-block; position: relative; width: 50%; height: 100%; overflow: hidden; border-color: inherit; }
    .circle-clipper .circle { width: 200%; height: 100%; border-width: 3px; border-style: solid; border-color: inherit; border-bottom-color: transparent !important; border-radius: 50%; -webkit-animation: none; animation: none; position: absolute; top: 0; right: 0; bottom: 0; }
    .circle-clipper.left .circle { left: 0; border-right-color: transparent !important; -webkit-transform: rotate(129deg); transform: rotate(129deg); }
    .circle-clipper.right .circle { left: -100%; border-left-color: transparent !important; -webkit-transform: rotate(-129deg); transform: rotate(-129deg); }
.active .circle-clipper.left .circle { -webkit-animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }
.active .circle-clipper.right .circle { -webkit-animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }
.collection .collection-item.avatar .circle { position: absolute; width: 42px; height: 42px; overflow: hidden; left: 15px; display: inline-block; vertical-align: middle; }
.collection .collection-item.avatar i.circle { font-size: 18px; line-height: 42px; color: #fff; background-color: #999; text-align: center; }
.circle { border-radius: 50%; }
.waves-circle { -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-mask-image: -webkit-radial-gradient(circle, #fff 100%, #000 100%); }
.waves-circle { text-align: center; width: 2.5em; height: 2.5em; line-height: 2.5em; border-radius: 50%; -webkit-mask-image: none; }



.continue_preloader { position: absolute; background: #000; opacity: 0.6; z-index: 99999; bottom: 0; right: 0; /* margin-right: 37px; */ margin-bottom: 0px; padding: 5px 14%; }
.chngepass_preloader { position: absolute; background: #000; opacity: 0.6; z-index: 99999; bottom: 0; right: 0; /* margin-right: 37px; */ margin-bottom: 0px; padding: 5px 21%; }
.address_loading { position: absolute; background: #000; opacity: 0.6; z-index: 99999; bottom: 0; right: 0; /* margin-right: 37px; */ margin-bottom: 0px; padding: 6px 13%; }
.state_loading { display: block; position: absolute; bottom: 0; /* right: 0; */ left: 0; top: 18px; right: 0; }
.DeletAddress_Loadin { position: absolute; bottom: 0;  /* right: 0; */ left: 0; top: 45%; right: 0; float: left; }
.mobile_loading { position: absolute; background: #000; opacity: 0.6; z-index: 99999; bottom: 0; right: 0; /* margin-right: 37px; */ margin-bottom: 0px; padding: 6px 58px; }
.payonline_preloader { position: absolute; background: #000; opacity: 0.6; z-index: 99999; bottom: 0; right: 0px; /* margin-right: 37px; */ margin-bottom: 0px; padding: 42px 0px; width: 100%; }
.changpassword_loading { position: absolute; background: #000; opacity: 0.6; z-index: 99999; bottom: 0; right: 0; /* margin-right: 37px; */ margin-bottom: 0px; padding: 6px 58px; }
#Submit_password { padding: 5px 59px !important; }
.Loding_address { right: 15px !important; position: absolute; background: #000; opacity: 0.6; z-index: 99999; bottom: 0; right: 0; /* margin-right: 37px; */ margin-bottom: 0px; padding: 6px 41px; }

@media only screen and (min-width: 320px) and (max-width: 460px) {
    .login_preloader { padding: 4px 31px; margin-bottom: 2px; }
    .continue_preloader { padding: 3px 38px; }
    .chngepass_preloader { padding: 3px 18% !important; }
    #Submit_password { padding: 3px 32px !important; }
}

@media only screen and (min-width: 320px) and (max-width: 991px) {
    .state_loading { top: 44% !important; }
}