cleaned up css for chakra but not the following pages

8 files changed, 182 insertions, 190 deletions

diff --git a/assets/default/images/chakra_logo_50x50.png b/assets/default/images/chakra_logo_50x50.png
new file mode 100755
index 0000000..0eadda2
--- /dev/null
+++ b/assets/default/images/chakra_logo_50x50.png
diff --git a/assets/default/images/help_50x50.png b/assets/default/images/help_50x50.png
new file mode 100755
index 0000000..ade47a7
--- /dev/null
+++ b/assets/default/images/help_50x50.png
diff --git a/assets/default/images/karma_logo.png b/assets/default/images/karma_logo.png
index dc8610a..fa04651 100755
--- a/assets/default/images/karma_logo.png
+++ b/assets/default/images/karma_logo.png
diff --git a/assets/default/images/karma_logo_35x32.png b/assets/default/images/karma_logo_35x32.png
new file mode 100755
index 0000000..790ed88
--- /dev/null
+++ b/assets/default/images/karma_logo_35x32.png
diff --git a/assets/default/images/karma_logo_50x46.png b/assets/default/images/karma_logo_50x46.png
new file mode 100755
index 0000000..19dfd91
--- /dev/null
+++ b/assets/default/images/karma_logo_50x46.png
diff --git a/assets/default/images/karma_logo_54x50.png b/assets/default/images/karma_logo_54x50.png
new file mode 100755
index 0000000..6f6842d
--- /dev/null
+++ b/assets/default/images/karma_logo_54x50.png
diff --git a/css/chakra.css b/css/chakra.css
index 2374684..901eaaa 100755
--- a/css/chakra.css
+++ b/css/chakra.css
@@ -1,303 +1,295 @@
 body
 { 
-background:#D8D8D8;
-margin:0;
-padding:0;
+	background: #D8D8D8;
+	margin: 0;
+	padding: 0;
 }
 
 img
 {
-border: none;
+	border: none;
 }
 
-#navigation
-{
-background: #6E6E6E;
-padding-bottom: 0.1em;
-padding-top: 0.1em;
-width: 100%;
-float: left;
+#page_container {
+	width: 100%;
 }
 
-.chakra_logo
+#navigation
 {
-float: left;
-width: 40px;
-}
+	width: 640px;
+	background: #6E6E6E;
+	padding-bottom: 0.1em;
+	padding-top: 0.1em;
+	margin: 0 auto;
+}	
 
