* {
margin: 0;
padding: 0;
}

html {
font-family: Arial,"Helvetica Neue",Helvetica,sans-serif;
font-size: 16px;
box-sizing: border-box;
}

body {
color: #000000;
background-color: #e9f0d9;
}

h1 {
font-size: 32px;
padding: 20px 0px;
}

h2 {
font-size: 20px;
padding: 10px 0px;
}

p {
padding: 10px 0px;	
}



#page {
margin: 30px auto;
}

#header {
padding: 5px;
text-align: center;
background-color: #83A342;
color: #FFFFFF;
text-shadow: 2px 2px 0px #444444;
}

.errorcode {
font-size: 160px;
color: #444444;
letter-spacing: .05em;
text-shadow: 4px 4px 0px #83A342;
}

body.status3xx {
background-color: #d6d9e7;
}

.status3xx #header {
background-color: #475076;
color: #FFFFFF;
}

.status3xx .errorcode {
text-shadow: 4px 4px 0px #FFFFFF;
}

body.status4xx {
background-color: #f5e1df;
}

.status4xx #header {
background-color: #C55042;
color: #FFFFFF;
}

.status4xx .errorcode {
text-shadow: 4px 4px 0px #C55042;
}

body.status5xx {
background-color: #fdfbda;
}

.status5xx #header {
background-color: #F2E81A;
color: #000000;
text-shadow: 2px 2px 0px #FFFFFF;
}

.status5xx .errorcode {
text-shadow: 4px 4px 0px #F2E81A;
}

#content {
text-align: center;
padding: 5px;
}

#footer {
color: #666666;
padding: 5px;
font-size: 10px;
text-align: center;
}

#footer a {
color: #999999;
}

@media only screen and (max-width: 960px) {  

	.errorcode.errorlong {
	font-size: 100px;
	}
	
}

@media only screen and (max-width: 620px) {  

	.errorcode.errorlong {
	font-size: 75px;
	}
	
}

@media only screen and (max-width: 480px) {  

	.errorcode.errorlong {
	font-size: 50px;
	}
	
}