<!doctype html>
<html lang="en-GB">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>Error {{ code }}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style type="text/css">
        @import url(https://fonts.googleapis.com/css?family=Droid+Sans);

        html {
            font-size: 100%;
            -webkit-text-size-adjust: 100%;
            -ms-text-size-adjust: 100%;
            font-family: sans-serif;
            color: #222;
        }

        body {
            font-family: 'Droid Sans', sans-serif;
            font-size: 11pt;
            color: #555;
            line-height: 25px;
            margin: 0;
        }

        a {
            color: #00e;
        }

        a:visited {
            color: #551a8b;
        }

        a:hover {
            color: #72ADD4;
        }

        a:focus {
            outline: thin dotted;
        }

        a:hover, a:active {
            outline: 0;
        }

        hr {
            display: block;
            height: 1px;
            border: 0;
            border-top: 1px solid #ccc;
            margin: 1em 0;
            padding: 0;
        }

        .wrapper {
            padding: 3% 6%;
            margin: 0 auto 5em;
        }

        @media (min-width: 768px) {
            html {
                font-size: 100%;
                -webkit-text-size-adjust: 100%;
                -ms-text-size-adjust: 100%;
                font-family: sans-serif;
                color: #222;
            }

            body {
                font-size: 12pt;
            }

            a {
                color: #00e;
            }

            .wrapper {
                max-width: 768px
            }

            a, a:visited {
                color: #2972A3;
            }

            .row-fluid [class*="span"] {
                float: left;
                width: 100%;
                margin-left: 2.0744680851064%;
                -webkit-box-sizing: border-box;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
            }

            .row-fluid [class*="span"]:first-child {
                margin-left: 0;
            }

            .row-fluid .span3 {
                width: 99.946808510638%;
            }

            .row-fluid .span1 {
                width: 40.372340425532%;
            }

            .ellipsis {
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
                -o-text-overflow: ellipsis;
            }
        }
    </style>
</head>
<body>
<div class="wrapper">
    <div role="main" class="main">
        <div class="row-fluid">
            <div class="span3">
                <div class="span1 ellipsis">
                    <h1>Error {{ code }}</h1>
                </div>
            </div>
            <h2>{{ name }}</h2>
            <p>{{ summary }}</p>
            <hr>

            <h3>What does this mean?</h3>

            <p>
                Something went wrong on our side while we were processing your request.
                {{ message }}
            </p>
            <p>
                This occurrence has been logged. We're really sorry about this, and will
                work hard to get this resolved as soon as possible.
            </p>
            <p>
                This error can be identified by <i>{{ id }}</i>.
                You might want to take a note of this code.
            </p>
            <p>
                Perhaps you would like to go to our <a href="{{ url('/') }}">home page</a>?
            </p>
        </div>
    </div>
</div>
</body>
</html>
