<!DOCTYPE html>
<html>
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>{MESSAGE}</title>
    <style type="text/css">
        body {
            background: none repeat scroll 0 0 #eee;
            color: black;
            padding: 3ex;
            text-align: center;
            font-family: Tahoma, sans-serif;
            font-size: .8em;
        }

        div.error-box {
            text-align: left;
            width: 700px;
            clear: both;
            padding: 15px;
            background-color: #fff;
            border: 1px solid #aaa;
            margin: 0 auto;
            border-radius: 15px;
        }
        div.error-box div.error-header {
            font-size: 180%;
            background: url('/components/assets/img/error.png') no-repeat left top;
            padding: 4px 0 14px 55px;
            margin: 10px 0 20px 0;
        }
        div.error-box div.error-header div.hint {
            font-size: 50%;
            color: #666;
        }
        div.error-box div.error-details {
            margin: 0 0 20px 50px;
        }
    </style>
<body>
<div class="error-box">
    <div class="error-header">
        {MESSAGE}
    </div>
    <div class="error-details">
        {DETAILS}
    </div>
</div>
</body>
</html>