From 7097ecca16fb7e7c9e1cc2fbeb5c884ae4783c41 Mon Sep 17 00:00:00 2001
From: Git <git@fritten.net>
Date: Fri, 25 Aug 2023 15:04:43 +0000
Subject: [PATCH] General update

---
 GameOfLife/index.html             |   13 +-
 README.md                         |    0
 afkscreen2/index.html             |    0
 afkscreen2/scripts/bg.js          |    0
 bam-backup/test-bam.html          | 1609 +++++++++++++++++++++++++++++
 hex/index.html                    |    2 +-
 hex/scripts/bg.js                 |    1 +
 hex/scripts/patterns/centerhex.js |    0
 hex/scripts/perlin.js             |    0
 hex/styles/style.css              |    0
 s1clone/index.html                |    2 +-
 s1clone/scripts/background.js     |    2 +-
 s1clone/scripts/style.css         |   71 ++
 13 files changed, 1695 insertions(+), 5 deletions(-)
 mode change 100644 => 100755 GameOfLife/index.html
 mode change 100644 => 100755 README.md
 mode change 100644 => 100755 afkscreen2/index.html
 mode change 100644 => 100755 afkscreen2/scripts/bg.js
 create mode 100644 bam-backup/test-bam.html
 mode change 100644 => 100755 hex/index.html
 mode change 100644 => 100755 hex/scripts/bg.js
 mode change 100644 => 100755 hex/scripts/patterns/centerhex.js
 mode change 100644 => 100755 hex/scripts/perlin.js
 mode change 100644 => 100755 hex/styles/style.css
 mode change 100644 => 100755 s1clone/index.html
 mode change 100644 => 100755 s1clone/scripts/background.js
 create mode 100755 s1clone/scripts/style.css

diff --git a/GameOfLife/index.html b/GameOfLife/index.html
old mode 100644
new mode 100755
index 506abc8..75b1586
--- a/GameOfLife/index.html
+++ b/GameOfLife/index.html
@@ -269,7 +269,13 @@
             
             draw(); 
             
-            
+            var looping = false;
+            setInterval(function(){
+                if(looping){
+                    hue = hue+0.01;
+                    hue = hue>1?0:hue;
+                }
+            },400);
             
             document.addEventListener ('keydown', function (event) {
                 if (event.which == 38) {
@@ -284,7 +290,10 @@
                 } 
                 else if(event.which == 39){
                     speed = Math.max(speed-0.01, 0.1 ); 
-                }  
+                }
+                if (event.which == 32){
+                    looping = looping?false:true;
+                }
                  
             }); 
             
