﻿/* =============================================================== */

body {
    background: #01671338 !important;
}

.circular {
    background-image: url('../img/logos/ArcoLoader1.svg');
    height: 190px;
    transform-origin: center center;
    width: 190px;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    filter: drop-shadow(0px 0px 0px #fff);
    background-repeat: no-repeat;
    z-index: 999993;
}

.circular1 {
    background-image: url('../img/logos/CentroLoader.svg');
    height: 135px;
    transform-origin: center center;
    width: 135px;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    filter: drop-shadow(0px 0px 7px #000);
    z-index: 999995;
}

.circular2 {
    background-image: url('../img/logos/ArcoLoader2.svg');
    height: 170px;
    transform-origin: center center;
    width: 170px;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 999993;
}

@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35px;
    }

    100% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124px;
    }
}

@keyframes color {
    100%, 0% {
        stroke: #d62d20;
    }

    40% {
        stroke: #0057e7;
    }

    66% {
        stroke: #008744;
    }

    80%, 90% {
        stroke: #ffa700;
    }
}

.preloader {
    background: linear-gradient(304deg, #06975394 9%, #0253ab66 124%) !important;
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes rotate {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

.imgGiro {
    -webkit-animation: 3s rotate linear infinite;
    animation: 3s rotate linear infinite;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}

#imgr2 {
    -webkit-animation-direction: reverse;
    animation-direction: reverse;
}

.imgGiroRev {
    -webkit-animation: 8s rotate linear infinite;
    animation: 8s rotate linear infinite;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}

.bg-azul {
    background: linear-gradient(101deg, #016335bf 14%, #023166c9 91%) !important;
    /*    background: linear-gradient(68deg, rgb(3 20 87 / 80%) 25%, rgb(0 106 141) 62%, rgba(23,156,148,0.7) 97%) !important;
*/ /* background: linear-gradient(68deg, rgb(3 20 87 / 80%) 25%, rgb(0 106 141) 62%, rgba(23,156,148,0.7) 97%) !important;*/
}

#btnIngresar {
    background-color: #0a4b6f;
    /* border: 1px solid #ffffff8c; */
}

    #btnIngresar:hover {
        border: 1px solid var(--color4);
        color: var(--color4);
    }

[type="checkbox"] + label:before, [type="checkbox"]:not(.filled-in) + label:after {
    border: 2px solid #9a9a9a;
}

[type="checkbox"]:checked.chk-col-indigo + label:before {
    border-right: 2px solid #9a9a9a;
    border-bottom: 2px solid #9a9a9a;
}

@keyframes scroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-3500px);
    }
}

.slider {
    box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.125);
    height: 100%;
    overflow: hidden;
    position: absolute;
    width: auto;
    z-index: -2;
    filter: opacity(0.7);
}

    .slider::before, .slider::after {
        background: linear-gradient(to right, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
        content: "";
        height: 100%;
        position: absolute;
        width: auto;
        z-index: 2;
    }

    .slider::after {
        right: 0;
        top: 0;
        transform: rotateZ(180deg);
    }

    .slider::before {
        left: 0;
        top: 0;
    }

    .slider .slide-track {
        animation: scroll 80s linear infinite;
        display: flex;
        width: 3500px;
        height: 100%;
    }

    .slider .slide {
        height: 100%;
        width: auto;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #55ff00 !important;
    -webkit-transition: .4s;
    transition: .4s;
}
