/* chusmear config de tablet */


@keyframes zumbido {
    0%{left: 0px;top: 0px;}
    10%{left: -5px;top: 0px;}
    20%{left: 0px;top: 0px;}
    30%{left: 5px;top: 0px;}
    40%{left: 0x;top: 0px;}
    50%{left: -5px;top: 0px;}
    60%{left: 0px;top: 0px;}
    70%{left: 5px;top: 0px;}
    80%{left: 0px;top: 0px;}
    90%{left: -5px;top: 0px;}
    100%{left: 0px;top: 0px;}
}

.error_zumbo{
    border-color: #dc3545!important;
    animation-name: zumbido;
    animation-duration: 0.3s;
    position:relative;
}
/* pantalla chica */

    /* aside */

        @media (max-width:767px) {
            .carrusel {
                width: 0px;
                transition: width 1s;
            }  
        }
        @media (max-width:767px) {
            .img1{
                width: 100%;
                object-fit: cover;
                height: 100vh;
                object-position: 30% 100%;
            }
            .img2{
                width: 100%;
                object-fit: cover;
                height: 100vh;
            }
        }
        @media (max-width:767px) {
            .forgot{
                display: block;
                margin-top: 15px;text-align: center;
                font-size: 15px;
                color: #6f7a85;
                opacity: 0.9;
                text-decoration: none;
            }
            .forgot:hover{
                color: #6f7a85;
            }
        }
        @media (max-width:767px) {
            .text_mostrar{
                color:black;
                margin-left:5px;
                font-size: 18px;
            }
        }
        @media (max-width:767px) {
            .SistemaIntegral {
                display: none;
            }
        }
    /* aside */

/* pantalla chica */
  
/* pantalla grande */

    /* aside */
        
        @media (min-width:768px) {
            .carrusel {
                transition: width 1s;
            }   
        }

        @media (min-width:768px) {
            .SistemaIntegral {
                display: block;
                z-index: 100;
                position: absolute;
                text-align: center;
                color: white;
                margin-top: 20px;
                font-size: 40px;
            }
        }

        @media (min-width:768px) {
            .img1{
                width: 100%;
                object-fit: cover;
                height: 100vh;
                object-position: 30% 100%;
            }
            .img2{
                width: 100%;
                object-fit: cover;
                height: 100vh;
            }
        }
    /* aside */

    /* login */
        @media (min-width:768px) {
            #floatingInput{
                background: none;
                border: none;
                border-bottom: 1px solid #434a52;
                border-radius: 0;
                box-shadow: none;
                outline: none;
                color: inherit;
            }
            #floatingPassword{
                background: none;
                border: none;
                border-bottom: 1px solid #434a52;
                border-radius: 0;
                box-shadow: none;
                outline: none;
                color: inherit;
            }
        }
        @media (min-width:768px) {
            .text_mostrar{
                color:black;
                margin-left:5px;
                font-size: 18px;
            }
        }
        @media (min-width:768px) {
            .forgot{
                display: block;
                margin-top: 15px;
                text-align: center;
                font-size: 15px;
                color: #6f7a85;
                opacity: 0.9;
                text-decoration: none;
            }
            .forgot:hover{
                color: #6f7a85;
            }
        }
    /* login */
    
/* pantalla grande */