diff --git a/README.md b/README.md
old mode 100644
new mode 100755
diff --git a/afkscreen2/index.html b/afkscreen2/index.html
old mode 100644
new mode 100755
diff --git a/afkscreen2/scripts/bg.js b/afkscreen2/scripts/bg.js
old mode 100644
new mode 100755
diff --git a/bam-backup/test-bam.html b/bam-backup/test-bam.html
new file mode 100644
index 0000000..0e7efdd
--- /dev/null
+++ b/bam-backup/test-bam.html
@@ -0,0 +1,1609 @@
+ <a href="ts3server://bam.yt/"><canvas id="canvas"></canvas></a>
+<script type="text/javascript">
+<!-- init -->
+	window.onresize = function() {
+	    init.size.x = window.innerWidth;
+		init.size.y = window.innerHeight;
+		init.canvas.width = init.size.x;
+		init.canvas.height = init.size.y;
+		camera.display.x = init.size.x/2;
+		camera.display.y = init.size.y/2;
+	};
+	var init = {
+		canvas : new Object(),
+		ctx : new Object(),
+		size : new Object(),
+		nodeStrokeFlag : false,
+		canvasSetup : function() {
+			init.canvas = document.getElementById("canvas");
+      init.size.x = window.innerWidth;
+      init.size.y = window.innerHeight;
+			init.canvas.width = init.size.x;
+			init.canvas.height = init.size.y;
+			init.ctx = init.canvas.getContext("2d");
+		}
+	};
+	init.canvasSetup();
+
+<!-- init -->
+<!-- utilities -->
+
+	var dtr = function(d) {return d*Math.PI/180};
+	var ceiling = function(num) {return parseInt(num*10000)/10000};
+
+
+	//polarToRectangle
+	var polarToRectangle =  function(dX, dY, radius) {
+		var x = Math.sinE0(dtr(dX)) * Math.cosE0(dtr(dY)) * radius;
+		var y = Math.sinE0(dtr(dX)) * Math.sinE0(dtr(dY)) * radius;
+		var z = Math.cosE0(dtr(dX)) * radius;
+		return {x:y, y:z, z:x};
+	};
+	
+	//rectangleToPolar
+	var rectangleToPolar = function(x, y, z) {
+		if(x == 0)	var xD = 0.001;
+		else		var xD = x;
+		if(y == 0)	var yD = 0.001;
+		else		var yD = y;
+		if(z == 0)	var zD = 0.001;
+		else		var zD = z;
+		var radius = Math.sqrt(xD*xD + yD*yD + zD*zD);
+		var theta = Math.atan(zD / Math.sqrt(xD*xD + yD*yD));
+		var phi = Math.atan(yD / xD);
+		return {x:theta*(180/Math.PI), y:phi*(180/Math.PI), r:radius};
+	};
+
+
+	Math.sinE0 = function(val) {
+		if(val === 0) {
+			return Math.sin(0.000001)
+		} else {
+			return Math.sin(val);
+		};
+	};
+	Math.cosE0 = function(val) {
+		if(val === 0) {
+			return Math.cos(0.000001)
+		} else {
+			return Math.cos(val);
+		};
+	};
+	Math.getVector = function(startVertex, endVertex) {
+		return {
+			x : endVertex.affineOut.x - startVertex.affineOut.x,
+			y : endVertex.affineOut.y - startVertex.affineOut.y,
+			z : endVertex.affineOut.z - startVertex.affineOut.z
+		};
+	};
+	Math.getCross = function(vector1, vector2) {
+		return {
+			x : vector1.y*vector2.z - vector1.z*vector2.y,
+			y : vector1.z*vector2.x - vector1.x*vector2.z,
+			z : vector1.x*vector2.y - vector1.y*vector2.x
+		};
+	};
+	Math.getNormal = function(cross3d) {
+		var length = Math.sqrt(cross3d.x*cross3d.x + cross3d.y*cross3d.y + cross3d.z*cross3d.z);
+		return {
+			x : cross3d.x / length,
+			y : cross3d.y / length,
+			z : cross3d.z / length
+		};
+	};
+	var getNormal = function(vectorSet0, vectorSet1) {
+		var vector1 = Math.getVector(vectorSet0[0],vectorSet0[1]);
+		var vector2 = Math.getVector(vectorSet1[0],vectorSet1[1]);
+		var cross = Math.getCross(vector1, vector2);
+		var normal = Math.getNormal(cross);
+		return normal;
+	};
+	
+	Math.getDot = function(vector1, vector2) {
+		return vector1.x*vector2.x + vector1.y*vector2.y + vector1.z*vector2.z;
+	};
+
+
+	var closeValue = function(minTime, maxTime) {
+		this.flag = 0;
+		
+		this.progress = 0;
+		this.startTime = 0;
+		this.durationTime = 0;
+		
+		this.fromValue = 0;
+		this.toValue = 0;
+		this.smoothFlag = true;
+		
+		this.minValue = 0;
+		this.maxValue = 1;
+		this.minDuration = minTime;
+		this.maxDuration = maxTime;
+	};
+	closeValue.prototype = {
+		init : function() {
+			this.durationTime = this.minDuration + (this.maxDuration-this.minDuration) * Math.random();
+			this.startTime = Date.now();
+			this.progress = Math.min(1, ((Date.now()-this.startTime)/this.durationTime));
+			if(this.smoothFlag == true) {
+				this.fromValue = this.toValue;
+			} else {
+				this.fromValue = Math.random();
+			};
+			this.toValue = this.minValue + this.maxValue * Math.random();
+			this.flag = 1;
+			return this.fromValue + (this.toValue - this.fromValue) * this.progress;
+		},
+		update : function() {
+			this.progress = Math.min(1, ((Date.now()-this.startTime)/this.durationTime));
+			if(this.progress== 1) this.flag = 0;
+			return this.fromValue + (this.toValue - this.fromValue) * this.progress;
+		},
+		execution : function() {
+			if(this.flag == 0)		{return this.init()}
+			else if(this.flag == 1)	{return this.update()};
+		}
+	};
+
+<!-- utilities -->
+
+<!-- 3D pipeline -->
+
+var camera = {
+	focus : 750,
+	self : {
+		x : 0,
+		y : 0,
+		z : 100
+	},
+	rotate : {
+		x : 0,
+		y : 0,
+		z : 0
+	},
+	zoom : 1,
+	display : {
+		x : init.size.x/2,
+		y : init.size.y/2,
+		z : 0
+	},
+	clipPlane : {
+		near : 0,
+		far : 1000
+	},
+	enableCulling : false
+};
+
+
+var affine = {
+	world : {
+		size : function(p, size) {
+			return {
+				x :	p.x * size.x,
+				y : p.y * size.y,
+				z : p.z * size.z
+			}
+		},
+		rotate: {
+			x : function(p, rotate) {
+				return {
+					x : p.x,
+					y : p.y*Math.cosE0(dtr(rotate.x)) - p.z*Math.sinE0(dtr(rotate.x)),
+					z : p.y*Math.sinE0(dtr(rotate.x)) + p.z*Math.cosE0(dtr(rotate.x))
+				}
+			},
+			y : function(p, rotate) {
+				return {
+					x : p.x*Math.cosE0(dtr(rotate.y)) + p.z*Math.sinE0(dtr(rotate.y)),
+					y : p.y,
+					z : -p.x*Math.sinE0(dtr(rotate.y)) + p.z*Math.cosE0(dtr(rotate.y))
+				}
+			},
+			z : function(p, rotate) {
+				return {
+					x : p.x*Math.cosE0(dtr(rotate.z)) - p.y*Math.sinE0(dtr(rotate.z)),
+					y : p.x*Math.sinE0(dtr(rotate.z)) + p.y*Math.cosE0(dtr(rotate.z)),
+					z : p.z
+				}
+			}
+		},
+		position : function(p, position) {
+			return {
+				x : p.x + position.x,
+				y : p.y + position.y,
+				z : p.z + position.z
+			}
+		},
+	},
+	view : {
+		point : function(p) {
+			return {
+				x : p.x - camera.self.x,
+				y : p.y - camera.self.y,
+				z : p.z - camera.self.z
+			}
+		},
+		x : function(p) {
+			return {
+				x : p.x,
+				y : p.y*Math.cosE0(dtr(camera.rotate.x)) - p.z*Math.sinE0(dtr(camera.rotate.x)),
+				z : p.y*Math.sinE0(dtr(camera.rotate.x)) + p.z*Math.cosE0(dtr(camera.rotate.x))
+			}
+		},
+		y : function(p) {
+			return {
+				x : p.x*Math.cosE0(dtr(camera.rotate.y)) + p.z*Math.sinE0(dtr(camera.rotate.y)), 
+				y : p.y,
+				z : p.x*-Math.sinE0(dtr(camera.rotate.y)) + p.z*Math.cosE0(dtr(camera.rotate.y))
+			}
+		},
+		viewReset : function(p) {
+			return {
+				x : p.x - camera.self.x,
+				y : p.y - camera.self.y,
+				z : p.z - camera.self.z
+			}
+		},
+		righthandedReversal : function(p) {
+			return {
+				x : p.x,
+				y : -p.y,
+				z : p.z,
+			}
+		}
+	},
+	perspective : function(p) {
+		return {
+			x : p.x * ((camera.focus-camera.self.z) / ((camera.focus-camera.self.z) - p.z)) * camera.zoom,
+			y : p.y * ((camera.focus-camera.self.z) / ((camera.focus-camera.self.z) - p.z)) * camera.zoom,
+			z : p.z * ((camera.focus-camera.self.z) / ((camera.focus-camera.self.z) - p.z)) * camera.zoom,
+			p : ((camera.focus-camera.self.z) / ((camera.focus-camera.self.z) - p.z)) * camera.zoom,
+		}
+	},
+	display : function(p, display) {
+		return {
+			x : p.x + display.x,
+			y : p.y + display.y,
+			z : p.z + display.z,
+			p : p.p,
+		}
+	},
+	process : function(model, size, rotate, position,display) {
+		var ret = affine.world.size(model, size);
+		ret = affine.world.rotate.x(ret, rotate);
+		ret = affine.world.rotate.y(ret, rotate);
+		ret = affine.world.rotate.z(ret, rotate);
+		ret = affine.world.position(ret, position);
+		ret = affine.view.point(ret);
+		ret = affine.view.x(ret);
+		ret = affine.view.y(ret);
+		ret = affine.view.viewReset(ret);
+		ret = affine.view.righthandedReversal(ret);
+		ret = affine.perspective(ret);
+		ret = affine.display(ret, display);
+		return ret;
+	}
+};
+
+
+var light = {
+	enableLight : true,
+	ambientLight : {
+		color : {
+			r : 17.0,
+			g : 184.0,
+			b : 240.0
+		},
+		intensity : 0.0
+	},
+	directionalLight : {
+		degree : {
+			x : 0,
+			y : 0,
+			z : 1
+		},
+		color : {
+			r : 17.0,
+			g : 184.0,
+			b : 240.0
+		},
+		intensity : 1.0
+	}
+};
+
+
+var vertex3d = function(param) {
+	this.affineIn = new Object;
+	this.affineOut = new Object;
+	this.affineIn.vertex = ({x:0,y:0,z:0} || param.vertex);
+	this.affineIn.size = ({x:1,y:1,z:1} || param.size);
+	this.affineIn.rotate = ({x:0,y:0,z:0,} || param.rotate);
+	this.affineIn.position = ({x:0,y:0,z:0} || param.position);
+};
+vertex3d.prototype = {
+	vertexUpdate : function() {
+		this.affineOut = affine.process(
+			this.affineIn.vertex,
+			this.affineIn.size,
+			this.affineIn.rotate,
+			this.affineIn.position,
+			camera.display
+		);
+	}
+};
+
+
+var getFace = function(verts) {
+	return {
+		verts : [verts[0], verts[1], verts[2]],
+		normal : getNormal([verts[1],verts[0]], [verts[2],verts[0]]),
+		zIndex : verts[0].affineOut.p + verts[1].affineOut.p + verts[2].affineOut.p
+	};
+};
+
+
+var shader = {
+	shadeObject : new Array(),
+	chromaticAberration : {
+		flag : false,
+		r : {x:3, y:0},
+		g : {x:0, y:0},
+		b : {x:-3, y:0}
+	},
+	zSort : function() {
+		shader.shadeObject.sort(
+			function(a, b) {
+				if (a.face.zIndex < b.face.zIndex) return -1;
+				if (a.face.zIndex > b.face.zIndex) return 1;
+				return 0;
+			}
+		);
+	},
+	flatShader : {
+		directionalLighting : function() {
+			if(light.enableLight == true) {
+				for(var i=0; i<shader.shadeObject.length; i++) {
+					var lambertReflectance = Math.getDot(
+						{
+							x : ceiling(shader.shadeObject[i].face.normal.x),
+							y : ceiling(shader.shadeObject[i].face.normal.y),
+							z : ceiling(shader.shadeObject[i].face.normal.z)
+						},
+						{
+							x : light.directionalLight.degree.x,
+							y : light.directionalLight.degree.y,
+							z : light.directionalLight.degree.z
+						}
+					);
+					
+					shader.shadeObject[i].fillColor = {
+						r : (light.directionalLight.color.r*lambertReflectance) * ((shader.shadeObject[i].fillColor.r + light.ambientLight.color.r)/2) + light.ambientLight.intensity,
+						g : (light.directionalLight.color.g*lambertReflectance) * ((shader.shadeObject[i].fillColor.g + light.ambientLight.color.g)/2) + light.ambientLight.intensity,
+						b : (light.directionalLight.color.b*lambertReflectance) * ((shader.shadeObject[i].fillColor.b + light.ambientLight.color.b)/2) + light.ambientLight.intensity,
+						a : shader.shadeObject[i].fillColor.a
+					};
+					shader.shadeObject[i].strokeColor = {
+						r : (light.directionalLight.color.r*lambertReflectance) * ((shader.shadeObject[i].strokeColor.r + light.ambientLight.color.r)/2) + light.ambientLight.intensity,
+						g : (light.directionalLight.color.g*lambertReflectance) * ((shader.shadeObject[i].strokeColor.g + light.ambientLight.color.g)/2) + light.ambientLight.intensity,
+						b : (light.directionalLight.color.b*lambertReflectance) * ((shader.shadeObject[i].strokeColor.b + light.ambientLight.color.b)/2) + light.ambientLight.intensity,
+						a : shader.shadeObject[i].strokeColor.a
+					};
+				};
+			};
+		}
+	},
+	fillShade : function(augumentColor) {
+		init.ctx.fillStyle = "rgba("+
+			parseInt(augumentColor.r*255) +","+
+			parseInt(augumentColor.g*255) +","+
+			parseInt(augumentColor.b*255) +","+
+			augumentColor.a +")";
+		init.ctx.fill();
+	},
+	strokeShade : function(augumentColor) {
+		init.ctx.lineWidth = 0.3;
+		init.ctx.strokeStyle = "rgba("+
+			parseInt(augumentColor.r*255) +","+
+			parseInt(augumentColor.g*255) +","+
+			parseInt(augumentColor.b*255) +","+
+			augumentColor.a +")";
+		init.ctx.stroke();
+	},
+	shade : function(color) {
+		for(var i=0; i<shader.shadeObject.length; i++) {
+			if(shader.shadeObject[i].face.normal.z>0 && shader.shadeObject[i].face.zIndex<7&&shader.shadeObject[i].face.zIndex>0) {
+				init.ctx.beginPath();
+				for(var j=0; j<shader.shadeObject[i].face.verts.length; j++) {
+					if(j == 0) {
+						init.ctx.moveTo(shader.shadeObject[i].face.verts[j].affineOut.x, shader.shadeObject[i].face.verts[j].affineOut.y);
+					} else {
+						init.ctx.lineTo(shader.shadeObject[i].face.verts[j].affineOut.x, shader.shadeObject[i].face.verts[j].affineOut.y);
+					};
+				};
+				init.ctx.closePath();
+				switch(color) {
+					case "r":
+						if(shader.shadeObject[i].fill === true) shader.fillShade({r:shader.shadeObject[i].fillColor.r,g:0,b:0,a:shader.shadeObject[i].fillColor.a});
+						if(shader.shadeObject[i].stroke === true) shader.strokeShade({r:shader.shadeObject[i].strokeColor.r,g:0,b:0,a:shader.shadeObject[i].strokeColor.a});
+						break;
+					case "g":
+						if(shader.shadeObject[i].fill === true) shader.fillShade({r:0,g:shader.shadeObject[i].fillColor.g,b:0,a:shader.shadeObject[i].fillColor.a});
+						if(shader.shadeObject[i].stroke === true) shader.strokeShade({r:0,g:shader.shadeObject[i].strokeColor.g,b:0,a:shader.shadeObject[i].strokeColor.a});
+						break;
+					case "b":
+						if(shader.shadeObject[i].fill === true) shader.fillShade({r:0,g:0,b:shader.shadeObject[i].fillColor.b,a:shader.shadeObject[i].fillColor.a});
+						if(shader.shadeObject[i].stroke === true) shader.strokeShade({r:0,g:0,b:shader.shadeObject[i].strokeColor.b,a:shader.shadeObject[i].strokeColor.a});
+						break;
+					default:
+						if(shader.shadeObject[i].fill === true) shader.fillShade(shader.shadeObject[i].fillColor);
+						if(shader.shadeObject[i].stroke === true) shader.strokeShade(shader.shadeObject[i].strokeColor);
+						break;
+				};
+			};
+		};
+	},
+	execution : function() {
+		init.ctx.save();
+		if(shader.chromaticAberration.flag === false) {
+			init.ctx.globalCompositeOperation = "source-over";
+			shader.shade();
+		} else {
+			init.ctx.globalCompositeOperation = "lighter";
+			init.ctx.translate(shader.chromaticAberration.r.x, shader.chromaticAberration.r.y);
+			shader.shade("r");
+			init.ctx.translate(-shader.chromaticAberration.r.x, -shader.chromaticAberration.r.y);
+			init.ctx.translate(shader.chromaticAberration.g.x, shader.chromaticAberration.g.y);
+			shader.shade("g");
+			init.ctx.translate(-shader.chromaticAberration.g.x, -shader.chromaticAberration.g.y);
+			init.ctx.translate(shader.chromaticAberration.b.x, shader.chromaticAberration.b.y);
+			shader.shade("b");
+			init.ctx.translate(-shader.chromaticAberration.b.x, -shader.chromaticAberration.b.y);
+		};
+		init.ctx.restore();
+	}
+};
+
+<!-- 3D pipeline -->
+
+<!-- model -->
+
+var isoscelesRightTriangle = function(argument) {
+	// base object
+	this.vertices = new Object();
+	this.shadeObjects = new Object();
+	
+	// model parameter
+	this.shade = argument.shade;
+	this.fill = argument.fill;
+	this.stroke = argument.stroke;
+	this.fillColor = argument.fillColor;
+	this.strokeColor = argument.strokeColor;
+	this.size = argument.size;
+	this.position = argument.position;
+	this.rotate = argument.rotate;
+	
+	this.uniqueFlag001 = false; 
+	
+	//model data
+	this.vertexData = {
+		v0 : {x:1, y:1, z:1},
+		v1 : {x:1, y:-1, z:1},
+		v2 : {x:-1, y:-1, z:1},
+		v3 : {x:1, y:-1, z:-1}
+	};
+	this.indexData = {
+		f0 : ["v0", "v1", "v2"],
+		f1 : ["v0", "v3", "v1"],
+		f2 : ["v0", "v2", "v3"],
+		f3 : ["v1", "v3", "v2"]
+	};
+	// vertices init
+	for(i in this.vertexData) {
+		this.vertices[i] = new vertex3d({
+			position : this.position,
+			vertex : {x:this.vertexData[i].x*this.size, y:this.vertexData[i].y*this.size, z:this.vertexData[i].z*this.size}
+		});
+		this.vertices[i].vertexUpdate();
+	};
+	// shadeObjects init
+	for(var i in this.indexData) {
+		this.shadeObjects[i] = new Object;
+		this.shadeObjects[i].face = new Object;
+		this.shadeObjects[i].fill = this.fill;
+		this.shadeObjects[i].stroke = this.stroke;
+		this.shadeObjects[i].fillColor = this.fillColor;
+		this.shadeObjects[i].strokeColor = this.strokeColor;
+	};
+};
+isoscelesRightTriangle.prototype = {
+	controll : function(argument) {
+		this.shade = argument.shade;
+		if(this.shade === true) {
+			this.fill = argument.fill;
+			this.stroke = argument.stroke;
+
+			if(argument.size) {
+				this.size = argument.size;
+			};
+			if(argument.fillColor) {
+				this.fillColor = {
+					r : argument.fillColor.r,
+					g : argument.fillColor.g,
+					b : argument.fillColor.b,
+					a : argument.fillColor.a
+				};
+			};
+			if(argument.strokeColor) {
+				this.strokeColor = {
+					r : argument.strokeColor.r,
+					g : argument.strokeColor.g,
+					b : argument.strokeColor.b,
+					a : argument.strokeColor.a
+				};
+			};
+			if(argument.position) {
+				this.position = {
+					x : argument.position.x,
+					y : argument.position.y,
+					z : argument.position.z
+				};
+			};
+			if(argument.rotate) { 
+				this.rotate = {
+					x : argument.rotate.x,
+					y : argument.rotate.y,
+					z : argument.rotate.z
+				};
+			};
+		};
+	},
+	update : function() {
+		if(this.shade === true) {
+			for(var i in this.vertexData) {
+				if(this.uniqueFlag001 == false) {
+					this.vertices[i].affineIn.vertex = {
+						x : this.vertexData[i].x*this.size,
+						y : this.vertexData[i].y*this.size,
+						z : this.vertexData[i].z*this.size,
+					};
+				} else {
+					this.vertices[i].affineIn.vertex = {
+						x : this.vertexData[i].x*this.size * (0.8*Math.random()+0.5),
+						y : this.vertexData[i].y*this.size * (0.8*Math.random()+0.5),
+						z : this.vertexData[i].z*this.size * (0.8*Math.random()+0.5),
+					};
+				};
+				this.vertices[i].affineIn.position = {
+					x : this.position.x,
+					y : this.position.y,
+					z : this.position.z
+				};
+				this.vertices[i].affineIn.rotate = {
+					x : this.rotate.x,
+					y : this.rotate.y,
+					z : this.rotate.z
+				};
+				this.vertices[i].vertexUpdate();
+			};
+			for(var i in this.indexData) {
+				this.shadeObjects[i].face = getFace([this.vertices[this.indexData[i][0]], this.vertices[this.indexData[i][1]], this.vertices[this.indexData[i][2]]]);
+				this.shadeObjects[i].fill = this.fill;
+				this.shadeObjects[i].stroke = this.stroke;
+				this.shadeObjects[i].fillColor = this.fillColor;
+				this.shadeObjects[i].strokeColor = this.strokeColor;
+			};
+		};
+	},
+	addShader : function() {
+		if(this.shade === true) {
+			for(var i in this.shadeObjects) {
+				shader.shadeObject.push(this.shadeObjects[i]);
+			};
+		};
+	}
+};
+
+<!-- model -->
+
+<!-- object -->
+
+var DEFIINE_instanceNum = 2100;
+var instanceObject = new Array();
+var objectInit = function() {
+	for(var i=0; i<DEFIINE_instanceNum; i++) {
+		instanceObject[i] = new isoscelesRightTriangle({
+			shade : false,
+			fill : false,
+			stroke : false,
+			color: {r:0.0, g:0.0, b:0.0, a:0.0},
+			fillColor: {r:0.0, g:0.0, b:0.0, a:0.0},
+			strokeColor: {r:0.0, g:0.0, b:0.0, a:0.0},
+			size: 0,
+			position: {x:2000*Math.random()-1000, y:2000*Math.random()-1000, z:2000*Math.random()-1000},
+			rotate: {x:720*Math.random()-360, y:720*Math.random()-360, z:720*Math.random()-360}
+		});
+	};
+};
+var objectUpdate = function() {
+	for(var i=0; i<instanceObject.length; i++){
+		if(instanceObject[i]) {
+			instanceObject[i].controll({
+				shade : controll.value[i].shade,
+				fill : controll.value[i].fill,
+				stroke : controll.value[i].stroke,
+				color: controll.value[i].color,
+				fillColor : controll.value[i].fillColor,
+				strokeColor : controll.value[i].strokeColor,
+				size: controll.value[i].size,
+				position: controll.value[i].position,
+				rotate: controll.value[i].rotate
+			});
+			instanceObject[i].update();
+			instanceObject[i].addShader();
+		};
+	};
+};
+
+<!-- object -->
+
+<!-- motion -->
+
+var freemap_disconnected = function() {
+	this.returnData = new Array();
+	for(var i=0; i<DEFIINE_instanceNum; i++) {
+		this.returnData[i] = {
+			shade : false,
+			fill : false,
+			stroke : false,
+			fillColor: {r:1.0, g:1.0, b:1.0, a:1.0},
+			strokeColor: {r:1.0, g:1.0, b:1.0, a:1.0},
+			size: 0,
+			position: {x:Math.random()*1000-500, y:Math.random()*1000-500, z:Math.random()*1000-500},
+			rotate: {x:Math.random()*1000-500, y:Math.random()*1000-500, z:Math.random()*1000-500}
+		};
+	};
+	
+	return this.returnData;
+};
+
+
+var freemap_random = function() {
+	this.returnData = new Array();
+	for(var i=0; i<DEFIINE_instanceNum; i++) {
+		this.returnData[i] = {
+			shade : false,
+			fill : false,
+			stroke : false,
+			fillColor: {r:1.0, g:1.0, b:1.0, a:1.0},
+			strokeColor: {r:1.0, g:1.0, b:1.0, a:1.0},
+			size: Math.random()*2,
+			position: {x:Math.random()*1500-750, y:Math.random()*1500-750, z:Math.random()*1500-750},
+			rotate: {x:Math.random()*720-360, y:Math.random()*720-360, z:Math.random()*720-360}
+		};
+	};
+	for(var i=0; i<100; i++) {
+		this.returnData[i].shade = true;
+		this.returnData[i].fill = true;
+	};
+
+	return this.returnData;
+};
+
+var fontmap_small = function() {
+	this.returnData = new Array();
+	this.col = 80;
+	this.row = 280;
+	this.cellLength = 22;
+	this.cellSpace = 22;
+	for(var i=0; i<DEFIINE_instanceNum; i++) {
+		this.returnData[i] = {
+			shade : false,
+			fill : false,
+			stroke : false,
+			fillColor: {r:1.0, g:1.0, b:1.0, a:1.0},
+			strokeColor: {r:1.0, g:1.0, b:1.0, a:1.0},
+			size: 0,
+			position: {x:0, y:0, z:0},
+			rotate: {x:0, y:0, z:0}
+		};
+	};
+	this.fontMapData = [
+			{//B
+			cellLength : this.cellLength,
+			cellSpace : this.cellSpace,
+			center : {x:this.col*-4, y:this.row*0.15, z:0}, 
+			map : [[0,4,0,0,0],[0,3,3,4,0],[0,5,3,1,0],[0,5,2,1,0],[0,3,1,0,0]],  
+			mapDataNum : 5*5*2,
+			colUnit : 5*2
+		},
+		{//A
+			cellLength : this.cellLength,
+			cellSpace : this.cellSpace,
+			center : {x:this.col*-3, y:this.row*0.15, z:0}, 
+			map : [[0,0,0,2,0],[0,0,2,5,0],[0,2,1,1,0],[0,1,3,5,0],[0,1,0,1,0]],  
+			mapDataNum : 5*5*2,
+			colUnit : 5*2
+		},
+		{//M
+			cellLength : this.cellLength,
+			cellSpace : this.cellSpace,
+			center : {x:this.col*-2, y:this.row*0.15, z:0}, 
+			map : [[0,4,0,0,0],[0,5,4,4,0],[0,5,3,3,4],[0,3,0,0,3],[0,3,0,0,0]],  
+			mapDataNum : 5*5*2,
+			colUnit : 5*2
+		},
+		{//G
+			cellLength : this.cellLength,
+			cellSpace : this.cellSpace,
+			center : {x:this.col*-0.5, y:this.row*0.15, z:0}, 
+			map : [[0,0,2,0,0],[0,2,1,0,0],[0,1,0,4,0],[0,3,2,1,0],[0,0,3,0,0]],  
+			mapDataNum : 5*5*2,
+			colUnit : 5*2
+		},
+		{//A
+			cellLength : this.cellLength,
+			cellSpace : this.cellSpace,
+			center : {x:this.col*0.5, y:this.row*0.15, z:0}, 
+			map : [[0,0,0,2,0],[0,0,2,5,0],[0,2,1,1,0],[0,1,3,5,0],[0,1,0,1,0]],  
+			mapDataNum : 5*5*2,
+			colUnit : 5*2
+		}
+		,{//M
+			cellLength : this.cellLength,
+			cellSpace : this.cellSpace,
+			center : {x:this.col*1.5, y:this.row*0.15, z:0}, 
+			map : [[0,4,0,0,0],[0,5,4,4,0],[0,5,3,3,4],[0,3,0,0,3],[0,3,0,0,0]],  
+			mapDataNum : 5*5*2,
+			colUnit : 5*2
+		}
+		,{//I
+			cellLength : this.cellLength,
+			cellSpace : this.cellSpace,
+			center : {x:this.col*2.5, y:this.row*0.15, z:0}, 
+			map : [[0,0,2,0,0],[0,0,2,0,0],[0,0,5,0,0],[0,0,5,0,0],[0,0,1,0,0]],  
+			mapDataNum : 5*5*2,
+			colUnit : 5*2
+		}
+		,{//N
+			cellLength : this.cellLength,
+			cellSpace : this.cellSpace,
+			center : {x:this.col*3.5, y:this.row*0.15, z:0}, 
+			map : [[0,0,0,4,0],[0,4,0,5,0],[0,5,4,4,0],[0,5,3,5,0],[0,1,0,3,0]],  
+			mapDataNum : 5*5*2,
+			colUnit : 5*2
+		}
+		,{//G
+			cellLength : this.cellLength,
+			cellSpace : this.cellSpace,
+			center : {x:this.col*4.5, y:this.row*0.15, z:0}, 
+			map : [[0,0,2,0,0],[0,2,1,0,0],[0,1,0,4,0],[0,3,2,1,0],[0,0,3,0,0]],  
+			mapDataNum : 5*5*2,
+			colUnit : 5*2
+		}
+	];
+	var lastMap = 0;
+	for(var i=0; i<this.fontMapData.length; i++) {
+		for(var j=0; j<this.fontMapData[i].map.length; j++) {
+			for(var k=0; k<this.fontMapData[i].map[j].length; k++) {
+				switch(this.fontMapData[i].map[j][k]) {
+					case 0:
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].shade = false;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].fill = false;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].stroke = false;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].size = 0;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].position = {
+							x : 0,
+							y : 0,
+							z : 0
+						};
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].rotate = {x:0, y:0, z:0};
+						break;
+					case 1:
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].shade = true;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].fill = true;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].stroke = false;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].size = this.fontMapData[i].cellLength/2;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].position = {
+							x : (parseInt(k)*this.fontMapData[i].cellSpace - this.fontMapData[i].map[j].length*this.fontMapData[i].cellSpace/2) + this.fontMapData[i].center.x,
+							y : (-parseInt(j)*this.fontMapData[i].cellSpace - -this.fontMapData[i].map.length*this.fontMapData[i].cellSpace/2) + this.fontMapData[i].center.y,
+							z : this.fontMapData[i].center.z
+						};
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].rotate = {x:0, y:0, z:180};
+						break;
+					case 2:
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].shade = true;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].fill = true;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].stroke = false;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].size = this.fontMapData[i].cellLength/2;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].position = {
+							x : (parseInt(k)*this.fontMapData[i].cellSpace - this.fontMapData[i].map[j].length*this.fontMapData[i].cellSpace/2) + this.fontMapData[i].center.x,
+							y : (-parseInt(j)*this.fontMapData[i].cellSpace - -this.fontMapData[i].map.length*this.fontMapData[i].cellSpace/2) + this.fontMapData[i].center.y,
+							z : this.fontMapData[i].center.z
+						};
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].rotate = {x:0, y:0, z:0};
+						break;
+					case 3:
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].shade = true;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].fill = true;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].stroke = false;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].size = this.fontMapData[i].cellLength/2;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].position = {
+							x : (parseInt(k)*this.fontMapData[i].cellSpace - this.fontMapData[i].map[j].length*this.fontMapData[i].cellSpace/2) + this.fontMapData[i].center.x,
+							y : (-parseInt(j)*this.fontMapData[i].cellSpace - -this.fontMapData[i].map.length*this.fontMapData[i].cellSpace/2) + this.fontMapData[i].center.y,
+							z : this.fontMapData[i].center.z
+						};
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].rotate = {x:0, y:0, z:90};
+						break;
+					case 4:
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].shade = true;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].fill = true;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].stroke = false;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].size = this.fontMapData[i].cellLength/2;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].position = {
+							x : (parseInt(k)*this.fontMapData[i].cellSpace - this.fontMapData[i].map[j].length*this.fontMapData[i].cellSpace/2) + this.fontMapData[i].center.x,
+							y : (-parseInt(j)*this.fontMapData[i].cellSpace - -this.fontMapData[i].map.length*this.fontMapData[i].cellSpace/2) + this.fontMapData[i].center.y,
+							z : this.fontMapData[i].center.z
+						};
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].rotate = {x:0, y:0, z:270};
+						break;
+					case 5:
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].shade = true;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].fill = true;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].stroke = false;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].size = this.fontMapData[i].cellLength/2;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].position = {
+							x : (parseInt(k)*this.fontMapData[i].cellSpace - this.fontMapData[i].map[j].length*this.fontMapData[i].cellSpace/2) + this.fontMapData[i].center.x,
+							y : (-parseInt(j)*this.fontMapData[i].cellSpace - -this.fontMapData[i].map.length*this.fontMapData[i].cellSpace/2) + this.fontMapData[i].center.y,
+							z : this.fontMapData[i].center.z
+						};
+						this.returnData[j*this.fontMapData[i].colUnit+k*2 + lastMap].rotate = {x:0, y:0, z:180};
+						
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].shade = true;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].fill = true;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].stroke = false;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].size = this.fontMapData[i].cellLength/2;
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].position = {
+							x : (parseInt(k)*this.fontMapData[i].cellSpace - this.fontMapData[i].map[j].length*this.fontMapData[i].cellSpace/2) + this.fontMapData[i].center.x,
+							y : (-parseInt(j)*this.fontMapData[i].cellSpace - -this.fontMapData[i].map.length*this.fontMapData[i].cellSpace/2) + this.fontMapData[i].center.y,
+							z : this.fontMapData[i].center.z
+						};
+						this.returnData[j*this.fontMapData[i].colUnit+k*2+1 + lastMap].rotate = {x:0, y:0, z:0};
+						break;
+				};
+			};
+		};
+		lastMap += this.fontMapData[i].mapDataNum;
+	};
+	return this.returnData;
+};
+
+
+
+var dynamic_001 = {// bold motion
+	value : new Array(),
+	uniqueValue : {},
+	uniqueCloseValue : new closeValue(50,500),
+	init : function() {
+		for(var i=0; i<DEFIINE_instanceNum; i++) {
+			dynamic_001.value[i] = {
+				shade : null,
+				fill : null,
+				stroke : null,
+				size: null,
+				position: null,
+				rotate: null
+			};
+		};
+	},
+	iteration : function() {
+		for(var i=0; i<DEFIINE_instanceNum; i++) {
+			dynamic_001.value[i].size = 30*Math.random();
+		};
+		return dynamic_001.value;
+	}
+};
+dynamic_001.init();
+
+
+var dynamic_002 = {// light motion
+	value : new Array(),
+	uniqueValue : {},
+	uniqueCloseValue : new closeValue(50,500),
+	init : function() {
+		for(var i=0; i<DEFIINE_instanceNum; i++) {
+			dynamic_002.value[i] = {
+				shade : null,
+				fill : null,
+				stroke : null,
+				size: null,
+				position: null,
+				rotate: null
+			};
+		};
+	},
+	iteration : function() {
+		for(var i=0; i<DEFIINE_instanceNum; i++) {
+			dynamic_002.value[i].size = Math.random()*8;
+		};
+		return dynamic_002.value;
+	}
+};
+dynamic_002.init();
+
+
+var dynamic_003 = {// sphere motion
+	value : new Array(),
+	uniqueValue : {
+		masterDegree : {theta:0, phi:0},
+		masterControllDegree : {theta:0, phi:0},
+		masterRadius : 0,
+		masterControllRadius : 200,
+		cellDegree : new Array(),
+	},
+	uniqueCloseValue : new closeValue(50,500),
+	init : function() {
+		dynamic_003.masterControllRadius = Math.random()*200 + 100;
+		dynamic_003.masterControllDegree = {theta:0, phi:Math.random()*10-5};
+		for(var i=0; i<DEFIINE_instanceNum; i++) {
+			dynamic_003.value[i] = {
+				shade : null,
+				fill : null,
+				stroke : null,
+				size: null,
+				position: null,
+				rotate: null
+			};
+			dynamic_003.uniqueValue.cellDegree[i] = {
+				theta : 360 * Math.random(),
+				phi : 360 * Math.random()
+			};
+		};
+	},
+	randomInit : function() {
+		dynamic_003.masterControllRadius = Math.random()*150 + 150;
+		dynamic_003.masterControllDegree = {theta:0, phi:Math.random()*20-10};
+		for(var i=0; i<DEFIINE_instanceNum; i++) {
+			dynamic_003.uniqueValue.cellDegree[i] = {
+				theta : 360 * Math.random(),
+				phi : 360 * Math.random()
+			};
+		}
+	},
+	iteration : function() {
+		if(Math.random() < 0.03) dynamic_003.randomInit();
+		dynamic_003.uniqueValue.masterRadius = dynamic_003.masterControllRadius+50*Math.random();
+		dynamic_003.uniqueValue.masterDegree.phi += dynamic_003.masterControllDegree.phi;
+		for(var i=0; i<DEFIINE_instanceNum; i++) {
+                var ra = polarToRectangle(
+                    dynamic_003.uniqueValue.cellDegree[i].theta + dynamic_003.uniqueValue.masterDegree.theta,
+                    dynamic_003.uniqueValue.cellDegree[i].phi + dynamic_003.uniqueValue.masterDegree.phi,
+                    dynamic_003.uniqueValue.masterRadius
+                );
+                dynamic_003.value[i].position = {
+                    x : ra.x,
+                    y : ra.y,
+                    z : ra.z
+                };
+                dynamic_003.value[i].size = Math.random()*5;
+        };
+		return dynamic_003.value;
+	}
+};
+dynamic_003.init();
+
+
+var dynamic_004 = {// rotate motion
+	value : new Array(),
+	uniqueValue : {
+		closeValue : new Array()
+	},
+	uniqueCloseValue : new closeValue(50,500),
+	init : function() {
+		for(var i=0; i<DEFIINE_instanceNum; i++) {
+			dynamic_004.uniqueValue.closeValue[i] = new Object();
+			dynamic_004.uniqueValue.closeValue[i].x = new closeValue(200,500);
+			dynamic_004.uniqueValue.closeValue[i].y = new closeValue(200,500);
+			dynamic_004.uniqueValue.closeValue[i].z = new closeValue(200,500);
+			dynamic_004.value[i] = {
+				shade : null,
+				fill : null,
+				stroke : null,
+				size: null,
+				position: null,
+				rotate: {
+					x : 0,
+					y : 0,
+					z :0
+				}
+			};
+		};
+	},
+	iteration : function() {
+		for(var i=0; i<DEFIINE_instanceNum; i++) {
+			dynamic_004.value[i].rotate.x = dynamic_004.uniqueValue.closeValue[0].x.execution() * 720;
+			dynamic_004.value[i].rotate.y = dynamic_004.uniqueValue.closeValue[0].y.execution() * 720;
+			dynamic_004.value[i].rotate.z = dynamic_004.uniqueValue.closeValue[0].z.execution() * 720;
+			dynamic_004.value[i].size = 5;
+		};
+		return dynamic_004.value;
+	}
+};
+dynamic_004.init();
+
+<!-- motion -->
+
+<!-- effects -->
+
+var backgroundController = {
+	color : new String,
+	init : function() {
+		backgroundController.color = "rgba(0, 0, 0, 1)";
+	},
+	draw : function() {
+		init.ctx.fillStyle = backgroundController.color;
+		init.ctx.fillRect(0, 0, init.size.x, init.size.y);
+	}
+};
+backgroundController.init();
+
+
+var nodeStroke = {
+	vertsArray : new Array(),
+	color : new String(),
+	init : function() {
+		nodeStroke.color = {
+			r : 1.0,
+			g : 1.0,
+			b : 1.0,
+			a : 0.15
+		};
+	},
+	iteration : function() {
+		nodeStroke.vertsArray = [];
+		if(shader.chromaticAberration.flag === false) {
+			init.ctx.globalCompositeOperation = "source-over";
+			for(var i=0; i<shader.shadeObject.length; i++) {
+				for(var j=0; j<shader.shadeObject[i].face.verts.length; j++) {
+					nodeStroke.vertsArray.push(shader.shadeObject[i].face.verts[j].affineOut);
+				};
+			};
+			init.ctx.beginPath();
+			for(var i=0; i<nodeStroke.vertsArray.length; i++) {
+				if(Math.random() > 0.75) {
+					init.ctx.lineTo(
+						nodeStroke.vertsArray[i].x,
+						nodeStroke.vertsArray[i].y
+					);
+				};
+			};
+			init.ctx.closePath();
+					
+			init.ctx.strokeStyle = "rgba(" + 
+				nodeStroke.color.r*255 + "," + 
+				nodeStroke.color.g*255 + "," + 
+				nodeStroke.color.b*255 + "," +
+				nodeStroke.color.a
+			+ ")";
+			init.ctx.stroke();
+		} else {
+			init.ctx.globalCompositeOperation = "lighter";
+			init.ctx.translate(shader.chromaticAberration.r.x,shader.chromaticAberration.r.y);
+			for(var i=0; i<shader.shadeObject.length; i++) {
+				for(var j=0; j<shader.shadeObject[i].face.verts.length; j++) {
+					nodeStroke.vertsArray.push(shader.shadeObject[i].face.verts[j].affineOut);
+				};
+			};
+			init.ctx.beginPath();
+			for(var i=0; i<nodeStroke.vertsArray.length; i++) {
+				init.ctx.lineTo(
+					nodeStroke.vertsArray[i].x,
+					nodeStroke.vertsArray[i].y
+				);
+			};
+			init.ctx.closePath();
+					
+			init.ctx.strokeStyle = "rgba(" + 
+				nodeStroke.color.r*255 + "," + 
+				0 + "," + 
+				0 + "," +
+				nodeStroke.color.a/1
+			+ ")";
+			init.ctx.stroke();
+			init.ctx.translate(-shader.chromaticAberration.r.x,-shader.chromaticAberration.r.y);
+			
+			
+			init.ctx.translate(shader.chromaticAberration.g.x,shader.chromaticAberration.g.y);
+			for(var i=0; i<shader.shadeObject.length; i++) {
+				for(var j=0; j<shader.shadeObject[i].face.verts.length; j++) {
+					nodeStroke.vertsArray.push(shader.shadeObject[i].face.verts[j].affineOut);
+				};
+			};
+			init.ctx.beginPath();
+			for(var i=0; i<nodeStroke.vertsArray.length; i++) {
+				init.ctx.lineTo(
+					nodeStroke.vertsArray[i].x,
+					nodeStroke.vertsArray[i].y
+				);
+			};
+			init.ctx.closePath();
+			init.ctx.strokeStyle = "rgba(" + 
+				0 + "," + 
+				nodeStroke.color.g*255 + "," + 
+				0 + "," +
+				nodeStroke.color.a/1.5
+			+ ")";
+			init.ctx.stroke();
+			init.ctx.translate(-shader.chromaticAberration.g.x,-shader.chromaticAberration.g.y);
+			
+			
+			init.ctx.translate(shader.chromaticAberration.b.x,shader.chromaticAberration.b.y);
+			for(var i=0; i<shader.shadeObject.length; i++) {
+				for(var j=0; j<shader.shadeObject[i].face.verts.length; j++) {
+					nodeStroke.vertsArray.push(shader.shadeObject[i].face.verts[j].affineOut);
+				};
+			};
+			init.ctx.beginPath();
+			for(var i=0; i<nodeStroke.vertsArray.length; i++) {
+				init.ctx.lineTo(
+					nodeStroke.vertsArray[i].x,
+					nodeStroke.vertsArray[i].y
+				);
+			};
+			init.ctx.closePath();
+			init.ctx.strokeStyle = "rgba(" + 
+				0 + "," + 
+				0 + "," + 
+				nodeStroke.color.b*255 + "," +
+				nodeStroke.color.a/2
+			+ ")";
+			init.ctx.stroke();
+			init.ctx.translate(-shader.chromaticAberration.b.x,-shader.chromaticAberration.b.y);
+			
+		};
+	}
+};
+nodeStroke.init();
+
+
+	var effectCv = new closeValue(300, 500);
+	var effectTimer = function() {
+		var effectVal = effectCv.execution();
+		if(effectVal > 0.7) {
+			shader.chromaticAberration.flag = true;
+			shader.chromaticAberration.r.x = (effectVal-0.75)*4 * 15;
+			shader.chromaticAberration.g.x = (effectVal-0.75)*4 * 0;
+			shader.chromaticAberration.b.x = (effectVal-0.75)*4 * -15;
+		} else if(effectVal < 0.2) {
+		} else {
+			shader.chromaticAberration.flag = false;
+		};
+	};
+
+
+
+	var mousePosX = 0;
+	var mousePosY = 0;
+	document.body.onmousemove = function(e) {
+		mousePosX = (e.pageX-init.size.x)/init.size.x * 30;
+		mousePosY = (e.pageY-init.size.y)/init.size.y * 30;
+	};
+	var zoomCv = new closeValue(300, 1000);
+	var randomSelfCv = new closeValue(300, 400);
+	var rotateCv = new closeValue(300, 500);
+	var memRotateX = Math.random()*100;
+	var memRotateY = Math.random()*100;
+	rotateCv.smoothFlag = false;
+	var cameraTimer = function() {
+		var zoomVal = zoomCv.execution();
+		if(zoomVal > 0.8) {
+			camera.zoom = 1.5
+		} else if(zoomVal < 0.2) {
+			camera.zoom = 2.2;
+		} else {
+			camera.zoom = 1;
+		};
+		
+		var randomSelfVal = randomSelfCv.execution();
+		if(randomSelfCv > 0.8) {
+			camera.self.x = Math.random()*10-5;
+			camera.self.y = Math.random()*10-5;
+			camera.self.z = Math.random()*10-5;
+		};
+		memRotateX += 8;
+		memRotateY += 14;
+		var rotateVal = rotateCv.execution();
+		if(rotateVal > 0.8) {
+			camera.rotate.x = memRotateX;
+			camera.rotate.y = memRotateY;
+		} else {
+			camera.rotate.x = 0;
+			camera.rotate.y = 0;
+		};
+	};
+
+<!-- effects -->
+
+<!-- controller -->
+
+var controll = {
+	value : new Array(),
+	startValue : new Array(),
+	endValue : new Array(),
+	startFlag : new Array(),
+	startTime : new Array(),
+	durationTime : new Array(),
+	progress : new Array(),
+	processArray : new Array(),
+	staticFlag : 0,
+	staticMap : {
+		freemap_disconnected : freemap_disconnected(),
+		freemap_random : freemap_random(),
+		fontmap_small : fontmap_small()
+	},
+	dynamicFlag : 0,
+	dynamicMap : new Object,
+	init : function() {
+		for(var i=0; i<DEFIINE_instanceNum; i++) {
+			controll.value[i] = {
+				shade : false,
+				fill : false,
+				stroke : false,
+				fillColor: {r:0, g:0, b:0, a:0},
+				strokeColor: {r:0, g:0, b:0, a:0},
+				size: 0,
+				position: {x:Math.random()*1000-500, y:Math.random()*1000-500, z:Math.random()*1000-500},
+				rotate: {x:Math.random()*1000-500, y:Math.random()*1000-500, z:Math.random()*1000-500}
+			};
+			controll.startValue[i] = new Object();
+			controll.endValue[i] = new Object();
+			controll.startFlag[i] = false;
+			controll.startTime[i] = 0;
+			controll.progress[i] = 0;
+			controll.processArray[i] = null;
+		};
+	},
+	startTransform : function(num, durationTime) {
+		controll.startFlag[num] = true;
+		controll.durationTime[num] = durationTime;
+		controll.processArray[num] = controll.staticIteration;
+	},
+	staticIteration : function(num) {// staticIteration
+		switch(controll.staticFlag) {
+			case "freemap_disconnected":
+				controll.endValue[num] = controll.staticMap.freemap_disconnected[num];
+				break;
+			case "freemap_random":
+				controll.endValue[num] = controll.staticMap.freemap_random[num];
+				break;
+			case "fontmap_small":
+				controll.endValue[num] = controll.staticMap.fontmap_small[num];
+				break;
+		};
+		switch(controll.endValue[num].shade) {
+			case true:
+				if(controll.startFlag[num] == true) {
+					controll.startFlag[num] = false;
+					controll.startTime[num] = Date.now();
+					controll.startValue[num] = controll.value[num];
+					controll.value[num].shade = controll.endValue[num].shade;
+					
+					controll.value[num].fill = controll.endValue[num].fill;
+					controll.value[num].stroke = controll.endValue[num].stroke;
+				};
+				controll.progress[num] = Math.min(1, (Date.now()-controll.startTime[num])/controll.durationTime[num]);
+				
+				if(controll.endValue[num].fillColor != null) {
+					controll.value[num].fillColor.r = controll.startValue[num].fillColor.r + (controll.endValue[num].fillColor.r - controll.startValue[num].fillColor.r) * controll.progress[num];
+					controll.value[num].fillColor.g = controll.startValue[num].fillColor.g + (controll.endValue[num].fillColor.g - controll.startValue[num].fillColor.g) * controll.progress[num];
+					controll.value[num].fillColor.b = controll.startValue[num].fillColor.b + (controll.endValue[num].fillColor.b - controll.startValue[num].fillColor.b) * controll.progress[num];
+					controll.value[num].fillColor.a = controll.startValue[num].fillColor.a + (controll.endValue[num].fillColor.a - controll.startValue[num].fillColor.a) * controll.progress[num];
+				};
+				if(controll.endValue[num].strokeColor != null) {
+					controll.value[num].strokeColor.r = controll.startValue[num].strokeColor.r + (controll.endValue[num].strokeColor.r - controll.startValue[num].strokeColor.r) * controll.progress[num];
+					controll.value[num].strokeColor.g = controll.startValue[num].strokeColor.g + (controll.endValue[num].strokeColor.g - controll.startValue[num].strokeColor.g) * controll.progress[num];
+					controll.value[num].strokeColor.b = controll.startValue[num].strokeColor.b + (controll.endValue[num].strokeColor.b - controll.startValue[num].strokeColor.b) * controll.progress[num];
+					controll.value[num].strokeColor.a = controll.startValue[num].strokeColor.a + (controll.endValue[num].strokeColor.a - controll.startValue[num].strokeColor.a) * controll.progress[num];
+				};
+				if(controll.endValue[num].size) {
+					controll.value[num].size = controll.startValue[num].size + (controll.endValue[num].size - controll.startValue[num].size) * controll.progress[num];
+				};
+				if(controll.endValue[num].position) {
+					controll.value[num].position.x = controll.startValue[num].position.x + (controll.endValue[num].position.x - controll.startValue[num].position.x) * controll.progress[num];
+					controll.value[num].position.y = controll.startValue[num].position.y + (controll.endValue[num].position.y - controll.startValue[num].position.y) * controll.progress[num];
+					controll.value[num].position.z = controll.startValue[num].position.z + (controll.endValue[num].position.z - controll.startValue[num].position.z) * controll.progress[num];
+				};
+				if(controll.endValue[num].rotate) {
+					controll.value[num].rotate.x = controll.startValue[num].rotate.x + (controll.endValue[num].rotate.x - controll.startValue[num].rotate.x) * controll.progress[num];
+					controll.value[num].rotate.y = controll.startValue[num].rotate.y + (controll.endValue[num].rotate.y - controll.startValue[num].rotate.y) * controll.progress[num];
+					controll.value[num].rotate.z = controll.startValue[num].rotate.z + (controll.endValue[num].rotate.z - controll.startValue[num].rotate.z) * controll.progress[num];
+				};
+				
+				if(controll.progress[num] == 1) {
+					controll.processArray[num] = null;
+				};
+				break;
+			case false:
+				if(controll.startFlag[num] == true) {
+					controll.startFlag[num] = false;
+					controll.startTime[num] = Date.now();
+					controll.startValue[num] = controll.value[num];
+				};
+				controll.progress[num] = Math.min(1, (Date.now()-controll.startTime[num])/controll.durationTime[num]);
+				
+				if(controll.endValue[num].fillColor != null) {
+					controll.value[num].fillColor.r = controll.startValue[num].fillColor.r + (controll.endValue[num].fillColor.r - controll.startValue[num].fillColor.r) * controll.progress[num];
+					controll.value[num].fillColor.g = controll.startValue[num].fillColor.g + (controll.endValue[num].fillColor.g - controll.startValue[num].fillColor.g) * controll.progress[num];
+					controll.value[num].fillColor.b = controll.startValue[num].fillColor.b + (controll.endValue[num].fillColor.b - controll.startValue[num].fillColor.b) * controll.progress[num];
+					controll.value[num].fillColor.a = controll.startValue[num].fillColor.a + (controll.endValue[num].fillColor.a - controll.startValue[num].fillColor.a) * controll.progress[num];
+				};
+				if(controll.endValue[num].strokeColor != null) {
+					controll.value[num].strokeColor.r = controll.startValue[num].strokeColor.r + (controll.endValue[num].strokeColor.r - controll.startValue[num].strokeColor.r) * controll.progress[num];
+					controll.value[num].strokeColor.g = controll.startValue[num].strokeColor.g + (controll.endValue[num].strokeColor.g - controll.startValue[num].strokeColor.g) * controll.progress[num];
+					controll.value[num].strokeColor.b = controll.startValue[num].strokeColor.b + (controll.endValue[num].strokeColor.b - controll.startValue[num].strokeColor.b) * controll.progress[num];
+					controll.value[num].strokeColor.a = controll.startValue[num].strokeColor.a + (controll.endValue[num].strokeColor.a - controll.startValue[num].strokeColor.a) * controll.progress[num];
+				};
+				if(controll.endValue[num].size != null) {
+					controll.value[num].size = controll.startValue[num].size + (controll.endValue[num].size - controll.startValue[num].size) * controll.progress[num];
+				};
+				if(controll.endValue[num].position != null) {
+					controll.value[num].position.x = controll.startValue[num].position.x + (controll.endValue[num].position.x - controll.startValue[num].position.x) * controll.progress[num];
+					controll.value[num].position.y = controll.startValue[num].position.y + (controll.endValue[num].position.y - controll.startValue[num].position.y) * controll.progress[num];
+					controll.value[num].position.z = controll.startValue[num].position.z + (controll.endValue[num].position.z - controll.startValue[num].position.z) * controll.progress[num];
+				};
+				if(controll.endValue[num].rotate != null) {
+					controll.value[num].rotate.x = controll.startValue[num].rotate.x + (controll.endValue[num].rotate.x - controll.startValue[num].rotate.x) * controll.progress[num];
+					controll.value[num].rotate.y = controll.startValue[num].rotate.y + (controll.endValue[num].rotate.y - controll.startValue[num].rotate.y) * controll.progress[num];
+					controll.value[num].rotate.z = controll.startValue[num].rotate.z + (controll.endValue[num].rotate.z - controll.startValue[num].rotate.z) * controll.progress[num];
+				};
+				
+				if(controll.progress[num] == 1) {
+					controll.value[num].fill = controll.endValue[num].fill;
+					controll.value[num].stroke = controll.endValue[num].stroke;
+					controll.value[num].shade = controll.endValue[num].shade;
+					controll.processArray[num] = null;
+				};
+				break;
+		};
+	},
+	dynamicTimer : function() {
+		switch(controll.dynamicFlag) {
+			case 0:
+				controll.dynamicMap = null;
+				break;
+			case 1:
+				controll.dynamicMap = dynamic_001.iteration();
+				break;
+			case 2:
+				controll.dynamicMap = dynamic_002.iteration();
+				break;
+			case 3:
+				controll.dynamicMap = dynamic_003.iteration();
+				break;
+			case 4:
+				controll.dynamicMap = dynamic_004.iteration();
+				break;
+		};
+		if(controll.dynamicMap != null) {
+			for(var i=0; i<DEFIINE_instanceNum; i++) {
+				//boolean
+				if(controll.dynamicMap[i].shade != null) controll.value[i].shade = controll.dynamicMap[i].shade;
+				if(controll.dynamicMap[i].fill != null) controll.value[i].fill = controll.dynamicMap[i].fill;
+				if(controll.dynamicMap[i].stroke != null) controll.value[i].stroke = controll.dynamicMap[i].stroke;
+				
+				//number
+				if(controll.dynamicMap[i].fillColor != null) {
+					if(controll.dynamicMap[i].fillColor.r != null) controll.value[i].fillColor.r = controll.value[i].fillColor.r + (controll.dynamicMap[i].fillColor.r - controll.value[i].fillColor.r)/4;
+					if(controll.dynamicMap[i].fillColor.g != null) controll.value[i].fillColor.g = controll.value[i].fillColor.g + (controll.dynamicMap[i].fillColor.g - controll.value[i].fillColor.g)/4;
+					if(controll.dynamicMap[i].fillColor.b != null) controll.value[i].fillColor.b = controll.value[i].fillColor.b + (controll.dynamicMap[i].fillColor.b - controll.value[i].fillColor.b)/4;
+					if(controll.dynamicMap[i].fillColor.a != null) controll.value[i].fillColor.a = controll.value[i].fillColor.a + (controll.dynamicMap[i].fillColor.a - controll.value[i].fillColor.a)/4;
+				};
+				if(controll.dynamicMap[i].strokeColor != null) {
+					if(controll.dynamicMap[i].strokeColor.r != null) controll.value[i].strokeColor.r = controll.value[i].strokeColor.r + (controll.dynamicMap[i].strokeColor.r - controll.value[i].strokeColor.r)/4;
+					if(controll.dynamicMap[i].strokeColor.g != null) controll.value[i].strokeColor.g = controll.value[i].strokeColor.g + (controll.dynamicMap[i].strokeColor.g - controll.value[i].strokeColor.g)/4;
+					if(controll.dynamicMap[i].strokeColor.b != null) controll.value[i].strokeColor.b = controll.value[i].strokeColor.b + (controll.dynamicMap[i].strokeColor.b - controll.value[i].strokeColor.b)/4;
+					if(controll.dynamicMap[i].strokeColor.a != null) controll.value[i].strokeColor.a = controll.value[i].strokeColor.a + (controll.dynamicMap[i].strokeColor.a - controll.value[i].strokeColor.a)/4;
+				};
+				if(controll.dynamicMap[i].size != null) {
+					controll.value[i].size = controll.value[i].size + (controll.dynamicMap[i].size-controll.value[i].size)/4;
+				};
+				if(controll.dynamicMap[i].position != null) {
+					if(controll.dynamicMap[i].position.x != null) controll.value[i].position.x = controll.value[i].position.x + (controll.dynamicMap[i].position.x-controll.value[i].position.x)/4;
+					if(controll.dynamicMap[i].position.y != null) controll.value[i].position.y = controll.value[i].position.y + (controll.dynamicMap[i].position.y-controll.value[i].position.y)/4;
+					if(controll.dynamicMap[i].position.z != null) controll.value[i].position.z = controll.value[i].position.z + (controll.dynamicMap[i].position.z-controll.value[i].position.z)/4;
+				};
+				if(controll.dynamicMap[i].rotate != null) {
+					if(controll.dynamicMap[i].rotate.x != null) controll.value[i].rotate.x = controll.value[i].rotate.x + (controll.dynamicMap[i].rotate.x-controll.value[i].rotate.x)/4;
+					if(controll.dynamicMap[i].rotate.y != null) controll.value[i].rotate.y = controll.value[i].rotate.y + (controll.dynamicMap[i].rotate.y-controll.value[i].rotate.y)/4;
+					if(controll.dynamicMap[i].rotate.z != null) controll.value[i].rotate.z = controll.value[i].rotate.z + (controll.dynamicMap[i].rotate.z-controll.value[i].rotate.z)/4;
+				};
+			};
+		};
+	}
+};
+controll.init();
+
+var staticTransformSeries = function(t) {
+	var inc = 0;
+	var to = function() {
+		setTimeout(function() {
+			controll.startTransform(inc, t);
+			inc++;
+			if(inc < DEFIINE_instanceNum) {
+				to();
+			};
+		}, 0);
+	};
+	to();
+};
+var staticTransformParallel = function(t) {
+	for(var i=0; i<DEFIINE_instanceNum; i++) {
+		controll.startTransform(i, t);
+	};
+};
+
+
+<!-- controller -->
+
+
+	objectInit();
+	var loop = function() {
+		cameraTimer();
+		
+		init.ctx.clearRect(0, 0, init.size.x, init.size.y);
+		backgroundController.draw();
+		shader.shadeObject = [];
+		for(var i=0; i<controll.processArray.length; i++) if(controll.processArray[i] != null) controll.processArray[i](i);
+		controll.dynamicTimer();
+		objectUpdate();
+		shader.zSort();
+		shader.flatShader.directionalLighting();
+		
+		effectTimer();
+		if(init.nodeStrokeFlag == true) nodeStroke.iteration();
+		
+		shader.execution();
+	};
+	var timerIteration = function() {
+		setTimeout(function() {
+			loop();
+			timerIteration();
+		}, 1000/30);
+	};
+	timerIteration();
+	
+
+	var motionSet = [
+		{
+			time : 500,
+			func : function() {
+				init.nodeStrokeFlag = true;
+				controll.staticFlag = "fontmap_small";
+				staticTransformSeries(1000);
+			}
+		},
+		{
+			time :15000,
+			func : function() {
+				for(var i=0; i<DEFIINE_instanceNum; i++) {
+					instanceObject[i].uniqueFlag001 = true;
+				};
+			}
+		},
+		{
+			time : 1000,
+			func : function() {
+				controll.staticFlag = "freemap_disconnected";
+				staticTransformSeries(800);
+			}
+		},/*
+		{
+			time : 2500,
+			func : function() {
+				controll.staticFlag = "freemap_random";
+				staticTransformParallel(1000);
+			}
+		},
+		{
+			time : 1000,
+			func : function() {
+				init.nodeStrokeFlag = true;
+				controll.dynamicFlag = 3;
+			}
+		},*/
+		
+		{
+			time : 2000,
+			func : function() {
+				controll.staticFlag = "fontmap_small";
+				staticTransformSeries(500);
+			}
+		},
+		{
+			time : 2000,
+			func : function() {
+				controll.staticFlag = "fontmap_small";
+				staticTransformSeries(500);
+			}
+		},
+		{
+			time : 2000,
+			func : function() {
+				controll.staticFlag = "freemap_random";
+				staticTransformSeries(800);
+			}
+		},
+		{
+			time : 2500,
+			func : function() {
+				controll.staticFlag = "freemap_random";
+				staticTransformSeries(800);
+			}
+		},
+		{
+			time : 2000,
+			func : function() {
+				controll.staticFlag = "freemap_random";
+				staticTransformSeries(800);
+			}
+		},
+		{
+			time : 3000,
+			func : function() {
+				controll.staticFlag = "freemap_disconnected";
+				staticTransformSeries(500);
+			}
+		},
+		{
+			time : 1500,
+			func : function() {
+				controll.dynamicFlag = 1;
+			}
+		},
+		{
+			time : 2000,
+			func : function() {
+				controll.dynamicFlag = 2;
+			}
+		},
+		{
+			time : 1500,
+			func : function() {
+				controll.dynamicFlag = 1;
+			}
+		},
+		{
+			time : 1500,
+			func : function() {
+				init.nodeStrokeFlag = true;
+				controll.dynamicFlag = 4;
+			}
+		},
+		{
+			time : 2000,
+			func : function() {
+				init.nodeStrokeFlag = true;
+				controll.dynamicFlag = 0;
+				controll.staticFlag = "freemap_disconnected";
+				staticTransformSeries(800);
+			}
+		}/*
+		{
+			time : 10000,
+			func : function() {
+			}
+		},*/
+	];
+	
+	var motionIndex = 0;
+	var motionChanger = function() {
+		setTimeout(function() {
+			motionSet[motionIndex].func();
+			motionIndex++;
+			if(motionSet.length == motionIndex) motionIndex = 0; 
+			motionChanger();
+		}, motionSet[motionIndex].time);
+	};
+	motionChanger();
+	
+
+</script>
\ No newline at end of file
diff --git a/hex/index.html b/hex/index.html
old mode 100644
new mode 100755
index 905568c..8b2fea2
--- a/hex/index.html
+++ b/hex/index.html
@@ -4,7 +4,7 @@
         <link rel="stylesheet" href="./styles/style.css"> 
         <script src="./scripts/perlin.js"></script> 
         <script src="./scripts/bg.js"></script>
