diff --git a/app/assets/images/bar_border.png b/app/assets/images/bar_border.png
new file mode 100644
index 00000000..4e71f036
Binary files /dev/null and b/app/assets/images/bar_border.png differ
diff --git a/app/assets/images/bar_btn.png b/app/assets/images/bar_btn.png
new file mode 100644
index 00000000..59d5938d
Binary files /dev/null and b/app/assets/images/bar_btn.png differ
diff --git a/app/assets/images/bar_id.png b/app/assets/images/bar_id.png
new file mode 100644
index 00000000..18b00734
Binary files /dev/null and b/app/assets/images/bar_id.png differ
diff --git a/app/assets/images/bar_orbit.png b/app/assets/images/bar_orbit.png
new file mode 100644
index 00000000..feaca6b8
Binary files /dev/null and b/app/assets/images/bar_orbit.png differ
diff --git a/app/assets/images/bar_pw.png b/app/assets/images/bar_pw.png
new file mode 100644
index 00000000..9f5d5cc2
Binary files /dev/null and b/app/assets/images/bar_pw.png differ
diff --git a/app/assets/images/bought_btn.png b/app/assets/images/bought_btn.png
new file mode 100644
index 00000000..c8b5529b
Binary files /dev/null and b/app/assets/images/bought_btn.png differ
diff --git a/app/assets/images/buy_btn.png b/app/assets/images/buy_btn.png
new file mode 100644
index 00000000..d1d64915
Binary files /dev/null and b/app/assets/images/buy_btn.png differ
diff --git a/app/assets/images/html.png b/app/assets/images/html.png
new file mode 100644
index 00000000..889b3b40
Binary files /dev/null and b/app/assets/images/html.png differ
diff --git a/app/assets/images/orbitbar.png b/app/assets/images/orbitbar.png
new file mode 100644
index 00000000..cb40b661
Binary files /dev/null and b/app/assets/images/orbitbar.png differ
diff --git a/app/assets/images/service_btn.png b/app/assets/images/service_btn.png
new file mode 100644
index 00000000..8a386406
Binary files /dev/null and b/app/assets/images/service_btn.png differ
diff --git a/app/assets/stylesheets/admin.css.erb b/app/assets/stylesheets/admin.css.erb
index e69de29b..89e42e83 100644
--- a/app/assets/stylesheets/admin.css.erb
+++ b/app/assets/stylesheets/admin.css.erb
@@ -0,0 +1,210 @@
+body{
+    background: url("/assets/orbitbar.png") repeat-x scroll 0 0;
+    color: #000000;
+    font-family: helvetica,arial,sans-serif;
+    margin: 0;
+    padding: 0;
+}
+
+#banner_link{
+    background: url(<%= asset_path "bar_orbit.png" %>) no-repeat scroll 10px 0 transparent;
+    height: 43px;
+    position: relative;
+}
+.hmenu{
+    height: 40px;
+    position: absolute;
+    right: 0;
+    top: 1px;
+    width: 250px;
+}
+
+
+
+#log_out a{
+    background: url(<%= asset_path "service_btn.png" %>) no-repeat scroll right 0 transparent;
+    border: medium none !important;
+    display: block !important;
+    height: 40px !important;
+    line-height: normal !important;
+    padding: 0 !important;
+    position: absolute;
+    right: 0px;
+    text-indent: -10000px;
+    top: 0px;
+    width: 43px !important;
+}
+#log_out a:hover{
+    background: url(<%= asset_path "service_btn.png" %>) no-repeat scroll right bottom transparent !important;
+}
+.lang{
+    color: #FFFFFF;
+    font-size: 15px;
+    line-height: 40px;
+    position: absolute;
+    right: 55px;
+    top: 0;
+}
+
+.lang a{
+	color:#fff;
+	text-decoration:none;
+}
+
+.lang a:hover{
+	text-decoration:underline;
+}
+
+#container{
+    margin: 9px 0 0;
+}
+
+#container h1{
+    font: 28px/100% helvetica,arial,sans-serif;
+    margin: 0 0 20px;
+    padding: 0;
+}
+
+#header{
+    background: none repeat scroll 0 0 #F1F1F1;
+    border-bottom: 1px solid #818181;
+    padding: 10px;
+}
+#header:after {
+	content: "."; 
+	display: block;
+	height: 0; 
+	clear: both; 
+	visibility: hidden;
+}
+#nav{
+	margin:0;
+	padding:0;
+}
+
+#nav li{
+    float: left;
+    list-style: none outside none;
+}
+
+#nav li a{
+    background: none repeat scroll 0 0 #fff;
+    border-radius: 13px 13px 13px 13px;
+    border: 1px solid #D6D6D6;
+    color: #000000;
+    float: left;
+    margin: 0 20px 0 0;
+    padding: 5px 10px;
+    text-decoration: none;
+}
+
+#nav li a:hover{
+    background: none repeat scroll 0 0 #818181;
+    border-radius: 13px 13px 13px 13px;
+    color: #fff;
+}
+
+.content{
+    background: none repeat scroll 0 0 #FFFFFF;
+	clear:both;
+    padding: 20px 10px;
+
+	min-height : 430px;
+	height:auto !important;
+    height:430px;
+}
+.content:after {
+	content: "."; 
+	display: block;
+	height: 0; 
+	clear: both; 
+	visibility: hidden;
+}
+.main{
+	float:left;
+    min-width: 700px;
+    width: 60%;
+}
+.main table{
+    border-collapse: collapse;
+	width:100%;
+}
+.main table th{
+    background: none repeat scroll 0 0 #EEEEEE;
+	border-bottom:1px solid #c7c7c7;
+    font: 17px/100% helvetica,arial,sans-serif;
+    letter-spacing: 0.05em;
+    padding: 10px;
+}
+.main table td{
+    border-bottom: 1px solid #EEEEEE;
+    padding: 10px;
+    text-align: center;
+}
+
+.main table td a{
+    background: none repeat scroll 0 0 #EEEEEE;
+    border-radius: 13px 13px 13px 13px;
+    color: #000000;
+    padding: 5px 10px;
+    text-decoration: none;
+}
+
+.main table td a:hover{
+    background: none repeat scroll 0 0 #818181;
+    border-radius: 13px 13px 13px 13px;
+    color: #fff;
+}
+.secondary{
+    float: left;
+    margin: 47px 0 0 20px;
+    min-width: 250px;
+    width: 10%;
+}
+.secondary ul{
+    border: 1px solid #818181;
+    border-radius: 5px 5px 5px 5px;
+    margin: 0;
+    padding: 10px;
+}
+.secondary ul li{
+	list-style:none;
+}
+.secondary ul li a{
+    background: none repeat scroll 0 0 #EEEEEE;
+    border: 1px solid #CCCCCC;
+    border-radius: 5px 5px 5px 5px;
+    color: #333333;
+    display: block;
+    margin: 5px 0;
+    padding: 5px;
+    text-decoration: none;
+}
+.secondary ul li a:hover{
+    background: none repeat scroll 0 0 #cccccc;
+	border:1px solid #818181;
+    color: #000;
+}
+
+#footer{
+    background: none repeat scroll 0 0 #FFFFFF;
+    clear: both;
+    padding: 10px;
+}
+#footer p{
+	margin:0;
+}
+p{
+}
+p label{
+    float: left;
+    padding: 3px;
+    width: 100px;
+}
+.text{
+    border: 1px solid #818181;
+    border-radius: 3px 3px 3px 3px;
+    font: 12px/100% helvetica,arial,sans-serif;
+    padding: 3px;
+    width: 205px;
+}
\ No newline at end of file
diff --git a/app/assets/stylesheets/content.css.erb b/app/assets/stylesheets/content.css.erb
index 092b7537..f918f06d 100644
--- a/app/assets/stylesheets/content.css.erb
+++ b/app/assets/stylesheets/content.css.erb
@@ -1,3 +1,4 @@
+/*
 #panel_header ul, #panel_sidebar ul{
 	margin:0;
 	padding:0;
@@ -93,4 +94,241 @@ body{
 .del_page{}
 #panel_main{
 	margin:10px;
+}
+*/
+html{
+
+    background: url(<%= asset_path "html.png" %>) repeat-y scroll 0 0;
+}
+body{
+    background: url(<%= asset_path "orbitbar.png" %>) repeat-x scroll 0 0;
+    color: #000000;
+    font-family: helvetica,arial,sans-serif;
+    margin: 0;
+    padding: 0;
+}
+
+#banner_link{
+    background: url(<%= asset_path "bar_orbit.png" %>) no-repeat scroll 10px 0 transparent;
+    height: 43px;
+    position: relative;
+}
+.hmenu{
+    height: 40px;
+    position: absolute;
+    right: 0;
+    top: 1px;
+    width: 250px;
+}
+
+
+
+#log_out a{
+    background: url(<%= asset_path "service_btn.png" %>) no-repeat scroll right 0 transparent;
+    border: medium none !important;
+    display: block !important;
+    height: 40px !important;
+    line-height: normal !important;
+    padding: 0 !important;
+    position: absolute;
+    right: 0px;
+    text-indent: -10000px;
+    top: 0px;
+    width: 43px !important;
+}
+#log_out a:hover{
+    background: url(<%= asset_path "service_btn.png" %>) no-repeat scroll right bottom transparent !important;
+}
+.lang{
+    color: #FFFFFF;
+    font-size: 15px;
+    line-height: 40px;
+    position: absolute;
+    right: 55px;
+    top: 0;
+}
+
+.lang a{
+	color:#fff;
+	text-decoration:none;
+}
+
+.lang a:hover{
+	text-decoration:underline;
+}
+
+#container{
+    margin: 9px 0 0;
+}
+#container:after {
+	content: "."; 
+	display: block;
+	height: 0; 
+	clear: both; 
+	visibility: hidden;
+}
+#container h1{
+    font: 28px/100% helvetica,arial,sans-serif;
+    margin: 0 0 20px;
+    padding: 0;
+}
+
+#header{
+    background: none repeat scroll 0 0 #F1F1F1;
+    border-bottom: 1px solid #818181;
+    padding: 10px;
+}
+#header:after {
+	content: "."; 
+	display: block;
+	height: 0; 
+	clear: both; 
+	visibility: hidden;
+}
+#nav{
+	margin:0;
+	padding:0;
+}
+
+#nav li{
+    float: left;
+    list-style: none outside none;
+}
+
+#nav li a{
+    background: none repeat scroll 0 0 #fff;
+    border-radius: 13px 13px 13px 13px;
+    border: 1px solid #D6D6D6;
+    color: #000000;
+    float: left;
+    margin: 0 20px 0 0;
+    padding: 5px 10px;
+    text-decoration: none;
+}
+
+#nav li a:hover{
+    background: none repeat scroll 0 0 #818181;
+    border-radius: 13px 13px 13px 13px;
+    border: 1px solid #818181;
+    color: #fff;
+}
+
+.content{
+	clear:both;
+
+	min-height : 430px;
+	height:auto !important;
+    height:430px;
+}
+.content:after {
+	content: "."; 
+	display: block;
+	height: 0; 
+	clear: both; 
+	visibility: hidden;
+}
+.main{
+	float:left;
+    min-width: 700px;
+    width: 60%;
+}
+.main table{
+    border-collapse: collapse;
+	width:100%;
+}
+.main table th{
+    background: none repeat scroll 0 0 #EEEEEE;
+	border-bottom:1px solid #c7c7c7;
+    font: 17px/100% helvetica,arial,sans-serif;
+    letter-spacing: 0.05em;
+    padding: 10px;
+}
+.main table td{
+    border-bottom: 1px solid #EEEEEE;
+    padding: 10px;
+    text-align: center;
+}
+
+.main table td a{
+    background: none repeat scroll 0 0 #EEEEEE;
+    border-radius: 13px 13px 13px 13px;
+    color: #000000;
+    padding: 5px 10px;
+    text-decoration: none;
+}
+
+.main table td a:hover{
+    background: none repeat scroll 0 0 #818181;
+    border-radius: 13px 13px 13px 13px;
+    color: #fff;
+}
+.secondary{
+    float: left;
+    margin: 47px 0 0 20px;
+    min-width: 250px;
+    width: 10%;
+}
+.secondary ul{
+    border: 1px solid #818181;
+    border-radius: 5px 5px 5px 5px;
+    margin: 0;
+    padding: 10px;
+}
+.secondary ul li{
+	list-style:none;
+}
+.secondary ul li a{
+    background: none repeat scroll 0 0 #EEEEEE;
+    border: 1px solid #CCCCCC;
+    border-radius: 5px 5px 5px 5px;
+    color: #333333;
+    display: block;
+    margin: 5px 0;
+    padding: 5px;
+    text-decoration: none;
+}
+.secondary ul li a:hover{
+    background: none repeat scroll 0 0 #cccccc;
+	border:1px solid #818181;
+    color: #000;
+}
+
+#footer{
+    background: none repeat scroll 0 0 #FFFFFF;
+    clear: both;
+    padding: 10px;
+}
+#footer p{
+	margin:0;
+}
+
+
+#panel_sidebar{
+    color: #FFFFFF;
+    float: left;
+    padding: 5px 0 0;
+    width: 300px;
+}
+#panel_sidebar ul{
+    background: url(<%= asset_path "tree_list.png" %>) repeat-x 0 0;
+    margin: 0;
+    padding: 0 0 0 15px;
+}
+#panel_sidebar ul li{
+    line-height: 28px;
+    list-style: none outside none;
+}
+#panel_sidebar li ul{
+    margin: 0 0 0 -15px;
+    padding: 0 0 0 25px;
+}
+#panel_sidebar a{
+    color: #FFFFFF;
+    font-size: 12px;
+    text-decoration: none;
+}
+#panel_sidebar a:hover{}
+#panel_main{
+    float: left;
+    padding: 10px;
 }
