Merge pull request #151 from prathamesh920/UI-modifications

UI modifications Level 1

46 files changed, 380 insertions, 3234 deletions

diff --git a/yaksh/static/yaksh/css/base.css b/yaksh/static/yaksh/css/base.css
deleted file mode 100644
index 2273263..0000000
--- a/yaksh/static/yaksh/css/base.css
+++ /dev/null
@@ -1,2371 +0,0 @@
-/*!
-Copyright 2012 Twitter, Inc.
-
-Licensed under the Apache License, Version 2.0 (the "License"); you may not use this work except in compliance with the License. You may obtain a copy of the License in the LICENSE file, or at:
-
-Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
-
- * Bootstrap v1.4.0
- *
- * Copyright 2011 Twitter, Inc
- * Licensed under the Apache License v2.0
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Designed and built with all the love in the world @twitter by @mdo and @fat.
- * Date: Sun Dec 25 20:18:31 PST 2011
- */
-/* Reset.less
- * Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).
- * For Online Test Application, this CSS was changed as per the requirements wherever required. ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
-
-html, body {
-  background-color: #eee;
-  margin: 0;
-  padding: 0;
-
-}
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p,
-blockquote,
-pre,
-a,
-abbr,
-acronym,
-address,
-cite,
-code,
-del,
-dfn,
-em,
-img,
-q,
-s,
-samp,
-small,
-strike,
-strong,
-sub,
-sup,
-tt,
-var,
-dd,
-dl,
-dt,
-li,
-ol,
-ul,
-fieldset,
-form,
-label,
-legend,
-button,
-table,
-caption,
-tbody,
-tfoot,
-thead,
-tr,
-th,
-td {
-  margin: 0;
-  padding: 0;
-  border: 0;
-  font-weight: normal;
-  font-style: normal;
-  font-size: 100%;
-  line-height: 1;
-  font-family: serif;
-}
-table {
-  border-collapse: collapse;
-  border-spacing: 0;
-}
-ol, ul {
-  list-style: none;
-}
-q:before,
-q:after,
-blockquote:before,
-blockquote:after {
-  content: "";
-}
-html {
-  overflow-y: scroll;
-  font-size: 100%;
-  -webkit-text-size-adjust: 100%;
-  -ms-text-size-adjust: 100%;
-}
-a:focus {
-  outline: thin dotted;
-}
-a:hover, a:active {
-  outline: 0;
-}
-article,
-aside,
-details,
-figcaption,
-figure,
-footer,
-header,
-hgroup,
-nav,
-section {
-  display: block;
-}
-audio, canvas, video {
-  display: inline-block;
-  *display: inline;
-  *zoom: 1;
-}
-audio:not([controls]) {
-  display: none;
-}
-sub, sup {
-  font-size: 75%;
-  line-height: 0;
-  position: relative;
-  vertical-align: baseline;
-}
-sup {
-  top: -0.5em;
-}
-sub {
-  bottom: -0.25em;
-}
-img {
-  border: 0;
-  -ms-interpolation-mode: bicubic;
-}
-button,
-input,
-select,
-textarea {
-  font-size: 100%;
-  margin: 0;
-  vertical-align: baseline;
-  *vertical-align: middle;
-}
-button, input {
-  line-height: normal;
-  *overflow: visible;
-}
-button::-moz-focus-inner, input::-moz-focus-inner {
-  border: 0;
-  padding: 0;
-}
-button,
-input[type="button"],
-input[type="reset"],
-input[type="submit"] {
-  cursor: pointer;
-  -webkit-appearance: button;
-}
-input[type="search"] {
-  -webkit-appearance: textfield;
-  -webkit-box-sizing: content-box;
-  -moz-box-sizing: content-box;
-  box-sizing: content-box;
-}
-input[type="search"]::-webkit-search-decoration {
-  -webkit-appearance: none;
-}
-textarea {
-  overflow: visible;
-  vertical-align: top;
-}
-/* Variables.less
-* Variables to customize the look and feel of Bootstrap
-* ----------------------------------------------------- */
-/* Mixins.less
-* Snippets of reusable CSS to develop faster and keep code readable
-* ----------------------------------------------------------------- */
-/*
-* Scaffolding
-* Basic and global styles for generating a grid system, structural layout, and page templates
-* ------------------------------------------------------------------------------------------- */
-body {
-  padding-top : 10px;
-  background-color: #eee;
-  margin: 0;
-  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-size: 13px;
-  font-weight: normal;
-  line-height: 18px;
-  color: #404040;
-
-}
-.container {
-  width: 820px;
-  margin-left: auto;
-  margin-right: auto;
-  zoom: 1;
-}
-.container > footer p {
-  text-align: center;
-}
-.container > .content {
-  background-color: #fff;
-  padding: 20px;
-  margin: 0 -20px;
-  -webkit-border-radius: 0 0 6px 6px;
-  -moz-border-radius: 0 0 6px 6px;
-  border-radius: 0 0 6px 6px;
-  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);
-  -moz-box-shadow: 0 1px 2px rgba(0,0,0,.15);
-  box-shadow: 0 1px 2px rgba(0,0,0,.15);
-}
-.content .span10,
-.content .span14{
-  min-height: 475px;
-}
-.content .span4 {
-  margin-left: 0;
-  padding-left: 19px;
-  border-left: 1px solid #eee;
-}
-.topbar .btn {
-  border: 0;
-}
-.page-header {
-  background-color: #f5f5f5;
-  padding: 20px 20px 10px;
-  margin: -20px -20px 20px;
-}
-.container:before, .container:after {
-  display: table;
-  content: "";
-  zoom: 1;
-}
-.container:after {
-  clear: both;
-}
-.container-fluid {
-  position: relative;
-  min-width: 940px;
-  padding-left: 20px;
-  padding-right: 20px;
-  zoom: 1;
-}
-.container-fluid:before, .container-fluid:after {
-  display: table;
-  content: "";
-  zoom: 1;
-}
-.container-fluid:after {
-  clear: both;
-}
-.container-fluid > .sidebar {
-  position: absolute;
-  top: 0;
-  left: 20px;
-  width: 220px;
-}
-.container-fluid > .content {
-  margin-left: 240px;
-}
-a {
-  color: #0069d6;
-  text-decoration: none;
-  line-height: inherit;
-  font-weight: inherit;
-}
-a:hover {
-  color: #00438a;
-  text-decoration: underline;
-}
-.pull-right {
-  float: right;
-}
-.pull-left {
-  float: left;
-}
-.hide {
-  display: none;
-}
-.show {
-  display: block;
-}
-.row {
-  zoom: 1;
-  margin-left: -20px;
-}
-.row:before, .row:after {
-  display: table;
-  content: "";
-  zoom: 1;
-}
-.row:after {
-  clear: both;
-}
-.row > [class*="span"] {
-  display: inline;
-  float: left;
-  margin-left: 20px;
-}
-.span1 {
-  width: 40px;
-}
-.span2 {
-  width: 100px;
-}
-.span3 {
-  width: 160px;
-}
-.span4 {
-  width: 220px;
-}
-.span5 {
-  width: 280px;
-}
-.span6 {
-  width: 340px;
-}
-.span7 {
-  width: 400px;
-}
-.span8 {
-  width: 460px;
-}
-.span9 {
-  width: 520px;
-}
-.span10 {
-  width: 560px;
-}
-.span11 {
-  width: 640px;
-}
-.span12 {
-  width: 700px;
-}
-.span13 {
-  width: 760px;
-}
-.span14 {
-  width: 820px;
-}
-.span15 {
-  width: 880px;
-}
-.span16 {
-  width: 940px;
-}
-.span17 {
-  width: 1000px;
-}
-.span18 {
-  width: 1060px;
-}
-.span19 {
-  width: 1120px;
-}
-.span20 {
-  width: 1180px;
-}
-.span21 {
-  width: 1240px;
-}
-.span22 {
-  width: 1300px;
-}
-.span23 {
-  width: 1360px;
-}
-.span24 {
-  width: 1420px;
-}
-.row > .offset1 {
-  margin-left: 80px;
-}
-.row > .offset2 {
-  margin-left: 140px;
-}
-.row > .offset3 {
-  margin-left: 200px;
-}
-.row > .offset4 {
-  margin-left: 260px;
-}
-.row > .offset5 {
-  margin-left: 320px;
-}
-.row > .offset6 {
-  margin-left: 380px;
-}
-.row > .offset7 {
-  margin-left: 440px;
-}
-.row > .offset8 {
-  margin-left: 500px;
-}
-.row > .offset9 {
-  margin-left: 560px;
-}
-.row > .offset10 {
-  margin-left: 620px;
-}
-.row > .offset11 {
-  margin-left: 680px;
-}
-.row > .offset12 {
-  margin-left: 740px;
-}
-.span-one-third {
-  width: 300px;
-}
-.span-two-thirds {
-  width: 620px;
-}
-.row > .offset-one-third {
-  margin-left: 340px;
-}
-.row > .offset-two-thirds {
-  margin-left: 660px;
-}
-/* Typography.less
-* Headings, body text, lists, code, and more for a versatile and durable typography system
-* ---------------------------------------------------------------------------------------- */
-
-p {
-  font-size: 13px;
-  font-weight: normal;
-  line-height: 18px;
-  margin-bottom: 9px;
-}
-p small {
-  font-size: 11px;
-  color: #bfbfbf;
-}
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  font-weight: bold;
-  color: #404040;
-}
-h1 small,
-h2 small,
-h3 small,
-h4 small,
-h5 small,
-h6 small {
-  color: #bfbfbf;
-}
-h1 {
-  margin-bottom: 18px;
-  font-size: 30px;
-  line-height: 36px;
-}
-h1 small {
-  font-size: 18px;
-}
-h2 {
-  font-size: 24px;
-  line-height: 36px;
-}
-h2 small {
-  font-size: 14px;
-}
-h3,
-h4,
-h5,
-h6 {
-  line-height: 36px;
-
-}
-h3 {
-  font-size: 18px;
-}
-h3 small {
-  font-size: 14px;
-}
-h4 {
-  font-size: 16px;
-}
-h4 small {
-  font-size: 12px;
-}
-h5 {
-  font-size: 14px;
-}
-h6 {
-  font-size: 13px;
-  color: #bfbfbf;
-  text-transform: uppercase;
-}
-ul, ol {
-  margin: 0 0 18px 25px;
-}
-ul ul,
-ul ol,
-ol ol,
-ol ul {
-  margin-bottom: 0;
-}
-ul {
-  list-style: disc;
-}
-ol {
-  list-style: decimal;
-}
-li {
-  line-height: 18px;
-  color: #808080;
-}
-ul.unstyled {
-  list-style: none;
-  margin-left: 0;
-}
-dl {
-  margin-bottom: 18px;
-}
-dl dt, dl dd {
-  line-height: 18px;
-}
-dl dt {
-  font-weight: bold;
-}
-dl dd {
-  margin-left: 9px;
-}
-hr {
-  margin: 20px 0 19px;
-  border: 0;
-  border-bottom: 1px solid;
-}
-strong {
-  font-style: inherit;
-  font-weight: bold;
-}
-em {
-  font-style: italic;
-  font-weight: inherit;
-  line-height: inherit;
-}
-.muted {
-  color: #bfbfbf;
-}
-blockquote {
-  margin-bottom: 18px;
-  border-left: 5px solid #eee;
-  padding-left: 15px;
-}
-blockquote p {
-  font-size: 14px;
-  font-weight: 300;
-  line-height: 18px;
-  margin-bottom: 0;
-}
-blockquote small {
-  display: block;
-  font-size: 12px;
-  font-weight: 300;
-  line-height: 18px;
-  color: #bfbfbf;
-}
-blockquote small:before {
-  content: '\2014 \00A0';
-}
-address {
-  display: block;
-  line-height: 18px;
-  margin-bottom: 18px;
-}
-code, pre {
-  padding: 0 3px 2px;
-  font-family: Monaco, Andale Mono, Courier New, monospace;
-  font-size: 12px;
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  border-radius: 3px;
-}
-code {
-  background-color: #FDE8E8;
-  color: rgba(0, 0, 0, 0.75);
-  padding: 1px 3px;
-}
-pre {
-  background-color: #EAB9B9;
-  color:red;
-  display: block;
-  padding: 8.5px;
-  margin: 0 0 18px;
-  line-height: 18px;
-  font-size: 12px;
-  border: 1px solid #ccc;
-  border: 1px solid rgba(0, 0, 0, 0.15);
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  border-radius: 3px;
-  white-space: pre;
-  white-space: pre-wrap;
-  word-wrap: break-word;
-}
-/* Forms.less
-* Base styles for various input types, form layouts, and states
-* ------------------------------------------------------------- */
-form {
-  margin-bottom: 18px;
-}
-fieldset {
-  margin-bottom: 18px;
-  padding-top: 18px;
-}
-fieldset legend {
-  display: block;
-  padding-left: 150px;
-  font-size: 19.5px;
-  line-height: 1;
-  color: #404040;
-  *padding: 0 0 5px 145px;
-  /* IE6-7 */
-
-  *line-height: 1.5;
-  /* IE6-7 */
-
-}
-form .clearfix {
-  margin-bottom: 18px;
-  zoom: 1;
-}
-form .clearfix:before, form .clearfix:after {
-  display: table;
-  content: "";
-  zoom: 1;
-}
-form .clearfix:after {
-  clear: both;
-}
-label,
-input,
-select,
-textarea {
-  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-size: 13px;
-  font-weight: normal;
-  line-height: normal;
-}
-select
-{
-	width : auto;
-}
-label {
-  padding-top: 6px;
-  font-size: 13px;
-  line-height: 18px;
-  float: left;
-  width: 130px;
-  text-align: left;
-  color: #404040;
-}
-form .input {
-  margin-left: 150px;
-}
-input[type=checkbox], input[type=radio] {
-  cursor: pointer;
-}
-input,
-textarea,
-select,
-.uneditable-input {
-  display: inline-block;
-  width: 210px;
-  height: 18px;
-  padding: 4px;
-  font-size: 13px;
-  line-height: 18px;
-  color: #808080;
-  border: 1px solid #ccc;
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  border-radius: 3px;
-}
-select {
-  padding: initial;
-}
-input[type=checkbox], input[type=radio] {
-  width: auto;
-  height: auto;
-  padding: 0;
-  margin: 3px 0;
-  *margin-top: 0;
-  /* IE6-7 */
-
-  line-height: normal;
-  border: none;
-}
-input[type=file] {
-  background-color: #ffffff;
-  padding: initial;
-  border: initial;
-  line-height: initial;
-  -webkit-box-shadow: none;
-  -moz-box-shadow: none;
-  box-shadow: none;
-}
-input[type=button], input[type=reset], input[type=submit] {
-  width: auto;
-  height: auto;
-}
-select, input[type=file] {
-  height: 27px;
-  *height: auto;
-  line-height: 27px;
-  *margin-top: 4px;
-  /* For IE7, add top margin to align select with labels */
-
-}
-select[multiple] {
-  height: inherit;
-  background-color: #ffffff;
-}
-textarea {
-  height: auto;
-}
-.uneditable-input {
-  background-color: #ffffff;
-  display: block;
-  border-color: #eee;
-  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025);
-  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025);
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025);
-  cursor: not-allowed;
-}
-:-moz-placeholder {
-  color: #bfbfbf;
-}
-::-webkit-input-placeholder {
-  color: #bfbfbf;
-}
-input, textarea {
-  -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
-  -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
-  -ms-transition: border linear 0.2s, box-shadow linear 0.2s;
-  -o-transition: border linear 0.2s, box-shadow linear 0.2s;
-  transition: border linear 0.2s, box-shadow linear 0.2s;
-  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
-  -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
-  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
-}
-input:focus, textarea:focus {
-  outline: 0;
-  border-color: rgba(82, 168, 236, 0.8);
-  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
-  -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
-  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
-}
-input[type=file]:focus, input[type=checkbox]:focus, select:focus {
-  -webkit-box-shadow: none;
-  -moz-box-shadow: none;
-  box-shadow: none;
-  outline: 1px dotted #666;
-}
-form .clearfix.error > label, form .clearfix.error .help-block, form .clearfix.error .help-inline {
-  color: #b94a48;
-}
-form .clearfix.error input, form .clearfix.error textarea {
-  color: #b94a48;
-  border-color: #ee5f5b;
-}
-form .clearfix.error input:focus, form .clearfix.error textarea:focus {
-  border-color: #e9322d;
-  -webkit-box-shadow: 0 0 6px #f8b9b7;
-  -moz-box-shadow: 0 0 6px #f8b9b7;
-  box-shadow: 0 0 6px #f8b9b7;
-}
-form .clearfix.error .input-prepend .add-on, form .clearfix.error .input-append .add-on {
-  color: #b94a48;
-  background-color: #fce6e6;
-  border-color: #b94a48;
-}
-form .clearfix.warning > label, form .clearfix.warning .help-block, form .clearfix.warning .help-inline {
-  color: #c09853;
-}
-form .clearfix.warning input, form .clearfix.warning textarea {
-  color: #c09853;
-  border-color: #ccae64;
-}
-form .clearfix.warning input:focus, form .clearfix.warning textarea:focus {
-  border-color: #be9a3f;
-  -webkit-box-shadow: 0 0 6px #e5d6b1;
-  -moz-box-shadow: 0 0 6px #e5d6b1;
-  box-shadow: 0 0 6px #e5d6b1;
-}
-form .clearfix.warning .input-prepend .add-on, form .clearfix.warning .input-append .add-on {
-  color: #c09853;
-  background-color: #d2b877;
-  border-color: #c09853;
-}
-form .clearfix.success > label, form .clearfix.success .help-block, form .clearfix.success .help-inline {
-  color: #468847;
-}
-form .clearfix.success input, form .clearfix.success textarea {
-  color: #468847;
-  border-color: #57a957;
-}
-form .clearfix.success input:focus, form .clearfix.success textarea:focus {
-  border-color: #458845;
-  -webkit-box-shadow: 0 0 6px #9acc9a;
-  -moz-box-shadow: 0 0 6px #9acc9a;
-  box-shadow: 0 0 6px #9acc9a;
-}
-form .clearfix.success .input-prepend .add-on, form .clearfix.success .input-append .add-on {
-  color: #468847;
-  background-color: #bcddbc;
-  border-color: #468847;
-}
-textarea
-{
-	width : 290px;
-}
-.input-mini,
-input.mini,
-textarea.mini,
-select.mini {
-  width: 60px;
-}
-.input-small,
-input.small,
-textarea.small,
-select.small {
-  width: 90px;
-}
-.input-medium,
-input.medium,
-textarea.medium,
-select.medium {
-  width: 150px;
-}
-.input-large,
-input.large,
-textarea.large,
-select.large {
-  width: 210px;
-}
-.input-xlarge,
-input.xlarge,
-textarea.xlarge,
-select.xlarge {
-  width: 270px;
-}
-.input-xxlarge,
-input.xxlarge,
-textarea.xxlarge,
-select.xxlarge {
-  width: 530px;
-}
-textarea.xxlarge {
-  overflow-y: auto;
-}
-input.span1, textarea.span1 {
-  display: inline-block;
-  float: none;
-  width: 30px;
-  margin-left: 0;
-}
-input.span2, textarea.span2 {
-  display: inline-block;
-  float: none;
-  width: 90px;
-  margin-left: 0;
-}
-input.span3, textarea.span3 {
-  display: inline-block;
-  float: none;
-  width: 150px;
-  margin-left: 0;
-}
-input.span4, textarea.span4 {
-  display: inline-block;
-  float: none;
-  width: 210px;
-  margin-left: 0;
-}
-input.span5, textarea.span5 {
-  display: inline-block;
-  float: none;
-  width: 270px;
-  margin-left: 0;
-}
-input.span6, textarea.span6 {
-  display: inline-block;
-  float: none;
-  width: 330px;
-  margin-left: 0;
-}
-input.span7, textarea.span7 {
-  display: inline-block;
-  float: none;
-  width: 390px;
-  margin-left: 0;
-}
-input.span8, textarea.span8 {
-  display: inline-block;
-  float: none;
-  width: 450px;
-  margin-left: 0;
-}
-input.span9, textarea.span9 {
-  display: inline-block;
-  float: none;
-  width: 510px;
-  margin-left: 0;
-}
-input.span10, textarea.span10 {
-  display: inline-block;
-  float: none;
-  width: 570px;
-  margin-left: 0;
-}
-input.span11, textarea.span11 {
-  display: inline-block;
-  float: none;
-  width: 630px;
-  margin-left: 0;
-}
-input.span12, textarea.span12 {
-  display: inline-block;
-  float: none;
-  width: 690px;
-  margin-left: 0;
-}
-input.span13, textarea.span13 {
-  display: inline-block;
-  float: none;
-  width: 750px;
-  margin-left: 0;
-}
-input.span14, textarea.span14 {
-  display: inline-block;
-  float: none;
-  width: 810px;
-  margin-left: 0;
-}
-input.span15, textarea.span15 {
-  display: inline-block;
-  float: none;
-  width: 870px;
-  margin-left: 0;
-}
-input.span16, textarea.span16 {
-  display: inline-block;
-  float: none;
-  width: 930px;
-  margin-left: 0;
-}
-input[disabled],
-select[disabled],
-textarea[disabled],
-input[readonly],
-select[readonly]{
-  background-color: #f5f5f5;
-  border-color: #ddd;
-  cursor: not-allowed;
-}
-.actions {
-  background: #f5f5f5;
-  margin-top: 18px;
-  margin-bottom: 18px;
-  padding: 17px 20px 18px 150px;
-  border-top: 1px solid #ddd;
-  -webkit-border-radius: 0 0 3px 3px;
-  -moz-border-radius: 0 0 3px 3px;
-  border-radius: 0 0 3px 3px;
-}
-.actions .secondary-action {
-  float: right;
-}
-.actions .secondary-action a {
-  line-height: 30px;
-}
-.actions .secondary-action a:hover {
-  text-decoration: underline;
-}
-.help-inline, .help-block {
-  font-size: 13px;
-  line-height: 18px;
-  color: #bfbfbf;
-}
-.help-inline {
-  padding-left: 5px;
-  *position: relative;
-  /* IE6-7 */
-
-  *top: -5px;
-  /* IE6-7 */
-
-}
-.help-block {
-  display: block;
-  max-width: 600px;
-}
-.inline-inputs {
-  color: #808080;
-}
-.inline-inputs span {
-  padding: 0 2px 0 1px;
-}
-.input-prepend input, .input-append input {
-  -webkit-border-radius: 0 3px 3px 0;
-  -moz-border-radius: 0 3px 3px 0;
-  border-radius: 0 3px 3px 0;
-}
-.input-prepend .add-on, .input-append .add-on {
-  position: relative;
-  background: #f5f5f5;
-  border: 1px solid #ccc;
-  z-index: 2;
-  float: left;
-  display: block;
-  width: auto;
-  min-width: 16px;
-  height: 18px;
-  padding: 4px 4px 4px 5px;
-  margin-right: -1px;
-  font-weight: normal;
-  line-height: 18px;
-  color: #bfbfbf;
-  text-align: center;
-  text-shadow: 0 1px 0 #ffffff;
-  -webkit-border-radius: 3px 0 0 3px;
-  -moz-border-radius: 3px 0 0 3px;
-  border-radius: 3px 0 0 3px;
-}
-.input-prepend .active, .input-append .active {
-  background: #a9dba9;
-  border-color: #46a546;
-}
-.input-prepend .add-on {
-  *margin-top: 1px;
-  /* IE6-7 */
-
-}
-.input-append input {
-  float: left;
-  -webkit-border-radius: 3px 0 0 3px;
-  -moz-border-radius: 3px 0 0 3px;
-  border-radius: 3px 0 0 3px;
-}
-.input-append .add-on {
-  -webkit-border-radius: 0 3px 3px 0;
-  -moz-border-radius: 0 3px 3px 0;
-  border-radius: 0 3px 3px 0;
-  margin-right: 0;
-  margin-left: -1px;
-}
-.inputs-list {
-  margin: 0 0 5px;
-  width: 100%;
-}
-.inputs-list li {
-  display: block;
-  padding: 0;
-  width: 100%;
-}
-.inputs-list label {
-  display: block;
-  float: none;
-  width: auto;
-  padding: 0;
-  margin-left: 20px;
-  line-height: 18px;
-  text-align: left;
-  white-space: normal;
-}
-.inputs-list label strong {
-  color: #808080;
-}
-.inputs-list label small {
-  font-size: 11px;
-  font-weight: normal;
-}
-.inputs-list .inputs-list {
-  margin-left: 25px;
-  margin-bottom: 10px;
-  padding-top: 0;
-}
-.inputs-list:first-child {
-  padding-top: 6px;
-}
-.inputs-list li + li {
-  padding-top: 2px;
-}
-.inputs-list input[type=radio], .inputs-list input[type=checkbox] {
-  margin-bottom: 0;
-  margin-left: -20px;
-  float: left;
-}
-.form-stacked {
-  padding-left: 20px;
-}
-.form-stacked fieldset {
-  padding-top: 9px;
-}
-.form-stacked legend {
-  padding-left: 0;
-}
-.form-stacked label {
-  display: block;
-  float: none;
-  width: auto;
-  font-weight: bold;
-  text-align: left;
-  line-height: 20px;
-  padding-top: 0;
-}
-.form-stacked .clearfix {
-  margin-bottom: 9px;
-}
-.form-stacked .clearfix div.input {
-  margin-left: 0;
-}
-.form-stacked .inputs-list {
-  margin-bottom: 0;
-}
-.form-stacked .inputs-list li {
-  padding-top: 0;
-}
-.form-stacked .inputs-list li label {
-  font-weight: normal;
-  padding-top: 0;
-}
-.form-stacked div.clearfix.error {
-  padding-top: 10px;
-  padding-bottom: 10px;
-  padding-left: 10px;
-  margin-top: 0;
-  margin-left: -10px;
-}
-.form-stacked .actions {
-  margin-left: -20px;
-  padding-left: 20px;
-}
-/*
-* Tables.less
-* Tables for, you guessed it, tabular data
-* ---------------------------------------- */
-table {
-  width: 100%;
-  margin-bottom: 18px;
-  padding: 0;
-  font-size: 13px;
-  border-collapse: collapse;
-}
-table th, table td {
-  padding: 10px 10px 9px;
-  line-height: 18px;
-  text-align: center;
-}
-table th {
-  padding-top: 9px;
-  font-weight: bold;
-  vertical-align: middle;
-}
-table td {
-  vertical-align: top;
-  /*border-top: 1px solid #ddd;*/
-}
-table tbody th {
-/* border-top: 1px solid #ddd;*/
-  vertical-align: top;
-}
-.condensed-table th, .condensed-table td {
-  padding: 5px 5px 4px;
-}
-.bordered-table {
-  border: 1px solid #ddd;
-  border-collapse: separate;
-  *border-collapse: collapse;
-  /* IE7, collapse table to remove spacing */
-
-  -webkit-border-radius: 4px;
-  -moz-border-radius: 4px;
-  border-radius: 4px;
-}
-.bordered-table th + th, .bordered-table td + td, .bordered-table th + td {
-  border-left: 1px solid #ddd;
-}
-.bordered-table thead tr:first-child th:first-child, .bordered-table tbody tr:first-child td:first-child {
-  -webkit-border-radius: 4px 0 0 0;
-  -moz-border-radius: 4px 0 0 0;
-  border-radius: 4px 0 0 0;
-}
-.bordered-table thead tr:first-child th:last-child, .bordered-table tbody tr:first-child td:last-child {
-  -webkit-border-radius: 0 4px 0 0;
-  -moz-border-radius: 0 4px 0 0;
-  border-radius: 0 4px 0 0;
-}
-.bordered-table tbody tr:last-child td:first-child {
-  -webkit-border-radius: 0 0 0 4px;
-  -moz-border-radius: 0 0 0 4px;
-  border-radius: 0 0 0 4px;
-}
-.bordered-table tbody tr:last-child td:last-child {
-  -webkit-border-radius: 0 0 4px 0;
-  -moz-border-radius: 0 0 4px 0;
-  border-radius: 0 0 4px 0;
-}
-table .span1 {
-  width: 20px;
-}
-table .span2 {
-  width: 60px;
-}
-table .span3 {
-  width: 100px;
-}
-table .span4 {
-  width: 140px;
-}
-table .span5 {
-  width: 180px;
-}
-table .span6 {
-  width: 220px;
-}
-table .span7 {
-  width: 260px;
-}
-table .span8 {
-  width: 300px;
-}
-table .span9 {
-  width: 340px;
-}
-table .span10 {
-  width: 380px;
-}
-table .span11 {
-  width: 420px;
-}
-table .span12 {
-  width: 460px;
-}
-table .span13 {
-  width: 500px;
-}
-table .span14 {
-  width: 540px;
-}
-table .span15 {
-  width: 580px;
-}
-table .span16 {
-  width: 620px;
-}
-.zebra-striped tbody tr:nth-child(odd) td, .zebra-striped tbody tr:nth-child(odd) th {
-  background-color: #f9f9f9;
-}
-.zebra-striped tbody tr:hover td, .zebra-striped tbody tr:hover th {
-  background-color: #f5f5f5;
-}
-table .header {
-  cursor: pointer;
-}
-table .header:after {
-  content: "";
-  float: right;
-  margin-top: 7px;
-  border-width: 0 4px 4px;
-  border-style: solid;
-  border-color: #000 transparent;
-  visibility: hidden;
-}
-table .headerSortUp, table .headerSortDown {
-  background-color: rgba(141, 192, 219, 0.25);
-  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
-}
-table .header:hover:after {
-  visibility: visible;
-}
-table .headerSortDown:after, table .headerSortDown:hover:after {
-  visibility: visible;
-  filter: alpha(opacity=60);
-  -khtml-opacity: 0.6;
-  -moz-opacity: 0.6;
-  opacity: 0.6;
-}
-table .headerSortUp:after {
-  border-bottom: none;
-  border-left: 4px solid transparent;
-  border-right: 4px solid transparent;
-  border-top: 4px solid #000;
-  visibility: visible;
-  -webkit-box-shadow: none;
-  -moz-box-shadow: none;
-  box-shadow: none;
-  filter: alpha(opacity=60);
-  -khtml-opacity: 0.6;
-  -moz-opacity: 0.6;
-  opacity: 0.6;
-}
-table .blue {
-  color: #049cdb;
-  border-bottom-color: #049cdb;
-}
-table .headerSortUp.blue, table .headerSortDown.blue {
-  background-color: #ade6fe;
-}
-table .green {
-  color: #46a546;
-  border-bottom-color: #46a546;
-}
-table .headerSortUp.green, table .headerSortDown.green {
-  background-color: #cdeacd;
-}
-table .red {
-  color: #9d261d;
-  border-bottom-color: #9d261d;
-}
-table .headerSortUp.red, table .headerSortDown.red {
-  background-color: #f4c8c5;
-}
-table .yellow {
-  color: #ffc40d;
-  border-bottom-color: #ffc40d;
-}
-table .headerSortUp.yellow, table .headerSortDown.yellow {
-  background-color: #fff6d9;
-}
-table .orange {
-  color: #f89406;
-  border-bottom-color: #f89406;
-}
-.center1
-{
-margin-left: auto;
-margin-right: auto;
-}
-table .headerSortUp.orange, table .headerSortDown.orange {
-  background-color: #fee9cc;
-}
-table .purple {
-  color: #7a43b6;
-  border-bottom-color: #7a43b6;
-}
-table .headerSortUp.purple, table .headerSortDown.purple {
-  background-color: #e2d5f0;
-}
-/* Patterns.less
-* Repeatable UI elements outside the base styles provided from the scaffolding
-* ---------------------------------------------------------------------------- */
-.topbar {
-  height: 40px;
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  z-index: 10000;
-  overflow: visible;
-}
-.topbar a {
-  color: #bfbfbf;
-  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
-}
-.topbar h3 a:hover, .topbar .brand:hover, .topbar ul .active > a {
-  background-color: #333;
-  background-color: rgba(255, 255, 255, 0.05);
-  color: #ffffff;
-  text-decoration: none;
-}
-.topbar h3 {
-  position: relative;
-}
-.topbar h3 a, .topbar .brand {
-  float: left;
-  display: block;
-  padding: 8px 20px 12px;
-  margin-left: -20px;
-  color: #ffffff;
-  font-size: 20px;
-  font-weight: 200;
-  line-height: 1;
-}
-.topbar p {
-  margin: 0;
-  line-height: 40px;
-}
-.topbar p a:hover {
-  background-color: transparent;
-  color: #ffffff;
-}
-.topbar form {
-  float: left;
-  margin: 5px 0 0 0;
-  position: relative;
-  filter: alpha(opacity=100);
-  -khtml-opacity: 1;
-  -moz-opacity: 1;
-  opacity: 1;
-}
-.topbar form.pull-right {
-  float: right;
-}
-.topbar input {
-  background-color: #444;
-  background-color: rgba(255, 255, 255, 0.3);
-  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-size: normal;
-  font-weight: 13px;
-  line-height: 1;
-  padding: 4px 9px;
-  color: #ffffff;
-  color: rgba(255, 255, 255, 0.75);
-  border: 1px solid #111;
-  -webkit-border-radius: 4px;
-  -moz-border-radius: 4px;
-  border-radius: 4px;
-  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 0px rgba(255, 255, 255, 0.25);
-  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 0px rgba(255, 255, 255, 0.25);
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 0px rgba(255, 255, 255, 0.25);
-  -webkit-transition: none;
-  -moz-transition: none;
-  -ms-transition: none;
-  -o-transition: none;
-  transition: none;
-}
-.topbar input:-moz-placeholder {
-  color: #e6e6e6;
-}
-.topbar input::-webkit-input-placeholder {
-  color: #e6e6e6;
-}
-.topbar input:hover {
-  background-color: #bfbfbf;
-  background-color: rgba(255, 255, 255, 0.5);
-  color: #ffffff;
-}
-.topbar input:focus, .topbar input.focused {
-  outline: 0;
-  background-color: #ffffff;
-  color: #404040;
-  text-shadow: 0 1px 0 #ffffff;
-  border: 0;
-  padding: 5px 10px;
-  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
-  -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
-  box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
-}
-.topbar-inner, .topbar .fill {
-  background-color: #222;
-  background-color: #222222;
-  background-repeat: repeat-x;
-  background-image: -khtml-gradient(linear, left top, left bottom, from(#333333), to(#222222));
-  background-image: -moz-linear-gradient(top, #333333, #222222);
-  background-image: -ms-linear-gradient(top, #333333, #222222);
-  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #222222));
-  background-image: -webkit-linear-gradient(top, #333333, #222222);
-  background-image: -o-linear-gradient(top, #333333, #222222);
-  background-image: linear-gradient(top, #333333, #222222);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0);
-  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
-  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
-}
-.topbar div > ul, .nav {
-  display: block;
-  float: left;
-  margin: 0 10px 0 0;
-  position: relative;
-  left: 0;
-}
-.topbar div > ul > li, .nav > li {
-  display: block;
-  float: left;
-}
-.topbar div > ul a, .nav a {
-  display: block;
-  float: none;
-  padding: 10px 10px 11px;
-  line-height: 19px;
-  text-decoration: none;
-}
-.topbar div > ul a:hover, .nav a:hover {
-  color: #ffffff;
-  text-decoration: none;
-}
-.topbar div > ul .active > a, .nav .active > a {
-  background-color: #222;
-  background-color: rgba(0, 0, 0, 0.5);
-}
-.topbar div > ul.secondary-nav, .nav.secondary-nav {
-  float: right;
-  margin-left: 10px;
-  margin-right: 0;
-}
-.topbar div > ul.secondary-nav .menu-dropdown,
-.nav.secondary-nav .menu-dropdown,
-.topbar div > ul.secondary-nav .dropdown-menu,
-.nav.secondary-nav .dropdown-menu {
-  right: 0;
-  border: 0;
-}
-.topbar div > ul a.menu:hover,
-.nav a.menu:hover,
-.topbar div > ul li.open .menu,
-.nav li.open .menu,
-.topbar div > ul .dropdown-toggle:hover,
-.nav .dropdown-toggle:hover,
-.topbar div > ul .dropdown.open .dropdown-toggle,
-.nav .dropdown.open .dropdown-toggle {
-  background: #444;
-  background: rgba(255, 255, 255, 0.05);
-}
-.topbar div > ul .menu-dropdown,
-.nav .menu-dropdown,
-.topbar div > ul .dropdown-menu,
-.nav .dropdown-menu {
-  background-color: #333;
-}
-.topbar div > ul .menu-dropdown a.menu,
-.nav .menu-dropdown a.menu,
-.topbar div > ul .dropdown-menu a.menu,
-.nav .dropdown-menu a.menu,
-.topbar div > ul .menu-dropdown .dropdown-toggle,
-.nav .menu-dropdown .dropdown-toggle,
-.topbar div > ul .dropdown-menu .dropdown-toggle,
-.nav .dropdown-menu .dropdown-toggle {
-  color: #ffffff;
-}
-.topbar div > ul .menu-dropdown a.menu.open,
-.nav .menu-dropdown a.menu.open,
-.topbar div > ul .dropdown-menu a.menu.open,
-.nav .dropdown-menu a.menu.open,
-.topbar div > ul .menu-dropdown .dropdown-toggle.open,
-.nav .menu-dropdown .dropdown-toggle.open,
-.topbar div > ul .dropdown-menu .dropdown-toggle.open,
-.nav .dropdown-menu .dropdown-toggle.open {
-  background: #444;
-  background: rgba(255, 255, 255, 0.05);
-}
-.topbar div > ul .menu-dropdown li a,
-.nav .menu-dropdown li a,
-.topbar div > ul .dropdown-menu li a,
-.nav .dropdown-menu li a {
-  color: #999;
-  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
-}
-.topbar div > ul .menu-dropdown li a:hover,
-.nav .menu-dropdown li a:hover,
-.topbar div > ul .dropdown-menu li a:hover,
-.nav .dropdown-menu li a:hover {
-  background-color: #191919;
-  background-repeat: repeat-x;
-  background-image: -khtml-gradient(linear, left top, left bottom, from(#292929), to(#191919));
-  background-image: -moz-linear-gradient(top, #292929, #191919);
-  background-image: -ms-linear-gradient(top, #292929, #191919);
-  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #292929), color-stop(100%, #191919));
-  background-image: -webkit-linear-gradient(top, #292929, #191919);
-  background-image: -o-linear-gradient(top, #292929, #191919);
-  background-image: linear-gradient(top, #292929, #191919);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#292929', endColorstr='#191919', GradientType=0);
-  color: #ffffff;
-}
-.topbar div > ul .menu-dropdown .active a,
-.nav .menu-dropdown .active a,
-.topbar div > ul .dropdown-menu .active a,
-.nav .dropdown-menu .active a {
-  color: #ffffff;
-}
-.topbar div > ul .menu-dropdown .divider,
-.nav .menu-dropdown .divider,
-.topbar div > ul .dropdown-menu .divider,
-.nav .dropdown-menu .divider {
-  background-color: #222;
-  border-color: #444;
-}
-.topbar ul .menu-dropdown li a, .topbar ul .dropdown-menu li a {
-  padding: 4px 15px;
-}
-li.menu, .dropdown {
-  position: relative;
-}
-a.menu:after, .dropdown-toggle:after {
-  width: 0;
-  height: 0;
-  display: inline-block;
-  content: "↓";
-  text-indent: -99999px;
-  vertical-align: top;
-  margin-top: 8px;
-  margin-left: 4px;
-  border-left: 4px solid transparent;
-  border-right: 4px solid transparent;
-  border-top: 4px solid #ffffff;
-  filter: alpha(opacity=50);
-  -khtml-opacity: 0.5;
-  -moz-opacity: 0.5;
-  opacity: 0.5;
-}
-.menu-dropdown, .dropdown-menu {
-  background-color: #ffffff;
-  float: left;
-  display: none;
-  position: absolute;
-  top: 40px;
-  z-index: 900;
-  min-width: 160px;
-  max-width: 220px;
-  _width: 160px;
-  margin-left: 0;
-  margin-right: 0;
-  padding: 6px 0;
-  zoom: 1;
-  border-color: #999;
-  border-color: rgba(0, 0, 0, 0.2);
-  border-style: solid;
-  border-width: 0 1px 1px;
-  -webkit-border-radius: 0 0 6px 6px;
-  -moz-border-radius: 0 0 6px 6px;
-  border-radius: 0 0 6px 6px;
-  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
-  -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
-  -webkit-background-clip: padding-box;
-  -moz-background-clip: padding-box;
-  background-clip: padding-box;
-}
-.menu-dropdown li, .dropdown-menu li {
-  float: none;
-  display: block;
-  background-color: none;
-}
-.menu-dropdown .divider, .dropdown-menu .divider {
-  height: 1px;
-  margin: 5px 0;
-  overflow: hidden;
-  background-color: #eee;
-  border-bottom: 1px solid #ffffff;
-}
-.topbar .dropdown-menu a, .dropdown-menu a {
-  display: block;
-  padding: 4px 15px;
-  clear: both;
-  font-weight: normal;
-  line-height: 18px;
-  color: #808080;
-  text-shadow: 0 1px 0 #ffffff;
-}
-.topbar .dropdown-menu a:hover,
-.dropdown-menu a:hover,
-.topbar .dropdown-menu a.hover,
-.dropdown-menu a.hover {
-  background-color: #dddddd;
-  background-repeat: repeat-x;
-  background-image: -khtml-gradient(linear, left top, left bottom, from(#eeeeee), to(#dddddd));
-  background-image: -moz-linear-gradient(top, #eeeeee, #dddddd);
-  background-image: -ms-linear-gradient(top, #eeeeee, #dddddd);
-  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #dddddd));
-  background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd);
-  background-image: -o-linear-gradient(top, #eeeeee, #dddddd);
-  background-image: linear-gradient(top, #eeeeee, #dddddd);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dddddd', GradientType=0);
-  color: #404040;
-  text-decoration: none;
-  -webkit-box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.025), inset 0 -1px rgba(0, 0, 0, 0.025);
-  -moz-box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.025), inset 0 -1px rgba(0, 0, 0, 0.025);
-  box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.025), inset 0 -1px rgba(0, 0, 0, 0.025);
-}
-footer {
-  margin-top: 17px;
-  padding-top: 17px;
-}
-.page-header {
-  margin-bottom: 17px;
-  border-bottom: 1px solid #ddd;
-  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
-  -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
-  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
-}
-.page-header h3 {
-  margin-top: 20px;
-  margin-bottom : -17px;
-}
-.btn.danger,
-.alert-message.danger,
-.btn.danger:hover,
-.alert-message.danger:hover,
-.btn.error,
-.alert-message.error,
-.btn.error:hover,
-.alert-message.error:hover,
-.btn.success,
-.alert-message.success,
-.btn.success:hover,
-.alert-message.success:hover,
-.btn.info,
-.alert-message.info,
-.btn.info:hover,
-.alert-message.info:hover {
-  color: #ffffff;
-}
-.btn .close, .alert-message .close {
-  font-family: Arial, sans-serif;
-  line-height: 18px;
-}
-.btn-mini {
-  padding: 2px 6px;
-  font-size: 15px;
-  line-height: 16px;
-}
-.btn.danger,
-.alert-message.danger,
-.btn.error,
-.alert-message.error {
-  background-color: #c43c35;
-  background-repeat: repeat-x;
-  background-image: -khtml-gradient(linear, left top, left bottom, from(#ee5f5b), to(#c43c35));
-  background-image: -moz-linear-gradient(top, #ee5f5b, #c43c35);
-  background-image: -ms-linear-gradient(top, #ee5f5b, #c43c35);
-  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ee5f5b), color-stop(100%, #c43c35));
-  background-image: -webkit-linear-gradient(top, #ee5f5b, #c43c35);
-  background-image: -o-linear-gradient(top, #ee5f5b, #c43c35);
-  background-image: linear-gradient(top, #ee5f5b, #c43c35);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ee5f5b', endColorstr='#c43c35', GradientType=0);
-  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
-  border-color: #c43c35 #c43c35 #882a25;
-  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
-}
-.btn.success, .alert-message.success {
-  background-color: #57a957;
-  background-repeat: repeat-x;
-  background-image: -khtml-gradient(linear, left top, left bottom, from(#62c462), to(#57a957));
-  background-image: -moz-linear-gradient(top, #62c462, #57a957);
-  background-image: -ms-linear-gradient(top, #62c462, #57a957);
-  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #62c462), color-stop(100%, #57a957));
-  background-image: -webkit-linear-gradient(top, #62c462, #57a957);
-  background-image: -o-linear-gradient(top, #62c462, #57a957);
-  background-image: linear-gradient(top, #62c462, #57a957);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#62c462', endColorstr='#57a957', GradientType=0);
-  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
-  border-color: #57a957 #57a957 #3d773d;
-  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
-}
-.btn.info, .alert-message.info {
-  background-color: #339bb9;
-  background-repeat: repeat-x;
-  background-image: -khtml-gradient(linear, left top, left bottom, from(#5bc0de), to(#339bb9));
-  background-image: -moz-linear-gradient(top, #5bc0de, #339bb9);
-  background-image: -ms-linear-gradient(top, #5bc0de, #339bb9);
-  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5bc0de), color-stop(100%, #339bb9));
-  background-image: -webkit-linear-gradient(top, #5bc0de, #339bb9);
-  background-image: -o-linear-gradient(top, #5bc0de, #339bb9);
-  background-image: linear-gradient(top, #5bc0de, #339bb9);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5bc0de', endColorstr='#339bb9', GradientType=0);
-  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
-  border-color: #339bb9 #339bb9 #22697d;
-  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
-}
-.btn {
-  cursor: pointer;
-  display: inline-block;
-  background-color: #e6e6e6;
-  background-repeat: no-repeat;
-  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
-  background-image: -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
-  background-image: -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
-  background-image: -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
-  background-image: -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
-  background-image: linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);
-  padding: 5px 14px 6px;
-  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
-  color: #333;
-  font-size: 13px;
-  line-height: normal;
-  border: 1px solid #ccc;
-  border-bottom-color: #bbb;
-  -webkit-border-radius: 4px;
-  -moz-border-radius: 4px;
-  border-radius: 4px;
-  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-  -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-  -webkit-transition: 0.1s linear all;
-  -moz-transition: 0.1s linear all;
-  -ms-transition: 0.1s linear all;
-  -o-transition: 0.1s linear all;
-  transition: 0.1s linear all;
-}
-.btn:hover {
-  background-position: 0 -15px;
-  color: #333;
-  text-decoration: none;
-}
-.btn:focus {
-  outline: 1px dotted #666;
-}
-.btn.primary {
-  color: #ffffff;
-  background-color: #0064cd;
-  background-repeat: repeat-x;
-  background-image: -khtml-gradient(linear, left top, left bottom, from(#049cdb), to(#0064cd));
-  background-image: -moz-linear-gradient(top, #049cdb, #0064cd);
-  background-image: -ms-linear-gradient(top, #049cdb, #0064cd);
-  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #049cdb), color-stop(100%, #0064cd));
-  background-image: -webkit-linear-gradient(top, #049cdb, #0064cd);
-  background-image: -o-linear-gradient(top, #049cdb, #0064cd);
-  background-image: linear-gradient(top, #049cdb, #0064cd);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#049cdb', endColorstr='#0064cd', GradientType=0);
-  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
-  border-color: #0064cd #0064cd #003f81;
-  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
-}
-.btn.active, .btn:active {
-  -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05);
-  -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05);
-  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05);
-}
-.btn.disabled {
-  cursor: default;
-  background-image: none;
-  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
-  filter: alpha(opacity=65);
-  -khtml-opacity: 0.65;
-  -moz-opacity: 0.65;
-  opacity: 0.65;
-  -webkit-box-shadow: none;
-  -moz-box-shadow: none;
-  box-shadow: none;
-}
-.btn[disabled] {
-  cursor: default;
-  background-image: none;
-  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
-  filter: alpha(opacity=65);
-  -khtml-opacity: 0.65;
-  -moz-opacity: 0.65;
-  opacity: 0.65;
-  -webkit-box-shadow: none;
-  -moz-box-shadow: none;
-  box-shadow: none;
-}
-.btn.large {
-  font-size: 15px;
-  line-height: normal;
-  padding: 9px 14px 9px;
-  -webkit-border-radius: 6px;
-  -moz-border-radius: 6px;
-  border-radius: 6px;
-}
-.btn.small {
-  padding: 7px 9px 7px;
-  font-size: 11px;
-}
-:root .alert-message, :root .btn {
-  border-radius: 0 \0;
-}
-.alert {
-  padding: 8px 35px 8px 14px;
-  margin-bottom: 18px;
-  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
-  background-color: #fcf8e3;
-  border: 1px solid #fbeed5;
-  -webkit-border-radius: 4px;
-  -moz-border-radius: 4px;
-  border-radius: 4px;
-}
-.alert, .alert-heading {
-  color: #c09853;
-}
-.alert .close {
-  position: relative;
-  top: -2px;
-  right: -21px;
-  line-height: 18px;
-}
-.alert-success {
-  background-color: #dff0d8;
-  border-color: #d6e9c6;
-}
-.alert-success, .alert-success .alert-heading {
-  color: #468847;
-}
-.alert-danger, .alert-error {
-  background-color: #f2dede;
-  border-color: #eed3d7;
-}
-.alert-danger,
-.alert-error,
-.alert-danger .alert-heading,
-.alert-error .alert-heading {
-  color: #b94a48;
-}
-.alert-info {
-  background-color: #d9edf7;
-  border-color: #bce8f1;
-}
-.alert-info, .alert-info .alert-heading {
-  color: #3a87ad;
-}
-.alert-block {
-  padding-top: 14px;
-  padding-bottom: 14px;
-}
-.alert-block > p, .alert-block > ul {
-  margin-bottom: 0;
-}
-.alert-block p + p {
-  margin-top: 5px;
-}
-
-button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
-  padding: 0;
-  border: 0;
-}
-.alert-message {
-  position: relative;
-  padding: 7px 15px;
-  margin-bottom: 18px;
-  color: #404040;
-  background-color: #eedc94;
-  background-repeat: repeat-x;
-  background-image: -khtml-gradient(linear, left top, left bottom, from(#fceec1), to(#eedc94));
-  background-image: -moz-linear-gradient(top, #fceec1, #eedc94);
-  background-image: -ms-linear-gradient(top, #fceec1, #eedc94);
-  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fceec1), color-stop(100%, #eedc94));
-  background-image: -webkit-linear-gradient(top, #fceec1, #eedc94);
-  background-image: -o-linear-gradient(top, #fceec1, #eedc94);
-  background-image: linear-gradient(top, #fceec1, #eedc94);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fceec1', endColorstr='#eedc94', GradientType=0);
-  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
-  border-color: #eedc94 #eedc94 #e4c652;
-  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
-  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
-  border-width: 1px;
-  border-style: solid;
-  -webkit-border-radius: 4px;
-  -moz-border-radius: 4px;
-  border-radius: 4px;
-  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
-  -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
-}
-.alert-message .close {
-  margin-top: 1px;
-  *margin-top: 0;
-}
-.alert-message a {
-  font-weight: bold;
-  color: #404040;
-}
-.alert-message.danger p a,
-.alert-message.error p a,
-.alert-message.success p a,
-.alert-message.info p a {
-  color: #ffffff;
-}
-.alert-message h5 {
-  line-height: 18px;
-}
-.alert-message p {
-  margin-bottom: 0;
-}
-.alert-message div {
-  margin-top: 5px;
-  margin-bottom: 2px;
-  line-height: 28px;
-}
-.alert-message .btn {
-  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
-  -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
-  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
-}
-.alert-message.block-message {
-  background-image: none;
-  background-color: #fdf5d9;
-  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
-  padding: 14px;
-  border-color: #fceec1;
-  -webkit-box-shadow: none;
-  -moz-box-shadow: none;
-  box-shadow: none;
-}
-.alert-message.block-message ul, .alert-message.block-message p {
-  margin-right: 30px;
-}
-.alert-message.block-message ul {
-  margin-bottom: 0;
-}
-.alert-message.block-message li {
-  color: #404040;
-}
-.alert-message.block-message .alert-actions {
-  margin-top: 5px;
-}
-.alert-message.block-message.error, .alert-message.block-message.success, .alert-message.block-message.info {
-  color: #404040;
-  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
-}
-.alert-message.block-message.error {
-  background-color: #fddfde;
-  border-color: #fbc7c6;
-}
-.alert-message.block-message.success {
-  background-color: #d1eed1;
-  border-color: #bfe7bf;
-}
-.alert-message.block-message.info {
-  background-color: #ddf4fb;
-  border-color: #c6edf9;
-}
-.alert-message.block-message.danger p a,
-.alert-message.block-message.error p a,
-.alert-message.block-message.success p a,
-.alert-message.block-message.info p a {
-  color: #404040;
-}
-.label {
-  padding: 1px 3px 2px;
-  font-size: 9.75px;
-  font-weight: bold;
-  color: #ffffff;
-  text-transform: uppercase;
-  white-space: nowrap;
-  background-color: #bfbfbf;
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  border-radius: 3px;
-  text-shadow: none;
-}
-.label.important {
-  background-color: #c43c35;
-}
-.label.warning {
-  background-color: #f89406;
-}
-.label.success {
-  background-color: #46a546;
-}
-.label.notice {
-  background-color: #62cffc;
-}
-.well {
-  background-color: #f5f5f5;
-  margin-bottom: 20px;
-  padding: 19px;
-  min-height: 20px;
-  border: 1px solid #eee;
-  border: 1px solid rgba(0, 0, 0, 0.05);
-  -webkit-border-radius: 4px;
-  -moz-border-radius: 4px;
-  border-radius: 4px;
-  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
-  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
-}
-.well blockquote {
-  border-color: #ddd;
-  border-color: rgba(0, 0, 0, 0.15);
-}
-.modal-backdrop {
-  background-color: #000000;
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  z-index: 10000;
-}
-.modal-backdrop.fade {
-  opacity: 0;
-}
-.modal-backdrop, .modal-backdrop.fade.in {
-  filter: alpha(opacity=80);
-  -khtml-opacity: 0.8;
-  -moz-opacity: 0.8;
-  opacity: 0.8;
-}
-.modal {
-  position: fixed;
-  top: 10%;
-  left: 50%;
-  z-index: 1050;
-  width: 560px;
-  margin-left: -280px;
-  background-color: #ffffff;
-  border: 1px solid #999;
-  border: 1px solid rgba(0, 0, 0, 0.3);
-  *border: 1px solid #999;
-  -webkit-border-radius: 6px;
-     -moz-border-radius: 6px;
-          border-radius: 6px;
-  outline: none;
-  -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
-     -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
-          box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
-  -webkit-background-clip: padding-box;
-     -moz-background-clip: padding-box;
-          background-clip: padding-box;
-}
-.modal.fade {
-  top: -25%;
-  -webkit-transition: opacity 0.3s linear, top 0.3s ease-out;
-     -moz-transition: opacity 0.3s linear, top 0.3s ease-out;
-       -o-transition: opacity 0.3s linear, top 0.3s ease-out;
-          transition: opacity 0.3s linear, top 0.3s ease-out;
-}
-
-.modal.fade.in {
-  top: 10%;
-}
-
-.modal-header {
-  padding: 9px 15px;
-  border-bottom: 1px solid #eee;
-}
-
-.modal-header .close {
-  margin-top: 2px;
-}
-
-.modal-header h3 {
-  margin: 0;
-  line-height: 30px;
-}
-
-.modal-body {
-  position: relative;
-  max-height: 400px;
-  padding: 15px;
-  overflow-y: auto;
-}
-
-.modal-form {
-  margin-bottom: 0;
-}
-
-.modal-footer {
-  padding: 14px 15px 15px;
-  margin-bottom: 0;
-  text-align: right;
-  background-color: #f5f5f5;
-  border-top: 1px solid #ddd;
-  -webkit-border-radius: 0 0 6px 6px;
-     -moz-border-radius: 0 0 6px 6px;
-          border-radius: 0 0 6px 6px;
-  *zoom: 1;
-  -webkit-box-shadow: inset 0 1px 0 #ffffff;
-     -moz-box-shadow: inset 0 1px 0 #ffffff;
-          box-shadow: inset 0 1px 0 #ffffff;
-}
-
-.modal-footer:before,
-.modal-footer:after {
-  display: table;
-  line-height: 0;
-  content: "";
-}
-
-.modal-footer:after {
-  clear: both;
-}
-
-.modal-footer .btn + .btn {
-  margin-bottom: 0;
-  margin-left: 5px;
-}
-
-.modal-footer .btn-group .btn + .btn {
-  margin-left: -1px;
-}
-
-.modal-footer .btn-block + .btn-block {
-  margin-left: 0;
-}
-.tabs, .pills {
-  margin: 0 0 18px;
-  padding: 0;
-  list-style: none;
-  zoom: 1;
-}
-.tabs:before,
-.pills:before,
-.tabs:after,
-.pills:after {
-  display: table;
-  content: "";
-  zoom: 1;
-}
-.tabs:after, .pills:after {
-  clear: both;
-}
-.tabs > li, .pills > li {
-  float: left;
-}
-.tabs > li > a, .pills > li > a {
-  display: block;
-}
-.tabs {
-  border-color: #ddd;
-  border-style: solid;
-  border-width: 0 0 1px;
-}
-.tabs > li {
-  position: relative;
-  margin-bottom: -1px;
-}
-.tabs > li > a {
-  padding: 0 15px;
-  margin-right: 2px;
-  line-height: 23px;
-  border: 1px solid transparent;
-  -webkit-border-radius: 4px 4px 0 0;
-  -moz-border-radius: 4px 4px 0 0;
-  border-radius: 4px 4px 0 0;
-}
-.tabs > li > a:hover {
-  text-decoration: none;
-  background-color: #eee;
-  border-color: #eee #eee #ddd;
-}
-.tabs .active > a, .tabs .active > a:hover {
-  color: #808080;
-  background-color: #ffffff;
-  border: 1px solid #ddd;
-  border-bottom-color: transparent;
-  cursor: default;
-}
-.tabs .menu-dropdown, .tabs .dropdown-menu {
-  top: 35px;
-  border-width: 1px;
-  -webkit-border-radius: 0 6px 6px 6px;
-  -moz-border-radius: 0 6px 6px 6px;
-  border-radius: 0 6px 6px 6px;
-}
-.tabs a.menu:after, .tabs .dropdown-toggle:after {
-  border-top-color: #999;
-  margin-top: 15px;
-  margin-left: 5px;
-}
-.tabs li.open.menu .menu, .tabs .open.dropdown .dropdown-toggle {
-  border-color: #999;
-}
-.tabs li.open a.menu:after, .tabs .dropdown.open .dropdown-toggle:after {
-  border-top-color: #555;
-}
-.pills a {
-  margin: 5px 3px 5px 0;
-  padding: 0 15px;
-  line-height: 30px;
-  text-shadow: 0 1px 1px #ffffff;
-  -webkit-border-radius: 15px;
-  -moz-border-radius: 15px;
-  border-radius: 15px;
-}
-.pills a:hover {
-  color: #ffffff;
-  text-decoration: none;
-  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
-  background-color: #00438a;
-}
-.pills .active a {
-  color: #ffffff;
-  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
-  background-color: #0069d6;
-}
-.pills-vertical > li {
-  float: none;
-}
-.tab-content > .tab-pane, .pill-content > .pill-pane {
-  display: none;
-}
-.tab-content > .active, .pill-content > .active {
-  display: block;
-}
-.pagination {
-  height: 36px;
-  margin: 18px 0;
-}
-.pagination ul {
-  float: left;
-  margin: 0;
-  border: 1px solid #ddd;
-  border: 1px solid rgba(0, 0, 0, 0.15);
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  border-radius: 3px;
-  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
-  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
-}
-.pagination li {
-  display: inline;
-}
-.pagination a {
-  float: left;
-  padding: 0 14px;
-  line-height: 34px;
-  border-right: 1px solid;
-  border-right-color: #ddd;
-  border-right-color: rgba(0, 0, 0, 0.15);
-  *border-right-color: #ddd;
-  /* IE6-7 */
-
-  text-decoration: none;
-}
-.pagination a:hover, .pagination .active a {
-  background-color: #00CC66;
-}
-/*custom classes*/
-.pagination .done a {
-  background-color: #00CC66;
-}
-.pagination .disabled a, .pagination .disabled a:hover {
-  background-color: #bfbfbf;
-  color: #ffffff;
-}
-.pagination .next a {
-  border: 0;
-}
-
-@-webkit-keyframes blink {
-    from {
-        opacity: 1.0;
-    }
-    to {
-        opacity: 0.0;
-    }
-}
-blink {
-    -webkit-animation-name: blink;
-    -webkit-animation-iteration-count: infinite;
-    -webkit-animation-timing-function: cubic-bezier(1.0, 0, 0, 1.0);
-    -webkit-animation-duration: 1s;
-}
-
-.error{
-padding:0;
-height:100px;
-width:730px;
-resize:None;
-overflow-y:scroll;
-background-color:white;
-border: 0 None white;
-}
-.error_msg{
-padding:0;
-height:100px;
-width:730px;
-resize:None;
-overflow:hidden;
-}
-.bash{
-padding:0;
-height:auto;
-width:750px;
-resize:none;
-overflow:hidden;
-background-color:white;
-}
-textarea[readonly]{
-cursor: not-allowed;
-}
diff --git a/yaksh/static/yaksh/css/course.css b/yaksh/static/yaksh/css/course.css
deleted file mode 100644
index 580a95c..0000000
--- a/yaksh/static/yaksh/css/course.css
+++ /dev/null
@@ -1,18 +0,0 @@
-.show-grid [class*="span"] {
-    background: none repeat scroll 0% 0% #EEE;
-    text-align: center;
-    border-radius: 10px;
-    min-height: 30px;
-    line-height: 30px;
-    padding: 5px;
-}
-
-.well{
-    padding: 4px;
-}
-
-.wrap{
-    border: 1px solid #333;
-    padding: 5px;
-    background: none repeat scroll 0% 0% #E0DADA;
-}
diff --git a/yaksh/static/yaksh/css/login.css b/yaksh/static/yaksh/css/login.css
deleted file mode 100644
index a10cbaa..0000000
--- a/yaksh/static/yaksh/css/login.css
+++ /dev/null
@@ -1,10 +0,0 @@
-label 
-{
-		  padding-top: 6px;
-		  font-size: 15px;
-		  line-height: 18px;
-		  float: left;
-		  width: 80px;
-		  text-align: center;
-		  color: #404040;
-            }
diff --git a/yaksh/static/yaksh/css/mod.css b/yaksh/static/yaksh/css/mod.css
deleted file mode 100644
index 2cac3ba..0000000
--- a/yaksh/static/yaksh/css/mod.css
+++ /dev/null
@@ -1,130 +0,0 @@
-/*
-CSS Customizations
-*/
-
-html, body {
-  background-color: #eee;
-  margin: 0;
-  padding: 0;
-
-}
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p,
-blockquote,
-pre,
-a,
-abbr,
-acronym,
-address,
-cite,
-code,
-del,
-dfn,
-em,
-img,
-q,
-s,
-samp,
-small,
-strike,
-strong,
-sub,
-sup,
-tt,
-var,
-dd,
-dl,
-dt,
-li,
-ol,
-ul,
-fieldset,
-form,
-label,
-legend,
-button,
-table,
-caption,
-tbody,
-tfoot,
-thead,
-tr,
-th,
-td {
-  margin: 0;
-  padding: 0;
-  border: 0;
-  font-weight: normal;
-  font-style: normal;
-  font-size: 100%;
-  line-height: 1;
-  font-family: serif;
-}
-table {
-  border-collapse: collapse;
-  border-spacing: 0;
-}
-ol, ul {
-  list-style: none;
-}
-q:before,
-q:after,
-blockquote:before,
-blockquote:after {
-  content: "";
-}
-
-a:focus {
-  outline: thin dotted;
-}
-a:hover, a:active {
-  outline: 0;
-}
-
-section {
-  display: block;
-}
-
-audio, canvas, video {
-  display: inline-block;
-  *display: inline;
-  *zoom: 1;
-}
-
-sub, sup {
-  font-size: 75%;
-  line-height: 0;
-  position: relative;
-  vertical-align: baseline;
-}
-sup {
-  top: -0.5em;
-}
-sub {
-  bottom: -0.25em;
-}
-
-textarea {
-  font-size: 100%;
-  margin: 0;
-  vertical-align: baseline;
-  *vertical-align: middle;
-}
-button, input {
-  line-height: normal;
-  *overflow: visible;
-}
-button::-moz-focus-inner, input::-moz-focus-inner {
-  border: 0;
-  padding: 0;
-}
-
-textarea {
-  overflow: visible;
-  vertical-align: top;
-}
\ No newline at end of file
diff --git a/yaksh/static/yaksh/css/monitor.css b/yaksh/static/yaksh/css/monitor.css
deleted file mode 100644
index b16c8b3..0000000
--- a/yaksh/static/yaksh/css/monitor.css
+++ /dev/null
@@ -1,11 +0,0 @@
-     table td 
-     {
- 	vertical-align: top;
-	border-top: 1px solid #ddd;
-     }
-     table tbody th 
-     {
-	border-top: 1px solid #ddd;
-	vertical-align: top;
-     }
-
diff --git a/yaksh/static/yaksh/css/question.css b/yaksh/static/yaksh/css/question.css
index 5837079..9fb2e1a 100644
--- a/yaksh/static/yaksh/css/question.css
+++ b/yaksh/static/yaksh/css/question.css
@@ -20,13 +20,6 @@
        width:50px;
   padding: 5px 10px 9px;
 }
-.page-header {
-  height:50px;
-  text-align: center;
-  background-color: #f5f5f5;
-  padding: 35px 20px 10px;
-  margin: -20px -20px 20px;
-}
 #codeTextarea{
          
        }
diff --git a/yaksh/static/yaksh/css/question_quiz.css b/yaksh/static/yaksh/css/question_quiz.css
deleted file mode 100644
index 26dc42b..0000000
--- a/yaksh/static/yaksh/css/question_quiz.css
+++ /dev/null
@@ -1,27 +0,0 @@
-table th, table td 
-    {	
-	 text-align: left;
-    }
-
-.mini-text
-{
-	height : 25px;
-	width : 70px;
-}
-.select-type
-{
-	width : 225px;
-}
-.tag-text
-{
-    height : 30px;
-    width : 290px;
-}
-.date-text
-{
-    height : 30px;
-    width : 100px;
-}
-input, textarea, select, .uneditable-input {
-    height: 30px;
-}
diff --git a/yaksh/static/yaksh/css/showusers.css b/yaksh/static/yaksh/css/showusers.css
deleted file mode 100644
index 66a3746..0000000
--- a/yaksh/static/yaksh/css/showusers.css
+++ /dev/null
@@ -1,5 +0,0 @@
-.table-class
-{
-	text-align:left;
-	width:60%;
-}
diff --git a/yaksh/static/yaksh/css/theme.css b/yaksh/static/yaksh/css/theme.css
new file mode 100644
index 0000000..b7c8d4c
--- /dev/null
+++ b/yaksh/static/yaksh/css/theme.css
@@ -0,0 +1,18 @@
+body {
+  padding-top: 70px;
+  padding-bottom: 30px;
+}
+
+.theme-dropdown .dropdown-menu {
+  position: static;
+  display: block;
+  margin-bottom: 20px;
+}
+
+.theme-showcase > p > .btn {
+  margin: 5px 0;
+}
+
+.theme-showcase .navbar .container {
+  width: auto;
+}
diff --git a/yaksh/static/yaksh/css/view_answerpaper.css b/yaksh/static/yaksh/css/view_answerpaper.css
deleted file mode 100644
index fad081d..0000000
--- a/yaksh/static/yaksh/css/view_answerpaper.css
+++ /dev/null
@@ -1,74 +0,0 @@
-.panel {
-    margin-bottom: 20px;
-    background-color: #fff;
-    border: 1px solid transparent;
-    border-radius: 4px;
-    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
-          box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
-}
-.panel-body {
-    padding: 15px;
-}
-.panel-heading {
-    padding: 10px 15px;
-    border-bottom: 1px solid transparent;
-    border-top-left-radius: 3px;
-    border-top-right-radius: 3px;
-}
-.panel-info {
-    border-color: #bce8f1;
-}
-.panel-info > .panel-heading {
-    color: #31708f;
-    background-color: #d9edf7;
-    border-color: #bce8f1;
-}
-.panel-danger {
-    border-color: #ebccd1;
-}
-.panel-danger > .panel-heading {
-    color: #a94442;
-    background-color: #f2dede;
-    border-color: #ebccd1;
-}
-.panel-danger > .panel-body > pre > code {
-    background-color:transparent;
-    color: red;
-}
-.panel-success {
-    border-color: #d6e9c6;
-}
-.panel-success > .panel-heading {
-    color: #3c763d;
-    background-color: #dff0d8;
-    border-color: #d6e9c6;
-}
-.panel-success > .panel-body > pre > code {
-    background-color:transparent;
-    color: green;
-}
-.marks{
-    float:right;
-}
-mark{
-    background-color: #dff0d8;
-}
-code{
-    background-color: transparent;
-}
-pre{
-    background-color: transparent;
-}
-/*for grade user*/
-textarea
-{
-    width : 100%;
-    height : 15%;
-}
-#attempt {
-    width: 157px;
-    position: relative; left:20%;
-}
-#myContent {
-    margin: 5px 10px;
-}
diff --git a/yaksh/templates/base.html b/yaksh/templates/base.html
index 7fe2d27..00b0867 100644
--- a/yaksh/templates/base.html
+++ b/yaksh/templates/base.html
@@ -15,8 +15,8 @@
   <link rel="apple-touch-icon" href="apple-touch-icon.png">
 
   <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/bootstrap.min.css">
-  <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/base.css">
   <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/font-awesome.css" type="text/css" />
+  <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/theme.css" type="text/css" />
 
   <style>
     body {
@@ -32,30 +32,31 @@
 
   {% block css %}
   {% endblock %}
-  <script language="JavaScript" type="text/javascript" src="{{ URL_ROOT }}/static/yaksh/js/jquery-1.4.2.min.js"></script>
+  <script language="JavaScript" type="text/javascript" src="{{ URL_ROOT }}/static/yaksh/js/jquery-1.9.1.min.js"></script>
   <script src="{{ URL_ROOT }}/static/yaksh/js/bootstrap.min.js"></script>
   {% block script %}
   {% endblock %}
 </head>
 
-<body 
-  {% block onload %}
-  {% endblock %}>
+<body {% block onload %} {% endblock %}>
+  {% block nav %}
+  {% endblock %}
   <div class="container">
      <div class="content">
          <div class="page-header">
-		    <h1><Strong><center>{% block pagetitle %} {% endblock pagetitle %}</center></strong></h1>
+             <h3><center>{% block pagetitle %}{% endblock pagetitle %}</center></h2>
          </div>
          <div class=row>
-            <div class=span12>
-               <h3><center>{% block formtitle %} {% endblock formtitle %}</center></h3><br>
+            <div class=col-md-12>
 	       {% block content %}
 	       {% endblock %}
             </div>
          </div>
      </div>
-     <footer>
-     <p align="center">&copy; FOSSEE group, IIT Bombay</p>
+     <footer class="footer">
+     <div class="container">
+         <p align="center">Developed by FOSSEE group, IIT Bombay</p>
+     </div>
      </footer>
   </div>
 
diff --git a/yaksh/templates/manage.html b/yaksh/templates/manage.html
index f4c524e..eae4dd4 100644
--- a/yaksh/templates/manage.html
+++ b/yaksh/templates/manage.html
@@ -1,133 +1,22 @@
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
-   <head>
-     <title>
-       {% block title %}
-       {% endblock %}
-     </title>
-
-   {% block meta %}
-<meta charset="utf-8">
-    <meta name="description" content="">
-<meta name="author" content="">
-   {% endblock %}
-
-   <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/base.css" type="text/css" />
-   <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/manage.css" type="text/css" />
-   <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/font-awesome.css" type="text/css" />
-   {% block css %}
-   {% endblock %}
-<script language="JavaScript" type="text/javascript" src="{{ URL_ROOT }}/static/yaksh/js/jquery-1.4.2.min.js"></script>
-   {% block script %}
-   {% endblock %}
-   </head>
-
-<body {% block onload %}{% endblock %}>
-<div class="topbar">
-  <div class="fill">
-     <div class="container">
-        <a href="{{ URL_ROOT }}/exam/manage/"><h3 class="brand"><strong>Online Test</h3></strong></a>
-<ul>
-<li><a href="{{ URL_ROOT }}/exam/manage/questions">Questions</a></li>
-        <li><a href="{{ URL_ROOT }}/exam/manage/gradeuser">Grade User</a></li>
-<li><a href="{{ URL_ROOT }}/exam/manage/monitor">Monitor</a></li>
-<li><a href="{{ URL_ROOT }}/exam/manage/courses">Courses</a></li>
-<li><a href="{{ URL_ROOT }}/exam/viewprofile">My Profile</a></li>
-<li><a href="{{ URL_ROOT }}/exam/changepassword">Change Password</a></li>
-<li><a href="{{ URL_ROOT }}/exam/manage/grader"> Grader </a></li>
-        </ul>
-<ul style="float:right;">
-<li><strong><a style='cursor:pointer' onClick='location.replace("{{URL_ROOT}}/exam/complete/");'>Log out</a></strong></li>
-        </ul>
-     </div>
-   </div>
-</div>
-  <div class="container">
-     <div class="content">
-         <div class="page-header">
-<h3><center>{% block subtitle %}Welcome {{ user.first_name.title }} {{user.last_name.title}} !{% endblock %}</center></h3><br>
-         </div>
-         <div class="row">
-            <div class="col-md-12">
-         {% block new_manage %}
-         {% endblock %}
-            </div>
-         </div>
-         <div class=row>
-            <div class=span14>
-            {% block manage %}
-                <center><h4>List of quizzes! Click on the given links to have a look at answer papers for a quiz.</h4></center>
-                <hr>
-                <table class="bordered-table zebra-striped">
-                    <th>Quiz</th>
-                    <th>Taken By</th>
-                    <th>No. of users Passed</th>
-                    <th>No. of users Failed</th>
-                    {% for paper, answer_papers, users_passed, users_failed in users_per_paper %}
-                        <tr>
-                            <td>
-                                <a href="{{URL_ROOT}}/exam/manage/monitor/{{paper.id}}/">{{ paper.quiz.description }}</a>
-                            </td>
-                            <td>
-                                {{ answer_papers|length }} user(s)
-                            </td>
-                            <td>
-                                {{ users_passed }}
-                            </td>
-                            <td>
-                                {{ users_failed }}
-                            </td>
-                        </tr>
-                    {% endfor %}
-                </table>
-                <hr>
-                <center>
-                    <h4>Moderator's Dashboard!</h4>
-                    <h5>Click on the button given below to add a new course.</h5>
-                    <button class="btn" type="button" onClick='location.replace("{{URL_ROOT}}/exam/manage/add_course");'>Add New Course</button>
-                    <h5>Click on the button to Create a Demo course.
-                    <a href="" onclick="$('#help').show(); return false;">Help </a></h5>
-                    <button class="btn" type="button" onClick='location.replace("{{URL_ROOT}}/exam/manage/create_demo_course");'>Create Demo Course</button>
-                    <div style="display: none;" id="help">
-                    <ol>
-                    <ul>
-                    <li>A Demo Course and Demo Quiz will be created (Click Courses link on nav bar to view courses).</li>
-                    <li>Some Demo Questions are also created for you (Click Questions link on nav bar to view questions).</li>
-                    <li>In Courses you can view Demo Quiz.</li>
-                    <li>Click on the Demo Quiz and Click on User Mode or God Mode to take the quiz.
-                    </li>
-                    <li>You can also edit the Demo quiz.
-                    </li>
-                    </ul>
-                    </p>
-                    <a href="" onclick="$('#help').hide(); return false"> Close </a>
-                    </div>
-                    {% if msg %}
-                    <h4>{{ msg }}</h4>
-                    {% endif %}
-                </center>
-                {% if trial_paper %}
-                  <h5/> You have trial papers.
-                  <table class="bordered-table zebra-striped">
-                  <form action="" method="post">
-                  {% csrf_token %}
-                   {% for paper in trial_paper %}
-                  <tr>
-                  <td> <input type = "checkbox" name="delete_paper" value = {{paper.id}}></input></td>
-                  <td> <a href="{{URL_ROOT}}/exam/manage/gradeuser/{{paper.question_paper.quiz.id}}">{{paper.question_paper.quiz.description}}</td>
-                  </tr>
-                  {% endfor %}
-                  </table>
-                  <center><button class="btn" type="submit">Delete Selected</button></center>
-                  </form>
-                  {% endif %}
+{% extends "base.html" %}
+{% block nav %}
+<nav class="navbar navbar-fixed-top navbar-inverse">
+      <div class="container">
+        <div class="navbar-header">
+          <a class="navbar-brand" href="{{ URL_ROOT }}/exam/manage/"> Online Test </a>
+        </div>
+        <div id="navbar">
+          <ul class="nav navbar-nav">
+            <li><a href="{{ URL_ROOT }}/exam/manage/questions">Questions</a></li>
+            <li><a href="{{ URL_ROOT }}/exam/manage/gradeuser">Grade User</a></li>
+            <li><a href="{{ URL_ROOT }}/exam/manage/monitor">Monitor</a></li>
+            <li><a href="{{ URL_ROOT }}/exam/manage/courses">Courses</a></li>
+            <li><a href="{{ URL_ROOT }}/exam/viewprofile">My Profile</a></li>
+            <li><a href="{{ URL_ROOT }}/exam/changepassword">Change Password</a></li>
+            <li><a href="{{ URL_ROOT }}/exam/manage/grader"> Grader </a></li>
+            <li><a style='cursor:pointer' onClick='location.replace("{{URL_ROOT}}/exam/complete/");'>Log out</a></li>
+          </ul>
+        </div><!-- /.navbar -->
+      </div><!-- /.container -->
+    </nav><!-- /.navbar -->
 {% endblock %}
-            </div>
-         </div>
-     </div>
-     <footer>
-     <p>&copy; FOSSEE group, IIT Bombay</p>
-     </footer>
-  </div>
-
-</body>
-</html>
diff --git a/yaksh/templates/register/password_change_done.html b/yaksh/templates/register/password_change_done.html
index fef07d1..14df20c 100644
--- a/yaksh/templates/register/password_change_done.html
+++ b/yaksh/templates/register/password_change_done.html
@@ -1,7 +1,6 @@
 {% extends "base.html" %}
 
-{% block title %}Password change successful{% endblock %}
-{% block pagetitle %}Online Test {% endblock %}
+{% block pagetitle %}Password change successful{% endblock %}
 {% block script %}
 <script type="text/javascript">
 	window.setTimeout(function()
@@ -13,4 +12,4 @@
 {% block content %}
 <h3>Your password has been changed successfully.</h3>
 <h4>Redirecting ...</h4>
-{% endblock %}
\ No newline at end of file
+{% endblock %}
diff --git a/yaksh/templates/register/password_change_form.html b/yaksh/templates/register/password_change_form.html
index 48292f8..b618410 100644
--- a/yaksh/templates/register/password_change_form.html
+++ b/yaksh/templates/register/password_change_form.html
@@ -1,8 +1,6 @@
 {% extends "base.html" %}
 <!DOCTYPE html>
-{% block title %} Change Password {% endblock %}
-
-{% block pagetitle %} Online Test {% endblock %}
+{% block pagetitle %} Change Password {% endblock %}
 
 {% block content %}
 <form action="" method="post" >
diff --git a/yaksh/templates/register/password_reset_complete.html b/yaksh/templates/register/password_reset_complete.html
index 0801d3b..0c1bae2 100644
--- a/yaksh/templates/register/password_reset_complete.html
+++ b/yaksh/templates/register/password_reset_complete.html
@@ -1,6 +1,5 @@
 {% extends "base.html" %}
-{% block title %}Password reset complete{% endblock %}
-{% block pagetitle %} Online Test {% endblock %}
+{% block pagetitle %}Password reset complete{% endblock %}
 {% block content %}
 <p>Your password has been reset. </p>
 <p><a href="{{ login_url }}">Log in</a></p>
diff --git a/yaksh/templates/register/password_reset_confirm.html b/yaksh/templates/register/password_reset_confirm.html
index 5566499..1b0a1b7 100644
--- a/yaksh/templates/register/password_reset_confirm.html
+++ b/yaksh/templates/register/password_reset_confirm.html
@@ -1,7 +1,5 @@
 {% extends "base.html" %}
-{% block title %}Reset Password{% endblock %}
-{% block pagetitle %} Online Test {% endblock %}
-{% block formtitle %} Reset password {% endblock %}
+{% block pagetitle %}Reset Password{% endblock %}
 
 {% block content  %}
     {% if validlink %}
diff --git a/yaksh/templates/register/password_reset_done.html b/yaksh/templates/register/password_reset_done.html
index ace3cc9..1ac7b60 100644
--- a/yaksh/templates/register/password_reset_done.html
+++ b/yaksh/templates/register/password_reset_done.html
@@ -1,4 +1,3 @@
 {% extends "base.html" %}
 {% block title %}Password reset successful{% endblock %}
-{% block pagetitle %} Online Test {% endblock %}
-{% block formtitle %} Instruction for setting new password has been mailed to your registered email address {% endblock %}
+{% block pagetitle %} Instruction for setting new password has been mailed to your registered email address {% endblock %}
diff --git a/yaksh/templates/register/password_reset_form.html b/yaksh/templates/register/password_reset_form.html
index 0dbaf09..0444584 100644
--- a/yaksh/templates/register/password_reset_form.html
+++ b/yaksh/templates/register/password_reset_form.html
@@ -1,7 +1,5 @@
 {% extends "base.html" %}
-{% block title %} Forgot Password {% endblock %}
-{% block pagetitle %} Online Test {% endblock %}
-{% block formtitle %} Email will be send to the registered email address {% endblock %}
+{% block pagetitle %} Email will be send to the registered email address {% endblock %}
 {% block content %}
 <form action="" method="post">
     {% csrf_token %}
diff --git a/yaksh/templates/user.html b/yaksh/templates/user.html
index 4805c2d..c18013b 100644
--- a/yaksh/templates/user.html
+++ b/yaksh/templates/user.html
@@ -1,61 +1,19 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
-   <head>
-     <title>
-       {% block title %}
-       {% endblock %}
-     </title>
-
-   {% block meta %}
-	<meta charset="utf-8">
-   	<meta name="description" content="">
-	<meta name="author" content="">
-   {% endblock %}
-
-   <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/base.css" type="text/css" />
-   <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/font-awesome.css" type="text/css" />
-   {% block css %}
-   {% endblock %}
-
-   {% block script %}
-   {% endblock %}
-   </head>
-
-<body {% block onload %}{% endblock %}>
-<div class="topbar">
-  <div class="fill">
-     <div class="container">
-        <h3 class="brand"><strong>Online Test</h3></strong>
-    	<ul>
-	      <li><a href="{{ URL_ROOT }}/exam/quizzes">Quizzes</a></li>
-        <li><a href="{{ URL_ROOT }}/exam/results">Results</a></li>
-        <li><a href="{{ URL_ROOT }}/exam/viewprofile">My Profile</a></li>
-        <li><a href="{{ URL_ROOT }}/exam/changepassword">Change Password</a></li>
-      </ul>
-	<ul style="float:right;">
-	<li><strong><a style='cursor:pointer' onClick='location.replace("{{URL_ROOT}}/exam/complete/");' id='logout'>Log out</a></strong></li>
-        </ul>
-     </div>
-   </div>
-</div>
-  <div class="container">
-     <div class="content">
-         <div class="page-header">
-		<h3><center>{% block subtitle %}Welcome {{ user.first_name.title }}  {{user.last_name.title}} {% endblock %}</center></h3><br>
-         </div>
-         <div class=row>
-            <div class=span14>
-               {% block manage %}
-	       {% endblock %}
-            </div>
-         </div>
-     </div>
-     <footer>
-     <p>&copy; FOSSEE group, IIT Bombay</p>
-     </footer>
-  </div>
-
-</body>
-</html>
+{% extends "base.html" %}
+{% block nav %}
+    <nav class="navbar navbar-fixed-top navbar-inverse">
+      <div class="container">
+        <div class="navbar-header">
+          <a class="navbar-brand" href="{{ URL_ROOT }}/exam/manage/"> Online Test </a>
+        </div>
+        <div id="navbar">
+          <ul class="nav navbar-nav">
+	        <li><a href="{{ URL_ROOT }}/exam/quizzes">Quizzes</a></li>
+            <li><a href="{{ URL_ROOT }}/exam/results">Results</a></li>
+            <li><a href="{{ URL_ROOT }}/exam/viewprofile">My Profile</a></li>
+            <li><a href="{{ URL_ROOT }}/exam/changepassword">Change Password</a></li>
+            <li><a style='cursor:pointer' onClick='location.replace("{{URL_ROOT}}/exam/complete/");'>Log out</a></li>
+          </ul>
+        </div><!-- /.navbar -->
+      </div><!-- /.container -->
+    </nav><!-- /.navbar -->
+{% endblock %}
diff --git a/yaksh/templates/yaksh/add_course.html b/yaksh/templates/yaksh/add_course.html
index 0afa27a..55683f4 100644
--- a/yaksh/templates/yaksh/add_course.html
+++ b/yaksh/templates/yaksh/add_course.html
@@ -6,7 +6,7 @@
 <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/question_quiz.css" type="text/css" />
 {% endblock %}
 
-{% block manage %}
+{% block content %}
 <form name=frm id=frm action="" method="post" >
   {% csrf_token %}
   <center>
diff --git a/yaksh/templates/yaksh/add_question.html b/yaksh/templates/yaksh/add_question.html
index 5a5f1ce..c0d53f8 100644
--- a/yaksh/templates/yaksh/add_question.html
+++ b/yaksh/templates/yaksh/add_question.html
@@ -1,23 +1,21 @@
 {% extends "manage.html" %}
 
-{% block subtitle %}Add Question{% endblock %}
+{% block pagetitle %} Add Question {% endblock pagetitle %}
 
 {% block css %}
-<link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/question_quiz.css" type="text/css" />
 <link rel="stylesheet" media="all" type="text/css" href="{{ URL_ROOT }}/static/yaksh/css/autotaggit.css" />
 {% endblock %}
 
 {% block script %}
-<script type="text/javascript" src="{{ URL_ROOT }}/static/yaksh/js/jquery-1.4.2.min.js"></script>
 <script src="{{ URL_ROOT }}/static/yaksh/js/add_question.js"></script>
 {% endblock %}
 
 {% block onload %} onload='javascript:textareaformat();' {% endblock %}
 
-{% block manage %}
+{% block content %}
 <form action="" method="post" name=frm onSubmit="return autosubmit();" enctype="multipart/form-data">
   {% csrf_token %}
-  <center><table class=span1>
+  <center><table class="table">
   <tr><td>Summary: <td>{{ form.summary }}{{ form.summary.errors }}
   <tr><td> Language: <td> {{form.language}}{{form.language.errors}}
   <tr><td> Type: <td> {{ form.type }}{{form.type.errors}}
diff --git a/yaksh/templates/yaksh/add_questionpaper.html b/yaksh/templates/yaksh/add_questionpaper.html
deleted file mode 100644
index eaa96bc..0000000
--- a/yaksh/templates/yaksh/add_questionpaper.html
+++ /dev/null
@@ -1,27 +0,0 @@
-{% extends "manage.html" %}
-
-
-{% block subtitle %}Design Question Paper{% endblock %}
-
-{% block css %}
-<link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/question_quiz.css" type="text/css" /> 
-<link rel="stylesheet" media="all" type="text/css" href="{{ URL_ROOT }}/static/yaksh/css/autotaggit.css" />
-{% endblock %}
-{% block script %}
-<script src="/static/yaksh/js/jquery-1.4.2.min.js" type="text/javascript"></script>
-<script src="{{ URL_ROOT }}/static/yaksh/js/add_questionpaper.js"></script>
-{% endblock %}
-
-{% block manage %}
-<input type=hidden id="url_root" value={{ URL_ROOT }}>
-<form>
-{% csrf_token %}
-Select mode to design Question Paper: 
-<select name='mode' id='mode' onChange='javascript:load_data();'>
-  <option>---------</option>
-  <option>Automatic</option>
-  <option>Manual</option>
-</select> 
-</form>
-
-{% endblock %}
diff --git a/yaksh/templates/yaksh/add_quiz.html b/yaksh/templates/yaksh/add_quiz.html
index 1c73e12..97bf5a2 100644
--- a/yaksh/templates/yaksh/add_quiz.html
+++ b/yaksh/templates/yaksh/add_quiz.html
@@ -10,7 +10,7 @@
 <script src="{{ URL_ROOT }}/static/yaksh/js/add_quiz.js"></script>
 {% endblock %}
 {% block onload %} onload="javascript:test();"  {% endblock %}
-{% block manage %}
+{% block content %}
 
 <form name=frm id=frm action="" method="post" >
   {% csrf_token %}
diff --git a/yaksh/templates/yaksh/addteacher.html b/yaksh/templates/yaksh/addteacher.html
index 6722a52..755ba20 100644
--- a/yaksh/templates/yaksh/addteacher.html
+++ b/yaksh/templates/yaksh/addteacher.html
@@ -7,7 +7,7 @@
 <link rel="stylesheet" media="all" type="text/css" href="{{ URL_ROOT }}/static/yaksh/css/course.css" />
 {% endblock %}
 
-{% block manage %}
+{% block content %}
 <center><h3>Add Teachers for this course</h3><br></center>
 <center><h3>Search teacher with username, firstname, lastname, email</h3><br></center>
 <div align="center">
diff --git a/yaksh/templates/yaksh/complete.html b/yaksh/templates/yaksh/complete.html
index 98adf9b..4fe9aba 100644
--- a/yaksh/templates/yaksh/complete.html
+++ b/yaksh/templates/yaksh/complete.html
@@ -1,12 +1,10 @@
 {% extends "base.html" %}
 
-{% block title %}Good bye!{% endblock %}
-
 {% block pagetitle %}Online Test{% endblock %}
 {% block content %}
 {% csrf_token %}
     {% if paper.questions_answered.all or paper.questions_unanswered.all %}
-			<br><center><table class="bordered-table zebra-striped span8"
+			<br><center><table class="table table-bordered"
 			 style="text-align:left;">
 				<tr><td><b>Submitted Questions</b></td>
 				<td>
diff --git a/yaksh/templates/yaksh/course_detail.html b/yaksh/templates/yaksh/course_detail.html
index 7169667..c54f153 100644
--- a/yaksh/templates/yaksh/course_detail.html
+++ b/yaksh/templates/yaksh/course_detail.html
@@ -4,15 +4,12 @@
 
 {% block subtitle %} {{ course.name }} {% endblock %}
 
-{% block css %}
-<link rel="stylesheet" media="all" type="text/css" href="{{ URL_ROOT }}/static/yaksh/css/course.css" />
-{% endblock %}
 {% block script %}
 <script language="JavaScript" type="text/javascript" src="{{ URL_ROOT }}/static/yaksh/js/course.js"></script>
 {% endblock %}
-{% block manage %}
+{% block content %}
 <div class="row">
-    <div class="span6 wrap">
+    <div class="col-md-6">
         <center><b><u>Requests</u></b></center><br>
         {% if course.get_requests %}
         <input type="checkbox" class="checkall"/>&nbsp;<font size="2">Select all</font>
@@ -22,7 +19,7 @@
         {% for request in course.get_requests %}
         <div class="well">
             <div class="row">
-                <div class="span3" style="padding-top:10px">
+                <div class="col-md-3" style="padding-top:10px">
                     <input type="checkbox" name="check" value="{{ request.id }}">&nbsp;
                     <a href="#" data-toggle="tooltip" title=" Full Name: {{ request.get_full_name }}&#013;Institute: {{ request.profile.institute }}&#013;Department: {{ request.profile.department}}&#013;Roll Number: {{ request.profile.roll_number }}">&nbsp;{{ request.username }}</a>
                 </div>
@@ -35,7 +32,7 @@
         {% endif %}
         </form>
     </div>
-    <div class="span6 wrap">
+    <div class="col-md-6">
         <center><b><u>Rejected</u></b></center><br>
         {% if course.get_rejected %}
         <input type="checkbox" class="enroll"/>&nbsp;<font size="2">Select all</font>
@@ -45,15 +42,15 @@
         {% csrf_token %}
         <div class="well">
             <div class="row">
-                <div class="span4" style="padding-top:10px">
+                <div class="col-md-4" style="padding-top:10px">
                 <input type="checkbox" name="check" value="{{ rejected.id }}">&nbsp;
                 <a href="#" data-toggle="tooltip" title=" Full Name: {{ rejected.get_full_name }}&#013;Institute: {{ rejected.profile.institute }}&#013;Department: {{ rejected.profile.department}}&#013;Roll Number: {{ rejected.profile.roll_number }}">&nbsp;{{ rejected.username }}</a>
                 </div>
-                <a class="btn success" href="{{URL_ROOT}}/exam/manage/enroll/rejected/{{ course.id }}/{{ rejected.id }}/"> Enroll </a>
+                <a class="btn btn-success" href="{{URL_ROOT}}/exam/manage/enroll/rejected/{{ course.id }}/{{ rejected.id }}/"> Enroll </a>
             </div>
         </div>
         {% endfor %}
-        <button class="btn success" type="submit" name='enroll' value='enroll'>Enroll Selected</button>
+        <button class="btn btn-success" type="submit" name='enroll' value='enroll'>Enroll Selected</button>
         </div>
         {% endif %}
         </form>
@@ -61,7 +58,7 @@
 </div>
 <br>
 <div class="row">
-    <div class="span6 offset4 wrap">
+    <div class="col-md-6">
         <center><b><u>Enrolled</u></b></center><br>
         {% if course.get_enrolled %}
         <input type="checkbox" class="reject"/>&nbsp;<font size="2">Select all</font>
@@ -71,21 +68,21 @@
         {% csrf_token %}
         <div class="well">
             <div class="row">
-                <div class="span4" style="padding-top:10px">
+                <div class="col-md-4" style="padding-top:10px">
                 <input type="checkbox" name="check" value="{{ enrolled.id }}">&nbsp;
                 <a href="#" data-toggle="tooltip" title=" Full Name: {{ enrolled.get_full_name }}&#013;Institute: {{ enrolled.profile.institute }}&#013;Department: {{ enrolled.profile.department}}&#013;Roll Number: {{ enrolled.profile.roll_number }}">&nbsp;{{ enrolled.username }}</a>
                 </div>
-                <a class="btn danger" href="{{URL_ROOT}}/exam/manage/enrolled/reject/{{ course.id }}/{{ enrolled.id }}/"> Reject </a>
+                <a class="btn btn-danger" href="{{URL_ROOT}}/exam/manage/enrolled/reject/{{ course.id }}/{{ enrolled.id }}/"> Reject </a>
             </div>
         </div>
         {% endfor %}
-        <button class="btn danger" type="submit" name='reject' value='reject'>Reject Selected</button>
+        <button class="btn btn-danger" type="submit" name='reject' value='reject'>Reject Selected</button>
 	    </div>
         {% endif %}
         </form>
     </div>
 </div>
 <div class="pull-right">
-            <a class="btn primary" href="{{URL_ROOT}}/exam/manage/toggle_status/{{ course.id }}/">{% if course.active %}Deactivate Course {% else %} Activate Course {% endif %}</a>
+            <a class="btn btn-primary" href="{{URL_ROOT}}/exam/manage/toggle_status/{{ course.id }}/">{% if course.active %}Deactivate Course {% else %} Activate Course {% endif %}</a>
 </div>
 {% endblock %}
diff --git a/yaksh/templates/yaksh/courses.html b/yaksh/templates/yaksh/courses.html
index dcf9af5..ecd3a13 100644
--- a/yaksh/templates/yaksh/courses.html
+++ b/yaksh/templates/yaksh/courses.html
@@ -1,15 +1,7 @@
 {% extends "manage.html" %}
 
-{% block title %} Courses {% endblock title %}
-
-{% block subtitle %} Courses {% endblock %}
-
-{% block css %}
-<link rel="stylesheet" media="all" type="text/css" href="{{ URL_ROOT }}/static/yaksh/css/course.css" />
-{% endblock %}
-
-{% block manage %}
-
+{% block pagetitle %} Courses {% endblock pagetitle %}
+{% block content %}
 {% if not courses %}
     <center><h4> No new Courses created </h4></center>
 {% else %}
@@ -18,23 +10,23 @@
     {% if user != course.creator %}
         <h4> {{course.creator.get_full_name}} added you to this course</h4>
     {% endif %}
-    <div class="row show-grid">
-        <div class="span14">
+    <div class="row">
+        <div class="col-md-12">
             <div class="row">
-                <div class="span4">
+                <div class="col-md-6">
                     <p>
                         <b><u>Course</u></b>
                         {% if course.active %}
-                            <span class="label success">Active</span>
+                            <span class="label label-success">Active</span>
                         {% else %}
-                            <span class="label important">Closed</span>
+                            <span class="label label-danger">Closed</span>
                         {% endif %}
                     </p>
                     <a href="{{URL_ROOT}}/exam/manage/course_detail/{{course.id}}/">{{ course.name }}</a>
                     </br></br>
                     {% if user == course.creator %}
                     <div class="row">
-                        <div class="span3 wrap">
+                        <div class="col-md-4 ">
                             <center><b><u>Teacher(s) Added to {{ course }}</u></b></center>
                             {% if course.get_teachers %}
                             <div align="left">
@@ -43,13 +35,13 @@
                             {% for teacher in course.get_teachers %}
                             <div class="well">
                                 <div class="row">
-                                    <div class="span3" style="width: auto;">
+                                    <div class="col-md-333" style="width: auto;">
                                         <input type="checkbox" name="remove" value="{{ teacher.id }}">&nbsp;{{ teacher.get_full_name }}
                                     </div>
                                 </div>
                             </div>
                             {% endfor %}
-                            <button class="btn success" type="submit">Remove Selected</button>
+                            <button class="btn btn-danger" type="submit">Remove Selected</button>
                             </div>
                             {% else %}
                             <center><b>No Teacher(s) Added</b></center>
@@ -60,25 +52,23 @@
                     {% endif %}
                 </div>
                 {% if user == course.creator %}
-                <div class="span6">
                     <p><b><a href="{{URL_ROOT}}/exam/manage/searchteacher/{{course.id}}/">Add Teacher</a></b></p>
-                </div>
                 {% endif %}
-                <div class="span4" style="text-align:left">
+                <div class="col-md-2" style="text-align:left">
                     {% if course.get_quizzes %}
                         <p><b><u>Quiz(zes)</u></b></p>
                             {% for quiz in course.get_quizzes %}
                             <a href="{{URL_ROOT}}/exam/manage/addquiz/{{course.id}}/{{quiz.id}}/">{{ quiz.description }}</a><br>
                     {% endfor %}
                 </div>
-                <div class="span4" style="text-align:left">
+                <div class="col-md-4" style="text-align:left">
                     <p><b><u>Question Paper(s)</u></b></p>
                     {% for quiz in course.get_quizzes %}
                     {% if quiz.questionpaper_set.get %}
                     <a href="{{URL_ROOT}}/exam/manage/designquestionpaper/{{ quiz.id }}/{{quiz.questionpaper_set.get.id}}/">Question Paper for {{ quiz.description }}</a><br>
                     {% else %}
-                    <p><b>No Question Paper </b>
-                    <button class="btn small primary" type="button" onClick='location.replace("{{URL_ROOT}}/exam/manage/quiz/designquestionpaper/{{ quiz.id }}/");'>Add</button>
+                    <p>No Question Paper 
+                    <a href="#" onClick='location.replace("{{URL_ROOT}}/exam/manage/quiz/designquestionpaper/{{ quiz.id }}/");'>Add</a>
                     </p>
                     {% endif %}
                     {% endfor %}
@@ -88,7 +78,7 @@
                 </div>
             </div>
             <br/>
-            <button class="btn primary"type="button" onClick='location.replace("{{URL_ROOT}}/exam/manage/addquiz/{{course.id}}/");'>Add New Quiz</button>
+            <button class="btn btn-primary pull-right"type="button" onClick='location.replace("{{URL_ROOT}}/exam/manage/addquiz/{{course.id}}/");'>Add New Quiz</button>
         </div>
     </div>
     <br><br>
@@ -98,22 +88,22 @@
 {% if allotted_courses %}
     <center><h3> Course(s) Allotted </h3></center>
     {% for course in allotted_courses %}
-        <div class="row show-grid">
-        <div class="span14">
+        <div class="row">
+        <div class="col-md-12">
             <div class="row">
-                <div class="span6">
+                <div class="col-md-6">
                     <p>
                         <b><u>Course</u></b>
                         {% if course.active %}
-                            <span class="label success">Active</span>
+                            <span class="label label-success">Active</span>
                         {% else %}
-                            <span class="label important">Closed</span>
+                            <span class="label label-danger">Closed</span>
                         {% endif %}
                     </p>
                     <a href="{{URL_ROOT}}/exam/manage/course_detail/{{course.id}}/">{{ course.name }}</a>
                     </br></br>
                     <div class="row">
-                        <div class="span6 wrap">
+                        <div class="col-md-4 wrap">
                             <center><b><u> Course Creator</u></b></center>
                             {{course.creator}}
                             <center><b><u>Teacher(s) Added to {{ course }}</u></b></center>
@@ -124,13 +114,13 @@
                             {% for teacher in course.get_teachers %}
                             <div class="well">
                                 <div class="row">
-                                    <div class="span3" style="width: auto;">
+                                    <div class="col-md-3" style="width: auto;">
                                         <input type="checkbox" name="remove" value="{{ teacher.id }}">&nbsp;{{ teacher.get_full_name }}
                                     </div>
                                 </div>
                             </div>
                             {% endfor %}
-                            <button class="btn success" type="submit">Remove Selected</button>
+                            <button class="btn btn-danger" type="submit">Remove Selected</button>
                             </div>
                             {% else %}
                             <center><b>No Teacher(s) Added</b></center>
@@ -139,10 +129,10 @@
                         </div>
                     </div>
                 </div>
-                <div class="span6">
+                <div class="col-md-4">
                     <p><b><a href="{{URL_ROOT}}/exam/manage/searchteacher/{{course.id}}/">Add Teacher</a></b></p>
                 </div>
-                <div class="span6">
+                <div class="col-md-4">
                     <p><b><u>Quiz(zes)</u></b></p>
                     {% if course.get_quizzes %}
                         {% for quiz in course.get_quizzes %}
@@ -154,7 +144,7 @@
                 </div>
             </div>
             <br/>
-            <button class="btn primary"type="button" onClick='location.replace("{{URL_ROOT}}/exam/manage/addquiz/{{course.id}}/");'>Add New Quiz</button>
+            <button class="btn btn-primary pull-right"type="button" onClick='location.replace("{{URL_ROOT}}/exam/manage/addquiz/{{course.id}}/");'>Add New Quiz</button>
         </div>
     </div>
     <br><br>
diff --git a/yaksh/templates/yaksh/design_questionpaper.html b/yaksh/templates/yaksh/design_questionpaper.html
index 435de83..4418c27 100644
--- a/yaksh/templates/yaksh/design_questionpaper.html
+++ b/yaksh/templates/yaksh/design_questionpaper.html
@@ -5,7 +5,6 @@
 {% block subtitle %} Design Question Paper {% endblock %}
 
 {% block css %}
-    <link rel="stylesheet" media="all" type="text/css" href="{{ URL_ROOT }}/static/yaksh/css/bootstrap.css" />
     <link rel="stylesheet" media="all" type="text/css" href="{{ URL_ROOT }}/static/yaksh/css/question_paper_creation.css" />
 <style>
 select
@@ -22,13 +21,14 @@ select
     <script src="{{ URL_ROOT }}/static/yaksh/js/question_paper_creation.js"></script>
 {% endblock %}
 
-{% block new_manage %}
+{% block content %}
+<input type=hidden id="url_root" value={{ URL_ROOT }}>
 <form action="{{ URL_ROOT }}/exam/manage/designquestionpaper/{{ qpaper.quiz.id }}/{{ qpaper.id }}/" method="POST">
 <input class ="btn primary small" type="submit" name="back" id="back" value="Cancel">
     {% csrf_token %}
     <input type=hidden name="is_active" id="is_active" value="{{ state }}">
 <center><b>Manual mode to design the {{lang}}  Question Paper</center><br>
-    <ul class="tabs" data-tabs="tabs">
+    <ul class="nav nav-tabs tabs" data-tabs="tabs">
     <li class="active" id="fixed-tab">
         <a href="#fixed-questions" id="fixed">
             STEP 1<br>
diff --git a/yaksh/templates/yaksh/editprofile.html b/yaksh/templates/yaksh/editprofile.html
index cdccfc0..fc8539d 100644
--- a/yaksh/templates/yaksh/editprofile.html
+++ b/yaksh/templates/yaksh/editprofile.html
@@ -1,8 +1,5 @@
-{% extends "base.html" %}
+{% extends "manage.html" %}
 
-{% block title %} Edit Profile {% endblock %}
-
-{% block pagetitle %} Online Test {% endblock %}
 {% block formtitle %} Please fill in the following details {% endblock %}
 
 {% block content %}
diff --git a/yaksh/templates/yaksh/grade_user.html b/yaksh/templates/yaksh/grade_user.html
index 0e29512..ced3ca2 100644
--- a/yaksh/templates/yaksh/grade_user.html
+++ b/yaksh/templates/yaksh/grade_user.html
@@ -1,19 +1,11 @@
 {% extends "manage.html" %}
 
-{% block title %} Grade User {% endblock title %}
+{% block pagetitle %} Grade User {% endblock pagetitle %}
 
-{% block subtitle %} Grade User {% endblock %}
- 
-{% block css %}
-     <link rel="stylesheet"
-      href="{{ URL_ROOT }}/static/yaksh/css/view_answerpaper.css"
-      type="text/css" />
-{% endblock %}
-
-{% block manage %}
+{% block content %}
 
 {% if course_details %}
-    <table id = "course-details" class = "zebra-striped">
+    <table id="course-details" class="table table-bordered">
     <tr>
     <th>Courses</th> 
     <th> Quizzes </th>
@@ -21,12 +13,12 @@
 
     {% for course in course_details %}
     <tr>
-    <td><ul>{{course.name}} </td>
+    <td><ul class="list-group">{{course.name}} </td>
 
     {% if course.get_quizzes %}
     <td>
     {% for quiz in course.get_quizzes %}
-     <li><a href = "{{URL_ROOT}}/exam/manage/gradeuser/{{quiz.id}}">
+     <li class="list-group-item"><a href = "{{URL_ROOT}}/exam/manage/gradeuser/{{quiz.id}}">
      {{quiz.description}}
      </a></li>
     {% endfor %}
@@ -41,7 +33,7 @@
 
 <div class="row">
 {%if users %}
-    <div id = "student" class="span2">
+    <div id = "student" class="col-md-2">
     {% for user in users %}
     <p><a href = "{{URL_ROOT}}/exam/manage/gradeuser/{{quiz_id}}/{{user.user__id}}">
     {{user.user__first_name}} {{user.user__last_name}}</a></p>
@@ -51,7 +43,7 @@
 
 
 
-<div id = "paper" class="span12">
+<div id = "paper" class="col-md-10">
 {% if data %}
 
 
@@ -102,7 +94,7 @@ Status : <b style="color: green;"> Passed </b><br/>
 {% if paper.answers.count %}
 
 <h4> Report </h4><br>
-<table class="zebra-striped">
+<table class="table table-bordered">
     <th>Questions</th>
     <th>Marks Obtained</th>
     {% for question, answers in paper.get_question_answers.items %}
@@ -129,7 +121,7 @@ Status : <b style="color: green;"> Passed </b><br/>
 <div class="panel panel-info">
         <div class="panel-heading">
             <strong> Details: {{forloop.counter}}. {{ question.summary }} 
-            <span class="marks"> Mark(s): {{ question.points }} </span>
+            <span class="marks pull-right"> Mark(s): {{ question.points }} </span>
             </strong>
         </div>
         <div class="panel-body">
@@ -183,12 +175,12 @@ Status : <b style="color: green;"> Passed </b><br/>
     {% endwith %}
     <hr/>
     {% endfor %} {# for question, answers ... #}
-
+<div class="form-group">
 <h3>Teacher comments: </h3>
-<textarea id="comments_{{paper.question_paper.id}}" rows="10" cols="80" 
+<textarea id="comments_{{paper.question_paper.id}}" class="form-control"
     name="comments_{{ paper.question_paper.id }}">{{ paper.comments }}</textarea>
-<br>
-<br><button class="btn" type="submit" name="submit_{{paper.quiz.id}}">Save Marks</button>
+</div>
+<br><button class="btn btn-primary" type="submit" name="submit_{{paper.quiz.id}}">Save Marks</button>
 
 </form>
 </div>
diff --git a/yaksh/templates/yaksh/intro.html b/yaksh/templates/yaksh/intro.html
index b4bc6d7..81c460f 100644
--- a/yaksh/templates/yaksh/intro.html
+++ b/yaksh/templates/yaksh/intro.html
@@ -1,8 +1,8 @@
 {% extends "base.html" %}
 
-{% block title %}Instructions and Rules {% endblock %}
-{% block pagetitle %}Online Test {% endblock %}
-{% block formtitle %}Important instructions & rules {% endblock %}
+{% block pagetitle %} OnlineTest Instructions and Rules
+<h3> Important instructions & rules </h3>
+{% endblock pagetitle %}
 {% block content %}
 
          {% if questionpaper.quiz.is_expired %}
@@ -35,22 +35,28 @@
           </li>
           <li> <strong>You are <strong>not allowed</strong> to use any internet resources, i.e. no google etc.</strong> </li>
           <li> Do not copy or share the questions or answers with anyone until the exam is complete <strong>for everyone</strong>.</li>
-          <li> <strong>All</strong> your attempts at the questions are logged. Do not try to outsmart and break the testing system.  If you do, we know who you are and we will expell you from the course.  You have been warned.
+          <li> <strong>All</strong> your attempts at the questions are logged. Do not try to outsmart and break the testing system.  If you do, we know who you are and we will expel you from the course.  You have been warned.
           </li>
          </ul>
-          <p> We hope you enjoy taking this exam !!!</p>
-          {% if user == "moderator" %}
-          <form action="{{URL_ROOT}}/exam/manage/" method="post" align="center">
-          {%else%}
-          <form action="{{URL_ROOT}}/exam/quizzes/" method="post" align="center">
-          {% endif %}
-           {% csrf_token %}
-           <center><button class="btn" name="home">Home</button></center>
+         <p> We hope you enjoy taking this exam !!!</p>
+        <div class="row">
+            <div class="col-md-6">
+              {% if user == "moderator" %}
+              <form action="{{URL_ROOT}}/exam/manage/" method="post" align="center">
+              {%else%}
+              <form action="{{URL_ROOT}}/exam/quizzes/" method="post" align="center">
+              {% endif %}
+              {% csrf_token %}
+              <center><button class="btn btn-primary" name="home">Home</button></center>
           </form>
-          {% if not questionpaper.quiz.is_expired %}
-              <form action="{{URL_ROOT}}/exam/start/{{ attempt_num }}/{{ questionpaper.id }}/" method="post" align="center">
-               {% csrf_token %}
-               <center><button class="btn" type="submit" name="start">Start Exam!</button></center>
-              </form>
-          {% endif %}
+            </div>
+            <div class="col-md-6">
+                  {% if not questionpaper.quiz.is_expired %}
+                      <form action="{{URL_ROOT}}/exam/start/{{ attempt_num }}/{{ questionpaper.id }}/" method="post" align="center">
+                       {% csrf_token %}
+                       <center><button class="btn btn-success" type="submit" name="start"> Start Exam <span class="glyphicon glyphicon-chevron-right"></span></button></center>
+                      </form>
+                  {% endif %}
+            </div>
+        </div>
 {% endblock content %}
diff --git a/yaksh/templates/yaksh/login.html b/yaksh/templates/yaksh/login.html
index 5694f75..e5cfcc4 100644
--- a/yaksh/templates/yaksh/login.html
+++ b/yaksh/templates/yaksh/login.html
@@ -1,29 +1,24 @@
 {% extends "base.html" %}
 
-{% block title %}Login{% endblock title %}
-{% block pagetitle %} Online Test {% endblock %}
-{% block formtitle %}Login{% endblock %}
-{% block css %}
-<link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/bootstrap-social.css" type="text/css" />
-<link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/login.css" type="text/css" /> 
-{% endblock %}
+{% block pagetitle %}YAKSH Online Test {% endblock %}
+
 {% block content %}
 
         <form action="" method="post">
         {% csrf_token %}
           
-        <center><table class=span1>
+        <center><table class="table">
         {{ form.as_table }}
         </table></center>
-        <center><button class="btn" type="submit">Login</button>&nbsp;&nbsp;&nbsp;&nbsp;<button class="btn" type="reset">Cancel</button></center>
-        <br><center><a href="{{URL_ROOT}}/exam/forgotpassword/">Forgot Password?</a></center><br>
-        <center><a href="{{URL_ROOT}}/exam/register/">New User? Sign-Up </a></center>
+        <button class="btn btn-primary" type="submit">Login</button>&nbsp;&nbsp;&nbsp;&nbsp;<button class="btn btn-primary" type="reset">Cancel</button>
+        <a href="{{URL_ROOT}}/exam/forgotpassword/">Forgot Password?</a>
+        <a href="{{URL_ROOT}}/exam/register/">New User? Sign-Up </a>
         <h3> Login with </h3>
         <a class="btn btn-social-icon btn-google" href="{% url 'social:begin' 'google-oauth2' %}">
-            <span class="fa fa-google" style="background-color: #dd4b39;" ></span>
+            <span class="fa fa-google" style="font-size:32px;color:red" ></span>
         </a>
         <a class="btn btn-social-icon btn-facebook"  href="{% url 'social:begin' 'facebook' %}">
-            <span class="fa fa-facebook" style="background-color: #3b5998;" ></span>
+            <span class="fa fa-facebook-square" style="font-size:32px"></span>
         </a>
         </form>
       
diff --git a/yaksh/templates/yaksh/moderator_dashboard.html b/yaksh/templates/yaksh/moderator_dashboard.html
new file mode 100644
index 0000000..3f3c123
--- /dev/null
+++ b/yaksh/templates/yaksh/moderator_dashboard.html
@@ -0,0 +1,69 @@
+{% extends "manage.html" %}
+{% block pagetitle %} Moderator's Dashboard {% endblock pagetitle %}
+
+{% block content %}
+
+<center><h4>List of quizzes! Click on the given links to have a look at answer papers for a quiz.</h4></center>
+<table class="table table-bordered">
+    <th>Quiz</th>
+    <th>Taken By</th>
+    <th>No. of users Passed</th>
+    <th>No. of users Failed</th>
+    {% for paper, answer_papers, users_passed, users_failed in users_per_paper %}
+        <tr>
+            <td>
+                <a href="{{URL_ROOT}}/exam/manage/monitor/{{paper.id}}/">{{ paper.quiz.description }}</a>
+            </td>
+            <td>
+                {{ answer_papers|length }} user(s)
+            </td>
+            <td>
+                {{ users_passed }}
+            </td>
+            <td>
+                {{ users_failed }}
+            </td>
+        </tr>
+    {% endfor %}
+</table>
+<hr>
+<center>
+    <h5>Click on the button given below to add a new course.</h5>
+    <button class="btn" type="button" onClick='location.replace("{{URL_ROOT}}/exam/manage/add_course");'>Add New Course</button>
+    <h5>Click on the button to Create a Demo course.
+    <a href="" onclick="$('#help').show(); return false;">Help </a></h5>
+    <button class="btn" type="button" onClick='location.replace("{{URL_ROOT}}/exam/manage/create_demo_course");'>Create Demo Course</button>
+    <div style="display: none;" id="help">
+    <ol>
+    <ul>
+    <li>A Demo Course and Demo Quiz will be created (Click Courses link on nav bar to view courses).</li>
+    <li>Some Demo Questions are also created for you (Click Questions link on nav bar to view questions).</li>
+    <li>In Courses you can view Demo Quiz.</li>
+    <li>Click on the Demo Quiz and Click on User Mode or God Mode to take the quiz.
+    </li>
+    <li>You can also edit the Demo quiz.
+    </li>
+    </ul>
+    </p>
+    <a href="" onclick="$('#help').hide(); return false"> Close </a>
+    </div>
+    {% if msg %}
+    <h4>{{ msg }}</h4>
+    {% endif %}
+</center>
+{% if trial_paper %}
+  <h5/> You have trial papers.
+  <table class="table table-bordered">
+  <form action="" method="post">
+  {% csrf_token %}
+   {% for paper in trial_paper %}
+  <tr>
+  <td> <input type = "checkbox" name="delete_paper" value = {{paper.id}}></input></td>
+  <td> <a href="{{URL_ROOT}}/exam/manage/gradeuser/{{paper.question_paper.quiz.id}}">{{paper.question_paper.quiz.description}}</a></td>
+  </tr>
+  {% endfor %}
+  </table>
+  <center><button class="btn" type="submit">Delete Selected</button></center>
+  </form>
+  {% endif %}
+{% endblock %}
diff --git a/yaksh/templates/yaksh/monitor.html b/yaksh/templates/yaksh/monitor.html
index 9554737..7a3297b 100644
--- a/yaksh/templates/yaksh/monitor.html
+++ b/yaksh/templates/yaksh/monitor.html
@@ -1,15 +1,11 @@
 {% extends "manage.html" %}
 
-{% block title %} Quiz results {% endblock title %}
+{% block pagetitle %} Quiz results {% endblock pagetitle %}
 
 {% block meta %} <meta http-equiv="refresh" content="30"/> {% endblock meta %}
 
-{% block css %}
-<link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/question_quiz.css" type="text/css" /> 
-{% endblock %}
 
 {% block script %}
-<script src="{{ URL_ROOT }}/static/yaksh/js/jquery-1.9.1.min.js" type="text/javascript"></script>
 <script src="{{ URL_ROOT }}/static/yaksh/js/jquery.tablesorter.min.js"></script>
 <script type="text/javascript">
 $(document).ready(function() 
@@ -32,7 +28,7 @@ $(document).ready(function()
   {{ quiz.description }} Results
   {% endif %}
 {% endblock %}
-{% block manage %}
+{% block content %}
   {% if not quizzes and not quiz %}
     <center><h5> No quizzes available. </h5></center>
   {% endif %}
@@ -40,9 +36,9 @@ $(document).ready(function()
 {# ############################################################### #}
 {# This is rendered when we are just viewing exam/monitor #}
 {% if quizzes %}
-<ul>
+<ul class="list-group">
 {% for q in quizzes %}
-<li><a href="{{URL_ROOT}}/exam/manage/monitor/{{q.id}}/">{{ q.quiz.description }}</a></li>
+<li class="list-group-item"><a href="{{URL_ROOT}}/exam/manage/monitor/{{q.id}}/">{{ q.quiz.description }}</a></li>
 {% endfor %}
 </ul>
 {% endif %}
@@ -55,7 +51,7 @@ $(document).ready(function()
 <p>Number of papers: {{ papers|length }} </p>
 <p><a href="{{URL_ROOT}}/exam/manage/statistics/question/{{papers.0.question_paper.id}}">Question Statisitics</a></p>
 <p><a href="{{URL_ROOT}}/exam/manage/monitor/download_csv/{{papers.0.question_paper.id}}">Download CSV</a></p>
-<table border="1" cellpadding="3"  id="result-table" class="tablesorter">
+<table id="result-table" class="tablesorter table">
     <thead>
     <tr>
     <th> Name </th>
@@ -87,4 +83,4 @@ $(document).ready(function()
 <p> No answer papers so far. </p>
 {% endif %} {# if papers #}
 {% endif %}
-{% endblock %}
\ No newline at end of file
+{% endblock %}
diff --git a/yaksh/templates/yaksh/profile_updated.html b/yaksh/templates/yaksh/profile_updated.html
index 6ccf177..2a2c7c5 100644
--- a/yaksh/templates/yaksh/profile_updated.html
+++ b/yaksh/templates/yaksh/profile_updated.html
@@ -2,8 +2,6 @@
 <!DOCTYPE html>
 {% block title %} Profile {% endblock %}
 
-{% block pagetitle %} Online Test {% endblock %}
-
 {% block script %}
 <script>
     window.setTimeout(function(){ location.href="{{ URL_ROOT }}/exam/" }, 2000);
diff --git a/yaksh/templates/yaksh/question.html b/yaksh/templates/yaksh/question.html
index 9e1f734..a8de448 100644
--- a/yaksh/templates/yaksh/question.html
+++ b/yaksh/templates/yaksh/question.html
@@ -1,9 +1,7 @@
 {% extends "base.html" %}
 {% load custom_filters %}
 
-<!DOCTYPE html>
-
-{% block title %} Answer question {% endblock %}
+{% block pagetitle %} Hi {{ paper.user.first_name.title}} {{ paper.user.last_name.title}}  Answer question {% endblock %}
 
 {% block css %}
 <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/question.css" type="text/css" />
@@ -12,7 +10,6 @@
 
 {% block script %}
 <script src="{{ URL_ROOT }}/static/yaksh/js/question.js"></script>
-<script src="{{ URL_ROOT }}/static/yaksh/js/bootstrap-modal.js"></script>
 <script src="{{ URL_ROOT }}/static/yaksh/js/codemirror/lib/codemirror.js"></script>
 <script src="{{ URL_ROOT }}/static/yaksh/js/codemirror/mode/python/python.js"></script>
 <script src="{{ URL_ROOT }}/static/yaksh/js/codemirror/mode/clike/clike.js"></script>
@@ -92,25 +89,11 @@ function call_skip(url)
 {% block onload %} onload="updateTime();" {% endblock %}
 
 {% block content %}
-<div class="topbar">
-  <div class="fill">
-     <div class="container">
-        <h3 class="brand"><strong>Online Test</h3></strong>
-        <h5><a> Hi {{ paper.user.first_name.title}} {{ paper.user.last_name.title}} </a></h5>
-        <div class=time-div id="time_left"></div><br>
         <b style="color: white; font-size: 14px;">You have {{ paper.questions_left }} question(s) left in {{ paper.question_paper.quiz.description }}</b>
-     </div>
-   </div>
-</div>
-<form id="logout" action="{{URL_ROOT}}/exam/quit/{{ paper.attempt_number }}/{{ paper.question_paper.id }}/" method="post" class="pull-right">
-        {% csrf_token %}
-        <button class="btn" type="submit" name="quit">Quit Exam</button>
-</form>
-<div class = "container">
-  <div class="sidebar">
-    <p>Question Navigator </p>
-    <div class="pagination">
-        <ul>
+        <div class=time-div id="time_left"></div><br>
+<p>Question Navigator </p>
+    <div class="list-group">
+        <ul class="pagination">
             {% for qid in paper.questions.all %}
                 {% if qid in paper.questions_unanswered.all %}
                 {% if qid.id == question.id %}
@@ -120,85 +103,94 @@ function call_skip(url)
                     {% endif %}
                 {% endif %}
                 {% if qid in paper.questions_answered.all %}
-                    <li class="disabled"><a href="#" data-toggle="tooltip" title="{{ qid.description }}" >{{ forloop.counter }}</a></li>
+                    <li class="disabled"><a style="background-color:#B4B8BA" href="#" data-toggle="tooltip" title="{{ qid.description }}" >{{ forloop.counter }}</a></li>
                 {% endif %}
             {% endfor %}
         </ul>
     </div>
-  </div>
-</div>
-<div class="span13">
-  <h4><u> {{ question.summary }} </u><font class=pull-right>(Marks : {{ question.points }}) </font>
-  </h4>
-  <h4><font size=3 face=arial> {{ question.language|title }} {{ question.type|title }} Question</font></h4><br>
-  <font size=3 face=arial> {{ question.description|safe }} </font>
-  {% if files %}
-  <h4>Files to download for this question</h4>
-  {% for f_name in files %}
-  {% if f_name.question_id == question.id %}
-  <h5><a href="{{f_name.file.url}}">{{f_name.file.name}}</a></h5>
-  {% endif %}
-  {% endfor %}
-  {% endif %}
+<div class="col-md-11">
 <br> 
          <p id="status"></p>
          <form id="code" action="{{URL_ROOT}}/exam/{{ question.id }}/check/{{ paper.attempt_number }}/{{ paper.question_paper.id }}/" method="post" enctype="multipart/form-data">
          {% csrf_token %}
          <input type=hidden name="question_id" id="question_id" value={{ question.id }}></input>
+             <div class="panel panel-default">
+                 <div class="panel-heading">
+                      <h4><u> {{ question.summary }} </u><font class=pull-right>(Marks : {{ question.points }}) </font>
+                      </h4>
+                      <h4><font size=3 face=arial> {{ question.language|title }} {{ question.type|title }} Question</font></h4><br>
+                      <font size=3 face=arial> {{ question.description|safe }} </font>
+                      {% if files %}
+                      <h4>Files to download for this question</h4>
+                      {% for f_name in files %}
+                      {% if f_name.question_id == question.id %}
+                      <h5><a href="{{f_name.file.url}}">{{f_name.file.name}}</a></h5>
+                      {% endif %}
+                      {% endfor %}
+                      {% endif %}
+                 </div>
+                 <div class="panel-body">
+                     {% if question.type == "mcq" %}
+                    {% if error_message %}
+                        <p>{{ error_message }}</p>
+                    {% endif %}
+                     {% for test_case in test_cases %}
+                     <input name="answer" type="radio" value="{{ test_case.options }}" />{{ test_case.options }} <br/>
+                     {% endfor %}
+                     {% endif %}
+                     {% if question.type == "mcc" %}
+                    {% if error_message %}
+                        <p>{{ error_message }}</p>
+                    {% endif %}
+                     {% for test_case in test_cases %}
+                     <input name="answer" type="checkbox" value="{{ test_case.options }}"> {{ test_case.options }}
+                     <br>
+                     {% endfor %}
+                     {% endif %}
+                     {% if question.type == "upload" %}
+                     <p>Upload assignment file for the said question<p>
+                     <input type=file id="assignment" name="assignment">
+                     <hr>
+                     {% endif %}
+                     {% if question.type == "code" %}
+
+                     <h4>Program:</h4>
+                     <textarea name="answer" id="answer"></textarea>
+                     <br>
+
+                     {% endif %}
+                 </div>
+                <div class="panel-footer">
+                     {% if question.type == "code" %}
+                     {% if error_message %}
+                         <p> Output Message</p>
+                         <div class="alert alert-danger" role="alert">
+                         {{ error_message }}
+                         </div>
+                      {% endif %}
+                     {% endif %}
+                </div>
+             </div>
+             <div class="from-group">
 
-         {% if question.type == "mcq" %}
-        {% if error_message %}
-            <p>{{ error_message }}</p>
-        {% endif %}
-         {% for test_case in test_cases %}
-         <input name="answer" type="radio" value="{{ test_case.options }}" />{{ test_case.options }} <br/>
-         {% endfor %}
-         {% endif %}
-         {% if question.type == "mcc" %}
-        {% if error_message %}
-            <p>{{ error_message }}</p>
-        {% endif %}
-         {% for test_case in test_cases %}
-         <input name="answer" type="checkbox" value="{{ test_case.options }}"> {{ test_case.options }}
-         <br>
-         {% endfor %}
-         {% endif %}
-         {% if question.type == "upload" %}
-         <p>Upload assignment file for the said question<p>
-         <input type=file id="assignment" name="assignment">
-         <hr>
-         {% endif %}
-         {% if question.type == "code" %}
-
-         <h4>Program:</h4>
-         <textarea name="answer" id="answer"></textarea>
-         <br>
-
-         {% endif %}
-         {% if question.type == "code" %}
-         <br><h4>Output:</h4><br>
-         {% if error_message %}
-          <div class="alert alert-error">
-          <textarea class="error" readonly="yes">{{ error_message }}</textarea>
-          {% else %}
-           <textarea class="error_msg" readonly="yes"></textarea>
-          {% endif %}
-          </div>
-         {% endif %}
- 
          {% if question.type == "mcq" or question.type == "mcc"%}
-         <br><button class="btn" type="submit" name="check" id="check">Submit Answer</button>&nbsp;&nbsp;
+         <br><button class="btn btn-primary" type="submit" name="check" id="check">Submit Answer</button>&nbsp;&nbsp;
          {% elif question.type == "upload" %}
-         <br><button class="btn" type="submit" name="check" id="check" onClick="return validate();">Upload</button>&nbsp;&nbsp;
+         <br><button class="btn btn-primary" type="submit" name="check" id="check" onClick="return validate();">Upload</button>&nbsp;&nbsp;
          {% else %}
-         <button class="btn" type="submit" name="check" id="check" onClick="submitCode();">Check Answer</button>&nbsp;&nbsp;
-         <button class="btn" type="button" onclick="reset_editor()" name="reset" id="reset">Reset Answer</button>
+         <button class="btn btn-primary" type="submit" name="check" id="check" onClick="submitCode();">Check Answer <span class="glyphicon glyphicon-cog"></span></button>&nbsp;&nbsp;
+         <button class="btn btn-primary" type="button" onclick="reset_editor()" name="reset" id="reset">Reset Answer <span class="glyphicon glyphicon-refresh"></span></button>
 
          {% endif %}
          {% if paper.unanswered.all|length != 1 %}
-             <button class="btn"  onclick="call_skip('{{ URL_ROOT }}/exam/{{ question.id }}/skip/{{ paper.attempt_number }}/{{ paper.question_paper.id }}/')" name="skip" id="skip">Attempt Later</button>&nbsp;&nbsp;
+         <button class="btn btn-primary"  onclick="call_skip('{{ URL_ROOT }}/exam/{{ question.id }}/skip/{{ paper.attempt_number }}/{{ paper.question_paper.id }}/')" name="skip" id="skip">Attempt Later <span class="glyphicon glyphicon-arrow-right"></span></button>
          {% endif %}
+         </div>
          </form>
+<form id="logout" action="{{URL_ROOT}}/exam/quit/{{ paper.attempt_number }}/{{ paper.question_paper.id }}/" method="post" class="pull-right">
+        {% csrf_token %}
+        <button class="btn btn-primary" type="submit" name="quit">Quit Exam <span class="glyphicon glyphicon-off"></span></button>
+</form>
 </div>
     <!-- Modal -->
     <div class="modal fade " id="upload_alert" >
diff --git a/yaksh/templates/yaksh/quizzes_user.html b/yaksh/templates/yaksh/quizzes_user.html
index 98c156b..afed652 100644
--- a/yaksh/templates/yaksh/quizzes_user.html
+++ b/yaksh/templates/yaksh/quizzes_user.html
@@ -3,35 +3,27 @@
 
 {% block subtitle %}Hello {{ user.first_name }}, welcome to your dashboard !{% endblock %}
 
-{% block css %}
-<link rel="stylesheet" media="all" type="text/css" href="{{ URL_ROOT }}/static/yaksh/css/course.css" />
-{% endblock %}
-
-{% block script %}
-<script src="{{ URL_ROOT }}/static/yaksh/js/bootstrap-alert.js"></script>
-<script src="{{ URL_ROOT }}/static/yaksh/js/quizzes_user.js"></script>
-{% endblock %}
-
 
-{% block manage %}
+{% block pagetitle %} Student's Dashboard {% endblock pagetitle %}
+{% block content %}
 
 <center><b><u>Available Courses</u></b></center><br>
 {% for course in courses %}
-<div class="row show-grid">
-    <div class="span14">
+<div class="row well">
+    <div class="col-md-12">
         <div class="row">
-            <div class="span6">
+            <div class="col-md-4">
                 <h4><b><u> {{ course.name }} by {{ course.creator }}</u></b></h4>
             </div>
-             <div class="span6">
-                {% if user in course.requests.all %} <span class="label warning">Request Pending </span>
-                {% elif user in course.rejected.all %}<span class="label important">Request Rejected</span>
-                {% elif user in course.students.all %}<span class="label notice">Enrolled</span>
+             <div class="col-md-4">
+                {% if user in course.requests.all %} <span class="label label-warning">Request Pending </span>
+                {% elif user in course.rejected.all %}<span class="label label-danger">Request Rejected</span>
+                {% elif user in course.students.all %}<span class="label label-info">Enrolled</span>
                 {% else %}
                         {% if course.is_self_enroll %}
-                            <a class="btn success" href="{{ URL_ROOT }}/exam/self_enroll/{{ course.id }}">Enroll</a>
+                            <a class="btn btn-success" href="{{ URL_ROOT }}/exam/self_enroll/{{ course.id }}">Enroll</a>
                         {% else %}
-                            <a class="btn success" href="{{ URL_ROOT }}/exam/enroll_request/{{ course.id }}">Enroll Request</a>
+                            <a class="btn btn-success" href="{{ URL_ROOT }}/exam/enroll_request/{{ course.id }}">Enroll</a>
                         {% endif %}
                 {% endif %}
              </div>
@@ -46,7 +38,7 @@
                 {% if not quizzes %}
                     <h5>No active quizzes for you</h5>
                 {% endif %}
-                <table>
+                <table class="table table-bordered">
                     <th>Quiz</th>
                     <th>View Answer Paper</th>
                     <th>Pre requisite quiz</th>
@@ -60,7 +52,7 @@
                             {% else %}
                                 <td>
                                     <a href="{{ URL_ROOT }}/exam/start/{{quiz.questionpaper_set.get.id}}">{{ quiz.description }}</a><br>
-                                    {{ quiz.description }} <span class="label important">INACTIVE</span><br>
+                                    {{ quiz.description }} <span class="label label-danger">INACTIVE</span><br>
                                 </td>
                             {% endif %}
                             <td>
@@ -84,13 +76,13 @@
             {% endif %}
         </div>
     </div>
-</div><!--/row show-grid-->
+</div><!--/row-->
  </br>
 {% endfor %}
 <hr>
 <h4>List of quizzes taken by you so far</h4>
 {% if quizzes_taken %}
-    <table class="bordered-table zebra-striped">
+    <table class="table table-bordered">
         <th>Quiz</th>
         <th>Result</th>
         <th>Marks Obtained</th>
diff --git a/yaksh/templates/yaksh/register.html b/yaksh/templates/yaksh/register.html
index 5ff79cc..7cf15a6 100644
--- a/yaksh/templates/yaksh/register.html
+++ b/yaksh/templates/yaksh/register.html
@@ -1,20 +1,18 @@
 {% extends "base.html" %}
 
-{% block title %}Registration form {% endblock %}
 
-{% block pagetitle %}Online Test {% endblock %}
-{% block formtitle %}Please fill in the following details {% endblock %}
+{% block pagetitle %} Online Test Registration {% endblock %}
 
 {% block content %}
 
-
-
 <form action="" method="post">
     {% csrf_token %}
-    <center><table class=span1>
+    <h3> Please fill in the following details:</h3>
+    <center>
+        <table class="table">
     {{ form.as_table }}
     </table></center>
-    <center><button class="btn" type="submit">Register</button>&nbsp;&nbsp;<button class="btn" type="reset">Cancel</button></center>
+    <center><button class="btn btn-primary" type="submit">Register</button>&nbsp;&nbsp;<button class="btn btn-primary" type="reset">Cancel</button></center>
 </form>
 
 {% endblock content %}
diff --git a/yaksh/templates/yaksh/regrade.html b/yaksh/templates/yaksh/regrade.html
index 77d8ec4..844c6ee 100644
--- a/yaksh/templates/yaksh/regrade.html
+++ b/yaksh/templates/yaksh/regrade.html
@@ -1,18 +1,8 @@
 {% extends "manage.html" %}
 
-{% block title %} Grader {% endblock title %}
+{% block pagetitle %} Grader {% endblock pagetitle %}
 
-{% block css %}
-<link rel="stylesheet" media="all" type="text/css" href="{{ URL_ROOT }}/static/yaksh/css/bootstrap.css" />
-{% endblock %}
-{% block subtitle %}
-    Grader
-    {% endblock %}
-    {% block script %}
-    <script src="{{ URL_ROOT }}/static/yaksh/js/jquery-1.9.1.min.js"></script>
-    <script src="{{ URL_ROOT }}/static/yaksh/js/bootstrap.min.js"></script>
-    {% endblock %}
-    {% block manage %}
+{% block content %}
 
 <div class="row">
  <div class="col-md-3">
@@ -44,8 +34,8 @@
       </span></h4>
        <div id="questions_quizzes{{ course.id }}" class="collapse">
         {% for quiz in course.quiz_set.all %}
-         <p><a href="#questions_questions{{ quiz.id }}" data-toggle="collapse">Quiz: {{ quiz }}</a></p>
-          <div id="questions_questions{{ quiz.id }}" class="collapse">
+          <p><a href="#questions_questions{{ course.id }}{{ quiz.id }}" data-toggle="collapse">Quiz: {{ quiz }}</a></p>
+          <div id="questions_questions{{ course.id }}{{ quiz.id }}" class="collapse">
            {% with questionpaper=quiz.questionpaper_set.get %}
             <p class="bg-info"> Questions: </p>
             <ol class="list-group">
@@ -80,8 +70,8 @@
      </span></h4>
      <div id="quizzes_quizzes{{ course.id }}" class="collapse">
       {% for quiz in course.quiz_set.all %}
-       <p><a href="#quizzes_papers{{ quiz.id }}" data-toggle="collapse">Quiz: {{ quiz }}</a></p>
-       <div id="quizzes_papers{{ quiz.id }}" class="collapse">
+      <p><a href="#quizzes_papers{{ course.id }}{{ quiz.id }}" data-toggle="collapse">Quiz: {{ quiz }}</a></p>
+       <div id="quizzes_papers{{ course.id }}{{ quiz.id }}" class="collapse">
        <ol class="list-group">
        {% for answerpaper in quiz.questionpaper_set.get.answerpaper_set.all %}
        <li class="list-group">
@@ -114,8 +104,8 @@
       </span></h4>
       <div id="users_users{{ course.id }}" class="collapse">
        {% for user in course.students.all %}
-        <p><a href="#users_papers{{ user.id }}" data-toggle="collapse"> Answer Papers for {{ user.get_full_name }}</a></p>
-         <div id="users_papers{{ user.id }}" class="collapse">
+       <p><a href="#users_papers{{ course.id }}{{ user.id }}" data-toggle="collapse"> Answer Papers for {{ user.get_full_name }}</a></p>
+        <div id="users_papers{{ course.id }}{{ user.id }}" class="collapse">
          <ol class="list-group">
          {% for answerpaper in user.answerpaper_set.all %}
          <li class="list-group"> Quiz: {{answerpaper.question_paper.quiz.description }}; Attempt Number: {{ answerpaper.attempt_number }}
diff --git a/yaksh/templates/yaksh/results_user.html b/yaksh/templates/yaksh/results_user.html
index 3a6450d..2704da8 100644
--- a/yaksh/templates/yaksh/results_user.html
+++ b/yaksh/templates/yaksh/results_user.html
@@ -1,16 +1,10 @@
 {% extends "user.html" %}
 
-
-{% block subtitle %}Results{% endblock %}
-
-{% block css %}
-<link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/question_quiz.css" type="text/css" />
-{% endblock %}
-
-{% block manage %}
-<form action="" method="post" name=frm>
+{% block pagetitle %} Results {% endblock pagetitle %}
+{% block content %}
+<form>
   {% csrf_token %}
-  <center><table class="span6">
+  <center><table class="table well">
     <th>Quiz Description
     <th>Obtained Marks
     <th>Maximum Marks
diff --git a/yaksh/templates/yaksh/showquestions.html b/yaksh/templates/yaksh/showquestions.html
index 185cbfb..3668c9e 100644
--- a/yaksh/templates/yaksh/showquestions.html
+++ b/yaksh/templates/yaksh/showquestions.html
@@ -1,21 +1,20 @@
 {% extends "manage.html" %}
 
 
-{% block subtitle %}List of Questions {% endblock %}
+{% block pagetitle %} List of Questions {% endblock pagetitle %}
 
 {% block script %}
-<script src="{{ URL_ROOT }}/static/yaksh/js/min.js"></script>
 <script src="{{ URL_ROOT }}/static/yaksh/js/show_question.js"></script>
 <script src="{{ URL_ROOT }}/static/yaksh/js/question_filter.js"></script>
 {% endblock %}
 
-{% block manage %}
+{% block content %}
 
 <h4>Upload ZIP file for adding questions</h4>
 <form action="" method="post"  enctype="multipart/form-data">
 {% csrf_token %}
 {{ upload_form.as_p }}
-<button class="btn" type="submit" name="upload" value="upload">Upload File</button>
+<button class="btn btn-primary" type="submit" name="upload" value="upload">Upload File <span class="glyphicon glyphicon-open"></span></button>
 </form>
 {% if message %}
 <h4>{{ message }}</h4>
@@ -27,38 +26,34 @@
 {% csrf_token %}
 <div class="row" id="selectors">
     <h5 style="padding-left: 20px;">Filters</h5>
-    <div class="span4">
+    <div class="col-md-3">
         {{ form.question_type }}
     </div>
-    <div class="span4">
+    <div class="col-md-3">
         {{ form.language }}
     </div>
-    <div class="span4">
+    <div class="col-md-3">
         {{ form.marks }}
     </div>
 </div>
 <br>
-<div class="row">
-<div class="span16">
-    <button class="btn" type="button" onClick='location.replace("{{URL_ROOT}}");'>Clear Filters</button>
-</div>
-</div>
+    <button class="btn btn-primary" type="button" onClick='location.replace("{{URL_ROOT}}");'>Clear Filters</button>
 <br>
 
 <div id="filtered-questions">
 {% if questions %}
-<h5 class="highlight"><input id="checkall" class="ignore" type="checkbox"> Select All </h5>
+<h5><input id="checkall" type="checkbox"> Select All </h5>
 {% for i in questions %}
 <input type="checkbox" name="question" value="{{ i.id }}">&nbsp;&nbsp;<a href="{{URL_ROOT}}/exam/manage/addquestion/{{ i.id }}">{{ i }}</a><br>
 {% endfor %}
 {% endif %}
 </div>
 <br>
-<button class="btn" type="button" onclick='location.replace("{{URL_ROOT}}/exam/manage/addquestion/");'>Add Question</button>&nbsp;&nbsp;
-<button class="btn" type="submit" onClick="return confirm_delete(frm);" name='delete' value='delete'>Delete Selected</button>&nbsp;&nbsp;
+<button class="btn btn-primary" type="button" onclick='location.replace("{{URL_ROOT}}/exam/manage/addquestion/");'>Add Question <span class="glyphicon glyphicon-plus"></span></button>&nbsp;&nbsp;
 {% if questions %}
-<button class="btn" type="submit" name='download' value='download'>Download Selected</button>&nbsp;&nbsp;
-<button class="btn" type="submit" name="test" value="test">Test Selected</button>
+<button class="btn btn-primary" type="submit" name='download' value='download'>Download Selected <span class="glyphicon glyphicon-save"></span></button>&nbsp;&nbsp;
+<button class="btn btn-primary" type="submit" name="test" value="test">Test Selected</button>&nbsp;&nbsp;
 {% endif %}
+<button class="btn btn-danger" type="submit" onClick="return confirm_delete(frm);" name='delete' value='delete'>Delete Selected <span class="glyphicon glyphicon-minus"></span></button>
 </form>
 {% endblock %}
diff --git a/yaksh/templates/yaksh/statistics_question.html b/yaksh/templates/yaksh/statistics_question.html
index a63844f..31e889b 100644
--- a/yaksh/templates/yaksh/statistics_question.html
+++ b/yaksh/templates/yaksh/statistics_question.html
@@ -1,24 +1,18 @@
 {% extends "manage.html" %}
 
-{% block title %} Statistics {% endblock title %}
+{% block pagetitle %} Statistics for {{ quiz.description }}{% endblock pagetitle %}
 
-{% block css %}
-<link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/question_quiz.css" type="text/css" />
-{% endblock %}
-{% block subtitle %}
-Statistics for {{quiz.description}}
-{% endblock %}
-{% block manage %}
+{% block content %}
 <div class="row">
-    <div class="span2">
+    <div class="col-md-2">
 {% for attempt in attempts %}
     <p><a href="{{URL_ROOT}}/exam/manage/statistics/question/{{questionpaper_id}}/{{attempt}}">Attempt {{ attempt }}</a></p>
     {% endfor %}
 </div>
-<div class="span10">
+<div class="col-md-9">
 {% if question_stats %}
     <p><b>Total number of participants: {{ total }}</b></p>
-    <table class="bordered-table zebra-striped">
+    <table class="table table-bordered">
         <tr><th>Question</th><th>Type</th><th>Total</th><th>Answered</th></tr>
         {% for question, value in question_stats.items  %}
         <tr><td>{{ question.summary }}</td><td>{{ question.type }}</td><td>{{value.1}}</td><td>{{ value.0 }} ({% widthratio value.0 value.1 100 %}%)</td></tr>
diff --git a/yaksh/templates/yaksh/user_data.html b/yaksh/templates/yaksh/user_data.html
index 4d12e99..0a7e4aa 100644
--- a/yaksh/templates/yaksh/user_data.html
+++ b/yaksh/templates/yaksh/user_data.html
@@ -1,14 +1,8 @@
 {% extends "manage.html" %}
 
-{% block title %} Data for user {{ data.user.get_full_name.title }} {% endblock title %}
+{% block pagetitle %} Data for user {{ data.user.get_full_name.title }} {% endblock pagetitle %}
 
-{% block manage %}
-
-{% block subtitle %}Data for user {{ data.user.get_full_name.title }}{% endblock %}
-
-{% block css %}
-     <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/view_answerpaper.css" type="text/css" /> 
-{% endblock %}
+{% block content %}
 
 {% block script %}
     <script src= "{{ URL_ROOT }}/static/yaksh/js/edit_question.js"></script>
@@ -63,7 +57,7 @@ User IP address: {{ paper.user_ip }}
 
             <strong> Details: {{forloop.counter}}. {{ question.summary }}
             <a href="" onClick="grade_data('show_question{{question.id}}'); return false;"> Show Question </a>
-            <span class="marks"> Mark(s): {{ question.points }} </span>
+            <span class="marks pull-right"> Mark(s): {{ question.points }} </span>
             </strong>
         </div>
         <div class="panel-body" id="show_question{{question.id}}" style="display: none;">
diff --git a/yaksh/templates/yaksh/view_answerpaper.html b/yaksh/templates/yaksh/view_answerpaper.html
index 9227561..9dfbda0 100644
--- a/yaksh/templates/yaksh/view_answerpaper.html
+++ b/yaksh/templates/yaksh/view_answerpaper.html
@@ -1,13 +1,8 @@
 {% extends "user.html" %}
-{% block css %}
-<link rel="stylesheet" media="all" type="text/css" href="{{ URL_ROOT }}/static/yaksh/css/view_answerpaper.css" />
-{% endblock %}
-
-{% block title %} Answer Paper  for {{ quiz.description }}{% endblock title %}
 
-{% block manage %}
+{% block pagetitle %} Answer Paper  for {{ quiz.description }}{% endblock pagetitle %}
 
-{% block subtitle %} Answer Paper for {{ quiz.description }}{% endblock %}
+{% block content %}
 
 {% if not data.papers %}
     <p><b> You have not attempted the quiz {{ quiz.description }} </b></p>
@@ -39,7 +34,7 @@
     <div class="panel panel-info">
         <div class="panel-heading">
             <strong> Details: {{forloop.counter}}. {{ question.summary }} 
-            <span class="marks"> Mark(s): {{ question.points }} </span>
+            <span class="marks pull-right"> Mark(s): {{ question.points }} </span>
             </strong>
         </div>
         <div class="panel-body">
diff --git a/yaksh/templates/yaksh/view_profile.html b/yaksh/templates/yaksh/view_profile.html
index be15d14..becd205 100644
--- a/yaksh/templates/yaksh/view_profile.html
+++ b/yaksh/templates/yaksh/view_profile.html
@@ -1,21 +1,12 @@
 {% extends "base.html" %}
 
-{% block title %} View Profile {% endblock %}
-
-{% block pagetitle %} Online Test {% endblock %}
-{% block css %}
-<link rel="stylesheet" media="all" type="text/css" href="{{ URL_ROOT }}/static/yaksh/css/base.css" />
-
-{% endblock %}
+{% block pagetitle %} My Profile {% endblock %}
 {% block content %}
 <ul>
-  <a href="{{ URL_ROOT }}/exam/editprofile/">Edit Profile</a>
-  <a href="{{ URL_ROOT }}/exam/">Back to Home</a>
+  <a class="btn btn-primary" href="{{ URL_ROOT }}/exam/editprofile/">Edit Profile</a>
+  <a class="btn btn-primary" href="{{ URL_ROOT }}/exam/">Back to Home</a>
 </ul>
-<div class="span14">
-  <center>
-  <h2>Your Profile Information</h2>
-  <table class="span1">
+  <table class="table">
   <tr>
     <th><label for="id_first_name"><h5>First name:</h5></label></th>
     <th><label for="id_first_name"><h5>{{ user.first_name }}</h5></label></th>
@@ -45,6 +36,4 @@
     <th><label for="id_position"><h5>{{ user.profile.position }}</h5></label></th>
   </tr>
   </table>
-  </center>
-</div>
 {% endblock %}
diff --git a/yaksh/views.py b/yaksh/views.py
index f91342d..1afcef7 100644
--- a/yaksh/views.py
+++ b/yaksh/views.py
@@ -333,7 +333,7 @@ def prof_manage(request):
         context = {'user': user, 'users_per_paper': users_per_paper,
                    'trial_paper': trial_paper
                    }
-        return my_render_to_response('manage.html', context, context_instance=ci)
+        return my_render_to_response('yaksh/moderator_dashboard.html', context, context_instance=ci)
     return my_redirect('/exam/login/')