-.icon_left
-{
-float: left;
-width: 30px;
+.top-nav {
+	width: 30px;
+	height: 30px;
 }
 
-.icon_right
-{
-float: right;
-width: 30px;
+.left-float {
+	float: left;
+	margin-right: 3px;
 }
 
-.nav_left
-{
-float: left;
+.right-float {
+	float: right;
+	margin-left: 3px;
 }
 
-.nav_right
-{
-float: right;
+.clear-float {
+	clear: both;
+	line-height: 0px;
 }
 
 #month
 {
-vertical-align: middle;
-float: right;
-}
-
-#mainmenu
-{
-width:1200px;
-position: fixed;
-/*left: 50%;
-#margin-left: -320px; */
+	vertical-align: middle;
+	float: right;
 }
 
 #grades
 {
-width: 640px;
-margin-left: auto;
-margin-right: auto;
+	width: 640px;
+	padding: .5em 0 .5em 0;
+	margin: 0 auto;
+	background: #BDBDBD;
 }
 
 #grades ul
 {
-list-style: none;
-padding: 0;
-margin: 0;
-background:#BDBDBD;
-float:left;
+	list-style: none;
+	padding: 0;
+	margin: 0;
+}
+
+#grades p {
+	line-height: 0;
 }
 
 #grades ul li
 {
-float: left;
+	float: left;
+	width: 160px;
+	text-align: center;
 }
 
 #grades ul li a
 {
-line-height: 1.5em;
-width: 160px;
-text-decoration: none;
-text-align: center;
-font-weight: bold;
-float: left;
-color:#000000;
-height: 8em;
-margin-bottom: 0.2em;
-margin-top: 0.2em;
+	text-decoration: none;
+	text-align: center;
+	font-weight: bold;
+	color: #000000;
+	margin: .2em 0 .2em 0;
 }
 
 #grades ul li img
 {
-border: none;
-width: 120px;
+	border: none;
+	width: 120px;
 }
 
-#grades a:hover {
-text-decoration: underline;
-outline-width:3px;
-outline-style:solid;
-outline-color: #424242;
+#grades li:hover {
+	text-decoration: underline;
+	outline-width: 3px;
+	outline-style: solid;
+	outline-color: #424242;
 }
 
 #subjects
 {
-width: 640px;
-margin-left: auto;
-margin-right: auto;
+	width: 640px;
+	margin: 0 auto;
 }
 
 #subjects ul
 {
-list-style: none;
-padding: 0;
-margin: 0;
-background:#BDBDBD;
-float:left;
-width:auto;
+	list-style: none;
+	padding: 0;
+	margin: 0;
+	background: #BDBDBD;
+	float: left;
+	width: auto;
 }
 
 #subjects ul li
 {
-float: left;
+	float: left;
 }
 
 #subjects ul li a
 {
-line-height: 2em;
-width: 160px;
-text-decoration: none;
-text-align: center;
-font-weight: bold;
-float: left;
-color:#000000;
-height: 9.5em;
-margin-bottom: 0.2em;
-margin-top: 0.2em;
+	line-height: 2em;
+	width: 160px;
+	text-decoration: none;
+	text-align: center;
+	font-weight: bold;
+	float: left;
+	color: #000000;
+	height: 9.5em;
+	margin-bottom: 0.2em;
+	margin-top: 0.2em;
 }
 
 #subjects ul li img
 {
-border: none;
-width: 120px;
+	border: none;
+	width: 120px;
 }
 
 #subjects a:hover {
-text-decoration: underline;
-outline-width:3px;
-outline-style:solid;
-outline-color: #424242;
+	text-decoration: underline;
+	outline-width:3px;
+	outline-style:solid;
+	outline-color: #424242;
 }
 
 #week_select
 {
-list-style: none;
-display: inline;
+	list-style: none;
+	display: inline;
 }
 
 #week_select li
 {
-float:left;
-font-weight: bold;
-line-height: 2em;
+	float: left;
+	font-weight: bold;
+	line-height: 2em;
 }
-
+	
 #week_select li a
 {
-text-decoration: none;
-text-align: center;
-float: left;
-color:#000000;
+	text-decoration: none;
+	text-align: center;
+	float: left;
+	color: #000000;
 }
 
 #week_select a:hover
 {
-text-decoration: underline;
-background:#BDBDBD;
+	text-decoration: underline;
+	background: #BDBDBD;
 }
 
 #week_select a.selected
 {
-text-decoration: underline;
-background:#BDBDBD;
+	text-decoration: underline;
+	background: #BDBDBD;
 }
 
 #lessonname
 { 
-text-decoration: none;
-text-align: center;
-font-weight: bold;
+	text-decoration: none;
+	text-align: center;
+	font-weight: bold;
 }
 
 #weeks
 {
-list-style: none;
-background:#BDBDBD;
-float: left;
-width: 100%;
-font-weight: bold;
+	list-style: none;
+	background:#BDBDBD;
+	float: left;
+	width: 100%;
+	font-weight: bold;
 }
 
 .preview
 {
-width: 250px;
+	width: 250px;
 }
 
 #weeks li
 {
-float:left;
+	float:left;
 }
 
 .icon
 {
-width: 40px
+	width: 40px
 }
 
 
 #weeks li a
 {
-text-decoration: none;
-text-align: center;
-font-weight: bold;
-float: left;
-color:#000000;
-padding-top: 0.2em;
-padding-right: 0.2em;
-padding-left: 0.2em;
+	text-decoration: none;
+	text-align: center;
+	font-weight: bold;
+	float: left;
+	color: #000000;
+	padding-top: 0.2em;
+	padding-right: 0.2em;
+	padding-left: 0.2em;
 }
 
 #weeks a:hover {
-text-decoration: underline;
-background:#BDBDBD;
+	text-decoration: underline;
+	background: #BDBDBD;
 }
 
 #weeks a.selected {
