diff --git a/webapp.html b/webapp.html
index da0a4d9..2f7dd9a 100644
--- a/webapp.html
+++ b/webapp.html
@@ -9,44 +9,113 @@
 		<meta name="viewport" content="width=device-width, user-scalable=no">
 
 		<style>
-		body{font-family:Helvetica, Arial, sans-seriff; }
+		
+		
+		body{
+			font-size:20px;
+
+text-shadow: 1px 1px orange;
+			font-family: times, 'times new roman', helvetica,serif;
+			line-height:1.5em;
+			color:#444;
+			background:#fff;	
+			background-image: url(css/marble.jpg);	
+			}
 
 		textarea{
 		  -webkit-appearance: none; -moz-appearance: none;
 		  display: block;
 		  margin: 0;
+		 
 		  width: 100%; height: 50px;
 		  line-height: 40px; font-size: 17px;
 		  border: 1px solid #bbb;
+		   -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
+		   	background-image: url(css/aqua.jpg);	
+		   	 font-family: inherit;
+   			font-size: inherit;
+   		font-size: 30px;
 		}
 		 button {
-		 -webkit-appearance: none; -moz-appearance: none;
-		 display: block;
+		 
 		 margin: 1.5em 0;
-		 font-size: 1em; line-height: 2.5em;
-		 color: #333;
-		 font-weight: bold;
-		 height: 2.5em; width: 100%;
-		 background: #fdfdfd; background: -moz-linear-gradient(top, #fdfdfd 0%, #bebebe 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fdfdfd), color-stop(100%,#bebebe)); background: -webkit-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); background: -o-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); background: -ms-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); background: linear-gradient(to bottom, #fdfdfd 0%,#bebebe 100%);
-		 border: 1px solid #bbb;
-		 -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;
+	
+
+	
+		 font-family: inherit;
+   		 font-size: inherit;
+   		 font-size: 30px;
 		}
+		h2{
+		text-shadow: 2px 2px #orange;
+		font-size: 40px;
+		}
+			
+		hr{
+			height:10px;
+			border: 10;
+			width:87%;
+			background-image: url(css/bg1.gif); 
 
-		</style>
+		}
+
+		li{
+
+			height: 56px; 
+		
+			//list-style: none;
 
 
+			-moz-box-shadow:0 0 23px #bbb;
+			-webkit-box-shadow:0 0 23px #bbb;
+			//box-shadow:0 0 23px blue;
+			-webkit-border-top-left-radius:123px;
+			-webkit-border-top-right-radius:123px;
+			-webkit-border-bottom-right-radius:123px;
+			-webkit-border-bottom-left-radius:123px;
+			-moz-border-radius-bottomright:123px;
+			-moz-border-radius-bottomleft:123px;
+			border-bottom-right-radius:123px;
+			border-bottom-left-radius:123px;
+			left:-35px;
+			padding:10px;
+			width:101%;
+			overflow:hidden;
+			position:relative;
+			background:#fff;
+			//background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
+			//background:-moz-linear-gradient(top,  #fff,  #eee);
+		}
+		#outbox{
+			display:hidden;
+		}
+		#header{
+			width:100%;
+			text-align: center;
+		}
+
+		</style>
+
 		<title>meshed up</title>
 	</head>
 
 	<body>
-		<h2>message</h2>
-		<textarea id="message" rows="3" style="width:100%"  placeholder="Enter your message"></textarea>
-		<button style="width:100%" id="send">Send</button>
-		<h2>outbox</h2>
-		<ul id="outbox"></ul>
-		<h2>inbox</h2>
+		<div id="header">
+			<h2>Meshenger</h2>
+		</div>
+
+		<div id="fixedDiv">
+			<textarea id="name" rows="1" style="width:100%"  placeholder="Your Name"></textarea>
+			<textarea id="message" rows="3" style="width:100%"  placeholder="Your Message"></textarea>
+			<button style="width:100%" id="send">Send</button>
+		</div>
+		
 		<ul id="inbox"></ul>
+		
+		<!--<h2>outbox</h2>-->
+		<ul id="outbox"></ul>
 
+		
 <script type="text/javascript">
 
 /*
