﻿/*  ----------------------------------------------------------------------------------------------------

                                                ERROR PAGES

    ---------------------------------------------------------------------------------------------------- */

.error-page { padding-top: 3.5rem; background: #f1f1f1; }

.error-page__content { width: 100%; max-width: 140rem; margin: auto; background: #fff; }

.error-page__header { position: relative; }
.error-page__header div { width: 100%; height: 6rem; }
.error-page__header img { width: 8rem; }
.error-page__header hr { position: absolute; bottom: 0; left: 0; width: 100%; margin: 0; }

.error-page__body { min-height: 100vh; padding-top: 3rem; }
.error-page__body h1 { padding-bottom: 2rem; }
.error-page__body h1 span { font-weight: 300; }
.error-page__body p { font-weight: 400; }
.error-page__body p,
.error-page__body li { font-size: 1.8rem; }
.error-page__body li { position: relative; padding: 1rem 0 0 2rem; }
.error-page__body ul { padding: 1rem 0 2rem; }
.error-page__body li:before { content: ''; position: absolute; top: 1.8rem; left: 0; width: .4rem; height: .4rem; background: #1e254e; border-radius: 50%; }

@media (min-width: 768px) {
    .error-page { padding-top: 3.5rem; }

    .error-page__header div { height: 9rem; }
    .error-page__header img { width: 12rem; }

    .error-page__body { padding-top: 5rem; }
    .error-page__body p,
    .error-page__body li { font-size: 2.2rem; }
}

@media (min-width: 992px) {
    .error-page__body { min-height: 75rem; }
    .error-page__body h1 { font-size: 6rem; padding-bottom: 3rem; }
    .error-page__body p,
    .error-page__body li { font-size: 2.6rem; line-height: 3.2rem; }
    .error-page__body li { padding-top: 1.5rem; }
    .error-page__body ul { padding: 2rem 0 3.5rem; }
}