-text-decoration: underline;
-background:#BDBDBD;
+	text-decoration: underline;
+	background: #BDBDBD;
 }
 
 .weeklist
 {
-background:#6E6E6E;
-width: 100%;
+	background:#6E6E6E;
+	width: 100%;
 }
 
 .lessonlist a
 {
-width: 280px;
-height: 220px;
-margin-top: 1em;
+	width: 280px;
+	height: 220px;
+	margin-top: 1em;
 }
 
 .lessonlist a:hover {
-text-decoration: underline;
-outline-width:3px;
-outline-style:solid;
-outline-color: #424242;
+	text-decoration: underline;
+	outline-width:3px;
+	outline-style: solid;
+	outline-color: #424242;
+}
+
+#admin {
+	background: #4080c0;
+	width: 640px;
+	margin: 0 auto;
 }
 
 #admin ul
 {
-list-style: none;
-padding: 0;
-margin: 0;
-background:#4080c0;
-float:left;
-width:1200px;
+	list-style: none;
+	margin: 0;
+	padding: .5em 0 .5em 0;
 }
 
 #admin ul li
 {
-/*float: left;*/
-width: 640px;
-margin-left: auto;
-margin-right: auto;
+	float: left;
+	width: 210px;
+	text-align: center;
 }
 
 #admin ul li a
 {
-height: 5.5em;
-line-height: 2em;
-width: 210px;
-text-decoration: none;
-text-align: center;
-font-weight: bold;
-float: left;
-color:#000000;
+	height: 5.5em;
+	width: 210px;
+	text-decoration: none;
+	text-align: center;
+	font-weight: bold;
+	color: #000000;
+}
+
+#admin p {
+	line-height: 0;
 }
 
 #admin img
 {
-width: 60px;
+	height: 50px;
+	width: auto;
 }
 
 #curriculum
diff --git a/index.html b/index.html
index 92a27a6..c6b96cb 100755
--- a/index.html
+++ b/index.html
@@ -1,10 +1,9 @@
-<!DOCTYPE html>
-<html lang="en">
+<!doctype html>
+<html>
 <head>
 <title>Chakra (Alpha)</title>
-<meta name="keywords" content="karma,javascript,html5,sugar,sugarlabs,gsoc,ole,nepal"/>
-<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
-    <meta charset="utf-8"/>
+<meta name="keywords" content="karma javascript html5 sugar sugarlabs gsoc ole nepal"/>
+<meta charset="UTF-8">
 
 <link rel="stylesheet" href="css/chakra.css" type="text/css"/>
 <link rel="stylesheet" href="css/jquery.jgrowl.css" type="text/css"/>
@@ -12,42 +11,43 @@
 <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
 <script type="text/javascript" src="js/jquery.ui.all.js"></script>
 <script type="text/javascript" src="js/jquery.jgrowl_minimized.js"></script>
+
 <script type="text/javascript" src="js/jquery.idTabs.min.js"></script>
 
 <link type="image/ico" rel="icon" href="assets/default/images/favicon.ico" /> 
-
 </head>
 
 <body>
+<div id="page_container">
+<div id="navigation">
+<img src="assets/default/images/chakra_logo.png" alt="Home" title="Home" class="top-nav left-float"/>
+<img src="assets/default/images/help.png" alt="Help" title="Help" class="top-nav right-float"/>
+<img src="assets/default/images/karma_logo.png" alt="Karma icon" title="About Karma" class="top-nav right-float"/>
+<div class="clear-float">&nbsp;</div>
+</div><!-- end navigation -->
+<div id="grades">
+<ul>
+<li id="grade1"><a href="chakra/grade1.html"><img src="assets/default/images/grade1.png" alt="Grade 1" title="grade1"/><p>Grade 1</p></a></li>
+<li id="grade2"><a href="#tab_grade2"><img src="assets/default/images/grade2_bw.png" alt="Grade 2" title="grade2"/><p>Grade 2</p></a></li>
+<li id="grade3"><a href="#tab_grade3"><img src="assets/default/images/grade3.png" alt="Grade 3" title="grade3"/><p>Grade 3</p></a></li>
+<li id="grade4"><a href="#tab_grade4"><img src="assets/default/images/grade4_bw.png" alt="Grade 4" title="grade4"/><p>Grade 4</p></a></li>
+<li id="grade5"><a href="#tab_grade5"><img src="assets/default/images/grade5_bw.png" alt="Grade 5" title="grade5"/><p>Grade 5</p></a></li>
+<li id="grade6"><a href="#tab_grade6"><img src="assets/default/images/grade6.png" alt="Grade 6" title="grade6"/><p>Grade 6</p></a></li>
+<li id="grade7"><a href="#tab_grade7"><img src="assets/default/images/grade7_bw.png" alt="Grade 7" title="grade7"/><p>Grade 7</p></a></li>
+<li id="grade8"><a href="#tab_grade8"><img src="assets/default/images/grade8_bw.png" alt="Grade 8" title="grade8"/><p>Grade 8</p></a></li>
+</ul>
+<div class="clear-float">&nbsp;</div>
+</div><!-- end grades -->
 
