@import url('../../main.css');

.failure 
{

    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;

}

.failure__center 
{

    padding: 20px;
    width: 500px;
    background-color: var(--s-background);
    border: 1px solid var(--t-background);
    border-radius: 20px;

}

.failure__center-message p 
{

    padding: 22px 25px;
    background-color: rgba(175, 24, 32, 0.1);
    color: var(--failure);
    font-size: 10pt;
    text-align: justify;

}

.failure__center-back 
{

    display: flex;
    justify-content: center;
    margin-top: 40px;

}

.failure__center-back a 
{

    padding: 12px 18px;
    background-color: var(--f-background);
    border-radius: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--muted-text-color);
    font-size: 9.5pt;
    transition: 0.4s;

}

.failure__center-back a:hover { background-color: var(--t-background); }

@media screen and (max-width: 550px) 
{

    .failure__center 
    {

        width: 100%;
        border-left: 0;
        border-right: 0;
        border-radius: 0;

    }

}