/************* GENERAL STYLES ***/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-family: inherit;
	vertical-align: baseline; }

:focus { outline: 0; }

* { box-sizing: border-box; }

html, body { height: 100%; }

body {
    background: rgb(61,166,187);
    background: -moz-radial-gradient(center, ellipse cover, rgba(61,166,187,1) 0%, rgba(39,136,156,1) 100%);
    background: -webkit-radial-gradient(center, ellipse cover, rgba(61,166,187,1) 0%,rgba(39,136,156,1) 100%);
    background: radial-gradient(ellipse at center, rgba(61,166,187,1) 0%,rgba(39,136,156,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3da6bb', endColorstr='#27889c',GradientType=1 );
    border-top: 7px solid #D64F4F;
	font-family: 'Lato', sans-serif;
	font-size: 18px;
	line-height: 1.3;
	color: #c0f1f9; }

strong { font-weight: bold; }

em { font-style: italic; }

img {
    max-width: 100%;
    height: auto; }


/*** FONT STYLES ***/
/*
    font-family: 'Titillium Web', sans-serif;
    font-family: 'Lato', sans-serif;
*/

h1 { 
    color: #fff;
    font-family: 'Titillium Web', sans-serif;
	font-size: 30px; 
	font-weight: 600;
    line-height: 1;
	margin: 0 0 20px; }

a { 
	color: #36a6bc;
	text-decoration: none; }
	
a:hover { text-decoration: underline; }

p { margin-bottom: 1.5rem; }


/*** ERROR 500 ***/
.wrapper {
    width: 100%;
    height: 100%;
    display: flex; }

.innerWrap {
    width: 1100px;
    max-width: 100%;
    padding: 0 24px;
	margin: auto; }

#error500 { text-align: center; }

    #error500 main { margin: 40px 0; }

    #error500 img.logo { 
        margin-bottom: 40px; }

    #error500 img.superman { 
        width: 360px;
        max-width: 100%; }


/*** MEDIA QUERIES ***/
@-ms-viewport { width: device-width; }
@viewport { width: device-width; }


/*** 600px ***/
@media screen and (max-width: 600px) {

    #error500 { font-size: 16px; }
    
        #error500 h1 { font-size: 24px; }
    
        #error500 img.superman { width: 300px; }

}