-        <!--<script src="./scripts/patterns/centerhex.js"></script> -->
+        <script src="./scripts/patterns/centerhex.js"></script>
         
         <!-- --> 
     </head>
diff --git a/hex/scripts/bg.js b/hex/scripts/bg.js
old mode 100644
new mode 100755
index 1e73796..0e9fc07
--- a/hex/scripts/bg.js
+++ b/hex/scripts/bg.js
@@ -41,6 +41,7 @@ $(function() {
 	
 	//ctx.fillStyle = "rgba(21, 21, 21, 100)";
 	ctx.fillStyle = '#00f';
+	ctx.fill();
     //drawHexRect(ctx, 100, 10, 10);
     //var t = new Tile(100, 50, 50, ctx);
     //t.full();
diff --git a/hex/scripts/patterns/centerhex.js b/hex/scripts/patterns/centerhex.js
old mode 100644
new mode 100755
diff --git a/hex/scripts/perlin.js b/hex/scripts/perlin.js
old mode 100644
new mode 100755
diff --git a/hex/styles/style.css b/hex/styles/style.css
old mode 100644
new mode 100755
diff --git a/s1clone/index.html b/s1clone/index.html
old mode 100644
new mode 100755
index fbea20e..8e88099
--- a/s1clone/index.html
+++ b/s1clone/index.html
@@ -2,7 +2,7 @@
 		<title>Toothwitch's Root</title>
 		<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 		<script src="scripts/background.js"> </script>
-		<link rel="stylesheet" type="text/css" href="styles/style.css">
+		<link rel="stylesheet" type="text/css" href="scripts/style.css">
 	</head>
 	<body>
 		<canvas class="bgmaster" id="bg" name="bg" style="z-index=-5;" width="1668" height="888"></canvas>
diff --git a/s1clone/scripts/background.js b/s1clone/scripts/background.js
old mode 100644
new mode 100755
index 4cdb4d7..808cffb
--- a/s1clone/scripts/background.js
+++ b/s1clone/scripts/background.js
@@ -142,7 +142,7 @@
 	}
 	function star(c, x, y, r, p, m,o)
 	{
-	ctx.fillStyle = "rgba(255, 255, 255, "+o+")";
+	ctx.fillStyle = "rgba(0, 0, 0, "+o+")";
 	ctx.save();
 	ctx.beginPath();
 	ctx.translate(x, y);
diff --git a/s1clone/scripts/style.css b/s1clone/scripts/style.css
new file mode 100755
index 0000000..bf5528b
--- /dev/null
+++ b/s1clone/scripts/style.css
@@ -0,0 +1,71 @@
+@font-face { font-family: SpookyMagic; src: url(../fonts/SpookyMagic.ttf); } 
+@font-face { font-family: AceRecords; src: url(../fonts/AceRecords.ttf); } 
+.headline{
+	z-index=0;
+	width: 100%;
+	text-align: center;
+	font-family: AceRecords;
+	font-size: 5em;
+}
+.prod{
+	width: 20px;
+	right: 0;
+	top: 0;
+	position: fixed;
+	cursor: default;
+}
+
+.menu{
+	text-align: center;
+	font-family: AceRecords;
+	text-decoration: none;
+	font-size: 3em;
+}
+.menu a{
+		text-decoration: none;
+		color: #000;
+		border: solid #000 1px;
+		padding: 10px;
+		border-radius: 15px;
+		background-color: #fff;
+		margin-left: 1%;
+		margin-right: 1%;
+	}
+.main{
+	width:100%;
+	position: absolute;
+	top: 5%;
+	z-index=0;
+}
+.bgmaster{
+	position: fixed;
+}
+
+.content{
+	width: 50%;
+	border: solid #550033 1px;
+	margin-top: 5%;
+	margin-left: auto;
+	margin-right: auto; 
+	border-radius: 30px;
+	padding: 10px;
+	font-size: 2em;
+	font-family: Terminal, monospace;
+	background-color: #fff;
+}
+.content a{
+	color: #444444;
+}
+input[type="password"]{
+	font-size: 1em;
+	font-family: Terminal, monospace;
+	border-radius: 15px;
+	padding: 10px;
+	width: 80%;
+}
+input[type="password"]:focus {
+  outline: none;
+}
+body{
+	width: 100%;
+}
\ No newline at end of file