body {text-align:center;
		background-color: #000;
		color: #fff}
	td.empty {border-style:none}
	td.space {height:1em}
	td {text-align:center;
	    vertical-align:middle;
		border-style:solid;
	    border-width:1px;
	    padding:0px}
	td {opacity:1.0;
		filter:alpha(opacity=40);}
	td:hover {opacity:0.5;
		filter:alpha(opacity=100);}
	td.no:hover {opacity:1.0;
		filter:alpha(opacity=40);}
	span.aw, span.atomicnumber, span.sym  td {font-family: Arial, sans-serif;}
	h3 {margin-top:0px;
		margin-bottom:0px}
	table {border-collapse:collapse;
		cell-padding:0px;
		cell-spacing:0px;}
	span {display:block}
	
	
	td.alkalimetal {background-color:#FF6699}
	td.alkaliearth {background-color:#FF00FF}
	td.basicmetal {background-color:#CC6600}
	td.semimetal {background-color:#00FF00}
	td.halogen {background-color:#FFFF00}
	td.nonmetal {background-color:#329eff}
	td.transitionmetal {background-color:#00FFFF}
	td.noblegas {background-color:#FFCC33}
	td.lanthanides {background-color:#99FF99}
	td.actinides {background-color:#FF3300}
	a {text-decoration:none;
		border:none;}
	a:link, a:active {color:#000}
	a:visited {color:#000;}
	a:hover   {color:#31B404;}

@media screen and (min-width: 320px)
{
	h1 {font-size:0.6em;}
	td {width:1em;
		height:1em;}
	td.empty {line-height:65%;}
	span.atomicnumber {font-size:0.2em;}
	span.aw {font-size:0.1em;}
	span.sym {font-size:0.5em;}
	table {height:40%;
		width:30%;}
	
}
	
	@media screen and (min-width: 480px)
{
	h1 {font-size:0.7em;}
	td {width:1.2em;
		height:1.2em;}
	td.empty {line-height:70%;}
	span.atomicnumber {font-size:0.3em;}
	span.aw {font-size:0.2eem;}
	span.sym {font-size:0.6em;}
	table {height:50%;
		width:40%;}
	
}

@media screen and (min-width: 600px)
{
	h1 {font-size:0.8em;}
	td {width:1.4em;
		height:1.4em;}
	td.empoty {line-height:75%;}
	span.atomicnumber {font-size:0.4em;}
	span.aw {font-size:0.3em;}
	span.sym {font-size:0.7em;}
	table {height:60%;
		width:50%;}
}

@media screen and (min-width: 786px)
{
	h1 {font-size:0.9em;}
	td {width:1.6em;
		height:1.6em;}
	td.empty {line-height:80%;}
	span.atomicnumber {font-size:0.5em;}
	span.aw {font-size:0.4em;}
	span.sym {font-size:0.8em;}
	table {height:70%;
		width:60%;}
}

@media screen and (min-width: 900px)
{
	h1 {font-size:1em;}
	td {width:1.8em;
		height:1.8em;}
	td.empty {line-height:85%;}
	span.atomicnumber {font-size:0.6em;}
	span.aw {font-size:0.5em;}
	span.sym {font-size:0.9em;}
	table {height:80%;
		width:70%;}
}

@media screen and (min-width: 1024px)
{
	h1 {font-size:1.1em;}
	td {width:2em;
		height:2em;}
	td.empty {line-height:90%;}
	span.atomicnumber {font-size:0.7em;}
	span.aw {font-size:0.6em;}
	span.sym {font-size:1em;}
	table {height:90%;
		width:80%;}
}

@media screen and (min-width: 1200px)
{
	h1 {font-size:1.2em;}
	td {width:2.2em;
		height:2.2em;}
	td.empty {line-height:100%;}
	span.atomicnumber {font-size:0.8em;}
	span.aw {font-size:0.7em;}
	span.sym {font-size:1em;}
	table {height:100%;
		width:90%;}
}