css fixes

atoms/index.css

@@ -49,8 +49,9 @@ p {
 	margin-bottom: 1%;
 }
 
-td {
-    width:50px;
+.periodictable {
+	color: #000;
+	width:50px;
     height: 65px;
     padding:0;
     margin:0;
@@ -59,10 +60,6 @@ td {
 	-moz-transition: box-shadow 0.3s ease;
 	-ms-transition: box-shadow 0.3s ease; 
 	transition: box-shadow 0.3s ease;
-
-}
-.periodictable {
-	color: #000;
 }
 
 .atom:hover {
@@ -260,14 +257,14 @@ img {
 }
 
 .keycolor {
-	width: 20%;
-	height: 10%;
+	width: 20px;
+	height: 25px;
 }
 
 .keyvalue {
 	line-height: 1em;
 	height: 5%;
-	width: 115%;
+	padding-right: 2.5%;
 	text-align: left;
 }
 
@@ -284,11 +281,11 @@ img {
 
 .legend {
 	border-collapse: collapse;
+	max-width: 55%;
 }
 
 .legendcell {
 	width: 2px;
-
 	height: 25px !important;
 }
 
@@ -304,7 +301,7 @@ img {
 
 .maxlegend {
 	position: relative;
-	left: 85%;
+	left: 43%;
 	bottom:50;
 
 }

atoms/js/atom.js

@@ -218,7 +218,7 @@ function getAtomDOM(atomNum, size) {
 	var eye = document.createElement("div");
 	eye.style.backgroundColor = changeColor(bgColor,-20);
 	eye.style.borderRadius = "100px / 240px";
-	eye.style.boxShadow = "inset 0 0 0 4px";
+	eye.style.boxShadow = "inset 0 0 0 4px #fff";
 	eye.style.width = size*0.06;
 	eye.style.height = size*0.15;
 	eye.className = "eye";

atoms/js/onload.js

@@ -48,7 +48,10 @@ function keyLegend() {
  	var tbl = document.createElement('table');
  	// id for CSS
  	tbl.id = "keylegend";
-
+ 	if(theme == "category") {
+		tbl.style.top = "10%";
+		tbl.style.left = "16.5%";
+ 	}
  	for (var i = 0; i < Object.keys(keyColors[index]).length; i+=rowlength) {
  		var tr = tbl.insertRow();
  		for (var x = 0; x < rowlength; x++) {
@@ -63,7 +66,6 @@ function keyLegend() {
 		 		keyname.className = "keyvalue";
 		 	}
  		}
-
  	};
  	get("key").appendChild(tbl);
 }

atoms/js/update.js

@@ -41,7 +41,10 @@ function keyChange(theme) {
 		var tbl = document.createElement('table');
 		// id for CSS
 		tbl.id = "keylegend";
-
+		if(theme == "category") {
+ 			tbl.style.top = "10%";
+ 			tbl.style.left = "16.5%";
+ 		}
 	 	for (var i = 0; i < Object.keys(keyColors[index]).length; i+=rowlength) {
 	 		var tr = tbl.insertRow();
 	 		for (var x = 0; x < rowlength; x++) {