\ No newline at end of file
diff --git a/app/views/devise/menu/_login_items.html.erb b/app/views/devise/menu/_login_items.html.erb
index 68ded0dd..04f94472 100644
--- a/app/views/devise/menu/_login_items.html.erb
+++ b/app/views/devise/menu/_login_items.html.erb
@@ -1,9 +1,9 @@
 <% if user_signed_in? %>
-  <li>
-  <%= link_to('Logout', destroy_user_session_path) %>        
-  </li>
+	<div id="log_out">
+		<%= link_to('Logout', destroy_user_session_path) %>        
+	</div>
 <% else %>
-  <li>
-  <%= link_to('Login', new_user_session_path)  %>  
-  </li>
+	<div id="log_in">
+		<%= link_to('Login', new_user_session_path)  %>  
+	</div>
 <% end %>
\ No newline at end of file
diff --git a/app/views/layouts/admin.html.erb b/app/views/layouts/admin.html.erb
index 460e816b..4d7cc6b2 100644
--- a/app/views/layouts/admin.html.erb
+++ b/app/views/layouts/admin.html.erb
@@ -12,16 +12,17 @@
   <%= csrf_meta_tag %>
 </head>
 <body>
-<div id="container">
 
-  <div id="banner_link" style='text-align:right'>
-    <ul class="hmenu">
-      <li>
-        <%= render 'layouts/lang_menu' %>
-      </li>
-      <%= render 'devise/menu/login_items' %>
-    </ul>
+    <div id="banner_link" >
+    <div class="hmenu">
+		<div class="lang">
+			<%= render 'layouts/lang_menu' %>
+		</div>
+	
+		<%= render 'devise/menu/login_items' %>
+    </div>
   </div>
