/**
 * Responsive-Error-Pages - Responsive web error code pages templates for WBB.
 * https://github.com/williambargentball/Responsive-Error-Pages
 *
 * @author William Bargent code@bargent-ball.co.uk
 * 
 * @license AGPL-3.0
 * 
 *              GNU AFFERO GENERAL PUBLIC LICENSE
 *                 Version 3, 19 November 2007
 *
 * This code is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Affero General Public License, version 3,
 * as published by the Free Software Foundation.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 * GNU Affero General Public License for more details.
 *
 * You should have received a copy of the GNU Affero General Public License, version 3,
 * along with this program.  If not, see <http://www.gnu.org/licenses/>
 *
 **/

body {
    margin: 0;
    font-family: "JetBrains Mono", monospace;
    color: #151515;
    overflow: hidden;
}

/* Links and Text */
a { color: #7437d0; text-decoration: underline; }
a:hover { color: #151515; }

.brand {
    position: absolute;
    left: 50%;
    top: -15%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: 22px;
    margin-left: 6px;
    font-weight: 700;
    z-index: 9;
}
.brand a { color: #7437d0; text-decoration: none; white-space: nowrap; }
.brand a:hover { color: #7437d0; }
h1 {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: 140px;
    font-weight: 700;
    margin: 0px;
    color: #262626;
    text-transform: uppercase;
}
h1 > span {
    color: #7437d0;
}
h2 {
    font-size: 18px;
    font-weight: 400;
    text-transform: uppercase;
    margin-top: 0px;
    padding: 1em;
}

/* Main */

.card {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    max-width: 767px;
    width: 100%;
    line-height: 1.5;
    padding: 110px 0 110px 0;
    text-align: center;
    background: #fff;
}

.card .card-header {
    position: relative;
    height: 180px;
}

/* END Main */

/* Footer */

footer.page-footer .footer .disclamer {
    width: 100%;
    position: absolute;
    left: 50%;
    bottom: 1em;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
    padding: 1em;
}
footer.page-footer .footer .disclamer a {
    font-size: 0.8em;
    color: #151515;
    text-decoration: none;
}
footer.page-footer .footer .disclamer a:hover { color: #7437d0; }

/* END Footer */


@media (min-width: 576px) {
    body {
        background: #f6f6f6;
    }
    .card {
        top: 45%;
        -webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.1);
        -moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.1);
        box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.1);
        width: 95%;
    }
    .card .card-header h1 {
        font-size: 165px;
    }
    .card h2 {
        font-size: 21px;
    }
    footer.page-footer .footer .disclamer .policies {
        display: inline-block;
    }
}

@media (min-width: 768px) { }

@media (min-width: 992px) { }

@media (min-width: 1200px) { }

@media (min-width: 1600px) { }