:root {
    --bg-login-izq: #8f0606;
    --bg-login-der: #f4f4f4;
    --bg-color-mytek: #8f0606;
    --bg-color-mytek-hover: #8f0606;
}

.contenedor-login{
    width: 100%;
    height: 100vh;
}

.contenido-login {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: 100vh;
    width: 100%;
}

.contenido-izq {
    background: var(--bg-login-izq);
    padding: 5rem;
    display: flex;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.contenido-der {
    display: flex;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: var(--bg-login-der);
}

.login-card{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.subtitle-login{
    font-size: 1.2rem;
    font-weight: 600;
    color: black;
}

.form-login-estilos {
    width: 100%;
}

.estilos-inputs-login {
    border-radius: .5rem;
    border-color: black;
    width: 100%;
}

.btn-login-contenedor{
    display: flex;
    justify-content: center;
}

.btn-login {
    align-content: center;
    width: 80%;
    font-size: 1rem;
    font-weight: 700;
    background: var(--bg-color-mytek);
    border-radius: .5rem;
    border: none;
    padding: .5rem .5rem;
    transition: ease-in-out .6s;
    color: var(--bg-login-der);
}

.btn-login:hover{
    background: var(--bg-color-mytek-hover);
    color: var(--bg-login-der);
    font-weight: 700;
    width: 100%;
    transition: ease-in-out .6s;
}


.estilos-inputs-login {
    border-radius: .5rem;
    border-color: black;
    width: 100%;
    box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.75);
    font-size: 1.1rem;
}

.estilos-inputs-login::placeholder {
    color: black;
}

.estilos-inputs-login:focus {
   outline: none;
   border-color: black;
}


@media (max-width: 1000px){
    .contenido-izq{
        display: none;
    }

    .contenido-der{
        padding: 2rem;
    }
}




/* Dogo Animacion */
.img-izq-login {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: auto;
}