/*ALERTAS*/
.alerta-exito{
    width: 90%;
    height: 5rem;
    background-color: var(--blanco);
    margin: 0 auto;
    display: flex;
    justify-content: center;
    border: 2px solid var(--verde);
}

.contenido-alerta h2{
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    text-align: center;
    padding: .7rem 1rem .7rem 1rem;
    color: var(--verde);
}
.alerta-exito hr{    
    margin: 0;    
    width: 100%;    
    border: 1px solid var(--verde);
}

.alerta-exito i{
    color: var(--verde);
}


.alerta-error-ubicacion {
    width: 90%;
    height: 5rem;
    background-color: var(--blanco);
    margin: 0 auto;
    display: flex;
    justify-content: center;
    border: 2px solid var(--rojo);
}

.contenido-alerta-error{            
    color: var(--rojo);    
}

.contenido-alerta-error h2{
    font-size: 1.2rem;
    font-weight: 700;
    margin: 0;
    text-align: center;
    padding: .7rem 1rem .7rem 1rem;
    color: var(--rojo);
}


.alerta-error-ubicacion  hr{    
    margin: 0;    
    background-color: var(--rojo);
    width: 100%;    
    border: 1px solid var(--rojo);
}

.contenido-alerta-error i{
    color: var(--rojo);
}

.alerta-advertencia{
    width: 90%;
    height: 5rem;
    background-color: var(--blanco);
    margin: 0 auto;
    display: flex;
    justify-content: center;
    border: 2px solid var(--primario);
}

.alerta-advertencia h2{
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    text-align: center;
    padding: .7rem 1rem .7rem 1rem;
    color: var(--cardprimar);
}
.alerta-advertencia hr{    
    margin: 0;    
    width: 100%;    
    border: 1px solid var(--primario);
}

.alerta-advertencia i{    
    color: var(--primario);
}

.contenido-alerta-error-mensaje{
    width: 90%;
    height: 10rem;
    background-color: var(--blanco);
    margin: 0 auto;
    display: flex;
    justify-content: center;
    border: 2px solid var(--rojo);
}
.contenido-alerta-error-mensaje hr{
    width: 100%;
    color: var(--rojo);
    border: 1px solid var(--rojo);
}
.contenido-alerta-error-mensaje h2{
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    text-align: center;
    padding: .7rem 1rem .7rem 1rem;
    color: var(--rojo);
}
.contenido-alerta-error-mensaje p{
    margin: 0;
    padding: 0;
    color: var(--rojo);
    font-weight: 600;
    font-size: 1rem;
}

.contendor-mesaje i{
    padding-top: 10px;
    padding-right: 15px;
}

.contenido-alerta-exito-mensaje {
    width: 90%;
    height: 10rem;
    background-color: var(--blanco);
    margin: 0 auto;
    display: flex;
    justify-content: center;
    border: 2px solid var(--verde);   
}
.contenido-alerta-exito-mensaje h2{
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    text-align: center;
    padding: .7rem 1rem .7rem 1rem;
    color: var(--verde);
}
.contenido-alerta-exito-mensaje hr{
    width: 100%;
    color: var(--verde);
    border: 1px solid var(--verde);
}
.contenido-alerta-exito-mensaje p{
    margin: 0;
    padding: 0;
    color: #000000;
    font-weight: 600;
    font-size: 1rem;
}
/* ADVERTENCIA */
.alerta-advertencia-mensaje{
    width: 90%;
    height: 10rem;
    background-color: var(--blanco);
    margin: 0 auto;
    display: flex;
    justify-content: center;
    border: 3px solid var(--primario);
}

.alerta-advertencia-mensaje h2{
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    text-align: center;
    padding: .7rem 1rem .7rem 1rem;
    color: var(--cardprimary);
}
.alerta-advertencia-mensaje hr{          
    width: 100%;    
    color: var(--primario);
    border: 1px solid var(--primario);
}
.alerta-advertencia-mensaje p{
    margin: 0;
    padding: 0;
    color: #000000;
    font-weight: 600;
    font-size: 1rem;
}

/*FIN ALERTAS*/

@media (min-width: 768px) {
    .contenido-alerta-exito-mensaje {
        border: 3px solid var(--verde);   
    }
    .contenido-alerta-exito-mensaje h2{
        font-size: 2rem;
        font-weight: 700;
    }
    .contenido-alerta-exito-mensaje hr{        
        border: 2px solid var(--verde);
    }
    .contenido-alerta-exito-mensaje p{        
        font-size: 1.5rem;
    }
    .contenido-alerta-error-mensaje {        
            border: 3px solid var(--rojo);       
    }
    .contenido-alerta-error-mensaje h2{
        font-size: 2rem;
        font-weight: 700;
    }
    .contenido-alerta-exito-mensaje hr{
        border: 2px solid var(--verde);
    }
    .contenido-alerta-exito-mensaje p{
        font-size: 1.5rem;
    }
    
    .alerta-advertencia-mensaje h2{
        font-size: 2rem;        
    }
    .alerta-advertencia-mensaje hr{                  
        border: 2px solid var(--primario);
    }
    .alerta-advertencia-mensaje p{        
        font-size: 1.5rem;
    }
    
}