-  <div id="mainmenu">
-    <div id="navigation">
-      <img src="assets/default/images/chakra_logo.png" alt="Home" title="Home" class="chakra_logo" />
-      <img src="assets/default/images/help.png" alt="Help" title="Help" class="icon_right" />
-      <img src="assets/default/images/karma_logo.png" alt="Karma icon" title="About Karma" class="icon_right" />
-    </div>
-    <div id="grades1-4">
-      
-	<div id="grade1"><a href="chakra/grade1.html"><img src="assets/default/images/grade1.png" alt="Grade 1" title="grade1"/>Grade 1</a></div>
-	<div id="grade2"><a href="#tab_grade2"><img src="assets/default/images/grade2_bw.png" alt="Grade 2" title="grade2"/>Grade 2</a></div>
-	<div id="grade3"><a href="#tab_grade3"><img src="assets/default/images/grade3.png" alt="Grade 3" title="grade3"/>Grade 3</a></div>
-	<div id="grade4"><a href="#tab_grade4"><img src="assets/default/images/grade4_bw.png" alt="Grade 4" title="grade4"/>Grade 4</a></div>
-      </div>
-      <div id="grades5-8">
-	<div id="grade5"><a href="#tab_grade5"><img src="assets/default/images/grade5_bw.png" alt="Grade 5" title="grade5"/>Grade 5</a></div>
-	<div id="grade6"><a href="#tab_grade6"><img src="assets/default/images/grade6.png" alt="Grade 6" title="grade6"/>Grade 6</a></div>
-	<div id="grade7"><a href="#tab_grade7"><img src="assets/default/images/grade7_bw.png" alt="Grade 7" title="grade7"/>Grade 7</a></div>
-	<div id="grade8"><a href="#tab_grade8"><img src="assets/default/images/grade8_bw.png" alt="Grade 8" title="grade8"/>Grade 8</a></div>
-      </div>
-    
-    <div id="admin">
-     
-	<div id="profile"><a href="#tab_profile"><img src="assets/default/images/profile.png" alt="Student Profile" title="My profile"/><br />Student Profile</a></div>
-	<div id="mystuff"><a href="#tab_mystuff"><img src="assets/default/images/mystuff.png" alt="My Stuff" title="My stuff"/><br />My Stuff</a></div>
-	<div id="about"><a href="#tab_about"><img src="assets/default/images/karma_logo.png" width="80px" alt="About Karma" title="about"/><br />About Karma</a></div>
-      
-    </div>
-  </div>
+<div id="admin">
+<ul>
+<li id="profile"><a href="#tab_profile"><img src="assets/default/images/profile.png" alt="Student Profile" title="My profile"/><p>Student Profile</p></a></li>
+<li id="mystuff"><a href="#tab_mystuff"><img src="assets/default/images/mystuff.png" alt="My Stuff" title="My stuff"/><p>My Stuff</p></a></li>
+<li id="about"><a href="#tab_about"><img src="assets/default/images/karma_logo.png"  alt="About Karma" title="About Karma"/><p>About Karma</p></a></li>
+</ul>
+<div class="clear-float">&nbsp;</div>
+</div><!-- end admin -->
 
+</div><!-- end page_container -->
 </body>
 </html>