+<div id="container">
   
   <div id="header">
     <h1>RulingSite <%= t('admin.admin') %></h1>
diff --git a/app/views/layouts/content.html.erb b/app/views/layouts/content.html.erb
index cf6cc6b9..c2be849d 100644
--- a/app/views/layouts/content.html.erb
+++ b/app/views/layouts/content.html.erb
@@ -20,8 +20,21 @@
   <%= csrf_meta_tag %>
 </head>
 <body>
-  <div id="panel_header">
-		<ul id="panel_nav">
+
+    <div id="banner_link" >
+    <div class="hmenu">
+		<div class="lang">
+			<%= render 'layouts/lang_menu' %>
+		</div>
+	
+		<%= render 'devise/menu/login_items' %>
+    </div>
+  </div>
+<div id="container">
+
+  <div id="header">
+		<h1>RulingSite <%= t('admin.item') %></h1>
+		<ul id="nav">
 	    <li><%= link_to t('homepage'), root_path %></li>
 	    <li><%= link_to t('admin.item'), admin_items_path %></li>
 			<li><%= link_to t('admin.design'), admin_designs_path %></li>
@@ -31,19 +44,15 @@
 	    <li><%= link_to t('admin.user_role'), admin_user_role_models_path %></li>
 			<li><%= link_to t('admin.translation'), admin_translations_path %></li>
  		</ul>
-		<ul class="panel_hmenu">
-      <li>
-        <%= render 'layouts/lang_menu' %>
-      </li>
-      <%= render 'devise/menu/login_items' %>
-    </ul>
+		
   </div>
 
-  <div id="panel_content" class="content">
-    <div id="panel_sidebar" style='float: left;'><%= yield :sidebar %></div>
-  	<div id="panel_main" style='float: left;'><%= yield %></div>
+  <div class="content">
+    <div id="panel_sidebar"><%= yield :sidebar %></div>
+  	<div id="panel_main"><%= yield %></div>
   </div>
   
   <div id="panel_footer"><%= yield :footer %></div>
+ </div>
 </body>
-</html>
\ No newline at end of file
+</html>