/* error.css */
body,html {
	height:100vh;
	width:100%;
	margin:auto;
	padding:0;
	display:flex;
	flex:1;
	flex-flow:column;
	align-items:center;
	justify-content:center;
	font-family:calibri;
	
	background-color:#222324;
}


#container{
	display: flex;
	flex-direction:column;
	align-items: center;
	justify-content: center;
	width:90%;
	height:90%;
	min-height:90%;
	align-self:center;
	margin:auto;
}


article{
	width:90%;
	height:90%;
	min-height:90%;
	display:flex;
	align-items:center;
	justify-content:center;
	flex-direction:column;
	
	
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center center;
	background-size:25% auto;
	
	order:2;
}


h1{
	flex:1;
	order:1;
	font-size:1.5rem;
	color:#E41B17;
}



span#ip{
	flex:1;
	order:4;
	align-self:flex-end;
	padding:1rem;
	color:rgba(133,133,133,0.25);
	text-shadow: 0px 0px 10px rgba(255, 0, 0, 0.42);
}


div#quip{
	display:flex;
	flex-flow:column;
	align-self:center;
	flex:1;
	order:3;
	width:100%;
	min-width:100%;
	text-align:center;
	font-style:italic;
	color:rgba(133,133,133,0.5);
	justify-content:center;
}

div#quip > span{
	display:block;
	clear:both;
	align-self:center;
	font-style:normal;
	font-size:smaller;
	margin:1rem 0 0 10rem;
	color:white;
}


h1:before{content:attr(data-code)': '}
h1:after{content:attr(data-message)}
p:before,
span:before{content:attr(data-value);}