body 
{
  margin-left:5%;
  margin-right:5%;
}

/* 
	The HTML5 way to center a table uses text-align:center in <DIV>
*/
div.PH 
{
    text-align:center;  
}

img.round
{
   border-radius:30px;
}

img.fit
{
    width: 60%;
    height: 60%;
}

p, h1
{
    font-family: Arial;
    background:none;
	font-weight: bold;
}

.PH
{
	color: #000000;
}

.PHHS
{
	color: #ff0000;
}

.PHNHS
{
	color: #0000ff;
}

.PHCHS
{
	color: #810541;
}

.left 
{
    text-align:left;
}

.center 
{
    text-align:center;
}

.xxl 
{
    font-size: xx-large;
}

.med 
{
    font-size: medium;
}

.normal 
{
    font-weight: normal;
}

.small
{
    font-size: small;
}

.xsmall
{
    font-size:x-small;
}

.italic
{
    font-style:italic;  
}

table.PH 
{
    border: solid 0px;
    border-spacing: 10px;
    border-collapse: separate;
    
}
table.PH td 
{
	font-family: Arial;
	border: solid 0px;
	padding: 3px;
	text-align:center;
}

table  
{
	margin:auto;
	text-align:left;
	border-collapse:collapse;
}

td 
{
	font-family: Arial;
    background:none;
	border: solid 1px;
	padding: 3px;
	text-align:left;
}

th 
{
	font-family: Arial;
    background:none;
	border: solid 1px;
	padding: 3px;
	text-align:left;
}


/* IDs follow */
/* web and mobile are important to determine screen size  */
/* IDs must be unique so 1 ID follows */
#web-headg {
    display: block;
    text-align: center;
}

#mobile-headg {
    display: none;
}

@media screen and (max-width: 980px) {
    #web-headg {
        display: none;
    }

    #mobile-headg {
        display: block;
    }
}