body{
	background-color:#EAEAEC;
}
.Xbody{
		position: fixed;
		width:80%;
		height: 80%;
		top: 10%;
		Left: 10%;
		background-color:#000;
		/*margin: auto;*/
		padding: 10px, 10px, 10px, 10px;
		border: 4px solid #fff;
		box-shadow: 0.5px 0.5px 0.5px 1px #888888;		
}
.centered {
  	position: fixed;
  	top: 50%;
  	left: 50%;
  	padding:100px, 100px, 100px, 100px;
	text-align:center;
	color: #4d5252; 
  	/* bring your own prefixes */
  	transform: translate(-50%, -50%);
}
h2.blue{	
	color:blue;	
}
h2.blue a{
	text-decoration: none;
	color:blue;
	border-bottom: dotted 1px rgba(0, 0, 0, 0.9);
		-moz-transition: color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;
		-webkit-transition: color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;
		-ms-transition: color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;
		transition: color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;
		outline: 0;
}
h2.blue a:hover{	
	color:pink;
	border-bottom-color: rgba(255, 255, 255, 0);
}
/* Wide */
	@media screen and (min-width: 961px) and (max-width: 1880px) {		
		/* Basic */
			.Xbody {
				font-size: 20pt;
				background-color: pink;
			}
	}
	
/* Normal */
	@media screen and (min-width: 961px) and (max-width: 1620px) {	
	/* Basic */
			.Xbody {
				font-size: 16pt;
				background-color: #fff;
			}
	}
/* Narrow */
	@media screen and (min-width: 961px) and (max-width: 1320px) {		
		/* Basic */
			.Xbody {
				font-size: 14pt;
				background-color: #fff;
			}
	}
/* Narrower */
	@media screen and (max-width: 960px) {		
		/* Basic */
			.Xbody {
				font-size: 12pt;
				background-color: #fff;
			}
	}
/* Mobile */
	@media screen and (max-width: 736px) {		
		/* Basic */
			.Xbody {
				font-size: 8pt;
				background-color: #fff;
			}
	}
/* Mobile small screen*/
	@media screen and (max-width: 500px) {		
		/* Basic */
			.Xbody {
				font-size: 8pt;
				background-color: #fff;
			}
	}			
	