/* 404 Page Rules */

.error-container {
    background-color: var(--glue-grey-25);
    background-image: url('https://storage.googleapis.com/gweb-developer-goog-blog-assets/meta/404.svg');
    background-position: calc(50% + 50px) 70%;
    background-size: 900px;
    background-repeat: no-repeat;
    position: relative;
    width: 100%;
    height: 400px;
}

.error-container .title {
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    max-width: 800px;
    margin: auto;
    height: 100%;
    align-content: center;
}

.error-container .title h1 {
    font-weight: 700;
    font-size: 100px;
    line-height: 100px;
}

.error-container .title h2 {
    font-size: 20px;
    max-width: 300px;
    margin: auto;
}

@media (min-width: 600px) {
    .error-container {
        background-position: calc(50% + 100px) 100%;
        background-size: auto;
        height: 980px;
    }

    .error-container .title h1 {
        font-size: 250px;
        line-height: 250px;
    }

    .error-container .title h2 {
        font-size: 35px;
    }
}