diff --git a/ChangeRole.php b/ChangeRole.php
index bbd3856..0da8cb7 100644
--- a/ChangeRole.php
+++ b/ChangeRole.php
@@ -2,10 +2,69 @@
 
 include 'base.php';
 
-$q = $_GET['q'];
+$params = array($_SESSION['Username']);
+$options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+$ListRolesQuery = "SELECT DISTINCT R.Role, R.Designation, R.RoleID, R.Type FROM Roles as R, RoleInstances as RI WHERE RI.SiteUsername = ? AND RI.RoleID = R.RoleID ORDER BY R.RoleID, R.Designation, R.Type";
+$stmt = sqlsrv_query($con, $ListRolesQuery, $params, $options);
+if( $stmt === false ) {
+     die( print_r( sqlsrv_errors(), true));
+}
+
+// Make the first (and in this case, only) row of the result set available for reading.
+$RolesList = [];
+$Designations = [];
+$AccessPriv = [];
+while( sqlsrv_fetch( $stmt ) === true) {
+    $RolesList[] = sqlsrv_get_field( $stmt, 0);
+    $AccessPriv[] = sqlsrv_get_field( $stmt, 3);
+}
+
+
+$targetRole = $_GET['q'];
+$targetAccessType = $_GET['t'];
+
+$index = 0;
+$valid = false;
+foreach($RolesList as $ListedRole)
+{
+    if ($ListedRole == $targetRole)
+    {
+        
+        if ($AccessPriv[$index] == $targetAccessType)
+        {
+            $valid = true;
+            $_SESSION['Role'] = $targetRole;
+            $_SESSION['AccessType'] = $targetAccessType;
+            if ($targetRole == 'Admin')
+            {
+                /*$params = array($_SESSION['username']);
+                $options = array( "Scrollable" => 'static' );*/
+                $instQuery = "SELECT I.InstitutionName FROM Institutions as I, Administrators as A WHERE A.SiteUsername = ? AND I.InstitutionID = A.InstitutionID";
+                $stmt = sqlsrv_query( $con, $instQuery, $params, $options);
+                if ($stmt === false)
+                    die (print_r(sqlsrv_errors(), true));
+                if (sqlsrv_fetch( $stmt ) == true)
+                    $_SESSION['Institution'] = sqlsrv_get_field($stmt, 0);
+            }
+            elseif ($targetRole == 'Student')
+            {
+                $instQuery = "SELECT I.InstitutionName FROM Institutions as I, Students as S WHERE S.SiteUsername = ? AND I.InstitutionID = S.InstitutionID";
+                $stmt = sqlsrv_query( $con, $instQuery, $params, $options);
+                if ($stmt === false)
+                    die (print_r(sqlsrv_errors(), true));
+                if (sqlsrv_fetch( $stmt ) === true)
+                    $_SESSION['Institution'] = sqlsrv_get_field( $stmt, 0);
+                
+            }
+            echo "<meta http-equiv='refresh' content='0;/$targetRole/Home' />";
+        }
+    }
+    $index++;
+}
+if (!($valid))
+{
+    echo "<meta http-equiv='refresh' content='0;/Logout.php' />";
+}
 
-$_SESSION['Role'] = $q;
-$role = $_SESSION['Role'];
 
-echo "<meta http-equiv='refresh' content='0;/$role/Home' />";
 ?>
diff --git a/FlatUI/css/corpus/theme.css b/FlatUI/css/corpus/theme.css
new file mode 100644
index 0000000..9b39f6c
--- /dev/null
+++ b/FlatUI/css/corpus/theme.css
@@ -0,0 +1,6203 @@
+@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,300,700);
+/*!
+ * Bootstrap v3.0.0
+ *
+ * Copyright 2013 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 by @mdo and @fat.
+ */
+/*! normalize.css v2.1.0 | MIT License | git.io/normalize */
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+nav,
+section,
+summary {
+  display: block;
+}
+audio,
+canvas,
+video {
+  display: inline-block;
+}
+audio:not([controls]) {
+  display: none;
+  height: 0;
+}
+[hidden] {
+  display: none;
+}
+html {
+  font-family: sans-serif;
+  -webkit-text-size-adjust: 100%;
+  -ms-text-size-adjust: 100%;
+}
+body {
+  margin: 0;
+}
+a:focus {
+  outline: thin dotted;
+}
+a:active,
+a:hover {
+  outline: 0;
+}
+h1 {
+  font-size: 2em;
+  margin: 0.67em 0;
+}
+abbr[title] {
+  border-bottom: 1px dotted;
+}
+b,
+strong {
+  font-weight: bold;
+}
+dfn {
+  font-style: italic;
+}
+hr {
+  -moz-box-sizing: content-box;
+  box-sizing: content-box;
+  height: 0;
+}
+mark {
+  background: #ff0;
+  color: #000;
+}
+code,
+kbd,
+pre,
+samp {
+  font-family: monospace, serif;
+  font-size: 1em;
+}
+pre {
+  white-space: pre-wrap;
+}
+q {
+  quotes: "\201C" "\201D" "\2018" "\2019";
+}
+small {
+  font-size: 80%;
+}
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+sup {
+  top: -0.5em;
+}
+sub {
+  bottom: -0.25em;
+}
+img {
+  border: 0;
+}
+svg:not(:root) {
+  overflow: hidden;
+}
+figure {
+  margin: 0;
+}
+fieldset {
+  border: 1px solid #c0c0c0;
+  margin: 0 2px;
+  padding: 0.35em 0.625em 0.75em;
+}
+legend {
+  border: 0;
+  padding: 0;
+}
+button,
+input,
+select,
+textarea {
+  font-family: inherit;
+  font-size: 100%;
+  margin: 0;
+}
+button,
+input {
+  line-height: normal;
+}
+button,
+select {
+  text-transform: none;
+}
+button,
+html input[type="button"],
+input[type="reset"],
+input[type="submit"] {
+  -webkit-appearance: button;
+  cursor: pointer;
+}
+button[disabled],
+html input[disabled] {
+  cursor: default;
+}
+input[type="checkbox"],
+input[type="radio"] {
+  box-sizing: border-box;
+  padding: 0;
+}
+input[type="search"] {
+  -webkit-appearance: textfield;
+  -moz-box-sizing: content-box;
+  -webkit-box-sizing: content-box;
+  box-sizing: content-box;
+}
+input[type="search"]::-webkit-search-cancel-button,
+input[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+  border: 0;
+  padding: 0;
+}
+textarea {
+  overflow: auto;
+  vertical-align: top;
+}
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+@media print {
+  * {
+    text-shadow: none !important;
+    color: #000 !important;
+    background: transparent !important;
+    box-shadow: none !important;
+  }
+  a,
+  a:visited {
+    text-decoration: underline;
+  }
+  a[href]:after {
+    content: " (" attr(href) ")";
+  }
+  abbr[title]:after {
+    content: " (" attr(title) ")";
+  }
+  .ir a:after,
+  a[href^="javascript:"]:after,
+  a[href^="#"]:after {
+    content: "";
+  }
+  pre,
+  blockquote {
+    border: 1px solid #999;
+    page-break-inside: avoid;
+  }
+  thead {
+    display: table-header-group;
+  }
+  tr,
+  img {
+    page-break-inside: avoid;
+  }
+  img {
+    max-width: 100% !important;
+  }
+  @page  {
+    margin: 2cm .5cm;
+  }
+  p,
+  h2,
+  h3 {
+    orphans: 3;
+    widows: 3;
+  }
+  h2,
+  h3 {
+    page-break-after: avoid;
+  }
+  .navbar {
+    display: none;
+  }
+  .table td,
+  .table th {
+    background-color: #fff !important;
+  }
+  .btn > .caret,
+  .dropup > .btn > .caret {
+    border-top-color: #000 !important;
+  }
+  .label {
+    border: 1px solid #000;
+  }
+  .table {
+    border-collapse: collapse !important;
+  }
+  .table-bordered th,
+  .table-bordered td {
+    border: 1px solid #ddd !important;
+  }
+}
+*,
+*:before,
+*:after {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+html {
+  font-size: 62.5%;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+body {
+  font-family: "Open Sans", Arial, sans-serif;
+  font-size: 14px;
+  line-height: 1.428571429;
+  color: #333333;
+  background-color: #ffffff;
+}
+input,
+button,
+select,
+textarea {
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+}
+button,
+input,
+select[multiple],
+textarea {
+  background-image: none;
+}
+a {
+  color: #1abc9c;
+  text-decoration: none;
+}
+a:hover,
+a:focus {
+  color: #28e1bd;
+  text-decoration: underline;
+}
+a:focus {
+  outline: thin dotted #333;
+  outline: 5px auto -webkit-focus-ring-color;
+  outline-offset: -2px;
+}
+img {
+  vertical-align: middle;
+}
+.img-responsive {
+  display: block;
+  max-width: 100%;
+  height: auto;
+}
+.img-rounded {
+  border-radius: 0px;
+}
+.img-thumbnail {
+  padding: 4px;
+  line-height: 1.428571429;
+  background-color: #34495e;
+  border: 1px solid rgba(74, 104, 133, 0.81);
+  border-radius: 0px;
+  -webkit-transition: all 0.2s ease-in-out;
+  transition: all 0.2s ease-in-out;
+  display: inline-block;
+  max-width: 100%;
+  height: auto;
+}
+.img-circle {
+  border-radius: 50%;
+}
+hr {
+  margin-top: 20px;
+  margin-bottom: 20px;
+  border: 0;
+  border-top: 1px solid #808080;
+}
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  overflow: hidden;
+  clip: rect(0 0 0 0);
+  border: 0;
+}
+p {
+  margin: 0 0 10px;
+}
+.lead {
+  margin-bottom: 20px;
+  font-size: 16.099999999999998px;
+  font-weight: 200;
+  line-height: 1.4;
+}
+@media (min-width: 768px) {
+  .lead {
+    font-size: 21px;
+  }
+}
+small {
+  font-size: 85%;
+}
+cite {
+  font-style: normal;
+}
+.text-muted {
+  color: #999999;
+}
+.text-primary {
+  color: #1abc9c;
+}
+.text-warning {
+  color: #ffffff;
+}
+.text-danger {
+  color: #ffffff;
+}
+.text-success {
+  color: #ffffff;
+}
+.text-info {
+  color: #ffffff;
+}
+.text-left {
+  text-align: left;
+}
+.text-right {
+  text-align: right;
+}
+.text-center {
+  text-align: center;
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+.h1,
+.h2,
+.h3,
+.h4,
+.h5,
+.h6 {
+  font-family: "Open Sans", Arial, sans-serif;
+  font-weight: 500;
+  line-height: 1.1;
+}
+h1 small,
+h2 small,
+h3 small,
+h4 small,
+h5 small,
+h6 small,
+.h1 small,
+.h2 small,
+.h3 small,
+.h4 small,
+.h5 small,
+.h6 small {
+  font-weight: normal;
+  line-height: 1;
+  color: #808080;
+}
+h1,
+h2,
+h3 {
+  margin-top: 20px;
+  margin-bottom: 10px;
+}
+h4,
+h5,
+h6 {
+  margin-top: 10px;
+  margin-bottom: 10px;
+}
+h1,
+.h1 {
+  font-size: 36px;
+}
+h2,
+.h2 {
+  font-size: 30px;
+}
+h3,
+.h3 {
+  font-size: 24px;
+}
+h4,
+.h4 {
+  font-size: 18px;
+}
+h5,
+.h5 {
+  font-size: 14px;
+}
+h6,
+.h6 {
+  font-size: 12px;
+}
+h1 small,
+.h1 small {
+  font-size: 24px;
+}
+h2 small,
+.h2 small {
+  font-size: 18px;
+}
+h3 small,
+.h3 small,
+h4 small,
+.h4 small {
+  font-size: 14px;
+}
+.page-header {
+  padding-bottom: 9px;
+  margin: 40px 0 20px;
+  border-bottom: 1px solid #808080;
+}
+ul,
+ol {
+  margin-top: 0;
+  margin-bottom: 10px;
+}
+ul ul,
+ol ul,
+ul ol,
+ol ol {
+  margin-bottom: 0;
+}
+.list-unstyled {
+  padding-left: 0;
+  list-style: none;
+}
+.list-inline {
+  padding-left: 0;
+  list-style: none;
+}
+.list-inline > li {
+  display: inline-block;
+  padding-left: 5px;
+  padding-right: 5px;
+}
+dl {
+  margin-bottom: 20px;
+}
+dt,
+dd {
+  line-height: 1.428571429;
+}
+dt {
+  font-weight: bold;
+}
+dd {
+  margin-left: 0;
+}
+@media (min-width: 768px) {
+  .dl-horizontal dt {
+    float: left;
+    width: 160px;
+    clear: left;
+    text-align: right;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  .dl-horizontal dd {
+    margin-left: 180px;
+  }
+  .dl-horizontal dd:before,
+  .dl-horizontal dd:after {
+    content: " ";
+    /* 1 */
+  
+    display: table;
+    /* 2 */
+  
+  }
+  .dl-horizontal dd:after {
+    clear: both;
+  }
+  .dl-horizontal dd:before,
+  .dl-horizontal dd:after {
+    content: " ";
+    /* 1 */
+  
+    display: table;
+    /* 2 */
+  
+  }
+  .dl-horizontal dd:after {
+    clear: both;
+  }
+}
+abbr[title],
+abbr[data-original-title] {
+  cursor: help;
+  border-bottom: 1px dotted #999999;
+}
+abbr.initialism {
+  font-size: 90%;
+  text-transform: uppercase;
+}
+blockquote {
+  padding: 10px 20px;
+  margin: 0 0 20px;
+  border-left: 5px solid #1abc9c;
+}
+blockquote p {
+  font-size: 17.5px;
+  font-weight: 300;
+  line-height: 1.25;
+}
+blockquote p:last-child {
+  margin-bottom: 0;
+}
+blockquote small {
+  display: block;
+  line-height: 1.428571429;
+  color: #999999;
+}
+blockquote small:before {
+  content: '\2014 \00A0';
+}
+blockquote.pull-right {
+  padding-right: 15px;
+  padding-left: 0;
+  border-right: 5px solid #1abc9c;
+  border-left: 0;
+}
+blockquote.pull-right p,
+blockquote.pull-right small {
+  text-align: right;
+}
+blockquote.pull-right small:before {
+  content: '';
+}
+blockquote.pull-right small:after {
+  content: '\00A0 \2014';
+}
+q:before,
+q:after,
+blockquote:before,
+blockquote:after {
+  content: "";
+}
+address {
+  display: block;
+  margin-bottom: 20px;
+  font-style: normal;
+  line-height: 1.428571429;
+}
+code,
+pre {
+  font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
+}
+code {
+  padding: 2px 4px;
+  font-size: 90%;
+  color: #46627f;
+  background-color: #f2f2f2;
+  white-space: nowrap;
+  border-radius: 0px;
+}
+pre {
+  display: block;
+  padding: 9.5px;
+  margin: 0 0 10px;
+  font-size: 13px;
+  line-height: 1.428571429;
+  word-break: break-all;
+  word-wrap: break-word;
+  color: #e6e6e6;
+  background-color: #2b3c4e;
+  border: 1px solid #cccccc;
+  border-radius: 0px;
+}
+pre.prettyprint {
+  margin-bottom: 20px;
+}
+pre code {
+  padding: 0;
+  font-size: inherit;
+  color: inherit;
+  white-space: pre-wrap;
+  background-color: transparent;
+  border: 0;
+}
+.pre-scrollable {
+  max-height: 340px;
+  overflow-y: scroll;
+}
+.container {
+  margin-right: auto;
+  margin-left: auto;
+  padding-left: 15px;
+  padding-right: 15px;
+}
+.container:before,
+.container:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.container:after {
+  clear: both;
+}
+.container:before,
+.container:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.container:after {
+  clear: both;
+}
+.row {
+  margin-left: -15px;
+  margin-right: -15px;
+}
+.row:before,
+.row:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.row:after {
+  clear: both;
+}
+.row:before,
+.row:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.row:after {
+  clear: both;
+}
+.col-xs-1,
+.col-xs-2,
+.col-xs-3,
+.col-xs-4,
+.col-xs-5,
+.col-xs-6,
+.col-xs-7,
+.col-xs-8,
+.col-xs-9,
+.col-xs-10,
+.col-xs-11,
+.col-xs-12,
+.col-sm-1,
+.col-sm-2,
+.col-sm-3,
+.col-sm-4,
+.col-sm-5,
+.col-sm-6,
+.col-sm-7,
+.col-sm-8,
+.col-sm-9,
+.col-sm-10,
+.col-sm-11,
+.col-sm-12,
+.col-md-1,
+.col-md-2,
+.col-md-3,
+.col-md-4,
+.col-md-5,
+.col-md-6,
+.col-md-7,
+.col-md-8,
+.col-md-9,
+.col-md-10,
+.col-md-11,
+.col-md-12,
+.col-lg-1,
+.col-lg-2,
+.col-lg-3,
+.col-lg-4,
+.col-lg-5,
+.col-lg-6,
+.col-lg-7,
+.col-lg-8,
+.col-lg-9,
+.col-lg-10,
+.col-lg-11,
+.col-lg-12 {
+  position: relative;
+  min-height: 1px;
+  padding-left: 15px;
+  padding-right: 15px;
+}
+.col-xs-1,
+.col-xs-2,
+.col-xs-3,
+.col-xs-4,
+.col-xs-5,
+.col-xs-6,
+.col-xs-7,
+.col-xs-8,
+.col-xs-9,
+.col-xs-10,
+.col-xs-11 {
+  float: left;
+}
+.col-xs-1 {
+  width: 8.333333333333332%;
+}
+.col-xs-2 {
+  width: 16.666666666666664%;
+}
+.col-xs-3 {
+  width: 25%;
+}
+.col-xs-4 {
+  width: 33.33333333333333%;
+}
+.col-xs-5 {
+  width: 41.66666666666667%;
+}
+.col-xs-6 {
+  width: 50%;
+}
+.col-xs-7 {
+  width: 58.333333333333336%;
+}
+.col-xs-8 {
+  width: 66.66666666666666%;
+}
+.col-xs-9 {
+  width: 75%;
+}
+.col-xs-10 {
+  width: 83.33333333333334%;
+}
+.col-xs-11 {
+  width: 91.66666666666666%;
+}
+.col-xs-12 {
+  width: 100%;
+}
+@media (min-width: 768px) {
+  .container {
+    max-width: 720px;
+  }
+  .col-sm-1,
+  .col-sm-2,
+  .col-sm-3,
+  .col-sm-4,
+  .col-sm-5,
+  .col-sm-6,
+  .col-sm-7,
+  .col-sm-8,
+  .col-sm-9,
+  .col-sm-10,
+  .col-sm-11 {
+    float: left;
+  }
+  .col-sm-1 {
+    width: 8.333333333333332%;
+  }
+  .col-sm-2 {
+    width: 16.666666666666664%;
+  }
+  .col-sm-3 {
+    width: 25%;
+  }
+  .col-sm-4 {
+    width: 33.33333333333333%;
+  }
+  .col-sm-5 {
+    width: 41.66666666666667%;
+  }
+  .col-sm-6 {
+    width: 50%;
+  }
+  .col-sm-7 {
+    width: 58.333333333333336%;
+  }
+  .col-sm-8 {
+    width: 66.66666666666666%;
+  }
+  .col-sm-9 {
+    width: 75%;
+  }
+  .col-sm-10 {
+    width: 83.33333333333334%;
+  }
+  .col-sm-11 {
+    width: 91.66666666666666%;
+  }
+  .col-sm-12 {
+    width: 100%;
+  }
+  .col-sm-push-1 {
+    left: 8.333333333333332%;
+  }
+  .col-sm-push-2 {
+    left: 16.666666666666664%;
+  }
+  .col-sm-push-3 {
+    left: 25%;
+  }
+  .col-sm-push-4 {
+    left: 33.33333333333333%;
+  }
+  .col-sm-push-5 {
+    left: 41.66666666666667%;
+  }
+  .col-sm-push-6 {
+    left: 50%;
+  }
+  .col-sm-push-7 {
+    left: 58.333333333333336%;
+  }
+  .col-sm-push-8 {
+    left: 66.66666666666666%;
+  }
+  .col-sm-push-9 {
+    left: 75%;
+  }
+  .col-sm-push-10 {
+    left: 83.33333333333334%;
+  }
+  .col-sm-push-11 {
+    left: 91.66666666666666%;
+  }
+  .col-sm-pull-1 {
+    right: 8.333333333333332%;
+  }
+  .col-sm-pull-2 {
+    right: 16.666666666666664%;
+  }
+  .col-sm-pull-3 {
+    right: 25%;
+  }
+  .col-sm-pull-4 {
+    right: 33.33333333333333%;
+  }
+  .col-sm-pull-5 {
+    right: 41.66666666666667%;
+  }
+  .col-sm-pull-6 {
+    right: 50%;
+  }
+  .col-sm-pull-7 {
+    right: 58.333333333333336%;
+  }
+  .col-sm-pull-8 {
+    right: 66.66666666666666%;
+  }
+  .col-sm-pull-9 {
+    right: 75%;
+  }
+  .col-sm-pull-10 {
+    right: 83.33333333333334%;
+  }
+  .col-sm-pull-11 {
+    right: 91.66666666666666%;
+  }
+  .col-sm-offset-1 {
+    margin-left: 8.333333333333332%;
+  }
+  .col-sm-offset-2 {
+    margin-left: 16.666666666666664%;
+  }
+  .col-sm-offset-3 {
+    margin-left: 25%;
+  }
+  .col-sm-offset-4 {
+    margin-left: 33.33333333333333%;
+  }
+  .col-sm-offset-5 {
+    margin-left: 41.66666666666667%;
+  }
+  .col-sm-offset-6 {
+    margin-left: 50%;
+  }
+  .col-sm-offset-7 {
+    margin-left: 58.333333333333336%;
+  }
+  .col-sm-offset-8 {
+    margin-left: 66.66666666666666%;
+  }
+  .col-sm-offset-9 {
+    margin-left: 75%;
+  }
+  .col-sm-offset-10 {
+    margin-left: 83.33333333333334%;
+  }
+  .col-sm-offset-11 {
+    margin-left: 91.66666666666666%;
+  }
+}
+@media (min-width: 992px) {
+  .container {
+    max-width: 940px;
+  }
+  .col-md-1,
+  .col-md-2,
+  .col-md-3,
+  .col-md-4,
+  .col-md-5,
+  .col-md-6,
+  .col-md-7,
+  .col-md-8,
+  .col-md-9,
+  .col-md-10,
+  .col-md-11 {
+    float: left;
+  }
+  .col-md-1 {
+    width: 8.333333333333332%;
+  }
+  .col-md-2 {
+    width: 16.666666666666664%;
+  }
+  .col-md-3 {
+    width: 25%;
+  }
+  .col-md-4 {
+    width: 33.33333333333333%;
+  }
+  .col-md-5 {
+    width: 41.66666666666667%;
+  }
+  .col-md-6 {
+    width: 50%;
+  }
+  .col-md-7 {
+    width: 58.333333333333336%;
+  }
+  .col-md-8 {
+    width: 66.66666666666666%;
+  }
+  .col-md-9 {
+    width: 75%;
+  }
+  .col-md-10 {
+    width: 83.33333333333334%;
+  }
+  .col-md-11 {
+    width: 91.66666666666666%;
+  }
+  .col-md-12 {
+    width: 100%;
+  }
+  .col-md-push-0 {
+    left: auto;
+  }
+  .col-md-push-1 {
+    left: 8.333333333333332%;
+  }
+  .col-md-push-2 {
+    left: 16.666666666666664%;
+  }
+  .col-md-push-3 {
+    left: 25%;
+  }
+  .col-md-push-4 {
+    left: 33.33333333333333%;
+  }
+  .col-md-push-5 {
+    left: 41.66666666666667%;
+  }
+  .col-md-push-6 {
+    left: 50%;
+  }
+  .col-md-push-7 {
+    left: 58.333333333333336%;
+  }
+  .col-md-push-8 {
+    left: 66.66666666666666%;
+  }
+  .col-md-push-9 {
+    left: 75%;
+  }
+  .col-md-push-10 {
+    left: 83.33333333333334%;
+  }
+  .col-md-push-11 {
+    left: 91.66666666666666%;
+  }
+  .col-md-pull-0 {
+    right: auto;
+  }
+  .col-md-pull-1 {
+    right: 8.333333333333332%;
+  }
+  .col-md-pull-2 {
+    right: 16.666666666666664%;
+  }
+  .col-md-pull-3 {
+    right: 25%;
+  }
+  .col-md-pull-4 {
+    right: 33.33333333333333%;
+  }
+  .col-md-pull-5 {
+    right: 41.66666666666667%;
+  }
+  .col-md-pull-6 {
+    right: 50%;
+  }
+  .col-md-pull-7 {
+    right: 58.333333333333336%;
+  }
+  .col-md-pull-8 {
+    right: 66.66666666666666%;
+  }
+  .col-md-pull-9 {
+    right: 75%;
+  }
+  .col-md-pull-10 {
+    right: 83.33333333333334%;
+  }
+  .col-md-pull-11 {
+    right: 91.66666666666666%;
+  }
+  .col-md-offset-0 {
+    margin-left: 0;
+  }
+  .col-md-offset-1 {
+    margin-left: 8.333333333333332%;
+  }
+  .col-md-offset-2 {
+    margin-left: 16.666666666666664%;
+  }
+  .col-md-offset-3 {
+    margin-left: 25%;
+  }
+  .col-md-offset-4 {
+    margin-left: 33.33333333333333%;
+  }
+  .col-md-offset-5 {
+    margin-left: 41.66666666666667%;
+  }
+  .col-md-offset-6 {
+    margin-left: 50%;
+  }
+  .col-md-offset-7 {
+    margin-left: 58.333333333333336%;
+  }
+  .col-md-offset-8 {
+    margin-left: 66.66666666666666%;
+  }
+  .col-md-offset-9 {
+    margin-left: 75%;
+  }
+  .col-md-offset-10 {
+    margin-left: 83.33333333333334%;
+  }
+  .col-md-offset-11 {
+    margin-left: 91.66666666666666%;
+  }
+}
+@media (min-width: 1200px) {
+  .container {
+    max-width: 1170px;
+  }
+  .col-lg-1,
+  .col-lg-2,
+  .col-lg-3,
+  .col-lg-4,
+  .col-lg-5,
+  .col-lg-6,
+  .col-lg-7,
+  .col-lg-8,
+  .col-lg-9,
+  .col-lg-10,
+  .col-lg-11 {
+    float: left;
+  }
+  .col-lg-1 {
+    width: 8.333333333333332%;
+  }
+  .col-lg-2 {
+    width: 16.666666666666664%;
+  }
+  .col-lg-3 {
+    width: 25%;
+  }
+  .col-lg-4 {
+    width: 33.33333333333333%;
+  }
+  .col-lg-5 {
+    width: 41.66666666666667%;
+  }
+  .col-lg-6 {
+    width: 50%;
+  }
+  .col-lg-7 {
+    width: 58.333333333333336%;
+  }
+  .col-lg-8 {
+    width: 66.66666666666666%;
+  }
+  .col-lg-9 {
+    width: 75%;
+  }
+  .col-lg-10 {
+    width: 83.33333333333334%;
+  }
+  .col-lg-11 {
+    width: 91.66666666666666%;
+  }
+  .col-lg-12 {
+    width: 100%;
+  }
+  .col-lg-push-0 {
+    left: auto;
+  }
+  .col-lg-push-1 {
+    left: 8.333333333333332%;
+  }
+  .col-lg-push-2 {
+    left: 16.666666666666664%;
+  }
+  .col-lg-push-3 {
+    left: 25%;
+  }
+  .col-lg-push-4 {
+    left: 33.33333333333333%;
+  }
+  .col-lg-push-5 {
+    left: 41.66666666666667%;
+  }
+  .col-lg-push-6 {
+    left: 50%;
+  }
+  .col-lg-push-7 {
+    left: 58.333333333333336%;
+  }
+  .col-lg-push-8 {
+    left: 66.66666666666666%;
+  }
+  .col-lg-push-9 {
+    left: 75%;
+  }
+  .col-lg-push-10 {
+    left: 83.33333333333334%;
+  }
+  .col-lg-push-11 {
+    left: 91.66666666666666%;
+  }
+  .col-lg-pull-0 {
+    right: auto;
+  }
+  .col-lg-pull-1 {
+    right: 8.333333333333332%;
+  }
+  .col-lg-pull-2 {
+    right: 16.666666666666664%;
+  }
+  .col-lg-pull-3 {
+    right: 25%;
+  }
+  .col-lg-pull-4 {
+    right: 33.33333333333333%;
+  }
+  .col-lg-pull-5 {
+    right: 41.66666666666667%;
+  }
+  .col-lg-pull-6 {
+    right: 50%;
+  }
+  .col-lg-pull-7 {
+    right: 58.333333333333336%;
+  }
+  .col-lg-pull-8 {
+    right: 66.66666666666666%;
+  }
+  .col-lg-pull-9 {
+    right: 75%;
+  }
+  .col-lg-pull-10 {
+    right: 83.33333333333334%;
+  }
+  .col-lg-pull-11 {
+    right: 91.66666666666666%;
+  }
+  .col-lg-offset-0 {
+    margin-left: 0;
+  }
+  .col-lg-offset-1 {
+    margin-left: 8.333333333333332%;
+  }
+  .col-lg-offset-2 {
+    margin-left: 16.666666666666664%;
+  }
+  .col-lg-offset-3 {
+    margin-left: 25%;
+  }
+  .col-lg-offset-4 {
+    margin-left: 33.33333333333333%;
+  }
+  .col-lg-offset-5 {
+    margin-left: 41.66666666666667%;
+  }
+  .col-lg-offset-6 {
+    margin-left: 50%;
+  }
+  .col-lg-offset-7 {
+    margin-left: 58.333333333333336%;
+  }
+  .col-lg-offset-8 {
+    margin-left: 66.66666666666666%;
+  }
+  .col-lg-offset-9 {
+    margin-left: 75%;
+  }
+  .col-lg-offset-10 {
+    margin-left: 83.33333333333334%;
+  }
+  .col-lg-offset-11 {
+    margin-left: 91.66666666666666%;
+  }
+}
+table {
+  max-width: 100%;
+  background-color: transparent;
+}
+th {
+  text-align: left;
+}
+.table {
+  width: 100%;
+  margin-bottom: 20px;
+}
+.table thead > tr > th,
+.table tbody > tr > th,
+.table tfoot > tr > th,
+.table thead > tr > td,
+.table tbody > tr > td,
+.table tfoot > tr > td {
+  padding: 8px;
+  line-height: 1.428571429;
+  vertical-align: top;
+  border-top: 1px solid #444444;
+}
+.table thead > tr > th {
+  vertical-align: bottom;
+  border-bottom: 2px solid rgba(0, 63, 114, 0.81);
+}
+.table caption + thead tr:first-child th,
+.table colgroup + thead tr:first-child th,
+.table thead:first-child tr:first-child th,
+.table caption + thead tr:first-child td,
+.table colgroup + thead tr:first-child td,
+.table thead:first-child tr:first-child td {
+  border-top: 0;
+}
+.table tbody + tbody {
+  border-top: 2px solid rgba(74, 104, 133, 0.81);
+}
+.table .table {
+  background-color: #2c3e50;
+}
+.table-condensed thead > tr > th,
+.table-condensed tbody > tr > th,
+.table-condensed tfoot > tr > th,
+.table-condensed thead > tr > td,
+.table-condensed tbody > tr > td,
+.table-condensed tfoot > tr > td {
+  padding: 5px;
+}
+.table-bordered {
+  border: 1px solid rgba(74, 104, 133, 0.81);
+}
+.table-bordered > thead > tr > th,
+.table-bordered > tbody > tr > th,
+.table-bordered > tfoot > tr > th,
+.table-bordered > thead > tr > td,
+.table-bordered > tbody > tr > td,
+.table-bordered > tfoot > tr > td {
+  border: 1px solid rgba(74, 104, 133, 0.81);
+}
+.table-bordered > thead > tr > th,
+.table-bordered > thead > tr > td {
+  border-bottom-width: 2px;
+}
+.table-striped > tbody > tr:nth-child(odd) > td,
+.table-striped > tbody > tr:nth-child(odd) > th {
+  background-color: rgba(26, 188, 156, 0.1);
+}
+.table-hover > tbody > tr:hover > td,
+.table-hover > tbody > tr:hover > th {
+  background-color: rgba(56, 110, 128, 1);
+}
+table col[class*="col-"] {
+  float: none;
+  display: table-column;
+}
+table td[class*="col-"],
+table th[class*="col-"] {
+  float: none;
+  display: table-cell;
+}
+.table > thead > tr > td.active,
+.table > tbody > tr > td.active,
+.table > tfoot > tr > td.active,
+.table > thead > tr > th.active,
+.table > tbody > tr > th.active,
+.table > tfoot > tr > th.active,
+.table > thead > tr.active > td,
+.table > tbody > tr.active > td,
+.table > tfoot > tr.active > td,
+.table > thead > tr.active > th,
+.table > tbody > tr.active > th,
+.table > tfoot > tr.active > th {
+  background-color: rgba(26, 188, 156, 0.1);
+}
+.table > thead > tr > td.success,
+.table > tbody > tr > td.success,
+.table > tfoot > tr > td.success,
+.table > thead > tr > th.success,
+.table > tbody > tr > th.success,
+.table > tfoot > tr > th.success,
+.table > thead > tr.success > td,
+.table > tbody > tr.success > td,
+.table > tfoot > tr.success > td,
+.table > thead > tr.success > th,
+.table > tbody > tr.success > th,
+.table > tfoot > tr.success > th {
+  background-color: #2ecc71;
+  border-color: #29b74e;
+}
+.table-hover > tbody > tr > td.success:hover,
+.table-hover > tbody > tr > th.success:hover,
+.table-hover > tbody > tr.success:hover > td {
+  background-color: #29b765;
+  border-color: #25a245;
+}
+.table > thead > tr > td.danger,
+.table > tbody > tr > td.danger,
+.table > tfoot > tr > td.danger,
+.table > thead > tr > th.danger,
+.table > tbody > tr > th.danger,
+.table > tfoot > tr > th.danger,
+.table > thead > tr.danger > td,
+.table > tbody > tr.danger > td,
+.table > tfoot > tr.danger > td,
+.table > thead > tr.danger > th,
+.table > tbody > tr.danger > th,
+.table > tfoot > tr.danger > th {
+  background-color: #e74c3c;
+  border-color: #e52e3c;
+}
+.table-hover > tbody > tr > td.danger:hover,
+.table-hover > tbody > tr > th.danger:hover,
+.table-hover > tbody > tr.danger:hover > td {
+  background-color: #e43725;
+  border-color: #df1b2a;
+}
+.table > thead > tr > td.warning,
+.table > tbody > tr > td.warning,
+.table > tfoot > tr > td.warning,
+.table > thead > tr > th.warning,
+.table > tbody > tr > th.warning,
+.table > tfoot > tr > th.warning,
+.table > thead > tr.warning > td,
+.table > tbody > tr.warning > td,
+.table > tfoot > tr.warning > td,
+.table > thead > tr.warning > th,
+.table > tbody > tr.warning > th,
+.table > tfoot > tr.warning > th {
+  background-color: #f39c12;
+  border-color: #ea6f0c;
+}
+.table-hover > tbody > tr > td.warning:hover,
+.table-hover > tbody > tr > th.warning:hover,
+.table-hover > tbody > tr.warning:hover > td {
+  background-color: #e08e0b;
+  border-color: #d2630b;
+}
+@media (max-width: 768px) {
+  .table-responsive {
+    width: 100%;
+    margin-bottom: 15px;
+    overflow-y: hidden;
+    overflow-x: scroll;
+    border: 1px solid rgba(74, 104, 133, 0.81);
+  }
+  .table-responsive > .table {
+    margin-bottom: 0;
+    background-color: #fff;
+  }
+  .table-responsive > .table > thead > tr > th,
+  .table-responsive > .table > tbody > tr > th,
+  .table-responsive > .table > tfoot > tr > th,
+  .table-responsive > .table > thead > tr > td,
+  .table-responsive > .table > tbody > tr > td,
+  .table-responsive > .table > tfoot > tr > td {
+    white-space: nowrap;
+  }
+  .table-responsive > .table-bordered {
+    border: 0;
+  }
+  .table-responsive > .table-bordered > thead > tr > th:first-child,
+  .table-responsive > .table-bordered > tbody > tr > th:first-child,
+  .table-responsive > .table-bordered > tfoot > tr > th:first-child,
+  .table-responsive > .table-bordered > thead > tr > td:first-child,
+  .table-responsive > .table-bordered > tbody > tr > td:first-child,
+  .table-responsive > .table-bordered > tfoot > tr > td:first-child {
+    border-left: 0;
+  }
+  .table-responsive > .table-bordered > thead > tr > th:last-child,
+  .table-responsive > .table-bordered > tbody > tr > th:last-child,
+  .table-responsive > .table-bordered > tfoot > tr > th:last-child,
+  .table-responsive > .table-bordered > thead > tr > td:last-child,
+  .table-responsive > .table-bordered > tbody > tr > td:last-child,
+  .table-responsive > .table-bordered > tfoot > tr > td:last-child {
+    border-right: 0;
+  }
+  .table-responsive > .table-bordered > thead > tr:last-child > th,
+  .table-responsive > .table-bordered > tbody > tr:last-child > th,
+  .table-responsive > .table-bordered > tfoot > tr:last-child > th,
+  .table-responsive > .table-bordered > thead > tr:last-child > td,
+  .table-responsive > .table-bordered > tbody > tr:last-child > td,
+  .table-responsive > .table-bordered > tfoot > tr:last-child > td {
+    border-bottom: 0;
+  }
+}
+fieldset {
+  padding: 0;
+  margin: 0;
+  border: 0;
+}
+legend {
+  display: block;
+  width: 100%;
+  padding: 0;
+  margin-bottom: 20px;
+  font-size: 21px;
+  line-height: inherit;
+  color: #ebebeb;
+  border: 0;
+  border-bottom: 1px solid rgba(74, 104, 133, 0.81);
+}
+label {
+  display: inline-block;
+  margin-bottom: 5px;
+  font-weight: bold;
+}
+input[type="search"] {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+input[type="radio"],
+input[type="checkbox"] {
+  margin: 4px 0 0;
+  margin-top: 1px \9;
+  /* IE8-9 */
+
+  line-height: normal;
+}
+input[type="file"] {
+  display: block;
+}
+select[multiple],
+select[size] {
+  height: auto;
+}
+select optgroup {
+  font-size: inherit;
+  font-style: inherit;
+  font-family: inherit;
+}
+input[type="file"]:focus,
+input[type="radio"]:focus,
+input[type="checkbox"]:focus {
+  outline: thin dotted #333;
+  outline: 5px auto -webkit-focus-ring-color;
+  outline-offset: -2px;
+}
+input[type="number"]::-webkit-outer-spin-button,
+input[type="number"]::-webkit-inner-spin-button {
+  height: auto;
+}
+.form-control:-moz-placeholder {
+  color: #808080;
+}
+.form-control::-moz-placeholder {
+  color: #808080;
+}
+.form-control:-ms-input-placeholder {
+  color: #808080;
+}
+.form-control::-webkit-input-placeholder {
+  color: #808080;
+}
+.form-control {
+  display: block;
+  width: 100%;
+  height: 34px;
+  padding: 6px 12px;
+  font-size: 14px;
+  line-height: 1.428571429;
+  color: #f2f2f2;
+  vertical-align: middle;
+  background-color: #3f5872;
+  border: 1px solid #1abc9c;
+  border-radius: 0px;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+}
+.form-control:focus {
+  border-color: #28e1bd;
+  outline: 0;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(40, 225, 189, 0.6);
+  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(40, 225, 189, 0.6);
+}
+.form-control[disabled],
+.form-control[readonly],
+fieldset[disabled] .form-control {
+  cursor: default;
+  background-color: #3f5872;
+    border: 1px solid #808080;
+}
+textarea.form-control {
+  height: auto;
+}
+.form-group {
+  margin-bottom: 15px;
+}
+.radio,
+.checkbox {
+  display: block;
+  min-height: 20px;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  padding-left: 20px;
+  vertical-align: middle;
+}
+.radio label,
+.checkbox label {
+  display: inline;
+  margin-bottom: 0;
+  font-weight: normal;
+  cursor: pointer;
+}
+.radio input[type="radio"],
+.radio-inline input[type="radio"],
+.checkbox input[type="checkbox"],
+.checkbox-inline input[type="checkbox"] {
+  float: left;
+  margin-left: -20px;
+}
+.radio + .radio,
+.checkbox + .checkbox {
+  margin-top: -5px;
+}
+.radio-inline,
+.checkbox-inline {
+  display: inline-block;
+  padding-left: 20px;
+  margin-bottom: 0;
+  vertical-align: middle;
+  font-weight: normal;
+  cursor: pointer;
+}
+.radio-inline + .radio-inline,
+.checkbox-inline + .checkbox-inline {
+  margin-top: 0;
+  margin-left: 10px;
+}
+input[type="radio"][disabled],
+input[type="checkbox"][disabled],
+.radio[disabled],
+.radio-inline[disabled],
+.checkbox[disabled],
+.checkbox-inline[disabled],
+fieldset[disabled] input[type="radio"],
+fieldset[disabled] input[type="checkbox"],
+fieldset[disabled] .radio,
+fieldset[disabled] .radio-inline,
+fieldset[disabled] .checkbox,
+fieldset[disabled] .checkbox-inline {
+  cursor: not-allowed;
+}
+.input-sm {
+  height: 30px;
+  padding: 5px 10px;
+  font-size: 12px;
+  line-height: 1.5;
+  border-radius: 0px;
+}
+select.input-sm {
+  height: 30px;
+  line-height: 30px;
+}
+textarea.input-sm {
+  height: auto;
+}
+.input-lg {
+  height: 45px;
+  padding: 10px 16px;
+  font-size: 18px;
+  line-height: 1.33;
+  border-radius: 0px;
+}
+select.input-lg {
+  height: 45px;
+  line-height: 45px;
+}
+textarea.input-lg {
+  height: auto;
+}
+.has-warning .help-block,
+.has-warning .control-label {
+  color: #ffffff;
+}
+.has-warning .form-control {
+  border-color: #ffffff;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+.has-warning .form-control:focus {
+  border-color: #e6e6e6;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ffffff;
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ffffff;
+}
+.has-warning .input-group-addon {
+  color: #ffffff;
+  border-color: #ffffff;
+  background-color: #f39c12;
+}
+.has-error .help-block,
+.has-error .control-label {
+  color: #ffffff;
+}
+.has-error .form-control {
+  border-color: #ffffff;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+.has-error .form-control:focus {
+  border-color: #e6e6e6;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ffffff;
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ffffff;
+}
+.has-error .input-group-addon {
+  color: #ffffff;
+  border-color: #ffffff;
+  background-color: #e74c3c;
+}
+.has-success .help-block,
+.has-success .control-label {
+  color: #ffffff;
+}
+.has-success .form-control {
+  border-color: #ffffff;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+.has-success .form-control:focus {
+  border-color: #e6e6e6;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ffffff;
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ffffff;
+}
+.has-success .input-group-addon {
+  color: #ffffff;
+  border-color: #ffffff;
+  background-color: #2ecc71;
+}
+.form-control-static {
+  margin-bottom: 0;
+  padding-top: 7px;
+}
+.help-block {
+  display: block;
+  margin-top: 5px;
+  margin-bottom: 10px;
+  color: #ffffff;
+}
+@media (min-width: 768px) {
+  .form-inline .form-group {
+    display: inline-block;
+    margin-bottom: 0;
+    vertical-align: middle;
+  }
+  .form-inline .form-control {
+    display: inline-block;
+  }
+  .form-inline .radio,
+  .form-inline .checkbox {
+    display: inline-block;
+    margin-top: 0;
+    margin-bottom: 0;
+    padding-left: 0;
+  }
+  .form-inline .radio input[type="radio"],
+  .form-inline .checkbox input[type="checkbox"] {
+    float: none;
+    margin-left: 0;
+  }
+}
+.form-horizontal .control-label,
+.form-horizontal .radio,
+.form-horizontal .checkbox,
+.form-horizontal .radio-inline,
+.form-horizontal .checkbox-inline {
+  margin-top: 0;
+  margin-bottom: 0;
+  padding-top: 7px;
+}
+.form-horizontal .form-group {
+  margin-left: -15px;
+  margin-right: -15px;
+}
+.form-horizontal .form-group:before,
+.form-horizontal .form-group:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.form-horizontal .form-group:after {
+  clear: both;
+}
+.form-horizontal .form-group:before,
+.form-horizontal .form-group:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.form-horizontal .form-group:after {
+  clear: both;
+}
+@media (min-width: 768px) {
+  .form-horizontal .control-label {
+    text-align: right;
+  }
+}
+.btn {
+  display: inline-block;
+  padding: 6px 12px;
+  margin-bottom: 0;
+  font-size: 14px;
+  font-weight: 100;
+  line-height: 1.428571429;
+  text-align: center;
+  vertical-align: middle;
+  cursor: pointer;
+  border: 1px solid transparent;
+  border-radius: 0px;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  -o-user-select: none;
+  user-select: none;
+}
+.btn:focus {
+  outline: thin dotted #333;
+  outline: 5px auto -webkit-focus-ring-color;
+  outline-offset: -2px;
+}
+.btn:hover,
+.btn:focus {
+  color: #333333;
+  text-decoration: none;
+}
+.btn:active,
+.btn.active {
+  outline: 0;
+  background-image: none;
+  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+}
+.btn.disabled,
+.btn[disabled],
+fieldset[disabled] .btn {
+  cursor: not-allowed;
+  pointer-events: none;
+  opacity: 0.65;
+  filter: alpha(opacity=65);
+  -webkit-box-shadow: none;
+  box-shadow: none;
+}
+.btn-default {
+  color: #ffffff;
+  background-color: #888888;
+  border-color: #cccccc;
+}
+.btn-default:hover,
+.btn-default:focus,
+.btn-default:active,
+.btn-default.active,
+.open .dropdown-toggle.btn-default {
+  color: #333333;
+  background-color: #dedede;
+  border-color: #adadad;
+}
+.btn-default:active,
+.btn-default.active,
+.open .dropdown-toggle.btn-default {
+  background-image: none;
+}
+.btn-default.disabled,
+.btn-default[disabled],
+fieldset[disabled] .btn-default,
+.btn-default.disabled:hover,
+.btn-default[disabled]:hover,
+fieldset[disabled] .btn-default:hover,
+.btn-default.disabled:focus,
+.btn-default[disabled]:focus,
+fieldset[disabled] .btn-default:focus,
+.btn-default.disabled:active,
+.btn-default[disabled]:active,
+fieldset[disabled] .btn-default:active,
+.btn-default.disabled.active,
+.btn-default[disabled].active,
+fieldset[disabled] .btn-default.active {
+  background-color: #f2f2f2;
+  border-color: #cccccc;
+}
+.btn-primary {
+  color: #ffffff;
+  background-color: #003f72;
+  border-color: #17a689;
+}
+.btn-primary:hover,
+.btn-primary:focus,
+.btn-primary:active,
+.btn-primary.active,
+.open .dropdown-toggle.btn-primary {
+  color: #ffffff;
+  background-color: #6385b6;
+  border-color: #0f705d;
+}
+.btn-primary:active,
+.btn-primary.active,
+.open .dropdown-toggle.btn-primary {
+  background-image: none;
+}
+.btn-primary.disabled,
+.btn-primary[disabled],
+fieldset[disabled] .btn-primary,
+.btn-primary.disabled:hover,
+.btn-primary[disabled]:hover,
+fieldset[disabled] .btn-primary:hover,
+.btn-primary.disabled:focus,
+.btn-primary[disabled]:focus,
+fieldset[disabled] .btn-primary:focus,
+.btn-primary.disabled:active,
+.btn-primary[disabled]:active,
+fieldset[disabled] .btn-primary:active,
+.btn-primary.disabled.active,
+.btn-primary[disabled].active,
+fieldset[disabled] .btn-primary.active {
+  background-color: #1abc9c;
+  border-color: #17a689;
+}
+.btn-warning {
+  color: #ffffff;
+  background-color: #f39c12;
+  border-color: #e08e0b;
+}
+.btn-warning:hover,
+.btn-warning:focus,
+.btn-warning:active,
+.btn-warning.active,
+.open .dropdown-toggle.btn-warning {
+  color: #ffffff;
+  background-color: #d2850b;
+  border-color: #a66908;
+}
+.btn-warning:active,
+.btn-warning.active,
+.open .dropdown-toggle.btn-warning {
+  background-image: none;
+}
+.btn-warning.disabled,
+.btn-warning[disabled],
+fieldset[disabled] .btn-warning,
+.btn-warning.disabled:hover,
+.btn-warning[disabled]:hover,
+fieldset[disabled] .btn-warning:hover,
+.btn-warning.disabled:focus,
+.btn-warning[disabled]:focus,
+fieldset[disabled] .btn-warning:focus,
+.btn-warning.disabled:active,
+.btn-warning[disabled]:active,
+fieldset[disabled] .btn-warning:active,
+.btn-warning.disabled.active,
+.btn-warning[disabled].active,
+fieldset[disabled] .btn-warning.active {
+  background-color: #f39c12;
+  border-color: #e08e0b;
+}
+.btn-danger {
+  color: #ffffff;
+  background-color: #9a3b26;
+  border-color: #000000;
+}
+.btn-danger:hover,
+.btn-danger:focus,
+.btn-danger:active,
+.btn-danger.active,
+.open .dropdown-toggle.btn-danger {
+  color: #ffffff;
+  background-color: #df2e1b;
+  border-color: #000000;
+}
+.btn-danger:active,
+.btn-danger.active,
+.open .dropdown-toggle.btn-danger {
+  background-image: none;
+}
+.btn-danger.disabled,
+.btn-danger[disabled],
+fieldset[disabled] .btn-danger,
+.btn-danger.disabled:hover,
+.btn-danger[disabled]:hover,
+fieldset[disabled] .btn-danger:hover,
+.btn-danger.disabled:focus,
+.btn-danger[disabled]:focus,
+fieldset[disabled] .btn-danger:focus,
+.btn-danger.disabled:active,
+.btn-danger[disabled]:active,
+fieldset[disabled] .btn-danger:active,
+.btn-danger.disabled.active,
+.btn-danger[disabled].active,
+fieldset[disabled] .btn-danger.active {
+  background-color: #e74c3c;
+  border-color: #000000;
+}
+.btn-success {
+  color: #ffffff;
+  background-color: #2ecc71;
+  border-color: #29b765;
+}
+.btn-success:hover,
+.btn-success:focus,
+.btn-success:active,
+.btn-success.active,
+.open .dropdown-toggle.btn-success {
+  color: #ffffff;
+  background-color: #26ab5f;
+  border-color: #1e854a;
+}
+.btn-success:active,
+.btn-success.active,
+.open .dropdown-toggle.btn-success {
+  background-image: none;
+}
+.btn-success.disabled,
+.btn-success[disabled],
+fieldset[disabled] .btn-success,
+.btn-success.disabled:hover,
+.btn-success[disabled]:hover,
+fieldset[disabled] .btn-success:hover,
+.btn-success.disabled:focus,
+.btn-success[disabled]:focus,
+fieldset[disabled] .btn-success:focus,
+.btn-success.disabled:active,
+.btn-success[disabled]:active,
+fieldset[disabled] .btn-success:active,
+.btn-success.disabled.active,
+.btn-success[disabled].active,
+fieldset[disabled] .btn-success.active {
+  background-color: #2ecc71;
+  border-color: #29b765;
+}
+.btn-info {
+  color: #ffffff;
+  background-color: #3498db;
+  border-color: #258cd1;
+}
+.btn-info:hover,
+.btn-info:focus,
+.btn-info:active,
+.btn-info.active,
+.open .dropdown-toggle.btn-info {
+  color: #ffffff;
+  background-color: #2383c4;
+  border-color: #1c699d;
+}
+.btn-info:active,
+.btn-info.active,
+.open .dropdown-toggle.btn-info {
+  background-image: none;
+}
+.btn-info.disabled,
+.btn-info[disabled],
+fieldset[disabled] .btn-info,
+.btn-info.disabled:hover,
+.btn-info[disabled]:hover,
+fieldset[disabled] .btn-info:hover,
+.btn-info.disabled:focus,
+.btn-info[disabled]:focus,
+fieldset[disabled] .btn-info:focus,
+.btn-info.disabled:active,
+.btn-info[disabled]:active,
+fieldset[disabled] .btn-info:active,
+.btn-info.disabled.active,
+.btn-info[disabled].active,
+fieldset[disabled] .btn-info.active {
+  background-color: #3498db;
+  border-color: #258cd1;
+}
+.btn-link {
+  color: #1abc9c;
+  font-weight: normal;
+  cursor: pointer;
+  border-radius: 0;
+}
+.btn-link,
+.btn-link:active,
+.btn-link[disabled],
+fieldset[disabled] .btn-link {
+  background-color: transparent;
+  -webkit-box-shadow: none;
+  box-shadow: none;
+}
+.btn-link,
+.btn-link:hover,
+.btn-link:focus,
+.btn-link:active {
+  border-color: transparent;
+}
+.btn-link:hover,
+.btn-link:focus {
+  color: #28e1bd;
+  text-decoration: underline;
+  background-color: transparent;
+}
+.btn-link[disabled]:hover,
+fieldset[disabled] .btn-link:hover,
+.btn-link[disabled]:focus,
+fieldset[disabled] .btn-link:focus {
+  color: #808080;
+  text-decoration: none;
+}
+.btn-lg {
+  padding: 10px 16px;
+  font-size: 18px;
+  line-height: 1.33;
+  border-radius: 0px;
+}
+.btn-sm,
+.btn-xs {
+  padding: 5px 10px;
+  font-size: 12px;
+  line-height: 1.5;
+  border-radius: 0px;
+}
+.btn-xs {
+  padding: 1px 5px;
+}
+.btn-block {
+  display: block;
+  width: 100%;
+  padding-left: 0;
+  padding-right: 0;
+}
+.btn-block + .btn-block {
+  margin-top: 5px;
+}
+input[type="submit"].btn-block,
+input[type="reset"].btn-block,
+input[type="button"].btn-block {
+  width: 100%;
+}
+.fade {
+  opacity: 0;
+  -webkit-transition: opacity 0.15s linear;
+  transition: opacity 0.15s linear;
+}
+.fade.in {
+  opacity: 1;
+}
+.collapse {
+  display: none;
+}
+.collapse.in {
+  display: block;
+}
+.collapsing {
+  position: relative;
+  height: 0;
+  overflow: hidden;
+  -webkit-transition: height 0.35s ease;
+  transition: height 0.35s ease;
+}
+@font-face {
+  font-family: 'Glyphicons Halflings';
+  src: url('../fonts/glyphicons-halflings-regular.eot');
+  src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
+}
+.glyphicon {
+  position: relative;
+  top: 1px;
+  display: inline-block;
+  font-family: 'Glyphicons Halflings';
+  font-style: normal;
+  font-weight: normal;
+  line-height: 1;
+  -webkit-font-smoothing: antialiased;
+}
+.glyphicon-asterisk:before {
+  content: "\2a";
+}
+.glyphicon-plus:before {
+  content: "\2b";
+}
+.glyphicon-euro:before {
+  content: "\20ac";
+}
+.glyphicon-minus:before {
+  content: "\2212";
+}
+.glyphicon-cloud:before {
+  content: "\2601";
+}
+.glyphicon-envelope:before {
+  content: "\2709";
+}
+.glyphicon-pencil:before {
+  content: "\270f";
+}
+.glyphicon-glass:before {
+  content: "\e001";
+}
+.glyphicon-music:before {
+  content: "\e002";
+}
+.glyphicon-search:before {
+  content: "\e003";
+}
+.glyphicon-heart:before {
+  content: "\e005";
+}
+.glyphicon-star:before {
+  content: "\e006";
+}
+.glyphicon-star-empty:before {
+  content: "\e007";
+}
+.glyphicon-user:before {
+  content: "\e008";
+}
+.glyphicon-film:before {
+  content: "\e009";
+}
+.glyphicon-th-large:before {
+  content: "\e010";
+}
+.glyphicon-th:before {
+  content: "\e011";
+}
+.glyphicon-th-list:before {
+  content: "\e012";
+}
+.glyphicon-ok:before {
+  content: "\e013";
+}
+.glyphicon-remove:before {
+  content: "\e014";
+}
+.glyphicon-zoom-in:before {
+  content: "\e015";
+}
+.glyphicon-zoom-out:before {
+  content: "\e016";
+}
+.glyphicon-off:before {
+  content: "\e017";
+}
+.glyphicon-signal:before {
+  content: "\e018";
+}
+.glyphicon-cog:before {
+  content: "\e019";
+}
+.glyphicon-trash:before {
+  content: "\e020";
+}
+.glyphicon-home:before {
+  content: "\e021";
+}
+.glyphicon-file:before {
+  content: "\e022";
+}
+.glyphicon-time:before {
+  content: "\e023";
+}
+.glyphicon-road:before {
+  content: "\e024";
+}
+.glyphicon-download-alt:before {
+  content: "\e025";
+}
+.glyphicon-download:before {
+  content: "\e026";
+}
+.glyphicon-upload:before {
+  content: "\e027";
+}
+.glyphicon-inbox:before {
+  content: "\e028";
+}
+.glyphicon-play-circle:before {
+  content: "\e029";
+}
+.glyphicon-repeat:before {
+  content: "\e030";
+}
+.glyphicon-refresh:before {
+  content: "\e031";
+}
+.glyphicon-list-alt:before {
+  content: "\e032";
+}
+.glyphicon-flag:before {
+  content: "\e034";
+}
+.glyphicon-headphones:before {
+  content: "\e035";
+}
+.glyphicon-volume-off:before {
+  content: "\e036";
+}
+.glyphicon-volume-down:before {
+  content: "\e037";
+}
+.glyphicon-volume-up:before {
+  content: "\e038";
+}
+.glyphicon-qrcode:before {
+  content: "\e039";
+}
+.glyphicon-barcode:before {
+  content: "\e040";
+}
+.glyphicon-tag:before {
+  content: "\e041";
+}
+.glyphicon-tags:before {
+  content: "\e042";
+}
+.glyphicon-book:before {
+  content: "\e043";
+}
+.glyphicon-print:before {
+  content: "\e045";
+}
+.glyphicon-font:before {
+  content: "\e047";
+}
+.glyphicon-bold:before {
+  content: "\e048";
+}
+.glyphicon-italic:before {
+  content: "\e049";
+}
+.glyphicon-text-height:before {
+  content: "\e050";
+}
+.glyphicon-text-width:before {
+  content: "\e051";
+}
+.glyphicon-align-left:before {
+  content: "\e052";
+}
+.glyphicon-align-center:before {
+  content: "\e053";
+}
+.glyphicon-align-right:before {
+  content: "\e054";
+}
+.glyphicon-align-justify:before {
+  content: "\e055";
+}
+.glyphicon-list:before {
+  content: "\e056";
+}
+.glyphicon-indent-left:before {
+  content: "\e057";
+}
+.glyphicon-indent-right:before {
+  content: "\e058";
+}
+.glyphicon-facetime-video:before {
+  content: "\e059";
+}
+.glyphicon-picture:before {
+  content: "\e060";
+}
+.glyphicon-map-marker:before {
+  content: "\e062";
+}
+.glyphicon-adjust:before {
+  content: "\e063";
+}
+.glyphicon-tint:before {
+  content: "\e064";
+}
+.glyphicon-edit:before {
+  content: "\e065";
+}
+.glyphicon-share:before {
+  content: "\e066";
+}
+.glyphicon-check:before {
+  content: "\e067";
+}
+.glyphicon-move:before {
+  content: "\e068";
+}
+.glyphicon-step-backward:before {
+  content: "\e069";
+}
+.glyphicon-fast-backward:before {
+  content: "\e070";
+}
+.glyphicon-backward:before {
+  content: "\e071";
+}
+.glyphicon-play:before {
+  content: "\e072";
+}
+.glyphicon-pause:before {
+  content: "\e073";
+}
+.glyphicon-stop:before {
+  content: "\e074";
+}
+.glyphicon-forward:before {
+  content: "\e075";
+}
+.glyphicon-fast-forward:before {
+  content: "\e076";
+}
+.glyphicon-step-forward:before {
+  content: "\e077";
+}
+.glyphicon-eject:before {
+  content: "\e078";
+}
+.glyphicon-chevron-left:before {
+  content: "\e079";
+}
+.glyphicon-chevron-right:before {
+  content: "\e080";
+}
+.glyphicon-plus-sign:before {
+  content: "\e081";
+}
+.glyphicon-minus-sign:before {
+  content: "\e082";
+}
+.glyphicon-remove-sign:before {
+  content: "\e083";
+}
+.glyphicon-ok-sign:before {
+  content: "\e084";
+}
+.glyphicon-question-sign:before {
+  content: "\e085";
+}
+.glyphicon-info-sign:before {
+  content: "\e086";
+}
+.glyphicon-screenshot:before {
+  content: "\e087";
+}
+.glyphicon-remove-circle:before {
+  content: "\e088";
+}
+.glyphicon-ok-circle:before {
+  content: "\e089";
+}
+.glyphicon-ban-circle:before {
+  content: "\e090";
+}
+.glyphicon-arrow-left:before {
+  content: "\e091";
+}
+.glyphicon-arrow-right:before {
+  content: "\e092";
+}
+.glyphicon-arrow-up:before {
+  content: "\e093";
+}
+.glyphicon-arrow-down:before {
+  content: "\e094";
+}
+.glyphicon-share-alt:before {
+  content: "\e095";
+}
+.glyphicon-resize-full:before {
+  content: "\e096";
+}
+.glyphicon-resize-small:before {
+  content: "\e097";
+}
+.glyphicon-exclamation-sign:before {
+  content: "\e101";
+}
+.glyphicon-gift:before {
+  content: "\e102";
+}
+.glyphicon-leaf:before {
+  content: "\e103";
+}
+.glyphicon-eye-open:before {
+  content: "\e105";
+}
+.glyphicon-eye-close:before {
+  content: "\e106";
+}
+.glyphicon-warning-sign:before {
+  content: "\e107";
+}
+.glyphicon-plane:before {
+  content: "\e108";
+}
+.glyphicon-random:before {
+  content: "\e110";
+}
+.glyphicon-comment:before {
+  content: "\e111";
+}
+.glyphicon-magnet:before {
+  content: "\e112";
+}
+.glyphicon-chevron-up:before {
+  content: "\e113";
+}
+.glyphicon-chevron-down:before {
+  content: "\e114";
+}
+.glyphicon-retweet:before {
+  content: "\e115";
+}
+.glyphicon-shopping-cart:before {
+  content: "\e116";
+}
+.glyphicon-folder-close:before {
+  content: "\e117";
+}
+.glyphicon-folder-open:before {
+  content: "\e118";
+}
+.glyphicon-resize-vertical:before {
+  content: "\e119";
+}
+.glyphicon-resize-horizontal:before {
+  content: "\e120";
+}
+.glyphicon-hdd:before {
+  content: "\e121";
+}
+.glyphicon-bullhorn:before {
+  content: "\e122";
+}
+.glyphicon-certificate:before {
+  content: "\e124";
+}
+.glyphicon-thumbs-up:before {
+  content: "\e125";
+}
+.glyphicon-thumbs-down:before {
+  content: "\e126";
+}
+.glyphicon-hand-right:before {
+  content: "\e127";
+}
+.glyphicon-hand-left:before {
+  content: "\e128";
+}
+.glyphicon-hand-up:before {
+  content: "\e129";
+}
+.glyphicon-hand-down:before {
+  content: "\e130";
+}
+.glyphicon-circle-arrow-right:before {
+  content: "\e131";
+}
+.glyphicon-circle-arrow-left:before {
+  content: "\e132";
+}
+.glyphicon-circle-arrow-up:before {
+  content: "\e133";
+}
+.glyphicon-circle-arrow-down:before {
+  content: "\e134";
+}
+.glyphicon-globe:before {
+  content: "\e135";
+}
+.glyphicon-tasks:before {
+  content: "\e137";
+}
+.glyphicon-filter:before {
+  content: "\e138";
+}
+.glyphicon-fullscreen:before {
+  content: "\e140";
+}
+.glyphicon-dashboard:before {
+  content: "\e141";
+}
+.glyphicon-heart-empty:before {
+  content: "\e143";
+}
+.glyphicon-link:before {
+  content: "\e144";
+}
+.glyphicon-phone:before {
+  content: "\e145";
+}
+.glyphicon-usd:before {
+  content: "\e148";
+}
+.glyphicon-gbp:before {
+  content: "\e149";
+}
+.glyphicon-sort:before {
+  content: "\e150";
+}
+.glyphicon-sort-by-alphabet:before {
+  content: "\e151";
+}
+.glyphicon-sort-by-alphabet-alt:before {
+  content: "\e152";
+}
+.glyphicon-sort-by-order:before {
+  content: "\e153";
+}
+.glyphicon-sort-by-order-alt:before {
+  content: "\e154";
+}
+.glyphicon-sort-by-attributes:before {
+  content: "\e155";
+}
+.glyphicon-sort-by-attributes-alt:before {
+  content: "\e156";
+}
+.glyphicon-unchecked:before {
+  content: "\e157";
+}
+.glyphicon-expand:before {
+  content: "\e158";
+}
+.glyphicon-collapse-down:before {
+  content: "\e159";
+}
+.glyphicon-collapse-up:before {
+  content: "\e160";
+}
+.glyphicon-log-in:before {
+  content: "\e161";
+}
+.glyphicon-flash:before {
+  content: "\e162";
+}
+.glyphicon-log-out:before {
+  content: "\e163";
+}
+.glyphicon-new-window:before {
+  content: "\e164";
+}
+.glyphicon-record:before {
+  content: "\e165";
+}
+.glyphicon-save:before {
+  content: "\e166";
+}
+.glyphicon-open:before {
+  content: "\e167";
+}
+.glyphicon-saved:before {
+  content: "\e168";
+}
+.glyphicon-import:before {
+  content: "\e169";
+}
+.glyphicon-export:before {
+  content: "\e170";
+}
+.glyphicon-send:before {
+  content: "\e171";
+}
+.glyphicon-floppy-disk:before {
+  content: "\e172";
+}
+.glyphicon-floppy-saved:before {
+  content: "\e173";
+}
+.glyphicon-floppy-remove:before {
+  content: "\e174";
+}
+.glyphicon-floppy-save:before {
+  content: "\e175";
+}
+.glyphicon-floppy-open:before {
+  content: "\e176";
+}
+.glyphicon-credit-card:before {
+  content: "\e177";
+}
+.glyphicon-transfer:before {
+  content: "\e178";
+}
+.glyphicon-cutlery:before {
+  content: "\e179";
+}
+.glyphicon-header:before {
+  content: "\e180";
+}
+.glyphicon-compressed:before {
+  content: "\e181";
+}
+.glyphicon-earphone:before {
+  content: "\e182";
+}
+.glyphicon-phone-alt:before {
+  content: "\e183";
+}
+.glyphicon-tower:before {
+  content: "\e184";
+}
+.glyphicon-stats:before {
+  content: "\e185";
+}
+.glyphicon-sd-video:before {
+  content: "\e186";
+}
+.glyphicon-hd-video:before {
+  content: "\e187";
+}
+.glyphicon-subtitles:before {
+  content: "\e188";
+}
+.glyphicon-sound-stereo:before {
+  content: "\e189";
+}
+.glyphicon-sound-dolby:before {
+  content: "\e190";
+}
+.glyphicon-sound-5-1:before {
+  content: "\e191";
+}
+.glyphicon-sound-6-1:before {
+  content: "\e192";
+}
+.glyphicon-sound-7-1:before {
+  content: "\e193";
+}
+.glyphicon-copyright-mark:before {
+  content: "\e194";
+}
+.glyphicon-registration-mark:before {
+  content: "\e195";
+}
+.glyphicon-cloud-download:before {
+  content: "\e197";
+}
+.glyphicon-cloud-upload:before {
+  content: "\e198";
+}
+.glyphicon-tree-conifer:before {
+  content: "\e199";
+}
+.glyphicon-tree-deciduous:before {
+  content: "\e200";
+}
+.glyphicon-briefcase:before {
+  content: "\1f4bc";
+}
+.glyphicon-calendar:before {
+  content: "\1f4c5";
+}
+.glyphicon-pushpin:before {
+  content: "\1f4cc";
+}
+.glyphicon-paperclip:before {
+  content: "\1f4ce";
+}
+.glyphicon-camera:before {
+  content: "\1f4f7";
+}
+.glyphicon-lock:before {
+  content: "\1f512";
+}
+.glyphicon-bell:before {
+  content: "\1f514";
+}
+.glyphicon-bookmark:before {
+  content: "\1f516";
+}
+.glyphicon-fire:before {
+  content: "\1f525";
+}
+.glyphicon-wrench:before {
+  content: "\1f527";
+}
+.caret {
+  display: inline-block;
+  width: 0;
+  height: 0;
+  margin-left: 2px;
+  vertical-align: middle;
+  border-top: 4px solid #000000;
+  border-right: 4px solid transparent;
+  border-left: 4px solid transparent;
+  border-bottom: 0 dotted;
+  content: "";
+}
+.dropdown {
+  position: relative;
+}
+.dropdown-toggle:focus {
+  outline: 0;
+}
+.dropdown-menu {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  z-index: 1000;
+  display: none;
+  float: left;
+  min-width: 160px;
+  padding: 5px 0;
+  margin: 2px 0 0;
+  list-style: none;
+  font-size: 14px;
+  background-color: #1abc9c;
+  border: 1px solid #cccccc;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  border-radius: 0px;
+  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+  background-clip: padding-box;
+}
+.dropdown-menu.pull-right {
+  right: 0;
+  left: auto;
+}
+.dropdown-menu .divider {
+  height: 1px;
+  margin: 9px 0;
+  overflow: hidden;
+  background-color: rgba(20, 143, 119, 0.41);
+}
+.dropdown-menu > li > a {
+  display: block;
+  padding: 3px 20px;
+  clear: both;
+  font-weight: normal;
+  line-height: 1.428571429;
+  color: #f7f7f7;
+  white-space: nowrap;
+}
+.dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus {
+  text-decoration: none;
+  color: #ffffff;
+  background-color: rgba(22, 157, 130, 0.71);
+}
+.dropdown-menu > .active > a,
+.dropdown-menu > .active > a:hover,
+.dropdown-menu > .active > a:focus {
+  color: #ffffff;
+  text-decoration: none;
+  outline: 0;
+  background-color: rgba(26, 188, 156, 0.2);
+}
+.dropdown-menu > .disabled > a,
+.dropdown-menu > .disabled > a:hover,
+.dropdown-menu > .disabled > a:focus {
+  color: rgba(255, 255, 255, 0.2);
+}
+.dropdown-menu > .disabled > a:hover,
+.dropdown-menu > .disabled > a:focus {
+  text-decoration: none;
+  background-color: transparent;
+  background-image: none;
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  cursor: not-allowed;
+}
+.open > .dropdown-menu {
+  display: block;
+}
+.open > a {
+  outline: 0;
+}
+.dropdown-header {
+  display: block;
+  padding: 3px 20px;
+  font-size: 12px;
+  line-height: 1.428571429;
+  color: #e6e6e6;
+}
+.dropdown-backdrop {
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  z-index: 990;
+}
+.pull-right > .dropdown-menu {
+  right: 0;
+  left: auto;
+}
+.dropup .caret,
+.navbar-fixed-bottom .dropdown .caret {
+  border-top: 0 dotted;
+  border-bottom: 4px solid #000000;
+  content: "";
+}
+.dropup .dropdown-menu,
+.navbar-fixed-bottom .dropdown .dropdown-menu {
+  top: auto;
+  bottom: 100%;
+  margin-bottom: 1px;
+}
+@media (min-width: 768px) {
+  .navbar-right .dropdown-menu {
+    right: 0;
+    left: auto;
+  }
+}
+.btn-default .caret {
+  border-top-color: #333333;
+}
+.btn-primary .caret,
+.btn-success .caret,
+.btn-warning .caret,
+.btn-danger .caret,
+.btn-info .caret {
+  border-top-color: #fff;
+}
+.dropup .btn-default .caret {
+  border-bottom-color: #333333;
+}
+.dropup .btn-primary .caret,
+.dropup .btn-success .caret,
+.dropup .btn-warning .caret,
+.dropup .btn-danger .caret,
+.dropup .btn-info .caret {
+  border-bottom-color: #fff;
+}
+.btn-group,
+.btn-group-vertical {
+  position: relative;
+  display: inline-block;
+  vertical-align: middle;
+}
+.btn-group > .btn,
+.btn-group-vertical > .btn {
+  position: relative;
+  float: left;
+}
+.btn-group > .btn:hover,
+.btn-group-vertical > .btn:hover,
+.btn-group > .btn:focus,
+.btn-group-vertical > .btn:focus,
+.btn-group > .btn:active,
+.btn-group-vertical > .btn:active,
+.btn-group > .btn.active,
+.btn-group-vertical > .btn.active {
+  z-index: 2;
+}
+.btn-group > .btn:focus,
+.btn-group-vertical > .btn:focus {
+  outline: none;
+}
+.btn-group .btn + .btn,
+.btn-group .btn + .btn-group,
+.btn-group .btn-group + .btn,
+.btn-group .btn-group + .btn-group {
+  margin-left: -1px;
+}
+.btn-toolbar:before,
+.btn-toolbar:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.btn-toolbar:after {
+  clear: both;
+}
+.btn-toolbar:before,
+.btn-toolbar:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.btn-toolbar:after {
+  clear: both;
+}
+.btn-toolbar .btn-group {
+  float: left;
+}
+.btn-toolbar > .btn + .btn,
+.btn-toolbar > .btn-group + .btn,
+.btn-toolbar > .btn + .btn-group,
+.btn-toolbar > .btn-group + .btn-group {
+  margin-left: 5px;
+}
+.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
+  border-radius: 0;
+}
+.btn-group > .btn:first-child {
+  margin-left: 0;
+}
+.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
+  border-bottom-right-radius: 0;
+  border-top-right-radius: 0;
+}
+.btn-group > .btn:last-child:not(:first-child),
+.btn-group > .dropdown-toggle:not(:first-child) {
+  border-bottom-left-radius: 0;
+  border-top-left-radius: 0;
+}
+.btn-group > .btn-group {
+  float: left;
+}
+.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
+  border-radius: 0;
+}
+.btn-group > .btn-group:first-child > .btn:last-child,
+.btn-group > .btn-group:first-child > .dropdown-toggle {
+  border-bottom-right-radius: 0;
+  border-top-right-radius: 0;
+}
+.btn-group > .btn-group:last-child > .btn:first-child {
+  border-bottom-left-radius: 0;
+  border-top-left-radius: 0;
+}
+.btn-group .dropdown-toggle:active,
+.btn-group.open .dropdown-toggle {
+  outline: 0;
+}
+.btn-group-xs > .btn {
+  padding: 5px 10px;
+  font-size: 12px;
+  line-height: 1.5;
+  border-radius: 0px;
+  padding: 1px 5px;
+}
+.btn-group-sm > .btn {
+  padding: 5px 10px;
+  font-size: 12px;
+  line-height: 1.5;
+  border-radius: 0px;
+}
+.btn-group-lg > .btn {
+  padding: 10px 16px;
+  font-size: 18px;
+  line-height: 1.33;
+  border-radius: 0px;
+}
+.btn-group > .btn + .dropdown-toggle {
+  padding-left: 8px;
+  padding-right: 8px;
+}
+.btn-group > .btn-lg + .dropdown-toggle {
+  padding-left: 12px;
+  padding-right: 12px;
+}
+.btn-group.open .dropdown-toggle {
+  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+}
+.btn .caret {
+  margin-left: 0;
+}
+.btn-lg .caret {
+  border-width: 5px 5px 0;
+  border-bottom-width: 0;
+}
+.dropup .btn-lg .caret {
+  border-width: 0 5px 5px;
+}
+.btn-group-vertical > .btn,
+.btn-group-vertical > .btn-group {
+  display: block;
+  float: none;
+  width: 100%;
+  max-width: 100%;
+}
+.btn-group-vertical > .btn-group:before,
+.btn-group-vertical > .btn-group:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.btn-group-vertical > .btn-group:after {
+  clear: both;
+}
+.btn-group-vertical > .btn-group:before,
+.btn-group-vertical > .btn-group:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.btn-group-vertical > .btn-group:after {
+  clear: both;
+}
+.btn-group-vertical > .btn-group > .btn {
+  float: none;
+}
+.btn-group-vertical > .btn + .btn,
+.btn-group-vertical > .btn + .btn-group,
+.btn-group-vertical > .btn-group + .btn,
+.btn-group-vertical > .btn-group + .btn-group {
+  margin-top: -1px;
+  margin-left: 0;
+}
+.btn-group-vertical > .btn:not(:first-child):not(:last-child) {
+  border-radius: 0;
+}
+.btn-group-vertical > .btn:first-child:not(:last-child) {
+  border-top-right-radius: 0px;
+  border-bottom-right-radius: 0;
+  border-bottom-left-radius: 0;
+}
+.btn-group-vertical > .btn:last-child:not(:first-child) {
+  border-bottom-left-radius: 0px;
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+}
+.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
+  border-radius: 0;
+}
+.btn-group-vertical > .btn-group:first-child > .btn:last-child,
+.btn-group-vertical > .btn-group:first-child > .dropdown-toggle {
+  border-bottom-right-radius: 0;
+  border-bottom-left-radius: 0;
+}
+.btn-group-vertical > .btn-group:last-child > .btn:first-child {
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+}
+.btn-group-justified {
+  display: table;
+  width: 100%;
+  table-layout: fixed;
+  border-collapse: separate;
+}
+.btn-group-justified .btn {
+  float: none;
+  display: table-cell;
+  width: 1%;
+}
+[data-toggle="buttons"] > .btn > input[type="radio"],
+[data-toggle="buttons"] > .btn > input[type="checkbox"] {
+  display: none;
+}
+.input-group {
+  position: relative;
+  display: table;
+  border-collapse: separate;
+}
+.input-group.col {
+  float: none;
+  padding-left: 0;
+  padding-right: 0;
+}
+.input-group .form-control {
+  width: 100%;
+  margin-bottom: 0;
+}
+.input-group-lg > .form-control,
+.input-group-lg > .input-group-addon,
+.input-group-lg > .input-group-btn > .btn {
+  height: 45px;
+  padding: 10px 16px;
+  font-size: 18px;
+  line-height: 1.33;
+  border-radius: 0px;
+}
+select.input-group-lg > .form-control,
+select.input-group-lg > .input-group-addon,
+select.input-group-lg > .input-group-btn > .btn {
+  height: 45px;
+  line-height: 45px;
+}
+textarea.input-group-lg > .form-control,
+textarea.input-group-lg > .input-group-addon,
+textarea.input-group-lg > .input-group-btn > .btn {
+  height: auto;
+}
+.input-group-sm > .form-control,
+.input-group-sm > .input-group-addon,
+.input-group-sm > .input-group-btn > .btn {
+  height: 30px;
+  padding: 5px 10px;
+  font-size: 12px;
+  line-height: 1.5;
+  border-radius: 0px;
+}
+select.input-group-sm > .form-control,
+select.input-group-sm > .input-group-addon,
+select.input-group-sm > .input-group-btn > .btn {
+  height: 30px;
+  line-height: 30px;
+}
+textarea.input-group-sm > .form-control,
+textarea.input-group-sm > .input-group-addon,
+textarea.input-group-sm > .input-group-btn > .btn {
+  height: auto;
+}
+.input-group-addon,
+.input-group-btn,
+.input-group .form-control {
+  display: table-cell;
+}
+.input-group-addon:not(:first-child):not(:last-child),
+.input-group-btn:not(:first-child):not(:last-child),
+.input-group .form-control:not(:first-child):not(:last-child) {
+  border-radius: 0;
+}
+.input-group-addon,
+.input-group-btn {
+  width: 1%;
+  white-space: nowrap;
+  vertical-align: middle;
+}
+.input-group-addon {
+  padding: 6px 12px;
+  font-size: 14px;
+  font-weight: normal;
+  line-height: 1;
+  text-align: center;
+  background-color: #3f5872;
+  border: 1px solid #1abc9c;
+  border-radius: 0px;
+}
+.input-group-addon.input-sm {
+  padding: 5px 10px;
+  font-size: 12px;
+  border-radius: 0px;
+}
+.input-group-addon.input-lg {
+  padding: 10px 16px;
+  font-size: 18px;
+  border-radius: 0px;
+}
+.input-group-addon input[type="radio"],
+.input-group-addon input[type="checkbox"] {
+  margin-top: 0;
+}
+.input-group .form-control:first-child,
+.input-group-addon:first-child,
+.input-group-btn:first-child > .btn,
+.input-group-btn:first-child > .dropdown-toggle,
+.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
+  border-bottom-right-radius: 0;
+  border-top-right-radius: 0;
+}
+.input-group-addon:first-child {
+  border-right: 0;
+}
+.input-group .form-control:last-child,
+.input-group-addon:last-child,
+.input-group-btn:last-child > .btn,
+.input-group-btn:last-child > .dropdown-toggle,
+.input-group-btn:first-child > .btn:not(:first-child) {
+  border-bottom-left-radius: 0;
+  border-top-left-radius: 0;
+}
+.input-group-addon:last-child {
+  border-left: 0;
+}
+.input-group-btn {
+  position: relative;
+  white-space: nowrap;
+}
+.input-group-btn > .btn {
+  position: relative;
+}
+.input-group-btn > .btn + .btn {
+  margin-left: -4px;
+}
+.input-group-btn > .btn:hover,
+.input-group-btn > .btn:active {
+  z-index: 2;
+}
+.nav {
+  margin-bottom: 0;
+  padding-left: 0;
+  list-style: none;
+}
+.nav:before,
+.nav:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.nav:after {
+  clear: both;
+}
+.nav:before,
+.nav:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.nav:after {
+  clear: both;
+}
+.nav > li {
+  position: relative;
+  display: block;
+}
+.nav > li > a {
+  position: relative;
+  display: block;
+  padding: 10px 15px;
+}
+.nav > li > a:hover,
+.nav > li > a:focus {
+  text-decoration: none;
+  background-color: #1abc9c;
+}
+.nav > li.disabled > a {
+  color: #999999;
+}
+.nav > li.disabled > a:hover,
+.nav > li.disabled > a:focus {
+  color: #999999;
+  text-decoration: none;
+  background-color: transparent;
+  cursor: not-allowed;
+}
+.nav .open > a,
+.nav .open > a:hover,
+.nav .open > a:focus {
+  background-color: #1abc9c;
+  border-color: #1abc9c;
+}
+.nav .nav-divider {
+  height: 1px;
+  margin: 9px 0;
+  overflow: hidden;
+  background-color: #e5e5e5;
+}
+.nav > li > a > img {
+  max-width: none;
+}
+.nav-tabs {
+  border-bottom: 1px solid #13866f;
+}
+.nav-tabs > li {
+  float: left;
+  margin-bottom: -1px;
+}
+.nav-tabs > li > a {
+  margin-right: 2px;
+  line-height: 1.428571429;
+  border: 1px solid transparent;
+  border-radius: 0px 0px 0 0;
+}
+.nav-tabs > li > a:hover {
+  border-color: #1abc9c #1abc9c #13866f;
+}
+.nav-tabs > li.active > a,
+.nav-tabs > li.active > a:hover,
+.nav-tabs > li.active > a:focus {
+  color: #1abc9c;
+  background-color: #34495e;
+  border: 1px solid #13866f;
+  border-bottom-color: transparent;
+  cursor: default;
+}
+.nav-tabs.nav-justified {
+  width: 100%;
+  border-bottom: 0;
+}
+.nav-tabs.nav-justified > li {
+  float: none;
+}
+.nav-tabs.nav-justified > li > a {
+  text-align: center;
+}
+@media (min-width: 768px) {
+  .nav-tabs.nav-justified > li {
+    display: table-cell;
+    width: 1%;
+  }
+}
+.nav-tabs.nav-justified > li > a {
+  border-bottom: 1px solid #dddddd;
+  margin-right: 0;
+}
+.nav-tabs.nav-justified > .active > a {
+  border-bottom-color: #2c3e50;
+}
+.nav-pills > li {
+  float: left;
+}
+.nav-pills > li > a {
+  border-radius: 5px;
+}
+.nav-pills > li + li {
+  margin-left: 2px;
+}
+.nav-pills > li.active > a,
+.nav-pills > li.active > a:hover,
+.nav-pills > li.active > a:focus {
+  color: #ffffff;
+  background-color: #1abc9c;
+}
+.nav-stacked > li {
+  float: none;
+}
+.nav-stacked > li + li {
+  margin-top: 2px;
+  margin-left: 0;
+}
+.nav-justified {
+  width: 100%;
+}
+.nav-justified > li {
+  float: none;
+}
+.nav-justified > li > a {
+  text-align: center;
+}
+@media (min-width: 768px) {
+  .nav-justified > li {
+    display: table-cell;
+    width: 1%;
+  }
+}
+.nav-tabs-justified {
+  border-bottom: 0;
+}
+.nav-tabs-justified > li > a {
+  border-bottom: 1px solid #dddddd;
+  margin-right: 0;
+}
+.nav-tabs-justified > .active > a {
+  border-bottom-color: #2c3e50;
+}
+.tabbable:before,
+.tabbable:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.tabbable:after {
+  clear: both;
+}
+.tabbable:before,
+.tabbable:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.tabbable:after {
+  clear: both;
+}
+.tab-content > .tab-pane,
+.pill-content > .pill-pane {
+  display: none;
+}
+.tab-content > .active,
+.pill-content > .active {
+  display: block;
+}
+.nav .caret {
+  border-top-color: #1abc9c;
+  border-bottom-color: #1abc9c;
+}
+.nav a:hover .caret {
+  border-top-color: #28e1bd;
+  border-bottom-color: #28e1bd;
+}
+.nav-tabs .dropdown-menu {
+  margin-top: -1px;
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+}
+.navbar {
+  position: relative;
+  z-index: 1000;
+  min-height: 50px;
+  margin-bottom: 20px;
+  border: 1px solid transparent;
+}
+.navbar:before,
+.navbar:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.navbar:after {
+  clear: both;
+}
+.navbar:before,
+.navbar:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.navbar:after {
+  clear: both;
+}
+@media (min-width: 768px) {
+  .navbar {
+    border-radius: 0px;
+  }
+}
+.navbar-header:before,
+.navbar-header:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.navbar-header:after {
+  clear: both;
+}
+.navbar-header:before,
+.navbar-header:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.navbar-header:after {
+  clear: both;
+}
+@media (min-width: 768px) {
+  .navbar-header {
+    float: left;
+  }
+}
+.navbar-collapse {
+  max-height: 340px;
+  overflow-x: visible;
+  padding-right: 15px;
+  padding-left: 15px;
+  border-top: 1px solid transparent;
+  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
+  -webkit-overflow-scrolling: touch;
+}
+.navbar-collapse:before,
+.navbar-collapse:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.navbar-collapse:after {
+  clear: both;
+}
+.navbar-collapse:before,
+.navbar-collapse:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.navbar-collapse:after {
+  clear: both;
+}
+.navbar-collapse.in {
+  overflow-y: auto;
+}
+@media (min-width: 768px) {
+  .navbar-collapse {
+    width: auto;
+    border-top: 0;
+    box-shadow: none;
+  }
+  .navbar-collapse.collapse {
+    display: block !important;
+    height: auto !important;
+    padding-bottom: 0;
+    overflow: visible !important;
+  }
+  .navbar-collapse.in {
+    overflow-y: visible;
+  }
+  .navbar-collapse .navbar-nav.navbar-left:first-child {
+    margin-left: -15px;
+  }
+  .navbar-collapse .navbar-nav.navbar-right:last-child {
+    margin-right: -15px;
+  }
+  .navbar-collapse .navbar-text:last-child {
+    margin-right: 0;
+  }
+}
+.container > .navbar-header,
+.container > .navbar-collapse {
+  margin-right: -15px;
+  margin-left: -15px;
+}
+@media (min-width: 768px) {
+  .container > .navbar-header,
+  .container > .navbar-collapse {
+    margin-right: 0;
+    margin-left: 0;
+  }
+}
+.navbar-static-top {
+  border-width: 0 0 1px;
+}
+@media (min-width: 768px) {
+  .navbar-static-top {
+    border-radius: 0;
+  }
+}
+.navbar-fixed-top,
+.navbar-fixed-bottom {
+  position: fixed;
+  right: 0;
+  left: 0;
+  border-width: 0 0 1px;
+}
+@media (min-width: 768px) {
+  .navbar-fixed-top,
+  .navbar-fixed-bottom {
+    border-radius: 0;
+  }
+}
+.navbar-fixed-top {
+  z-index: 1030;
+  top: 0;
+}
+.navbar-fixed-bottom {
+  bottom: 0;
+  margin-bottom: 0;
+}
+.navbar-brand {
+  float: left;
+  padding: 15px 15px;
+  font-size: 18px;
+  line-height: 20px;
+}
+.navbar-brand:hover,
+.navbar-brand:focus {
+  text-decoration: none;
+}
+@media (min-width: 768px) {
+  .navbar > .container .navbar-brand {
+    margin-left: -15px;
+  }
+}
+.navbar-toggle {
+  position: relative;
+  float: right;
+  margin-right: 15px;
+  padding: 9px 10px;
+  margin-top: 8px;
+  margin-bottom: 8px;
+  background-color: transparent;
+  border: 1px solid transparent;
+  border-radius: 0px;
+}
+.navbar-toggle .icon-bar {
+  display: block;
+  width: 22px;
+  height: 2px;
+  border-radius: 1px;
+}
+.navbar-toggle .icon-bar + .icon-bar {
+  margin-top: 4px;
+}
+@media (min-width: 768px) {
+  .navbar-toggle {
+    display: none;
+  }
+}
+.navbar-nav {
+  margin: 7.5px -15px;
+}
+.navbar-nav > li > a {
+  padding-top: 10px;
+  padding-bottom: 10px;
+  line-height: 20px;
+}
+@media (max-width: 767px) {
+  .navbar-nav .open .dropdown-menu {
+    position: static;
+    float: none;
+    width: auto;
+    margin-top: 0;
+    background-color: transparent;
+    border: 0;
+    box-shadow: none;
+  }
+  .navbar-nav .open .dropdown-menu > li > a,
+  .navbar-nav .open .dropdown-menu .dropdown-header {
+    padding: 5px 15px 5px 25px;
+  }
+  .navbar-nav .open .dropdown-menu > li > a {
+    line-height: 20px;
+  }
+  .navbar-nav .open .dropdown-menu > li > a:hover,
+  .navbar-nav .open .dropdown-menu > li > a:focus {
+    background-image: none;
+  }
+}
+@media (min-width: 768px) {
+  .navbar-nav {
+    float: left;
+    margin: 0;
+  }
+  .navbar-nav > li {
+    float: left;
+  }
+  .navbar-nav > li > a {
+    padding-top: 15px;
+    padding-bottom: 15px;
+  }
+}
+@media (min-width: 768px) {
+  .navbar-left {
+    float: left !important;
+  }
+  .navbar-right {
+    float: right !important;
+  }
+}
+.navbar-form {
+  margin-left: -15px;
+  margin-right: -15px;
+  padding: 10px 15px;
+  border-top: 1px solid transparent;
+  border-bottom: 1px solid transparent;
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
+  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
+  margin-top: 8px;
+  margin-bottom: 8px;
+}
+@media (min-width: 768px) {
+  .navbar-form .form-group {
+    display: inline-block;
+    margin-bottom: 0;
+    vertical-align: middle;
+  }
+  .navbar-form .form-control {
+    display: inline-block;
+  }
+  .navbar-form .radio,
+  .navbar-form .checkbox {
+    display: inline-block;
+    margin-top: 0;
+    margin-bottom: 0;
+    padding-left: 0;
+  }
+  .navbar-form .radio input[type="radio"],
+  .navbar-form .checkbox input[type="checkbox"] {
+    float: none;
+    margin-left: 0;
+  }
+}
+@media (max-width: 767px) {
+  .navbar-form .form-group {
+    margin-bottom: 5px;
+  }
+}
+@media (min-width: 768px) {
+  .navbar-form {
+    width: auto;
+    border: 0;
+    margin-left: 0;
+    margin-right: 0;
+    padding-top: 0;
+    padding-bottom: 0;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+  }
+}
+.navbar-nav > li > .dropdown-menu {
+  margin-top: 0;
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+}
+.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
+  border-bottom-right-radius: 0;
+  border-bottom-left-radius: 0;
+}
+.navbar-nav.pull-right > li > .dropdown-menu,
+.navbar-nav > li > .dropdown-menu.pull-right {
+  left: auto;
+  right: 0;
+}
+.navbar-btn {
+  margin-top: 8px;
+  margin-bottom: 8px;
+}
+.navbar-text {
+  float: left;
+  margin-top: 15px;
+  margin-bottom: 15px;
+}
+@media (min-width: 768px) {
+  .navbar-text {
+    margin-left: 15px;
+    margin-right: 15px;
+  }
+}
+.navbar-default {
+  background-color: #34495e;
+  border-color: #283849;
+}
+.navbar-default .navbar-brand {
+  color: #ebebeb;
+}
+.navbar-default .navbar-brand:hover,
+.navbar-default .navbar-brand:focus {
+  color: #d1d1d1;
+  background-color: transparent;
+}
+.navbar-default .navbar-text {
+  color: #34495e;
+}
+.navbar-default .navbar-nav > li > a {
+  color: #ebebeb;
+}
+.navbar-default .navbar-nav > li > a:hover,
+.navbar-default .navbar-nav > li > a:focus {
+  color: #ebebeb;
+  background-color: #1abc9c;
+}
+.navbar-default .navbar-nav > .active > a,
+.navbar-default .navbar-nav > .active > a:hover,
+.navbar-default .navbar-nav > .active > a:focus {
+  color: #1abc9c;
+  background-color: rgba(26, 188, 156, 0.07);
+}
+.navbar-default .navbar-nav > .disabled > a,
+.navbar-default .navbar-nav > .disabled > a:hover,
+.navbar-default .navbar-nav > .disabled > a:focus {
+  color: #cccccc;
+  background-color: transparent;
+}
+.navbar-default .navbar-toggle {
+  border-color: #dddddd;
+}
+.navbar-default .navbar-toggle:hover,
+.navbar-default .navbar-toggle:focus {
+  background-color: #dddddd;
+}
+.navbar-default .navbar-toggle .icon-bar {
+  background-color: #cccccc;
+}
+.navbar-default .navbar-collapse,
+.navbar-default .navbar-form {
+  border-color: #273747;
+}
+.navbar-default .navbar-nav > .dropdown > a:hover .caret,
+.navbar-default .navbar-nav > .dropdown > a:focus .caret {
+  border-top-color: #ebebeb;
+  border-bottom-color: #ebebeb;
+}
+.navbar-default .navbar-nav > .open > a,
+.navbar-default .navbar-nav > .open > a:hover,
+.navbar-default .navbar-nav > .open > a:focus {
+  background-color: rgba(26, 188, 156, 0.07);
+  color: #1abc9c;
+}
+.navbar-default .navbar-nav > .open > a .caret,
+.navbar-default .navbar-nav > .open > a:hover .caret,
+.navbar-default .navbar-nav > .open > a:focus .caret {
+  border-top-color: #1abc9c;
+  border-bottom-color: #1abc9c;
+}
+.navbar-default .navbar-nav > .dropdown > a .caret {
+  border-top-color: #ebebeb;
+  border-bottom-color: #ebebeb;
+}
+@media (max-width: 767px) {
+  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
+    color: #ebebeb;
+  }
+  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
+  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
+    color: #ebebeb;
+    background-color: #1abc9c;
+  }
+  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
+  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
+  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
+    color: #1abc9c;
+    background-color: rgba(26, 188, 156, 0.07);
+  }
+  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a,
+  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
+  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
+    color: #cccccc;
+    background-color: transparent;
+  }
+}
+.navbar-default .navbar-link {
+  color: #ebebeb;
+}
+.navbar-default .navbar-link:hover {
+  color: #ebebeb;
+}
+.navbar-inverse {
+  background-color: #1abc9c;
+  border-color: #148f77;
+}
+.navbar-inverse .navbar-brand {
+  color: #ebebeb;
+}
+.navbar-inverse .navbar-brand:hover,
+.navbar-inverse .navbar-brand:focus {
+  color: #ffffff;
+  background-color: transparent;
+}
+.navbar-inverse .navbar-text {
+  color: #999999;
+}
+.navbar-inverse .navbar-nav > li > a {
+  color: #ebebeb;
+}
+.navbar-inverse .navbar-nav > li > a:hover,
+.navbar-inverse .navbar-nav > li > a:focus {
+  color: #ffffff;
+  background-color: #34495e;
+}
+.navbar-inverse .navbar-nav > .active > a,
+.navbar-inverse .navbar-nav > .active > a:hover,
+.navbar-inverse .navbar-nav > .active > a:focus {
+  color: #ffffff;
+  background-color: rgba(22, 157, 130, 0.71);
+}
+.navbar-inverse .navbar-nav > .disabled > a,
+.navbar-inverse .navbar-nav > .disabled > a:hover,
+.navbar-inverse .navbar-nav > .disabled > a:focus {
+  color: #d1d1d1;
+  background-color: transparent;
+}
+.navbar-inverse .navbar-toggle {
+  border-color: #333333;
+}
+.navbar-inverse .navbar-toggle:hover,
+.navbar-inverse .navbar-toggle:focus {
+  background-color: #333333;
+}
+.navbar-inverse .navbar-toggle .icon-bar {
+  background-color: #ffffff;
+}
+.navbar-inverse .navbar-collapse,
+.navbar-inverse .navbar-form {
+  border-color: #169d82;
+}
+.navbar-inverse .navbar-nav > .open > a,
+.navbar-inverse .navbar-nav > .open > a:hover,
+.navbar-inverse .navbar-nav > .open > a:focus {
+  background-color: rgba(22, 157, 130, 0.71);
+  color: #ffffff;
+}
+.navbar-inverse .navbar-nav > .dropdown > a:hover .caret {
+  border-top-color: #ffffff;
+  border-bottom-color: #ffffff;
+}
+.navbar-inverse .navbar-nav > .dropdown > a .caret {
+  border-top-color: #ebebeb;
+  border-bottom-color: #ebebeb;
+}
+.navbar-inverse .navbar-nav > .open > a .caret,
+.navbar-inverse .navbar-nav > .open > a:hover .caret,
+.navbar-inverse .navbar-nav > .open > a:focus .caret {
+  border-top-color: #ffffff;
+  border-bottom-color: #ffffff;
+}
+@media (max-width: 767px) {
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
+    border-color: #148f77;
+  }
+  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
+    color: #ebebeb;
+  }
+  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
+  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
+    color: #ffffff;
+    background-color: #34495e;
+  }
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a,
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover,
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
+    color: #ffffff;
+    background-color: rgba(22, 157, 130, 0.71);
+  }
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a,
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover,
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
+    color: #d1d1d1;
+    background-color: transparent;
+  }
+}
+.navbar-inverse .navbar-link {
+  color: #ebebeb;
+}
+.navbar-inverse .navbar-link:hover {
+  color: #ffffff;
+}
+.breadcrumb {
+  padding: 8px 15px;
+  margin-bottom: 20px;
+  list-style: none;
+  background-color: #34495e;
+  border-radius: 0px;
+}
+.breadcrumb > li {
+  display: inline-block;
+}
+.breadcrumb > li + li:before {
+  content: "/\00a0";
+  padding: 0 5px;
+  color: #cccccc;
+}
+.breadcrumb > .active {
+  color: #b3b3b3;
+}
+.pagination {
+  display: inline-block;
+  padding-left: 0;
+  margin: 20px 0;
+  border-radius: 0px;
+}
+.pagination > li {
+  display: inline;
+}
+.pagination > li > a,
+.pagination > li > span {
+  position: relative;
+  float: left;
+  padding: 6px 12px;
+  line-height: 1.428571429;
+  text-decoration: none;
+  background-color: #34495e;
+  border: 1px solid #dddddd;
+  margin-left: -1px;
+}
+.pagination > li:first-child > a,
+.pagination > li:first-child > span {
+  margin-left: 0;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+}
+.pagination > li:last-child > a,
+.pagination > li:last-child > span {
+  border-bottom-right-radius: 0px;
+  border-top-right-radius: 0px;
+}
+.pagination > li > a:hover,
+.pagination > li > span:hover,
+.pagination > li > a:focus,
+.pagination > li > span:focus {
+  background-color: #1abc9c;
+}
+.pagination > .active > a,
+.pagination > .active > span,
+.pagination > .active > a:hover,
+.pagination > .active > span:hover,
+.pagination > .active > a:focus,
+.pagination > .active > span:focus {
+  z-index: 2;
+  color: #ffffff;
+  background-color: #1abc9c;
+  border-color: #1abc9c;
+  cursor: default;
+}
+.pagination > .disabled > span,
+.pagination > .disabled > a,
+.pagination > .disabled > a:hover,
+.pagination > .disabled > a:focus {
+  color: #808080;
+  background-color: #34495e;
+  border-color: #dddddd;
+  cursor: not-allowed;
+}
+.pagination-lg > li > a,
+.pagination-lg > li > span {
+  padding: 10px 16px;
+  font-size: 18px;
+}
+.pagination-lg > li:first-child > a,
+.pagination-lg > li:first-child > span {
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+}
+.pagination-lg > li:last-child > a,
+.pagination-lg > li:last-child > span {
+  border-bottom-right-radius: 0px;
+  border-top-right-radius: 0px;
+}
+.pagination-sm > li > a,
+.pagination-sm > li > span {
+  padding: 5px 10px;
+  font-size: 12px;
+}
+.pagination-sm > li:first-child > a,
+.pagination-sm > li:first-child > span {
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+}
+.pagination-sm > li:last-child > a,
+.pagination-sm > li:last-child > span {
+  border-bottom-right-radius: 0px;
+  border-top-right-radius: 0px;
+}
+.pager {
+  padding-left: 0;
+  margin: 20px 0;
+  list-style: none;
+  text-align: center;
+}
+.pager:before,
+.pager:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.pager:after {
+  clear: both;
+}
+.pager:before,
+.pager:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.pager:after {
+  clear: both;
+}
+.pager li {
+  display: inline;
+}
+.pager li > a,
+.pager li > span {
+  display: inline-block;
+  padding: 5px 14px;
+  background-color: #34495e;
+  border: 1px solid #dddddd;
+  border-radius: 15px;
+}
+.pager li > a:hover,
+.pager li > a:focus {
+  text-decoration: none;
+  background-color: #1abc9c;
+}
+.pager .next > a,
+.pager .next > span {
+  float: right;
+}
+.pager .previous > a,
+.pager .previous > span {
+  float: left;
+}
+.pager .disabled > a,
+.pager .disabled > a:hover,
+.pager .disabled > a:focus,
+.pager .disabled > span {
+  color: #808080;
+  background-color: #34495e;
+  cursor: not-allowed;
+}
+.label {
+  display: inline;
+  padding: .2em .6em .3em;
+  font-size: 75%;
+  font-weight: bold;
+  line-height: 1;
+  color: #ffffff;
+  text-align: center;
+  white-space: nowrap;
+  vertical-align: baseline;
+  border-radius: .25em;
+}
+.label[href]:hover,
+.label[href]:focus {
+  color: #ffffff;
+  text-decoration: none;
+  cursor: pointer;
+}
+.label:empty {
+  display: none;
+}
+.label-default {
+  background-color: #1abc9c;
+}
+.label-default[href]:hover,
+.label-default[href]:focus {
+  background-color: #148f77;
+}
+.label-primary {
+  background-color: #1abc9c;
+}
+.label-primary[href]:hover,
+.label-primary[href]:focus {
+  background-color: #148f77;
+}
+.label-success {
+  background-color: #2ecc71;
+}
+.label-success[href]:hover,
+.label-success[href]:focus {
+  background-color: #25a25a;
+}
+.label-info {
+  background-color: #3498db;
+}
+.label-info[href]:hover,
+.label-info[href]:focus {
+  background-color: #217dbb;
+}
+.label-warning {
+  background-color: #f39c12;
+}
+.label-warning[href]:hover,
+.label-warning[href]:focus {
+  background-color: #c87f0a;
+}
+.label-danger {
+  background-color: #e74c3c;
+}
+.label-danger[href]:hover,
+.label-danger[href]:focus {
+  background-color: #d62c1a;
+}
+.badge {
+  display: inline-block;
+  min-width: 10px;
+  padding: 3px 7px;
+  font-size: 12px;
+  font-weight: 400;
+  color: #ffffff;
+  line-height: 1;
+  vertical-align: baseline;
+  white-space: nowrap;
+  text-align: center;
+  background-color: #34495e;
+  border-radius: 10px;
+}
+.badge:empty {
+  display: none;
+}
+a.badge:hover,
+a.badge:focus {
+  color: #ffffff;
+  text-decoration: none;
+  cursor: pointer;
+}
+.btn .badge {
+  position: relative;
+  top: -1px;
+}
+a.list-group-item.active > .badge,
+.nav-pills > .active > a > .badge {
+  color: #1abc9c;
+  background-color: #ffffff;
+}
+.nav-pills > li > a > .badge {
+  margin-left: 3px;
+}
+.jumbotron {
+  padding: 30px;
+  margin-bottom: 30px;
+  font-size: 21px;
+  font-weight: 200;
+  line-height: 2.1428571435;
+  color: inherit;
+  background-color: #34495e;
+}
+.jumbotron h1 {
+  line-height: 1;
+  color: inherit;
+}
+.jumbotron p {
+  line-height: 1.4;
+}
+.container .jumbotron {
+  border-radius: 0px;
+}
+@media screen and (min-width: 768px) {
+  .jumbotron {
+    padding-top: 48px;
+    padding-bottom: 48px;
+  }
+  .container .jumbotron {
+    padding-left: 60px;
+    padding-right: 60px;
+  }
+  .jumbotron h1 {
+    font-size: 63px;
+  }
+}
+.thumbnail {
+  padding: 4px;
+  line-height: 1.428571429;
+  background-color: #34495e;
+  border: 1px solid rgba(74, 104, 133, 0.81);
+  border-radius: 0px;
+  -webkit-transition: all 0.2s ease-in-out;
+  transition: all 0.2s ease-in-out;
+  display: inline-block;
+  max-width: 100%;
+  height: auto;
+  display: block;
+}
+.thumbnail > img {
+  display: block;
+  max-width: 100%;
+  height: auto;
+}
+a.thumbnail:hover,
+a.thumbnail:focus {
+  border-color: #1abc9c;
+}
+.thumbnail > img {
+  margin-left: auto;
+  margin-right: auto;
+}
+.thumbnail .caption {
+  padding: 9px;
+  color: #e6e6e6;
+}
+.alert {
+  padding: 15px;
+  margin-bottom: 20px;
+  border: 1px solid transparent;
+  border-radius: 0px;
+}
+.alert h4 {
+  margin-top: 0;
+  color: inherit;
+}
+.alert .alert-link {
+  font-weight: bold;
+}
+.alert > p,
+.alert > ul {
+  margin-bottom: 0;
+}
+.alert > p + p {
+  margin-top: 5px;
+}
+.alert-dismissable {
+  padding-right: 35px;
+}
+.alert-dismissable .close {
+  position: relative;
+  top: -2px;
+  right: -21px;
+  color: inherit;
+}
+.alert-success {
+  background-color: #2ecc71;
+  border-color: #29b74e;
+  color: #a8ebc4;
+}
+.alert-success hr {
+  border-top-color: #25a245;
+}
+.alert-success .alert-link {
+  color: #7ee2a8;
+}
+.alert-info {
+  background-color: #3498db;
+  border-color: #23a1c8;
+  color: #b6daf2;
+}
+.alert-info hr {
+  border-top-color: #2090b2;
+}
+.alert-info .alert-link {
+  color: #8bc4ea;
+}
+.alert-warning {
+  background-color: #f39c12;
+  border-color: #ea6f0c;
+  color: #ffffff;
+}
+.alert-warning hr {
+  border-top-color: #d2630b;
+}
+.alert-warning .alert-link {
+  color: #e6e6e6;
+}
+.alert-danger {
+  background-color: #e74c3c;
+  border-color: #e52e3c;
+  color: #f8c9c4;
+}
+.alert-danger hr {
+  border-top-color: #df1b2a;
+}
+.alert-danger .alert-link {
+  color: #f29f97;
+}
+@-webkit-keyframes progress-bar-stripes {
+  from {
+    background-position: 40px 0;
+  }
+  to {
+    background-position: 0 0;
+  }
+}
+@-moz-keyframes progress-bar-stripes {
+  from {
+    background-position: 40px 0;
+  }
+  to {
+    background-position: 0 0;
+  }
+}
+@-o-keyframes progress-bar-stripes {
+  from {
+    background-position: 0 0;
+  }
+  to {
+    background-position: 40px 0;
+  }
+}
+@keyframes progress-bar-stripes {
+  from {
+    background-position: 40px 0;
+  }
+  to {
+    background-position: 0 0;
+  }
+}
+.progress {
+  overflow: hidden;
+  height: 20px;
+  margin-bottom: 20px;
+  background-color: #34495e;
+  border-radius: 0px;
+  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
+  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
+}
+.progress-bar {
+  float: left;
+  width: 0%;
+  height: 100%;
+  font-size: 12px;
+  color: #ffffff;
+  text-align: center;
+  background-color: #1abc9c;
+  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
+  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
+  -webkit-transition: width 0.6s ease;
+  transition: width 0.6s ease;
+}
+.progress-striped .progress-bar {
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-size: 40px 40px;
+}
+.progress.active .progress-bar {
+  -webkit-animation: progress-bar-stripes 2s linear infinite;
+  -moz-animation: progress-bar-stripes 2s linear infinite;
+  -ms-animation: progress-bar-stripes 2s linear infinite;
+  -o-animation: progress-bar-stripes 2s linear infinite;
+  animation: progress-bar-stripes 2s linear infinite;
+}
+.progress-bar-success {
+  background-color: #2ecc71;
+}
+.progress-striped .progress-bar-success {
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+}
+.progress-bar-info {
+  background-color: #3498db;
+}
+.progress-striped .progress-bar-info {
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+}
+.progress-bar-warning {
+  background-color: #f39c12;
+}
+.progress-striped .progress-bar-warning {
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+}
+.progress-bar-danger {
+  background-color: #e74c3c;
+}
+.progress-striped .progress-bar-danger {
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+}
+.media,
+.media-body {
+  overflow: hidden;
+  zoom: 1;
+}
+.media,
+.media .media {
+  margin-top: 15px;
+}
+.media:first-child {
+  margin-top: 0;
+}
+.media-object {
+  display: block;
+}
+.media-heading {
+  margin: 0 0 5px;
+}
+.media > .pull-left {
+  margin-right: 10px;
+}
+.media > .pull-right {
+  margin-left: 10px;
+}
+.media-list {
+  padding-left: 0;
+  list-style: none;
+}
+.list-group {
+  margin-bottom: 20px;
+  padding-left: 0;
+}
+.list-group-item {
+  position: relative;
+  display: block;
+  padding: 10px 15px;
+  margin-bottom: -1px;
+  background-color: #395168;
+  border: 1px solid rgba(74, 104, 133, 0.81);
+}
+.list-group-item:first-child {
+  border-top-right-radius: 0px;
+  border-top-left-radius: 0px;
+}
+.list-group-item:last-child {
+  margin-bottom: 0;
+  border-bottom-right-radius: 0px;
+  border-bottom-left-radius: 0px;
+}
+.list-group-item > .badge {
+  float: right;
+}
+.list-group-item > .badge + .badge {
+  margin-right: 5px;
+}
+a.list-group-item {
+  color: #ffffff;
+}
+a.list-group-item .list-group-item-heading {
+  color: #ffffff;
+}
+a.list-group-item:hover,
+a.list-group-item:focus {
+  text-decoration: none;
+  background-color: #1abc9c;
+}
+.list-group-item.active,
+.list-group-item.active:hover,
+.list-group-item.active:focus {
+  z-index: 2;
+  color: #ffffff;
+  background-color: #1abc9c;
+  border-color: #1abc9c;
+}
+.list-group-item.active .list-group-item-heading,
+.list-group-item.active:hover .list-group-item-heading,
+.list-group-item.active:focus .list-group-item-heading {
+  color: inherit;
+}
+.list-group-item.active .list-group-item-text,
+.list-group-item.active:hover .list-group-item-text,
+.list-group-item.active:focus .list-group-item-text {
+  color: #aef4e6;
+}
+.list-group-item-heading {
+  margin-top: 0;
+  margin-bottom: 5px;
+}
+.list-group-item-text {
+  margin-bottom: 0;
+  line-height: 1.3;
+}
+.panel {
+  margin-bottom: 20px;
+  color: #ffffff;
+  background-color: #666666;
+  border: 1px solid transparent;
+  border-radius: 0px;
+  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
+  overflow-y: auto;
+  overflow-x: auto;
+  
+}
+    
+}
+.panel-body {
+  padding: 15px;
+  
+}
+.panel-body:before,
+.panel-body:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.panel-body:after {
+  clear: both;
+}
+.panel-body:before,
+.panel-body:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.panel-body:after {
+  clear: both;
+}
+.panel > .list-group {
+  margin-bottom: 0;
+}
+.panel > .list-group .list-group-item {
+  border-width: 1px 0;
+}
+.panel > .list-group .list-group-item:first-child {
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+}
+.panel > .list-group .list-group-item:last-child {
+  border-bottom: 0;
+}
+.panel-heading + .list-group .list-group-item:first-child {
+  border-top-width: 0;
+}
+.panel > .table {
+  margin-bottom: 0;
+}
+.panel > .panel-body + .table {
+  border-top: 1px solid white; /* rgba(74, 104, 133, 0.81);*/
+}
+.panel-heading {
+  padding: 10px 15px;
+  border-bottom: 1px solid transparent;
+  border-top-right-radius: -1px;
+  border-top-left-radius: -1px;
+}
+.panel-title {
+  margin-top: 0;
+  margin-bottom: 0;
+  font-size: 16px;
+}
+.panel-title > a {
+  color: inherit;
+}
+.panel-footer {
+  padding: 10px 15px;
+  background-color: #34495e;
+  border-top: 1px solid #dddddd;
+  border-bottom-right-radius: -1px;
+  border-bottom-left-radius: -1px;
+}
+.panel-group .panel {
+  margin-bottom: 0;
+  border-radius: 0px;
+  overflow: hidden;
+}
+.panel-group .panel + .panel {
+  margin-top: 5px;
+}
+.panel-group .panel-heading {
+  border-bottom: 0;
+}
+.panel-group .panel-heading + .panel-collapse .panel-body {
+  border-top: 1px solid #dddddd;
+}
+.panel-group .panel-footer {
+  border-top: 0;
+}
+.panel-group .panel-footer + .panel-collapse .panel-body {
+  border-bottom: 1px solid #dddddd;
+}
+.panel-default {
+  border-color: #dddddd;
+}
+.panel-default > .panel-heading {
+  color: #333333;
+  background-color: #f5f5f5;
+  border-color: #dddddd;
+}
+.panel-default > .panel-heading + .panel-collapse .panel-body {
+  border-top-color: #dddddd;
+}
+.panel-default > .panel-footer + .panel-collapse .panel-body {
+  border-bottom-color: #dddddd;
+}
+.panel-primary {
+  border-color: #1abc9c;
+}
+.panel-primary > .panel-heading {
+  color: #ffffff;
+  background-color: #003f72;
+  border-color: #ffffff;
+}
+.panel-primary > .panel-heading + .panel-collapse .panel-body {
+  border-top-color: #1abc9c;
+}
+.panel-primary > .panel-footer + .panel-collapse .panel-body {
+  border-bottom-color: #1abc9c;
+}
+.panel-success {
+  border-color: #2ecc71;
+}
+.panel-success > .panel-heading {
+  color: #a8ebc4;
+  background-color: #2ecc71;
+  border-color: #2ecc71;
+}
+.panel-success > .panel-heading + .panel-collapse .panel-body {
+  border-top-color: #2ecc71;
+}
+.panel-success > .panel-footer + .panel-collapse .panel-body {
+  border-bottom-color: #2ecc71;
+}
+.panel-warning {
+  border-color: #f39c12;
+}
+.panel-warning > .panel-heading {
+  color: #fad9a4;
+  background-color: #f39c12;
+  border-color: #f39c12;
+}
+.panel-warning > .panel-heading + .panel-collapse .panel-body {
+  border-top-color: #f39c12;
+}
+.panel-warning > .panel-footer + .panel-collapse .panel-body {
+  border-bottom-color: #f39c12;
+}
+.panel-danger {
+  border-color: #e74c3c;
+}
+.panel-danger > .panel-heading {
+  color: #f8c9c4;
+  background-color: #e74c3c;
+  border-color: #e74c3c;
+}
+.panel-danger > .panel-heading + .panel-collapse .panel-body {
+  border-top-color: #e74c3c;
+}
+.panel-danger > .panel-footer + .panel-collapse .panel-body {
+  border-bottom-color: #e74c3c;
+}
+.panel-info {
+  border-color: #3498db;
+}
+.panel-info > .panel-heading {
+  color: #b6daf2;
+  background-color: #3498db;
+  border-color: #3498db;
+}
+.panel-info > .panel-heading + .panel-collapse .panel-body {
+  border-top-color: #3498db;
+}
+.panel-info > .panel-footer + .panel-collapse .panel-body {
+  border-bottom-color: #3498db;
+}
+.well {
+  min-height: 20px;
+  padding: 19px;
+  margin-bottom: 20px;
+  background-color: #ffffff;
+  border: 4px solid #273747;
+  border-radius: 2px;
+  -webkit-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);
+}
+.well-lg {
+  padding: 24px;
+  border-radius: 0px;
+}
+.well-sm {
+  padding: 9px;
+  border-radius: 0px;
+}
+.close {
+  float: right;
+  font-size: 21px;
+  font-weight: bold;
+  line-height: 1;
+  color: #ffffff;
+  text-shadow: none;
+  opacity: 0.2;
+  filter: alpha(opacity=20);
+}
+.close:hover,
+.close:focus {
+  color: #ffffff;
+  text-decoration: none;
+  cursor: pointer;
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+button.close {
+  padding: 0;
+  cursor: pointer;
+  background: transparent;
+  border: 0;
+  -webkit-appearance: none;
+}
+.modal-open {
+  overflow: hidden;
+}
+body.modal-open,
+.modal-open .navbar-fixed-top,
+.modal-open .navbar-fixed-bottom {
+  margin-right: 15px;
+}
+.modal {
+  display: none;
+  overflow: auto;
+  overflow-y: scroll;
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1040;
+}
+.modal.fade .modal-dialog {
+  -webkit-transform: translate(0, -25%);
+  -ms-transform: translate(0, -25%);
+  transform: translate(0, -25%);
+  -webkit-transition: -webkit-transform 0.3s ease-out;
+  -moz-transition: -moz-transform 0.3s ease-out;
+  -o-transition: -o-transform 0.3s ease-out;
+  transition: transform 0.3s ease-out;
+}
+.modal.in .modal-dialog {
+  -webkit-transform: translate(0, 0);
+  -ms-transform: translate(0, 0);
+  transform: translate(0, 0);
+}
+.modal-dialog {
+  margin-left: auto;
+  margin-right: auto;
+  width: auto;
+  padding: 10px;
+  z-index: 1050;
+}
+.modal-content {
+  position: relative;
+  background-color: #34495e;
+  border: 1px solid #999999;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  border-radius: 0px;
+  -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
+  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
+  background-clip: padding-box;
+  outline: none;
+}
+.modal-backdrop {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1030;
+  background-color: #000000;
+}
+.modal-backdrop.fade {
+  opacity: 0;
+  filter: alpha(opacity=0);
+}
+.modal-backdrop.in {
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+.modal-header {
+  padding: 15px;
+  border-bottom: 1px solid rgba(74, 104, 133, 0.81);
+  min-height: 16.428571429px;
+}
+.modal-header .close {
+  margin-top: -2px;
+}
+.modal-title {
+  margin: 0;
+  line-height: 1.428571429;
+}
+.modal-body {
+  position: relative;
+  padding: 20px;
+}
+.modal-footer {
+  margin-top: 15px;
+  padding: 19px 20px 20px;
+  text-align: right;
+  border-top: 1px solid rgba(74, 104, 133, 0.81);
+}
+.modal-footer:before,
+.modal-footer:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.modal-footer:after {
+  clear: both;
+}
+.modal-footer:before,
+.modal-footer:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.modal-footer:after {
+  clear: both;
+}
+.modal-footer .btn + .btn {
+  margin-left: 5px;
+  margin-bottom: 0;
+}
+.modal-footer .btn-group .btn + .btn {
+  margin-left: -1px;
+}
+.modal-footer .btn-block + .btn-block {
+  margin-left: 0;
+}
+@media screen and (min-width: 768px) {
+  .modal-dialog {
+    left: 50%;
+    right: auto;
+    width: 600px;
+    padding-top: 30px;
+    padding-bottom: 30px;
+  }
+  .modal-content {
+    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
+  }
+}
+.tooltip {
+  position: absolute;
+  z-index: 1030;
+  display: block;
+  visibility: visible;
+  font-size: 12px;
+  line-height: 1.4;
+  opacity: 0;
+  filter: alpha(opacity=0);
+}
+.tooltip.in {
+  opacity: 0.9;
+  filter: alpha(opacity=90);
+}
+.tooltip.top {
+  margin-top: -3px;
+  padding: 5px 0;
+}
+.tooltip.right {
+  margin-left: 3px;
+  padding: 0 5px;
+}
+.tooltip.bottom {
+  margin-top: 3px;
+  padding: 5px 0;
+}
+.tooltip.left {
+  margin-left: -3px;
+  padding: 0 5px;
+}
+.tooltip-inner {
+  max-width: 200px;
+  padding: 3px 8px;
+  color: #ffffff;
+  text-align: center;
+  text-decoration: none;
+  background-color: rgba(26, 188, 156, 0.8);
+  border-radius: 0px;
+}
+.tooltip-arrow {
+  position: absolute;
+  width: 0;
+  height: 0;
+  border-color: transparent;
+  border-style: solid;
+}
+.tooltip.top .tooltip-arrow {
+  bottom: 0;
+  left: 50%;
+  margin-left: -5px;
+  border-width: 5px 5px 0;
+  border-top-color: rgba(26, 188, 156, 0.8);
+}
+.tooltip.top-left .tooltip-arrow {
+  bottom: 0;
+  left: 5px;
+  border-width: 5px 5px 0;
+  border-top-color: rgba(26, 188, 156, 0.8);
+}
+.tooltip.top-right .tooltip-arrow {
+  bottom: 0;
+  right: 5px;
+  border-width: 5px 5px 0;
+  border-top-color: rgba(26, 188, 156, 0.8);
+}
+.tooltip.right .tooltip-arrow {
+  top: 50%;
+  left: 0;
+  margin-top: -5px;
+  border-width: 5px 5px 5px 0;
+  border-right-color: rgba(26, 188, 156, 0.8);
+}
+.tooltip.left .tooltip-arrow {
+  top: 50%;
+  right: 0;
+  margin-top: -5px;
+  border-width: 5px 0 5px 5px;
+  border-left-color: rgba(26, 188, 156, 0.8);
+}
+.tooltip.bottom .tooltip-arrow {
+  top: 0;
+  left: 50%;
+  margin-left: -5px;
+  border-width: 0 5px 5px;
+  border-bottom-color: rgba(26, 188, 156, 0.8);
+}
+.tooltip.bottom-left .tooltip-arrow {
+  top: 0;
+  left: 5px;
+  border-width: 0 5px 5px;
+  border-bottom-color: rgba(26, 188, 156, 0.8);
+}
+.tooltip.bottom-right .tooltip-arrow {
+  top: 0;
+  right: 5px;
+  border-width: 0 5px 5px;
+  border-bottom-color: rgba(26, 188, 156, 0.8);
+}
+.popover {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 1010;
+  display: none;
+  max-width: 276px;
+  padding: 1px;
+  text-align: left;
+  background-color: #1abc9c;
+  background-clip: padding-box;
+  border: 1px solid #cccccc;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  border-radius: 0px;
+  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+  white-space: normal;
+}
+.popover.top {
+  margin-top: -10px;
+}
+.popover.right {
+  margin-left: 10px;
+}
+.popover.bottom {
+  margin-top: 10px;
+}
+.popover.left {
+  margin-left: -10px;
+}
+.popover-title {
+  margin: 0;
+  padding: 8px 14px;
+  font-size: 14px;
+  font-weight: normal;
+  line-height: 18px;
+  background-color: #18af91;
+  border-bottom: 1px solid #15987e;
+  border-radius: 5px 5px 0 0;
+}
+.popover-content {
+  padding: 9px 14px;
+}
+.popover .arrow,
+.popover .arrow:after {
+  position: absolute;
+  display: block;
+  width: 0;
+  height: 0;
+  border-color: transparent;
+  border-style: solid;
+}
+.popover .arrow {
+  border-width: 11px;
+}
+.popover .arrow:after {
+  border-width: 10px;
+  content: "";
+}
+.popover.top .arrow {
+  left: 50%;
+  margin-left: -11px;
+  border-bottom-width: 0;
+  border-top-color: #999999;
+  border-top-color: rgba(0, 0, 0, 0.25);
+  bottom: -11px;
+}
+.popover.top .arrow:after {
+  content: " ";
+  bottom: 1px;
+  margin-left: -10px;
+  border-bottom-width: 0;
+  border-top-color: #1abc9c;
+}
+.popover.right .arrow {
+  top: 50%;
+  left: -11px;
+  margin-top: -11px;
+  border-left-width: 0;
+  border-right-color: #999999;
+  border-right-color: rgba(0, 0, 0, 0.25);
+}
+.popover.right .arrow:after {
+  content: " ";
+  left: 1px;
+  bottom: -10px;
+  border-left-width: 0;
+  border-right-color: #1abc9c;
+}
+.popover.bottom .arrow {
+  left: 50%;
+  margin-left: -11px;
+  border-top-width: 0;
+  border-bottom-color: #999999;
+  border-bottom-color: rgba(0, 0, 0, 0.25);
+  top: -11px;
+}
+.popover.bottom .arrow:after {
+  content: " ";
+  top: 1px;
+  margin-left: -10px;
+  border-top-width: 0;
+  border-bottom-color: #1abc9c;
+}
+.popover.left .arrow {
+  top: 50%;
+  right: -11px;
+  margin-top: -11px;
+  border-right-width: 0;
+  border-left-color: #999999;
+  border-left-color: rgba(0, 0, 0, 0.25);
+}
+.popover.left .arrow:after {
+  content: " ";
+  right: 1px;
+  border-right-width: 0;
+  border-left-color: #1abc9c;
+  bottom: -10px;
+}
+.carousel {
+  position: relative;
+}
+.carousel-inner {
+  position: relative;
+  overflow: hidden;
+  width: 100%;
+}
+.carousel-inner > .item {
+  display: none;
+  position: relative;
+  -webkit-transition: 0.6s ease-in-out left;
+  transition: 0.6s ease-in-out left;
+}
+.carousel-inner > .item > img,
+.carousel-inner > .item > a > img {
+  display: block;
+  max-width: 100%;
+  height: auto;
+  line-height: 1;
+}
+.carousel-inner > .active,
+.carousel-inner > .next,
+.carousel-inner > .prev {
+  display: block;
+}
+.carousel-inner > .active {
+  left: 0;
+}
+.carousel-inner > .next,
+.carousel-inner > .prev {
+  position: absolute;
+  top: 0;
+  width: 100%;
+}
+.carousel-inner > .next {
+  left: 100%;
+}
+.carousel-inner > .prev {
+  left: -100%;
+}
+.carousel-inner > .next.left,
+.carousel-inner > .prev.right {
+  left: 0;
+}
+.carousel-inner > .active.left {
+  left: -100%;
+}
+.carousel-inner > .active.right {
+  left: 100%;
+}
+.carousel-control {
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  width: 10%;
+  opacity: 0.7;
+  filter: alpha(opacity=70);
+  font-size: 20px;
+  color: #ffffff;
+  text-align: center;
+  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
+}
+.carousel-control.left {
+  background-image: -webkit-gradient(linear, 0% top, 100% top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.0001)));
+  background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, 0.5) 0%), color-stop(rgba(0, 0, 0, 0.0001) 100%));
+  background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
+  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
+}
+.carousel-control.right {
+  left: auto;
+  right: 0;
+  background-image: -webkit-gradient(linear, 0% top, 100% top, from(rgba(0, 0, 0, 0.0001)), to(rgba(0, 0, 0, 0.5)));
+  background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, 0.0001) 0%), color-stop(rgba(0, 0, 0, 0.5) 100%));
+  background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
+  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
+}
+.carousel-control:hover,
+.carousel-control:focus {
+  color: #ffffff;
+  text-decoration: none;
+  opacity: 0.9;
+  filter: alpha(opacity=90);
+}
+.carousel-control .icon-prev,
+.carousel-control .icon-next,
+.carousel-control .glyphicon-chevron-left,
+.carousel-control .glyphicon-chevron-right {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  z-index: 5;
+  display: inline-block;
+}
+.carousel-control .icon-prev,
+.carousel-control .icon-next {
+  width: 20px;
+  height: 20px;
+  margin-top: -10px;
+  margin-left: -10px;
+  font-family: serif;
+}
+.carousel-control .icon-prev:before {
+  content: '\2039';
+}
+.carousel-control .icon-next:before {
+  content: '\203a';
+}
+.carousel-indicators {
+  position: absolute;
+  bottom: 10px;
+  left: 50%;
+  z-index: 15;
+  width: 60%;
+  margin-left: -30%;
+  padding-left: 0;
+  list-style: none;
+  text-align: center;
+}
+.carousel-indicators li {
+  display: inline-block;
+  width: 10px;
+  height: 10px;
+  margin: 1px;
+  text-indent: -999px;
+  border: 1px solid #ffffff;
+  border-radius: 10px;
+  cursor: pointer;
+}
+.carousel-indicators .active {
+  margin: 0;
+  width: 12px;
+  height: 12px;
+  background-color: #ffffff;
+}
+.carousel-caption {
+  position: absolute;
+  left: 15%;
+  right: 15%;
+  bottom: 20px;
+  z-index: 10;
+  padding-top: 20px;
+  padding-bottom: 20px;
+  color: #ffffff;
+  text-align: center;
+  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
+}
+.carousel-caption .btn {
+  text-shadow: none;
+}
+@media screen and (min-width: 768px) {
+  .carousel-control .icon-prev,
+  .carousel-control .icon-next {
+    width: 30px;
+    height: 30px;
+    margin-top: -15px;
+    margin-left: -15px;
+    font-size: 30px;
+  }
+  .carousel-caption {
+    left: 20%;
+    right: 20%;
+    padding-bottom: 30px;
+  }
+  .carousel-indicators {
+    bottom: 20px;
+  }
+}
+.clearfix:before,
+.clearfix:after {
+  content: " ";
+  /* 1 */
+
+  display: table;
+  /* 2 */
+
+}
+.clearfix:after {
+  clear: both;
+}
+.pull-right {
+  float: right !important;
+}
+.pull-left {
+  float: left !important;
+}
+.hide {
+  display: none !important;
+}
+.show {
+  display: block !important;
+}
+.invisible {
+  visibility: hidden;
+}
+.text-hide {
+  font: 0/0 a;
+  color: transparent;
+  text-shadow: none;
+  background-color: transparent;
+  border: 0;
+}
+.affix {
+  position: fixed;
+}
+@-ms-viewport {
+  width: device-width;
+}
+@media screen and (max-width: 400px) {
+  @-ms-viewport {
+    width: 320px;
+  }
+}
+.hidden {
+  display: none !important;
+  visibility: hidden !important;
+}
+.visible-xs {
+  display: none !important;
+}
+tr.visible-xs {
+  display: none !important;
+}
+th.visible-xs,
+td.visible-xs {
+  display: none !important;
+}
+@media (max-width: 767px) {
+  .visible-xs {
+    display: block !important;
+  }
+  tr.visible-xs {
+    display: table-row !important;
+  }
+  th.visible-xs,
+  td.visible-xs {
+    display: table-cell !important;
+  }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+  .visible-xs.visible-sm {
+    display: block !important;
+  }
+  tr.visible-xs.visible-sm {
+    display: table-row !important;
+  }
+  th.visible-xs.visible-sm,
+  td.visible-xs.visible-sm {
+    display: table-cell !important;
+  }
+}
+@media (min-width: 992px) and (max-width: 1199px) {
+  .visible-xs.visible-md {
+    display: block !important;
+  }
+  tr.visible-xs.visible-md {
+    display: table-row !important;
+  }
+  th.visible-xs.visible-md,
+  td.visible-xs.visible-md {
+    display: table-cell !important;
+  }
+}
+@media (min-width: 1200px) {
+  .visible-xs.visible-lg {
+    display: block !important;
+  }
+  tr.visible-xs.visible-lg {
+    display: table-row !important;
+  }
+  th.visible-xs.visible-lg,
+  td.visible-xs.visible-lg {
+    display: table-cell !important;
+  }
+}
+.visible-sm {
+  display: none !important;
+}
+tr.visible-sm {
+  display: none !important;
+}
+th.visible-sm,
+td.visible-sm {
+  display: none !important;
+}
+@media (max-width: 767px) {
+  .visible-sm.visible-xs {
+    display: block !important;
+  }
+  tr.visible-sm.visible-xs {
+    display: table-row !important;
+  }
+  th.visible-sm.visible-xs,
+  td.visible-sm.visible-xs {
+    display: table-cell !important;
+  }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+  .visible-sm {
+    display: block !important;
+  }
+  tr.visible-sm {
+    display: table-row !important;
+  }
+  th.visible-sm,
+  td.visible-sm {
+    display: table-cell !important;
+  }
+}
+@media (min-width: 992px) and (max-width: 1199px) {
+  .visible-sm.visible-md {
+    display: block !important;
+  }
+  tr.visible-sm.visible-md {
+    display: table-row !important;
+  }
+  th.visible-sm.visible-md,
+  td.visible-sm.visible-md {
+    display: table-cell !important;
+  }
+}
+@media (min-width: 1200px) {
+  .visible-sm.visible-lg {
+    display: block !important;
+  }
+  tr.visible-sm.visible-lg {
+    display: table-row !important;
+  }
+  th.visible-sm.visible-lg,
+  td.visible-sm.visible-lg {
+    display: table-cell !important;
+  }
+}
+.visible-md {
+  display: none !important;
+}
+tr.visible-md {
+  display: none !important;
+}
+th.visible-md,
+td.visible-md {
+  display: none !important;
+}
+@media (max-width: 767px) {
+  .visible-md.visible-xs {
+    display: block !important;
+  }
+  tr.visible-md.visible-xs {
+    display: table-row !important;
+  }
+  th.visible-md.visible-xs,
+  td.visible-md.visible-xs {
+    display: table-cell !important;
+  }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+  .visible-md.visible-sm {
+    display: block !important;
+  }
+  tr.visible-md.visible-sm {
+    display: table-row !important;
+  }
+  th.visible-md.visible-sm,
+  td.visible-md.visible-sm {
+    display: table-cell !important;
+  }
+}
+@media (min-width: 992px) and (max-width: 1199px) {
+  .visible-md {
+    display: block !important;
+  }
+  tr.visible-md {
+    display: table-row !important;
+  }
+  th.visible-md,
+  td.visible-md {
+    display: table-cell !important;
+  }
+}
+@media (min-width: 1200px) {
+  .visible-md.visible-lg {
+    display: block !important;
+  }
+  tr.visible-md.visible-lg {
+    display: table-row !important;
+  }
+  th.visible-md.visible-lg,
+  td.visible-md.visible-lg {
+    display: table-cell !important;
+  }
+}
+.visible-lg {
+  display: none !important;
+}
+tr.visible-lg {
+  display: none !important;
+}
+th.visible-lg,
+td.visible-lg {
+  display: none !important;
+}
+@media (max-width: 767px) {
+  .visible-lg.visible-xs {
+    display: block !important;
+  }
+  tr.visible-lg.visible-xs {
+    display: table-row !important;
+  }
+  th.visible-lg.visible-xs,
+  td.visible-lg.visible-xs {
+    display: table-cell !important;
+  }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+  .visible-lg.visible-sm {
+    display: block !important;
+  }
+  tr.visible-lg.visible-sm {
+    display: table-row !important;
+  }
+  th.visible-lg.visible-sm,
+  td.visible-lg.visible-sm {
+    display: table-cell !important;
+  }
+}
+@media (min-width: 992px) and (max-width: 1199px) {
+  .visible-lg.visible-md {
+    display: block !important;
+  }
+  tr.visible-lg.visible-md {
+    display: table-row !important;
+  }
+  th.visible-lg.visible-md,
+  td.visible-lg.visible-md {
+    display: table-cell !important;
+  }
+}
+@media (min-width: 1200px) {
+  .visible-lg {
+    display: block !important;
+  }
+  tr.visible-lg {
+    display: table-row !important;
+  }
+  th.visible-lg,
+  td.visible-lg {
+    display: table-cell !important;
+  }
+}
+.hidden-xs {
+  display: block !important;
+}
+tr.hidden-xs {
+  display: table-row !important;
+}
+th.hidden-xs,
+td.hidden-xs {
+  display: table-cell !important;
+}
+@media (max-width: 767px) {
+  .hidden-xs {
+    display: none !important;
+  }
+  tr.hidden-xs {
+    display: none !important;
+  }
+  th.hidden-xs,
+  td.hidden-xs {
+    display: none !important;
+  }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+  .hidden-xs.hidden-sm {
+    display: none !important;
+  }
+  tr.hidden-xs.hidden-sm {
+    display: none !important;
+  }
+  th.hidden-xs.hidden-sm,
+  td.hidden-xs.hidden-sm {
+    display: none !important;
+  }
+}
+@media (min-width: 992px) and (max-width: 1199px) {
+  .hidden-xs.hidden-md {
+    display: none !important;
+  }
+  tr.hidden-xs.hidden-md {
+    display: none !important;
+  }
+  th.hidden-xs.hidden-md,
+  td.hidden-xs.hidden-md {
+    display: none !important;
+  }
+}
+@media (min-width: 1200px) {
+  .hidden-xs.hidden-lg {
+    display: none !important;
+  }
+  tr.hidden-xs.hidden-lg {
+    display: none !important;
+  }
+  th.hidden-xs.hidden-lg,
+  td.hidden-xs.hidden-lg {
+    display: none !important;
+  }
+}
+.hidden-sm {
+  display: block !important;
+}
+tr.hidden-sm {
+  display: table-row !important;
+}
+th.hidden-sm,
+td.hidden-sm {
+  display: table-cell !important;
+}
+@media (max-width: 767px) {
+  .hidden-sm.hidden-xs {
+    display: none !important;
+  }
+  tr.hidden-sm.hidden-xs {
+    display: none !important;
+  }
+  th.hidden-sm.hidden-xs,
+  td.hidden-sm.hidden-xs {
+    display: none !important;
+  }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+  .hidden-sm {
+    display: none !important;
+  }
+  tr.hidden-sm {
+    display: none !important;
+  }
+  th.hidden-sm,
+  td.hidden-sm {
+    display: none !important;
+  }
+}
+@media (min-width: 992px) and (max-width: 1199px) {
+  .hidden-sm.hidden-md {
+    display: none !important;
+  }
+  tr.hidden-sm.hidden-md {
+    display: none !important;
+  }
+  th.hidden-sm.hidden-md,
+  td.hidden-sm.hidden-md {
+    display: none !important;
+  }
+}
+@media (min-width: 1200px) {
+  .hidden-sm.hidden-lg {
+    display: none !important;
+  }
+  tr.hidden-sm.hidden-lg {
+    display: none !important;
+  }
+  th.hidden-sm.hidden-lg,
+  td.hidden-sm.hidden-lg {
+    display: none !important;
+  }
+}
+.hidden-md {
+  display: block !important;
+}
+tr.hidden-md {
+  display: table-row !important;
+}
+th.hidden-md,
+td.hidden-md {
+  display: table-cell !important;
+}
+@media (max-width: 767px) {
+  .hidden-md.hidden-xs {
+    display: none !important;
+  }
+  tr.hidden-md.hidden-xs {
+    display: none !important;
+  }
+  th.hidden-md.hidden-xs,
+  td.hidden-md.hidden-xs {
+    display: none !important;
+  }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+  .hidden-md.hidden-sm {
+    display: none !important;
+  }
+  tr.hidden-md.hidden-sm {
+    display: none !important;
+  }
+  th.hidden-md.hidden-sm,
+  td.hidden-md.hidden-sm {
+    display: none !important;
+  }
+}
+@media (min-width: 992px) and (max-width: 1199px) {
+  .hidden-md {
+    display: none !important;
+  }
+  tr.hidden-md {
+    display: none !important;
+  }
+  th.hidden-md,
+  td.hidden-md {
+    display: none !important;
+  }
+}
+@media (min-width: 1200px) {
+  .hidden-md.hidden-lg {
+    display: none !important;
+  }
+  tr.hidden-md.hidden-lg {
+    display: none !important;
+  }
+  th.hidden-md.hidden-lg,
+  td.hidden-md.hidden-lg {
+    display: none !important;
+  }
+}
+.hidden-lg {
+  display: block !important;
+}
+tr.hidden-lg {
+  display: table-row !important;
+}
+th.hidden-lg,
+td.hidden-lg {
+  display: table-cell !important;
+}
+@media (max-width: 767px) {
+  .hidden-lg.hidden-xs {
+    display: none !important;
+  }
+  tr.hidden-lg.hidden-xs {
+    display: none !important;
+  }
+  th.hidden-lg.hidden-xs,
+  td.hidden-lg.hidden-xs {
+    display: none !important;
+  }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+  .hidden-lg.hidden-sm {
+    display: none !important;
+  }
+  tr.hidden-lg.hidden-sm {
+    display: none !important;
+  }
+  th.hidden-lg.hidden-sm,
+  td.hidden-lg.hidden-sm {
+    display: none !important;
+  }
+}
+@media (min-width: 992px) and (max-width: 1199px) {
+  .hidden-lg.hidden-md {
+    display: none !important;
+  }
+  tr.hidden-lg.hidden-md {
+    display: none !important;
+  }
+  th.hidden-lg.hidden-md,
+  td.hidden-lg.hidden-md {
+    display: none !important;
+  }
+}
+@media (min-width: 1200px) {
+  .hidden-lg {
+    display: none !important;
+  }
+  tr.hidden-lg {
+    display: none !important;
+  }
+  th.hidden-lg,
+  td.hidden-lg {
+    display: none !important;
+  }
+}
+.visible-print {
+  display: none !important;
+}
+tr.visible-print {
+  display: none !important;
+}
+th.visible-print,
+td.visible-print {
+  display: none !important;
+}
+@media print {
+  .visible-print {
+    display: block !important;
+  }
+  tr.visible-print {
+    display: table-row !important;
+  }
+  th.visible-print,
+  td.visible-print {
+    display: table-cell !important;
+  }
+  .hidden-print {
+    display: none !important;
+  }
+  tr.hidden-print {
+    display: none !important;
+  }
+  th.hidden-print,
+  td.hidden-print {
+    display: none !important;
+  }
+}
+.form-control {
+  -webkit-box-shadow: none;
+  box-shadow: none;
+  color: #f2f2f2;
+}
+.form-control[disabled] {
+  border-color: #13866f;
+}
+.btn,
+.btn:hover {
+  border: none;
+}
+.btn-group .btn + .btn {
+  margin: 0;
+}
+pre {
+  border: none;
+  color: #e6e6e6;
+}
+legend {
+  color: #ebebeb;
+}
+.well {
+  border: none;
+  border-radius: 0px;
+  -webkit-box-shadow: none;
+  box-shadow: none;
+}
+.panel {
+  border: none;
+}
+.page-header {
+  margin-top: 20px;
+}
+.nav > li > a {
+  color: #ffffff;
+}
+.nav-tabs {
+  margin-bottom: 15px;
+}
+.nav-tabs > li > a:hover {
+  border-color: transparent;
+}
+.navbar-nav > li:before {
+  content: '';
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 1px;
+  height: 100%;
+  background: rgba(74, 104, 133, 0.41);
+}
+.navbar-nav > li:hover:before,
+.navbar-nav > li:hover + li:before,
+.navbar-nav > li.active:before,
+.navbar-nav > li.active + li:before {
+  display: none;
+}
+.navbar-nav .disabled:hover:before,
+.navbar-nav .disabled:hover + li:before {
+  display: block;
+}
+.navbar-nav > li:first-child:before {
+  display: none;
+}
+.navbar-nav > li > a {
+  font-size: 14px;
+  font-weight: 600;
+}
+.navbar-nav > .active > a {
+  cursor: default;
+}
+.navbar-nav > .active > a:after {
+  content: '';
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 4px;
+  background: #1abc9c;
+}
+.navbar-nav > .active > a:before {
+  content: '';
+  position: absolute;
+  left: 50%;
+  top: 4px;
+  margin: 0 0 0 -5px;
+  width: 0;
+  height: 0;
+  border-left: 5px solid transparent;
+  border-right: 5px solid transparent;
+  border-top: 5px solid #1abc9c;
+}
+.navbar-inverse .navbar-nav > li:before {
+  background: rgba(20, 143, 119, 0.41);
+}
+.navbar-inverse .navbar-nav > .active > a:after {
+  background: #34495e;
+}
+.navbar-inverse .navbar-nav > .active > a:before {
+  border-top-color: #34495e;
+}
+.input-group-addon {
+  background: #3f5872;
+}
+.dropdown-menu {
+  -webkit-box-shadow: none;
+  box-shadow: none;
+  border: none;
+  margin-top: 12px;
+}
+.dropdown-menu:before {
+  content: '';
+  position: absolute;
+  left: 20px;
+  top: -5px;
+  width: 0;
+  height: 0;
+  border-left: 5px solid transparent;
+  border-right: 5px solid transparent;
+  border-bottom: 5px solid #1abc9c;
+}
+.dropdown-menu.pull-right:before {
+  right: 20px;
+  left: auto;
+}
+.dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus {
+  text-decoration: none;
+  color: #ffffff;
+  background: rgba(22, 157, 130, 0.71);
+}
+.dropdown-menu .disabled > a,
+.dropdown-menu .disabled > a:hover,
+.dropdown-menu .disabled > a:focus {
+  color: rgba(255, 255, 255, 0.2);
+}
+.dropdown-menu .active > a,
+.dropdown-menu .active > a:hover,
+.dropdown-menu .active > a:focus {
+  position: relative;
+  color: #ffffff;
+  text-decoration: none;
+  outline: 0;
+  background: rgba(26, 188, 156, 0.2);
+  cursor: default;
+}
+.dropdown-menu .active > a:before {
+  content: '';
+  position: absolute;
+  left: 0;
+  top: 0;
+  bottom: auto;
+  width: 4px;
+  height: 100%;
+  background: #1abc9c;
+}
+.dropdown-menu .dropdown-header {
+  color: #e6e6e6;
+}
+.dropup .dropdown-menu {
+  margin-bottom: 12px;
+}
+.dropup .dropdown-menu:before {
+  top: auto;
+  bottom: -5px;
+  width: 0;
+  height: 0;
+  border-left: 5px solid transparent;
+  border-right: 5px solid transparent;
+  border-top: 5px solid #1abc9c;
+  border-bottom: none;
+}
+.pagination > li > a,
+.pagination > li > span {
+  border: none;
+  color: #ffffff;
+  position: relative;
+}
+.pagination > li > a:before,
+.pagination > li > span:before {
+  content: '';
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 1px;
+  height: 100%;
+  background: rgba(74, 104, 133, 0.41);
+}
+.pagination > li:first-child > a:before,
+.pagination > li:first-child > span:before {
+  display: none;
+}
+.pagination > .active > a:before,
+.pagination > .active > span:before {
+  display: none;
+}
+.pagination > li > a:hover:before,
+.pagination > li > a:focus:before {
+  display: none;
+}
+.pagination > .disabled > span:before,
+.pagination > .disabled > a:before,
+.pagination > .disabled > a:hover:before,
+.pagination > .disabled > a:focus:before {
+  display: block;
+}
+.pager li > a,
+.pager li > span {
+  border: none;
+  color: #ffffff;
+}
+.alert {
+  border: none;
+}
+.panel-default > .panel-heading {
+  color: #ffffff;
+  background-color: rgba(74, 104, 133, 0.81);
+  border-color: rgba(250, 250, 250, 0.15);
+}
+.panel .list-group {
+  margin: 0 0 10px;
+}
+.panel .list-group li.list-group-item:hover {
+  border-color: rgba(74, 104, 133, 0.81);
+}
+.panel .list-group .list-group-item {
+  border-width: 1px;
+  color: #ffffff;
+}
+.panel .list-group .list-group-item.active .list-group-item-text {
+  color: #ffffff;
+}
+.panel .list-group .list-group-item:hover {
+  border-color: #1abc9c;
+}
+.panel .list-group .list-group-item:first-child {
+  border-top-right-radius: 0px;
+  border-top-left-radius: 0px;
+}
+.panel .list-group .list-group-item:last-child {
+  border-bottom: 1px solid rgba(74, 104, 133, 0.81);
+}
+.panel .list-group-flush {
+  margin: 15px -15px -15px;
+}
+.panel .list-group-flush .list-group-item {
+  border-width: 1px 0;
+  color: #ffffff;
+}
+.panel .list-group-flush .list-group-item.active .list-group-item-text {
+  color: #ffffff;
+}
+.panel .list-group-flush .list-group-item:hover {
+  border-color: rgba(74, 104, 133, 0.81);
+}
+.panel .list-group-flush .list-group-item:first-child {
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+}
+.panel .list-group-flush .list-group-item:last-child {
+  border-bottom: 0;
+}
+.progress {
+  -webkit-box-shadow: none;
+  box-shadow: none;
+}
+.progress .progress-bar {
+  -webkit-box-shadow: none;
+  box-shadow: none;
+}
+.popover {
+  border: none;
+  padding: 0;
+  -webkit-box-shadow: none;
+  box-shadow: none;
+}
+.accordion-group {
+  background: #34495e;
+}
+.media-heading {
+  color: #1abc9c;
+}
+.thumbnail .caption .caption-label {
+  color: #1abc9c;
+}
diff --git a/FlatUI/css/corpus/variables.css b/FlatUI/css/corpus/variables.css
new file mode 100644
index 0000000..e69de29
diff --git a/FlatUI/css/theme.css b/FlatUI/css/theme.css
index 82963dd..cb06260 100644
--- a/FlatUI/css/theme.css
+++ b/FlatUI/css/theme.css
@@ -1348,7 +1348,7 @@ th {
 }
 .table-hover > tbody > tr:hover > td,
 .table-hover > tbody > tr:hover > th {
-  background-color: rgba(26, 188, 156, 0.15);
+  background-color: rgba(56, 110, 128, 1);
 }
 table col[class*="col-"] {
   float: none;
@@ -1579,8 +1579,9 @@ input[type="number"]::-webkit-inner-spin-button {
 .form-control[disabled],
 .form-control[readonly],
 fieldset[disabled] .form-control {
-  cursor: not-allowed;
-  background-color: #517293;
+  cursor: default;
+  background-color: #3f5872;
+    border: 1px solid #808080;
 }
 textarea.form-control {
   height: auto;
@@ -4613,9 +4614,15 @@ a.list-group-item:focus {
   border-radius: 0px;
   -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
+  overflow-y: auto;
+  overflow-x: auto;
+  
+}
+    
 }
 .panel-body {
   padding: 15px;
+  
 }
 .panel-body:before,
 .panel-body:after {
diff --git a/FlatUI/index.html b/FlatUI/index.html
index d2433a1..36feca6 100644
--- a/FlatUI/index.html
+++ b/FlatUI/index.html
@@ -6,7 +6,7 @@
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
-    <link href="css/theme.css" rel="stylesheet" media="screen">
+    <link href="/css/theme.css" rel="stylesheet" media="screen">
 
 </head>
 
@@ -262,7 +262,7 @@ <h6>This is an h6 heading</h6>
 						</fieldset>
 					</form>
 					<hr>
-					<form class="form-inline">
+					
 						<input type="text" class="form-control input-lg" placeholder="Large input" style="width: 200px;">
 						<input type="text" class="form-control" placeholder="Defaul size input" style="width: 200px;">
 						<input type="password" class="form-control input-sm" placeholder="Small input" style="width: 200px;">
@@ -1370,7 +1370,7 @@ <h4>Need more themes?</h4>
 		</div>
     </section>
 
-    <script src="http://code.jquery.com/jquery.js"></script>
-    <script src="js/bootstrap.min.js"></script>
+    <script type="text/javascript" src="/js/jquery.js"></script>
+    <script type="text/javascript" src="/js/bootstrap.min.js"></script>
 </body>
 </html>
\ No newline at end of file
diff --git a/PHPOnAzure/corpusbutton.html b/PHPOnAzure/corpusbutton.html
index 2e6b5d8..9a342d6 100644
--- a/PHPOnAzure/corpusbutton.html
+++ b/PHPOnAzure/corpusbutton.html
@@ -1,4 +1,4 @@
-<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
+<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
 <button type="button">Click Me</button>
 
 <script>
diff --git a/SidebarPractice.html b/SidebarPractice.html
index c5fe739..3123a1a 100644
--- a/SidebarPractice.html
+++ b/SidebarPractice.html
@@ -45,7 +45,7 @@
         <!-- /#page-content-wrapper -->
     </div>
     <!-- /#wrapper -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
     <!-- Include all compiled plugins (below), or include individual files as needed -->
     <script src="js/bootstrap.min.js"></script>
     <script type="text/javascript" src="js/SidebarPractice.js"></script>
diff --git a/StudentSubmissions.html b/StudentSubmissions.html
index 4dd3f7c..d6e6593 100644
--- a/StudentSubmissions.html
+++ b/StudentSubmissions.html
@@ -2,15 +2,15 @@
 <html lang="en">
     
 <head>
-    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script>
         $(function(){
             $("#header").load("header.html");
         });
     </script>
 
-      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
+      <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+  <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
   <script src="dist/js/bootstrap-select.js"></script>
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
@@ -53,7 +53,7 @@
 
 
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="js/bootstrap.min.js"></script>
         <script src="js/bootstrap-datepicker.js"></script>
diff --git a/Test_CreateUserAccount.html b/Test_CreateUserAccount.html
index 72f737e..6f362c8 100644
--- a/Test_CreateUserAccount.html
+++ b/Test_CreateUserAccount.html
@@ -3,12 +3,12 @@
 
 <body bgcolor="#AFEEEE">
 <p> </p>  
-<a href="https://smalltalkphp.azurewebsites.net/text_corpus_login.html"><p style="text-align: right">Log Out</a> 
+<a href="//smalltalkphp.azurewebsites.net/text_corpus_login.html"><p style="text-align: right">Log Out</a> 
 <p> </p>
 <center>Add User Account</center>
 <p></p>
 <p> </p>
-<a href="https://smalltalkphp.azurewebsites.net/Briantitlepage.html">Return to Table of Contents</a>
+<a href="//smalltalkphp.azurewebsites.net/Briantitlepage.html">Return to Table of Contents</a>
 <p> </p>
 
  
diff --git a/Videos/Add Institution.flv b/Videos/Add Institution.flv
new file mode 100644
index 0000000..9542c7f
Binary files /dev/null and b/Videos/Add Institution.flv differ
diff --git a/Videos/Corpus Process.flv b/Videos/Corpus Process.flv
new file mode 100644
index 0000000..076a977
Binary files /dev/null and b/Videos/Corpus Process.flv differ
diff --git a/Videos/Student Process.flv b/Videos/Student Process.flv
new file mode 100644
index 0000000..e2ac49c
Binary files /dev/null and b/Videos/Student Process.flv differ
diff --git a/Videos/Teacher Process.flv b/Videos/Teacher Process.flv
new file mode 100644
index 0000000..956a4fc
Binary files /dev/null and b/Videos/Teacher Process.flv differ
diff --git a/admin/Archive/Courses/Search/index.php b/admin/Archive/Courses/Search/index.php
deleted file mode 100644
index c4dbb24..0000000
--- a/admin/Archive/Courses/Search/index.php
+++ /dev/null
@@ -1,186 +0,0 @@
-<?php 
-include "../../../base.php";
-include "../../../pagination.php";
-?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-
-
-    <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Admin')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-        
-        ?>
-        <body>
-            <div id="header"></div>           
-            <div id="wrapper">
-                <div id="sidebar"></div>
-                <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">  
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                                    <span class="hamb-top"></span>
-                                    <span class="hamb-middle"></span>
-                                    <span class="hamb-bottom"></span>
-                                </button>
-                                <div class="panel panel-primary">
-                                    <div class="panel-heading">Course Listing (sort by most recent)</div>
-                                    <!-- Select Rows Per Page -->
-                                    <div class="dropdown">
-                                        <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
-                                            Select rows per page
-                                            <span class="caret"></span>
-                                        </button>
-                                        <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
-                                            <li><a href="?pp=10">10</a></li>
-                                            <li><a href="?pp=25">25</a></li>
-                                            <li><a href="?pp=50">50</a></li>
-                                            <li><a href="?pp=100">100</a></li>
-                                            
-                                        </ul>
-                                    </div>
-                                    
-                                    <div class="panel-body">                           
-                                        <table class="table">
-                                            <thead>
-                                                <tr>
-                                                    <td>Course</td>
-                                                    <td>Section</td>
-                                                    <td>Instructor</td>
-                                                    <td>Year</td>
-                                                    <td>Session</td>
-                                                    <td>Course Page</td>
-                                                </tr>
-                                            </thead>
-                                            <tbody>
-
-<?php
-    /* Set up and declare query entity */
-    $params = array();
-    $options = array( "Scrollable" => 'static' );
-    $query = "  SELECT  CN.[Course #], TC.[Section], A.[Advisor], Y.[Year], S.[Session], TC.[Teachers&ClassesID], TC.[Instructor]
-                FROM [Teachers&Classes] as TC, [Advisor] as A, [Class Names] as CN, [Session] as S, [Sessions] as Ss, [Year] as Y
-                WHERE TC.[ClassNamesID] = CN.[ClassNamesID] AND 
-                TC.[Instructor] = A.[ID] AND 
-                TC.[SessionID] = Ss.[SessionsID] AND
-                TC.[Teachers&ClassesID] in (SELECT [Teachers&ClassesID] from Expressions) AND
-                Y.[ID] = Ss.[Year_ID] AND
-                S.[ID] = Ss.[Session_ID]
-                ORDER BY Y.[Year] desc";
-    $stmt = sqlsrv_query($con, $query, $params, $options);
-    if ( !$stmt )
-        die( print_r( sqlsrv_errors(), true));
-
-    /* Extract Pagination Paramaters */
-
-    $rowsPerPage = isset($_GET['pp']) ? $_GET['pp'] : 10; // get rows per page, default = 10
-
-
-    $rowsReturned = sqlsrv_num_rows($stmt);
-    if($rowsReturned === false)
-        die(print_r( sqlsrv_errors(), true));
-    elseif($rowsReturned == 0)
-    {
-        echo "No rows returned.";
-        exit();
-    }
-    else
-    {
-        /* Calculate number of pages. */
-        $numOfPages = ceil($rowsReturned/$rowsPerPage);
-    }
-
-    /* Echo results to the page */
-    $pageNum = isset($_GET['pageNum']) ? $_GET['pageNum'] : 1;
-    $page = Pagination::getPage($stmt, $pageNum, $rowsPerPage);
-    foreach($page as $row)
-    {
-        $coursePageLink = "ViewCourse/?courseID=$row[5]";
-        echo "<tr><td>$row[0]</td><td>$row[1]</td><td>$row[2]</td><td>$row[3]</td><td>$row[4]</td><td><a href='$coursePageLink'>Course Page</a></td></tr>";
-    }
-
-    echo "</tbody></table><br />";
-    $modulator = 3;
-    Pagination::pageLinks($numOfPages, $pageNum, $rowsPerPage, $rowsReturned, $modulator);
-    ?>
-                                            
-                                    </div>
-                                </div>
-                                
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-            <!-- Include all compiled plugins (below), or include individual files as needed -->
-            <script src="/js/bootstrap.min.js"></script>
-            <script>
-            $("#menu-toggle").click(function(e) {
-                e.preventDefault();
-                $("#wrapper").toggleClass("toggled");
-            });
-            </script>
-        </body> 
-        <?php        
-    }
-}
-
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-
-</html>
diff --git a/admin/Archive/Courses/ViewCourse/ViewWorksheet/AnnotationEditor/index.php b/admin/Archive/Courses/ViewCourse/ViewWorksheet/AnnotationEditor/index.php
new file mode 100644
index 0000000..2c00ded
--- /dev/null
+++ b/admin/Archive/Courses/ViewCourse/ViewWorksheet/AnnotationEditor/index.php
@@ -0,0 +1,268 @@
+<?php 
+include "../../../../../../base.php";
+?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script type="text/javascript" src="/js/getText.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+    <script>
+        var selection = "<---------->";
+    </script>
+</head>
+
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if($_SESSION['Role'] != 'Admin')
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        $worksheetID = isset($_POST['worksheetID']) ? $_POST['worksheetID'] : 0;
+        if ($worksheetID == 0)
+            echo "<meta http-equiv='refresh' content='0;/' />";
+        $params = array($worksheetID);
+        $options = array("Scrollable" => 'static');
+        $worksheetexpressionsSQL = "SELECT E.Expression, E.[Context/Vocabulary], E.SentenceNumber, E.ExpressionID, S.FirstName, S.LastName, S.StudentID
+                                    FROM Expressions E, Students S
+                                    WHERE E.WorksheetID = ? AND
+                                          S.StudentID = E.StudentID
+                                    ORDER BY E.[SentenceNumber]";
+        $worksheetexpressions = sqlsrv_query($con, $worksheetexpressionsSQL, $params, $options);
+        if ($worksheetexpressions === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_expressions = sqlsrv_num_rows($worksheetexpressions);
+        $expressions = [];
+        $contexts = [];
+        $numbers = [];
+        $expressionids = [];
+        $firstnames = [];
+        $lastnames = [];
+        $studentids = [];
+        while (sqlsrv_fetch($worksheetexpressions) === true)
+        {
+            $expressions[] = sqlsrv_get_field($worksheetexpressions, 0);
+            $contexts[] = sqlsrv_get_field($worksheetexpressions, 1);
+            $numbers[] = sqlsrv_get_field($worksheetexpressions, 2);
+            $expressionids[] = sqlsrv_get_field($worksheetexpressions, 3);
+            $firstnames[] = sqlsrv_get_field($worksheetexpressions, 4);
+            $lastnames[] = sqlsrv_get_field($worksheetexpressions, 5);
+            $studentids[] = sqlsrv_get_field($worksheetexpressions, 6);
+        }
+
+        ?>
+        <body>
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                        <span class="hamb-top"></span>
+                        <span class="hamb-middle"></span>
+                        <span class="hamb-bottom"></span>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-10">
+                                <h3>Annotation Editor</h3>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-md-4">
+                                <div class="panel panel-primary" style="min-height: 300px;max-height: 300px; overflow-y:auto">
+                                    <div class="panel-heading">
+                                        <h4>Worksheet Details</h4>
+                                    </div>
+                                    <div class="panel-body">
+                                        <p>Course</p>
+                                        <p>Date</p>
+                                        <p>Topic</p>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-8">
+                                <div class="panel panel-primary" style="min-height: 400px;max-height: 300px; overflow-y:auto">
+                                    <div class="panel-heading">
+                                        <h4>Expressions List (click and drag to get started!)</h4>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>#</th>
+                                                    <th>Student</th>
+                                                    <th>Expression</th>
+                                                    <th>Context/Vocab</th>
+                                                    <th>Number of Annotations</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+<?php
+            for ($i = 0; $i < $num_expressions; $i++)
+            {
+?>
+                                                <tr>
+                                                    <td name="sentencenumber"><?=$numbers[$i]?></td>
+                                                    <td><?=$firstnames[$i]?> <?=$lastnames[$i]?></td>
+                                                    <td>
+                                                        <div name="highlightrange"><?=$expressions[$i]?></div>
+                                                        <input hidden type="text" name="expressionid" value="<?=$expressionids[$i]?>">
+                                                        <input hidden type="text" name="expressionnumber" value="<?=$numbers[$i]?>">
+                                                    </td>
+                                                    <td><?=$contexts[$i]?></td>
+                                                    <td>0</td>
+                                                </tr>
+<?php
+            }
+?>
+                                                
+                                                
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-md-12">
+                                <div class="panel panel-primary" style="min-height: 400px;">
+                                    <div class="panel-heading">
+                                        <h4>Editor</h4>
+                                    </div>
+                                    <div class="panel-body">
+                                        <div class="col-md-10">
+                                            <h4>Expression Annotator ( # <span id="editorexpressionnumber"></span> ) </h4>
+                                            <ul class="nav nav-tabs">
+                                                <li class="active"><a data-toggle="tab" href="#newedit">New Annotation</a></li>
+                                                <li><a data-toggle="tab" href="#viewprevious">Previous Annotations</a></li>
+
+                                            </ul>
+                                            <div class="tab-content">
+                                                <div id="newedit" class="tab-pane fade in active">
+                                                    <form method="POST" name="annotation" id="annotation">
+                                                        <input hidden type="text" name="expressionid" id="editorexpressionid">
+                                                        <div class="row">
+                                                            <div class="col-xs-10"> <span id="editorexpressionnumber"></span>
+                                                            </div>
+                                                            <div class="col-xs-10">
+                                                                <textarea disabled id="editorexpression" name="expression" class="form-control" class="col-xs-11">
+                                                                </textarea>
+                                                            </div>
+                                                        </div>
+                                                        <hr>
+                                                        <div class="row">
+                                                            <div class="col-xs-4">
+                                                                <select class="form-control">
+                                                                    <option selected="selected">--Error Type--</option>
+                                                                    <option>type1</option>
+                                                                    <option>type2</option>
+                                                                    <option>type3</option>
+                                                                    <option>type4</option>
+                                                                </select>
+                                                            </div>
+                                                            <div class="col-xs-4">
+                                                                <select class="form-control">
+                                                                    <option selected="selected">--Error Subselect--</option>
+                                                                    <option>type1</option>
+                                                                    <option>type2</option>
+                                                                    <option>type3</option>
+                                                                    <option>type4</option>
+                                                                </select>
+                                                            </div>
+                                                        </div>
+                                                        <br>
+                                                        <div class="row">
+                                                            <div class="col-xs-8">
+                                                                <input type="text" class="form-control" name="Comments" id="Comments" placeholder="Comments">
+                                                            </div>
+                                                            <div class="col-xs-4">
+                                                                <button type="button" class="btn btn-primary">
+                                                                    Submit Annotation
+                                                                </button>
+                                                            </div>
+                                                        </div>
+                                                    </form>
+                                                </div>
+                                            
+                                                <div id="viewprevious" class="tab-pane fade">
+                                                    <div class="row">
+                                                        <div class="col-xs-12">
+                                                            <h4>Previous Annotations</h4>
+                                                            <table class="table table-hover">
+                                                                <thead>
+                                                                    <tr>
+                                                                        <th>Date</th>
+                                                                        <th>Author</th>
+                                                                        <th>Text</th>
+                                                                        <th>Error Category</th>
+                                                                        <th>Error Name</th>
+                                                                    </tr>
+                                                                </thead>
+                                                            </table>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                                    
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <!-- Include all compiled plugins (below), or include individual files as needed -->
+            <script src="/js/bootstrap.min.js"></script>
+            <script>
+            $("#menu-toggle").click(function(e) {
+                e.preventDefault();
+                $("#wrapper").toggleClass("toggled");
+            });
+
+            </script>
+        </body> 
+        <?php  
+        }
+}
+
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+
+</html>
diff --git a/admin/Archive/Courses/ViewCourse/ViewWorksheet/index.php b/admin/Archive/Courses/ViewCourse/ViewWorksheet/index.php
index 500f396..6f48672 100644
--- a/admin/Archive/Courses/ViewCourse/ViewWorksheet/index.php
+++ b/admin/Archive/Courses/ViewCourse/ViewWorksheet/index.php
@@ -14,9 +14,10 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
 
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -27,16 +28,7 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
+    
 </head>
 
 <?php
@@ -54,33 +46,99 @@
     {
         $courseID = isset($_GET['courseID']) ? $_GET['courseID'] : 0;
         $worksheetNum = isset($_GET['worksheetNum']) ? $_GET['worksheetNum'] : 0;
-        if ($courseID == 0 && $worksheetNum == 0)
+        if (false)
             echo "<meta http-equiv='refresh' content='0;../../' />";
         else
         {
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
-                                </button>
-                                <div class="panel panel-primary">
-                                    <div class="panel-heading">Documentation</div>
+                    </button>
+                    <div class="container-fluid"> 
+                        <div class="row">
+                            <div class="col-lg-5 col-md-5 col-sm-5">
+                                <div class="panel panel-primary" >
+                                    <div class="panel-heading">
+                                        Course Details
+                                    </div>
                                     <div class="panel-body">
-                                        <p>Main course (archived) view for admin/teacher.  Will contain list/links to worksheets, students, and the teacher</p>
-                                        <p>This top section will contain general information about a given course (teacher, level, etc)</p>
+                                        <a href="AnnotationEditor/index.php" class="btn btn-primary " type="button">Annotation Editor</a>
+                                        <?php
+            $params = array($courseID);
+            $options = array( "Scrollable" => 'static');
+            $courseInfoQuery = "
+              SELECT TC.CoursesID, CN.ClassName, TC.Section, T.FirstName, T.LastName, SN.SessionName, I.InstitutionName
+            FROM Courses as TC, [Class Names] as CN, Teachers as T, Sessions as Ss, SessionNames as SN, Institutions as I
+            WHERE TC.CoursesID = ? AND
+                  CN.ClassNamesID = TC.ClassNamesID AND
+                  T.TeacherID = TC.InstructorID AND
+                  Ss.SessionsID = TC.SessionID AND
+                  SN.SessionsID = Ss.SessionsID";
+            $stmt = sqlsrv_query( $con, $courseInfoQuery, $params, $options);
+            if ($stmt === false)
+                die(print_r(sqlsrv_errors(), true));
+            if (sqlsrv_fetch($stmt) === true)
+            {
+                $ClassName = sqlsrv_get_field($stmt, 1);
+                $Section = sqlsrv_get_field($stmt, 2);
+                $FirstName = sqlsrv_get_field($stmt, 3);
+                $LastName = sqlsrv_get_field($stmt, 4);
+                $Session = sqlsrv_get_field($stmt, 5);
+                $Institution = sqlsrv_get_field($stmt, 6);
+                
+                
+            }
+            echo "<p>Class Name: $ClassName</p><p>Section: $Section</p><p>Teacher: $FirstName $LastName</p><p>Session: $Session</p><p>Hosting Institution: $Institution</p>";
+            
+            
+            
+            
+                                        ?>
                                         
                                     </div>
                                 </div>
+                                
+                                
+                            </div>
+                            <div class="col-lg-5 col-md-5 col-sm-5">
+                                <div class="panel panel-primary" style="min-height:220px">
+                                    <div class="panel-heading">
+                                        Worksheet Details
+                                    </div>
+                                    <div class="panel-body">
+                                        <?php
+            $params = array($courseID, $worksheetNum, $courseID, $worksheetNum);
+            $options = array( "Scrollable" => 'static');
+            $worksheetInfoQuery = "
+              SELECT DISTINCT [TO].Topic, LEFT(CONVERT(VARCHAR, E.Date, 120), 10) 
+		      FROM Expressions as E, Topics as [TO]
+              WHERE E.[Teachers&ClassesID] = ? AND
+                  E.[Worksheet#] = ? AND
+				  [TO].Topic_ID = E.[Topic_ID] AND
+                  E.Date = (SELECT min(Date) FROM Expressions WHERE [Teachers&ClassesID] = ? AND [Worksheet#] = ?)";
+            $stmt = sqlsrv_query( $con, $worksheetInfoQuery, $params, $options);
+            if ($stmt === false)
+                die(print_r(sqlsrv_errors(), true));
+            if (sqlsrv_fetch($stmt) === true)
+            {
+                $topic = sqlsrv_get_field($stmt, 0);
+                $date = sqlsrv_get_field($stmt, 1);
+            }
+            echo "<p>Topic: $topic</p><p>Date: $date";
+            ?>
+                                    </div>
+                                </div>
+                                
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-10">
                                 <div class="panel panel-primary">
                                     <div class="panel-heading">Worksheet display</div>
                                     <!-- Select Rows Per Page -->
@@ -98,28 +156,28 @@
                                         </ul>
                                     </div>
                                     <div class="panel-body">
-                                        <table class="table">
+                                        <table class="table table-hover">
                                             <thead>
                                                 <tr>
-                                                    <td>Sentence Number</td>
-                                                    <td>Student</td>
-                                                    <td>Citizenship</td>
-                                                    <td>Expression</td>
-                                                    <td>Context/Vocab</td>
+                                                    <th>#</th>
+                                                    <th>Student</th>
+                                                    <th>Expression</th>
+                                                    <th>Context/Vocab</th>
+                                                    <th>Pronunciation</th>
                                                 </tr>
                                             </thead>
                                             <tbody>
         <?php
-            $params = array();
+            $params = array($courseID, $worksheetNum);
             $options = array( "Scrollable" => 'static' );
             $query = 
-       "SELECT E.[Sentence number], S.[LastName], C.Country, E.Expression, E.[Context/Vocabulary], E.Student_ID
+       "SELECT E.[Sentence number], S.[LastName], E.Expression, E.[Context/Vocabulary], E.[Pronunciation], E.StudentID
         FROM Expressions as E, 
              Students as S, 
 	         Country as C
-        WHERE E.[Teachers&ClassesID] = $courseID AND
-              E.[Worksheet#] = $worksheetNum AND
-		      S.ID = E.Student_ID AND
+        WHERE E.[Teachers&ClassesID] = ? AND
+              E.[Worksheet#] = ? AND
+		      S.ID = E.StudentID AND
 		      C.ID = S.Citizenship
         ORDER BY [Sentence number]";
             $stmt = sqlsrv_query($con, $query, $params, $options);
@@ -154,14 +212,13 @@
 
                                     </div>
                                 </div>
-                                
                             </div>
                         </div>
                     </div>
                 </div>
             </div>
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script>
diff --git a/admin/Archive/Courses/ViewCourse/index.php b/admin/Archive/Courses/ViewCourse/index.php
index ac2d57f..69876d3 100644
--- a/admin/Archive/Courses/ViewCourse/index.php
+++ b/admin/Archive/Courses/ViewCourse/index.php
@@ -14,9 +14,10 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
 
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -27,16 +28,7 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
+
 </head>
 
 <?php
@@ -52,54 +44,89 @@
     }
     else
     {
-        $courseID = isset($_GET['courseID']) ? $_GET['courseID'] : 0;
+        $courseID = isset($_POST['courseID']) ? $_POST['courseID'] : 0;
         if ($courseID == 0)
             echo "<meta http-equiv='refresh' content=0;../";
         else
         {
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
-                                </button>
+                    </button>
+                    <div class="container-fluid">        
+                        <div class="row">
+                            <div class="col-lg-3 col-md-4 col-sm-6">     
                                 <div class="panel panel-primary">
-                                    <div class="panel-heading">Documentation</div>
+                                    <div class="panel-heading">Course Info</div>
                                     <div class="panel-body">
-                                        <p>Main course (archived) view for admin/teacher.  Will contain list/links to worksheets, students, and the teacher</p>
-                                        <p>This top section will contain general information about a given course (teacher, level, etc)</p>
+                                    <?php
+            $params = array($courseID);
+            $options = array( "Scrollable" => 'static');
+            $courseinfoSQL = "
+            SELECT CT.CourseName, C.Section, T.FirstName, T.LastName, ST.SessionName, SI.Year, I.InstitutionName
+            FROM Courses as C, CourseTypes as CT, Teachers as T, TeachingInstance TI, SessionInstance as SI, SessionType as ST, Institutions as I
+            WHERE C.CourseID = ? AND
+                  CT.CourseTypesID = C.CourseTypesID AND
+                  TI.TeachingInstanceID = C.TeachingInstanceID AND
+                  T.TeacherID = TI.TeacherID AND
+                  SI.SessionInstanceID = C.SessionInstanceID AND
+                  ST.SessionTypeID = SI.SessionTypeID AND
+                  I.InstitutionID = C.InstitutionID";
+            $courseinfo = sqlsrv_query($con, $courseinfoSQL, $params, $options);
+            if ($courseinfo === false)
+                die(print_r(sqlsrv_errors(), true));
+            if (sqlsrv_fetch($courseinfo) === true)
+            {
+                $ClassName = sqlsrv_get_field($courseinfo, 0);
+                $Section = sqlsrv_get_field($courseinfo, 1);
+                $FirstName = sqlsrv_get_field($courseinfo, 2);
+                $LastName = sqlsrv_get_field($courseinfo, 3);
+                $Session = sqlsrv_get_field($courseinfo, 4);
+                $Year = sqlsrv_get_field($courseinfo, 5);
+                $Institution = sqlsrv_get_field($courseinfo, 6);
+                
+            }
+            echo "<p>Class Name: $ClassName</p><p>Section: $Section</p><p>Teacher: $FirstName $LastName</p><p>Session: $Session</p><p>Hosting Institution: $Institution</p>";
+                                        
+                                        
+                                        ?>
+                                    
                                     </div>
-                                </div>
-                                <div class="panel panel-primary">
+                                </div> 
+                            </div>
+                            <div class="col-lg-4 col-md-4 col-sm-6">
+                                <div class="panel panel-primary" style="max-height:350px; ">
                                     <div class="panel-heading">Worksheet display</div>
                                     <div class="panel-body">
-                                        <table class="table">
+                                        <table class="table table-hover">
                                             <thead>
                                                 <tr>
-                                                    <td>Worksheet Number</td>
-                                                    <td>Link to worksheet page</td>
+                                                    <th>#</th>
+                                                    <th>Go To</th>
+                                                    <th>Annotate this worksheet</th>
                                                 </tr>
                                             </thead>
                                             <tbody>
         <?php
             $params = array($courseID);
             $options = array( "Scrollable" => 'static' );
-            $query = "SELECT [Worksheet#], [Teachers&ClassesID] FROM Expressions WHERE [Teachers&ClassesID] = ? GROUP BY [Worksheet#],[Teachers&ClassesID]";
-            $stmt = sqlsrv_query($con, $query, $params, $options);
-            if (!$stmt)
+            $worksheetsSQL = "SELECT W.WorksheetID, W.WorksheetNumber, T.Topic 
+                      FROM Worksheets W, Topics T
+                      WHERE W.CourseID = ? AND
+                            T.TopicID = W.TopicID
+                      ORDER BY W.WorksheetNumber";
+            $worksheets = sqlsrv_query($con, $worksheetsSQL, $params, $options);
+            if (!$worksheets)
                 die( print_r( sqlsrv_errors(), true));
             
             $rowsPerPage = 10;
-            $rowsReturned = sqlsrv_num_rows($stmt);
+            $rowsReturned = sqlsrv_num_rows($worksheets);
             if($rowsReturned === false)
                 die(print_r( sqlsrv_errors(), true));
             elseif($rowsReturned == 0)
@@ -113,11 +140,23 @@
             }
             
             $pageNum = isset($_GET['pageNum']) ? $_GET['pageNum'] : 1;
-            $page = Pagination::getPage($stmt, $pageNum, $rowsPerPage);
+            $page = Pagination::getPage($worksheets, $pageNum, $rowsPerPage);
             foreach($page as $row)
             {
-                $worksheetPageLink = "ViewWorksheet/?courseID=$row[1]&worksheetNum=$row[0]";
-                echo "<tr><td>$row[0]</td><td><a href='$worksheetPageLink'>Worksheet Page</a></td></tr>";
+                $worksheetID = $row[0];
+                echo "<tr>  
+                        <td>$row[1]</td>
+                        <td><form method=\"POST\" action=\"ViewWorksheet\">
+                                <input hidden type=\"text\" name=\"worksheetID\" value=\"$worksheetID\">
+                                <button class=\"btn btn-primary\">Worksheet Page</button>
+                            </form>
+                        </td>
+                        <td><form method=\"POST\" action=\"ViewWorksheet/AnnotationEditor/\">
+                                <input hidden type=\"text\" name=\"worksheetID\" value=\"$worksheetID\">
+                                <button class=\"btn btn-primary\">Annotation Editor</button>
+                            </form>
+                        </td>
+                      </tr>";
             }
         ?>
             
@@ -128,14 +167,13 @@
 
                                     </div>
                                 </div>
-                                
                             </div>
                         </div>
                     </div>
                 </div>
             </div>
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script>
diff --git a/admin/Archive/Courses/index.php b/admin/Archive/Courses/index.php
index f5260ca..b069999 100644
--- a/admin/Archive/Courses/index.php
+++ b/admin/Archive/Courses/index.php
@@ -14,9 +14,11 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
 
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -28,15 +30,7 @@
     </script>
 
     <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
+
 </head>
 
 <?php
@@ -55,58 +49,89 @@
         
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
-                                </button>
-                                <div class="panel panel-primary">
-                                    <div class="panel-heading">Search for a course</div>
-                                    <div class="panel-body">
-                                        <form method="POST" action="Search/" name="SubmitCourseSearch">
-                                            <fieldset>
-                                                <select>
-                                                    <option selected="selected"></option>
-                                                    <option value=""</option>
-                                                </select>
-                                            </fieldset>
-                                        </form> 
-                                    </div>
-                                
-                                </div>
-                                <div class="panel panel-primary">
-                                    <div class="panel-heading">Course Listing (sort by most recent)</div>
+                    </button>
+                    <div class="container-fluid">
+                        
+                        <div class="row">
+                            <div class="col-lg-10">
+                                <div class="panel panel-primary" style="min-height: 500px; max-height: 500px;">
+                                    <div class="panel-heading">Courses Archive</div>
                                     <!-- Select Rows Per Page -->
-                                    <div class="dropdown">
-                                        <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
-                                            Select rows per page
-                                            <span class="caret"></span>
-                                        </button>
-                                        <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
-                                            <li><a href="?pp=10">10</a></li>
-                                            <li><a href="?pp=25">25</a></li>
-                                            <li><a href="?pp=50">50</a></li>
-                                            <li><a href="?pp=100">100</a></li>
+                                    <div class="row">
+                                        <div class="col-xs-10">
                                             
-                                        </ul>
+                                            <div class="dropdown">
+                                                <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                                                Select rows per page
+                                                <span class="caret"></span>
+                                                </button>
+                                                <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
+                                                    <li><a href="?pp=10">10</a></li>
+                                                    <li><a href="?pp=25">25</a></li>
+                                                    <li><a href="?pp=50">50</a></li>
+                                                    <li><a href="?pp=100">100</a></li>
+                                                </ul>
+                                            </div>
+                                        </div>
                                     </div>
+                                    <form method="POST" action="" name="Filter" id="Filter">  
+                                        <div class="form-group row">
+                                            <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
+                                                <select class="form-control">
+                                                    <option selected="selected">--Institution--</option>
+                                                    <option>Gonzaga University</option>
+                                                    <option>Spokane Falls CC</option>
+                                                    <option>Other...</option>
+                                                </select>
+                                            </div>
+                                            <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
+                                                <select class="form-control">
+                                                    <option selected="selected">--Teacher--</option>
+                                                    <option>Hunter</option>
+                                                    <option>Momono</option>
+                                                    <option>Other...</option>
+                                                </select>
+                                            </div>
+                                            <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
+                                                <select class="form-control">
+                                                    <option selected="selected">--Level--</option>
+                                                    <option>Entry</option>
+                                                    <option>Basic</option>
+                                                    <option>Intermediate</option>
+                                                    <option>Advanced</option>
+                                                    <option>Seminar</option>
+                                                </select>
+                                            </div>
+                                            <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
+                                                <select class="form-control">
+                                                    <option selected="selected">--Year--</option>
+                                                    <option>2016</option>
+                                                    <option>2015</option>
+                                                    <option>2014</option>
+                                                    <option>...</option>
+                                                </select>
+                                            </div>
+                                        </div>
+                                        <button type="submit" class="btn btn-primary">Apply Filters</button>
+                                    </form>
                                     
-                                    <div class="panel-body">                           
-                                        <table class="table">
+                                    <div class="panel-body" >                           
+                                        <table class="table table-hover">
                                             <thead>
                                                 <tr>
-                                                    <td>Course</td>
-                                                    <td>Section</td>
-                                                    <td>Instructor</td>
-                                                    <td>Session Name</td>
-                                                    <td>Course Page</td>
+                                                    <th>Course</th>
+                                                    <th>Section</th>
+                                                    <th>Instructor</th>
+                                                    <th>Session Name</th>
+                                                    <th>Year</th>
+                                                    <th>Go To</th>
                                                 </tr>
                                             </thead>
                                             <tbody>
@@ -115,16 +140,28 @@
     /* Set up and declare query entity */
     $params = array();
     $options = array( "Scrollable" => 'static' );
-    $query = "  SELECT  CN.[ClassName], TC.[Section], T.[LastName], SN.SessionName, TC.[CoursesID], TC.[InstructorID]
-                FROM [TeachersCourses] as TC, [Teachers] as T, [Class Names] as CN, [Sessions] as Ss, SessionNames as SN
+    /*$old_query = "  SELECT  CN.[ClassName], TC.[Section], T.[LastName], SN.SessionName, TC.[CoursesID], TC.[InstructorID]
+                FROM [Courses] as TC, [Teachers] as T, [Class Names] as CN, [Sessions] as Ss, SessionNames as SN
                 WHERE TC.[ClassNamesID] = CN.[ClassNamesID] AND 
                 TC.[InstructorID] = T.[TeacherID] AND 
                 TC.[SessionID] = Ss.[SessionsID] AND
                 TC.CoursesID in (SELECT [Teachers&ClassesID] from Expressions) AND
                 SN.[SessionsID] = Ss.[SessionSID]
-                ORDER BY Ss.[SessionsID] desc";
-    $stmt = sqlsrv_query($con, $query, $params, $options);
-    if ( !$stmt )
+                ORDER BY Ss.[SessionsID] desc";*/
+    $archivecoursesSQL = "
+    SELECT CT.CourseName, I.InstitutionID, T.LastName, ST.SessionName, SI.Year, C.CourseID, T.TeacherID
+    FROM Courses C, CourseTypes CT, Teachers T, TeachingInstance TI, SessionInstance SI, SessionType ST, Institutions I
+    WHERE CT.CourseTypesID = C.CourseTypesID AND
+          TI.TeachingInstanceID = C.TeachingInstanceID AND
+          T.TeacherID = TI.TeacherID AND
+          SI.SessionInstanceID = C.SessionInstanceID AND
+          ST.SessionTypeID = SI.SessionTypeID AND
+          I.InstitutionID = C.InstitutionID
+    ORDER BY SI.Year
+    "; 
+    
+    $archivecourses = sqlsrv_query($con, $archivecoursesSQL, $params, $options);
+    if ( !$archivecourses )
         die( print_r( sqlsrv_errors(), true));
 
     /* Extract Pagination Paramaters */
@@ -132,7 +169,7 @@
     $rowsPerPage = isset($_GET['pp']) ? $_GET['pp'] : 10; // get rows per page, default = 10
 
 
-    $rowsReturned = sqlsrv_num_rows($stmt);
+    $rowsReturned = sqlsrv_num_rows($archivecourses);
     if($rowsReturned === false)
         die(print_r( sqlsrv_errors(), true));
     elseif($rowsReturned == 0)
@@ -148,11 +185,26 @@
 
     /* Echo results to the page */
     $pageNum = isset($_GET['pageNum']) ? $_GET['pageNum'] : 1;
-    $page = Pagination::getPage($stmt, $pageNum, $rowsPerPage);
+    $page = Pagination::getPage($archivecourses, $pageNum, $rowsPerPage);
     foreach($page as $row)
     {
-        $coursePageLink = "ViewCourse/?courseID=$row[4]";
-        echo "<tr><td>$row[0]</td><td>$row[1]</td><td>$row[2]</td><td>$row[3]</td><td><a href='$coursePageLink'>Course Page</a></td></tr>";
+        $courseID = $row[5];
+        $teacherID = $row[6];
+        echo "<tr><td>$row[0]</td>
+                  <td>$row[1]</td>
+                  <td><form method=\"POST\" action=\"/Admin/Archive/Teachers/ViewTeacher/\">
+                          <input hidden type=\"text\" name=\"teacherID\" value=\"$teacherID\">
+                          <button class=\"btn btn-primary\">$row[2]</button>
+                      </form>
+                  </td>
+                  <td>$row[3]</td>
+                  <td>$row[4]</td>
+                  <td><form method=\"POST\" action=\"/Admin/Archive/Courses/ViewCourse/\">
+                          <input hidden type=\"text\" name=\"courseID\" value=\"$courseID\">
+                          <button class=\"btn btn-primary\">View Course</button>
+                      </form>
+                  </td>
+              </tr>";
     }
 
     echo "</tbody></table><br />";
@@ -169,7 +221,7 @@
                 </div>
             </div>
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script>
diff --git a/admin/Archive/Students/RetrieveStudentNames.php b/admin/Archive/Students/RetrieveStudentNames.php
new file mode 100644
index 0000000..7a486c0
--- /dev/null
+++ b/admin/Archive/Students/RetrieveStudentNames.php
@@ -0,0 +1,69 @@
+<?php
+
+include '../../../base.php';
+
+if(!empty($_POST["keyword"]))
+{
+    $query = "SELECT TOP 8 S.FirstName,S.LastName,min(Y.Year), max(Y.Year), S.ID
+    FROM Students as S, Year as Y, Enrollment as E, Courses as TC, Sessions as Ss 
+    WHERE S.LastName LIKE '" . $_POST["keyword"] . "%' AND 
+          S.ID in (SELECT DISTINCT ES.StudentID FROM Expressions as ES) AND 
+          E.StudentID = S.ID AND
+          TC.CoursesID = E.ClassInstanceID AND
+          Ss.SessionsID = TC.SessionID AND
+          Y.ID = Ss.Year_ID
+    GROUP BY S.FirstName, S.LastName, S.ID";
+    $options = array( "Scrollable" => 'static');
+    $params = array();
+    $stmt = sqlsrv_query($con, $query, $params, $options);
+    if ($stmt === false)
+        die(print_r(sqlsrv_errors(), true));
+    $fnames = [];
+    $lnames = [];
+    $minyears = [];
+    $maxyears = [];
+    $ids = [];
+    while (sqlsrv_fetch($stmt) === true)
+    {
+        $fnames[] = sqlsrv_get_field($stmt, 0);
+        $lnames[] = sqlsrv_get_field($stmt, 1);
+        $minyears[] = sqlsrv_get_field($stmt, 2);
+        $maxyears[] = sqlsrv_get_field($stmt, 3);
+        $ids[] = sqlsrv_get_field($stmt, 4);
+    }
+
+    if(!empty($lnames))
+    {
+        ?>
+<style>
+    span.highlight {
+        background-color: rgb(160,189,81);
+    }
+</style>
+<ul id="names-list" style="max-height:300px;overflow-y:scroll">
+    <?php
+        $i = 0;
+        foreach($lnames as $lname)
+        {
+    ?>
+            
+    <li onClick="selectName('<?=$ids[$i]?>');"><?=$fnames[$i]?> <strong><?=$lname?></strong> <span class="pull-right"><small class="text-muted" style="color:white;right:0px; "><?=$minyears[$i]?> - <?=$maxyears[$i]?></small></span></li>
+        <?php 
+            $i++;
+        }
+        ?>
+    </ul>
+<?php
+    }
+    else
+    {
+        ?>
+<ul id="names-list">
+    <li>There are no matches to your search</li>
+    
+</ul>    
+    <?php
+    }
+}
+
+?>
diff --git a/admin/Archive/Students/ViewStudent/index.php b/admin/Archive/Students/ViewStudent/index.php
index 6a0b42e..843ccbe 100644
--- a/admin/Archive/Students/ViewStudent/index.php
+++ b/admin/Archive/Students/ViewStudent/index.php
@@ -14,9 +14,10 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
 
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
 
     <script>
@@ -28,16 +29,6 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
 
 <?php
@@ -53,42 +44,54 @@
     }
     else
     {
-        $studentID = isset($_GET['studentID']) ? $_GET['studentID'] : 0;
-        if ($studentID == 0)
-            echo "<meta http-equiv='refresh' content=0;../";
+        /*$studentID = isset($_GET['studentID']) ? $_GET['studentID'] : 0;*/
+        if (empty($_POST['sid']))
+            echo "<meta http-equiv='refresh' content=10;../";
         else
         {
+            $studentID = $_POST['sid'];
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
-                                </button>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-10">
+                                <h4>Student Name</h4>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-10">
+                                
                                 <div class="panel panel-primary">
                                     <div class="panel-heading">Student Information</div>
                                     <div class="panel-body">
-                                        <p>Show student info: country, language, history (new data will include number of classes, time frame of activity, etc)</p>
+                                        <p>Institution:</p>
+                                        <p>Joined Smalltalk:</p>
+                                        <p>Number of Courses:</p>
+                                        <p>Language:</p>
                                     </div>
                                 </div>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-10 col-md-10">
                                 <div class="panel panel-primary">
-                                    <div class="panel-heading">Student's Course Listing (sort by most recent)</div>
+                                    <div class="panel-heading">Student Courses</div>
                                     <div class="panel-body">
-                                        <table class="table">
+                                        <table class="table table-hover">
                                             <thead>
                                                 <tr>
-                                                    <td>Course Number</td>
-                                                    <td>Section</td>
-                                                    <td>Instructor Last Name</td>
-                                                    <td>Session Name</td>
-                                                    <td>Course Page</td>
+                                                    <th>Course Number</th>
+                                                    <th>Instructor Last Name</th>
+                                                    <th>Session Name</th>
+                                                    <th>Course Page</th>
                                                 </tr>
                                             </thead>
                                             <tbody>
@@ -99,12 +102,12 @@
 $options = array( "Scrollable" => 'static' );
 $query = 
 "SELECT  CN.[ClassName], TC.[Section], T.[LastName], SN.[SessionName], TC.[CoursesID], T.[TeacherID]
-FROM [TeachersCourses] as TC, Teachers as T, [Class Names] as CN, [Sessions] as Ss, SessionNames as SN
+FROM [Courses] as TC, Teachers as T, [Class Names] as CN, [Sessions] as Ss, SessionNames as SN
 WHERE TC.[ClassNamesID] = CN.[ClassNamesID] AND 
       TC.[InstructorID] = T.[TeacherID] AND 
 	  TC.[SessionID] = Ss.[SessionsID] AND
 	  SN.[SessionsID] = Ss.[SessionsID] AND
-      TC.[CoursesID] in (SELECT DISTINCT OtherExpressions.[Teachers&ClassesID] FROM Expressions as OtherExpressions WHERE OtherExpressions.[Student_ID] = ?)
+      TC.[CoursesID] in (SELECT DISTINCT OtherExpressions.[Teachers&ClassesID] FROM Expressions as OtherExpressions WHERE OtherExpressions.[StudentID] = ?)
 ORDER BY Ss.[SessionsID] desc";
 $stmt = sqlsrv_query($con, $query, $params, $options);
 if ( !$stmt )
@@ -133,13 +136,12 @@
 {
     $coursePageLink = "/Admin/Archive/Courses/ViewCourse/?courseID=$row[4]";
     $teacherPageLink = "/Admin/Archive/Teachers/ViewTeacher/?tid=$row[5]";
-    echo "<tr><td>$row[0]</td><td>$row[1]</td><td><a href='$teacherPageLink''>$row[2]</a></td><td>$row[3]</td><td><a href='$coursePageLink'>Course Page</a></td></tr>";
+    echo "<tr><td>$row[0]</td><td><a href='$teacherPageLink'>$row[2]</a></td><td>$row[3]</td><td><a href='$coursePageLink'>Course Page</a></td></tr>";
 }
 
-echo "</tbody></table><br />";
-
 ?>
-                                            
+                                            </tbody>
+                                        </table>
                                     </div>
                                 </div>
                                 
@@ -149,7 +151,7 @@
                 </div>
             </div>
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script>
diff --git a/admin/Archive/Students/index.php b/admin/Archive/Students/index.php
index d9f48d8..ae56f8d 100644
--- a/admin/Archive/Students/index.php
+++ b/admin/Archive/Students/index.php
@@ -14,9 +14,11 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
 
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -26,17 +28,19 @@
             $("#sidebar").load("/sidebar.php");
         });
     </script>
-
-    <!-- Background Setup -->
     <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
+        #div .bg1
+        {
+            background: url(/Media/circle-loading-gif.gif);
+            background-size: 30px 30px;
         }
+        #names-list{float:left;list-style:none;margin:0;width:100%;padding:0;}
+        #names-list li{padding: 10px;background-color: #8b8b8b; border-bottom:#F0F0F0 1px solid;border-width:#F0F0F0 1px solid;}
+        #names-list li:hover{background: rgba(56, 110, 128, 1);}
     </style>
+    
+    
+
 </head>
 
 <?php
@@ -54,26 +58,47 @@
     {
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <!--<div class="col-lg-10">
+                                                    <input class="form-control" id="search-box" type="text" placeholder="Student Last Name" />
+                                                    <div id="suggesstion-box"></div>
+                                                    
+                                                </div> -->
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
-                                </button>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-8 col-md-10">  
                                 <div class="panel panel-primary">
-                                    <div class="panel-heading">Student Search</div>
+                                    <div class="panel-heading">Search</div>
                                     <div class="panel-body">
-                                        <p>This window will have a search interface for looking up students in the DB. </p>
+                                        <form method="POST" id="searchStudent"  action="ViewStudent/" autocomplete="off">
+                                            <div class="form-group row">
+                                                <div class="col-xs-6">
+                                                    <input class="form-control" id="search-box" name="studentLastName" type="text" placeholder="Student Last Name" />
+                                                    <div id="suggesstion-box"></div>
+                                                    
+                                                </div>
+                                                <input hidden id="sid" name="sid" type="text">
+                                                <input hidden type="submit" value="go">
+
+                                            </div>
+                                            <!--<button type="submit" class="btn btn-primary pull-right">Search</button>-->
+                                        </form>
                                     </div>
                                 </div>
-                                <div class="panel panel-primary">
-                                    <div class="panel-heading">Course Listing (sort by most recent)</div>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-8 col-md-10">
+                                
+                                <div class="panel panel-primary" style="max-height:600px;">
+                                    <div class="panel-heading">Student Archive</div>
                                     
                                     <div class="dropdown">
                                         <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
@@ -81,6 +106,7 @@
                                             <span class="caret"></span>
                                         </button>
                                         <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
+                                            <li><a href="?pp=10">10</a></li>
                                             <li><a href="?pp=50">50</a></li>
                                             <li><a href="?pp=100">100</a></li>
                                             <li><a href="?pp=200">200</a></li>
@@ -89,17 +115,16 @@
                                         </ul>
                                     </div>
                                     <div class="panel-body">
-                                        <table class="table">
+                                        <table class="table table-hover" >
                                             <thead>
                                                 <tr>
-                                                    <td>First Name</td>
-                                                    <td>Last Name</td>
-                                                    <td>Citizenship</td>
-                                                    <!--<td>Language</td>-->
+                                                    <th>First Name</th>
+                                                    <th>Last Name</th>
+                                                    <th>Language</th>
                                                     <!--<td>Joined Site</td>-->
                                                     <!--<td>Last active session</td>-->
-                                                    <td>Link to Student's Page</td>
-                                                    <td>Number of Courses Taken</td>
+                                                    <th>Go To</th>
+                                                    <th>Courses Taken</th>
                                                 </tr>
                                             </thead>
                                             <tbody>
@@ -109,18 +134,24 @@
     $params = array();
     $options = array( "Scrollable" => 'static' );
     $query = 
-"SELECT S.[FirstName], S.[LastName], C.[Country], S.[ID], COUNT(DISTINCT E.[Teachers&ClassesID])
-FROM Students as S, Country as C, Expressions as E
-WHERE C.[ID] = S.[Citizenship] AND
-S.[ID] in (SELECT DISTINCT ES.Student_ID FROM Expressions as ES) AND
-E.[Student_ID] = S.[ID]
-GROUP BY S.[FirstName], S.[LastName], C.[Country], S.[ID]";
+"SELECT S.[FirstName], S.[LastName], L.[Language], S.[ID], COUNT(DISTINCT E.[Teachers&ClassesID])
+FROM Students as S, Expressions as E, Languages as L
+WHERE L.[LanguageID] = S.[Language] AND
+S.[ID] in (SELECT DISTINCT ES.StudentID FROM Expressions as ES) AND
+E.[StudentID] = S.[ID]";
+    /*if (!(empty($_POST['studentLastName'])))
+    {
+        $query = " = ?";
+        $params = array($_POST['studentID']);
+    }*/
+    $query .= " GROUP BY S.[FirstName], S.[LastName], S.[ID], L.Language";
+
     $stmt = sqlsrv_query($con, $query, $params, $options);
     if ( !$stmt )
         die( print_r( sqlsrv_errors(), true));
 
     /* Extract Pagination Paramaters */
-    $rowsPerPage = isset($_GET['pp']) ? $_GET['pp'] : 50; // get rows per page, default = 50
+    $rowsPerPage = isset($_GET['pp']) ? $_GET['pp'] : 10; // get rows per page, default = 50
     $rowsReturned = sqlsrv_num_rows($stmt);
     if($rowsReturned === false)
         die(print_r( sqlsrv_errors(), true));
@@ -145,7 +176,7 @@
     }
 
     echo "</tbody></table><br />";
-    $modulator = 2;
+    $modulator = 4;
     Pagination::pageLinks($numOfPages, $pageNum, $rowsPerPage, $rowsReturned, $modulator);
     ?>
                                             
@@ -158,7 +189,7 @@
                 </div>
             </div>
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script>
@@ -166,6 +197,40 @@
                 e.preventDefault();
                 $("#wrapper").toggleClass("toggled");
             });
+            </script>
+<!--
+            <script src="//code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
+-->
+            <script>
+                // AJAX call for autocomplete 
+            $(document).ready(function(){
+                $("#search-box").keyup(function(){
+                    $.ajax({
+                    type: "POST",
+                    url: "RetrieveStudentNames.php",
+                    data:'keyword='+$(this).val(),
+                    beforeSend: function(){
+                        $("#search-box").css("background", "url(/Media/LoadingIcon.gif)")
+                    },
+                    success: function(data){
+                        
+                        $("#suggesstion-box").show();
+                        $("#suggesstion-box").html(data);
+                        
+                    }
+                    });
+                });
+            });
+            //To select country name
+            function selectName(val) {
+                $("#sid").val(val);
+                $("#searchStudent").submit();
+                $("#suggesstion-box").hide();
+            }
+            
+                
+                
+                
             </script>
         </body> 
         <?php        
diff --git a/admin/Archive/Teachers/ViewTeacher/index.php b/admin/Archive/Teachers/ViewTeacher/index.php
index a232ff4..c5574f0 100644
--- a/admin/Archive/Teachers/ViewTeacher/index.php
+++ b/admin/Archive/Teachers/ViewTeacher/index.php
@@ -14,9 +14,11 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
 
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -27,16 +29,6 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
 
 <?php
@@ -59,18 +51,18 @@
         {
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
                                 </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-4">
+                                
                                 <div class="panel panel-primary">
                                     <div class="panel-heading">Teacher Information</div>
                                     <div class="panel-body">
@@ -90,21 +82,11 @@
             }
             
             
-            $institutionsQuery = "SELECT I.InstitutionName
-            FROM Teachers as T,  TeachingInstance as TI, Institutions as I
-            WHERE T.TeacherID = ? AND
-                  TI.SiteUsername = T.SiteUsername AND
-                  I.InstitutionID = TI.InstitutionID";
-            $stmt = sqlsrv_query( $con, $institutionsQuery, $params, $options);
-            if ($stmt === false)
-                die(print_r(sqlsrv_errors(), true));
-            $institutions = [];
-            while( sqlsrv_fetch($stmt) === true)
-                $institutions[] = sqlsrv_get_field( $stmt, 0);
+            
             
             $firstYearRangeQuery = "
             SELECT min(Y.Year) 
-	        FROM Year as Y, Sessions as Ss, TeachersCourses as TC 
+	        FROM Year as Y, Sessions as Ss, Courses as TC 
 	        WHERE	TC.InstructorID = ? AND
 			        Ss.SessionsID = TC.SessionID AND
 			        Y.ID = Ss.Year_ID";
@@ -118,7 +100,7 @@
 
             $lastYearRangeQuery = "
             SELECT max(Y.Year) 
-	        FROM Year as Y, Sessions as Ss, TeachersCourses as TC 
+	        FROM Year as Y, Sessions as Ss, Courses as TC 
 	        WHERE	TC.InstructorID = ? AND
 			        Ss.SessionsID = TC.SessionID AND
 			        Y.ID = Ss.Year_ID";
@@ -132,24 +114,64 @@
             
             echo "<p>Name: $firstName $lastName</p>";
             echo "<p>Active with Smalltalk from: $firstYear - $lastYear</p>";
-            echo "<p>Institutions: </p>";
-            foreach($institutions as $inst)
-                echo "<p>   $inst</p>";
             
             ?>
                                     </div>
                                 </div>
+                                
+                                
+                            </div>
+                            <div class="col-lg-4">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        Active Institutions
+                                    </div>
+                                    <div class="panel-body">
+                                    <?php
+            $params = array($tid);
+            $options = array( "Scrollable" => 'static');
+            $institutionsQuery = "SELECT I.InstitutionName
+            FROM Teachers as T,  TeachingInstance as TI, Institutions as I
+            WHERE T.TeacherID = ? AND
+                  TI.SiteUsername = T.SiteUsername AND
+                  I.InstitutionID = TI.InstitutionID";
+            $stmt = sqlsrv_query( $con, $institutionsQuery, $params, $options);
+            if ($stmt === false)
+                die(print_r(sqlsrv_errors(), true));
+            $institutions = [];
+            while( sqlsrv_fetch($stmt) === true)
+                $institutions[] = sqlsrv_get_field( $stmt, 0);
+            ?>
+                                    
+                                        <div class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <?php
+                foreach($institutions as $institution)
+                    echo "<td>$institution</td>";
+                ?>
+                                                </tr>
+                                            </thead>
+                                        </div>
+                                        </div>
+                                </div>
+                                
+            
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-8">
                                 <div class="panel panel-primary">
                                     <div class="panel-heading">Teacher's Course Listing (sort by most recent)</div>
                                     <div class="panel-body">
                                         <table class="table">
                                             <thead>
                                                 <tr>
-                                                    <td>Course Number</td>
-                                                    <td>Institution</td>
-                                                    <td>Section</td>
-                                                    <td>Session Name</td>
-                                                    <td>Course Page</td>
+                                                    <th>Course Number</th>
+                                                    <th>Institution</th>
+                                                    <th>Section</th>
+                                                    <th>Session Name</th>
+                                                    <th>Course Page</th>
                                                 </tr>
                                             </thead>
                                             <tbody>
@@ -160,7 +182,7 @@
                                                 $options = array( "Scrollable" => 'static' );
                                                 $query = 
 "SELECT  CN.[ClassName], I.InstitutionName, TC.[Section], SN.[SessionName], TC.[CoursesID]
-FROM [TeachersCourses] as TC, [Teachers] as T, [Class Names] as CN, [Sessions] as Ss, SessionNames as SN, Institutions as I, TeachingInstance as TI
+FROM [Courses] as TC, [Teachers] as T, [Class Names] as CN, [Sessions] as Ss, SessionNames as SN, Institutions as I, TeachingInstance as TI
 WHERE TC.[ClassNamesID] = CN.[ClassNamesID] AND 
       TC.[InstructorID] = T.[TeacherID] AND 
       TC.CoursesID in (SELECT [Teachers&ClassesID] from Expressions) AND
@@ -206,14 +228,13 @@
                                             
                                     </div>
                                 </div>
-                                
                             </div>
                         </div>
                     </div>
                 </div>
             </div>
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script>
diff --git a/admin/Archive/Teachers/index.php b/admin/Archive/Teachers/index.php
index 047e3b6..208c913 100644
--- a/admin/Archive/Teachers/index.php
+++ b/admin/Archive/Teachers/index.php
@@ -14,9 +14,11 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
 
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -27,16 +29,6 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
 
 <?php
@@ -54,26 +46,42 @@
     {
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
-                                </button>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-8 col-md-8">
                                 <div class="panel panel-primary">
-                                    <div class="panel-heading">Teacher Search</div>
+                                    <div class="panel-heading">Filter Results</div>
                                     <div class="panel-body">
-                                        <p>This window will have a search interface for looking up teachers </p>
+                                        <form method="POST" id="filterTeachers" action="">
+                                            <div class="form-group row">
+                                                <div class="col-lg-10">
+                                                    <input class="form-control" id="LastName" type="text" placeholder="Teacher Last Name" />
+                                                    
+                                                </div>
+                                            </div>
+                                            <div class="form-group row">
+                                                <div class="col-lg-10">
+                                                    <input class="form-control" id="Institution" type="text" placeholder="Institution" />
+                                                </div>
+                                            </div>
+                                            <button type="submit" class="btn btn-primary">Apply Filter</button>
+                                        </form>
                                     </div>
                                 </div>
-                                <div class="panel panel-primary">
-                                    <div class="panel-heading">Teacher listing (only SmallTalk contributors, listed alphabetically by last name</div>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-8 col-md-10">
+                                <div class="panel panel-primary" style="max-height:500px;">
+                                    <div class="panel-heading">Teachers</div>
                                     <div class="dropdown">
                                         <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                                             Select rows per page
@@ -87,12 +95,13 @@
                                         </ul>
                                     </div>
                                     <div class="panel-body">
-                                        <table class="table">
+                                        <table class="table table-hover" >
                                             <thead>
                                                 <tr>
-                                                    <td>First Name</td>
-                                                    <td>Last Name</td>
-                                                    <td>Link to Teacher's Page</td>
+                                                    <th>First Name</th>
+                                                    <th>Last Name</th>
+                                                    <th>Site Username</th>
+                                                    <th>Go To</th>
                                                 </tr>
                                             </thead>
                                             <tbody>
@@ -102,7 +111,7 @@
     $params = array();
     $options = array( "Scrollable" => 'static' );
     $query = 
-"SELECT T.[FirstName], T.[LastName], T.[TeacherID]
+"SELECT T.[FirstName], T.[LastName], T.SiteUsername, T.[TeacherID]
 FROM Teachers as T";
     $stmt = sqlsrv_query($con, $query, $params, $options);
     if ( !$stmt )
@@ -129,8 +138,8 @@
     $page = Pagination::getPage($stmt, $pageNum, $rowsPerPage);
     foreach($page as $row)
     {
-        $teacherPageLink = "ViewTeacher/?tid=$row[2]";
-        echo "<tr><td>$row[0]</td><td>$row[1]</td><td><a href='$teacherPageLink'>Visit Page</a></td></tr>";
+        $teacherPageLink = "ViewTeacher/?tid=$row[3]";
+        echo "<tr><td>$row[0]</td><td>$row[1]</td><td>$row[2]</td><td><a href='$teacherPageLink'>Visit Page</a></td></tr>";
     }
 
     echo "</tbody></table><br />";
@@ -147,7 +156,7 @@
                 </div>
             </div>
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script>
diff --git a/admin/Home/Profile/index.php b/admin/Home/Profile/index.php
deleted file mode 100644
index c66a686..0000000
--- a/admin/Home/Profile/index.php
+++ /dev/null
@@ -1,101 +0,0 @@
-<?php include "../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-
-    <!-- Including Header -->
-    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Admin')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-        ?>
-        <body>
-            <div id="header"></div>           
-            <div id="wrapper">
-                <div id="sidebar"></div>
-                <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                                    <span class="hamb-top"></span>
-                                    <span class="hamb-middle"></span>
-                                    <span class="hamb-bottom"></span>
-                                </button>
-                                <h1>Profile View</h1>
-                                <p>Documentation:</p>
-                                <p>Displays info about the admin account.  TBD</p>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-
-            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-            <!-- Include all compiled plugins (below), or include individual files as needed -->
-            <script src="/js/bootstrap.min.js"></script>
-            <script>
-            $("#menu-toggle").click(function(e) {
-                e.preventDefault();
-                $("#wrapper").toggleClass("toggled");
-            });
-            </script>
-        </body> 
-        <?php        
-    }
-}
-
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-
-</html>
diff --git a/admin/Home/index.php b/admin/Home/index.php
index 5465e21..34b2135 100644
--- a/admin/Home/index.php
+++ b/admin/Home/index.php
@@ -12,7 +12,7 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
-
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
 
     <!-- Including Header -->
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
@@ -25,16 +25,7 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
+
 </head>
 
 <?php
@@ -74,23 +65,147 @@
         }
         ?>
         <body>
+<!--
             <div id="header"></div>           
+-->
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
                                 </button>
-                                <h1><?=$_SESSION['FirstName']?> <?=$_SESSION['LastName']?></h1>
-                                <h3><?=$Designation?> Admin for <?=$Institution?></h3>
-                                
-                                
-                                
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-4 col-md-4 col-sm-6">
+                                <div class="panel panel-default">
+                                    <div class="panel-heading">
+                                        <h3>Administrator Home</h3>
+                                    </div>
+                                    <div class="panel-body">
+                                        <p><?=$_SESSION['FirstName']?> <?=$_SESSION['LastName']?></p>
+                                        <p>Role: <?=$Designation?> Admin</p>
+                                        <p>Institution: <?=$Institution?></p>
+                                    </div>
+                                </div> 
+                            </div>
+                        <?php
+    
+        if ($_SESSION['AccessType'] == 'Super')
+        {
+            ?>
+                            <div class="col-lg-4 col-md-4 col-sm-6">
+                                <div class="panel panel-default">
+                                    <div class="panel-heading">
+                                        <h4>All Site Administrators</h4>
+                                    </div>
+                                    <div class="panel-body" style="min-height: 150px; max-height: 150px;">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Institution</th>
+                                                    <th>Name</th>
+                                                    <th>Designation</th>
+                                                </tr>
+                                            </thead>
+                                            
+                                            <?php
+        $params = array();
+        $options = array( "Scrollable" => 'static');
+        $adminsQuery = "
+        SELECT I.InstitutionName, A.FirstName, A.LastName, R.Designation
+        FROM Institutions as I, Administrators as A, RoleInstances as RI, Roles as R
+        WHERE A.RoleInstanceID = RI.RoleInstanceID AND
+              RI.RoleID = R.RoleID AND
+              R.Role = 'Admin' AND
+              I.InstitutionID = A.InstitutionID";
+        $stmt = sqlsrv_query($con, $adminsQuery, $params, $options);
+        if ($stmt === false)
+            die(print_r(sqlsrv_errors(), true));
+        while (sqlsrv_fetch($stmt) === true)
+        {
+            $institution = sqlsrv_get_field($stmt, 0);
+            $fname = sqlsrv_get_field($stmt, 1);
+            $lname = sqlsrv_get_field($stmt, 2);
+            $designation = sqlsrv_get_field($stmt, 3);
+            
+            echo "<tr>";
+            echo "<td>$institution</td>";
+            echo "<td>$fname $lname</td>";
+            echo "<td>$designation</td>";
+        }
+        ?>
+                                                
+                                            <tbody>
+                                                
+                                                
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                            <?php
+                            
+        }
+        ?>
+        
+                            
+                            
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-8 col-md-8 col-sm-10">
+                                <div class="panel panel-default">
+                                    <div class="panel-heading">
+                                        <h4><?=$Institution?> Activity Queue</h4>
+                                    </div>
+                                    <div class="panel-body" style="min-height: 250px;max-height: 250px;">
+                                        <form method="POST" id="filterActivityQueue" action="">
+                                            <div class="form-group row">
+                                                <div class="col-lg-3">
+                                                    <select class="form-control">
+                                                        <option selected="selected">--Author Type--</option>
+                                                        <option>Primary Admin</option>
+                                                        <option>Assistant Admin</option>
+                                                        <option>Graduate Student</option>
+                                                        <option>Teacher</option>
+                                                        <option>Student</option>
+                                                    </select>
+                                                </div>
+                                                <div class="col-lg-3">
+                                                    <select class="form-control" style="display:inline">
+                                                        <option selected="selected">--Action Type--</option>
+                                                        <option>Create</option>
+                                                        <option>Distribute</option>
+                                                        <option>Complete</option>
+                                                        <option>Annotate</option>
+                                                        <option>Insert</option>
+                                                    </select>
+                                                </div>
+                                                <div class="col-lg-3">
+                                                    <select class="form-control">
+                                                        <option selected="selected">--Object Type--</option>
+                                                        <option>Corpus/Archive Expression</option>
+                                                        <option>Worksheet</option>
+                                                        <option>Class</option>
+                                                        <option>User</option>
+                                                    </select>
+                                                </div>
+                                                <button type="submit" class="btn btn-primary">Apply Filter</button>
+                                            </div>
+                                        </form>
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Date</th>
+                                                    <th>Action Name</th>
+                                                    <th>Action Type</th>
+                                                    <th>User</th>
+                                                </tr>
+                                            </thead>
+                                        </table>
+                                    </div>
+                                </div>
                             </div>
                         </div>
                     </div>
@@ -99,7 +214,7 @@
             </div>
 
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script type="text/javascript" src="/js/SidebarPractice.js"></script>
diff --git a/admin/ManageAdmins/ViewAdminProfile/index.php b/admin/ManageAdmins/ViewAdminProfile/index.php
new file mode 100644
index 0000000..eedb39a
--- /dev/null
+++ b/admin/ManageAdmins/ViewAdminProfile/index.php
@@ -0,0 +1,142 @@
+<?php include "../../../base.php"; ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
+
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+</head>
+
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if( !(($_SESSION['Role'] == 'Admin') && ($_SESSION['AccessType'] == 'Super')))    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        ?>
+        <body>
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                                    <span class="hamb-top"></span>
+                                    <span class="hamb-middle"></span>
+                                    <span class="hamb-bottom"></span>
+                    </button>
+                    <div class="container-fluid">
+                        
+                        <div class="row">
+                            <div class="col-lg-10">
+                                <h2>Firstname Lastname</h2>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-4 col-md-4 col-sm-6">
+                                <div class="panel panel-primary" style="min-height:180px;max-height:180px">
+                                    <div class="panel-heading">
+                                        <h3>Admin Information</h3>
+                                    </div>
+                                    <div class="panel-body">
+                                        <p>Institution:</p>
+                                        <p>Joined SmallTalk:</p>
+                                    </div>
+                                </div>   
+                            </div>
+                            
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-10 col-md-10">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        <h3>Admin Activity </h3>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Date</th>
+                                                    <th>Entity Type</th>
+                                                    <th>Institution</th>
+                                                    <th>Action Name</th>
+                                                    <th>Go To</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>1/1/2016</td>
+                                                    <td>Teacher Account</td>
+                                                    <td>Gonzaga University</td>
+                                                    <td>Create</td>
+                                                    <td><a href="/Admin/ManageTeachers/ViewTeacherProfile/">View Teacher</a></td>
+                                                </tr>
+                                                <tr>
+                                                    <td>1/8/2016</td>
+                                                    <td>Course</td>
+                                                    <td>Gonzaga University</td>
+                                                    <td>Create</td>
+                                                    <td><a href="/Admin/ManageCourses/ViewCourse/">View Course</a></td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>   
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <!-- Include all compiled plugins (below), or include individual files as needed -->
+            <script src="/js/bootstrap.min.js"></script>
+            <script src="/js/bootstrap-datepicker.js"></script>
+            <script>
+            $("#menu-toggle").click(function(e) {
+                e.preventDefault();
+                $("#wrapper").toggleClass("toggled");
+            });
+            </script>
+        </body> 
+        <?php        
+    }
+}
+
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/index.php">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/index.php' />
+    <?php
+}
+?>
+
+</html>
diff --git a/admin/ManageAdmins/index.php b/admin/ManageAdmins/index.php
new file mode 100644
index 0000000..c16730c
--- /dev/null
+++ b/admin/ManageAdmins/index.php
@@ -0,0 +1,223 @@
+<?php include "../../base.php"; ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
+
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+</head>
+
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if( !(($_SESSION['Role'] == 'Admin') && ($_SESSION['AccessType'] == 'Super')))
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        $params = array();
+        $options = array( "Scrollable" => 'static');
+        $adminsSQL = "
+        SELECT I.InstitutionName, A.FirstName, A.LastName, A.AdministratorID, R.Designation, CONVERT(VARCHAR(11), SU.date_added, 106)
+        FROM Institutions as I, Administrators as A, RoleInstances as RI, Roles as R, SiteUsers as SU
+        WHERE A.RoleInstanceID = RI.RoleInstanceID AND
+              SU.username = A.SiteUsername AND
+              RI.RoleID = R.RoleID AND
+              R.Role = 'Admin' AND
+              I.InstitutionID = A.InstitutionID";
+        $admins = sqlsrv_query($con, $adminsSQL, $params, $options);
+        if ($admins === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_admins = sqlsrv_num_rows($admins);
+        $institutions = [];
+        $fnames = [];
+        $lnames = [];
+        $adminids = [];
+        $designations = [];
+        $dates = [];
+            
+        while (sqlsrv_fetch($admins) === true)
+        {
+            $institutions[] = sqlsrv_get_field($admins, 0);
+            $fnames[] = sqlsrv_get_field($admins, 1);
+            $lnames[] = sqlsrv_get_field($admins, 2);
+            $adminids[] = sqlsrv_get_field($admins, 3);
+            $designations[] = sqlsrv_get_field($admins, 4);
+            $dates[] = sqlsrv_get_field($admins, 5);
+            
+        }
+        ?>
+        <body>
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                                    <span class="hamb-top"></span>
+                                    <span class="hamb-middle"></span>
+                                    <span class="hamb-bottom"></span>
+                                </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-8">
+                                <h1>Smalltalk Admins</h1>
+                                <h4><small>Superuser Page</small></h4>
+                            </div>
+                            
+
+                        </div>
+                        <div class="row">
+                            <div class="col-md-10">
+                                
+                                <h4><form method="POST" action="/Admin/AddUser/"><button class="btn btn-primary">Create Admin</button></form></h4>
+                                <!--<div class="panel panel-primary">
+                                    <div class="panel-heading">Add New Admin (Manually)</div>
+                                    <div class="panel-body">
+                                         <form method="POST" id="filterActivityQueue" action="">
+                                            <div class="form-group row">
+                                                
+                                                
+                                                <div class="col-lg-4">
+                                                    <input class="form-control" type="text" name="fname" id="fname" placeholder="First Name"><br />
+                                                    <input class="form-control" type="text" name="Email" id="Email" placeholder="School Email"><br />
+                                                </div>
+                                                <div class="col-lg-4">
+                                                    <input class="form-control" type="text" name="lname" id="lame" placeholder="Last Name"><br />
+                                                    
+                                                    <input class="form-control" type="text" name="AltEmail" id="AltEmail" placeholder="Alternate Email"><br />
+                                                </div>
+                                                <div class="col-lg-4">
+                                                    
+                                                <select class="form-control" name="Designation" id="Section">
+                                                    <option selected="selected">--Designation--</option>
+                                                    <option>Primary</option>
+                                                    <option>Developer</option>
+                                                    <option>Other</option>
+                                                </select>
+                                                </div>
+                                                
+                                                
+                                            </div>
+                                             <button class="btn btn-primary pull-right">Add Admin</button>
+                                        </form>
+                                    </div>
+                                </div>-->
+                                
+                                    
+                            </div>
+                            <!--<div class="col-lg-3 col-md-3 col-sm-4">
+                                <div class="panel panel-primary" style="min-height: 225px;max-height: 225px;">
+                                    <div class="panel-heading">Add New Admin (By File)</div>
+                                    <div class="panel-body">
+                                        <form>
+                                             <div class="form-group">
+                                                <input type="file" id="studentListFile">
+                                                <p class="help-block">File format: .csv</p>
+                                                <p class="help-block">Columns (no headers): First Name, Last Name, Email, Alternate Email, Designation</p>
+                                            </div>
+                                            <button type="submit" class="btn btn-primary pull-right">Add Admins</button>
+                                        </form>
+                                    </div>
+                                </div>
+                                
+                                    
+                            </div>-->
+                        </div>
+                        <div class="row">
+                            <div class="col-md-10">
+
+                                <div class="panel panel-primary" style="min-height: 400px; max-height: 400px; ">
+                                    <div class="panel-heading">Admins</div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Institution</th>
+                                                    <th>Name</th>
+                                                    <th>Designation</th>
+                                                    <th>Date Added</th>
+                                                    <th>Visit Page</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+<?php
+        for($i = 0; $i < $num_admins; $i++)
+        {
+            echo "<tr>
+                    <td>$institutions[$i]</td>
+                    <td>$fnames[$i] $lnames[$i]</td>
+                    <td>$designations[$i]</td>
+                    <td>$dates[$i]</td>
+                    <td><form method=\"POST\" action=\"ViewAdmin/\" name=\"admins{$i}\">
+                          <input hidden type=\"text\" name=\"adminID\" value=\"$adminids[$i]\">
+                          <button class=\"btn btn-primary\">View Admin</button>
+                        </form>
+                    </td>
+                  </tr>";
+        }
+?>
+                                                
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                    
+                                </div>
+                                    
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <!-- Include all compiled plugins (below), or include individual files as needed -->
+            <script src="/js/bootstrap.min.js"></script>
+            <script src="/js/bootstrap-datepicker.js"></script>
+            <script>
+            $("#menu-toggle").click(function(e) {
+                e.preventDefault();
+                $("#wrapper").toggleClass("toggled");
+            });
+            </script>
+        </body> 
+        <?php        
+    }
+}
+
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+
+</html>
diff --git a/admin/ManageCorpus/ReviewChanges/index.php b/admin/ManageCorpus/ReviewChanges/index.php
deleted file mode 100644
index 19216b8..0000000
--- a/admin/ManageCorpus/ReviewChanges/index.php
+++ /dev/null
@@ -1,103 +0,0 @@
-<?php include "../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-
-    <!-- Including Header -->
-    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Admin')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-        ?>
-        <body>
-            <div id="header"></div>           
-            <div id="wrapper">
-                <div id="sidebar"></div>
-                <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                                    <span class="hamb-top"></span>
-                                    <span class="hamb-middle"></span>
-                                    <span class="hamb-bottom"></span>
-                                </button>
-                                <h1>Manage Corpus</h1>
-                                <p>Documentation:</p>
-                                <p>Page will manage the transfer of data from the site to the corpus.  There will be a listing of requests, submitted by teachers, that the administrator will have the option to review, and then submit to the database.  This is how we will manage DB writes.
-</p>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-
-            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-            <!-- Include all compiled plugins (below), or include individual files as needed -->
-            <script src="/js/bootstrap.min.js"></script>
-            <script src="/js/bootstrap-datepicker.js"></script>
-            <script>
-            $("#menu-toggle").click(function(e) {
-                e.preventDefault();
-                $("#wrapper").toggleClass("toggled");
-            });
-            </script>
-        </body> 
-        <?php        
-    }
-}
-
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-
-</html>
diff --git a/admin/ManageCorpus/ReviewSubmission/index.php b/admin/ManageCorpus/ReviewSubmission/index.php
new file mode 100644
index 0000000..5e11e80
--- /dev/null
+++ b/admin/ManageCorpus/ReviewSubmission/index.php
@@ -0,0 +1,135 @@
+<?php include "../../../base.php"; ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
+
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+
+</head>
+
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if($_SESSION['Role'] != 'Admin')
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        ?>
+        <body>
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                                    <span class="hamb-top"></span>
+                                    <span class="hamb-middle"></span>
+                                    <span class="hamb-bottom"></span>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-2">
+                                <button class="btn btn-primary" href="../">Approve Worksheet</button>
+                                
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-10 col-md-10">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        <h4>Submission to the corpus</h4>
+                                    </div>
+                                    <div class="panel-body">
+                                        <p>Institution:</p>
+                                        <p>Contributor name:</p>
+                                        <p>Source Class name:</p>
+                                        <p>Worksheet Number:</p>
+                                    </div>
+                                </div>
+                                
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-10 col-md-10">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        <h4>Submitted Expressions</h4>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <td>#</td>
+                                                    <td>Student Name</td>
+                                                    <td>Expression</td>
+                                                    <td>Vocab/Context</td>
+                                                    <td>Pronunciation</td>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                            
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <!-- Include all compiled plugins (below), or include individual files as needed -->
+            <script src="/js/bootstrap.min.js"></script>
+            <script src="/js/bootstrap-datepicker.js"></script>
+            <script>
+            $("#menu-toggle").click(function(e) {
+                e.preventDefault();
+                $("#wrapper").toggleClass("toggled");
+            });
+            </script>
+        </body> 
+        <?php        
+    }
+}
+
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+
+</html>
diff --git a/admin/ManageCorpus/index.php b/admin/ManageCorpus/index.php
index bc04da2..2e21ae5 100644
--- a/admin/ManageCorpus/index.php
+++ b/admin/ManageCorpus/index.php
@@ -12,6 +12,8 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
 
     <!-- Including Header -->
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
@@ -25,16 +27,6 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
 
 <?php
@@ -52,20 +44,98 @@
     {
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                     <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
                                 </button>
-                                <h1>Manage Corpus</h1>
-                                <p>Home for corpus management.  Unique for Gonzaga Admin (James Hunter); for the monitoring of corpus traffic, activity, etc</p>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-4 col-md-4 col-sm-6">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        <h3>Gonzaga Smalltalk Corpus</h3>
+                                    </div>
+                                    <div class="panel-body">
+                                        <p>Date: </p>
+                                        <p>Total Additions This Month:</p>
+                                        <p>From Gonzaga University This Month:</p>
+                                        <p>Expressions in the Corpus:</p>
+                                        <p>Number of Contributors:</p>
+                                        
+                                    </div>
+                                </div>
+                            </div>
+                            
+                            <div class="col-lg-5 col-md-5 col-sm-6">
+                                <div class="panel panel-primary" style="min-height: 310px;max-height: 310px;">
+                                    <div class="panel-heading">
+                                        <h4>Corpus Administrators</h4>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <td>Institution</td>
+                                                    <td>Name</td>
+                                                    <td>Role</td>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>Gonzaga University</td>
+                                                    <td>Fname Lname</td>
+                                                    <td>Graduate Student</td>
+                                                </tr>
+                                            </tbody>
+                                        </table>  
+                                    </div>
+                                </div>
+                            </div> 
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-9 col-md-9">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        <h4>Corpus Additions</h4>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Date</th>
+                                                    <th>Institution</th>
+                                                    <th>Contributor</th>
+                                                    <th>Submission Title</th>
+                                                    <th>Status</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>2/20/16</td>
+                                                    <td>Gonzaga</td>
+                                                    <td>Teacher Name</td>
+                                                    <td><a href="ReviewSubmission/">Worksheet Submission</a></td>
+                                                    <td>Approved</td>
+                                                </tr>
+                                                <tr>
+                                                    <td>2/20/16</td>
+                                                    <td>Gonzaga</td>
+                                                    <td>Teacher Name</td>
+                                                    <td><a href="ReviewSubmission/">Worksheet Submission</a></td>
+                                                    <td><button class="btn btn-primary">Approve</button></td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                            
+                        </div>
+                                
 </p>
                             </div>
                         </div>
@@ -74,13 +144,13 @@
             </div>
 
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script src="/js/bootstrap-datepicker.js"></script>
             <script>
             $("#menu-toggle").click(function(e) {
-                e.preventDefault();
+                e.preventhefault();
                 $("#wrapper").toggleClass("toggled");
             });
             </script>
diff --git a/admin/ManageCourses/CreateCourse/index.php b/admin/ManageCourses/CreateCourse/index.php
deleted file mode 100644
index 8c52b14..0000000
--- a/admin/ManageCourses/CreateCourse/index.php
+++ /dev/null
@@ -1,241 +0,0 @@
-<?php include "../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-
-    <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-
-<?php
-
-    
-    
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Admin')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    
-    elseif(!empty($_POST['session']) && !empty($_POST['year']) && !empty($_POST['section']) && !empty($_POST['teacherlastname']) && !empty($_POST['coursenumber']) && !empty($_POST['CRN']) && !empty($_POST['location']))
-    {
-        //$CourseID = $_POST['courseID'];
-        
-        /* Get POST Variables */
-        $session = $_POST['session'];
-        $year = $_POST['year'];
-        $section = $_POST['section'];
-        $teacherlastname = $_POST['teacherlastname'];
-        $coursenumber = $_POST['coursenumber']; //need to convert to classnameID
-        $CRN = $_POST['CRN'];
-        $location = $_POST['location'];
-        /* End POST Variables */
-        
-        /* Get ID tags for SessionsID (Session->SessionID, Year->YearID) */
-        $query = "SELECT * FROM Session WHERE Session = '". $session."'";
-        $params = array();
-        $options = array( "Scrollable" => SQLSRV_CURSOR_FORWARD );
-        $stmt = sqlsrv_query($con, $query, $params, $options);
-        if( $stmt === false ) {
-            die( print_r( sqlsrv_errors(), true));
-        }
-        $result = sqlsrv_fetch( $stmt );
-        $sessionid = sqlsrv_get_field( $stmt, 1);
-
-        $queryyear = "SELECT * FROM Year WHERE Year = '". $year."'";
-        $stmtyear = sqlsrv_query($con, $queryyear, $params, $options);
-        if ($stmtyear === false ) {
-            die( print_r( sqlsrv_errors(), true));
-        }
-        $result = sqlsrv_fetch( $stmtyear );
-        $yearid = sqlsrv_get_field( $stmtyear, 1);
-        
-        
-        $sessionsquery = "SELECT * FROM Sessions WHERE Session_ID = '". $sessionid."' AND Year_ID = '". $yearid."'";
-        $stmtsessions = sqlsrv_query($con, $sessionsquery, $params, $options);
-        if ($stmtsessions === false ) {
-            die( print_r( sqlsrv_errors(), true));
-        }
-        $result = sqlsrv_fetch( $stmtsessions );
-        $sessionsid = sqlsrv_get_field( $stmtsessions, 0);
-        //echo "\n$sessionsid";
-        
-        $classnamequery = "SELECT * FROM [Class Names] WHERE [Course #] = '". $coursenumber."'";
-        $stmt = sqlsrv_query($con, $classnamequery, $params, $options);
-        if ($stmt === false) {
-            die( print_r(sqlsrv_errors(), true));
-        }
-        $result = sqlsrv_fetch( $stmt );
-        $classnamesid = sqlsrv_get_field($stmt, 0);
-        //echo "\n$classnamesid";
-        
-        $teacherquery = "SELECT * FROM [Advisor] WHERE [Advisor] = '". $teacherlastname."'";
-        $stmt = sqlsrv_query($con, $teacherquery, $params, $options);
-        if ($stmt === false) {
-            die( print_r(sqlsrv_errors(), true));
-        }
-        $result = sqlsrv_fetch( $stmt );
-        $teachernameid = sqlsrv_get_field($stmt, 0);
-        //echo "\n$teachernameid";
-        
-        $maxquery = "SELECT MAX([Teachers&ClassesID]) AS Max_ID FROM [Teachers&Classes]";
-        $stmt = sqlsrv_query($con, $maxquery, $params, $options);
-        if ($stmt === false) {
-            die( print_r(sqlsrv_errors(), true));
-        }
-        $result = sqlsrv_fetch( $stmt );
-        $max_ID = sqlsrv_get_field( $stmt, 0);
-        $TCid = $max_ID + 4;
-        //echo "\n$TCid";
-        
-        /*$insertquery = "INSERT INTO [Teachers&Classes] ([Teachers&ClassesID], CRN, ClassNamesID, Section, Instructor, SessionID, Location) VALUES ('$TCid', '$CRN', '$classnamesid', '$section','$teachernameid', '$sessionsid', '$location')";
-        $insertstmt = sqlsrv_query( $con, $insertquery, $params, $options );
-        if ($insertstmt === false)
-        {
-            die( print_r(sqlsrv_errors(), true));
-        }
-        echo "Added column to Teacher&Classes";
-        echo "<meta http-equiv='refresh' content='3;/admin/home/' />";
-        */
-        
-    }
-    else
-    {
-        ?>
-        <body>
-            <div id="header"></div>           
-            <div id="wrapper">
-                <div id="sidebar"></div>
-                <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                                    <span class="hamb-top"></span>
-                                    <span class="hamb-middle"></span>
-                                    <span class="hamb-bottom"></span>
-                                </button>
-                                <h1><?=$_SESSION['FirstName']?> <?=$_SESSION['LastName']?></h1>
-                                <p>Documentation:</p>
-                                <p>Create Course window.  Form submission for: session, year, section, instructor, class, CRN, location.  All these create Teachers&ClassesID. Submits to the DB.  </p>
-                                <p>Form objects:  </p>
-                                <p>Choose Session (Fall I, Fall II, Summer I, Summer II, Fall I, Fall II)</p>
-                                <p>Choose Year (CurrentYear + 5/4/3/2/1, CurrentYear)</p>
-                                <p>Choose Session (1,2)</p>
-                                <p>Choose Instructor [Dropdown/LiveSearch]</p>
-                                <p>Choose Class Name [Dropdown]</p>
-                                <p>CRN [Text] [Optional]</p>
-                                <p>Location [Text] [Optional</p>
-                                <p>Generate Teachers&ClassesID unique from table</p>
-                                <br>
-                                <p>Database Connection Steps:</p>
-                                <p> 1.)Generate SessionsID from Session and Year. </p>
-                                <p> 2.)Generate new Teachers&ClassesID via DB query</p>
-                                <p> 3.)Write new query</p>
-                                
-                                <form method="post" action="" name="getSession" id="getSession">
-                                    <fieldset>
-                                        <label for="session">Session:</label>
-                                        <select id="session" name="session">
-                                            <option value="Spring I">Spring I</option>
-                                            <option value="Spring II">Spring II</option>
-                                            <option value="Summer I">Summer I</option>
-                                            <option value="Summer II">Summer II</option>
-                                            <option value="Fall I">Fall I</option>
-                                            <option value="Fall II">Fall II</option>
-                                        </select><br>
-                                        <label for="year">Year:</label>
-                                        <select id="year" name="year">
-                                            <option value="2016">2016</option>
-                                            <option value="2017">2017</option>
-                                            <option value="2018">2018</option>
-                                            <option value="2019">2019</option>
-                                            <option value="2020">2020</option>
-                                        </select><br>
-                                        <label for="section">Section</label>
-                                        <select id="section" name="section">
-                                            <option value="1">1</option>
-                                            <option value="2">2</option>
-                                        </select><br>
-                                        <label for="teacherlastname">Teacher's Last Name:</label>
-                                        <input type="text" name="teacherlastname" id="teacherlastname"><br>
-                                        <label for="coursenumber">Classname:</label>
-                                        <input type="text" name="coursenumber" id="coursenumber"><br>
-                                        <label for="CRN">CRN:</label>
-                                        <input type="text" name="CRN" id="CRN"><br>
-                                        <label for="location">Location:</label>
-                                        <input type="text" name="location" id="location"><br>
-                                        
-                                        <button class="button" type="submit">Submit</button>
-                                    </fieldset>
-                                </form>
-                                
-                                
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-            </div>
-
-            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-            <!-- Include all compiled plugins (below), or include individual files as needed -->
-            <script src="/js/bootstrap.min.js"></script>
-            <script>
-            $("#menu-toggle").click(function(e) {
-                e.preventDefault();
-                $("#wrapper").toggleClass("toggled");
-            });
-            </script>
-        </body> 
-        <?php        
-    }
-}
-
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-
-</html>
diff --git a/admin/ManageCourses/CreateNewCourse.php b/admin/ManageCourses/CreateNewCourse.php
new file mode 100644
index 0000000..e8e138b
--- /dev/null
+++ b/admin/ManageCourses/CreateNewCourse.php
@@ -0,0 +1,25 @@
+<?php
+
+include '../../base.php';
+
+if ( (isset($_POST['institutionID'])) && (isset($_POST['sessionID'])) && (isset($_POST['coursetypeID'])) && (isset($_POST['section'])) && (isset($_POST['teacherID'])) )
+{
+    $institutionID = $_POST['institutionID'];
+    $sessionID = $_POST['sessionID'];
+    $coursetypeID = $_POST['coursetypeID'];
+    $section = $_POST['section'];
+    $teacherID = $_POST['teacherID'];
+    
+    
+    $params = array($institutionID, $sessionID, $coursetypeID, $section, $teacherID);
+    $options = array( "Scrollable" => 'static' );
+    
+    $createcourseSQL = "INSERT INTO Courses (CourseTypesID, SessionInstanceID, InstitutionID, TeachingInstanceID, Section, Status)
+                        VALUES (?,?,?,?,?,'Active')";
+    $createcourse = sqlsrv_query($con, $createcourseSQL, $params, $options);
+    if ($createcourse === false)
+        die(print_r(sqlsrv_errors(), true));
+}
+else
+    echo "No data";
+?>
\ No newline at end of file
diff --git a/admin/ManageCourses/ViewCourse/index.php b/admin/ManageCourses/ViewCourse/index.php
index 4de1126..8059cf7 100644
--- a/admin/ManageCourses/ViewCourse/index.php
+++ b/admin/ManageCourses/ViewCourse/index.php
@@ -12,7 +12,8 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
-
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
+    
     <!-- Including Header -->
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
@@ -25,16 +26,6 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
 
 <?php
@@ -53,31 +44,63 @@
     {
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
-                                </button>
-                                <h1><?=$_SESSION['FirstName']?> <?=$_SESSION['LastName']?></h1>
-                                <p>Documentation:</p>
-                                <p>Course view for admin user. Displays: teacher, student list, course name, location, and any other information</p>
-                                
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-4 col-md-4 col-sm-6">
+                                <div class="panel panel-primary" style="min-height: 200px; max-height: 200px;">
+                                    <div class="panel-heading">
+                                        Course Info
+                                    </div>
+                                    <div class="panel-body">
+                                        <p>Institution:</p>
+                                        <p>Course Number:</p>
+                                        <p>Course Name:</p>
+                                        <p>Teacher:</p>
+                                        <p>Session:</p>
+                                        <p>Created By:</p>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-lg-4 col-md-4 col-sm-6">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        Students
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Name</th>
+                                                    <th>Go To</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>Stu Dent</td>
+                                                    <td><a href="/Admin/Archive/ManageStudents/ViewStudent/?sid=">Student Page</a></td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
                             </div>
                         </div>
+                    
                     </div>
                 </div>
 
             </div>
 
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script>
diff --git a/admin/ManageCourses/index.php b/admin/ManageCourses/index.php
index b2e4320..4483d96 100644
--- a/admin/ManageCourses/index.php
+++ b/admin/ManageCourses/index.php
@@ -13,29 +13,19 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
 
     <!-- Including Header -->
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script type="text/javascript" src="/js/CreateNewCourse.js"></script>
     <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
+        
         $(function(){
             $("#sidebar").load("/sidebar.php");
         });
     </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
 
 <?php
@@ -51,34 +41,212 @@
     }
     else
     {
+        $params = array($_SESSION['Username']);
+        $options = array( "Scrollable" => 'static' );
+        $institutionSQL = "SELECT I.InstitutionID FROM Institutions as I, Administrators as A
+                           WHERE A.SiteUsername = ? AND
+                                 I.InstitutionID = A.InstitutionID";
+        $institution = sqlsrv_query($con, $institutionSQL, $params, $options);
+        if ($institution === false)
+            die(print_r(sqlsrv_errors(), true));
+        if (sqlsrv_fetch($institution) === true)
+            $institutionID = sqlsrv_get_field($institution, 0);
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
-                                </button>
-                                <h1>Courses Listing</h1>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-10 col-md-10 col-sm-10 col-xs-10">
+                                <h1>Courses</h1>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-8 col-md-8 col-sm-10">
                                 <div class="panel panel-primary">
-                                    <div class="panel-heading">Documentation</div>
+                                    <div class="panel-heading">Add New Course</div>
                                     <div class="panel-body">
-                                        <p>Courses view for admin user.  Displays list of courses, as well as a button at the top to navigate to CreateCourse.  Each element in the list is a link to a ViewCourse page, which submits a form. </p>
+                                         <form method="POST" id="filterActivityQueue" action="">
+                                            <div class="form-group row">
+                                                <div class="col-lg-3">
+                                                    <select class="form-control" name="institution">
+                                                        <option selected="selected" value="0">--Institution--</option>
+                                                        <option value="1">Gonzaga University</option>
+                                                    </select>
+                                                </div>
+                                                <div class="col-lg-3">
+                                                    <select class="form-control" name="session">
+                                                        <option selected="selected" value="0">--Session--</option>
+<?php   
+        $params = array();
+        $options = array( "Scrollable" => 'static' );
+        $sessionsSQL = "SELECT TOP 6 SI.SessionInstanceID, SI.Year, ST.SessionName
+                        FROM SessionInstance SI, SessionType ST
+                        WHERE ST.SessionTypeID = SI.SessionTypeID
+                        ORDER BY SI.Year DESC";
+        $sessions = sqlsrv_query($con, $sessionsSQL, $params, $options);
+        if ($sessions === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_sessions = sqlsrv_num_rows($sessions);
+        $ids = [];
+        $years = [];
+        $session_names = [];
+        while (sqlsrv_fetch($sessions) === true)
+        {
+            $ids[] = sqlsrv_get_field($sessions, 0);
+            $years[] = sqlsrv_get_field($sessions, 1);
+            $session_names[] = sqlsrv_get_field($sessions, 2);
+        }
+        for ($i = 0; $i < $num_sessions; $i++)
+            echo "<option value=\"$ids[$i]\">$session_names[$i] $years[$i]</option>";
+?>                                      
+                                                    
+                                                    </select>
+                                                </div>
+                                                <div class="col-lg-3">
+                                                    <select class="form-control" name="coursename" >
+                                                        <option selected="selected" value="0">--Course Number--</option>
+<?php                                                      
+        $params = array();
+        $options = array( "Scrollable" => 'static' );
+        $coursetypesSQL = "SELECT CourseTypesID, CourseName FROM CourseTypes ORDER BY CourseTypesID";
+        $coursetypes = sqlsrv_query($con, $coursetypesSQL, $params, $options);
+        if ($coursetypes === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_course_types = sqlsrv_num_rows($coursetypes);
+        $ids = [];
+        $levels = [];
+        while (sqlsrv_fetch($coursetypes) === true)
+        {
+            $ids[] = sqlsrv_get_field($coursetypes, 0);
+            $levels[] = sqlsrv_get_field($coursetypes, 1);
+        }
+        for ($i = 0; $i < $num_course_types; $i++)
+            echo "<option value=\"$ids[$i]\">$levels[$i]</option>";
+?>
+                                                    </select>
+                                                </div>
+                                                <div class="col-lg-3">
+                                                    <select class="form-control" name="section" id="section">
+                                                        <option selected="selected" value="0">--Section--</option>
+                                                        <option value="1">1</option>
+                                                        <option value="2">2</option>
+                                                    </select>
+                                                </div>
+                                                
+                                                
+                                                
+                                            </div>
+                                             <div class="form-group row" style="padding-right: 15px;">
+                                                 <div class="col-lg-9">
+                                                     <select class="form-control" name="teacherid" >
+                                                        <option selected="selected" value="0">
+<?php
+        $params = array($institutionID);
+        $options = array( "Scrollable" => 'static' );
+        $teachersSQL = "SELECT TI.TeachingInstanceID, T.FirstName, T.LastName 
+                        FROM TeachingInstance as TI, Teachers as T
+                        WHERE TI.InstitutionID = ? AND
+                              T.TeacherID = TI.TeacherID
+                        ORDER BY T.LastName, T.FirstName";
+        $teachers = sqlsrv_query($con, $teachersSQL, $params, $options);
+        if ($teachers === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_teachers = sqlsrv_num_rows($teachers);
+        $ids = [];
+        $firstnames = [];
+        $lastnames = [];
+        while (sqlsrv_fetch($teachers) === true)
+        {
+            $ids[] = sqlsrv_get_field($teachers, 0);
+            $firstnames[] = sqlsrv_get_field($teachers, 1);
+            $lastnames[] = sqlsrv_get_field($teachers, 2);
+        }
+        for ($i = 0; $i < $num_teachers; $i++)
+            echo "<option value=\"$ids[$i]\">$firstnames[$i] $lastnames[$i]</option>";
+?>
+                                                         
+                                                        </option>
+                                                     </select>
+                                                 </div>
+                                                    <button type="button" name="CreateCourse" class="btn btn-primary pull-right">Create Course</button>
+                                             </div>
+                                             
+                                        </form>
                                     </div>
-                                </div>
+                                </div>       
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-8 col-md-8 col-sm-10">
                                 <div class="panel panel-primary">
-                                    <div class="panel-heading">Documentation</div>
-                                    <table class="table">
-                                        
-                                    </table>
-                                </div>
+                                    <div class="panel-heading">Active Courses</div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <td>Institution</td>
+                                                    <td>Session Name</td>
+                                                    <td>Course Name</td> <!-- Link to page -->
+                                                    <td>Section</td>
+                                                    <td>Teacher Name</td> <!-- Link to page -->
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+<?php
+        $params = array();
+        $options = array( "Scrollable" => 'static' );
+        $coursesSQL = "SELECT I.InstitutionName, ST.SessionName, SI.Year, CT.CourseName, C.Section, T.FirstName, T.LastName
+                       FROM Institutions I, SessionType ST, SessionInstance SI, CourseTypes CT, Courses C, TeachingInstance TI, Teachers T
+                       WHERE C.Status = 'Active' AND
+                             CT.CourseTypesID = C.CourseTypesID AND
+                             TI.TeachingInstanceID = C.TeachingInstanceID AND
+                             T.TeacherID = TI.TeacherID AND
+                             I.InstitutionID = TI.InstitutionID AND
+                             SI.SessionInstanceID = C.SessionInstanceID AND
+                             ST.SessionTypeID = SI.SessionTypeID
+                             ORDER BY CourseID DESC";
+        $courses = sqlsrv_query($con, $coursesSQL, $params, $options);
+        if ($courses === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_courses = sqlsrv_num_rows($courses);
+        $institutions = [];
+        $session_names = [];
+        $years = [];
+        $course_names = [];
+        $sections = [];
+        $teacher_firstnames = [];
+        $teacher_lastnames = [];
+        while(sqlsrv_fetch($courses) === true)
+        {
+            $institutions[] = sqlsrv_get_field($courses, 0);
+            $session_names[] = sqlsrv_get_field($courses, 1);
+            $years[] = sqlsrv_get_field($courses, 2);
+            $course_names[] = sqlsrv_get_field($courses, 3);
+            $sections[] = sqlsrv_get_field($courses, 4);
+            $teacher_firstnames[] = sqlsrv_get_field($courses, 5);
+            $teacher_lastnames[] = sqlsrv_get_field($courses, 6);
+        }
+        for ($i = 0; $i < $num_courses; $i++)
+        {
+            echo "<tr><td>$institutions[$i]</td>
+                      <td>$session_names[$i] $years[$i]</td>
+                      <td>$course_names[$i]</td>
+                      <td>$sections[$i]</td>
+                      <td>$teacher_firstnames[$i] $teacher_lastnames[$i]</td></tr>";
+        }
+?>
+                                            </tbody>
+                                        </table>
+                                    </div>
                                     
+                                </div>
                             </div>
                         </div>
                     </div>
@@ -87,7 +255,7 @@
             </div>
 
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script>
diff --git a/admin/ManageInstitutions/ViewInstitution/index.php b/admin/ManageInstitutions/ViewInstitution/index.php
new file mode 100644
index 0000000..3a4eb30
--- /dev/null
+++ b/admin/ManageInstitutions/ViewInstitution/index.php
@@ -0,0 +1,200 @@
+<?php include "../../../base.php"; ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/css/bootstrap/bootstrap-editable.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script src="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.4.6/bootstrap-editable/js/bootstrap-editable.min.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+
+</head>
+
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if( (!( ($_SESSION['Role'] == 'Admin') && $_SESSION['AccessType'] == 'Super')) && (!( ($_SESSION['Role'] == 'Admin') && $_SESSION['Designation'] == 'Developer')))
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        $username = $_SESSION['Username'];
+        $role = $_SESSION['Role'];
+        $params = array( $username, $username);
+        $options = array( "Scrollable" => 'static' );
+        $UserInfoQuery = "
+        SELECT R.Designation, I.InstitutionName
+        FROM RoleInstances as RI, Roles as R, Administrators as A, Institutions as I
+        WHERE  RI.SiteUsername = ? AND
+	           R.RoleID = RI.RoleID AND
+		       R.Role = 'Admin' AND
+		       A.SiteUsername = ? AND
+		       I.InstitutionID = A.InstitutionID";
+        $stmt = sqlsrv_query($con, $UserInfoQuery, $params, $options);
+        if ( $stmt === false)
+            die( print_r( sqlsrv_errors(), true));
+        $Designation = "";
+        $Institution = "";
+        if ( sqlsrv_fetch( $stmt ) === true)
+        {
+            $Designation = sqlsrv_get_field( $stmt, 0);
+            $Institution = sqlsrv_get_field( $stmt, 1);
+        }
+        ?>
+        <body>
+
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                        <span class="hamb-top"></span>
+                        <span class="hamb-middle"></span>
+                        <span class="hamb-bottom"></span>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-3 col-md-4">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        <h3>Gonzaga University</h3>
+                                    </div>
+                                    <div class="panel-body">
+                                        <p>City:</p>
+                                        <p>State:</p>
+                                        <p>Country:</p>
+                                        
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-lg-5 col-md-6">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        Teachers
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Name</th>
+                                                    <th>Go To</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>James Hunter</td>
+                                                    <td><a href="/Admin/ManageTeachers/ViewTeacherProfile/">Teacher Page</a></td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-6 col-md-6 col-xs-10">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        Term Sessions
+                                    </div>
+                                    <div class="panel-body">
+                                        <a href="#" id="username" data-type="text" data-placement="right" data-title="Enter username" class="editable editable-click" data-original-title="" title="">superuser</a>
+                                        
+                                        
+                                        <table class="table table-hover" id="institutions">
+                                            <thead>
+                                                <tr>
+                                                    <th>Session Name</th>
+                                                    <th>Default Start</th>
+                                                    <th>Default End</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>Fall I</td>
+                                                    <td><a href="#" data-pk="1">September 1</a></td>
+                                                    <td><a href="#" data-pk="2">October 20</a></td>
+                                                </tr>
+                                                <tr>
+                                                    <td>Fall II</td>
+                                                    <td><a href="#" data-pk="4">October 21</a></td>
+                                                    <td><a href="#" data-pk="3">December 14</a></td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+            </div>
+
+            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <!-- Include all compiled plugins (below), or include individual files as needed -->
+            <script src="/js/bootstrap.min.js"></script>
+            <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+            
+            <script src="/js/bootstrap-editable.js"></script>
+            <script>
+            $("#menu-toggle").click(function(e) {
+                e.preventDefault();
+                $("#wrapper").toggleClass("toggled");
+            });
+            </script>
+            <script type="text/javascript">
+            $('#institutions a').editable({
+                type: 'select',
+                name: 'date',
+                url: '/post',
+                title: 'Enter date'
+            });
+
+            //ajax emulation
+            $.mockjax({
+                url: '/post',
+                responseTime: 200
+            }); 
+            </script>
+        </body> 
+        <?php        
+    }
+}
+
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+
+</html>
diff --git a/admin/ManageInstitutions/index.php b/admin/ManageInstitutions/index.php
new file mode 100644
index 0000000..026a7d8
--- /dev/null
+++ b/admin/ManageInstitutions/index.php
@@ -0,0 +1,188 @@
+<?php include "../../base.php"; ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+
+</head>
+
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if( !( ($_SESSION['Role'] == 'Admin') && $_SESSION['AccessType'] == 'Super'))
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        ?>
+        <body>
+
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                                    <span class="hamb-top"></span>
+                                    <span class="hamb-middle"></span>
+                                    <span class="hamb-bottom"></span>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-8 col-md-10">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        <h3>Add Institution</h3>
+                                    </div>
+                                    <div class="panel-body">
+                                        <form method="POST" id="NewInstitution" name="NewInstitution" action="">
+                                            <label for="Name">Institution Name and Location</label>
+                                            <div class="form-group row">
+                                                <div class="col-lg-6 col-md-8 col-sm-8">
+                                                    <input type="text" class="form-control" id="Name" name="Name" placeholder="Name" />
+                                                </div>
+                                            </div>
+                                            <div class="form-group row">
+                                                <div class="col-lg-3 col-md-4 col-sm-4">
+                                                    <input type="text" class="form-control" id="City" name="City" placeholder="City" />
+                                                </div>
+                                                <div class="col-lg-3 col-md-4 col-sm-4">
+                                                    <input type="text" class="form-control" id="StateRegionProvince" name="StateRegionProvince" placeholder="State/Region/Province" />
+                                                </div>
+                                                <div class="col-lg-3 col-md-4 col-sm-4">
+                                                    <input type="text" class="form-control" id="Country" name="Country" placeholder="Country" />
+                                                </div>
+                                            </div>
+                                            <div class="divider"></div>
+                                            <label for="NumTerms">Enter the number of terms in a year and enter their names (Spring I, Fall, Winter II, etc)</label>
+                                            <div class="form-group row">
+                                                <div class="col-lg-3 col-md-4 col-sm-4 col-xs-8">
+                                                    <select class="form-control" name="NumTerms" id="NumTerms" onchange="addFields();">
+                                                        <option selected="selected">--Number of Terms--</option>
+                                                        <option value="1">1</option>
+                                                        <option value="2">2</option>
+                                                        <option value="3">3</option>
+                                                        <option value="4">4</option>
+                                                        <option value="5">5</option>
+                                                        <option value="6">6</option>
+                                                        <option value="7">7</option>
+                                                        <option value="8">8</option>
+                                                    </select>
+                              
+                                                </div>
+                                                <div class="col-lg-9 col-md-8 col-sm-8 col-xs-10" id="TermContainer">
+                                                </div>
+                                            </div>
+                                            <button class="btn btn-primary pull-right" type="submit">Create Institution</button>
+                                        </form>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-8 col-md-10">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        <h3>Institutions</h3>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Name</th>
+                                                    <th>Location</th>
+                                                    <th>Number of Teachers</th>
+                                                    <th>Active Courses</th>
+                                                    <th>Go To</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>Gonzaga University</td>
+                                                    <td>Spokane, WA, USA</td>
+                                                    <td>32</td>
+                                                    <td>5</td>
+                                                    <td><a href="ViewInstitution/">View/Edit</a></td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+            </div>
+
+            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <!-- Include all compiled plugins (below), or include individual files as needed -->
+            <script src="/js/bootstrap.min.js"></script>
+            <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+            <script>
+            $("#menu-toggle").click(function(e) {
+                e.preventDefault();
+                $("#wrapper").toggleClass("toggled");
+            });
+            </script>
+            <script type="text/javascript">
+            function addFields(){
+                var number = document.getElementById("NumTerms").value;
+                var container = document.getElementById("TermContainer");
+                while (container.hasChildNodes()) {
+                    container.removeChild(container.lastChild);
+                }
+                for (i=1;i<=number;i++){
+                    var input = document.createElement("input");
+                    input.type = "text";
+                    input.className = "form-control";
+                    input.name = "term" + i;
+                    input.id = "term" + i;
+                    input.placeholder = "Enter Term " + i;
+                    container.appendChild(input);
+                    //container.appendChild(document.createElement("br"));
+                }  
+            }
+            </script>
+        </body> 
+        <?php        
+    }
+}
+
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+
+</html>
diff --git a/admin/ManageStudents/CreateStudent/index.php b/admin/ManageStudents/CreateStudent/index.php
deleted file mode 100644
index 2568b4b..0000000
--- a/admin/ManageStudents/CreateStudent/index.php
+++ /dev/null
@@ -1,101 +0,0 @@
-<?php include "../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-
-    <!-- Including Header -->
-    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Admin')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-        ?>
-        <body>
-            <div id="header"></div>           
-            <div id="wrapper">
-                <div id="sidebar"></div>
-                <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                                    <span class="hamb-top"></span>
-                                    <span class="hamb-middle"></span>
-                                    <span class="hamb-bottom"></span>
-                                </button>
-                                <h1><?=$_SESSION['FirstName']?> <?=$_SESSION['LastName']?></h1>
-                                <p>Register a new student account.  Input form: First name, last name, username, default password, school email</p>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-            </div>
-
-            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-            <!-- Include all compiled plugins (below), or include individual files as needed -->
-            <script src="/js/bootstrap.min.js"></script>
-            <script>
-            $("#menu-toggle").click(function(e) {
-                e.preventDefault();
-                $("#wrapper").toggleClass("toggled");
-            });
-            </script>
-        </body> 
-        <?php        
-    }
-}
-
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-
-</html>
diff --git a/admin/ManageStudents/ViewStudentProfile/index.php b/admin/ManageStudents/ViewStudentProfile/index.php
index 6f8266f..a1846a6 100644
--- a/admin/ManageStudents/ViewStudentProfile/index.php
+++ b/admin/ManageStudents/ViewStudentProfile/index.php
@@ -13,6 +13,9 @@
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet">
+    
+    
     <!-- Including Header -->
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
@@ -25,16 +28,7 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
+    
 </head>
 
 <?php
@@ -52,21 +46,104 @@
     {
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
-                                </button>
-                                <h1>View Student Account</h1>
-                            <p>Documentation:</p>
-                            <p>After accepting a form submission from ManageStudents, this page will display the profile of a given student user</p>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-10">        
+                                <h1>Stu D. Ent</h1>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-3 col-md-3 col-sm-4">        
+                                <div class="panel panel-primary" style="min-height: 280px;">
+                                    <div class="panel-heading">
+                                        <h4>Student Info</h4>
+                                    </div>
+                                    <div class="panel-body">
+                                        <p>Active Courses:</p>
+                                        <p>Total Courses:</p>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-lg-7 col-md-7 col-sm-8"> 
+                                <div class="panel panel-primary" style="min-height: 280px;max-height: 280px;">
+                                    <div class="panel-heading">
+                                        <h4>Recent Courses</h4>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Course Number</th>
+                                                    <th>Session</th>
+                                                    <th>Status</th>
+                                                    <th>Percent Complete</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>ELCT 102</td>
+                                                    <td>Fall II 2012</td>
+                                                    <td>Complete</td>
+                                                    <td><div class="progress">
+                                    <div class="progress-bar progress-bar-info" style="width: 100%"></div>
+                                </div></td>
+
+                                                </tr>
+                                                <tr>
+                                                    <td>ELCT 103</td>
+                                                    <td>Spring I 2013</td>
+                                                    <td>Partial</td>
+                                                    <td><div class="progress">
+                                    <div class="progress-bar progress-bar-info" style="width: 20%"></div>
+                                </div></td>
+
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <div class="row">
+                            <div class="col-lg-10 col-md-10">        
+                                <div class="panel panel-primary" style="min-height: 400px;max-height: 400px; ">
+                                    <div class="panel-heading">
+                                        <h3>Completed Worksheets</h3>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Course Number</th>
+                                                    <th>Course Name</th>
+                                                    <th>Session</th>
+                                                    <th>Worksheet Number</th>
+                                                    <th>Performance</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>ELCT 101</td>
+                                                    <td>Basic Oral Communication</td>
+                                                    <td>Fall II 2014</td>
+                                                    <td>5</td>
+                                                    <td><div class="progress">
+                                    <div class="progress-bar progress-bar-info" style="width: 20%"></div>
+                                </div></td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
                             </div>
                         </div>
                     </div>
@@ -74,7 +151,7 @@
             </div>
 
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script src="/js/bootstrap-datepicker.js"></script>
diff --git a/admin/ManageStudents/index.php b/admin/ManageStudents/index.php
index cd71b1e..3045a86 100644
--- a/admin/ManageStudents/index.php
+++ b/admin/ManageStudents/index.php
@@ -12,6 +12,7 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
 
     <!-- Including Header -->
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
@@ -25,16 +26,6 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
 
 <?php
@@ -52,21 +43,108 @@
     {
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
-                                </button>
-                                <h1>Manage Student Accounts</h1>
-                                <p>Documentation:</p>
-                                <p>Page will provide search functionality and student profile view, for reviewing of accounts.  Provides a field for creating a student account.  Potentially will involve an option for inputing account info en masse, i.e. via a file</p>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-10 col-md-10 col-sm-10 col-xs-10">
+                                <h1>Gonzaga University Students</h1>
+                            </div>
+                            
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-6 col-md-6 col-sm-8">
+                                
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">Add New Student (Manually)</div>
+                                    <div class="panel-body">
+                                         <form method="POST" id="filterActivityQueue" action="">
+                                            <div class="form-group row">
+                                                
+                                                
+                                                <div class="col-lg-4">
+                                                    <input class="form-control" type="text" name="fname" id="fname" placeholder="First Name" /><br />
+                                                    <input class="form-control" type="text" name="lname" id="lame" placeholder="Last Name" /><br />
+                                                </div>
+                                                <div class="col-lg-4">
+                                                    <input class="form-control" type="text" name="Email" id="Email" placeholder="School Email" /><br />
+                                                    <input class="form-control" type="text" name="AltEmail" id="AltEmail" placeholder="Alternate Email" /><br />
+                                                </div>
+                                                <div class="col-lg-4">
+                                                    <input class="form-control" type="text" name="Nickname" id="Nickname" placeholder="Nickname" /><br />
+                                                    
+                                                <select class="form-control" name="Designation" id="Section">
+                                                    <option selected="selected">--Designation--</option>
+                                                    <option>Primary</option>
+                                                    <option>Other</option>
+                                                </select>
+                                                </div>
+                                                
+                                                
+                                            </div>
+                                             <button type="submit" class="btn btn-primary pull-right">Add Student</button>
+                                        </form>
+                                    </div>
+                                </div>
+                                
+                                    
+                            </div>
+                            <div class="col-lg-3 col-md-3 col-sm-4">
+                                
+                                
+                                <div class="panel panel-primary" style="min-height: 225px;max-height: 225px;">
+                                    <div class="panel-heading">Add New Student (By File)</div>
+                                    <div class="panel-body">
+                                        <form>
+                                             <div class="form-group">
+                                                <input type="file" id="studentListFile">
+                                                <p class="help-block">File format: .csv</p>
+                                                <p class="help-block">Columns (no headers): First Name, Last Name, Email, Alternate Email, Nickname, Designation</p>
+                                            </div>
+                                            <button type="submit" class="btn btn-primary pull-right">Add Students</button>
+                                        </form>
+                                    </div>
+                                </div>
+                                
+                                    
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-9 col-md-9">
+
+                                <div class="panel panel-primary" style="min-height: 400px; max-height: 400px; ">
+                                    <div class="panel-heading">Students</div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <td>Institution</td>
+                                                    <td>Name</td>
+                                                    <td>Date Added</td>
+                                                    <td>Added By</td>
+                                                    <td>Visit Page</td>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>Gonzaga University</td>
+                                                    <td>Stu Dent</td>
+                                                    <td>3/3/2016</td>
+                                                    <td>T. Cher</td>
+                                                    <td><a href="ViewStudentProfile/">View Student</a>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                    
+                                </div>
+                                    
                             </div>
                         </div>
                     </div>
@@ -74,7 +152,7 @@
             </div>
 
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script src="/js/bootstrap-datepicker.js"></script>
diff --git a/admin/ManageTeachers/CreateTeacher/index.php b/admin/ManageTeachers/CreateTeacher/index.php
deleted file mode 100644
index c7e0b5e..0000000
--- a/admin/ManageTeachers/CreateTeacher/index.php
+++ /dev/null
@@ -1,101 +0,0 @@
-<?php include "../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-
-    <!-- Including Header -->
-    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Admin')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-        ?>
-        <body>
-            <div id="header"></div>           
-            <div id="wrapper">
-                <div id="sidebar"></div>
-                <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                                    <span class="hamb-top"></span>
-                                    <span class="hamb-middle"></span>
-                                    <span class="hamb-bottom"></span>
-                                </button>
-                                <h1><?=$_SESSION['FirstName']?> <?=$_SESSION['LastName']?></h1>
-                                <p>Register a new teacher account.  Input form: First name, last name, username, default password, school email</p>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-            </div>
-
-            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-            <!-- Include all compiled plugins (below), or include individual files as needed -->
-            <script src="/js/bootstrap.min.js"></script>
-            <script>
-            $("#menu-toggle").click(function(e) {
-                e.preventDefault();
-                $("#wrapper").toggleClass("toggled");
-            });
-            </script>
-        </body> 
-        <?php        
-    }
-}
-
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-
-</html>
diff --git a/admin/ManageTeachers/ViewTeacherProfile/index.php b/admin/ManageTeachers/ViewTeacherProfile/index.php
index e30ef9e..8597c1b 100644
--- a/admin/ManageTeachers/ViewTeacherProfile/index.php
+++ b/admin/ManageTeachers/ViewTeacherProfile/index.php
@@ -12,6 +12,7 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
 
     <!-- Including Header -->
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
@@ -25,16 +26,6 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
 
 <?php
@@ -52,21 +43,107 @@
     {
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
-                                </button>
-                                <h1>View Teacher Profile/Account</h1>
-                                <p>Documentation:</p>
-                                <p>After accepting a form submission from ManageTeachers, this page will display the profile of a given teacher user</p>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-10">
+                                <h2>Firstname Lastname</h2>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-3 col-md-3">
+                                <div class="panel panel-primary" style="min-height:280px;max-height:280px">
+                                    <div class="panel-heading">
+                                        <h3>Teacher Information</h3>
+                                    </div>
+                                    <div class="panel-body">
+                                        <p>Institution:</p>
+                                        <p>Joined SmallTalk:</p>
+                                        <p>Last Active Session:</p>
+                                        <p>Number of SmallTalk<br /> Courses:</p>
+                                    </div>
+                                </div>   
+                            </div>
+                            <div class="col-lg-7 col-md-7">
+                                <div class="panel panel-primary" style="min-height:280px;max-height:280px;overflow-y:scroll">
+                                    <div class="panel-heading">
+                                        <h3>Courses</h3>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Course Number</th>
+                                                    <th>Course Name</th>
+                                                    <th>Session</th>
+                                                    <th>Status</th>
+                                                    <th>Go To</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>ELCT 107</td>
+                                                    <td>Communications Seminar</td>
+                                                    <td>Fall I 2015</td>
+                                                    <td>Archived</td>
+                                                    <td><a href="/Admin/Archive/Courses/ViewCourse/">View Course</a></td>
+                                                </tr>
+                                                <tr>
+                                                    <td>ELCT 107</td>
+                                                    <td>Communications Seminar</td>
+                                                    <td>Spring II 2016</td>
+                                                    <td>Active</td>
+                                                    <td><a href="/Admin/ManageCourses/ViewCourse/">View Course</a></td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>   
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-10 col-md-10">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        <h3>Teacher Activity </h3>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Date</th>
+                                                    <th>Course Name</th>
+                                                    <th>Active Session</th>
+                                                    <th>Action Name</th>
+                                                    <th>Go To</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>1/1/2016</td>
+                                                    <td>Basic Oral Communication</td>
+                                                    <td>Spring I 2016</td>
+                                                    <td>Distributed Worksheet</td>
+                                                    <td><a href="/Admin/Archive/Courses/ViewCourse/ViewWorksheet/">View Worksheet</a></td>
+                                                </tr>
+                                                <tr>
+                                                    <td>1/8/2016</td>
+                                                    <td>Basic Oral Communication</td>
+                                                    <td>Spring I 2016</td>
+                                                    <td>Submitted Worksheet to Corpus</td>
+                                                    <td><a href="/Admin/ManageCorpus/ReviewSubmission/">View Submission</a></td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>   
                             </div>
                         </div>
                     </div>
@@ -74,7 +151,7 @@
             </div>
 
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script src="/js/bootstrap-datepicker.js"></script>
diff --git a/admin/ManageTeachers/index.php b/admin/ManageTeachers/index.php
index 6cfe5f3..d53ddb3 100644
--- a/admin/ManageTeachers/index.php
+++ b/admin/ManageTeachers/index.php
@@ -12,6 +12,7 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
 
     <!-- Including Header -->
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
@@ -25,16 +26,6 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
 
 <?php
@@ -52,21 +43,108 @@
     {
         ?>
         <body>
-            <div id="header"></div>           
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
-                                </button>
-                                <h1>Manage Teacher Accounts</h1>
-                                <p>Documentation:</p>
-                                <p>Page will provide search functionality and teacher profile view, for reviewing of accounts.  Provides a field for creating a teacher account.  Potentially will involve an option for inputing account info en masse, i.e. via a file</p>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-8 col-md-8 col-sm-10 col-xs-10">
+                                <h1>Gonzaga University Teachers</h1>
+                            </div>
+                            
+
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-6 col-md-6 col-sm-8">
+                                
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">Add New Teacher (Manually)</div>
+                                    <div class="panel-body">
+                                         <form method="POST" id="filterActivityQueue" action="">
+                                            <div class="form-group row">
+                                                
+                                                
+                                                <div class="col-lg-4">
+                                                    <input class="form-control" type="text" name="fname" id="fname" placeholder="First Name" /><br />
+                                                    <input class="form-control" type="text" name="lname" id="lame" placeholder="Last Name" /><br />
+                                                </div>
+                                                <div class="col-lg-4">
+                                                    <input class="form-control" type="text" name="Email" id="Email" placeholder="School Email" /><br />
+                                                    <input class="form-control" type="text" name="AltEmail" id="AltEmail" placeholder="Alternate Email" /><br />
+                                                </div>
+                                                <div class="col-lg-4">
+                                                    
+                                                <select class="form-control" name="Designation" id="Section">
+                                                    <option selected="selected">--Designation--</option>
+                                                    <option>Primary</option>
+                                                    <option>Other</option>
+                                                </select>
+                                                </div>
+                                                
+                                                
+                                            </div>
+                                             <button type="submit" class="btn btn-primary pull-right">Add Teacher</button>
+                                        </form>
+                                    </div>
+                                </div>
+                                
+                                    
+                            </div>
+                            <div class="col-lg-3 col-md-3 col-sm-4">
+                                
+                                
+                                <div class="panel panel-primary" style="min-height: 225px;max-height: 225px;">
+                                    <div class="panel-heading">Add New Teacher (By File)</div>
+                                    <div class="panel-body">
+                                        <form>
+                                             <div class="form-group">
+                                                <input type="file" id="studentListFile">
+                                                <p class="help-block">File format: .csv</p>
+                                                <p class="help-block">Columns (no headers): First Name, Last Name, Email, Alternate Email, Designation</p>
+                                            </div>
+                                            <button type="submit" class="btn btn-primary pull-right">Add Teacher</button>
+                                        </form>
+                                    </div>
+                                </div>
+                                
+                                    
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-9 col-md-9">
+
+                                <div class="panel panel-primary" style="min-height: 400px; max-height: 400px; ">
+                                    <div class="panel-heading">Teachers</div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <td>Institution</td>
+                                                    <td>Name</td>
+                                                    <td>Date Added</td>
+                                                    <td>Added By</td>
+                                                    <td>Visit Page</td>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>Gonzaga University</td>
+                                                    <td>T. Cher</td>
+                                                    <td>3/3/2016</td>
+                                                    <td>Ah D. Min</td>
+                                                    <td><a href="ViewTeacherProfile/">View Teacher</a>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                    
+                                </div>
+                                    
                             </div>
                         </div>
                     </div>
@@ -74,7 +152,7 @@
             </div>
 
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script src="/js/bootstrap-datepicker.js"></script>
diff --git a/admin/SiteUsers/index.php b/admin/SiteUsers/index.php
new file mode 100644
index 0000000..3823f38
--- /dev/null
+++ b/admin/SiteUsers/index.php
@@ -0,0 +1,195 @@
+<?php include "../../base.php"; ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
+
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+</head>
+
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if($_SESSION['Role'] != 'Admin')
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        ?>
+        <body>
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                                    <span class="hamb-top"></span>
+                                    <span class="hamb-middle"></span>
+                                    <span class="hamb-bottom"></span>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-8 col-md-8 col-sm-10 col-xs-10">
+                                <h1>Smalltalk Site Users</h1>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-6 col-md-6 col-sm-8">
+                                
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">Add New User</div>
+                                    <div class="panel-body">
+                                         <form method="POST" id="filterActivityQueue" action="">
+                                            <div class="form-group row">
+                                                
+                                                
+                                                <div class="col-lg-4">
+                                                    <input class="form-control" type="text" name="fname" id="fname" placeholder="First Name" /><br />
+                                                    <input class="form-control" type="text" name="Email" id="Email" placeholder="School Email" /><br />
+                                                    
+                                                </div>
+                                                <div class="col-lg-4">
+                                                    <input class="form-control" type="text" name="lname" id="lame" placeholder="Last Name" /><br />
+                                                    
+                                                    
+                                                </div>
+                                                <div class="col-lg-4">
+                                                    
+                                                <select class="form-control" name="Designation" id="Section">
+                                                    <option selected="selected">--Designation--</option>
+                                                    <option>Primary</option>
+                                                    <option>Other</option>
+                                                </select>
+                                                </div>
+                                                
+                                                
+                                            </div>
+                                             <button type="submit" class="btn btn-primary pull-right">Add Teacher</button>
+                                        </form>
+                                    </div>
+                                </div>
+                                
+                                    
+                            </div>
+                            <div class="col-lg-3 col-md-3 col-sm-4">
+                                
+                                
+                                <div class="panel panel-primary" style="min-height: 225px;max-height: 225px;">
+                                    <div class="panel-heading">Add New Teacher (By File)</div>
+                                    <div class="panel-body">
+                                        <form>
+                                             <div class="form-group">
+                                                <input type="file" id="studentListFile">
+                                                <p class="help-block">File format: .csv</p>
+                                                <p class="help-block">Columns (no headers): First Name, Last Name, Email, Alternate Email, Designation</p>
+                                            </div>
+                                            <button type="submit" class="btn btn-primary pull-right">Add Teacher</button>
+                                        </form>
+                                    </div>
+                                </div>
+                                
+                                    
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-9 col-md-9">
+
+                                <div class="panel panel-primary" style="min-height: 400px; max-height: 400px; ">
+                                    <div class="panel-heading">Site Users</div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <td>Username</td>
+                                                    <td>Name</td>
+                                                    <td>Date Added</td>
+                                                    <td>Alter</td>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+<?php
+        $params = array();
+        $options = array( "Scrollable" => 'static' );
+        $siteusersSQL = "SELECT SU.username, SU.firstname, SU.lastname, SU.date_added, R.Role
+                         FROM SiteUsers SU, RoleInstances RI, Roles R
+                         WHERE RI.SiteUsername = SU.username AND
+                               R.RoleID = RI.RoleID";
+        $siteusers = sqlsrv_query($con, $siteusersSQL, $params, $options);
+        if ($siteusers === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_users = sqlsrv_num_rows($siteusers);
+        $usernames = [];
+        $firstnames = [];
+        $lastnames = [];
+        $dates = [];
+        $roles = [];
+                                                <tr>
+                                                    
+                                                    <td>Gonzaga University</td>
+                                                    <td>T. Cher</td>
+                                                    <td>3/3/2016</td>
+                                                    <td><a href="ViewTeacherProfile/">View Teacher</a>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                    
+                                </div>
+                                    
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <!-- Include all compiled plugins (below), or include individual files as needed -->
+            <script src="/js/bootstrap.min.js"></script>
+            <script src="/js/bootstrap-datepicker.js"></script>
+            <script>
+            $("#menu-toggle").click(function(e) {
+                e.preventDefault();
+                $("#wrapper").toggleClass("toggled");
+            });
+            </script>
+        </body> 
+        <?php        
+    }
+}
+
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+
+</html>
diff --git a/azureblobtest.php b/azureblobtest.php
index 3544a4a..dfb3336 100644
--- a/azureblobtest.php
+++ b/azureblobtest.php
@@ -12,7 +12,7 @@
         <link href="css/bootstrap.css" rel="stylesheet">
         
         <!-- Header File -->
-        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+        <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
         <style>
             body{
                 background: url(Media/GonzagaBackground.jpg) no-repeat center center fixed;
@@ -64,7 +64,7 @@
             <p>Successful creation of a container!</p>
         </div>  
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="js/bootstrap.min.js"></script>
     </body>
diff --git a/base.php b/base.php
index a189e55..6f18f2d 100644
--- a/base.php
+++ b/base.php
@@ -1,23 +1,23 @@
 <?php
-include 'pagination.php';
-//include 'phpmailersetup.php';
-session_start();
+    include 'pagination.php';
+    date_default_timezone_set('America/Los_Angeles');
+    session_start();
 
-/* DB Connection Information */
-$dbhost = "o0tvd0xlpb.database.windows.net,1433";
-$dbname = "SmalltalkMigrate2.0";
-$dbuser = "CS05";
-$dbpass = "!1Elcwebapp";
-$connectionInfo = array( "Database"=>$dbname, "UID"=>$dbuser, "PWD"=>$dbpass);
-$salt = "Th4nk";
+    /* DB Connection Information */
+    $dbhost = "o0tvd0xlpb.database.windows.net,1433";
+    $dbname = "SmalltalkMigrate2.0";
+    $dbuser = "CS05";
+    $dbpass = "!1Elcwebapp";
+    $connectionInfo = array( "Database"=>$dbname, "UID"=>$dbuser, "PWD"=>$dbpass);
+    $salt = "Th4nk";
 
-$con = sqlsrv_connect($dbhost, $connectionInfo); if(!$con) {
-    die(print_r(sqlsrv_errors(), true));
-}
-function mssql_escape($data) {
-    if(is_numeric($data))
-        return $data;
-    $unpacked = unpack('H*hex', $data);
-    return '0x' . $unpacked['hex'];
-}
+    $con = sqlsrv_connect($dbhost, $connectionInfo); if(!$con) {
+        die(print_r(sqlsrv_errors(), true));
+    }
+    function mssql_escape($data) {
+        if(is_numeric($data))
+            return $data;
+        $unpacked = unpack('H*hex', $data);
+        return '0x' . $unpacked['hex'];
+    }
 ?>
\ No newline at end of file
diff --git a/bower.json b/bower.json
index d646ed7..d909788 100644
--- a/bower.json
+++ b/bower.json
@@ -6,7 +6,7 @@
     "dist/js/bootstrap-select.js"
   ],
   "version": "1.7.2",
-  "homepage": "https://silviomoreto.github.io/bootstrap-select",
+  "homepage": "//silviomoreto.github.io/bootstrap-select",
   "authors": [
     "silviomoreto"
   ],
diff --git a/changepassword.php b/changepassword.php
index ec458eb..455150f 100644
--- a/changepassword.php
+++ b/changepassword.php
@@ -13,7 +13,7 @@
         <link href="css/bootstrap.css" rel="stylesheet">
         
         <!-- Header File -->
-        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+        <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
         <script>
             $(function(){
                 $("#header").load("header.html");
diff --git a/composer.json b/composer.json
index 73b5acb..46fc1e9 100644
--- a/composer.json
+++ b/composer.json
@@ -7,12 +7,12 @@
     "select",
     "replacement"
   ],
-  "homepage": "https://silviomoreto.github.io/bootstrap-select",
+  "homepage": "//silviomoreto.github.io/bootstrap-select",
   "version": "1.7.2",
   "authors": [
     {
       "name": "Silvio Moreto",
-      "homepage": "https://github.com/silviomoreto"
+      "homepage": "//github.com/silviomoreto"
     }
   ],
   "license": "MIT",
diff --git a/composor.json b/composor.json
index eaeb248..757f279 100644
--- a/composor.json
+++ b/composor.json
@@ -2,7 +2,7 @@
 	"repositories": [
 		{
 			"type": "pear",
-			"url": "https://pear.php.net"
+			"url": "//pear.php.net"
 		}
 	],
 	"require": {
diff --git a/corpus/Results/index.php b/corpus/Results/index.php
index 62360c7..692113e 100644
--- a/corpus/Results/index.php
+++ b/corpus/Results/index.php
@@ -13,29 +13,19 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet">
+    
 
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
+
         $(function(){
             $("#sidebar").load("/sidebar.php");
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
 
 <?php
@@ -51,75 +41,206 @@
     }
     else
     {
+        
+        $searched_words = isset($_POST['search_words']) ? $_POST['search_words'] : '';
+        $num_searched_words = count($searched_words);
+        
+        $expressionsSQL = "SELECT DISTINCT E.Expression, E.[Context/Vocabulary], CT.Level, L.Language
+                           FROM Expressions E, SeqWords SW, Students S, Courses C, CourseTypes CT, Languages L
+                           WHERE ";
+        $params = [];
+        $options = array( "Scrollable" => 'static' );
+        for($j = 0; $j < $num_searched_words - 1; $j++)
+        {
+            $word_title = $searched_words[$j];
+            $word_list = $_POST[$word_title];
+            $num_words = count($word_list);
+            $add_to_query = "E.ExpressionID in (SELECT E2.ExpressionID
+                                                FROM Expressions E2, SeqWords SW2
+                                                WHERE (";
+            for($i = 0; $i < $num_words - 1; $i++)
+            {
+                $add_to_query .= "SW2.WordID = ? OR ";
+                $params[] = $word_list[$i];
+            }
+            $add_to_query .= "SW2.WordID = ?";
+            $params[] = $word_list[$num_words - 1];
+            $expressionsSQL .= $add_to_query;
+            $expressionsSQL .= ") AND E2.ExpressionID = SW2.ExpressionID) AND ";
+        }
+        $word_title = $searched_words[$num_searched_words - 1];
+        $word_list = $_POST[$word_title];
+        $num_words = count($word_list);
+        $add_to_query = "E.ExpressionID in (SELECT E2.ExpressionID
+                                            FROM Expressions E2, SeqWords SW2
+                                            WHERE (";
+        for($i = 0; $i < $num_words - 1; $i++)
+        {
+            $add_to_query .= "SW2.WordID = ? OR ";
+            $params[] = $word_list[$i];
+        }
+        $add_to_query .= "SW2.WordID = ? ";
+        $params[] = $word_list[$num_words - 1];
+        $expressionsSQL .= $add_to_query;
+        $expressionsSQL .= ") AND E2.ExpressionID = SW2.ExpressionID)";
+        
+        $expressionsSQL .= " AND S.StudentID = E.StudentID AND
+                                 L.LanguageID = S.Language AND
+                                 C.CourseID = E.CourseID AND
+                                 CT.CourseTypesID = C.CourseTypesID";
+
+
+        
+        
+        
+        /*$expressions = sqlsrv_query($con, $expressionsSQL, $params, $options);
+        if ($expressions === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_expressions = sqlsrv_num_rows($expressions);
+        $expression_data = [];
+        
+        while (sqlsrv_fetch($expressions) === true)
+            $expression_data[] = sqlsrv_get_field($expressions, 0);*/
+        
+        
+        
+        
         ?>
         <body>
-            <div id="header"></div>
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
                                 </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-md-3">
+                                <form method="POST" action="/Corpus/Search/">
+                                    <button class="btn-lg btn-primary">New Search</button>
+                                </form>
+                                
+                            </div>
+                        </div>
+                        <br>
+                        <div class="row">
+                            <div class="col-md-9">
+                                <h3><strong>
+                                    <span>
+<?php
+        for ($i = 0; $i < $num_searched_words - 1; $i++)
+            echo "$searched_words[$i] + ";
+        $end = $num_searched_words - 1;
+        echo "$searched_words[$end]";
+?>
+                                    </span>
+                                </strong></h3>
+                                
+                            </div>
+                        </div>
+                        <br>
+                        <!--<div class="row">
+                            <div class="col-md-10">
+                                
                                 <div class="panel panel-primary">
-                                    <div class="panel-heading">Search for a course</div>
+                                    <div class="panel-heading">Search Information</div>
                                     <div class="panel-body">
                                         
                                     <p>Search Information</p>
                                     </div>
                                 </div>
-                                <?php
-       
-        if(!empty($_POST['words']))
-        {
-            $words = $_POST['words'];//getArray_POST('words');
-            $PartsOfSpeech = $_POST['PoS'];//getArray_POST('PoS');
-            
-            /*for($i = 0; $i < count($words); $i++)
-            {
-                ?>
-                <p><?=$words[$i]?> is a <?=$PartsOfSpeech[$i]?></p>
-                <?php
-            }*/
-
-            $getExpressionQuery = "SELECT Expression FROM Expressions WHERE Expression LIKE '%";
-            foreach($words as $word)
-            {
-                $getExpressionQuery .= "{$word}%";
-            }
-            $getExpressionQuery .= "'";
-            //echo "$getExpressionQuery";
-            
-
-            
-        }
-        ?>
+                            </div>
+                        </div>-->
+                        <!--<div class="row">
+                            <div class="col-md-5 col-sm-6">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">
+                                        <h4>Filter By Language</h4>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th><label><input type='checkbox' id='checkAll'> Select All </label></th>
+                                                    <th>Language</th>
+                                                    <th>Number of Results ( n = 50 )</th>
+                                                    <th>Percentage</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td><input type="checkbox" name="selectLang"></td>
+                                                    <td>Spanish</td>
+                                                    <td>20</td>
+                                                    <td>
+                                                        <div class="progress">
+                                                            <div class="progress-bar progress-bar-info" style="width: 40%">40%</div>
+                                                        </div>
+                                                    </td>
+                                                </tr>
+                                                <tr>
+                                                    <td><input type="checkbox" name="selectLang"></td>
+                                                    <td>French</td>
+                                                    <td>30</td>
+                                                    <td>
+                                                        <div class="progress">
+                                                            <div class="progress-bar progress-bar-info" style="width: 60%">60%</div>
+                                                        </div>
+                                                    </td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-5 col-sm-6">
                                 <div class="panel panel-primary">
-                                    <div class="panel-heading">Search for a course</div>
+                                    <div class="panel-heading">
+                                        <h4>Filter By Level</h4>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <tr>
+                                                <th><label><input type='checkbox' id='checkAll'> Select All </label></th>
+                                                <th>Language</th>
+                                                <th>Number of Results(n= )</th>
+                                                <th>Percentage</th>
+                                            </tr>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>-->
+                        <div class="row">
+                            <div class="col-md-10">
+                                <div class="panel panel-primary" style="max-height:600px;">
+                                    <div class="panel-heading"><h4>Result Expressions</h4></div>
                                     <div class="panel-body">
                                         <table class="table">
                                             <thead>
                                                 <tr>
-                                                    <h3><td>Expression</td></h3>
-                                        
+                                                    <th>Expression</th>
+                                                    <th>Context</th>
+                                                    <th>Level</th>
+                                                    <th>Native Language</th>
                                                 </tr>
                                             </thead>
                                             <tbody>
                                                 <?php
-    $params = array();
+    
+        
+        
     $options = array( "Scrollable" => 'static' );
     
-    $stmt = sqlsrv_query($con, $getExpressionQuery, $params, $options);
+    $stmt = sqlsrv_query($con, $expressionsSQL, $params, $options);
     if ( !$stmt )
         die( print_r( sqlsrv_errors(), true));
 
     /* Extract Pagination Paramaters */
 
-    $rowsPerPage = isset($_GET['pp']) ? $_GET['pp'] : 10; // get rows per page, default = 10
+    $rowsPerPage = isset($_GET['pp']) ? $_GET['pp'] : 20; // get rows per page, default = 10
 
 
     $rowsReturned = sqlsrv_num_rows($stmt);
@@ -142,18 +263,15 @@
     foreach($page as $row)
     {
         //$coursePageLink = "ViewCourse/?courseID=$row[5]";
-        echo "<tr><td>$row[0]</td></tr>";
+        echo "<tr><td>$row[0]</td><td>$row[1]</td><td>$row[2]</td><td>$row[3]</td></tr>";
     }
 
     echo "</tbody></table><br />";
-    $modulator = 3;
-    //Pagination::pageLinks($numOfPages, $pageNum, $rowsPerPage, $rowsReturned, $modulator);
+    $modulator = 0;
+    Pagination::pageLinks($numOfPages, $pageNum, $rowsPerPage, $rowsReturned, $modulator);
     ?>
                                     </div>
-                                
                                 </div>
-                                
-                                
                             </div>
                         </div>
                     </div>
@@ -161,7 +279,7 @@
             </div>
 
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script>
@@ -169,6 +287,10 @@
                 e.preventDefault();
                 $("#wrapper").toggleClass("toggled");
             });
+            $(document).on("change", "#checkAll", function(e){
+                e.preventDefault();
+                $("input:checkbox").prop('checked', $(this).prop("checked"));
+            });
             </script>
         </body> 
         <?php        
diff --git a/corpus/Testfindphrase.html b/corpus/Testfindphrase.html
index d20267b..5b1b3ed 100644
--- a/corpus/Testfindphrase.html
+++ b/corpus/Testfindphrase.html
@@ -1,22 +1,135 @@
-<html>
+<!--<html>
 <head>
+<script data-cfasync="false" type="text/javascript">
+
+var myAjax = ajax();
+function ajax() {
+        var ajax = null;
+        if (window.XMLHttpRequest) {
+                try {
+                        ajax = new XMLHttpRequest();
+                }
+                catch(e) {}
+        }
+        else if (window.ActiveXObject) {
+                try {
+                        ajax = new ActiveXObject("Msxm12.XMLHTTP");
+                }
+                catch (e){
+                        try{
+                                ajax = new ActiveXObject("Microsoft.XMLHTTP");
+                        }
+                        catch (e) {}
+                }
+        }
+        return ajax;
+}
+function request(str) {
+	//Don't forget to modify the path according to your theme
+        myAjax.open("POST", "Testfindphrase.php");
+        myAjax.onreadystatechange = result;
+        myAjax.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+        myAjax.send("search="+str);
+}
+function result() {
+        if (myAjax.readyState == 4) {
+                var liste = myAjax.responseText;
+                var cible = document.getElementById('tag_update').innerHTML = liste;
+               // document.getElementById('tag_update').style.display = "block";
+        }
+}
+function selected(choice){
+        var cible = document.getElementById('s');
+        cible.value = choice;
+        document.getElementById('tag_update').style.display = "none";
+}
+</script>
+<style type="text/css">
+#tag_update {
+        display: block;
+        border-left: 1px solid #373737;
+        border-right: 1px solid #373737;
+        border-bottom: 1px solid #373737;
+        position:absolute;
+        z-index:1;
+}
+#tag_update ul {
+        margin: 0;
+        padding: 0;
+        list-style: none;
+}
+#tag_update li{
+        display:block;
+        clear:both;
+}
+#tag_update a {
+        width:134px;
+        display: block;
+        padding: .2em .3em;
+        text-decoration: none;
+        color: #fff;
+        background-color: #1B1B1C;
+        text-align: left;
+}
+#tag_update a:hover{
+        color: #fff;
+        background-color: #373737;
+        background-image: none;
+}
+</style>
+</head>
 
-<body bgcolor="#AFEEEE">
-<p> </p>  
-<a href="http://smalltalkphp.azurewebsites.net/text_corpus_login.html"><p style="text-align: right">Log Out</a> 
-<p> </p>
-<center>Phrase Search</center>
-<p></p>
-<p> </p>
-<a href="http://smalltalkphp.azurewebsites.net/Briantitlepage.html">Return to Table of Contents</a>
-<p> </p>
+<form method="get" id="searchform" action="Testfindphrase.php">
+    <div>
+        <input autocomplete="off" value="" name="s" id="s" onkeyup="request(this.value);" type="text">
+        <input id="searchsubmit" value="Search" class="button" type="submit">
+    </div><div id="tag_update"></div>
+</form>
 
- 
-<form method="post" name="display" action="Testfindphrase.php" /> 
-Please enter a phrase : (ex. I will) <br>  
-<input type="text" name="q" /> 
-<input type="submit" name="Submit" value="display phrases" /> 
-</form> 
+</html>
+-->
+<html>
+<head>
+<TITLE>jQuery AJAX Autocomplete - Country Example</TITLE>
+<head>
+<style>
+body{width:610px;}
+.frmSearch {border: 1px solid #F0F0F0;background-color:#C8EEFD;margin: 2px 0px;padding:40px;}
+#country-list{float:left;list-style:none;margin:0;padding:0;width:190px;}
+#country-list li{padding: 10px; background:#FAFAFA;border-bottom:#F0F0F0 1px solid;}
+#country-list li:hover{background:#F0F0F0;}
+#search-box{padding: 10px;border: #F0F0F0 1px solid;}
+</style>
+<script src="//code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
+<script>
+$(document).ready(function(){
+	$("#search-box").keyup(function(){
+		$.ajax({
+		type: "POST",
+		url: "Testfindphrase.php",
+		data:'keyword='+$(this).val(),
+		beforeSend: function(){
+			$("#search-box").css("background","#FFF url(LoaderIcon.gif) no-repeat 165px");
+		},
+		success: function(data){
+			$("#suggesstion-box").show();
+			$("#suggesstion-box").html(data);
+			$("#search-box").css("background","#FFF");
+		}
+		});
+	});
+});
 
+function selectCountry(val) {
+$("#search-box").val(val);
+$("#suggesstion-box").hide();
+}
+</script>
+</head>
+<body>
+<div class="frmSearch">
+<input type="text" id="search-box" placeholder="Language" />
+<div id="suggesstion-box"></div>
+</div>
 </body>
 </html>
diff --git a/corpus/Testfindphrase.php b/corpus/Testfindphrase.php
index 5f3d7b5..c4dfc84 100644
--- a/corpus/Testfindphrase.php
+++ b/corpus/Testfindphrase.php
@@ -24,45 +24,44 @@
 
 <?php
 //get the q parameter from URL
-$q=$_POST["q"];
+$q= htmlentities($_POST["search"]);
 // connects to DB
 $con = mysqli_connect('us-cdbr-azure-west-c.cloudapp.net','b2a3214e88e413','325ebc40','mysqldbproject');
 if (!$con) {
     die('Could not connect: ' . mysqli_error($con));
 }
 
-echo $q;
 
-    
 //Search results for echo ($q);
 mysqli_select_db($con,"mysqldbproject");
+
 $sql= "SELECT * FROM expressions_full WHERE expression LIKE '%{$q}%'";
-//echo ($sql);  //Tests the sql statement
+echo ($sql);  //Tests the sql statement
 $result = mysqli_query($con,$sql);
 //Create table template
-echo "<table>
-<caption>Search Results:</caption>
-<tr>
-<th>student_id</th>
-<th>expression</th>
-<th>level_id</th>
-<th>topic_id</th>
-<th>language_id</th>
-</tr>";
+// echo "<table>
+// <caption>Search Results:</caption>
+// <tr>
+// <th>student_id</th>
+// <th>expression</th>
+// <th>level_id</th>
+// <th>topic_id</th>
+// <th>language_id</th>
+// </tr>";
 //Input values into table
+
+echo '<ul>';
+
 while($row = mysqli_fetch_array($result)) {
-    echo "<tr>";
-    echo "<td>" . $row['expression_id'] . "</td>";
-    echo "<td>" . $row['expression'] . "</td>";
-    echo "<td>" . $row['level_id'] . "</td>";
-    echo "<td>" . $row['topic_id'] . "</td>";
-    echo "<td>" . $row['language_id'] . "</td>";
-    echo "</tr>";
+    echo '<li><a href="#" onclick="selected(this.innerHTML);">'. htmlentities($row['expression'])"</li>";
 }
+
+echo '</u>';
 //output the table with values in it
-echo "</table>";
+//echo "</table>";
 
 mysqli_close($con);
+exit;
 ?>
 </body>
 </html>
diff --git a/corpus/findphrase.php b/corpus/findphrase.php
index 108944c..9b70aa3 100644
--- a/corpus/findphrase.php
+++ b/corpus/findphrase.php
@@ -1,56 +1,25 @@
 <?php
-class DBController {
-	private $host = "us-cdbr-azure-west-c.cloudapp.net";
-	private $user = "b2a3214e88e413";
-	private $password = "325ebc40";
-	private $database = "mysqldbproject";
-	
-	function __construct() {
-		$conn = $this->connectDB();
-		if(!empty($conn)) {
-			$this->selectDB($conn);
-		}
-	}
-	
-	function connectDB() {
-		$conn = mysql_connect($this->host,$this->user,$this->password);
-		return $conn;
-	}
-	
-	function selectDB($conn) {
-		mysql_select_db($this->database,$conn);
-	}
-	
-	function runQuery($query) {
-		$result = mysql_query($query);
-		while($row=mysql_fetch_assoc($result)) {
-			$resultset[] = $row;
-		}		
-		if(!empty($resultset))
-			return $resultset;
-	}
-	
-	function numRows($query) {
-		$result  = mysql_query($query);
-		$rowcount = mysql_num_rows($result);
-		return $rowcount;	
-	}
+if (isset($_POST['search'])) {
+        $search = htmlentities($_POST['search']);
+ 
+$con = mysqli_connect('us-cdbr-azure-west-c.cloudapp.net','b2a3214e88e413','325ebc40','mysqldbproject');
+if (!$con) {
+    die('Could not connect: ' . mysqli_error($con));
+}
+
+echo($echo);
+   
+//Search results for echo ($q);
+mysqli_select_db($con,"mysqldbproject");
+$sql= "SELECT * FROM expressions_full WHERE  expression LIKE '$search%'";
+$req =  mysqli_query($con,$sql) or die();
+echo '<ul>';
+while ($row = mysqli_fetch_array($req))
+{
+      echo '<li><a href="#" onclick="selected(this.innerHTML);">'.htmlentities($row['expression']).'</a></li>';
+}
+echo '</ul>';
+mysqli_close($con);
+exit;
 }
 ?>
-<!--"SELECT * FROM expressions_full WHERE expression LIKE '%{$q}%'";-->
-<?php
-//require_once("dbcontroller.php");
-$db_handle = new DBController();
-if(!empty($_POST["keyword"])) {
-$query =""SELECT * FROM expressions_full WHERE expression LIKE '" . $_POST["keyword"] . "%'";
-$result = $db_handle->runQuery($query);
-if(!empty($result)) {
-?>
-<ul id="country-list">
-<?php
-foreach($result as $country) {
-?>
-<li onClick="selectCountry('<?php echo $country["expression"]; ?>');"><?php echo $country["expression"]; ?></li>
-<?php } ?>
-</ul>
-<?php } } ?>
diff --git a/corpus/index.php b/corpus/index.php
index 2153d84..153c8cb 100644
--- a/corpus/index.php
+++ b/corpus/index.php
@@ -12,9 +12,10 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
 
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -25,16 +26,6 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
 
 <?php
@@ -52,7 +43,6 @@
     {
         ?>
         <body>
-            <div id="header"></div>
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
@@ -66,7 +56,7 @@
                                 </button>
                                 <h1>Corpus Search Home</h1>
                                 <p>Documentation:</p>
-                                <p>Only accessible to teacher and admin accounts.  Along with a window for submitting a new search form (similar to the one in <a href="http://corpus.byu.edu/coca/">COCA</a>) the page will provide corpus navigation via the sidebar.  Within the page window (not the sidebar) will be several options for viewing additional data in the corpus, such as graphical representations of certain types of data, registering with Gonzaga (if not already logged in) and viewing audio data (potentially) <a href="search">Search the Corpus</a> </p>
+                                <p>Only accessible to teacher and admin accounts.  Along with a window for submitting a new search form (similar to the one in <a href="//corpus.byu.edu/coca/">COCA</a>) the page will provide corpus navigation via the sidebar.  Within the page window (not the sidebar) will be several options for viewing additional data in the corpus, such as graphical representations of certain types of data, registering with Gonzaga (if not already logged in) and viewing audio data (potentially) <a href="search">Search the Corpus</a> </p>
                                 
                             </div>
                         </div>
@@ -75,7 +65,7 @@
             </div>
 
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script>
diff --git a/corpus/search/buildrow.php b/corpus/search/buildrow.php
new file mode 100644
index 0000000..9681990
--- /dev/null
+++ b/corpus/search/buildrow.php
@@ -0,0 +1,40 @@
+<?php
+// Array with names
+
+include '../../base.php';
+
+if ((isset($_POST['words'])) && (isset($_POST['searchedword'])))
+{
+    $words = $_POST['words'];
+    $num_words = count($words);
+
+    $searchedword = $_POST['searchedword'];
+?>
+    <tr>
+    <td>Word</td>
+    <td>
+    <input hidden type="text" name="search_words[]" value="<?=$searchedword?>">
+<?php
+    foreach($words as $word)
+    {
+?>
+        <input hidden type="text" name="<?=$searchedword?>[]" value="<?=$word?>">
+<?php
+    }
+
+    echo $searchedword;
+?>
+    </td>
+    <td>
+        <button class='btn btn-danger' type='button' name='DeleteRow'>
+            Delete
+        </button>
+    </td> 
+</tr>
+<?php
+}
+
+
+
+
+?>
diff --git a/corpus/search/buildtagrow.php b/corpus/search/buildtagrow.php
new file mode 100644
index 0000000..52b49c3
--- /dev/null
+++ b/corpus/search/buildtagrow.php
@@ -0,0 +1,53 @@
+<?php
+
+include '../../base.php';
+
+if (isset($_POST['tags']))
+{
+    $tags = $_POST['tags'];
+?>
+    <tr>
+        <td>Tag</td>
+        <td>
+        <?php
+        $i = 0;
+        while (($i < 3) && ($i < count($tags) - 1))
+        {
+            ?>
+                <?=$tags[$i]?>/
+            <?php
+                $i++;
+        }
+    ?>
+            <?=$tags[$i]?>
+        <?php
+            if (count($tags) > 4)
+            {
+                ?>
+                ...
+                <?php
+            }?>
+        </td>
+        <td>
+            <button class='btn btn-danger' type='button' name='DeleteRow'>
+                Delete
+            </button>
+        </td>
+<?php
+    foreach($tags as $tag)
+    {
+        ?>
+        <input hidden name="<?=$tags[0]?>[]" value="<?=$tag?>">
+        <?php
+    }
+    ?>
+    </tr>
+<?php
+}
+else
+{
+    ?>
+    <p>ERRORRRRRR</p>
+<?php
+}
+?>
\ No newline at end of file
diff --git a/corpus/search/getlanguage.php b/corpus/search/getlanguage.php
index 2790098..fba1f6e 100644
--- a/corpus/search/getlanguage.php
+++ b/corpus/search/getlanguage.php
@@ -2,189 +2,38 @@
 // Array with names
 
 include '../../base.php';
-$languages = [];
 
-$languages[] = "Afrikaans";
-$languages[] = "Akkadian";
-$languages[] = "Albanian";
-$languages[] = "American Sign Language (ASL)";
-$languages[] = "Arabic";
-$languages[] = "Aramaic";
-$languages[] = "Armenian";
-$languages[] = "Assyrian";
-$languages[] = "Aymara";
-$languages[] = "Bahasa Malaysia (Malay)";
-$languages[] = "Bangala";
-$languages[] = "Basque";
-$languages[] = "Bavarian";
-$languages[] = "Belorusian (Byelorussian)";
-$languages[] = "Bengali";
-$languages[] = "Berber (Tamazight)";
-$languages[] = "Braille";
-$languages[] = "Breton";
-$languages[] = "Bulgarian";
-$languages[] = "Burmese";
-$languages[] = "Cambodian";
-$languages[] = "Cantonese";
-$languages[] = "Catalan";
-$languages[] = "Cherokee (Tsalagi)";
-$languages[] = "Croatian";
-$languages[] = "Czech";
-$languages[] = "Dakota";
-$languages[] = "Danish";
-$languages[] = "Dauphinois";
-$languages[] = "Dutch";
-$languages[] = "Egyptian- Ancient";
-$languages[] = "Egyptian- Middle";
-$languages[] = "English- Middle";
-$languages[] = "English- Modern";
-$languages[] = "English- Old";
-$languages[] = "English Sign Language (ESL)";
-$languages[] = "Esperanto (designed)";
-$languages[] = "Estonian";
-$languages[] = "Finnish";
-$languages[] = "Flemish";
-$languages[] = "French";
-$languages[] = "French Sign Language";
-$languages[] = "Frisian";
-$languages[] = "Fukienese";
-$languages[] = "Gaelic";
-$languages[] = "Galician";
-$languages[] = "Georgian";
-$languages[] = "German";
-$languages[] = "Greek, Ancient";
-$languages[] = "Greek- Koine (Biblical)";
-$languages[] = "Greek- Modern";
-$languages[] = "Guarani";
-$languages[] = "Gujarati";
-$languages[] = "Hakka";
-$languages[] = "Halaka";
-$languages[] = "Hausa";
-$languages[] = "Hawaiian";
-$languages[] = "Hebrew- Biblical";
-$languages[] = "Hebrew- Modern";
-$languages[] = "Hundustani (Hindi)";
-$languages[] = "Hungarian";
-$languages[] = "Icelandic";
-$languages[] = "Indonesian";
-$languages[] = "Interlingua (designed)";
-$languages[] = "Italian";
-$languages[] = "Japanese";
-$languages[] = "Javanese";
-$languages[] = "Kamilaroi";
-$languages[] = "Klingon (designed)";
-$languages[] = "Korean";
-$languages[] = "Kurdish";
-$languages[] = "Ladino";
-$languages[] = "Latin";
-$languages[] = "Latin- Church";
-$languages[] = "Latvian";
-$languages[] = "Lithuanian";
-$languages[] = "Lojban";
-$languages[] = "Low German";
-$languages[] = "Luganda";
-$languages[] = "Macedonian";
-$languages[] = "Malayalam";
-$languages[] = "Maltese";
-$languages[] = "Mandarin (Chinese)";
-$languages[] = "Manx";
-$languages[] = "Maori";
-$languages[] = "Maya";
-$languages[] = "Mohawk";
-$languages[] = "Mon";
-$languages[] = "Mongolian";
-$languages[] = "Morse Code (designed)";
-$languages[] = "Myanmar";
-$languages[] = "Nahuatl";
-$languages[] = "Navajo";
-$languages[] = "Nepalese";
-$languages[] = "Norman";
-$languages[] = "Norwegian";
-$languages[] = "Occitan";
-$languages[] = "Ojibwe";
-$languages[] = "Oneida";
-$languages[] = "Papiamentu";
-$languages[] = "Persian";
-$languages[] = "Phoenician";
-$languages[] = "Pidgin";
-$languages[] = "Pitcairn";
-$languages[] = "Polish";
-$languages[] = "Portuguese";
-$languages[] = "Punjabi";
-$languages[] = "Quechua (Kechwa)";
-$languages[] = "Rasta (Patois)";
-$languages[] = "Romanian";
-$languages[] = "Romansch";
-$languages[] = "Romany";
-$languages[] = "Russian";
-$languages[] = "Sanskrit";
-$languages[] = "Sardinian";
-$languages[] = "Saxon";
-$languages[] = "Scots";
-$languages[] = "Serbian";
-$languages[] = "Sinhalese";
-$languages[] = "Slovak";
-$languages[] = "Slovenian";
-$languages[] = "Spanish";
-$languages[] = "Sranan";
-$languages[] = "Sudanese";
-$languages[] = "Swabian";
-$languages[] = "Swahili";
-$languages[] = "Swedish";
-$languages[] = "Tagalog";
-$languages[] = "Talossan (designed)";
-$languages[] = "Tamil";
-$languages[] = "Telugu";
-$languages[] = "Thai";
-$languages[] = "Tlingit";
-$languages[] = "Turkish";
-$languages[] = "Ukranian";
-$languages[] = "Urdu";
-$languages[] = "Viennese";
-$languages[] = "Vietnamese";
-$languages[] = "Welsh";
-$languages[] = "Wu";
-$languages[] = "Yiddish";
-$languages[] = "Amharic";
-$languages[] = "Laos";
-$languages[] = "Philippines";
-$languages[] = "Hindi";
-$languages[] = "Farsi";
-$languages[] = "Swiss German";
-$languages[] = "Bambara";
-$languages[] = "Chinese";
-$languages[] = "English";
-$languages[] = "Somali";
-$languages[] = "Tajik";
-$languages[] = "Portuguese- Spanish";
-$languages[] = "Italian- Spanish";
-$languages[] = "Spanish- French- Portuguese";
-$languages[] = "French- Portuguese";
-$languages[] = "Taiwanese";
-$languages[] = "Tigrinya";
-$languages[] = "Bosnian";
-$languages[] = "Marathi";
 
-// get the q parameter from URL
-$q = $_REQUEST["q"];
+if(!(empty($_POST['keyword']))){
+    
 
-$hint = "";
-
-// lookup all hints from array if $q is different from "" 
-if ($q !== "") {
-    //$q = strtolower($q);
-    $len=strlen($q);
-    foreach($languages as $language) {
-        if (stristr($q, substr($language, 0, $len))) {
-            if ($hint === "") {
-                $hint = $language;
-            } else {
-                $hint .= ", $language";
-            }
-        }
+    $params = array($_POST['keyword']);
+    $options = array( "Scrollable" => 'static' );
+    $query ="SELECT Top 4 Language, LanguageID FROM Languages WHERE Language like '" . $_POST["keyword"] . "%' ORDER BY Language";
+    $stmt = sqlsrv_query($con, $query, $params, $options);
+    if ($stmt === false)
+        die(print_r(sqlsrv_errors(), true));
+    $languages = [];
+    $ids = [];
+    while (sqlsrv_fetch($stmt) === true)
+    {
+        $languages[] = sqlsrv_get_field($stmt, 0);
+        $ids[] = sqlsrv_get_field($stmt, 1);
     }
-}
+    $length = sqlsrv_num_rows($stmt);
 
-// Output "no suggestion" if no hint was found or output correct values 
-echo $hint === "" ? "no suggestion" : $hint;
-?>
\ No newline at end of file
+    if(!empty($languages)) {
+    ?>
+        <ul id="language-list">
+        <?php
+            for($i = 0; $i < $length; $i++) 
+            {
+                ?>
+                <li onClick="selectLanguage('<?=$languages[$i]?>', '<?=$ids[$i]?>');">
+                    <?=$languages[$i]?>
+                </li>
+                <?php 
+            } ?>
+        </ul>
+    <?php } }
+?>
diff --git a/corpus/search/index.php b/corpus/search/index.php
index 8d5fd36..420bfc9 100644
--- a/corpus/search/index.php
+++ b/corpus/search/index.php
@@ -1,4 +1,7 @@
-<?php include '../../base.php'; ?>
+<?php 
+include '../../base.php'; 
+
+?>
 <!DOCTYPE html>
 <html>
 <head>
@@ -10,24 +13,26 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
-    <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
+<!--
     <link href="/css/advancedsearch.css" rel="stylesheet">
-    <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    
-    <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
-    <script type="text/javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
+-->
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
     
     
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     
-    <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet">
-    <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
-    <script type="text/javascript" src="http://netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
-    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
-    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
-    <link rel="stylesheet" type="text/css" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
+    <script type="text/javascript" src="//code.jquery.com/jquery-1.10.2.min.js"></script>
+    <script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
     
+    <script type="text/javascript" src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
+
+    <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
+
+    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
+    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
+    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
     
     
     <!-- Bootstrap -->
@@ -41,14 +46,16 @@
             e.preventDefault();
 
             var controlForm = $('.controls form:first'),
+                container = controlForm.children()
                 currentEntry = $(this).parents('.entry:first'),
                 newEntry = $(currentEntry.clone()).appendTo(controlForm);
 
             newEntry.find('input').val('');
+            newEntry.find('input[name^=offset]').val(0);
             controlForm.find('.entry:not(:last) .btn-add')
                 .removeClass('btn-add').addClass('btn-remove')
-                .removeClass('btn-success').addClass('btn-danger')
-                .html('<span class="glyphicon glyphicon-minus"></span>');
+                .removeClass('btn-primary').addClass('btn-danger')
+                .html('<span>Remove Word</span>');
         }).on('click', '.btn-remove', function(e)
         {
             $(this).parents('.entry:first').remove();
@@ -66,6 +73,14 @@
         });
     </script>
     <style>
+        #language-list{float:left;list-style:none;margin:0;width:100%;padding:0;opacity:1.0;}
+        #language-list li{padding: 10px;background-color: #8b8b8b; border-bottom:#F0F0F0 1px solid;border-width:#F0F0F0 1px solid; opacity:1.0;}
+        #language-list li:hover{background: rgba(56, 110, 128, 1);}
+        
+        #tags-list{float:left;list-style:none;margin:0;width:100%;padding:0;opacity: 1;}
+        #tags-list li{padding: 10px;background-color: #8b8b8b; border-bottom:#F0F0F0 1px solid;border-width:#F0F0F0 1px solid;}
+        #tags-list li:hover{background: rgba(56, 110, 128, 1);}
+        
         .btn-add {
             min-height: 34px;
         }
@@ -73,24 +88,23 @@
             min-height: 34px;
         }
         .btn-primary {
-            float: right; 
-            min-width: 200px;
+            /*float: right; */
+/*
+            max-width:180px;
+*/
             min-height: 34px;
+            position: static;
         }
         .input-group {
-            min-width: 569px;
+            /*min-width: 569px;*/
         }
-    </style>
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/Media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
+        
+        .select {
+            position:relative;
         }
     </style>
+
+
 </head>
     
 <?php
@@ -108,122 +122,435 @@
     {
         ?>
         <body>
-            <div id="header"></div>            
             <div id="wrapper">
                 <div id="sidebar"></div>
                 <div id="page-content-wrapper">
-                    <div class="container-fluid">
-                        <div class="row">
-                            <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                                     <span class="hamb-top"></span>
                                     <span class="hamb-middle"></span>
                                     <span class="hamb-bottom"></span>
                                 </button>
-                                <div class="control-group" id="fields">
-                                <div class="controls"> 
-                                 
-                                <form method="POST" action="../Results/" role="form" autocomplete="off">
-                                    <!--<div class="col-xs-5">
-<button type="submit" class="btn btn-primary" ><span class="glyphicon glyphicon-search" aria-hidden="true"></span></button>
-     THIS WILL SEARCH THE WHOLE FIELD 
-</div>-->
-                                    
-                                    
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-md-12">
+                                <h2 class="pull-right">Gonzaga University Smalltalk Corpus</h2>
+                            </div>
+                        </div>
+                        <hr style="border-top: medium double;">
+                        <div class="row">
+                            <div class="col-md-4">  
+                                
+                                <div class="row">
                                     
-                                    <!--Data entry for Level, Language, Topic-->
-                                    <div class="form-group">
-                                        <select style="width:150px;" class="form-control" name="Level" id="Level">
-                                            <option selected="selected">Level</option>
-                                            <option value="1">1 (099-100)</option>
-                                            <option value="2">2 (101-102)</option>
-                                            <option value="3">3 (103-104)</option>
-                                            <option value="4">4 (105-106)</option>
-                                            <option value="5">5 (107-108)</option>
-                                        </select>
-                                    </div>
-                                    <div class="form-group">
-                                        <input style="width:150px;" class="form-control" type="text" onkeyup="showHint(this.value)" name="Language" id="Language" placeholder="Language" >
-                                    <p>Suggestions: <span id="txtHint"></span></p>
+                                        <!--<div class="form-group row">
+                                            <div class="col-md-10">
+                                                <div class="col-xs-4">
+                                                    <input class="form-control" type="text" id="language-search" name="language-search" placeholder="Language" value="<?php echo isset($_POST['language-search']) ? $_POST['language-search'] : '' ?>">
+                                                    <div id="languages-box"></div>
+                                                </div>
+                                                <div class="col-xs-4">
+                                                    <input class="form-control" type="text" id="topic" name="topic" placeholder="Topic Keywords" value="<?php echo isset($_POST['topic']) ? $_POST['topic'] : '' ?>">
+                                                </div>
+                                                <div class="col-xs-4">
+                                                    <select class="form-control" name="level" id="level">
+                                                        <option selected="selected" value="<?php echo isset($_POST['level']) ? $_POST['level'] : '--Select Level--' ?>"><?php echo isset($_POST['level']) ? $_POST['level'] : '--Select Level--' ?></option>
+                                                        <option value="Entry">Entry</option>
+                                                        <option value="Basic">Basic</option>
+                                                        <option value="Intermediate">Intermediate </option>
+                                                        <option value="Advanced">Advanced</option>
+                                                        <option value="Seminar">Seminar</option>
+                                                    </select>
+                                                </div>
+                                            </div>
+                                        </div>-->
+                                        <div class="panel panel-primary" style="min-height:600px;max-height:600px; overflow-y:auto">
+                                            <div class="panel-heading">
+                                                <h4>Add to Search Query<span><a href= "javascript:window.open('info.php','Gonzaga University Corpus Info','width=700,height=650')" target="_blank" class="pull-right"><class="text-muted">Input Instructions</a></span></h4> 
+                                            </div>
+                                            <div class="panel-body">
+                                                
+                                                <div class="row">
+                                                    <div class="col-md-10">
+                                                        <h4>Load in a word:</h4>
+                                                    </div>
+                                                </div>
+                                                <form method="POST" action="" id="word_load">
+                                                <div class="row">
+                                                    <div class="col-xs-8">
 
-                                    </div>
+                                                        <input type="text" class="form-control" name="new_word" placeholder="Type a word to search">                    
+                                                    </div>
+                                                    
+                                                </div>
+                                                <br>
+                                                <div class="row">
+                                                    <div class="col-xs-4">
+                                                        <span class="input-group-btn">
+                                                            <button class="btn btn-primary pull-right" type="button" name="new_word_button">
+                                                                <span>Send to selector =></span>
+                                                            </button>
+                                                        </span>
+                                                    </div>
+                                                    <div class="col-xs-4">
+                                                        <span class="input-group-btn">
+                                                            <button class="btn btn-primary pull-right" type="button" name="full_new_word_button">
+                                                                <span>Send to query builder ==></span>
+                                                            </button>
+                                                        </span>
+                                                    </div> 
+                                                </div>
+                                                
+                                                <br>
+                                                </form>
+                                                <hr>
+                                                <div class="row">
+                                                    <div class="col-md-10">
+                                                        <h4>Load in a part-of-speech tag:</h4>
+                                                    </div>
+                                                </div>
+                                                <form method="POST" action="" id="tag_load">
+                                                <div class="row">
+                                                    <div class="col-xs-8">
 
-       
-                                    <div class="form-group">
-                                        <input style="width:150px;" class="form-control" type="text" name="Topic" id="Topic" placeholder="Topic" >
-                                    </div>
-                                    <div class="entry col-lg-10">
-                                        <div class="container">
-                                            <label for="contain">Word Search</label>
-                                            <div class="word filter">
-                                                <!--<div class="row">-->
-                                                    <div class="col-md-12">
-                                                        <div class="input-group" id="adv-search">
-                                                            <span class="input-group-btn">
-                                                            <button class="btn btn-success btn-add" type="button">
-                                                            <span class="glyphicon glyphicon-plus"></span>
+                                                        <select class="form-control" name="new_tag">
+                                                            <option selected="selected" value="ALL">Full Tagset (20 Most Frequent)</option>
+                                                            <option value="Noun">Noun</option>
+                                                            <option value="Pronoun">Pronoun</option>
+                                                            <option value="Verb">Verb</option>
+                                                            <option value="Adjective">Adjective</option>
+                                                            <option value="Adverb">Adverb</option>
+                                                            <option value="Preposition">Preposition</option>
+                                                            <option value="Conjunction">Conjunction</option>
+                                                            <option value="Determiner">Determiner</option>
+                                                            <option value="Interjection">Interjection</option>
+                                                            <option value="Other">Other</option>
+                                                            
+                                                        </select>
+                                                    </div>
+                                                </div>
+                                                <br>
+                                                <div class="row">
+                                                    
+                                                    <div class="col-xs-4">
+                                                        <span class="input-group-btn">
+                                                            <button class="btn btn-primary" type="button" name="new_tag_button">
+                                                                <span>Send to selector =></span>
+                                                            </button>
+                                                        </span>
+                                                    </div>
+                                                    <div class="col-xs-4">
+                                                        <span class="input-group-btn">
+                                                            <button class="btn btn-primary" type="button" name="full_new_tag_button">
+                                                                <span>Send to query builder ==></span>
                                                             </button>
-                                                            </span>
-                                                            <input type="text" class="form-control" name="words[]" placeholder="Search for a word">
-                                                            <div class="input-group-btn">
-                                                                <div class="btn-group" role="group">
-                                                                    <div class="dropdown dropdown-lg">
-                                                                        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><span class="caret"></span></button>
-                                                                        <div class="dropdown-menu dropdown-menu-right" role="menu">
-
-                                                                            <div class="form-group">
-                                                                                <label for="PoS">Part of Speech</label>
-                                                                                <select class="form-control" name="PoS[]" id="PoS">
-                                                                                    <option value="Verb">Verb</option>
-                                                                                    <option value="Noun">Noun</option>
-                                                                                    <option value="Pronoun">Pronouns</option>
-                                                                                </select>
-                                                                            </div>                                          
-                                                                        </div>
-                                                                    </div>
-                                                                </div>
-                                                            </div>
-                                                        </div>
+                                                        </span>
                                                     </div>
-                                                <!--</div>-->
+                                                </div>
+                                                </form>
+                                                <hr>
+                                                
+                                                
+                                                </form>
                                             </div>
-                                            
                                         </div>
+                                        <!--<div class="entry form-group"> 
+                                            <div class="col-md-10">
+                                                <div class="col-xs-4">
+                                                    <span class="input-group-btn">
+                                                        <button class="btn btn-primary btn-add" type="button">
+                                                            <span>Add a Word</span>
+                                                        </button>
+                                                    </span>   
+                                                </div>
+                                                <div class="col-xs-4">
+                                                    <input type="text" class="form-control" name="words[]" placeholder="Word">                                             
+                                                </div>
+                                                <div class="col-xs-4">
+                                                    <span class="input-group-btn">
+                                                        <button class="btn btn-primary" >
+                                                            <span>Load word into selector</span>
+                                                        </button>
+                                                    </span>
+                                                </div>
+                                                <div class="col-xs-5">
+                                                    <input class="form-control" name="PoS[]" id="PoS[]" placeholder="Part of Speech">
+                                                    <div class="btn-group" id="PoS-suggest" ></div>
+                                                </div>
+
+                                                <div class="col-xs-3">
+                                                    <label><input class="form-control" type="number" min="0" value=0 id="offset[]" name="offset[]" placeholder="Word Offset"></label>
+                                                </div>
+                                                
+                                            </div>
+                                        </div> -->
+
+
+
+                                </div>
+
+                            </div>
+                            <div class="col-md-4">
+                                <div class="panel panel-primary" style="min-height:600px;max-height:600px; overflow-y:auto">
+                                    <div class="panel-heading">
+                                        <h4>Select <span><a href= "javascript:window.open('http://ucrel.lancs.ac.uk/claws7tags.html','width=700,height=650')" target="_blank" class="pull-right"><class="text-muted">About the CLAWS7 Tagset</a></span></h4> 
+                                    </div>
+                                    <div class="panel-body">
+                                        <form method="POST" action="" id="SubmitNewEntity" autocomplete="off">
                                         
+                                            <div class="row">
+                                                <div class="col-md-12">
+                                                    <button class='btn btn-danger' type="button" name="ClearSelector">Clear field</button>    
+                                                    <button type="button" class="btn btn-primary pull-right" name="SubmitSelector">Move to Search Builder ==></button>
+                                                </div>
+                                            </div>
+                                            <div class="row">
+                                                <div class="col-xs-10" id="LoadingInfo"></div>
+                                            </div>
+                                            <div name="DynamicField">
+
+                                                    <?php
+               
+
+                
+
+            ?>
+                                            </div>
+                                        </form>
                                     </div>
-                                    
-                                    
-          
+                                </div>
+                            </div>
+                            <div class="col-md-4">
+                                <div class="panel panel-primary" style="min-height:600px;max-height:600px; overflow-y:auto">
+                                    <div class="panel-heading">
+                                        <h4>Build Search Query</h4>
+                                    </div>
+                                    <form method="POST" action="/Corpus/Results/" name="SubmitSearch">
+                                        <div class="panel-body" style="height:100%">
+                                            <div class="row">
+                                                <div class="col-md-10">
+                                                    <button class="btn btn-primary" type="submit">Submit Search</button>
+                                                    <div class="pull-right">
+                                                        <label class="radio-inline"><input type="radio" name="searchType">Sequential</label>
+                                                        <label class="radio-inline"><input type="radio" name="searchType" checked="checked">Non-Sequential</label>
+                                                    </div>
+                                                </div>
+                                            </div>
 
+                                            <table class="table table-hover" id="sortParams">
+                                                <thead>
+                                                    <tr>
+                                                        <th>Type</th>
+                                                        <th>Content</th>
+                                                        <th>Action</th>
+                                                    </tr>
+                                                </thead>
+                                                <tbody>
 
-</form>
+                                                </tbody>
+                                            </table>
+                                        </div>
+                                    </form>
+                                    <div class="panel-footer" style="position:absolute; width:95%; bottom:0;">
+                                        <form method="POST" onsubmit="addOffset">
+                                            <div class="row">
+                                                <div class="col-md-12 pull-right">
+                                                
+                                                    <label>Add a placeholder:<input class="form-control" type="number" min="0" max="8" value="0" id="newOffset" name="addOffset"></label>
+                                                    <button class="btn btn-primary" id="addOffsetButton" type="button" >Add to Search Query</button>
+                                                </div>
+                                            </div>
+                                        </form>
+
+                                    </div>
+                                </div>
+                            </div>
                         </div>
-                    </div>
-                </div>
-            </div>
+                        
+
 
         
 </div>
 </div>
 </div>
+            <script type="text/javascript">
+            
+            /*var fixHelper = function(e, ui) {
+                ui.children().each(function() {
+                    $(this).width($(this).width());
+                });
+                return ui;
+            };*/
+            
+            /*$("#sortParams tbody").sortable({
+                helper: fixHelper
+            }).disableSelection();*/
+            </script>
             <script>
+            var numOffsets = 0; 
+            
+            $(document).ready(function() {
+                $("#addOffsetButton").click(function() {
+                    var offsetVal = $("#newOffset").val();
+                    
+                    
+                    var before = '<tr><td>offset</td><td>';
+                    var after = "</td><td><button class='btn btn-danger' type='button' name='DeleteRow'>Delete</button></td>";
+                    var formDataOne = "<input hidden type='text' value='";
+                    var formDataTwo = "' name='offset[";
+                    var formDataThree = "]'></tr>";
+                    
+                    var toAdd = before + offsetVal + after + formDataOne + offsetVal + formDataTwo + numOffsets + formDataThree;
+                    if (offsetVal == 0)
+                        return false;
+
+                    numOffsets = numOffsets + 1;
+                    $("#sortParams").append(toAdd);
+                });
+            });
             
-            function showHint(str) {
-                if (str.length == 0) { 
-                    document.getElementById("txtHint").innerHTML = "";
-                    return;
-                } else {
-                    var xmlhttp = new XMLHttpRequest();
-                    xmlhttp.onreadystatechange = function() {
-                        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
-                            document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
+            $(document).ready(function() {
+                $("button[name='ClearSelector']").click(function() {
+                    $("div[name='DynamicField']").empty();
+                });
+            });
+            $(document).ready(function() {
+                $("button[name='SubmitSelector']").click(function() {
+                    $(this).prop("disabled",true);
+                    var words = [];
+                    var searchedword = $("input[name='searchedword']").val();
+                    
+                    $("input[name^='checkwords']").each(function() {
+                        if ($(this).is(':checked')) {
+                            words.push($(this).val());
+                        }
+                    });
+                    var tags = [];
+                    $("input[name^='checktags']").each(function() {
+                        if ($(this).is(':checked')) {
+                            tags.push($(this).val());
+                        }
+                    });
+                    var num_words = words.length;
+                    var num_tags = tags.length;
+                    if (num_words > 0) {
+                        $.ajax({
+                            type: "POST",
+                            url: "buildrow.php",
+                            data: {
+                                'words' : words,
+                                'searchedword' : searchedword
+                            },
+                            success: function(data){
+                                $("div[name='DynamicField']").empty();
+                                $("#sortParams tbody").append(data);
+                                
+                            }
+                        });
+                        $(this).prop("disabled",false);
+                    }
+                    else 
+                    {
+                        if (num_tags > 0) {
+                            $.ajax({
+                                type: "POST",
+                                url: "buildtagrow.php",
+                                data: {
+                                    'tags' : tags
+                                },
+                                success: function(data){
+                                    $("div[name='DynamicField']").empty();
+                                    $("#sortParams tbody").append(data);
+                                }
+                            });
+                            $(this).prop("disabled",false);
                         }
-                    };
-                    xmlhttp.open("GET", "getlanguage.php?q=" + str, true);
-                    xmlhttp.send();
-                }
-            }
+                        else 
+                        {
+                            if ( (num_tags == 0) && (num_words == 0))
+                            {
+                                alert("Please select at least one entry, or clear the list");
+                                $(this).prop("disabled",false);
+                                return false;
+                            }
+                        }
+                    }
+                    
+                    
+                    
+
+                    
+                });
+            });
+                
+            $(document).on("click", "button[name='DeleteRow']", function() {
+                $(this).closest('tr').remove();
+
+            });
+                
+            $(document).ready(function(){
+                $("#language-search").keyup(function(){
+                    $.ajax({
+                    type: "POST",
+                    url: "getlanguage.php",
+                    data:'keyword='+$(this).val(),
+                    
+                    success: function(data){
+                        $("#languages-box").show();
+                        $("#languages-box").html(data);
+                    }
+                    });
+                });
+            });
+            
+            $('input[name="new_word"]').keypress(function(e){
+                if (e.which == 13) return false;
+            });
+            
+            $(document).on("click", "button[name='new_word_button']", function(e){
+                e.preventDefault();
+                $(this).prop("disabled",true);
+                var wordVal = $("input[name='new_word']").val();
+                $("div[name='DynamicField']").empty();
+                $("#LoadingInfo").append("<strong>loading...</strong>");
+                $.ajax({
+                    type: "POST",
+                    url: "populatewords.php",
+                    data:'new_word='+wordVal,
+
+                    success: function(data){
+                        $("#LoadingInfo").empty();
+                        $("input[name=new_word]").val('');
+                        
+                        $("div[name='DynamicField']").html(data);
+                    }
+                });
+                $(this).prop("disabled",false);
+            });
+                
+            $(document).on("click", "button[name='new_tag_button']", function(e){
+                e.preventDefault();
+                $(this).prop("disabled",true);
+                var tagVal = $("select[name='new_tag']").val();
+                $("div[name='DynamicField']").empty();
+                $("#LoadingInfo").append("<strong>loading...</strong>");
+                $.ajax({
+                    type: "POST",
+                    url: "populatetags.php",
+                    data:'new_tag='+tagVal,
+                    success: function(data){
+                        $("#LoadingInfo").empty();
+                        $("input[name=new_tag]").val('');
+                        $("div[name='DynamicField']").html(data);
+                    }
+                });
+                $(this).prop("disabled",false);
+                $(this).prop("selected",false);
+            });
             
+            $(document).on("change", "#checkAll", function(e){
+                e.preventDefault();
+                $("input:checkbox").prop('checked', $(this).prop("checked"));
+            });
             </script>
 </body>
     <?php
diff --git a/corpus/search/info.php b/corpus/search/info.php
new file mode 100644
index 0000000..6e4c0a1
--- /dev/null
+++ b/corpus/search/info.php
@@ -0,0 +1,69 @@
+<?php include '../../base.php'; ?>
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Gonzaga Small Talk</title>
+    
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+<!--
+    <link href="/css/advancedsearch.css" rel="stylesheet">
+-->
+    <link href="/FlatUI/css/corpus/theme.css" rel="stylesheet" media="screen">
+    
+    
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    
+    <script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
+    
+
+
+</head>
+    
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if( !(($_SESSION['Role'] == 'Admin') || ($_SESSION['Role'] == 'Teacher') ))
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        ?>
+        <body>
+            <div class="container-fluid">
+                <div class="panel panel-primary">
+                    <div class="panel-heading">
+                        Corpus Input Guidelines
+                    </div>
+                    <div class="panel-body">
+                        TEXT
+                    </div>
+                </div>
+</body>
+    <?php
+    }
+}
+else
+{
+    ?>
+    <!-- To Do: Add alternate corpus view section -->
+    <p>Oops! You are not logged in. We do not yet support access to the corpus without authorization from our administrators.</p>
+    <p>Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+
+
+</html>
\ No newline at end of file
diff --git a/corpus/search/populatetags.php b/corpus/search/populatetags.php
new file mode 100644
index 0000000..d606c2d
--- /dev/null
+++ b/corpus/search/populatetags.php
@@ -0,0 +1,68 @@
+<?php
+// Array with names
+
+include '../../base.php';
+
+if (!(empty($_POST['new_tag'])))
+{
+?>
+    <table class='table table-hover'><thead><tr>
+    <th><label><input type='checkbox' id='checkAll'> Select All </label></th><th>Tag Name</th><th>Tag Type</th><th>Frequency</th>
+    </tr></thead><tbody>
+<?php
+    
+    if ($_POST['new_tag'] == "ALL")
+    {
+        $query = "SELECT TOP 20 Frequency, Tag, TagType FROM CLAWS7 ORDER BY Frequency desc";
+        $params = array();
+    }
+    else
+    {
+        $query = "SELECT Frequency, Tag, TagType FROM CLAWS7 WHERE TagType = ? ORDER BY Frequency desc";
+        $params = array($_POST['new_tag']);
+    }
+
+    $options = array( "Scrollable" => 'static' );
+    
+    $stmt = sqlsrv_query($con, $query, $params, $options);
+    if ($stmt === false)
+        die(print_r(sqlsrv_errors(), true));
+    $length = sqlsrv_num_rows($stmt);
+    $tag_names = [];
+    $tag_type = [];
+    $frequency = [];
+
+    while (sqlsrv_fetch($stmt) === true)
+    {
+        $frequency[] = sqlsrv_get_field($stmt, 0);
+        $tag_names[] = sqlsrv_get_field($stmt, 1);
+        $tag_type[] = sqlsrv_get_field($stmt, 2);
+
+    }
+
+    for ($i = 0; $i < $length; $i++)
+    {
+        $tag = $tag_names[$i];
+        $freq = $frequency[$i];
+        $type = $tag_type[$i];
+        ?>
+        <tr>
+            <td><input type='checkbox' name='checktags[]' value="<?=$tag?>"></td>
+            <td><?=$tag?></td>
+            <td><?=$type?></td>
+            <td><?=$freq?></td>
+            <input hidden type="text" name="tags[]" value="<?=$tag?>">
+            <?php
+    }?>
+    </tbody></table>
+<?php
+}
+
+else
+{
+?>
+<p>No data received</p>
+<?php
+}
+
+?>
diff --git a/corpus/search/populatewords.php b/corpus/search/populatewords.php
new file mode 100644
index 0000000..aedeaa4
--- /dev/null
+++ b/corpus/search/populatewords.php
@@ -0,0 +1,74 @@
+<?php
+// Array with names
+
+include '../../base.php';
+
+if (!(empty($_POST['new_word'])))
+{
+    $query_valid = false;
+    if ( strlen($_POST['new_word']) > 0 )
+        $query_valid = true;
+
+    if ( $query_valid)
+    {
+    ?>
+        <table class='table table-hover'><thead><tr>
+        <th><label><input type='checkbox' id='checkAll'> Select All </label></th><th>Form</th><th>Tag</th><th>Type</th><th>Frequency</th></tr></thead>
+        <?php
+        $query = "SELECT D.WordID, D.Form, D.PoS, C.TagType, D.Frequency FROM Dictionary D, CLAWS7 C WHERE D.Form= ? AND C.Tag = D.PoS";
+
+        $options = array( "Scrollable" => 'static' );
+        $params = array($_POST['new_word']);
+        $word = $_POST['new_word'];
+        
+
+        $stmt = sqlsrv_query($con, $query, $params, $options);
+        if ($stmt === false)
+            die (print_r(sqlsrv_errors(), true));
+        $result_length = sqlsrv_num_rows($stmt);
+        $ids = [];
+        $forms = [];
+        $tags = [];
+        $tagtypes = [];
+        $freq = [];
+        while (sqlsrv_fetch($stmt) === true)
+        {
+            $ids[] = sqlsrv_get_field($stmt, 0);
+            $forms[] = sqlsrv_get_field($stmt, 1);
+            $tags[] = sqlsrv_get_field($stmt, 2);
+            $tagtypes[] = sqlsrv_get_field($stmt, 3);
+            $freq[] = sqlsrv_get_field($stmt, 4);
+        }
+        ?>
+            <tbody>
+                <input hidden name="searchedword" value="<?=$word?>">
+        <?php
+        for ($i = 0; $i < $result_length; $i++)
+        {
+            $id = $ids[$i];
+            ?>
+            <tr>
+                
+                <td><input type="checkbox" name="checkwords[]" value="<?=$id?>"></td>
+                <td><?=$forms[$i]?></td>
+                <td><?=$tags[$i]?></td>
+                <td><?=$tagtypes[$i]?></td>
+                <td><?=$freq[$i]?></td>
+                <input hidden type="text" name="words[]" value="<?=$id?>">
+                
+            </tr>
+            <?php
+        }
+        ?>
+            </tbody></table>
+
+<?php
+    }
+    else
+    {
+        ?>
+        <p>No data received</p>
+<?php
+    }
+}
+?>
diff --git a/corpus/search/suggestPartOfSpeech.php b/corpus/search/suggestPartOfSpeech.php
new file mode 100644
index 0000000..321c91a
--- /dev/null
+++ b/corpus/search/suggestPartOfSpeech.php
@@ -0,0 +1,46 @@
+<?php
+// Array with names
+
+include '../../base.php';
+
+
+if(!(empty($_POST['keyword']))){
+    
+
+    $params = array($_POST['keyword']);
+    $options = array( "Scrollable" => 'static' );
+    $query ="SELECT Top 6 Tag FROM [CLAWS7] WHERE Tag like '" . $_POST["keyword"] . "%' ORDER BY Tag";
+    $stmt = sqlsrv_query($con, $query, $params, $options);
+    if ($stmt === false)
+        die(print_r(sqlsrv_errors(), true));
+    $tags = [];
+/*
+    $ids = [];
+*/
+    while (sqlsrv_fetch($stmt) === true)
+    {
+        $tags[] = sqlsrv_get_field($stmt, 0);
+/*
+        $ids[] = sqlsrv_get_field($stmt, 1);
+*/
+    }
+    $length = sqlsrv_num_rows($stmt);
+
+    if(!empty($tags)) {
+    ?>
+        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+            See Suggestions <span class="caret"></span>
+        </button>
+        <ul id="tags-list" class="dropdown-menu">
+        <?php
+            for($i = 0; $i < $length; $i++) 
+            {
+                ?>
+                <li onClick="selectTag('<?=$tags[$i]?>');">
+                    <?=$tags[$i]?>
+                </li>
+                <?php 
+            } ?>
+        </ul>
+    <?php } }
+?>
diff --git a/corpus/search/tagset.php b/corpus/search/tagset.php
new file mode 100644
index 0000000..0f3af4b
--- /dev/null
+++ b/corpus/search/tagset.php
@@ -0,0 +1,107 @@
+<?php include '../../base.php'; ?>
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Gonzaga Small Talk</title>
+    
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+<!--
+    <link href="/css/advancedsearch.css" rel="stylesheet">
+-->
+    <link href="/FlatUI/css/corpus/theme.css" rel="stylesheet" media="screen">
+    
+    
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    
+    <script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
+    
+
+
+</head>
+    
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if( !(($_SESSION['Role'] == 'Admin') || ($_SESSION['Role'] == 'Teacher') ))
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        $params = array();
+        $options = array( "Scrollable" => 'static' );
+        $query = "SELECT * FROM CLAWS7";
+        $stmt = sqlsrv_query($con, $query, $params, $options);
+        if ($stmt === false)
+            die(print_r(sqlsrv_errors(), true));
+        $tag_names = [];
+        $tag_desc = [];
+        $num_rows = sqlsrv_num_rows($stmt);
+        
+        while (sqlsrv_fetch($stmt) === true)
+        {
+            $tag_names[] = sqlsrv_get_field($stmt, 0);
+            $tag_desc[] = sqlsrv_get_field($stmt, 1);
+        }
+        
+        
+            
+        ?>
+        <body>
+            <div class="container-fluid">
+                <div class="panel panel-primary">
+                    <div class="panel-heading">
+                        CLAWS7 Tagset
+                    </div>
+                    <div class="panel-body">
+                        <table class="table table-hover">
+                            <thead>
+                                <tr>
+                                    <th>Tag</th>
+                                    <th>Description</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                            <?php
+        for($i = 0; $i < $num_rows; $i++)
+        {
+            ?>
+                                <tr>
+                                    <td><?=$tag_names[$i]?></td>
+                                    <td><?=$tag_desc[$i]?></td>
+                                </tr>
+                                <?php
+        }?>
+                            
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+</body>
+    <?php
+    }
+}
+else
+{
+    ?>
+    <!-- To Do: Add alternate corpus view section -->
+    <p>Oops! You are not logged in. We do not yet support access to the corpus without authorization from our administrators.</p>
+    <p>Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+
+
+</html>
\ No newline at end of file
diff --git a/corpus/searchdisplay.html b/corpus/searchdisplay.html
index e502d30..a939a97 100644
--- a/corpus/searchdisplay.html
+++ b/corpus/searchdisplay.html
@@ -4,9 +4,9 @@
   <title>Bootstrap Case</title>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
-  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
-  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
+  <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
+  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
+  <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
 
 <style>
 table, th, td {
diff --git a/corpus/searchdisplay.php b/corpus/searchdisplay.php
index aaf80f3..6e49630 100644
--- a/corpus/searchdisplay.php
+++ b/corpus/searchdisplay.php
@@ -14,7 +14,7 @@
     <link href="/css/SidebarPractice.css" rel="stylesheet">
 
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -229,7 +229,7 @@
             </div>
 
             <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
             <!-- Include all compiled plugins (below), or include individual files as needed -->
             <script src="/js/bootstrap.min.js"></script>
             <script>
diff --git a/corpus/sidebar.php b/corpus/sidebar.php
deleted file mode 100644
index b4ed0db..0000000
--- a/corpus/sidebar.php
+++ /dev/null
@@ -1,68 +0,0 @@
-<?php include "../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-    <head>
-        <meta charset="utf-8">
-        <meta http-equiv="X-UA-Compatible" content="IE=edge">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-        <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-        
-        <!-- Bootstrap -->
-        <link href="/css/bootstrap.css" rel="stylesheet">
-        <link href="/css/simple-sidebar.css" rel="stylesheet">
-    </head>
-    
-    <?php
-    if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-    {
-        if( ($_SESSION['Role'] == 'admin') || ($_SESSION['Role'] == 'teacher') )
-        {
-            ?>
-            <body>
-            <div id="wrapper">
-                <div id="sidebar-wrapper">
-                    <u1 class="sidebar-nav">
-                        <li class="sidebar-brand">
-                            <a href="/<?=$_SESSION['Role']?>/Home/">Home</a>
-                        </li>
-                        <li class="sidebar-brand">
-                            <a href="#">Tag Search</a>
-                        </li>
-                        <li class="sidebar-brand">
-                            <a href="#">Annotation Editor</a>
-                        </li>
-                        <li class="sidebar-brand">
-                            <a href="#">Graphical Analysis</a>
-                        </li>
-
-                        <li class="sidebar-brand">
-                            <a href="#">Help</a>
-                        </li>
-
-                    </u1>    
-
-                </div>
-            </div>
-            </body>
-        <?php
-        }
-        else
-        {
-            ?>
-            
-            <!-- Reroute to log-in page if there bad log-in detected -->
-            <meta http-equiv='refresh' content='5;/' />
-            <p>Your account does not have authorization to view this page.</p>
-            <p>Rerouting to your home page.  Click <a href='/'>here</a> if you don't want to wait.</p>
-            <?php
-            
-        }                 
-    }
-    else
-    {
-        ?>
-        <meta http-equiv="refresh" content='0;/' />
-        <?php
-    }
-    ?>    
-</html>
\ No newline at end of file
diff --git a/corpus/testwordpage.html b/corpus/testwordpage.html
index 4c7cfea..ee2d912 100644
--- a/corpus/testwordpage.html
+++ b/corpus/testwordpage.html
@@ -23,7 +23,7 @@
   xmlhttp.send();
 }
 </script>
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script>
         $(function(){
             $("#header").load("header.html");
@@ -37,12 +37,12 @@
 <div id="header"></div>
 <form>
 <p> </p>  
-<a href="http://smalltalkphp.azurewebsites.net/text_corpus_login.html"><p style="text-align: right">Log Out</a> 
+<a href="//smalltalkphp.azurewebsites.net/text_corpus_login.html"><p style="text-align: right">Log Out</a> 
 <p> </p>
 <center>Word Search</center>
 <p></p>
 <p> </p>
-<a href="http://smalltalkphp.azurewebsites.net/Briantitlepage.html">Return to Table of Contents</a>
+<a href="//smalltalkphp.azurewebsites.net/Briantitlepage.html">Return to Table of Contents</a>
 <p> </p>
 Please enter a word: (ex. money) <br>  
 <input type="text" size="30" onkeyup="showResult(this.value)">
diff --git a/corpus/text_corpus_login.html b/corpus/text_corpus_login.html
index 20bb1b7..8564f04 100644
--- a/corpus/text_corpus_login.html
+++ b/corpus/text_corpus_login.html
@@ -18,7 +18,7 @@
         <link href="css/bootstrap.css" rel="stylesheet">
         
         <!-- Including Header-->
-        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+        <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
         <script>
             $(function(){
                 $("#header").load("header.html");
@@ -44,21 +44,21 @@ <h2 class="form-signin-heading">Corpus Login</h2>
                           </label>
                         </div>
                         <div class="col-xs-4">
-                            <button class="btn btn-lg btn-primary btn-block" type="submit" value="Login" href="http://smalltalkphp.azurewebsites.net/Briantitlepage.html">Login</button>
+                            <button class="btn btn-lg btn-primary btn-block" type="submit" value="Login" href="//smalltalkphp.azurewebsites.net/Briantitlepage.html">Login</button>
                         </div>
                     </form>
                 </div>
             </div>
             <p>
                 <!-- This is the link to our table of contents -->
-                <a href="http://smalltalkphp.azurewebsites.net/Briantitlepage.html">Search Database for a word</a>
+                <a href="//smalltalkphp.azurewebsites.net/Briantitlepage.html">Search Database for a word</a>
             </p>
         </div>
     </body>
 
     
     <!--<p> </p>  
-    <a href="http://smalltalkphp.azurewebsites.net/text_corpus_login.html"><p style="text-align: right">Log Out</a> 
+    <a href="//smalltalkphp.azurewebsites.net/text_corpus_login.html"><p style="text-align: right">Log Out</a> 
     <p> </p> -->
 
 
@@ -95,7 +95,7 @@ <h2 class="form-signin-heading">Corpus Login</h2>
     <p> </p>
 
     <!-- This is the link to our table of contents
-    <a href="http://smalltalkphp.azurewebsites.net/corpus/index.html">Corpus Home</a>
+    <a href="//smalltalkphp.azurewebsites.net/corpus/index.html">Corpus Home</a>
     <p> </p> -->
     </body>
 </html>
diff --git a/css/SidebarPractice.css b/css/SidebarPractice.css
index 172053a..8154813 100644
--- a/css/SidebarPractice.css
+++ b/css/SidebarPractice.css
@@ -97,28 +97,28 @@ html { height: 100%;}
     background-color: #1a1a1a;
 }
 .sidebar-nav li:nth-child(2):before {
-    background-color: #ec1b5a;   
+    background-color: #28e1bd;   
 }
 .sidebar-nav li:nth-child(3):before {
-    background-color: #79aefe;   
+    background-color: #28e1bd;   
 }
 .sidebar-nav li:nth-child(4):before {
-    background-color: #314190;   
+    background-color: #28e1bd;   
 }
 .sidebar-nav li:nth-child(5):before {
-    background-color: #279636;   
+    background-color: #28e1bd;   
 }
 .sidebar-nav li:nth-child(6):before {
-    background-color: #7d5d81;   
+    background-color: #28e1bd;   
 }
 .sidebar-nav li:nth-child(7):before {
-    background-color: #ead24c;   
+    background-color: #28e1bd;   
 }
 .sidebar-nav li:nth-child(8):before {
-    background-color: #2d2366;   
+    background-color: #28e1bd;   
 }
 .sidebar-nav li:nth-child(9):before {
-    background-color: #35acdf;   
+    background-color: #28e1bd;   
 }
 .sidebar-nav li:hover:before,
 .sidebar-nav li.open:hover:before {
diff --git a/css/bootstrap/bootstrap-editable.css b/css/bootstrap/bootstrap-editable.css
new file mode 100644
index 0000000..eaef0de
--- /dev/null
+++ b/css/bootstrap/bootstrap-editable.css
@@ -0,0 +1,663 @@
+/*! X-editable - v1.5.1 
+* In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
+* http://github.com/vitalets/x-editable
+* Copyright (c) 2013 Vitaliy Potapov; Licensed MIT */
+.editableform {
+    margin-bottom: 0; /* overwrites bootstrap margin */
+}
+
+.editableform .control-group {
+    margin-bottom: 0; /* overwrites bootstrap margin */
+    white-space: nowrap; /* prevent wrapping buttons on new line */
+    line-height: 20px; /* overwriting bootstrap line-height. See #133 */
+}
+
+/* 
+  BS3 width:1005 for inputs breaks editable form in popup 
+  See: https://github.com/vitalets/x-editable/issues/393
+*/
+.editableform .form-control {
+    width: auto;
+}
+
+.editable-buttons {
+   display: inline-block; /* should be inline to take effect of parent's white-space: nowrap */
+   vertical-align: top;
+   margin-left: 7px;
+   /* inline-block emulation for IE7*/
+   zoom: 1; 
+   *display: inline;
+}
+
+.editable-buttons.editable-buttons-bottom {
+   display: block; 
+   margin-top: 7px;
+   margin-left: 0;
+}
+
+.editable-input {
+    vertical-align: top; 
+    display: inline-block; /* should be inline to take effect of parent's white-space: nowrap */
+    width: auto; /* bootstrap-responsive has width: 100% that breakes layout */
+    white-space: normal; /* reset white-space decalred in parent*/
+   /* display-inline emulation for IE7*/
+   zoom: 1; 
+   *display: inline;   
+}
+
+.editable-buttons .editable-cancel {
+   margin-left: 7px; 
+}
+
+/*for jquery-ui buttons need set height to look more pretty*/
+.editable-buttons button.ui-button-icon-only {
+   height: 24px; 
+   width: 30px;
+}
+
+.editableform-loading {
+    background: url('../img/loading.gif') center center no-repeat;  
+    height: 25px;
+    width: auto; 
+    min-width: 25px; 
+}
+
+.editable-inline .editableform-loading {
+    background-position: left 5px;      
+}
+
+ .editable-error-block {
+    max-width: 300px;
+    margin: 5px 0 0 0;
+    width: auto;
+    white-space: normal;
+}
+
+/*add padding for jquery ui*/
+.editable-error-block.ui-state-error {
+    padding: 3px;  
+}  
+
+.editable-error {
+   color: red;  
+}
+
+/* ---- For specific types ---- */
+
+.editableform .editable-date {
+    padding: 0; 
+    margin: 0;
+    float: left;
+}
+
+/* move datepicker icon to center of add-on button. See https://github.com/vitalets/x-editable/issues/183 */
+.editable-inline .add-on .icon-th {
+   margin-top: 3px;
+   margin-left: 1px; 
+}
+
+
+/* checklist vertical alignment */
+.editable-checklist label input[type="checkbox"], 
+.editable-checklist label span {
+    vertical-align: middle;
+    margin: 0;
+}
+
+.editable-checklist label {
+    white-space: nowrap; 
+}
+
+/* set exact width of textarea to fit buttons toolbar */
+.editable-wysihtml5 {
+    width: 566px; 
+    height: 250px; 
+}
+
+/* clear button shown as link in date inputs */
+.editable-clear {
+   clear: both;
+   font-size: 0.9em;
+   text-decoration: none;
+   text-align: right;
+}
+
+/* IOS-style clear button for text inputs */
+.editable-clear-x {
+   background: url('../img/clear.png') center center no-repeat;
+   display: block;
+   width: 13px;    
+   height: 13px;
+   position: absolute;
+   opacity: 0.6;
+   z-index: 100;
+   
+   top: 50%;
+   right: 6px;
+   margin-top: -6px;
+   
+}
+
+.editable-clear-x:hover {
+   opacity: 1;
+}
+
+.editable-pre-wrapped {
+   white-space: pre-wrap;
+}
+.editable-container.editable-popup {
+    max-width: none !important; /* without this rule poshytip/tooltip does not stretch */
+}  
+
+.editable-container.popover {
+    width: auto; /* without this rule popover does not stretch */
+}
+
+.editable-container.editable-inline {
+    display: inline-block; 
+    vertical-align: middle;
+    width: auto;
+    /* inline-block emulation for IE7*/
+    zoom: 1; 
+    *display: inline;    
+}
+
+.editable-container.ui-widget {
+   font-size: inherit;  /* jqueryui widget font 1.1em too big, overwrite it */
+   z-index: 9990; /* should be less than select2 dropdown z-index to close dropdown first when click */
+}
+.editable-click, 
+a.editable-click, 
+a.editable-click:hover {
+    text-decoration: none;
+    border-bottom: dashed 1px #0088cc;
+}
+
+.editable-click.editable-disabled, 
+a.editable-click.editable-disabled, 
+a.editable-click.editable-disabled:hover {
+   color: #585858;  
+   cursor: default;
+   border-bottom: none;
+}
+
+.editable-empty, .editable-empty:hover, .editable-empty:focus{
+  font-style: italic; 
+  color: #DD1144;  
+  /* border-bottom: none; */
+  text-decoration: none;
+}
+
+.editable-unsaved {
+  font-weight: bold; 
+}
+
+.editable-unsaved:after {
+/*    content: '*'*/
+}
+
+.editable-bg-transition {
+  -webkit-transition: background-color 1400ms ease-out;
+  -moz-transition: background-color 1400ms ease-out;
+  -o-transition: background-color 1400ms ease-out;
+  -ms-transition: background-color 1400ms ease-out;
+  transition: background-color 1400ms ease-out;  
+}
+
+/*see https://github.com/vitalets/x-editable/issues/139 */
+.form-horizontal .editable
+{ 
+    padding-top: 5px;
+    display:inline-block;
+}
+
+
+/*!
+ * Datepicker for Bootstrap
+ *
+ * Copyright 2012 Stefan Petre
+ * Improvements by Andrew Rowls
+ * Licensed under the Apache License v2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ */
+.datepicker {
+  padding: 4px;
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
+  direction: ltr;
+  /*.dow {
+		border-top: 1px solid #ddd !important;
+	}*/
+
+}
+.datepicker-inline {
+  width: 220px;
+}
+.datepicker.datepicker-rtl {
+  direction: rtl;
+}
+.datepicker.datepicker-rtl table tr td span {
+  float: right;
+}
+.datepicker-dropdown {
+  top: 0;
+  left: 0;
+}
+.datepicker-dropdown:before {
+  content: '';
+  display: inline-block;
+  border-left: 7px solid transparent;
+  border-right: 7px solid transparent;
+  border-bottom: 7px solid #ccc;
+  border-bottom-color: rgba(0, 0, 0, 0.2);
+  position: absolute;
+  top: -7px;
+  left: 6px;
+}
+.datepicker-dropdown:after {
+  content: '';
+  display: inline-block;
+  border-left: 6px solid transparent;
+  border-right: 6px solid transparent;
+  border-bottom: 6px solid #ffffff;
+  position: absolute;
+  top: -6px;
+  left: 7px;
+}
+.datepicker > div {
+  display: none;
+}
+.datepicker.days div.datepicker-days {
+  display: block;
+}
+.datepicker.months div.datepicker-months {
+  display: block;
+}
+.datepicker.years div.datepicker-years {
+  display: block;
+}
+.datepicker table {
+  margin: 0;
+}
+.datepicker td,
+.datepicker th {
+  text-align: center;
+  width: 20px;
+  height: 20px;
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
+  border: none;
+}
+.table-striped .datepicker table tr td,
+.table-striped .datepicker table tr th {
+  background-color: transparent;
+}
+.datepicker table tr td.day:hover {
+  background: #eeeeee;
+  cursor: pointer;
+}
+.datepicker table tr td.old,
+.datepicker table tr td.new {
+  color: #999999;
+}
+.datepicker table tr td.disabled,
+.datepicker table tr td.disabled:hover {
+  background: none;
+  color: #999999;
+  cursor: default;
+}
+.datepicker table tr td.today,
+.datepicker table tr td.today:hover,
+.datepicker table tr td.today.disabled,
+.datepicker table tr td.today.disabled:hover {
+  background-color: #fde19a;
+  background-image: -moz-linear-gradient(top, #fdd49a, #fdf59a);
+  background-image: -ms-linear-gradient(top, #fdd49a, #fdf59a);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fdd49a), to(#fdf59a));
+  background-image: -webkit-linear-gradient(top, #fdd49a, #fdf59a);
+  background-image: -o-linear-gradient(top, #fdd49a, #fdf59a);
+  background-image: linear-gradient(top, #fdd49a, #fdf59a);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdd49a', endColorstr='#fdf59a', GradientType=0);
+  border-color: #fdf59a #fdf59a #fbed50;
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+  color: #000;
+}
+.datepicker table tr td.today:hover,
+.datepicker table tr td.today:hover:hover,
+.datepicker table tr td.today.disabled:hover,
+.datepicker table tr td.today.disabled:hover:hover,
+.datepicker table tr td.today:active,
+.datepicker table tr td.today:hover:active,
+.datepicker table tr td.today.disabled:active,
+.datepicker table tr td.today.disabled:hover:active,
+.datepicker table tr td.today.active,
+.datepicker table tr td.today:hover.active,
+.datepicker table tr td.today.disabled.active,
+.datepicker table tr td.today.disabled:hover.active,
+.datepicker table tr td.today.disabled,
+.datepicker table tr td.today:hover.disabled,
+.datepicker table tr td.today.disabled.disabled,
+.datepicker table tr td.today.disabled:hover.disabled,
+.datepicker table tr td.today[disabled],
+.datepicker table tr td.today:hover[disabled],
+.datepicker table tr td.today.disabled[disabled],
+.datepicker table tr td.today.disabled:hover[disabled] {
+  background-color: #fdf59a;
+}
+.datepicker table tr td.today:active,
+.datepicker table tr td.today:hover:active,
+.datepicker table tr td.today.disabled:active,
+.datepicker table tr td.today.disabled:hover:active,
+.datepicker table tr td.today.active,
+.datepicker table tr td.today:hover.active,
+.datepicker table tr td.today.disabled.active,
+.datepicker table tr td.today.disabled:hover.active {
+  background-color: #fbf069 \9;
+}
+.datepicker table tr td.today:hover:hover {
+  color: #000;
+}
+.datepicker table tr td.today.active:hover {
+  color: #fff;
+}
+.datepicker table tr td.range,
+.datepicker table tr td.range:hover,
+.datepicker table tr td.range.disabled,
+.datepicker table tr td.range.disabled:hover {
+  background: #eeeeee;
+  -webkit-border-radius: 0;
+  -moz-border-radius: 0;
+  border-radius: 0;
+}
+.datepicker table tr td.range.today,
+.datepicker table tr td.range.today:hover,
+.datepicker table tr td.range.today.disabled,
+.datepicker table tr td.range.today.disabled:hover {
+  background-color: #f3d17a;
+  background-image: -moz-linear-gradient(top, #f3c17a, #f3e97a);
+  background-image: -ms-linear-gradient(top, #f3c17a, #f3e97a);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f3c17a), to(#f3e97a));
+  background-image: -webkit-linear-gradient(top, #f3c17a, #f3e97a);
+  background-image: -o-linear-gradient(top, #f3c17a, #f3e97a);
+  background-image: linear-gradient(top, #f3c17a, #f3e97a);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3c17a', endColorstr='#f3e97a', GradientType=0);
+  border-color: #f3e97a #f3e97a #edde34;
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+  -webkit-border-radius: 0;
+  -moz-border-radius: 0;
+  border-radius: 0;
+}
+.datepicker table tr td.range.today:hover,
+.datepicker table tr td.range.today:hover:hover,
+.datepicker table tr td.range.today.disabled:hover,
+.datepicker table tr td.range.today.disabled:hover:hover,
+.datepicker table tr td.range.today:active,
+.datepicker table tr td.range.today:hover:active,
+.datepicker table tr td.range.today.disabled:active,
+.datepicker table tr td.range.today.disabled:hover:active,
+.datepicker table tr td.range.today.active,
+.datepicker table tr td.range.today:hover.active,
+.datepicker table tr td.range.today.disabled.active,
+.datepicker table tr td.range.today.disabled:hover.active,
+.datepicker table tr td.range.today.disabled,
+.datepicker table tr td.range.today:hover.disabled,
+.datepicker table tr td.range.today.disabled.disabled,
+.datepicker table tr td.range.today.disabled:hover.disabled,
+.datepicker table tr td.range.today[disabled],
+.datepicker table tr td.range.today:hover[disabled],
+.datepicker table tr td.range.today.disabled[disabled],
+.datepicker table tr td.range.today.disabled:hover[disabled] {
+  background-color: #f3e97a;
+}
+.datepicker table tr td.range.today:active,
+.datepicker table tr td.range.today:hover:active,
+.datepicker table tr td.range.today.disabled:active,
+.datepicker table tr td.range.today.disabled:hover:active,
+.datepicker table tr td.range.today.active,
+.datepicker table tr td.range.today:hover.active,
+.datepicker table tr td.range.today.disabled.active,
+.datepicker table tr td.range.today.disabled:hover.active {
+  background-color: #efe24b \9;
+}
+.datepicker table tr td.selected,
+.datepicker table tr td.selected:hover,
+.datepicker table tr td.selected.disabled,
+.datepicker table tr td.selected.disabled:hover {
+  background-color: #9e9e9e;
+  background-image: -moz-linear-gradient(top, #b3b3b3, #808080);
+  background-image: -ms-linear-gradient(top, #b3b3b3, #808080);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b3b3b3), to(#808080));
+  background-image: -webkit-linear-gradient(top, #b3b3b3, #808080);
+  background-image: -o-linear-gradient(top, #b3b3b3, #808080);
+  background-image: linear-gradient(top, #b3b3b3, #808080);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3b3b3', endColorstr='#808080', GradientType=0);
+  border-color: #808080 #808080 #595959;
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+  color: #fff;
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+}
+.datepicker table tr td.selected:hover,
+.datepicker table tr td.selected:hover:hover,
+.datepicker table tr td.selected.disabled:hover,
+.datepicker table tr td.selected.disabled:hover:hover,
+.datepicker table tr td.selected:active,
+.datepicker table tr td.selected:hover:active,
+.datepicker table tr td.selected.disabled:active,
+.datepicker table tr td.selected.disabled:hover:active,
+.datepicker table tr td.selected.active,
+.datepicker table tr td.selected:hover.active,
+.datepicker table tr td.selected.disabled.active,
+.datepicker table tr td.selected.disabled:hover.active,
+.datepicker table tr td.selected.disabled,
+.datepicker table tr td.selected:hover.disabled,
+.datepicker table tr td.selected.disabled.disabled,
+.datepicker table tr td.selected.disabled:hover.disabled,
+.datepicker table tr td.selected[disabled],
+.datepicker table tr td.selected:hover[disabled],
+.datepicker table tr td.selected.disabled[disabled],
+.datepicker table tr td.selected.disabled:hover[disabled] {
+  background-color: #808080;
+}
+.datepicker table tr td.selected:active,
+.datepicker table tr td.selected:hover:active,
+.datepicker table tr td.selected.disabled:active,
+.datepicker table tr td.selected.disabled:hover:active,
+.datepicker table tr td.selected.active,
+.datepicker table tr td.selected:hover.active,
+.datepicker table tr td.selected.disabled.active,
+.datepicker table tr td.selected.disabled:hover.active {
+  background-color: #666666 \9;
+}
+.datepicker table tr td.active,
+.datepicker table tr td.active:hover,
+.datepicker table tr td.active.disabled,
+.datepicker table tr td.active.disabled:hover {
+  background-color: #006dcc;
+  background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
+  background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
+  background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
+  background-image: -o-linear-gradient(top, #0088cc, #0044cc);
+  background-image: linear-gradient(top, #0088cc, #0044cc);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
+  border-color: #0044cc #0044cc #002a80;
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+  color: #fff;
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+}
+.datepicker table tr td.active:hover,
+.datepicker table tr td.active:hover:hover,
+.datepicker table tr td.active.disabled:hover,
+.datepicker table tr td.active.disabled:hover:hover,
+.datepicker table tr td.active:active,
+.datepicker table tr td.active:hover:active,
+.datepicker table tr td.active.disabled:active,
+.datepicker table tr td.active.disabled:hover:active,
+.datepicker table tr td.active.active,
+.datepicker table tr td.active:hover.active,
+.datepicker table tr td.active.disabled.active,
+.datepicker table tr td.active.disabled:hover.active,
+.datepicker table tr td.active.disabled,
+.datepicker table tr td.active:hover.disabled,
+.datepicker table tr td.active.disabled.disabled,
+.datepicker table tr td.active.disabled:hover.disabled,
+.datepicker table tr td.active[disabled],
+.datepicker table tr td.active:hover[disabled],
+.datepicker table tr td.active.disabled[disabled],
+.datepicker table tr td.active.disabled:hover[disabled] {
+  background-color: #0044cc;
+}
+.datepicker table tr td.active:active,
+.datepicker table tr td.active:hover:active,
+.datepicker table tr td.active.disabled:active,
+.datepicker table tr td.active.disabled:hover:active,
+.datepicker table tr td.active.active,
+.datepicker table tr td.active:hover.active,
+.datepicker table tr td.active.disabled.active,
+.datepicker table tr td.active.disabled:hover.active {
+  background-color: #003399 \9;
+}
+.datepicker table tr td span {
+  display: block;
+  width: 23%;
+  height: 54px;
+  line-height: 54px;
+  float: left;
+  margin: 1%;
+  cursor: pointer;
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
+}
+.datepicker table tr td span:hover {
+  background: #eeeeee;
+}
+.datepicker table tr td span.disabled,
+.datepicker table tr td span.disabled:hover {
+  background: none;
+  color: #999999;
+  cursor: default;
+}
+.datepicker table tr td span.active,
+.datepicker table tr td span.active:hover,
+.datepicker table tr td span.active.disabled,
+.datepicker table tr td span.active.disabled:hover {
+  background-color: #006dcc;
+  background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
+  background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
+  background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
+  background-image: -o-linear-gradient(top, #0088cc, #0044cc);
+  background-image: linear-gradient(top, #0088cc, #0044cc);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
+  border-color: #0044cc #0044cc #002a80;
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+  color: #fff;
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+}
+.datepicker table tr td span.active:hover,
+.datepicker table tr td span.active:hover:hover,
+.datepicker table tr td span.active.disabled:hover,
+.datepicker table tr td span.active.disabled:hover:hover,
+.datepicker table tr td span.active:active,
+.datepicker table tr td span.active:hover:active,
+.datepicker table tr td span.active.disabled:active,
+.datepicker table tr td span.active.disabled:hover:active,
+.datepicker table tr td span.active.active,
+.datepicker table tr td span.active:hover.active,
+.datepicker table tr td span.active.disabled.active,
+.datepicker table tr td span.active.disabled:hover.active,
+.datepicker table tr td span.active.disabled,
+.datepicker table tr td span.active:hover.disabled,
+.datepicker table tr td span.active.disabled.disabled,
+.datepicker table tr td span.active.disabled:hover.disabled,
+.datepicker table tr td span.active[disabled],
+.datepicker table tr td span.active:hover[disabled],
+.datepicker table tr td span.active.disabled[disabled],
+.datepicker table tr td span.active.disabled:hover[disabled] {
+  background-color: #0044cc;
+}
+.datepicker table tr td span.active:active,
+.datepicker table tr td span.active:hover:active,
+.datepicker table tr td span.active.disabled:active,
+.datepicker table tr td span.active.disabled:hover:active,
+.datepicker table tr td span.active.active,
+.datepicker table tr td span.active:hover.active,
+.datepicker table tr td span.active.disabled.active,
+.datepicker table tr td span.active.disabled:hover.active {
+  background-color: #003399 \9;
+}
+.datepicker table tr td span.old,
+.datepicker table tr td span.new {
+  color: #999999;
+}
+.datepicker th.datepicker-switch {
+  width: 145px;
+}
+.datepicker thead tr:first-child th,
+.datepicker tfoot tr th {
+  cursor: pointer;
+}
+.datepicker thead tr:first-child th:hover,
+.datepicker tfoot tr th:hover {
+  background: #eeeeee;
+}
+.datepicker .cw {
+  font-size: 10px;
+  width: 12px;
+  padding: 0 2px 0 5px;
+  vertical-align: middle;
+}
+.datepicker thead tr:first-child th.cw {
+  cursor: default;
+  background-color: transparent;
+}
+.input-append.date .add-on i,
+.input-prepend.date .add-on i {
+  display: block;
+  cursor: pointer;
+  width: 16px;
+  height: 16px;
+}
+.input-daterange input {
+  text-align: center;
+}
+.input-daterange input:first-child {
+  -webkit-border-radius: 3px 0 0 3px;
+  -moz-border-radius: 3px 0 0 3px;
+  border-radius: 3px 0 0 3px;
+}
+.input-daterange input:last-child {
+  -webkit-border-radius: 0 3px 3px 0;
+  -moz-border-radius: 0 3px 3px 0;
+  border-radius: 0 3px 3px 0;
+}
+.input-daterange .add-on {
+  display: inline-block;
+  width: auto;
+  min-width: 16px;
+  height: 18px;
+  padding: 4px 5px;
+  font-weight: normal;
+  line-height: 18px;
+  text-align: center;
+  text-shadow: 0 1px 0 #ffffff;
+  vertical-align: middle;
+  background-color: #eeeeee;
+  border: 1px solid #ccc;
+  margin-left: -5px;
+  margin-right: -5px;
+}
diff --git a/findphraseAC.php b/findphraseAC.php
index 2eb5496..e6e77b8 100644
--- a/findphraseAC.php
+++ b/findphraseAC.php
@@ -1,45 +1,89 @@
 <html>
 <head>
-<TITLE>jQuery AJAX Autocomplete - Country Example</TITLE>
-<head>
-<style>
-body{width:610px;}
-.frmSearch {border: 1px solid #F0F0F0;background-color:#C8EEFD;margin: 2px 0px;padding:40px;}
-#country-list{float:left;list-style:none;margin:0;padding:0;width:190px;}
-#country-list li{padding: 10px; background:#FAFAFA;border-bottom:#F0F0F0 1px solid;}
-#country-list li:hover{background:#F0F0F0;}
-#search-box{padding: 10px;border: #F0F0F0 1px solid;}
-</style>
-<script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
-<script>
-$(document).ready(function(){
-	$("#search-box").keyup(function(){
-		$.ajax({
-		type: "POST",
-		url: "findphrase.php",
-		data:'keyword='+$(this).val(),
-		beforeSend: function(){
-			$("#search-box").css("background","#FFF url(LoaderIcon.gif) no-repeat 165px");
-		},
-		success: function(data){
-			$("#suggesstion-box").show();
-			$("#suggesstion-box").html(data);
-			$("#search-box").css("background","#FFF");
-		}
-		});
-	});
-});
+<script data-cfasync="false" type="text/javascript">
 
-function selectCountry(val) {
-$("#search-box").val(val);
-$("#suggesstion-box").hide();
+var myAjax = ajax();
+function ajax() {
+        var ajax = null;
+        if (window.XMLHttpRequest) {
+                try {
+                        ajax = new XMLHttpRequest();
+                }
+                catch(e) {}
+        }
+        else if (window.ActiveXObject) {
+                try {
+                        ajax = new ActiveXObject("Msxm12.XMLHTTP");
+                }
+                catch (e){
+                        try{
+                                ajax = new ActiveXObject("Microsoft.XMLHTTP");
+                        }
+                        catch (e) {}
+                }
+        }
+        return ajax;
+}
+function request(str) {
+	//Don't forget to modify the path according to your theme
+        myAjax.open("POST", "findphrase.php");
+        myAjax.onreadystatechange = result;
+        myAjax.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+        myAjax.send("search="+str);
+}
+function result() {
+        if (myAjax.readyState == 4) {
+                var liste = myAjax.responseText;
+                var cible = document.getElementById('tag_update').innerHTML = liste;
+               // document.getElementById('tag_update').style.display = "block";
+        }
+}
+function selected(choice){
+        var cible = document.getElementById('s');
+        cible.value = choice;
+        document.getElementById('tag_update').style.display = "none";
 }
 </script>
+<style type="text/css">
+#tag_update {
+        display: block;
+        border-left: 1px solid #373737;
+        border-right: 1px solid #373737;
+        border-bottom: 1px solid #373737;
+        position:absolute;
+        z-index:1;
+}
+#tag_update ul {
+        margin: 0;
+        padding: 0;
+        list-style: none;
+}
+#tag_update li{
+        display:block;
+        clear:both;
+}
+#tag_update a {
+        width:134px;
+        display: block;
+        padding: .2em .3em;
+        text-decoration: none;
+        color: #fff;
+        background-color: #1B1B1C;
+        text-align: left;
+}
+#tag_update a:hover{
+        color: #fff;
+        background-color: #373737;
+        background-image: none;
+}
+</style>
+<style type="text/css"></style>
 </head>
-<body>
-<div class="frmSearch">
-<input type="text" id="search-box" placeholder="Country Name" />
-<div id="suggesstion-box"></div>
-</div>
-</body>
+<form method="get" id="searchform" action="findphrase.php">
+    <div>
+        <input autocomplete="off" type="text" value="" name="s" id="s" onkeyup="request(this.value);">
+        <input type="submit" id="searchsubmit" value="Search" class="button">
+    </div>
+    <div id="tag_update"></div>
+</form>
 </html>
diff --git a/index.php b/index.php
index d405153..381e62e 100644
--- a/index.php
+++ b/index.php
@@ -12,7 +12,7 @@
         <link href="css/bootstrap.css" rel="stylesheet">
     
         <!-- Header File -->
-        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+        <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
         <style>
             body{
                 background: url(Media/GonzagaBackground.jpg) no-repeat center center fixed;
@@ -69,12 +69,12 @@
         $username = $_POST['username'];
         $password = md5($_POST['password'] . $salt);
         $loginquery = "
-SELECT SU.[user_id],SU.[username],SU.[password],SU.[first_name],SU.[last_name],SU.[email],SU.[date_added], R.[Role]
+SELECT DISTINCT SU.[user_id], SU.[username], SU.[password], SU.[date_added], R.[Role], R.[Type], R.[Designation], SU.firstname, SU.lastname
 FROM SiteUsers as SU, RoleInstances as RI, Roles as R
 WHERE SU.username = ? AND
       SU.[password] = ? AND
       RI.SiteUsername = SU.username AND
-      RI.RoleInstanceID = (SELECT max(RoleInstanceID) FROM RoleInstances WHERE SiteUsername = ?) AND
+      RI.Priority = 'Default' AND
       R.RoleID = RI.RoleID";
         
         $params = array($username, $password, $username);
@@ -86,21 +86,23 @@
         if(sqlsrv_num_rows($checklogin) == 1)
         {
             $row = sqlsrv_fetch_array($checklogin);
-            $email = $row['email'];
             $role = $row['Role'];
-            $first_name = $row['first_name'];
-            $last_name = $row['last_name'];
             
             
             $_SESSION['Username'] = $username;
             $_SESSION['LoggedIn'] = 1;
             $_SESSION['Role'] = $role;
+            $_SESSION['AccessType'] = $row['Type'];
+            $_SESSION['Designation'] = $row['Designation'];
+            $_SESSION['UserID'] = $row['user_id'];
+            $_SESSION['firstname'] = $row['firstname'];
+            $_SESSION['lastname'] = $row['lastname'];
             
             if ($role == 'Admin')
             {
                 $params = array($username);
                 $options = array( "Scrollable" => 'static');
-                $query = "SELECT FirstName, LastName, Email FROM Administrators WHERE SiteUsername = ?";
+                $query = "SELECT A.FirstName, A.LastName, A.Email, I.InstitutionName FROM Administrators as A, Institutions as I WHERE A.SiteUsername = ? AND I.InstitutionID = A.InstitutionID";
                 $stmt = sqlsrv_query($con, $query, $params, $options);
                 if ($stmt === false)
                     die( print_r( sqlsrv_errors(), true));
@@ -109,7 +111,10 @@
                     $first_name = sqlsrv_get_field( $stmt, 0);
                     $last_name = sqlsrv_get_field( $stmt, 1);
                     $email = sqlsrv_get_field( $stmt, 2);
+                    $institution = sqlsrv_get_field( $stmt, 3);
+                    $_SESSION['Institution'] = $institution;
                 }
+                
             }
             elseif ($role == 'Teacher')
             {
@@ -125,12 +130,14 @@
                     $last_name = sqlsrv_get_field( $stmt, 1);
                     $email = sqlsrv_get_field( $stmt, 2);
                 }
+                else
+                    echo "Teacher.";
             }
             elseif ($role == 'Student')
             {
                 $params = array($username);
                 $options = array( "Scrollable" => 'static');
-                $query = "SELECT FirstName, LastName, Email FROM Students WHERE SiteUsername = ?";
+                $query = "SELECT S.FirstName, S.LastName, S.Email, I.InstitutionName FROM Students as S, Institutions as I WHERE SiteUsername = ? and I.InstitutionID = S.InstitutionID";
                 $stmt = sqlsrv_query($con, $query, $params, $options);
                 if ($stmt === false)
                     die( print_r( sqlsrv_errors(), true));
@@ -139,7 +146,10 @@
                     $first_name = sqlsrv_get_field( $stmt, 0);
                     $last_name = sqlsrv_get_field( $stmt, 1);
                     $email = sqlsrv_get_field( $stmt, 2);
+                    $institution = sqlsrv_get_field( $stmt, 3);
+                    $_SESSION['Institution'] = $institution;
                 }
+
             }
             
             $_SESSION['EmailAddress'] = $email;
@@ -148,7 +158,7 @@
             
             
             
-            echo "<meta http-equiv='refresh' content='0;/' />";
+            echo "<meta http-equiv='refresh' content='0;/$role/Home/' />";
         }
         else
         {?>
@@ -187,11 +197,11 @@
                 </fieldset>
                 <h4 class="form-signin-heading text-right"><a href="#">Forgot Username?</a></h4>
                 <h4 class="form-signin-heading text-right"><a href="#">Forgot Password?</a></h4>
-                <h4 class="form-signin-heading text-right"><a href="register.php">Register</a></h4>
+               <!-- <h4 class="form-signin-heading text-right"><a href="register.php">Register</a></h4> -->
                 </form>
             </div>
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="js/bootstrap.min.js"></script>
     </body>
diff --git a/js/CreateNewCourse.js b/js/CreateNewCourse.js
new file mode 100644
index 0000000..6af62b8
--- /dev/null
+++ b/js/CreateNewCourse.js
@@ -0,0 +1,25 @@
+$(function(){
+    $(document).on('click', "button[name='CreateCourse']", function(e) {
+        var parentForm = $(this).closest("form");
+        var institution = $(parentForm).find("select[name=institution]").val();
+        var session = $(parentForm).find("select[name=session]").val();
+        var coursename = $(parentForm).find("select[name=coursename]").val();
+        var section = $(parentForm).find("select[name=section]").val();
+        var teacher = $(parentForm).find("select[name=teacherid]").val();
+        alert(teacher);
+        $.ajax({
+            type: "POST",
+            url: "CreateNewCourse.php",
+            data: {
+                "institutionID" : institution,
+                "sessionID" : session,
+                "coursetypeID" : coursename,
+                "section" : section, 
+                "teacherID" : teacher
+            },
+            success: function(data) {
+                location.reload();
+            }
+        });
+    });
+});
diff --git a/js/bootstrap-editable.js b/js/bootstrap-editable.js
new file mode 100644
index 0000000..562cabc
--- /dev/null
+++ b/js/bootstrap-editable.js
@@ -0,0 +1,6807 @@
+/*! X-editable - v1.5.1 
+* In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
+* http://github.com/vitalets/x-editable
+* Copyright (c) 2013 Vitaliy Potapov; Licensed MIT */
+/**
+Form with single input element, two buttons and two states: normal/loading.
+Applied as jQuery method to DIV tag (not to form tag!). This is because form can be in loading state when spinner shown.
+Editableform is linked with one of input types, e.g. 'text', 'select' etc.
+
+@class editableform
+@uses text
+@uses textarea
+**/
+(function ($) {
+    "use strict";
+    
+    var EditableForm = function (div, options) {
+        this.options = $.extend({}, $.fn.editableform.defaults, options);
+        this.$div = $(div); //div, containing form. Not form tag. Not editable-element.
+        if(!this.options.scope) {
+            this.options.scope = this;
+        }
+        //nothing shown after init
+    };
+
+    EditableForm.prototype = {
+        constructor: EditableForm,
+        initInput: function() {  //called once
+            //take input from options (as it is created in editable-element)
+            this.input = this.options.input;
+            
+            //set initial value
+            //todo: may be add check: typeof str === 'string' ? 
+            this.value = this.input.str2value(this.options.value); 
+            
+            //prerender: get input.$input
+            this.input.prerender();
+        },
+        initTemplate: function() {
+            this.$form = $($.fn.editableform.template); 
+        },
+        initButtons: function() {
+            var $btn = this.$form.find('.editable-buttons');
+            $btn.append($.fn.editableform.buttons);
+            if(this.options.showbuttons === 'bottom') {
+                $btn.addClass('editable-buttons-bottom');
+            }
+        },
+        /**
+        Renders editableform
+
+        @method render
+        **/        
+        render: function() {
+            //init loader
+            this.$loading = $($.fn.editableform.loading);        
+            this.$div.empty().append(this.$loading);
+            
+            //init form template and buttons
+            this.initTemplate();
+            if(this.options.showbuttons) {
+                this.initButtons();
+            } else {
+                this.$form.find('.editable-buttons').remove();
+            }
+
+            //show loading state
+            this.showLoading();            
+            
+            //flag showing is form now saving value to server. 
+            //It is needed to wait when closing form.
+            this.isSaving = false;
+            
+            /**        
+            Fired when rendering starts
+            @event rendering 
+            @param {Object} event event object
+            **/            
+            this.$div.triggerHandler('rendering');
+            
+            //init input
+            this.initInput();
+            
+            //append input to form
+            this.$form.find('div.editable-input').append(this.input.$tpl);            
+            
+            //append form to container
+            this.$div.append(this.$form);
+            
+            //render input
+            $.when(this.input.render())
+            .then($.proxy(function () {
+                //setup input to submit automatically when no buttons shown
+                if(!this.options.showbuttons) {
+                    this.input.autosubmit(); 
+                }
+                 
+                //attach 'cancel' handler
+                this.$form.find('.editable-cancel').click($.proxy(this.cancel, this));
+                
+                if(this.input.error) {
+                    this.error(this.input.error);
+                    this.$form.find('.editable-submit').attr('disabled', true);
+                    this.input.$input.attr('disabled', true);
+                    //prevent form from submitting
+                    this.$form.submit(function(e){ e.preventDefault(); });
+                } else {
+                    this.error(false);
+                    this.input.$input.removeAttr('disabled');
+                    this.$form.find('.editable-submit').removeAttr('disabled');
+                    var value = (this.value === null || this.value === undefined || this.value === '') ? this.options.defaultValue : this.value;
+                    this.input.value2input(value);
+                    //attach submit handler
+                    this.$form.submit($.proxy(this.submit, this));
+                }
+
+                /**        
+                Fired when form is rendered
+                @event rendered
+                @param {Object} event event object
+                **/            
+                this.$div.triggerHandler('rendered');                
+
+                this.showForm();
+                
+                //call postrender method to perform actions required visibility of form
+                if(this.input.postrender) {
+                    this.input.postrender();
+                }                
+            }, this));
+        },
+        cancel: function() {   
+            /**        
+            Fired when form was cancelled by user
+            @event cancel 
+            @param {Object} event event object
+            **/              
+            this.$div.triggerHandler('cancel');
+        },
+        showLoading: function() {
+            var w, h;
+            if(this.$form) {
+                //set loading size equal to form
+                w = this.$form.outerWidth();
+                h = this.$form.outerHeight(); 
+                if(w) {
+                    this.$loading.width(w);
+                }
+                if(h) {
+                    this.$loading.height(h);
+                }
+                this.$form.hide();
+            } else {
+                //stretch loading to fill container width
+                w = this.$loading.parent().width();
+                if(w) {
+                    this.$loading.width(w);
+                }
+            }
+            this.$loading.show(); 
+        },
+
+        showForm: function(activate) {
+            this.$loading.hide();
+            this.$form.show();
+            if(activate !== false) {
+                this.input.activate(); 
+            }
+            /**        
+            Fired when form is shown
+            @event show 
+            @param {Object} event event object
+            **/                    
+            this.$div.triggerHandler('show');
+        },
+
+        error: function(msg) {
+            var $group = this.$form.find('.control-group'),
+                $block = this.$form.find('.editable-error-block'),
+                lines;
+
+            if(msg === false) {
+                $group.removeClass($.fn.editableform.errorGroupClass);
+                $block.removeClass($.fn.editableform.errorBlockClass).empty().hide(); 
+            } else {
+                //convert newline to <br> for more pretty error display
+                if(msg) {
+                    lines = (''+msg).split('\n');
+                    for (var i = 0; i < lines.length; i++) {
+                        lines[i] = $('<div>').text(lines[i]).html();
+                    }
+                    msg = lines.join('<br>');
+                }
+                $group.addClass($.fn.editableform.errorGroupClass);
+                $block.addClass($.fn.editableform.errorBlockClass).html(msg).show();
+            }
+        },
+
+        submit: function(e) {
+            e.stopPropagation();
+            e.preventDefault();
+            
+            //get new value from input
+            var newValue = this.input.input2value(); 
+
+            //validation: if validate returns string or truthy value - means error
+            //if returns object like {newValue: '...'} => submitted value is reassigned to it
+            var error = this.validate(newValue);
+            if ($.type(error) === 'object' && error.newValue !== undefined) {
+                newValue = error.newValue;
+                this.input.value2input(newValue);
+                if(typeof error.msg === 'string') {
+                    this.error(error.msg);
+                    this.showForm();
+                    return;
+                }
+            } else if (error) {
+                this.error(error);
+                this.showForm();
+                return;
+            } 
+            
+            //if value not changed --> trigger 'nochange' event and return
+            /*jslint eqeq: true*/
+            if (!this.options.savenochange && this.input.value2str(newValue) == this.input.value2str(this.value)) {
+            /*jslint eqeq: false*/                
+                /**        
+                Fired when value not changed but form is submitted. Requires savenochange = false.
+                @event nochange 
+                @param {Object} event event object
+                **/                    
+                this.$div.triggerHandler('nochange');            
+                return;
+            } 
+
+            //convert value for submitting to server
+            var submitValue = this.input.value2submit(newValue);
+            
+            this.isSaving = true;
+            
+            //sending data to server
+            $.when(this.save(submitValue))
+            .done($.proxy(function(response) {
+                this.isSaving = false;
+
+                //run success callback
+                var res = typeof this.options.success === 'function' ? this.options.success.call(this.options.scope, response, newValue) : null;
+
+                //if success callback returns false --> keep form open and do not activate input
+                if(res === false) {
+                    this.error(false);
+                    this.showForm(false);
+                    return;
+                }
+
+                //if success callback returns string -->  keep form open, show error and activate input               
+                if(typeof res === 'string') {
+                    this.error(res);
+                    this.showForm();
+                    return;
+                }
+
+                //if success callback returns object like {newValue: <something>} --> use that value instead of submitted
+                //it is usefull if you want to chnage value in url-function
+                if(res && typeof res === 'object' && res.hasOwnProperty('newValue')) {
+                    newValue = res.newValue;
+                }
+
+                //clear error message
+                this.error(false);   
+                this.value = newValue;
+                /**        
+                Fired when form is submitted
+                @event save 
+                @param {Object} event event object
+                @param {Object} params additional params
+                @param {mixed} params.newValue raw new value
+                @param {mixed} params.submitValue submitted value as string
+                @param {Object} params.response ajax response
+
+                @example
+                $('#form-div').on('save'), function(e, params){
+                    if(params.newValue === 'username') {...}
+                });
+                **/
+                this.$div.triggerHandler('save', {newValue: newValue, submitValue: submitValue, response: response});
+            }, this))
+            .fail($.proxy(function(xhr) {
+                this.isSaving = false;
+
+                var msg;
+                if(typeof this.options.error === 'function') {
+                    msg = this.options.error.call(this.options.scope, xhr, newValue);
+                } else {
+                    msg = typeof xhr === 'string' ? xhr : xhr.responseText || xhr.statusText || 'Unknown error!';
+                }
+
+                this.error(msg);
+                this.showForm();
+            }, this));
+        },
+
+        save: function(submitValue) {
+            //try parse composite pk defined as json string in data-pk 
+            this.options.pk = $.fn.editableutils.tryParseJson(this.options.pk, true); 
+            
+            var pk = (typeof this.options.pk === 'function') ? this.options.pk.call(this.options.scope) : this.options.pk,
+            /*
+              send on server in following cases:
+              1. url is function
+              2. url is string AND (pk defined OR send option = always) 
+            */
+            send = !!(typeof this.options.url === 'function' || (this.options.url && ((this.options.send === 'always') || (this.options.send === 'auto' && pk !== null && pk !== undefined)))),
+            params;
+
+            if (send) { //send to server
+                this.showLoading();
+
+                //standard params
+                params = {
+                    name: this.options.name || '',
+                    value: submitValue,
+                    pk: pk 
+                };
+
+                //additional params
+                if(typeof this.options.params === 'function') {
+                    params = this.options.params.call(this.options.scope, params);  
+                } else {
+                    //try parse json in single quotes (from data-params attribute)
+                    this.options.params = $.fn.editableutils.tryParseJson(this.options.params, true);   
+                    $.extend(params, this.options.params);
+                }
+
+                if(typeof this.options.url === 'function') { //user's function
+                    return this.options.url.call(this.options.scope, params);
+                } else {  
+                    //send ajax to server and return deferred object
+                    return $.ajax($.extend({
+                        url     : this.options.url,
+                        data    : params,
+                        type    : 'POST'
+                    }, this.options.ajaxOptions));
+                }
+            }
+        }, 
+
+        validate: function (value) {
+            if (value === undefined) {
+                value = this.value;
+            }
+            if (typeof this.options.validate === 'function') {
+                return this.options.validate.call(this.options.scope, value);
+            }
+        },
+
+        option: function(key, value) {
+            if(key in this.options) {
+                this.options[key] = value;
+            }
+            
+            if(key === 'value') {
+                this.setValue(value);
+            }
+            
+            //do not pass option to input as it is passed in editable-element
+        },
+
+        setValue: function(value, convertStr) {
+            if(convertStr) {
+                this.value = this.input.str2value(value);
+            } else {
+                this.value = value;
+            }
+            
+            //if form is visible, update input
+            if(this.$form && this.$form.is(':visible')) {
+                this.input.value2input(this.value);
+            }            
+        }               
+    };
+
+    /*
+    Initialize editableform. Applied to jQuery object.
+
+    @method $().editableform(options)
+    @params {Object} options
+    @example
+    var $form = $('&lt;div&gt;').editableform({
+        type: 'text',
+        name: 'username',
+        url: '/post',
+        value: 'vitaliy'
+    });
+
+    //to display form you should call 'render' method
+    $form.editableform('render');     
+    */
+    $.fn.editableform = function (option) {
+        var args = arguments;
+        return this.each(function () {
+            var $this = $(this), 
+            data = $this.data('editableform'), 
+            options = typeof option === 'object' && option; 
+            if (!data) {
+                $this.data('editableform', (data = new EditableForm(this, options)));
+            }
+
+            if (typeof option === 'string') { //call method 
+                data[option].apply(data, Array.prototype.slice.call(args, 1));
+            } 
+        });
+    };
+
+    //keep link to constructor to allow inheritance
+    $.fn.editableform.Constructor = EditableForm;    
+
+    //defaults
+    $.fn.editableform.defaults = {
+        /* see also defaults for input */
+
+        /**
+        Type of input. Can be <code>text|textarea|select|date|checklist</code>
+
+        @property type 
+        @type string
+        @default 'text'
+        **/
+        type: 'text',
+        /**
+        Url for submit, e.g. <code>'/post'</code>  
+        If function - it will be called instead of ajax. Function should return deferred object to run fail/done callbacks.
+
+        @property url 
+        @type string|function
+        @default null
+        @example
+        url: function(params) {
+            var d = new $.Deferred;
+            if(params.value === 'abc') {
+                return d.reject('error message'); //returning error via deferred object
+            } else {
+                //async saving data in js model
+                someModel.asyncSaveMethod({
+                   ..., 
+                   success: function(){
+                      d.resolve();
+                   }
+                }); 
+                return d.promise();
+            }
+        } 
+        **/        
+        url:null,
+        /**
+        Additional params for submit. If defined as <code>object</code> - it is **appended** to original ajax data (pk, name and value).  
+        If defined as <code>function</code> - returned object **overwrites** original ajax data.
+        @example
+        params: function(params) {
+            //originally params contain pk, name and value
+            params.a = 1;
+            return params;
+        }
+
+        @property params 
+        @type object|function
+        @default null
+        **/          
+        params:null,
+        /**
+        Name of field. Will be submitted on server. Can be taken from <code>id</code> attribute
+
+        @property name 
+        @type string
+        @default null
+        **/         
+        name: null,
+        /**
+        Primary key of editable object (e.g. record id in database). For composite keys use object, e.g. <code>{id: 1, lang: 'en'}</code>.
+        Can be calculated dynamically via function.
+
+        @property pk 
+        @type string|object|function
+        @default null
+        **/         
+        pk: null,
+        /**
+        Initial value. If not defined - will be taken from element's content.
+        For __select__ type should be defined (as it is ID of shown text).
+
+        @property value 
+        @type string|object
+        @default null
+        **/        
+        value: null,
+        /**
+        Value that will be displayed in input if original field value is empty (`null|undefined|''`).
+
+        @property defaultValue 
+        @type string|object
+        @default null
+        @since 1.4.6
+        **/        
+        defaultValue: null,
+        /**
+        Strategy for sending data on server. Can be `auto|always|never`.
+        When 'auto' data will be sent on server **only if pk and url defined**, otherwise new value will be stored locally.
+
+        @property send 
+        @type string
+        @default 'auto'
+        **/          
+        send: 'auto', 
+        /**
+        Function for client-side validation. If returns string - means validation not passed and string showed as error.
+        Since 1.5.1 you can modify submitted value by returning object from `validate`: 
+        `{newValue: '...'}` or `{newValue: '...', msg: '...'}`
+
+        @property validate 
+        @type function
+        @default null
+        @example
+        validate: function(value) {
+            if($.trim(value) == '') {
+                return 'This field is required';
+            }
+        }
+        **/         
+        validate: null,
+        /**
+        Success callback. Called when value successfully sent on server and **response status = 200**.  
+        Usefull to work with json response. For example, if your backend response can be <code>{success: true}</code>
+        or <code>{success: false, msg: "server error"}</code> you can check it inside this callback.  
+        If it returns **string** - means error occured and string is shown as error message.  
+        If it returns **object like** <code>{newValue: &lt;something&gt;}</code> - it overwrites value, submitted by user.  
+        Otherwise newValue simply rendered into element.
+        
+        @property success 
+        @type function
+        @default null
+        @example
+        success: function(response, newValue) {
+            if(!response.success) return response.msg;
+        }
+        **/          
+        success: null,
+        /**
+        Error callback. Called when request failed (response status != 200).  
+        Usefull when you want to parse error response and display a custom message.
+        Must return **string** - the message to be displayed in the error block.
+                
+        @property error 
+        @type function
+        @default null
+        @since 1.4.4
+        @example
+        error: function(response, newValue) {
+            if(response.status === 500) {
+                return 'Service unavailable. Please try later.';
+            } else {
+                return response.responseText;
+            }
+        }
+        **/          
+        error: null,
+        /**
+        Additional options for submit ajax request.
+        List of values: http://api.jquery.com/jQuery.ajax
+        
+        @property ajaxOptions 
+        @type object
+        @default null
+        @since 1.1.1        
+        @example 
+        ajaxOptions: {
+            type: 'put',
+            dataType: 'json'
+        }        
+        **/        
+        ajaxOptions: null,
+        /**
+        Where to show buttons: left(true)|bottom|false  
+        Form without buttons is auto-submitted.
+
+        @property showbuttons 
+        @type boolean|string
+        @default true
+        @since 1.1.1
+        **/         
+        showbuttons: true,
+        /**
+        Scope for callback methods (success, validate).  
+        If <code>null</code> means editableform instance itself. 
+
+        @property scope 
+        @type DOMElement|object
+        @default null
+        @since 1.2.0
+        @private
+        **/            
+        scope: null,
+        /**
+        Whether to save or cancel value when it was not changed but form was submitted
+
+        @property savenochange 
+        @type boolean
+        @default false
+        @since 1.2.0
+        **/
+        savenochange: false
+    };   
+
+    /*
+    Note: following params could redefined in engine: bootstrap or jqueryui:
+    Classes 'control-group' and 'editable-error-block' must always present!
+    */      
+    $.fn.editableform.template = '<form class="form-inline editableform">'+
+    '<div class="control-group">' + 
+    '<div><div class="editable-input"></div><div class="editable-buttons"></div></div>'+
+    '<div class="editable-error-block"></div>' + 
+    '</div>' + 
+    '</form>';
+
+    //loading div
+    $.fn.editableform.loading = '<div class="editableform-loading"></div>';
+
+    //buttons
+    $.fn.editableform.buttons = '<button type="submit" class="editable-submit">ok</button>'+
+    '<button type="button" class="editable-cancel">cancel</button>';      
+
+    //error class attached to control-group
+    $.fn.editableform.errorGroupClass = null;  
+
+    //error class attached to editable-error-block
+    $.fn.editableform.errorBlockClass = 'editable-error';
+    
+    //engine
+    $.fn.editableform.engine = 'jquery';
+}(window.jQuery));
+
+/**
+* EditableForm utilites
+*/
+(function ($) {
+    "use strict";
+    
+    //utils
+    $.fn.editableutils = {
+        /**
+        * classic JS inheritance function
+        */  
+        inherit: function (Child, Parent) {
+            var F = function() { };
+            F.prototype = Parent.prototype;
+            Child.prototype = new F();
+            Child.prototype.constructor = Child;
+            Child.superclass = Parent.prototype;
+        },
+
+        /**
+        * set caret position in input
+        * see http://stackoverflow.com/questions/499126/jquery-set-cursor-position-in-text-area
+        */        
+        setCursorPosition: function(elem, pos) {
+            if (elem.setSelectionRange) {
+                elem.setSelectionRange(pos, pos);
+            } else if (elem.createTextRange) {
+                var range = elem.createTextRange();
+                range.collapse(true);
+                range.moveEnd('character', pos);
+                range.moveStart('character', pos);
+                range.select();
+            }
+        },
+
+        /**
+        * function to parse JSON in *single* quotes. (jquery automatically parse only double quotes)
+        * That allows such code as: <a data-source="{'a': 'b', 'c': 'd'}">
+        * safe = true --> means no exception will be thrown
+        * for details see http://stackoverflow.com/questions/7410348/how-to-set-json-format-to-html5-data-attributes-in-the-jquery
+        */
+        tryParseJson: function(s, safe) {
+            if (typeof s === 'string' && s.length && s.match(/^[\{\[].*[\}\]]$/)) {
+                if (safe) {
+                    try {
+                        /*jslint evil: true*/
+                        s = (new Function('return ' + s))();
+                        /*jslint evil: false*/
+                    } catch (e) {} finally {
+                        return s;
+                    }
+                } else {
+                    /*jslint evil: true*/
+                    s = (new Function('return ' + s))();
+                    /*jslint evil: false*/
+                }
+            }
+            return s;
+        },
+
+        /**
+        * slice object by specified keys
+        */
+        sliceObj: function(obj, keys, caseSensitive /* default: false */) {
+            var key, keyLower, newObj = {};
+
+            if (!$.isArray(keys) || !keys.length) {
+                return newObj;
+            }
+
+            for (var i = 0; i < keys.length; i++) {
+                key = keys[i];
+                if (obj.hasOwnProperty(key)) {
+                    newObj[key] = obj[key];
+                }
+
+                if(caseSensitive === true) {
+                    continue;
+                }
+
+                //when getting data-* attributes via $.data() it's converted to lowercase.
+                //details: http://stackoverflow.com/questions/7602565/using-data-attributes-with-jquery
+                //workaround is code below.
+                keyLower = key.toLowerCase();
+                if (obj.hasOwnProperty(keyLower)) {
+                    newObj[key] = obj[keyLower];
+                }
+            }
+
+            return newObj;
+        },
+
+        /*
+        exclude complex objects from $.data() before pass to config
+        */
+        getConfigData: function($element) {
+            var data = {};
+            $.each($element.data(), function(k, v) {
+                if(typeof v !== 'object' || (v && typeof v === 'object' && (v.constructor === Object || v.constructor === Array))) {
+                    data[k] = v;
+                }
+            });
+            return data;
+        },
+
+        /*
+         returns keys of object
+        */
+        objectKeys: function(o) {
+            if (Object.keys) {
+                return Object.keys(o);  
+            } else {
+                if (o !== Object(o)) {
+                    throw new TypeError('Object.keys called on a non-object');
+                }
+                var k=[], p;
+                for (p in o) {
+                    if (Object.prototype.hasOwnProperty.call(o,p)) {
+                        k.push(p);
+                    }
+                }
+                return k;
+            }
+
+        },
+        
+       /**
+        method to escape html.
+       **/
+       escape: function(str) {
+           return $('<div>').text(str).html();
+       },
+       
+       /*
+        returns array items from sourceData having value property equal or inArray of 'value'
+       */
+       itemsByValue: function(value, sourceData, valueProp) {
+           if(!sourceData || value === null) {
+               return [];
+           }
+           
+           if (typeof(valueProp) !== "function") {
+               var idKey = valueProp || 'value';
+               valueProp = function (e) { return e[idKey]; };
+           }
+                      
+           var isValArray = $.isArray(value),
+           result = [], 
+           that = this;
+
+           $.each(sourceData, function(i, o) {
+               if(o.children) {
+                   result = result.concat(that.itemsByValue(value, o.children, valueProp));
+               } else {
+                   /*jslint eqeq: true*/
+                   if(isValArray) {
+                       if($.grep(value, function(v){  return v == (o && typeof o === 'object' ? valueProp(o) : o); }).length) {
+                           result.push(o); 
+                       }
+                   } else {
+                       var itemValue = (o && (typeof o === 'object')) ? valueProp(o) : o;
+                       if(value == itemValue) {
+                           result.push(o); 
+                       }
+                   }
+                   /*jslint eqeq: false*/
+               }
+           });
+           
+           return result;
+       },
+       
+       /*
+       Returns input by options: type, mode. 
+       */
+       createInput: function(options) {
+           var TypeConstructor, typeOptions, input,
+           type = options.type;
+
+           //`date` is some kind of virtual type that is transformed to one of exact types
+           //depending on mode and core lib
+           if(type === 'date') {
+               //inline
+               if(options.mode === 'inline') {
+                   if($.fn.editabletypes.datefield) {
+                       type = 'datefield';
+                   } else if($.fn.editabletypes.dateuifield) {
+                       type = 'dateuifield';
+                   }
+               //popup
+               } else {
+                   if($.fn.editabletypes.date) {
+                       type = 'date';
+                   } else if($.fn.editabletypes.dateui) {
+                       type = 'dateui';
+                   }
+               }
+               
+               //if type still `date` and not exist in types, replace with `combodate` that is base input
+               if(type === 'date' && !$.fn.editabletypes.date) {
+                   type = 'combodate';
+               } 
+           }
+           
+           //`datetime` should be datetimefield in 'inline' mode
+           if(type === 'datetime' && options.mode === 'inline') {
+             type = 'datetimefield';  
+           }           
+
+           //change wysihtml5 to textarea for jquery UI and plain versions
+           if(type === 'wysihtml5' && !$.fn.editabletypes[type]) {
+               type = 'textarea';
+           }
+
+           //create input of specified type. Input will be used for converting value, not in form
+           if(typeof $.fn.editabletypes[type] === 'function') {
+               TypeConstructor = $.fn.editabletypes[type];
+               typeOptions = this.sliceObj(options, this.objectKeys(TypeConstructor.defaults));
+               input = new TypeConstructor(typeOptions);
+               return input;
+           } else {
+               $.error('Unknown type: '+ type);
+               return false; 
+           }  
+       },
+       
+       //see http://stackoverflow.com/questions/7264899/detect-css-transitions-using-javascript-and-without-modernizr
+       supportsTransitions: function () {
+           var b = document.body || document.documentElement,
+               s = b.style,
+               p = 'transition',
+               v = ['Moz', 'Webkit', 'Khtml', 'O', 'ms'];
+               
+           if(typeof s[p] === 'string') {
+               return true; 
+           }
+
+           // Tests for vendor specific prop
+           p = p.charAt(0).toUpperCase() + p.substr(1);
+           for(var i=0; i<v.length; i++) {
+               if(typeof s[v[i] + p] === 'string') { 
+                   return true; 
+               }
+           }
+           return false;
+       }            
+       
+    };      
+}(window.jQuery));
+
+/**
+Attaches stand-alone container with editable-form to HTML element. Element is used only for positioning, value is not stored anywhere.<br>
+This method applied internally in <code>$().editable()</code>. You should subscribe on it's events (save / cancel) to get profit of it.<br>
+Final realization can be different: bootstrap-popover, jqueryui-tooltip, poshytip, inline-div. It depends on which js file you include.<br>
+Applied as jQuery method.
+
+@class editableContainer
+@uses editableform
+**/
+(function ($) {
+    "use strict";
+
+    var Popup = function (element, options) {
+        this.init(element, options);
+    };
+    
+    var Inline = function (element, options) {
+        this.init(element, options);
+    };    
+
+    //methods
+    Popup.prototype = {
+        containerName: null, //method to call container on element
+        containerDataName: null, //object name in element's .data()
+        innerCss: null, //tbd in child class
+        containerClass: 'editable-container editable-popup', //css class applied to container element
+        defaults: {}, //container itself defaults
+        
+        init: function(element, options) {
+            this.$element = $(element);
+            //since 1.4.1 container do not use data-* directly as they already merged into options.
+            this.options = $.extend({}, $.fn.editableContainer.defaults, options);         
+            this.splitOptions();
+            
+            //set scope of form callbacks to element
+            this.formOptions.scope = this.$element[0]; 
+            
+            this.initContainer();
+            
+            //flag to hide container, when saving value will finish
+            this.delayedHide = false;
+
+            //bind 'destroyed' listener to destroy container when element is removed from dom
+            this.$element.on('destroyed', $.proxy(function(){
+                this.destroy();
+            }, this)); 
+            
+            //attach document handler to close containers on click / escape
+            if(!$(document).data('editable-handlers-attached')) {
+                //close all on escape
+                $(document).on('keyup.editable', function (e) {
+                    if (e.which === 27) {
+                        $('.editable-open').editableContainer('hide');
+                        //todo: return focus on element 
+                    }
+                });
+
+                //close containers when click outside 
+                //(mousedown could be better than click, it closes everything also on drag drop)
+                $(document).on('click.editable', function(e) {
+                    var $target = $(e.target), i,
+                        exclude_classes = ['.editable-container', 
+                                           '.ui-datepicker-header', 
+                                           '.datepicker', //in inline mode datepicker is rendered into body
+                                           '.modal-backdrop', 
+                                           '.bootstrap-wysihtml5-insert-image-modal', 
+                                           '.bootstrap-wysihtml5-insert-link-modal'
+                                           ];
+                    
+                    //check if element is detached. It occurs when clicking in bootstrap datepicker
+                    if (!$.contains(document.documentElement, e.target)) {
+                      return;
+                    }
+
+                    //for some reason FF 20 generates extra event (click) in select2 widget with e.target = document
+                    //we need to filter it via construction below. See https://github.com/vitalets/x-editable/issues/199
+                    //Possibly related to http://stackoverflow.com/questions/10119793/why-does-firefox-react-differently-from-webkit-and-ie-to-click-event-on-selec
+                    if($target.is(document)) {
+                       return; 
+                    }
+                    
+                    //if click inside one of exclude classes --> no nothing
+                    for(i=0; i<exclude_classes.length; i++) {
+                         if($target.is(exclude_classes[i]) || $target.parents(exclude_classes[i]).length) {
+                             return;
+                         }
+                    }
+                      
+                    //close all open containers (except one - target)
+                    Popup.prototype.closeOthers(e.target);
+                });
+                
+                $(document).data('editable-handlers-attached', true);
+            }                        
+        },
+
+        //split options on containerOptions and formOptions
+        splitOptions: function() {
+            this.containerOptions = {};
+            this.formOptions = {};
+            
+            if(!$.fn[this.containerName]) {
+                throw new Error(this.containerName + ' not found. Have you included corresponding js file?');   
+            }
+            
+            //keys defined in container defaults go to container, others go to form
+            for(var k in this.options) {
+              if(k in this.defaults) {
+                 this.containerOptions[k] = this.options[k];
+              } else {
+                 this.formOptions[k] = this.options[k];
+              } 
+            }
+        },
+        
+        /*
+        Returns jquery object of container
+        @method tip()
+        */         
+        tip: function() {
+            return this.container() ? this.container().$tip : null;
+        },
+
+        /* returns container object */
+        container: function() {
+            var container;
+            //first, try get it by `containerDataName`
+            if(this.containerDataName) {
+                if(container = this.$element.data(this.containerDataName)) {
+                    return container;
+                }
+            }
+            //second, try `containerName`
+            container = this.$element.data(this.containerName);
+            return container;
+        },
+
+        /* call native method of underlying container, e.g. this.$element.popover('method') */ 
+        call: function() {
+            this.$element[this.containerName].apply(this.$element, arguments); 
+        },        
+        
+        initContainer: function(){
+            this.call(this.containerOptions);
+        },
+
+        renderForm: function() {
+            this.$form
+            .editableform(this.formOptions)
+            .on({
+                save: $.proxy(this.save, this), //click on submit button (value changed)
+                nochange: $.proxy(function(){ this.hide('nochange'); }, this), //click on submit button (value NOT changed)                
+                cancel: $.proxy(function(){ this.hide('cancel'); }, this), //click on calcel button
+                show: $.proxy(function() {
+                    if(this.delayedHide) {
+                        this.hide(this.delayedHide.reason);
+                        this.delayedHide = false;
+                    } else {
+                        this.setPosition();
+                    }
+                }, this), //re-position container every time form is shown (occurs each time after loading state)
+                rendering: $.proxy(this.setPosition, this), //this allows to place container correctly when loading shown
+                resize: $.proxy(this.setPosition, this), //this allows to re-position container when form size is changed 
+                rendered: $.proxy(function(){
+                    /**        
+                    Fired when container is shown and form is rendered (for select will wait for loading dropdown options).  
+                    **Note:** Bootstrap popover has own `shown` event that now cannot be separated from x-editable's one.
+                    The workaround is to check `arguments.length` that is always `2` for x-editable.                     
+                    
+                    @event shown 
+                    @param {Object} event event object
+                    @example
+                    $('#username').on('shown', function(e, editable) {
+                        editable.input.$input.val('overwriting value of input..');
+                    });                     
+                    **/                      
+                    /*
+                     TODO: added second param mainly to distinguish from bootstrap's shown event. It's a hotfix that will be solved in future versions via namespaced events.  
+                    */
+                    this.$element.triggerHandler('shown', $(this.options.scope).data('editable')); 
+                }, this) 
+            })
+            .editableform('render');
+        },        
+
+        /**
+        Shows container with form
+        @method show()
+        @param {boolean} closeAll Whether to close all other editable containers when showing this one. Default true.
+        **/
+        /* Note: poshytip owerwrites this method totally! */          
+        show: function (closeAll) {
+            this.$element.addClass('editable-open');
+            if(closeAll !== false) {
+                //close all open containers (except this)
+                this.closeOthers(this.$element[0]);  
+            }
+            
+            //show container itself
+            this.innerShow();
+            this.tip().addClass(this.containerClass);
+
+            /*
+            Currently, form is re-rendered on every show. 
+            The main reason is that we dont know, what will container do with content when closed:
+            remove(), detach() or just hide() - it depends on container.
+            
+            Detaching form itself before hide and re-insert before show is good solution, 
+            but visually it looks ugly --> container changes size before hide.  
+            */             
+            
+            //if form already exist - delete previous data 
+            if(this.$form) {
+                //todo: destroy prev data!
+                //this.$form.destroy();
+            }
+
+            this.$form = $('<div>');
+            
+            //insert form into container body
+            if(this.tip().is(this.innerCss)) {
+                //for inline container
+                this.tip().append(this.$form); 
+            } else {
+                this.tip().find(this.innerCss).append(this.$form);
+            } 
+            
+            //render form
+            this.renderForm();
+        },
+
+        /**
+        Hides container with form
+        @method hide()
+        @param {string} reason Reason caused hiding. Can be <code>save|cancel|onblur|nochange|undefined (=manual)</code>
+        **/         
+        hide: function(reason) {  
+            if(!this.tip() || !this.tip().is(':visible') || !this.$element.hasClass('editable-open')) {
+                return;
+            }
+            
+            //if form is saving value, schedule hide
+            if(this.$form.data('editableform').isSaving) {
+                this.delayedHide = {reason: reason};
+                return;    
+            } else {
+                this.delayedHide = false;
+            }
+
+            this.$element.removeClass('editable-open');   
+            this.innerHide();
+
+            /**
+            Fired when container was hidden. It occurs on both save or cancel.  
+            **Note:** Bootstrap popover has own `hidden` event that now cannot be separated from x-editable's one.
+            The workaround is to check `arguments.length` that is always `2` for x-editable. 
+
+            @event hidden 
+            @param {object} event event object
+            @param {string} reason Reason caused hiding. Can be <code>save|cancel|onblur|nochange|manual</code>
+            @example
+            $('#username').on('hidden', function(e, reason) {
+                if(reason === 'save' || reason === 'cancel') {
+                    //auto-open next editable
+                    $(this).closest('tr').next().find('.editable').editable('show');
+                } 
+            });
+            **/
+            this.$element.triggerHandler('hidden', reason || 'manual');   
+        },
+
+        /* internal show method. To be overwritten in child classes */
+        innerShow: function () {
+             
+        },        
+
+        /* internal hide method. To be overwritten in child classes */
+        innerHide: function () {
+
+        },
+        
+        /**
+        Toggles container visibility (show / hide)
+        @method toggle()
+        @param {boolean} closeAll Whether to close all other editable containers when showing this one. Default true.
+        **/          
+        toggle: function(closeAll) {
+            if(this.container() && this.tip() && this.tip().is(':visible')) {
+                this.hide();
+            } else {
+                this.show(closeAll);
+            } 
+        },
+
+        /*
+        Updates the position of container when content changed.
+        @method setPosition()
+        */       
+        setPosition: function() {
+            //tbd in child class
+        },
+
+        save: function(e, params) {
+            /**        
+            Fired when new value was submitted. You can use <code>$(this).data('editableContainer')</code> inside handler to access to editableContainer instance
+            
+            @event save 
+            @param {Object} event event object
+            @param {Object} params additional params
+            @param {mixed} params.newValue submitted value
+            @param {Object} params.response ajax response
+            @example
+            $('#username').on('save', function(e, params) {
+                //assuming server response: '{success: true}'
+                var pk = $(this).data('editableContainer').options.pk;
+                if(params.response && params.response.success) {
+                    alert('value: ' + params.newValue + ' with pk: ' + pk + ' saved!');
+                } else {
+                    alert('error!'); 
+                } 
+            });
+            **/             
+            this.$element.triggerHandler('save', params);
+            
+            //hide must be after trigger, as saving value may require methods of plugin, applied to input
+            this.hide('save');
+        },
+
+        /**
+        Sets new option
+        
+        @method option(key, value)
+        @param {string} key 
+        @param {mixed} value 
+        **/         
+        option: function(key, value) {
+            this.options[key] = value;
+            if(key in this.containerOptions) {
+                this.containerOptions[key] = value;
+                this.setContainerOption(key, value); 
+            } else {
+                this.formOptions[key] = value;
+                if(this.$form) {
+                    this.$form.editableform('option', key, value);  
+                }
+            }
+        },
+        
+        setContainerOption: function(key, value) {
+            this.call('option', key, value);
+        },
+
+        /**
+        Destroys the container instance
+        @method destroy()
+        **/        
+        destroy: function() {
+            this.hide();
+            this.innerDestroy();
+            this.$element.off('destroyed');
+            this.$element.removeData('editableContainer');
+        },
+        
+        /* to be overwritten in child classes */
+        innerDestroy: function() {
+            
+        }, 
+        
+        /*
+        Closes other containers except one related to passed element. 
+        Other containers can be cancelled or submitted (depends on onblur option)
+        */
+        closeOthers: function(element) {
+            $('.editable-open').each(function(i, el){
+                //do nothing with passed element and it's children
+                if(el === element || $(el).find(element).length) {
+                    return;
+                }
+
+                //otherwise cancel or submit all open containers 
+                var $el = $(el),
+                ec = $el.data('editableContainer');
+
+                if(!ec) {
+                    return;  
+                }
+                
+                if(ec.options.onblur === 'cancel') {
+                    $el.data('editableContainer').hide('onblur');
+                } else if(ec.options.onblur === 'submit') {
+                    $el.data('editableContainer').tip().find('form').submit();
+                }
+            });
+
+        },
+        
+        /**
+        Activates input of visible container (e.g. set focus)
+        @method activate()
+        **/         
+        activate: function() {
+            if(this.tip && this.tip().is(':visible') && this.$form) {
+               this.$form.data('editableform').input.activate(); 
+            }
+        } 
+
+    };
+
+    /**
+    jQuery method to initialize editableContainer.
+    
+    @method $().editableContainer(options)
+    @params {Object} options
+    @example
+    $('#edit').editableContainer({
+        type: 'text',
+        url: '/post',
+        pk: 1,
+        value: 'hello'
+    });
+    **/  
+    $.fn.editableContainer = function (option) {
+        var args = arguments;
+        return this.each(function () {
+            var $this = $(this),
+            dataKey = 'editableContainer', 
+            data = $this.data(dataKey),
+            options = typeof option === 'object' && option,
+            Constructor = (options.mode === 'inline') ? Inline : Popup;             
+
+            if (!data) {
+                $this.data(dataKey, (data = new Constructor(this, options)));
+            }
+
+            if (typeof option === 'string') { //call method 
+                data[option].apply(data, Array.prototype.slice.call(args, 1));
+            }            
+        });
+    };     
+
+    //store constructors
+    $.fn.editableContainer.Popup = Popup;
+    $.fn.editableContainer.Inline = Inline;
+
+    //defaults
+    $.fn.editableContainer.defaults = {
+        /**
+        Initial value of form input
+
+        @property value 
+        @type mixed
+        @default null
+        @private
+        **/        
+        value: null,
+        /**
+        Placement of container relative to element. Can be <code>top|right|bottom|left</code>. Not used for inline container.
+
+        @property placement 
+        @type string
+        @default 'top'
+        **/        
+        placement: 'top',
+        /**
+        Whether to hide container on save/cancel.
+
+        @property autohide 
+        @type boolean
+        @default true
+        @private 
+        **/        
+        autohide: true,
+        /**
+        Action when user clicks outside the container. Can be <code>cancel|submit|ignore</code>.  
+        Setting <code>ignore</code> allows to have several containers open. 
+
+        @property onblur 
+        @type string
+        @default 'cancel'
+        @since 1.1.1
+        **/        
+        onblur: 'cancel',
+        
+        /**
+        Animation speed (inline mode only)
+        @property anim 
+        @type string
+        @default false
+        **/        
+        anim: false,
+        
+        /**
+        Mode of editable, can be `popup` or `inline` 
+        
+        @property mode 
+        @type string         
+        @default 'popup'
+        @since 1.4.0        
+        **/        
+        mode: 'popup'        
+    };
+
+    /* 
+    * workaround to have 'destroyed' event to destroy popover when element is destroyed
+    * see http://stackoverflow.com/questions/2200494/jquery-trigger-event-when-an-element-is-removed-from-the-dom
+    */
+    jQuery.event.special.destroyed = {
+        remove: function(o) {
+            if (o.handler) {
+                o.handler();
+            }
+        }
+    };    
+
+}(window.jQuery));
+
+/**
+* Editable Inline 
+* ---------------------
+*/
+(function ($) {
+    "use strict";
+    
+    //copy prototype from EditableContainer
+    //extend methods
+    $.extend($.fn.editableContainer.Inline.prototype, $.fn.editableContainer.Popup.prototype, {
+        containerName: 'editableform',
+        innerCss: '.editable-inline',
+        containerClass: 'editable-container editable-inline', //css class applied to container element
+                 
+        initContainer: function(){
+            //container is <span> element
+            this.$tip = $('<span></span>');
+            
+            //convert anim to miliseconds (int)
+            if(!this.options.anim) {
+                this.options.anim = 0;
+            }         
+        },
+        
+        splitOptions: function() {
+            //all options are passed to form
+            this.containerOptions = {};
+            this.formOptions = this.options;
+        },
+        
+        tip: function() {
+           return this.$tip; 
+        },
+        
+        innerShow: function () {
+            this.$element.hide();
+            this.tip().insertAfter(this.$element).show();
+        }, 
+        
+        innerHide: function () {
+            this.$tip.hide(this.options.anim, $.proxy(function() {
+                this.$element.show();
+                this.innerDestroy();
+            }, this)); 
+        },
+        
+        innerDestroy: function() {
+            if(this.tip()) {
+                this.tip().empty().remove();
+            }
+        } 
+    });
+
+}(window.jQuery));
+/**
+Makes editable any HTML element on the page. Applied as jQuery method.
+
+@class editable
+@uses editableContainer
+**/
+(function ($) {
+    "use strict";
+
+    var Editable = function (element, options) {
+        this.$element = $(element);
+        //data-* has more priority over js options: because dynamically created elements may change data-* 
+        this.options = $.extend({}, $.fn.editable.defaults, options, $.fn.editableutils.getConfigData(this.$element));  
+        if(this.options.selector) {
+            this.initLive();
+        } else {
+            this.init();
+        }
+        
+        //check for transition support
+        if(this.options.highlight && !$.fn.editableutils.supportsTransitions()) {
+            this.options.highlight = false;
+        }
+    };
+
+    Editable.prototype = {
+        constructor: Editable, 
+        init: function () {
+            var isValueByText = false, 
+                doAutotext, finalize;
+
+            //name
+            this.options.name = this.options.name || this.$element.attr('id');
+             
+            //create input of specified type. Input needed already here to convert value for initial display (e.g. show text by id for select)
+            //also we set scope option to have access to element inside input specific callbacks (e. g. source as function)
+            this.options.scope = this.$element[0]; 
+            this.input = $.fn.editableutils.createInput(this.options);
+            if(!this.input) {
+                return; 
+            }            
+
+            //set value from settings or by element's text
+            if (this.options.value === undefined || this.options.value === null) {
+                this.value = this.input.html2value($.trim(this.$element.html()));
+                isValueByText = true;
+            } else {
+                /*
+                  value can be string when received from 'data-value' attribute
+                  for complext objects value can be set as json string in data-value attribute, 
+                  e.g. data-value="{city: 'Moscow', street: 'Lenina'}"
+                */
+                this.options.value = $.fn.editableutils.tryParseJson(this.options.value, true); 
+                if(typeof this.options.value === 'string') {
+                    this.value = this.input.str2value(this.options.value);
+                } else {
+                    this.value = this.options.value;
+                }
+            }
+            
+            //add 'editable' class to every editable element
+            this.$element.addClass('editable');
+            
+            //specifically for "textarea" add class .editable-pre-wrapped to keep linebreaks
+            if(this.input.type === 'textarea') {
+                this.$element.addClass('editable-pre-wrapped');
+            }
+            
+            //attach handler activating editable. In disabled mode it just prevent default action (useful for links)
+            if(this.options.toggle !== 'manual') {
+                this.$element.addClass('editable-click');
+                this.$element.on(this.options.toggle + '.editable', $.proxy(function(e){
+                    //prevent following link if editable enabled
+                    if(!this.options.disabled) {
+                        e.preventDefault();
+                    }
+                    
+                    //stop propagation not required because in document click handler it checks event target
+                    //e.stopPropagation();
+                    
+                    if(this.options.toggle === 'mouseenter') {
+                        //for hover only show container
+                        this.show();
+                    } else {
+                        //when toggle='click' we should not close all other containers as they will be closed automatically in document click listener
+                        var closeAll = (this.options.toggle !== 'click');
+                        this.toggle(closeAll);
+                    }
+                }, this));
+            } else {
+                this.$element.attr('tabindex', -1); //do not stop focus on element when toggled manually
+            }
+            
+            //if display is function it's far more convinient to have autotext = always to render correctly on init
+            //see https://github.com/vitalets/x-editable-yii/issues/34
+            if(typeof this.options.display === 'function') {
+                this.options.autotext = 'always';
+            }
+            
+            //check conditions for autotext:
+            switch(this.options.autotext) {
+              case 'always':
+               doAutotext = true;
+              break;
+              case 'auto':
+                //if element text is empty and value is defined and value not generated by text --> run autotext
+                doAutotext = !$.trim(this.$element.text()).length && this.value !== null && this.value !== undefined && !isValueByText;
+              break;
+              default:
+               doAutotext = false;
+            }
+
+            //depending on autotext run render() or just finilize init
+            $.when(doAutotext ? this.render() : true).then($.proxy(function() {
+                if(this.options.disabled) {
+                    this.disable();
+                } else {
+                    this.enable(); 
+                }
+               /**        
+               Fired when element was initialized by `$().editable()` method. 
+               Please note that you should setup `init` handler **before** applying `editable`. 
+                              
+               @event init 
+               @param {Object} event event object
+               @param {Object} editable editable instance (as here it cannot accessed via data('editable'))
+               @since 1.2.0
+               @example
+               $('#username').on('init', function(e, editable) {
+                   alert('initialized ' + editable.options.name);
+               });
+               $('#username').editable();
+               **/                  
+                this.$element.triggerHandler('init', this);
+            }, this));
+        },
+
+        /*
+         Initializes parent element for live editables 
+        */
+        initLive: function() {
+           //store selector 
+           var selector = this.options.selector;
+           //modify options for child elements
+           this.options.selector = false; 
+           this.options.autotext = 'never';
+           //listen toggle events
+           this.$element.on(this.options.toggle + '.editable', selector, $.proxy(function(e){
+               var $target = $(e.target);
+               if(!$target.data('editable')) {
+                   //if delegated element initially empty, we need to clear it's text (that was manually set to `empty` by user)
+                   //see https://github.com/vitalets/x-editable/issues/137 
+                   if($target.hasClass(this.options.emptyclass)) {
+                      $target.empty();
+                   }
+                   $target.editable(this.options).trigger(e);
+               }
+           }, this)); 
+        },
+        
+        /*
+        Renders value into element's text.
+        Can call custom display method from options.
+        Can return deferred object.
+        @method render()
+        @param {mixed} response server response (if exist) to pass into display function
+        */          
+        render: function(response) {
+            //do not display anything
+            if(this.options.display === false) {
+                return;
+            }
+            
+            //if input has `value2htmlFinal` method, we pass callback in third param to be called when source is loaded
+            if(this.input.value2htmlFinal) {
+                return this.input.value2html(this.value, this.$element[0], this.options.display, response); 
+            //if display method defined --> use it    
+            } else if(typeof this.options.display === 'function') {
+                return this.options.display.call(this.$element[0], this.value, response);
+            //else use input's original value2html() method    
+            } else {
+                return this.input.value2html(this.value, this.$element[0]); 
+            }
+        },
+        
+        /**
+        Enables editable
+        @method enable()
+        **/          
+        enable: function() {
+            this.options.disabled = false;
+            this.$element.removeClass('editable-disabled');
+            this.handleEmpty(this.isEmpty);
+            if(this.options.toggle !== 'manual') {
+                if(this.$element.attr('tabindex') === '-1') {    
+                    this.$element.removeAttr('tabindex');                                
+                }
+            }
+        },
+        
+        /**
+        Disables editable
+        @method disable()
+        **/         
+        disable: function() {
+            this.options.disabled = true; 
+            this.hide();           
+            this.$element.addClass('editable-disabled');
+            this.handleEmpty(this.isEmpty);
+            //do not stop focus on this element
+            this.$element.attr('tabindex', -1);                
+        },
+        
+        /**
+        Toggles enabled / disabled state of editable element
+        @method toggleDisabled()
+        **/         
+        toggleDisabled: function() {
+            if(this.options.disabled) {
+                this.enable();
+            } else { 
+                this.disable(); 
+            }
+        },  
+        
+        /**
+        Sets new option
+        
+        @method option(key, value)
+        @param {string|object} key option name or object with several options
+        @param {mixed} value option new value
+        @example
+        $('.editable').editable('option', 'pk', 2);
+        **/          
+        option: function(key, value) {
+            //set option(s) by object
+            if(key && typeof key === 'object') {
+               $.each(key, $.proxy(function(k, v){
+                  this.option($.trim(k), v); 
+               }, this)); 
+               return;
+            }
+
+            //set option by string             
+            this.options[key] = value;                          
+            
+            //disabled
+            if(key === 'disabled') {
+               return value ? this.disable() : this.enable();
+            } 
+            
+            //value
+            if(key === 'value') {
+                this.setValue(value);
+            }
+            
+            //transfer new option to container! 
+            if(this.container) {
+                this.container.option(key, value);  
+            }
+             
+            //pass option to input directly (as it points to the same in form)
+            if(this.input.option) {
+                this.input.option(key, value);
+            }
+            
+        },              
+        
+        /*
+        * set emptytext if element is empty
+        */
+        handleEmpty: function (isEmpty) {
+            //do not handle empty if we do not display anything
+            if(this.options.display === false) {
+                return;
+            }
+
+            /* 
+            isEmpty may be set directly as param of method.
+            It is required when we enable/disable field and can't rely on content 
+            as node content is text: "Empty" that is not empty %)
+            */
+            if(isEmpty !== undefined) { 
+                this.isEmpty = isEmpty;
+            } else {
+                //detect empty
+                //for some inputs we need more smart check
+                //e.g. wysihtml5 may have <br>, <p></p>, <img>
+                if(typeof(this.input.isEmpty) === 'function') {
+                    this.isEmpty = this.input.isEmpty(this.$element);                    
+                } else {
+                    this.isEmpty = $.trim(this.$element.html()) === '';
+                }
+            }           
+            
+            //emptytext shown only for enabled
+            if(!this.options.disabled) {
+                if (this.isEmpty) {
+                    this.$element.html(this.options.emptytext);
+                    if(this.options.emptyclass) {
+                        this.$element.addClass(this.options.emptyclass);
+                    }
+                } else if(this.options.emptyclass) {
+                    this.$element.removeClass(this.options.emptyclass);
+                }
+            } else {
+                //below required if element disable property was changed
+                if(this.isEmpty) {
+                    this.$element.empty();
+                    if(this.options.emptyclass) {
+                        this.$element.removeClass(this.options.emptyclass);
+                    }
+                }
+            }
+        },        
+        
+        /**
+        Shows container with form
+        @method show()
+        @param {boolean} closeAll Whether to close all other editable containers when showing this one. Default true.
+        **/  
+        show: function (closeAll) {
+            if(this.options.disabled) {
+                return;
+            }
+            
+            //init editableContainer: popover, tooltip, inline, etc..
+            if(!this.container) {
+                var containerOptions = $.extend({}, this.options, {
+                    value: this.value,
+                    input: this.input //pass input to form (as it is already created)
+                });
+                this.$element.editableContainer(containerOptions);
+                //listen `save` event 
+                this.$element.on("save.internal", $.proxy(this.save, this));
+                this.container = this.$element.data('editableContainer'); 
+            } else if(this.container.tip().is(':visible')) {
+                return;
+            }      
+            
+            //show container
+            this.container.show(closeAll);
+        },
+        
+        /**
+        Hides container with form
+        @method hide()
+        **/       
+        hide: function () {   
+            if(this.container) {  
+                this.container.hide();
+            }
+        },
+        
+        /**
+        Toggles container visibility (show / hide)
+        @method toggle()
+        @param {boolean} closeAll Whether to close all other editable containers when showing this one. Default true.
+        **/  
+        toggle: function(closeAll) {
+            if(this.container && this.container.tip().is(':visible')) {
+                this.hide();
+            } else {
+                this.show(closeAll);
+            }
+        },
+        
+        /*
+        * called when form was submitted
+        */          
+        save: function(e, params) {
+            //mark element with unsaved class if needed
+            if(this.options.unsavedclass) {
+                /*
+                 Add unsaved css to element if:
+                  - url is not user's function 
+                  - value was not sent to server
+                  - params.response === undefined, that means data was not sent
+                  - value changed 
+                */
+                var sent = false;
+                sent = sent || typeof this.options.url === 'function';
+                sent = sent || this.options.display === false; 
+                sent = sent || params.response !== undefined; 
+                sent = sent || (this.options.savenochange && this.input.value2str(this.value) !== this.input.value2str(params.newValue)); 
+                
+                if(sent) {
+                    this.$element.removeClass(this.options.unsavedclass); 
+                } else {
+                    this.$element.addClass(this.options.unsavedclass);                    
+                }
+            }
+            
+            //highlight when saving
+            if(this.options.highlight) {
+                var $e = this.$element,
+                    bgColor = $e.css('background-color');
+                    
+                $e.css('background-color', this.options.highlight);
+                setTimeout(function(){
+                    if(bgColor === 'transparent') {
+                        bgColor = ''; 
+                    }
+                    $e.css('background-color', bgColor);
+                    $e.addClass('editable-bg-transition');
+                    setTimeout(function(){
+                       $e.removeClass('editable-bg-transition');  
+                    }, 1700);
+                }, 10);
+            }
+            
+            //set new value
+            this.setValue(params.newValue, false, params.response);
+            
+            /**        
+            Fired when new value was submitted. You can use <code>$(this).data('editable')</code> to access to editable instance
+            
+            @event save 
+            @param {Object} event event object
+            @param {Object} params additional params
+            @param {mixed} params.newValue submitted value
+            @param {Object} params.response ajax response
+            @example
+            $('#username').on('save', function(e, params) {
+                alert('Saved value: ' + params.newValue);
+            });
+            **/
+            //event itself is triggered by editableContainer. Description here is only for documentation              
+        },
+
+        validate: function () {
+            if (typeof this.options.validate === 'function') {
+                return this.options.validate.call(this, this.value);
+            }
+        },
+        
+        /**
+        Sets new value of editable
+        @method setValue(value, convertStr)
+        @param {mixed} value new value 
+        @param {boolean} convertStr whether to convert value from string to internal format
+        **/         
+        setValue: function(value, convertStr, response) {
+            if(convertStr) {
+                this.value = this.input.str2value(value);
+            } else {
+                this.value = value;
+            }
+            if(this.container) {
+                this.container.option('value', this.value);
+            }
+            $.when(this.render(response))
+            .then($.proxy(function() {
+                this.handleEmpty();
+            }, this));
+        },
+        
+        /**
+        Activates input of visible container (e.g. set focus)
+        @method activate()
+        **/         
+        activate: function() {
+            if(this.container) {
+               this.container.activate(); 
+            }
+        },
+        
+        /**
+        Removes editable feature from element
+        @method destroy()
+        **/        
+        destroy: function() {
+            this.disable();
+            
+            if(this.container) {
+               this.container.destroy(); 
+            }
+            
+            this.input.destroy();
+
+            if(this.options.toggle !== 'manual') {
+                this.$element.removeClass('editable-click');
+                this.$element.off(this.options.toggle + '.editable');
+            } 
+            
+            this.$element.off("save.internal");
+            
+            this.$element.removeClass('editable editable-open editable-disabled');
+            this.$element.removeData('editable');
+        }        
+    };
+
+    /* EDITABLE PLUGIN DEFINITION
+    * ======================= */
+
+    /**
+    jQuery method to initialize editable element.
+    
+    @method $().editable(options)
+    @params {Object} options
+    @example
+    $('#username').editable({
+        type: 'text',
+        url: '/post',
+        pk: 1
+    });
+    **/
+    $.fn.editable = function (option) {
+        //special API methods returning non-jquery object
+        var result = {}, args = arguments, datakey = 'editable';
+        switch (option) {
+            /**
+            Runs client-side validation for all matched editables
+            
+            @method validate()
+            @returns {Object} validation errors map
+            @example
+            $('#username, #fullname').editable('validate');
+            // possible result:
+            {
+              username: "username is required",
+              fullname: "fullname should be minimum 3 letters length"
+            }
+            **/
+            case 'validate':
+                this.each(function () {
+                    var $this = $(this), data = $this.data(datakey), error;
+                    if (data && (error = data.validate())) {
+                        result[data.options.name] = error;
+                    }
+                });
+            return result;
+
+            /**
+            Returns current values of editable elements.   
+            Note that it returns an **object** with name-value pairs, not a value itself. It allows to get data from several elements.    
+            If value of some editable is `null` or `undefined` it is excluded from result object.
+            When param `isSingle` is set to **true** - it is supposed you have single element and will return value of editable instead of object.   
+             
+            @method getValue()
+            @param {bool} isSingle whether to return just value of single element
+            @returns {Object} object of element names and values
+            @example
+            $('#username, #fullname').editable('getValue');
+            //result:
+            {
+            username: "superuser",
+            fullname: "John"
+            }
+            //isSingle = true
+            $('#username').editable('getValue', true);
+            //result "superuser" 
+            **/
+            case 'getValue':
+                if(arguments.length === 2 && arguments[1] === true) { //isSingle = true
+                    result = this.eq(0).data(datakey).value;
+                } else {
+                    this.each(function () {
+                        var $this = $(this), data = $this.data(datakey);
+                        if (data && data.value !== undefined && data.value !== null) {
+                            result[data.options.name] = data.input.value2submit(data.value);
+                        }
+                    });
+                }
+            return result;
+
+            /**
+            This method collects values from several editable elements and submit them all to server.   
+            Internally it runs client-side validation for all fields and submits only in case of success.  
+            See <a href="#newrecord">creating new records</a> for details.  
+            Since 1.5.1 `submit` can be applied to single element to send data programmatically. In that case
+            `url`, `success` and `error` is taken from initial options and you can just call `$('#username').editable('submit')`. 
+            
+            @method submit(options)
+            @param {object} options 
+            @param {object} options.url url to submit data 
+            @param {object} options.data additional data to submit
+            @param {object} options.ajaxOptions additional ajax options
+            @param {function} options.error(obj) error handler 
+            @param {function} options.success(obj,config) success handler
+            @returns {Object} jQuery object
+            **/
+            case 'submit':  //collects value, validate and submit to server for creating new record
+                var config = arguments[1] || {},
+                $elems = this,
+                errors = this.editable('validate');
+
+                // validation ok
+                if($.isEmptyObject(errors)) {
+                    var ajaxOptions = {};
+                                                      
+                    // for single element use url, success etc from options
+                    if($elems.length === 1) {
+                        var editable = $elems.data('editable');
+                        //standard params
+                        var params = {
+                            name: editable.options.name || '',
+                            value: editable.input.value2submit(editable.value),
+                            pk: (typeof editable.options.pk === 'function') ? 
+                                editable.options.pk.call(editable.options.scope) : 
+                                editable.options.pk 
+                        };
+
+                        //additional params
+                        if(typeof editable.options.params === 'function') {
+                            params = editable.options.params.call(editable.options.scope, params);  
+                        } else {
+                            //try parse json in single quotes (from data-params attribute)
+                            editable.options.params = $.fn.editableutils.tryParseJson(editable.options.params, true);   
+                            $.extend(params, editable.options.params);
+                        }
+
+                        ajaxOptions = {
+                            url: editable.options.url,
+                            data: params,
+                            type: 'POST'  
+                        };
+                        
+                        // use success / error from options 
+                        config.success = config.success || editable.options.success;
+                        config.error = config.error || editable.options.error;
+                        
+                    // multiple elements
+                    } else {
+                        var values = this.editable('getValue'); 
+                        
+                        ajaxOptions = {
+                            url: config.url,
+                            data: values, 
+                            type: 'POST'
+                        };                        
+                    }                    
+
+                    // ajax success callabck (response 200 OK)
+                    ajaxOptions.success = typeof config.success === 'function' ? function(response) {
+                            config.success.call($elems, response, config);
+                        } : $.noop;
+                                  
+                    // ajax error callabck
+                    ajaxOptions.error = typeof config.error === 'function' ? function() {
+                             config.error.apply($elems, arguments);
+                        } : $.noop;
+                       
+                    // extend ajaxOptions    
+                    if(config.ajaxOptions) { 
+                        $.extend(ajaxOptions, config.ajaxOptions);
+                    }
+                    
+                    // extra data 
+                    if(config.data) {
+                        $.extend(ajaxOptions.data, config.data);
+                    }                     
+                    
+                    // perform ajax request
+                    $.ajax(ajaxOptions);
+                } else { //client-side validation error
+                    if(typeof config.error === 'function') {
+                        config.error.call($elems, errors);
+                    }
+                }
+            return this;
+        }
+
+        //return jquery object
+        return this.each(function () {
+            var $this = $(this), 
+                data = $this.data(datakey), 
+                options = typeof option === 'object' && option;
+
+            //for delegated targets do not store `editable` object for element
+            //it's allows several different selectors.
+            //see: https://github.com/vitalets/x-editable/issues/312    
+            if(options && options.selector) {
+                data = new Editable(this, options);
+                return; 
+            }    
+            
+            if (!data) {
+                $this.data(datakey, (data = new Editable(this, options)));
+            }
+
+            if (typeof option === 'string') { //call method 
+                data[option].apply(data, Array.prototype.slice.call(args, 1));
+            } 
+        });
+    };    
+            
+
+    $.fn.editable.defaults = {
+        /**
+        Type of input. Can be <code>text|textarea|select|date|checklist</code> and more
+
+        @property type 
+        @type string
+        @default 'text'
+        **/
+        type: 'text',        
+        /**
+        Sets disabled state of editable
+
+        @property disabled 
+        @type boolean
+        @default false
+        **/         
+        disabled: false,
+        /**
+        How to toggle editable. Can be <code>click|dblclick|mouseenter|manual</code>.   
+        When set to <code>manual</code> you should manually call <code>show/hide</code> methods of editable.    
+        **Note**: if you call <code>show</code> or <code>toggle</code> inside **click** handler of some DOM element, 
+        you need to apply <code>e.stopPropagation()</code> because containers are being closed on any click on document.
+        
+        @example
+        $('#edit-button').click(function(e) {
+            e.stopPropagation();
+            $('#username').editable('toggle');
+        });
+
+        @property toggle 
+        @type string
+        @default 'click'
+        **/          
+        toggle: 'click',
+        /**
+        Text shown when element is empty.
+
+        @property emptytext 
+        @type string
+        @default 'Empty'
+        **/         
+        emptytext: 'Empty',
+        /**
+        Allows to automatically set element's text based on it's value. Can be <code>auto|always|never</code>. Useful for select and date.
+        For example, if dropdown list is <code>{1: 'a', 2: 'b'}</code> and element's value set to <code>1</code>, it's html will be automatically set to <code>'a'</code>.  
+        <code>auto</code> - text will be automatically set only if element is empty.  
+        <code>always|never</code> - always(never) try to set element's text.
+
+        @property autotext 
+        @type string
+        @default 'auto'
+        **/          
+        autotext: 'auto', 
+        /**
+        Initial value of input. If not set, taken from element's text.  
+        Note, that if element's text is empty - text is automatically generated from value and can be customized (see `autotext` option).  
+        For example, to display currency sign:
+        @example
+        <a id="price" data-type="text" data-value="100"></a>
+        <script>
+        $('#price').editable({
+            ...
+            display: function(value) {
+              $(this).text(value + '$');
+            } 
+        }) 
+        </script>
+                
+        @property value 
+        @type mixed
+        @default element's text
+        **/
+        value: null,
+        /**
+        Callback to perform custom displaying of value in element's text.  
+        If `null`, default input's display used.  
+        If `false`, no displaying methods will be called, element's text will never change.  
+        Runs under element's scope.  
+        _**Parameters:**_  
+        
+        * `value` current value to be displayed
+        * `response` server response (if display called after ajax submit), since 1.4.0
+         
+        For _inputs with source_ (select, checklist) parameters are different:  
+          
+        * `value` current value to be displayed
+        * `sourceData` array of items for current input (e.g. dropdown items) 
+        * `response` server response (if display called after ajax submit), since 1.4.0
+                  
+        To get currently selected items use `$.fn.editableutils.itemsByValue(value, sourceData)`.
+        
+        @property display 
+        @type function|boolean
+        @default null
+        @since 1.2.0
+        @example
+        display: function(value, sourceData) {
+           //display checklist as comma-separated values
+           var html = [],
+               checked = $.fn.editableutils.itemsByValue(value, sourceData);
+               
+           if(checked.length) {
+               $.each(checked, function(i, v) { html.push($.fn.editableutils.escape(v.text)); });
+               $(this).html(html.join(', '));
+           } else {
+               $(this).empty(); 
+           }
+        }
+        **/          
+        display: null,
+        /**
+        Css class applied when editable text is empty.
+
+        @property emptyclass 
+        @type string
+        @since 1.4.1        
+        @default editable-empty
+        **/        
+        emptyclass: 'editable-empty',
+        /**
+        Css class applied when value was stored but not sent to server (`pk` is empty or `send = 'never'`).  
+        You may set it to `null` if you work with editables locally and submit them together.  
+
+        @property unsavedclass 
+        @type string
+        @since 1.4.1        
+        @default editable-unsaved
+        **/        
+        unsavedclass: 'editable-unsaved',
+        /**
+        If selector is provided, editable will be delegated to the specified targets.  
+        Usefull for dynamically generated DOM elements.  
+        **Please note**, that delegated targets can't be initialized with `emptytext` and `autotext` options, 
+        as they actually become editable only after first click.  
+        You should manually set class `editable-click` to these elements.  
+        Also, if element originally empty you should add class `editable-empty`, set `data-value=""` and write emptytext into element:
+
+        @property selector 
+        @type string
+        @since 1.4.1        
+        @default null
+        @example
+        <div id="user">
+          <!-- empty -->
+          <a href="#" data-name="username" data-type="text" class="editable-click editable-empty" data-value="" title="Username">Empty</a>
+          <!-- non-empty -->
+          <a href="#" data-name="group" data-type="select" data-source="/groups" data-value="1" class="editable-click" title="Group">Operator</a>
+        </div>     
+        
+        <script>
+        $('#user').editable({
+            selector: 'a',
+            url: '/post',
+            pk: 1
+        });
+        </script>
+        **/         
+        selector: null,
+        /**
+        Color used to highlight element after update. Implemented via CSS3 transition, works in modern browsers.
+        
+        @property highlight 
+        @type string|boolean
+        @since 1.4.5        
+        @default #FFFF80 
+        **/
+        highlight: '#FFFF80'
+    };
+    
+}(window.jQuery));
+
+/**
+AbstractInput - base class for all editable inputs.
+It defines interface to be implemented by any input type.
+To create your own input you can inherit from this class.
+
+@class abstractinput
+**/
+(function ($) {
+    "use strict";
+
+    //types
+    $.fn.editabletypes = {};
+
+    var AbstractInput = function () { };
+
+    AbstractInput.prototype = {
+       /**
+        Initializes input
+
+        @method init() 
+        **/
+       init: function(type, options, defaults) {
+           this.type = type;
+           this.options = $.extend({}, defaults, options);
+       },
+
+       /*
+       this method called before render to init $tpl that is inserted in DOM
+       */
+       prerender: function() {
+           this.$tpl = $(this.options.tpl); //whole tpl as jquery object    
+           this.$input = this.$tpl;         //control itself, can be changed in render method
+           this.$clear = null;              //clear button
+           this.error = null;               //error message, if input cannot be rendered           
+       },
+       
+       /**
+        Renders input from tpl. Can return jQuery deferred object.
+        Can be overwritten in child objects
+
+        @method render()
+       **/
+       render: function() {
+
+       }, 
+
+       /**
+        Sets element's html by value. 
+
+        @method value2html(value, element)
+        @param {mixed} value
+        @param {DOMElement} element
+       **/
+       value2html: function(value, element) {
+           $(element)[this.options.escape ? 'text' : 'html']($.trim(value));
+       },
+
+       /**
+        Converts element's html to value
+
+        @method html2value(html)
+        @param {string} html
+        @returns {mixed}
+       **/
+       html2value: function(html) {
+           return $('<div>').html(html).text();
+       },
+
+       /**
+        Converts value to string (for internal compare). For submitting to server used value2submit().
+
+        @method value2str(value) 
+        @param {mixed} value
+        @returns {string}
+       **/
+       value2str: function(value) {
+           return value;
+       }, 
+
+       /**
+        Converts string received from server into value. Usually from `data-value` attribute.
+
+        @method str2value(str)
+        @param {string} str
+        @returns {mixed}
+       **/
+       str2value: function(str) {
+           return str;
+       }, 
+       
+       /**
+        Converts value for submitting to server. Result can be string or object.
+
+        @method value2submit(value) 
+        @param {mixed} value
+        @returns {mixed}
+       **/
+       value2submit: function(value) {
+           return value;
+       },
+
+       /**
+        Sets value of input.
+
+        @method value2input(value) 
+        @param {mixed} value
+       **/
+       value2input: function(value) {
+           this.$input.val(value);
+       },
+
+       /**
+        Returns value of input. Value can be object (e.g. datepicker)
+
+        @method input2value() 
+       **/
+       input2value: function() { 
+           return this.$input.val();
+       }, 
+
+       /**
+        Activates input. For text it sets focus.
+
+        @method activate() 
+       **/
+       activate: function() {
+           if(this.$input.is(':visible')) {
+               this.$input.focus();
+           }
+       },
+
+       /**
+        Creates input.
+
+        @method clear() 
+       **/        
+       clear: function() {
+           this.$input.val(null);
+       },
+
+       /**
+        method to escape html.
+       **/
+       escape: function(str) {
+           return $('<div>').text(str).html();
+       },
+       
+       /**
+        attach handler to automatically submit form when value changed (useful when buttons not shown)
+       **/
+       autosubmit: function() {
+        
+       },
+       
+       /**
+       Additional actions when destroying element 
+       **/
+       destroy: function() {
+       },
+
+       // -------- helper functions --------
+       setClass: function() {          
+           if(this.options.inputclass) {
+               this.$input.addClass(this.options.inputclass); 
+           } 
+       },
+
+       setAttr: function(attr) {
+           if (this.options[attr] !== undefined && this.options[attr] !== null) {
+               this.$input.attr(attr, this.options[attr]);
+           } 
+       },
+       
+       option: function(key, value) {
+            this.options[key] = value;
+       }
+       
+    };
+        
+    AbstractInput.defaults = {  
+        /**
+        HTML template of input. Normally you should not change it.
+
+        @property tpl 
+        @type string
+        @default ''
+        **/   
+        tpl: '',
+        /**
+        CSS class automatically applied to input
+        
+        @property inputclass 
+        @type string
+        @default null
+        **/         
+        inputclass: null,
+        
+        /**
+        If `true` - html will be escaped in content of element via $.text() method.  
+        If `false` - html will not be escaped, $.html() used.  
+        When you use own `display` function, this option obviosly has no effect.
+        
+        @property escape 
+        @type boolean
+        @since 1.5.0
+        @default true
+        **/         
+        escape: true,
+                
+        //scope for external methods (e.g. source defined as function)
+        //for internal use only
+        scope: null,
+        
+        //need to re-declare showbuttons here to get it's value from common config (passed only options existing in defaults)
+        showbuttons: true 
+    };
+    
+    $.extend($.fn.editabletypes, {abstractinput: AbstractInput});
+        
+}(window.jQuery));
+
+/**
+List - abstract class for inputs that have source option loaded from js array or via ajax
+
+@class list
+@extends abstractinput
+**/
+(function ($) {
+    "use strict";
+    
+    var List = function (options) {
+       
+    };
+
+    $.fn.editableutils.inherit(List, $.fn.editabletypes.abstractinput);
+
+    $.extend(List.prototype, {
+        render: function () {
+            var deferred = $.Deferred();
+
+            this.error = null;
+            this.onSourceReady(function () {
+                this.renderList();
+                deferred.resolve();
+            }, function () {
+                this.error = this.options.sourceError;
+                deferred.resolve();
+            });
+
+            return deferred.promise();
+        },
+
+        html2value: function (html) {
+            return null; //can't set value by text
+        },
+        
+        value2html: function (value, element, display, response) {
+            var deferred = $.Deferred(),
+                success = function () {
+                    if(typeof display === 'function') {
+                        //custom display method
+                        display.call(element, value, this.sourceData, response); 
+                    } else {
+                        this.value2htmlFinal(value, element);
+                    }
+                    deferred.resolve();
+               };
+            
+            //for null value just call success without loading source
+            if(value === null) {
+               success.call(this);   
+            } else {
+               this.onSourceReady(success, function () { deferred.resolve(); });
+            }
+
+            return deferred.promise();
+        },  
+
+        // ------------- additional functions ------------
+
+        onSourceReady: function (success, error) {
+            //run source if it function
+            var source;
+            if ($.isFunction(this.options.source)) {
+                source = this.options.source.call(this.options.scope);
+                this.sourceData = null;
+                //note: if function returns the same source as URL - sourceData will be taken from cahce and no extra request performed
+            } else {
+                source = this.options.source;
+            }            
+            
+            //if allready loaded just call success
+            if(this.options.sourceCache && $.isArray(this.sourceData)) {
+                success.call(this);
+                return; 
+            }
+
+            //try parse json in single quotes (for double quotes jquery does automatically)
+            try {
+                source = $.fn.editableutils.tryParseJson(source, false);
+            } catch (e) {
+                error.call(this);
+                return;
+            }
+
+            //loading from url
+            if (typeof source === 'string') {
+                //try to get sourceData from cache
+                if(this.options.sourceCache) {
+                    var cacheID = source,
+                    cache;
+
+                    if (!$(document).data(cacheID)) {
+                        $(document).data(cacheID, {});
+                    }
+                    cache = $(document).data(cacheID);
+
+                    //check for cached data
+                    if (cache.loading === false && cache.sourceData) { //take source from cache
+                        this.sourceData = cache.sourceData;
+                        this.doPrepend();
+                        success.call(this);
+                        return;
+                    } else if (cache.loading === true) { //cache is loading, put callback in stack to be called later
+                        cache.callbacks.push($.proxy(function () {
+                            this.sourceData = cache.sourceData;
+                            this.doPrepend();
+                            success.call(this);
+                        }, this));
+
+                        //also collecting error callbacks
+                        cache.err_callbacks.push($.proxy(error, this));
+                        return;
+                    } else { //no cache yet, activate it
+                        cache.loading = true;
+                        cache.callbacks = [];
+                        cache.err_callbacks = [];
+                    }
+                }
+                
+                //ajaxOptions for source. Can be overwritten bt options.sourceOptions
+                var ajaxOptions = $.extend({
+                    url: source,
+                    type: 'get',
+                    cache: false,
+                    dataType: 'json',
+                    success: $.proxy(function (data) {
+                        if(cache) {
+                            cache.loading = false;
+                        }
+                        this.sourceData = this.makeArray(data);
+                        if($.isArray(this.sourceData)) {
+                            if(cache) {
+                                //store result in cache
+                                cache.sourceData = this.sourceData;
+                                //run success callbacks for other fields waiting for this source
+                                $.each(cache.callbacks, function () { this.call(); }); 
+                            }
+                            this.doPrepend();
+                            success.call(this);
+                        } else {
+                            error.call(this);
+                            if(cache) {
+                                //run error callbacks for other fields waiting for this source
+                                $.each(cache.err_callbacks, function () { this.call(); }); 
+                            }
+                        }
+                    }, this),
+                    error: $.proxy(function () {
+                        error.call(this);
+                        if(cache) {
+                             cache.loading = false;
+                             //run error callbacks for other fields
+                             $.each(cache.err_callbacks, function () { this.call(); }); 
+                        }
+                    }, this)
+                }, this.options.sourceOptions);
+                
+                //loading sourceData from server
+                $.ajax(ajaxOptions);
+                
+            } else { //options as json/array
+                this.sourceData = this.makeArray(source);
+                    
+                if($.isArray(this.sourceData)) {
+                    this.doPrepend();
+                    success.call(this);   
+                } else {
+                    error.call(this);
+                }
+            }
+        },
+
+        doPrepend: function () {
+            if(this.options.prepend === null || this.options.prepend === undefined) {
+                return;  
+            }
+            
+            if(!$.isArray(this.prependData)) {
+                //run prepend if it is function (once)
+                if ($.isFunction(this.options.prepend)) {
+                    this.options.prepend = this.options.prepend.call(this.options.scope);
+                }
+              
+                //try parse json in single quotes
+                this.options.prepend = $.fn.editableutils.tryParseJson(this.options.prepend, true);
+                
+                //convert prepend from string to object
+                if (typeof this.options.prepend === 'string') {
+                    this.options.prepend = {'': this.options.prepend};
+                }
+                
+                this.prependData = this.makeArray(this.options.prepend);
+            }
+
+            if($.isArray(this.prependData) && $.isArray(this.sourceData)) {
+                this.sourceData = this.prependData.concat(this.sourceData);
+            }
+        },
+
+        /*
+         renders input list
+        */
+        renderList: function() {
+            // this method should be overwritten in child class
+        },
+       
+         /*
+         set element's html by value
+        */
+        value2htmlFinal: function(value, element) {
+            // this method should be overwritten in child class
+        },        
+
+        /**
+        * convert data to array suitable for sourceData, e.g. [{value: 1, text: 'abc'}, {...}]
+        */
+        makeArray: function(data) {
+            var count, obj, result = [], item, iterateItem;
+            if(!data || typeof data === 'string') {
+                return null; 
+            }
+
+            if($.isArray(data)) { //array
+                /* 
+                   function to iterate inside item of array if item is object.
+                   Caclulates count of keys in item and store in obj. 
+                */
+                iterateItem = function (k, v) {
+                    obj = {value: k, text: v};
+                    if(count++ >= 2) {
+                        return false;// exit from `each` if item has more than one key.
+                    }
+                };
+            
+                for(var i = 0; i < data.length; i++) {
+                    item = data[i]; 
+                    if(typeof item === 'object') {
+                        count = 0; //count of keys inside item
+                        $.each(item, iterateItem);
+                        //case: [{val1: 'text1'}, {val2: 'text2} ...]
+                        if(count === 1) { 
+                            result.push(obj); 
+                            //case: [{value: 1, text: 'text1'}, {value: 2, text: 'text2'}, ...]
+                        } else if(count > 1) {
+                            //removed check of existance: item.hasOwnProperty('value') && item.hasOwnProperty('text')
+                            if(item.children) {
+                                item.children = this.makeArray(item.children);   
+                            }
+                            result.push(item);
+                        }
+                    } else {
+                        //case: ['text1', 'text2' ...]
+                        result.push({value: item, text: item}); 
+                    }
+                }
+            } else {  //case: {val1: 'text1', val2: 'text2, ...}
+                $.each(data, function (k, v) {
+                    result.push({value: k, text: v});
+                });  
+            }
+            return result;
+        },
+        
+        option: function(key, value) {
+            this.options[key] = value;
+            if(key === 'source') {
+                this.sourceData = null;
+            }
+            if(key === 'prepend') {
+                this.prependData = null;
+            }            
+        }        
+
+    });      
+
+    List.defaults = $.extend({}, $.fn.editabletypes.abstractinput.defaults, {
+        /**
+        Source data for list.  
+        If **array** - it should be in format: `[{value: 1, text: "text1"}, {value: 2, text: "text2"}, ...]`  
+        For compability, object format is also supported: `{"1": "text1", "2": "text2" ...}` but it does not guarantee elements order.
+        
+        If **string** - considered ajax url to load items. In that case results will be cached for fields with the same source and name. See also `sourceCache` option.
+          
+        If **function**, it should return data in format above (since 1.4.0).
+        
+        Since 1.4.1 key `children` supported to render OPTGROUP (for **select** input only).  
+        `[{text: "group1", children: [{value: 1, text: "text1"}, {value: 2, text: "text2"}]}, ...]` 
+
+		
+        @property source 
+        @type string | array | object | function
+        @default null
+        **/         
+        source: null, 
+        /**
+        Data automatically prepended to the beginning of dropdown list.
+        
+        @property prepend 
+        @type string | array | object | function
+        @default false
+        **/         
+        prepend: false,
+        /**
+        Error message when list cannot be loaded (e.g. ajax error)
+        
+        @property sourceError 
+        @type string
+        @default Error when loading list
+        **/          
+        sourceError: 'Error when loading list',
+        /**
+        if <code>true</code> and source is **string url** - results will be cached for fields with the same source.    
+        Usefull for editable column in grid to prevent extra requests.
+        
+        @property sourceCache 
+        @type boolean
+        @default true
+        @since 1.2.0
+        **/        
+        sourceCache: true,
+        /**
+        Additional ajax options to be used in $.ajax() when loading list from server.
+        Useful to send extra parameters (`data` key) or change request method (`type` key).
+        
+        @property sourceOptions 
+        @type object|function
+        @default null
+        @since 1.5.0
+        **/        
+        sourceOptions: null
+    });
+
+    $.fn.editabletypes.list = List;      
+
+}(window.jQuery));
+
+/**
+Text input
+
+@class text
+@extends abstractinput
+@final
+@example
+<a href="#" id="username" data-type="text" data-pk="1">awesome</a>
+<script>
+$(function(){
+    $('#username').editable({
+        url: '/post',
+        title: 'Enter username'
+    });
+});
+</script>
+**/
+(function ($) {
+    "use strict";
+    
+    var Text = function (options) {
+        this.init('text', options, Text.defaults);
+    };
+
+    $.fn.editableutils.inherit(Text, $.fn.editabletypes.abstractinput);
+
+    $.extend(Text.prototype, {
+        render: function() {
+           this.renderClear();
+           this.setClass();
+           this.setAttr('placeholder');
+        },
+        
+        activate: function() {
+            if(this.$input.is(':visible')) {
+                this.$input.focus();
+                $.fn.editableutils.setCursorPosition(this.$input.get(0), this.$input.val().length);
+                if(this.toggleClear) {
+                    this.toggleClear();
+                }
+            }
+        },
+        
+        //render clear button
+        renderClear:  function() {
+           if (this.options.clear) {
+               this.$clear = $('<span class="editable-clear-x"></span>');
+               this.$input.after(this.$clear)
+                          .css('padding-right', 24)
+                          .keyup($.proxy(function(e) {
+                              //arrows, enter, tab, etc
+                              if(~$.inArray(e.keyCode, [40,38,9,13,27])) {
+                                return;
+                              }                            
+
+                              clearTimeout(this.t);
+                              var that = this;
+                              this.t = setTimeout(function() {
+                                that.toggleClear(e);
+                              }, 100);
+                              
+                          }, this))
+                          .parent().css('position', 'relative');
+                          
+               this.$clear.click($.proxy(this.clear, this));                       
+           }            
+        },
+        
+        postrender: function() {
+            /*
+            //now `clear` is positioned via css
+            if(this.$clear) {
+                //can position clear button only here, when form is shown and height can be calculated
+//                var h = this.$input.outerHeight(true) || 20,
+                var h = this.$clear.parent().height(),
+                    delta = (h - this.$clear.height()) / 2;
+                    
+                //this.$clear.css({bottom: delta, right: delta});
+            }
+            */ 
+        },
+        
+        //show / hide clear button
+        toggleClear: function(e) {
+            if(!this.$clear) {
+                return;
+            }
+            
+            var len = this.$input.val().length,
+                visible = this.$clear.is(':visible');
+                 
+            if(len && !visible) {
+                this.$clear.show();
+            } 
+            
+            if(!len && visible) {
+                this.$clear.hide();
+            } 
+        },
+        
+        clear: function() {
+           this.$clear.hide();
+           this.$input.val('').focus();
+        }          
+    });
+
+    Text.defaults = $.extend({}, $.fn.editabletypes.abstractinput.defaults, {
+        /**
+        @property tpl 
+        @default <input type="text">
+        **/         
+        tpl: '<input type="text">',
+        /**
+        Placeholder attribute of input. Shown when input is empty.
+
+        @property placeholder 
+        @type string
+        @default null
+        **/             
+        placeholder: null,
+        
+        /**
+        Whether to show `clear` button 
+        
+        @property clear 
+        @type boolean
+        @default true        
+        **/
+        clear: true
+    });
+
+    $.fn.editabletypes.text = Text;
+
+}(window.jQuery));
+
+/**
+Textarea input
+
+@class textarea
+@extends abstractinput
+@final
+@example
+<a href="#" id="comments" data-type="textarea" data-pk="1">awesome comment!</a>
+<script>
+$(function(){
+    $('#comments').editable({
+        url: '/post',
+        title: 'Enter comments',
+        rows: 10
+    });
+});
+</script>
+**/
+(function ($) {
+    "use strict";
+    
+    var Textarea = function (options) {
+        this.init('textarea', options, Textarea.defaults);
+    };
+
+    $.fn.editableutils.inherit(Textarea, $.fn.editabletypes.abstractinput);
+
+    $.extend(Textarea.prototype, {
+        render: function () {
+            this.setClass();
+            this.setAttr('placeholder');
+            this.setAttr('rows');                        
+            
+            //ctrl + enter
+            this.$input.keydown(function (e) {
+                if (e.ctrlKey && e.which === 13) {
+                    $(this).closest('form').submit();
+                }
+            });
+        },
+        
+       //using `white-space: pre-wrap` solves \n  <--> BR conversion very elegant!
+       /* 
+       value2html: function(value, element) {
+            var html = '', lines;
+            if(value) {
+                lines = value.split("\n");
+                for (var i = 0; i < lines.length; i++) {
+                    lines[i] = $('<div>').text(lines[i]).html();
+                }
+                html = lines.join('<br>');
+            }
+            $(element).html(html);
+        },
+       
+        html2value: function(html) {
+            if(!html) {
+                return '';
+            }
+
+            var regex = new RegExp(String.fromCharCode(10), 'g');
+            var lines = html.split(/<br\s*\/?>/i);
+            for (var i = 0; i < lines.length; i++) {
+                var text = $('<div>').html(lines[i]).text();
+
+                // Remove newline characters (\n) to avoid them being converted by value2html() method
+                // thus adding extra <br> tags
+                text = text.replace(regex, '');
+
+                lines[i] = text;
+            }
+            return lines.join("\n");
+        },
+         */
+        activate: function() {
+            $.fn.editabletypes.text.prototype.activate.call(this);
+        }
+    });
+
+    Textarea.defaults = $.extend({}, $.fn.editabletypes.abstractinput.defaults, {
+        /**
+        @property tpl
+        @default <textarea></textarea>
+        **/
+        tpl:'<textarea></textarea>',
+        /**
+        @property inputclass
+        @default input-large
+        **/
+        inputclass: 'input-large',
+        /**
+        Placeholder attribute of input. Shown when input is empty.
+
+        @property placeholder
+        @type string
+        @default null
+        **/
+        placeholder: null,
+        /**
+        Number of rows in textarea
+
+        @property rows
+        @type integer
+        @default 7
+        **/        
+        rows: 7        
+    });
+
+    $.fn.editabletypes.textarea = Textarea;
+
+}(window.jQuery));
+
+/**
+Select (dropdown)
+
+@class select
+@extends list
+@final
+@example
+<a href="#" id="status" data-type="select" data-pk="1" data-url="/post" data-title="Select status"></a>
+<script>
+$(function(){
+    $('#status').editable({
+        value: 2,    
+        source: [
+              {value: 1, text: 'Active'},
+              {value: 2, text: 'Blocked'},
+              {value: 3, text: 'Deleted'}
+           ]
+    });
+});
+</script>
+**/
+(function ($) {
+    "use strict";
+    
+    var Select = function (options) {
+        this.init('select', options, Select.defaults);
+    };
+
+    $.fn.editableutils.inherit(Select, $.fn.editabletypes.list);
+
+    $.extend(Select.prototype, {
+        renderList: function() {
+            this.$input.empty();
+
+            var fillItems = function($el, data) {
+                var attr;
+                if($.isArray(data)) {
+                    for(var i=0; i<data.length; i++) {
+                        attr = {};
+                        if(data[i].children) {
+                            attr.label = data[i].text;
+                            $el.append(fillItems($('<optgroup>', attr), data[i].children)); 
+                        } else {
+                            attr.value = data[i].value;
+                            if(data[i].disabled) {
+                                attr.disabled = true;
+                            }
+                            $el.append($('<option>', attr).text(data[i].text)); 
+                        }
+                    }
+                }
+                return $el;
+            };        
+
+            fillItems(this.$input, this.sourceData);
+            
+            this.setClass();
+            
+            //enter submit
+            this.$input.on('keydown.editable', function (e) {
+                if (e.which === 13) {
+                    $(this).closest('form').submit();
+                }
+            });            
+        },
+       
+        value2htmlFinal: function(value, element) {
+            var text = '', 
+                items = $.fn.editableutils.itemsByValue(value, this.sourceData);
+                
+            if(items.length) {
+                text = items[0].text;
+            }
+            
+            //$(element).text(text);
+            $.fn.editabletypes.abstractinput.prototype.value2html.call(this, text, element);
+        },
+        
+        autosubmit: function() {
+            this.$input.off('keydown.editable').on('change.editable', function(){
+                $(this).closest('form').submit();
+            });
+        }
+    });      
+
+    Select.defaults = $.extend({}, $.fn.editabletypes.list.defaults, {
+        /**
+        @property tpl 
+        @default <select></select>
+        **/         
+        tpl:'<select></select>'
+    });
+
+    $.fn.editabletypes.select = Select;      
+
+}(window.jQuery));
+
+/**
+List of checkboxes. 
+Internally value stored as javascript array of values.
+
+@class checklist
+@extends list
+@final
+@example
+<a href="#" id="options" data-type="checklist" data-pk="1" data-url="/post" data-title="Select options"></a>
+<script>
+$(function(){
+    $('#options').editable({
+        value: [2, 3],    
+        source: [
+              {value: 1, text: 'option1'},
+              {value: 2, text: 'option2'},
+              {value: 3, text: 'option3'}
+           ]
+    });
+});
+</script>
+**/
+(function ($) {
+    "use strict";
+    
+    var Checklist = function (options) {
+        this.init('checklist', options, Checklist.defaults);
+    };
+
+    $.fn.editableutils.inherit(Checklist, $.fn.editabletypes.list);
+
+    $.extend(Checklist.prototype, {
+        renderList: function() {
+            var $label, $div;
+            
+            this.$tpl.empty();
+            
+            if(!$.isArray(this.sourceData)) {
+                return;
+            }
+
+            for(var i=0; i<this.sourceData.length; i++) {
+                $label = $('<label>').append($('<input>', {
+                                           type: 'checkbox',
+                                           value: this.sourceData[i].value 
+                                     }))
+                                     .append($('<span>').text(' '+this.sourceData[i].text));
+                
+                $('<div>').append($label).appendTo(this.$tpl);
+            }
+            
+            this.$input = this.$tpl.find('input[type="checkbox"]');
+            this.setClass();
+        },
+       
+       value2str: function(value) {
+           return $.isArray(value) ? value.sort().join($.trim(this.options.separator)) : '';
+       },  
+       
+       //parse separated string
+        str2value: function(str) {
+           var reg, value = null;
+           if(typeof str === 'string' && str.length) {
+               reg = new RegExp('\\s*'+$.trim(this.options.separator)+'\\s*');
+               value = str.split(reg);
+           } else if($.isArray(str)) {
+               value = str; 
+           } else {
+               value = [str];
+           }
+           return value;
+        },       
+       
+       //set checked on required checkboxes
+       value2input: function(value) {
+            this.$input.prop('checked', false);
+            if($.isArray(value) && value.length) {
+               this.$input.each(function(i, el) {
+                   var $el = $(el);
+                   // cannot use $.inArray as it performs strict comparison
+                   $.each(value, function(j, val){
+                       /*jslint eqeq: true*/
+                       if($el.val() == val) {
+                       /*jslint eqeq: false*/                           
+                           $el.prop('checked', true);
+                       }
+                   });
+               }); 
+            }  
+        },  
+        
+       input2value: function() { 
+           var checked = [];
+           this.$input.filter(':checked').each(function(i, el) {
+               checked.push($(el).val());
+           });
+           return checked;
+       },            
+          
+       //collect text of checked boxes
+        value2htmlFinal: function(value, element) {
+           var html = [],
+               checked = $.fn.editableutils.itemsByValue(value, this.sourceData),
+               escape = this.options.escape;
+               
+           if(checked.length) {
+               $.each(checked, function(i, v) {
+                   var text = escape ? $.fn.editableutils.escape(v.text) : v.text; 
+                   html.push(text); 
+               });
+               $(element).html(html.join('<br>'));
+           } else {
+               $(element).empty(); 
+           }
+        },
+        
+       activate: function() {
+           this.$input.first().focus();
+       },
+       
+       autosubmit: function() {
+           this.$input.on('keydown', function(e){
+               if (e.which === 13) {
+                   $(this).closest('form').submit();
+               }
+           });
+       }
+    });      
+
+    Checklist.defaults = $.extend({}, $.fn.editabletypes.list.defaults, {
+        /**
+        @property tpl 
+        @default <div></div>
+        **/         
+        tpl:'<div class="editable-checklist"></div>',
+        
+        /**
+        @property inputclass 
+        @type string
+        @default null
+        **/         
+        inputclass: null,        
+        
+        /**
+        Separator of values when reading from `data-value` attribute
+
+        @property separator 
+        @type string
+        @default ','
+        **/         
+        separator: ','
+    });
+
+    $.fn.editabletypes.checklist = Checklist;      
+
+}(window.jQuery));
+
+/**
+HTML5 input types.
+Following types are supported:
+
+* password
+* email
+* url
+* tel
+* number
+* range
+* time
+
+Learn more about html5 inputs:  
+http://www.w3.org/wiki/HTML5_form_additions  
+To check browser compatibility please see:  
+https://developer.mozilla.org/en-US/docs/HTML/Element/Input
+            
+@class html5types 
+@extends text
+@final
+@since 1.3.0
+@example
+<a href="#" id="email" data-type="email" data-pk="1">admin@example.com</a>
+<script>
+$(function(){
+    $('#email').editable({
+        url: '/post',
+        title: 'Enter email'
+    });
+});
+</script>
+**/
+
+/**
+@property tpl 
+@default depends on type
+**/ 
+
+/*
+Password
+*/
+(function ($) {
+    "use strict";
+    
+    var Password = function (options) {
+        this.init('password', options, Password.defaults);
+    };
+    $.fn.editableutils.inherit(Password, $.fn.editabletypes.text);
+    $.extend(Password.prototype, {
+       //do not display password, show '[hidden]' instead
+       value2html: function(value, element) {
+           if(value) {
+               $(element).text('[hidden]');
+           } else {
+               $(element).empty(); 
+           }
+       },
+       //as password not displayed, should not set value by html
+       html2value: function(html) {
+           return null;
+       }       
+    });    
+    Password.defaults = $.extend({}, $.fn.editabletypes.text.defaults, {
+        tpl: '<input type="password">'
+    });
+    $.fn.editabletypes.password = Password;
+}(window.jQuery));
+
+
+/*
+Email
+*/
+(function ($) {
+    "use strict";
+    
+    var Email = function (options) {
+        this.init('email', options, Email.defaults);
+    };
+    $.fn.editableutils.inherit(Email, $.fn.editabletypes.text);
+    Email.defaults = $.extend({}, $.fn.editabletypes.text.defaults, {
+        tpl: '<input type="email">'
+    });
+    $.fn.editabletypes.email = Email;
+}(window.jQuery));
+
+
+/*
+Url
+*/
+(function ($) {
+    "use strict";
+    
+    var Url = function (options) {
+        this.init('url', options, Url.defaults);
+    };
+    $.fn.editableutils.inherit(Url, $.fn.editabletypes.text);
+    Url.defaults = $.extend({}, $.fn.editabletypes.text.defaults, {
+        tpl: '<input type="url">'
+    });
+    $.fn.editabletypes.url = Url;
+}(window.jQuery));
+
+
+/*
+Tel
+*/
+(function ($) {
+    "use strict";
+    
+    var Tel = function (options) {
+        this.init('tel', options, Tel.defaults);
+    };
+    $.fn.editableutils.inherit(Tel, $.fn.editabletypes.text);
+    Tel.defaults = $.extend({}, $.fn.editabletypes.text.defaults, {
+        tpl: '<input type="tel">'
+    });
+    $.fn.editabletypes.tel = Tel;
+}(window.jQuery));
+
+
+/*
+Number
+*/
+(function ($) {
+    "use strict";
+    
+    var NumberInput = function (options) {
+        this.init('number', options, NumberInput.defaults);
+    };
+    $.fn.editableutils.inherit(NumberInput, $.fn.editabletypes.text);
+    $.extend(NumberInput.prototype, {
+         render: function () {
+            NumberInput.superclass.render.call(this);
+            this.setAttr('min');
+            this.setAttr('max');
+            this.setAttr('step');
+        },
+        postrender: function() {
+            if(this.$clear) {
+                //increase right ffset  for up/down arrows
+                this.$clear.css({right: 24});
+                /*
+                //can position clear button only here, when form is shown and height can be calculated
+                var h = this.$input.outerHeight(true) || 20,
+                    delta = (h - this.$clear.height()) / 2;
+                
+                //add 12px to offset right for up/down arrows    
+                this.$clear.css({top: delta, right: delta + 16});
+                */
+            } 
+        }        
+    });     
+    NumberInput.defaults = $.extend({}, $.fn.editabletypes.text.defaults, {
+        tpl: '<input type="number">',
+        inputclass: 'input-mini',
+        min: null,
+        max: null,
+        step: null
+    });
+    $.fn.editabletypes.number = NumberInput;
+}(window.jQuery));
+
+
+/*
+Range (inherit from number)
+*/
+(function ($) {
+    "use strict";
+    
+    var Range = function (options) {
+        this.init('range', options, Range.defaults);
+    };
+    $.fn.editableutils.inherit(Range, $.fn.editabletypes.number);
+    $.extend(Range.prototype, {
+        render: function () {
+            this.$input = this.$tpl.filter('input');
+            
+            this.setClass();
+            this.setAttr('min');
+            this.setAttr('max');
+            this.setAttr('step');           
+            
+            this.$input.on('input', function(){
+                $(this).siblings('output').text($(this).val()); 
+            });  
+        },
+        activate: function() {
+            this.$input.focus();
+        }         
+    });
+    Range.defaults = $.extend({}, $.fn.editabletypes.number.defaults, {
+        tpl: '<input type="range"><output style="width: 30px; display: inline-block"></output>',
+        inputclass: 'input-medium'
+    });
+    $.fn.editabletypes.range = Range;
+}(window.jQuery));
+
+/*
+Time
+*/
+(function ($) {
+    "use strict";
+
+    var Time = function (options) {
+        this.init('time', options, Time.defaults);
+    };
+    //inherit from abstract, as inheritance from text gives selection error.
+    $.fn.editableutils.inherit(Time, $.fn.editabletypes.abstractinput);
+    $.extend(Time.prototype, {
+        render: function() {
+           this.setClass();
+        }        
+    });
+    Time.defaults = $.extend({}, $.fn.editabletypes.abstractinput.defaults, {
+        tpl: '<input type="time">'
+    });
+    $.fn.editabletypes.time = Time;
+}(window.jQuery));
+
+/**
+Select2 input. Based on amazing work of Igor Vaynberg https://github.com/ivaynberg/select2.  
+Please see [original select2 docs](http://ivaynberg.github.com/select2) for detailed description and options.  
+ 
+You should manually download and include select2 distributive:  
+
+    <link href="select2/select2.css" rel="stylesheet" type="text/css"></link>  
+    <script src="select2/select2.js"></script>  
+    
+To make it **bootstrap-styled** you can use css from [here](https://github.com/t0m/select2-bootstrap-css): 
+
+    <link href="select2-bootstrap.css" rel="stylesheet" type="text/css"></link>    
+    
+**Note:** currently `autotext` feature does not work for select2 with `ajax` remote source.    
+You need initially put both `data-value` and element's text youself:    
+
+    <a href="#" data-type="select2" data-value="1">Text1</a>
+    
+    
+@class select2
+@extends abstractinput
+@since 1.4.1
+@final
+@example
+<a href="#" id="country" data-type="select2" data-pk="1" data-value="ru" data-url="/post" data-title="Select country"></a>
+<script>
+$(function(){
+    //local source
+    $('#country').editable({
+        source: [
+              {id: 'gb', text: 'Great Britain'},
+              {id: 'us', text: 'United States'},
+              {id: 'ru', text: 'Russia'}
+           ],
+        select2: {
+           multiple: true
+        }
+    });
+    //remote source (simple)
+    $('#country').editable({
+        source: '/getCountries',
+        select2: {
+            placeholder: 'Select Country',
+            minimumInputLength: 1
+        }
+    });
+    //remote source (advanced)
+    $('#country').editable({
+        select2: {
+            placeholder: 'Select Country',
+            allowClear: true,
+            minimumInputLength: 3,
+            id: function (item) {
+                return item.CountryId;
+            },
+            ajax: {
+                url: '/getCountries',
+                dataType: 'json',
+                data: function (term, page) {
+                    return { query: term };
+                },
+                results: function (data, page) {
+                    return { results: data };
+                }
+            },
+            formatResult: function (item) {
+                return item.CountryName;
+            },
+            formatSelection: function (item) {
+                return item.CountryName;
+            },
+            initSelection: function (element, callback) {
+                return $.get('/getCountryById', { query: element.val() }, function (data) {
+                    callback(data);
+                });
+            } 
+        }  
+    });
+});
+</script>
+**/
+(function ($) {
+    "use strict";
+    
+    var Constructor = function (options) {
+        this.init('select2', options, Constructor.defaults);
+
+        options.select2 = options.select2 || {};
+
+        this.sourceData = null;
+        
+        //placeholder
+        if(options.placeholder) {
+            options.select2.placeholder = options.placeholder;
+        }
+       
+        //if not `tags` mode, use source
+        if(!options.select2.tags && options.source) {
+            var source = options.source;
+            //if source is function, call it (once!)
+            if ($.isFunction(options.source)) {
+                source = options.source.call(options.scope);
+            }               
+
+            if (typeof source === 'string') {
+                options.select2.ajax = options.select2.ajax || {};
+                //some default ajax params
+                if(!options.select2.ajax.data) {
+                    options.select2.ajax.data = function(term) {return { query:term };};
+                }
+                if(!options.select2.ajax.results) {
+                    options.select2.ajax.results = function(data) { return {results:data };};
+                }
+                options.select2.ajax.url = source;
+            } else {
+                //check format and convert x-editable format to select2 format (if needed)
+                this.sourceData = this.convertSource(source);
+                options.select2.data = this.sourceData;
+            }
+        } 
+
+        //overriding objects in config (as by default jQuery extend() is not recursive)
+        this.options.select2 = $.extend({}, Constructor.defaults.select2, options.select2);
+
+        //detect whether it is multi-valued
+        this.isMultiple = this.options.select2.tags || this.options.select2.multiple;
+        this.isRemote = ('ajax' in this.options.select2);
+
+        //store function returning ID of item
+        //should be here as used inautotext for local source
+        this.idFunc = this.options.select2.id;
+        if (typeof(this.idFunc) !== "function") {
+            var idKey = this.idFunc || 'id';
+            this.idFunc = function (e) { return e[idKey]; };
+        }
+
+        //store function that renders text in select2
+        this.formatSelection = this.options.select2.formatSelection;
+        if (typeof(this.formatSelection) !== "function") {
+            this.formatSelection = function (e) { return e.text; };
+        }
+    };
+
+    $.fn.editableutils.inherit(Constructor, $.fn.editabletypes.abstractinput);
+
+    $.extend(Constructor.prototype, {
+        render: function() {
+            this.setClass();
+
+            //can not apply select2 here as it calls initSelection 
+            //over input that does not have correct value yet.
+            //apply select2 only in value2input
+            //this.$input.select2(this.options.select2);
+
+            //when data is loaded via ajax, we need to know when it's done to populate listData
+            if(this.isRemote) {
+                //listen to loaded event to populate data
+                this.$input.on('select2-loaded', $.proxy(function(e) {
+                    this.sourceData = e.items.results;
+                }, this));
+            }
+
+            //trigger resize of editableform to re-position container in multi-valued mode
+            if(this.isMultiple) {
+               this.$input.on('change', function() {
+                   $(this).closest('form').parent().triggerHandler('resize');
+               });
+            }
+       },
+
+       value2html: function(value, element) {
+           var text = '', data,
+               that = this;
+
+           if(this.options.select2.tags) { //in tags mode just assign value
+              data = value; 
+              //data = $.fn.editableutils.itemsByValue(value, this.options.select2.tags, this.idFunc);
+           } else if(this.sourceData) {
+              data = $.fn.editableutils.itemsByValue(value, this.sourceData, this.idFunc); 
+           } else {
+              //can not get list of possible values 
+              //(e.g. autotext for select2 with ajax source)
+           }
+
+           //data may be array (when multiple values allowed)
+           if($.isArray(data)) {
+               //collect selected data and show with separator
+               text = [];
+               $.each(data, function(k, v){
+                   text.push(v && typeof v === 'object' ? that.formatSelection(v) : v);
+               });
+           } else if(data) {
+               text = that.formatSelection(data);
+           }
+
+           text = $.isArray(text) ? text.join(this.options.viewseparator) : text;
+
+           //$(element).text(text);
+           Constructor.superclass.value2html.call(this, text, element); 
+       },
+
+       html2value: function(html) {
+           return this.options.select2.tags ? this.str2value(html, this.options.viewseparator) : null;
+       },
+
+       value2input: function(value) {
+           // if value array => join it anyway
+           if($.isArray(value)) {
+              value = value.join(this.getSeparator());
+           }
+
+           //for remote source just set value, text is updated by initSelection
+           if(!this.$input.data('select2')) {
+               this.$input.val(value);
+               this.$input.select2(this.options.select2);
+           } else {
+               //second argument needed to separate initial change from user's click (for autosubmit)   
+               this.$input.val(value).trigger('change', true); 
+
+               //Uncaught Error: cannot call val() if initSelection() is not defined
+               //this.$input.select2('val', value);
+           }
+
+           // if defined remote source AND no multiple mode AND no user's initSelection provided --> 
+           // we should somehow get text for provided id.
+           // The solution is to use element's text as text for that id (exclude empty)
+           if(this.isRemote && !this.isMultiple && !this.options.select2.initSelection) {
+               // customId and customText are methods to extract `id` and `text` from data object
+               // we can use this workaround only if user did not define these methods
+               // otherwise we cant construct data object
+               var customId = this.options.select2.id,
+                   customText = this.options.select2.formatSelection;
+
+               if(!customId && !customText) {
+                   var $el = $(this.options.scope);
+                   if (!$el.data('editable').isEmpty) {
+                       var data = {id: value, text: $el.text()};
+                       this.$input.select2('data', data); 
+                   }
+               }
+           }
+       },
+       
+       input2value: function() { 
+           return this.$input.select2('val');
+       },
+
+       str2value: function(str, separator) {
+            if(typeof str !== 'string' || !this.isMultiple) {
+                return str;
+            }
+
+            separator = separator || this.getSeparator();
+
+            var val, i, l;
+
+            if (str === null || str.length < 1) {
+                return null;
+            }
+            val = str.split(separator);
+            for (i = 0, l = val.length; i < l; i = i + 1) {
+                val[i] = $.trim(val[i]);
+            }
+
+            return val;
+       },
+
+        autosubmit: function() {
+            this.$input.on('change', function(e, isInitial){
+                if(!isInitial) {
+                  $(this).closest('form').submit();
+                }
+            });
+        },
+
+        getSeparator: function() {
+            return this.options.select2.separator || $.fn.select2.defaults.separator;
+        },
+
+        /*
+        Converts source from x-editable format: {value: 1, text: "1"} to
+        select2 format: {id: 1, text: "1"}
+        */
+        convertSource: function(source) {
+            if($.isArray(source) && source.length && source[0].value !== undefined) {
+                for(var i = 0; i<source.length; i++) {
+                    if(source[i].value !== undefined) {
+                        source[i].id = source[i].value;
+                        delete source[i].value;
+                    }
+                }
+            }
+            return source;
+        },
+        
+        destroy: function() {
+            if(this.$input.data('select2')) {
+                this.$input.select2('destroy');
+            }
+        }
+        
+    });
+
+    Constructor.defaults = $.extend({}, $.fn.editabletypes.abstractinput.defaults, {
+        /**
+        @property tpl 
+        @default <input type="hidden">
+        **/
+        tpl:'<input type="hidden">',
+        /**
+        Configuration of select2. [Full list of options](http://ivaynberg.github.com/select2).
+
+        @property select2 
+        @type object
+        @default null
+        **/
+        select2: null,
+        /**
+        Placeholder attribute of select
+
+        @property placeholder 
+        @type string
+        @default null
+        **/
+        placeholder: null,
+        /**
+        Source data for select. It will be assigned to select2 `data` property and kept here just for convenience.
+        Please note, that format is different from simple `select` input: use 'id' instead of 'value'.
+        E.g. `[{id: 1, text: "text1"}, {id: 2, text: "text2"}, ...]`.
+
+        @property source 
+        @type array|string|function
+        @default null        
+        **/
+        source: null,
+        /**
+        Separator used to display tags.
+
+        @property viewseparator 
+        @type string
+        @default ', '        
+        **/
+        viewseparator: ', '
+    });
+
+    $.fn.editabletypes.select2 = Constructor;
+
+}(window.jQuery));
+
+/**
+* Combodate - 1.0.5
+* Dropdown date and time picker.
+* Converts text input into dropdowns to pick day, month, year, hour, minute and second.
+* Uses momentjs as datetime library http://momentjs.com.
+* For i18n include corresponding file from https://github.com/timrwood/moment/tree/master/lang 
+*
+* Confusion at noon and midnight - see http://en.wikipedia.org/wiki/12-hour_clock#Confusion_at_noon_and_midnight
+* In combodate: 
+* 12:00 pm --> 12:00 (24-h format, midday)
+* 12:00 am --> 00:00 (24-h format, midnight, start of day)
+* 
+* Differs from momentjs parse rules:
+* 00:00 pm, 12:00 pm --> 12:00 (24-h format, day not change)
+* 00:00 am, 12:00 am --> 00:00 (24-h format, day not change)
+* 
+* 
+* Author: Vitaliy Potapov
+* Project page: http://github.com/vitalets/combodate
+* Copyright (c) 2012 Vitaliy Potapov. Released under MIT License.
+**/
+(function ($) {
+
+    var Combodate = function (element, options) {
+        this.$element = $(element);
+        if(!this.$element.is('input')) {
+            $.error('Combodate should be applied to INPUT element');
+            return;
+        }
+        this.options = $.extend({}, $.fn.combodate.defaults, options, this.$element.data());
+        this.init();  
+     };
+
+    Combodate.prototype = {
+        constructor: Combodate, 
+        init: function () {
+            this.map = {
+                //key   regexp    moment.method
+                day:    ['D',    'date'], 
+                month:  ['M',    'month'], 
+                year:   ['Y',    'year'], 
+                hour:   ['[Hh]', 'hours'],
+                minute: ['m',    'minutes'], 
+                second: ['s',    'seconds'],
+                ampm:   ['[Aa]', ''] 
+            };
+            
+            this.$widget = $('<span class="combodate"></span>').html(this.getTemplate());
+                      
+            this.initCombos();
+            
+            //update original input on change 
+            this.$widget.on('change', 'select', $.proxy(function(e) {
+                this.$element.val(this.getValue()).change();
+                // update days count if month or year changes
+                if (this.options.smartDays) {
+                    if ($(e.target).is('.month') || $(e.target).is('.year')) {
+                        this.fillCombo('day');
+                    }
+                }
+            }, this));
+            
+            this.$widget.find('select').css('width', 'auto');
+                                       
+            // hide original input and insert widget                                       
+            this.$element.hide().after(this.$widget);
+            
+            // set initial value
+            this.setValue(this.$element.val() || this.options.value);
+        },
+        
+        /*
+         Replace tokens in template with <select> elements 
+        */         
+        getTemplate: function() {
+            var tpl = this.options.template;
+
+            //first pass
+            $.each(this.map, function(k, v) {
+                v = v[0]; 
+                var r = new RegExp(v+'+'),
+                    token = v.length > 1 ? v.substring(1, 2) : v;
+                    
+                tpl = tpl.replace(r, '{'+token+'}');
+            });
+
+            //replace spaces with &nbsp;
+            tpl = tpl.replace(/ /g, '&nbsp;');
+
+            //second pass
+            $.each(this.map, function(k, v) {
+                v = v[0];
+                var token = v.length > 1 ? v.substring(1, 2) : v;
+                    
+                tpl = tpl.replace('{'+token+'}', '<select class="'+k+'"></select>');
+            });   
+
+            return tpl;
+        },
+        
+        /*
+         Initialize combos that presents in template 
+        */        
+        initCombos: function() {
+            for (var k in this.map) {
+                var $c = this.$widget.find('.'+k);
+                // set properties like this.$day, this.$month etc.
+                this['$'+k] = $c.length ? $c : null;
+                // fill with items
+                this.fillCombo(k);
+            }
+        },
+
+        /*
+         Fill combo with items 
+        */        
+        fillCombo: function(k) {
+            var $combo = this['$'+k];
+            if (!$combo) {
+                return;
+            }
+
+            // define method name to fill items, e.g `fillDays`
+            var f = 'fill' + k.charAt(0).toUpperCase() + k.slice(1); 
+            var items = this[f]();
+            var value = $combo.val();
+
+            $combo.empty();
+            for(var i=0; i<items.length; i++) {
+                $combo.append('<option value="'+items[i][0]+'">'+items[i][1]+'</option>');
+            }
+
+            $combo.val(value);
+        },
+
+        /*
+         Initialize items of combos. Handles `firstItem` option 
+        */
+        fillCommon: function(key) {
+            var values = [],
+                relTime;
+                
+            if(this.options.firstItem === 'name') {
+                //need both to support moment ver < 2 and  >= 2
+                relTime = moment.relativeTime || moment.langData()._relativeTime; 
+                var header = typeof relTime[key] === 'function' ? relTime[key](1, true, key, false) : relTime[key];
+                //take last entry (see momentjs lang files structure) 
+                header = header.split(' ').reverse()[0];                
+                values.push(['', header]);
+            } else if(this.options.firstItem === 'empty') {
+                values.push(['', '']);
+            }
+            return values;
+        },  
+
+
+        /*
+        fill day
+        */
+        fillDay: function() {
+            var items = this.fillCommon('d'), name, i,
+                twoDigit = this.options.template.indexOf('DD') !== -1,
+                daysCount = 31;
+
+            // detect days count (depends on month and year)
+            // originally https://github.com/vitalets/combodate/pull/7
+            if (this.options.smartDays && this.$month && this.$year) {
+                var month = parseInt(this.$month.val(), 10);
+                var year = parseInt(this.$year.val(), 10);
+
+                if (!isNaN(month) && !isNaN(year)) {
+                    daysCount = moment([year, month]).daysInMonth();
+                }
+            }
+
+            for (i = 1; i <= daysCount; i++) {
+                name = twoDigit ? this.leadZero(i) : i;
+                items.push([i, name]);
+            }
+            return items;        
+        },
+        
+        /*
+        fill month
+        */
+        fillMonth: function() {
+            var items = this.fillCommon('M'), name, i, 
+                longNames = this.options.template.indexOf('MMMM') !== -1,
+                shortNames = this.options.template.indexOf('MMM') !== -1,
+                twoDigit = this.options.template.indexOf('MM') !== -1;
+                
+            for(i=0; i<=11; i++) {
+                if(longNames) {
+                    //see https://github.com/timrwood/momentjs.com/pull/36
+                    name = moment().date(1).month(i).format('MMMM');
+                } else if(shortNames) {
+                    name = moment().date(1).month(i).format('MMM');
+                } else if(twoDigit) {
+                    name = this.leadZero(i+1);
+                } else {
+                    name = i+1;
+                }
+                items.push([i, name]);
+            } 
+            return items;
+        },  
+        
+        /*
+        fill year
+        */
+        fillYear: function() {
+            var items = [], name, i, 
+                longNames = this.options.template.indexOf('YYYY') !== -1;
+           
+            for(i=this.options.maxYear; i>=this.options.minYear; i--) {
+                name = longNames ? i : (i+'').substring(2);
+                items[this.options.yearDescending ? 'push' : 'unshift']([i, name]);
+            }
+            
+            items = this.fillCommon('y').concat(items);
+            
+            return items;              
+        },    
+        
+        /*
+        fill hour
+        */
+        fillHour: function() {
+            var items = this.fillCommon('h'), name, i,
+                h12 = this.options.template.indexOf('h') !== -1,
+                h24 = this.options.template.indexOf('H') !== -1,
+                twoDigit = this.options.template.toLowerCase().indexOf('hh') !== -1,
+                min = h12 ? 1 : 0, 
+                max = h12 ? 12 : 23;
+                
+            for(i=min; i<=max; i++) {
+                name = twoDigit ? this.leadZero(i) : i;
+                items.push([i, name]);
+            } 
+            return items;                 
+        },    
+        
+        /*
+        fill minute
+        */
+        fillMinute: function() {
+            var items = this.fillCommon('m'), name, i,
+                twoDigit = this.options.template.indexOf('mm') !== -1;
+
+            for(i=0; i<=59; i+= this.options.minuteStep) {
+                name = twoDigit ? this.leadZero(i) : i;
+                items.push([i, name]);
+            }    
+            return items;              
+        },  
+        
+        /*
+        fill second
+        */
+        fillSecond: function() {
+            var items = this.fillCommon('s'), name, i,
+                twoDigit = this.options.template.indexOf('ss') !== -1;
+
+            for(i=0; i<=59; i+= this.options.secondStep) {
+                name = twoDigit ? this.leadZero(i) : i;
+                items.push([i, name]);
+            }    
+            return items;              
+        },  
+        
+        /*
+        fill ampm
+        */
+        fillAmpm: function() {
+            var ampmL = this.options.template.indexOf('a') !== -1,
+                ampmU = this.options.template.indexOf('A') !== -1,            
+                items = [
+                    ['am', ampmL ? 'am' : 'AM'],
+                    ['pm', ampmL ? 'pm' : 'PM']
+                ];
+            return items;                              
+        },                                       
+
+        /*
+         Returns current date value from combos. 
+         If format not specified - `options.format` used.
+         If format = `null` - Moment object returned.
+        */
+        getValue: function(format) {
+            var dt, values = {}, 
+                that = this,
+                notSelected = false;
+                
+            //getting selected values    
+            $.each(this.map, function(k, v) {
+                if(k === 'ampm') {
+                    return;
+                }
+                var def = k === 'day' ? 1 : 0;
+                  
+                values[k] = that['$'+k] ? parseInt(that['$'+k].val(), 10) : def; 
+                
+                if(isNaN(values[k])) {
+                   notSelected = true;
+                   return false; 
+                }
+            });
+            
+            //if at least one visible combo not selected - return empty string
+            if(notSelected) {
+               return '';
+            }
+            
+            //convert hours 12h --> 24h 
+            if(this.$ampm) {
+                //12:00 pm --> 12:00 (24-h format, midday), 12:00 am --> 00:00 (24-h format, midnight, start of day)
+                if(values.hour === 12) {
+                    values.hour = this.$ampm.val() === 'am' ? 0 : 12;                    
+                } else {
+                    values.hour = this.$ampm.val() === 'am' ? values.hour : values.hour+12;
+                }
+            }    
+            
+            dt = moment([values.year, values.month, values.day, values.hour, values.minute, values.second]);
+            
+            //highlight invalid date
+            this.highlight(dt);
+                              
+            format = format === undefined ? this.options.format : format;
+            if(format === null) {
+               return dt.isValid() ? dt : null; 
+            } else {
+               return dt.isValid() ? dt.format(format) : ''; 
+            }           
+        },
+        
+        setValue: function(value) {
+            if(!value) {
+                return;
+            }
+            
+            var dt = typeof value === 'string' ? moment(value, this.options.format) : moment(value),
+                that = this,
+                values = {};
+            
+            //function to find nearest value in select options
+            function getNearest($select, value) {
+                var delta = {};
+                $select.children('option').each(function(i, opt){
+                    var optValue = $(opt).attr('value'),
+                    distance;
+
+                    if(optValue === '') return;
+                    distance = Math.abs(optValue - value); 
+                    if(typeof delta.distance === 'undefined' || distance < delta.distance) {
+                        delta = {value: optValue, distance: distance};
+                    } 
+                }); 
+                return delta.value;
+            }             
+            
+            if(dt.isValid()) {
+                //read values from date object
+                $.each(this.map, function(k, v) {
+                    if(k === 'ampm') {
+                       return; 
+                    }
+                    values[k] = dt[v[1]]();
+                });
+               
+                if(this.$ampm) {
+                    //12:00 pm --> 12:00 (24-h format, midday), 12:00 am --> 00:00 (24-h format, midnight, start of day)
+                    if(values.hour >= 12) {
+                        values.ampm = 'pm';
+                        if(values.hour > 12) {
+                            values.hour -= 12;
+                        }
+                    } else {
+                        values.ampm = 'am';
+                        if(values.hour === 0) {
+                            values.hour = 12;
+                        }
+                    } 
+                }
+               
+                $.each(values, function(k, v) {
+                    //call val() for each existing combo, e.g. this.$hour.val()
+                    if(that['$'+k]) {
+                       
+                        if(k === 'minute' && that.options.minuteStep > 1 && that.options.roundTime) {
+                           v = getNearest(that['$'+k], v);
+                        }
+                       
+                        if(k === 'second' && that.options.secondStep > 1 && that.options.roundTime) {
+                           v = getNearest(that['$'+k], v);
+                        }                       
+                       
+                        that['$'+k].val(v);
+                    }
+                });
+
+                // update days count
+                if (this.options.smartDays) {
+                    this.fillCombo('day');
+                }
+               
+               this.$element.val(dt.format(this.options.format)).change();
+            }
+        },
+        
+        /*
+         highlight combos if date is invalid
+        */
+        highlight: function(dt) {
+            if(!dt.isValid()) {
+                if(this.options.errorClass) {
+                    this.$widget.addClass(this.options.errorClass);
+                } else {
+                    //store original border color
+                    if(!this.borderColor) {
+                        this.borderColor = this.$widget.find('select').css('border-color'); 
+                    }
+                    this.$widget.find('select').css('border-color', 'red');
+                } 
+            } else {
+                if(this.options.errorClass) {
+                    this.$widget.removeClass(this.options.errorClass);
+                } else {
+                    this.$widget.find('select').css('border-color', this.borderColor);
+                }  
+            }
+        },
+        
+        leadZero: function(v) {
+            return v <= 9 ? '0' + v : v; 
+        },
+        
+        destroy: function() {
+            this.$widget.remove();
+            this.$element.removeData('combodate').show();
+        }
+        
+        //todo: clear method        
+    };
+
+    $.fn.combodate = function ( option ) {
+        var d, args = Array.apply(null, arguments);
+        args.shift();
+
+        //getValue returns date as string / object (not jQuery object)
+        if(option === 'getValue' && this.length && (d = this.eq(0).data('combodate'))) {
+          return d.getValue.apply(d, args);
+        }        
+        
+        return this.each(function () {
+            var $this = $(this),
+            data = $this.data('combodate'),
+            options = typeof option == 'object' && option;
+            if (!data) {
+                $this.data('combodate', (data = new Combodate(this, options)));
+            }
+            if (typeof option == 'string' && typeof data[option] == 'function') {
+                data[option].apply(data, args);
+            }
+        });
+    };  
+    
+    $.fn.combodate.defaults = {
+         //in this format value stored in original input
+        format: 'DD-MM-YYYY HH:mm',      
+        //in this format items in dropdowns are displayed
+        template: 'D / MMM / YYYY   H : mm',
+        //initial value, can be `new Date()`    
+        value: null,                       
+        minYear: 1970,
+        maxYear: new Date().getFullYear(),
+        yearDescending: true,
+        minuteStep: 5,
+        secondStep: 1,
+        firstItem: 'empty', //'name', 'empty', 'none'
+        errorClass: null,
+        roundTime: true, // whether to round minutes and seconds if step > 1
+        smartDays: false // whether days in combo depend on selected month: 31, 30, 28
+    };
+
+}(window.jQuery));
+/**
+Combodate input - dropdown date and time picker.    
+Based on [combodate](http://vitalets.github.com/combodate) plugin (included). To use it you should manually include [momentjs](http://momentjs.com).
+
+    <script src="js/moment.min.js"></script>
+   
+Allows to input:
+
+* only date
+* only time 
+* both date and time  
+
+Please note, that format is taken from momentjs and **not compatible** with bootstrap-datepicker / jquery UI datepicker.  
+Internally value stored as `momentjs` object. 
+
+@class combodate
+@extends abstractinput
+@final
+@since 1.4.0
+@example
+<a href="#" id="dob" data-type="combodate" data-pk="1" data-url="/post" data-value="1984-05-15" data-title="Select date"></a>
+<script>
+$(function(){
+    $('#dob').editable({
+        format: 'YYYY-MM-DD',    
+        viewformat: 'DD.MM.YYYY',    
+        template: 'D / MMMM / YYYY',    
+        combodate: {
+                minYear: 2000,
+                maxYear: 2015,
+                minuteStep: 1
+           }
+        }
+    });
+});
+</script>
+**/
+
+/*global moment*/
+
+(function ($) {
+    "use strict";
+    
+    var Constructor = function (options) {
+        this.init('combodate', options, Constructor.defaults);
+        
+        //by default viewformat equals to format
+        if(!this.options.viewformat) {
+            this.options.viewformat = this.options.format;
+        }        
+        
+        //try parse combodate config defined as json string in data-combodate
+        options.combodate = $.fn.editableutils.tryParseJson(options.combodate, true);
+
+        //overriding combodate config (as by default jQuery extend() is not recursive)
+        this.options.combodate = $.extend({}, Constructor.defaults.combodate, options.combodate, {
+            format: this.options.format,
+            template: this.options.template
+        });
+    };
+
+    $.fn.editableutils.inherit(Constructor, $.fn.editabletypes.abstractinput);    
+    
+    $.extend(Constructor.prototype, {
+        render: function () {
+            this.$input.combodate(this.options.combodate);
+                    
+            if($.fn.editableform.engine === 'bs3') {
+                this.$input.siblings().find('select').addClass('form-control');
+            }
+            
+            if(this.options.inputclass) {
+                this.$input.siblings().find('select').addClass(this.options.inputclass);
+            }            
+            //"clear" link
+            /*
+            if(this.options.clear) {
+                this.$clear = $('<a href="#"></a>').html(this.options.clear).click($.proxy(function(e){
+                    e.preventDefault();
+                    e.stopPropagation();
+                    this.clear();
+                }, this));
+                
+                this.$tpl.parent().append($('<div class="editable-clear">').append(this.$clear));  
+            } 
+            */               
+        },
+        
+        value2html: function(value, element) {
+            var text = value ? value.format(this.options.viewformat) : '';
+            //$(element).text(text);
+            Constructor.superclass.value2html.call(this, text, element);  
+        },
+
+        html2value: function(html) {
+            return html ? moment(html, this.options.viewformat) : null;
+        },   
+        
+        value2str: function(value) {
+            return value ? value.format(this.options.format) : '';
+       }, 
+       
+       str2value: function(str) {
+           return str ? moment(str, this.options.format) : null;
+       }, 
+       
+       value2submit: function(value) {
+           return this.value2str(value);
+       },                    
+
+       value2input: function(value) {
+           this.$input.combodate('setValue', value);
+       },
+        
+       input2value: function() { 
+           return this.$input.combodate('getValue', null);
+       },       
+       
+       activate: function() {
+           this.$input.siblings('.combodate').find('select').eq(0).focus();
+       },
+       
+       /*
+       clear:  function() {
+          this.$input.data('datepicker').date = null;
+          this.$input.find('.active').removeClass('active');
+       },
+       */
+       
+       autosubmit: function() {
+           
+       }
+
+    });
+    
+    Constructor.defaults = $.extend({}, $.fn.editabletypes.abstractinput.defaults, {
+        /**
+        @property tpl 
+        @default <input type="text">
+        **/         
+        tpl:'<input type="text">',
+        /**
+        @property inputclass 
+        @default null
+        **/         
+        inputclass: null,
+        /**
+        Format used for sending value to server. Also applied when converting date from <code>data-value</code> attribute.<br>
+        See list of tokens in [momentjs docs](http://momentjs.com/docs/#/parsing/string-format)  
+        
+        @property format 
+        @type string
+        @default YYYY-MM-DD
+        **/         
+        format:'YYYY-MM-DD',
+        /**
+        Format used for displaying date. Also applied when converting date from element's text on init.   
+        If not specified equals to `format`.
+        
+        @property viewformat 
+        @type string
+        @default null
+        **/          
+        viewformat: null,        
+        /**
+        Template used for displaying dropdowns.
+        
+        @property template 
+        @type string
+        @default D / MMM / YYYY
+        **/          
+        template: 'D / MMM / YYYY',  
+        /**
+        Configuration of combodate.
+        Full list of options: http://vitalets.github.com/combodate/#docs
+        
+        @property combodate 
+        @type object
+        @default null
+        **/
+        combodate: null
+        
+        /*
+        (not implemented yet)
+        Text shown as clear date button. 
+        If <code>false</code> clear button will not be rendered.
+        
+        @property clear 
+        @type boolean|string
+        @default 'x clear'         
+        */
+        //clear: '&times; clear'
+    });   
+
+    $.fn.editabletypes.combodate = Constructor;
+
+}(window.jQuery));
+
+/*
+Editableform based on Twitter Bootstrap 3
+*/
+(function ($) {
+    "use strict";
+    
+    //store parent methods
+    var pInitInput = $.fn.editableform.Constructor.prototype.initInput;
+    
+    $.extend($.fn.editableform.Constructor.prototype, {
+        initTemplate: function() {
+            this.$form = $($.fn.editableform.template); 
+            this.$form.find('.control-group').addClass('form-group');
+            this.$form.find('.editable-error-block').addClass('help-block');
+        },
+        initInput: function() {  
+            pInitInput.apply(this);
+
+            //for bs3 set default class `input-sm` to standard inputs
+            var emptyInputClass = this.input.options.inputclass === null || this.input.options.inputclass === false;
+            var defaultClass = 'input-sm';
+            
+            //bs3 add `form-control` class to standard inputs
+            var stdtypes = 'text,select,textarea,password,email,url,tel,number,range,time,typeaheadjs'.split(','); 
+            if(~$.inArray(this.input.type, stdtypes)) {
+                this.input.$input.addClass('form-control');
+                if(emptyInputClass) {
+                    this.input.options.inputclass = defaultClass;
+                    this.input.$input.addClass(defaultClass);
+                }
+            }             
+        
+            //apply bs3 size class also to buttons (to fit size of control)
+            var $btn = this.$form.find('.editable-buttons');
+            var classes = emptyInputClass ? [defaultClass] : this.input.options.inputclass.split(' ');
+            for(var i=0; i<classes.length; i++) {
+                // `btn-sm` is default now
+                /*
+                if(classes[i].toLowerCase() === 'input-sm') { 
+                    $btn.find('button').addClass('btn-sm');  
+                }
+                */
+                if(classes[i].toLowerCase() === 'input-lg') {
+                    $btn.find('button').removeClass('btn-sm').addClass('btn-lg'); 
+                }
+            }
+        }
+    });    
+    
+    //buttons
+    $.fn.editableform.buttons = 
+      '<button type="submit" class="btn btn-primary btn-sm editable-submit">'+
+        '<i class="glyphicon glyphicon-ok"></i>'+
+      '</button>'+
+      '<button type="button" class="btn btn-default btn-sm editable-cancel">'+
+        '<i class="glyphicon glyphicon-remove"></i>'+
+      '</button>';         
+    
+    //error classes
+    $.fn.editableform.errorGroupClass = 'has-error';
+    $.fn.editableform.errorBlockClass = null;  
+    //engine
+    $.fn.editableform.engine = 'bs3';  
+}(window.jQuery));
+/**
+* Editable Popover3 (for Bootstrap 3) 
+* ---------------------
+* requires bootstrap-popover.js
+*/
+(function ($) {
+    "use strict";
+
+    //extend methods
+    $.extend($.fn.editableContainer.Popup.prototype, {
+        containerName: 'popover',
+        containerDataName: 'bs.popover',
+        innerCss: '.popover-content',
+        defaults: $.fn.popover.Constructor.DEFAULTS,
+
+        initContainer: function(){
+            $.extend(this.containerOptions, {
+                trigger: 'manual',
+                selector: false,
+                content: ' ',
+                template: this.defaults.template
+            });
+            
+            //as template property is used in inputs, hide it from popover
+            var t;
+            if(this.$element.data('template')) {
+               t = this.$element.data('template');
+               this.$element.removeData('template');  
+            } 
+            
+            this.call(this.containerOptions);
+            
+            if(t) {
+               //restore data('template')
+               this.$element.data('template', t); 
+            }
+        }, 
+        
+        /* show */
+        innerShow: function () {
+            this.call('show');                
+        },  
+        
+        /* hide */
+        innerHide: function () {
+            this.call('hide');       
+        }, 
+        
+        /* destroy */
+        innerDestroy: function() {
+            this.call('destroy');
+        },                               
+        
+        setContainerOption: function(key, value) {
+            this.container().options[key] = value; 
+        },               
+
+        /**
+        * move popover to new position. This function mainly copied from bootstrap-popover.
+        */
+        /*jshint laxcomma: true, eqeqeq: false*/
+        setPosition: function () { 
+
+            (function() {
+            /*    
+                var $tip = this.tip()
+                , inside
+                , pos
+                , actualWidth
+                , actualHeight
+                , placement
+                , tp
+                , tpt
+                , tpb
+                , tpl
+                , tpr;
+
+                placement = typeof this.options.placement === 'function' ?
+                this.options.placement.call(this, $tip[0], this.$element[0]) :
+                this.options.placement;
+
+                inside = /in/.test(placement);
+               
+                $tip
+              //  .detach()
+              //vitalets: remove any placement class because otherwise they dont influence on re-positioning of visible popover
+                .removeClass('top right bottom left')
+                .css({ top: 0, left: 0, display: 'block' });
+              //  .insertAfter(this.$element);
+               
+                pos = this.getPosition(inside);
+
+                actualWidth = $tip[0].offsetWidth;
+                actualHeight = $tip[0].offsetHeight;
+
+                placement = inside ? placement.split(' ')[1] : placement;
+
+                tpb = {top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2};
+                tpt = {top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2};
+                tpl = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth};
+                tpr = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width};
+
+                switch (placement) {
+                    case 'bottom':
+                        if ((tpb.top + actualHeight) > ($(window).scrollTop() + $(window).height())) {
+                            if (tpt.top > $(window).scrollTop()) {
+                                placement = 'top';
+                            } else if ((tpr.left + actualWidth) < ($(window).scrollLeft() + $(window).width())) {
+                                placement = 'right';
+                            } else if (tpl.left > $(window).scrollLeft()) {
+                                placement = 'left';
+                            } else {
+                                placement = 'right';
+                            }
+                        }
+                        break;
+                    case 'top':
+                        if (tpt.top < $(window).scrollTop()) {
+                            if ((tpb.top + actualHeight) < ($(window).scrollTop() + $(window).height())) {
+                                placement = 'bottom';
+                            } else if ((tpr.left + actualWidth) < ($(window).scrollLeft() + $(window).width())) {
+                                placement = 'right';
+                            } else if (tpl.left > $(window).scrollLeft()) {
+                                placement = 'left';
+                            } else {
+                                placement = 'right';
+                            }
+                        }
+                        break;
+                    case 'left':
+                        if (tpl.left < $(window).scrollLeft()) {
+                            if ((tpr.left + actualWidth) < ($(window).scrollLeft() + $(window).width())) {
+                                placement = 'right';
+                            } else if (tpt.top > $(window).scrollTop()) {
+                                placement = 'top';
+                            } else if (tpt.top > $(window).scrollTop()) {
+                                placement = 'bottom';
+                            } else {
+                                placement = 'right';
+                            }
+                        }
+                        break;
+                    case 'right':
+                        if ((tpr.left + actualWidth) > ($(window).scrollLeft() + $(window).width())) {
+                            if (tpl.left > $(window).scrollLeft()) {
+                                placement = 'left';
+                            } else if (tpt.top > $(window).scrollTop()) {
+                                placement = 'top';
+                            } else if (tpt.top > $(window).scrollTop()) {
+                                placement = 'bottom';
+                            }
+                        }
+                        break;
+                }
+
+                switch (placement) {
+                    case 'bottom':
+                        tp = tpb;
+                        break;
+                    case 'top':
+                        tp = tpt;
+                        break;
+                    case 'left':
+                        tp = tpl;
+                        break;
+                    case 'right':
+                        tp = tpr;
+                        break;
+                }
+
+                $tip
+                .offset(tp)
+                .addClass(placement)
+                .addClass('in');
+           */
+                     
+           
+            var $tip = this.tip();
+            
+            var placement = typeof this.options.placement == 'function' ?
+                this.options.placement.call(this, $tip[0], this.$element[0]) :
+                this.options.placement;            
+
+            var autoToken = /\s?auto?\s?/i;
+            var autoPlace = autoToken.test(placement);
+            if (autoPlace) {
+                placement = placement.replace(autoToken, '') || 'top';
+            }
+            
+            
+            var pos = this.getPosition();
+            var actualWidth = $tip[0].offsetWidth;
+            var actualHeight = $tip[0].offsetHeight;
+
+            if (autoPlace) {
+                var $parent = this.$element.parent();
+
+                var orgPlacement = placement;
+                var docScroll    = document.documentElement.scrollTop || document.body.scrollTop;
+                var parentWidth  = this.options.container == 'body' ? window.innerWidth  : $parent.outerWidth();
+                var parentHeight = this.options.container == 'body' ? window.innerHeight : $parent.outerHeight();
+                var parentLeft   = this.options.container == 'body' ? 0 : $parent.offset().left;
+
+                placement = placement == 'bottom' && pos.top   + pos.height  + actualHeight - docScroll > parentHeight  ? 'top'    :
+                            placement == 'top'    && pos.top   - docScroll   - actualHeight < 0                         ? 'bottom' :
+                            placement == 'right'  && pos.right + actualWidth > parentWidth                              ? 'left'   :
+                            placement == 'left'   && pos.left  - actualWidth < parentLeft                               ? 'right'  :
+                            placement;
+
+                $tip
+                  .removeClass(orgPlacement)
+                  .addClass(placement);
+            }
+
+
+            var calculatedOffset = this.getCalculatedOffset(placement, pos, actualWidth, actualHeight);
+
+            this.applyPlacement(calculatedOffset, placement);            
+                     
+                
+            }).call(this.container());
+          /*jshint laxcomma: false, eqeqeq: true*/  
+        }            
+    });
+
+}(window.jQuery));
+
+/* =========================================================
+ * bootstrap-datepicker.js
+ * http://www.eyecon.ro/bootstrap-datepicker
+ * =========================================================
+ * Copyright 2012 Stefan Petre
+ * Improvements by Andrew Rowls
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * 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.
+ * ========================================================= */
+
+(function( $ ) {
+
+	function UTCDate(){
+		return new Date(Date.UTC.apply(Date, arguments));
+	}
+	function UTCToday(){
+		var today = new Date();
+		return UTCDate(today.getUTCFullYear(), today.getUTCMonth(), today.getUTCDate());
+	}
+
+	// Picker object
+
+	var Datepicker = function(element, options) {
+		var that = this;
+
+		this._process_options(options);
+
+		this.element = $(element);
+		this.isInline = false;
+		this.isInput = this.element.is('input');
+		this.component = this.element.is('.date') ? this.element.find('.add-on, .btn') : false;
+		this.hasInput = this.component && this.element.find('input').length;
+		if(this.component && this.component.length === 0)
+			this.component = false;
+
+		this.picker = $(DPGlobal.template);
+		this._buildEvents();
+		this._attachEvents();
+
+		if(this.isInline) {
+			this.picker.addClass('datepicker-inline').appendTo(this.element);
+		} else {
+			this.picker.addClass('datepicker-dropdown dropdown-menu');
+		}
+
+		if (this.o.rtl){
+			this.picker.addClass('datepicker-rtl');
+			this.picker.find('.prev i, .next i')
+						.toggleClass('icon-arrow-left icon-arrow-right');
+		}
+
+
+		this.viewMode = this.o.startView;
+
+		if (this.o.calendarWeeks)
+			this.picker.find('tfoot th.today')
+						.attr('colspan', function(i, val){
+							return parseInt(val) + 1;
+						});
+
+		this._allow_update = false;
+
+		this.setStartDate(this.o.startDate);
+		this.setEndDate(this.o.endDate);
+		this.setDaysOfWeekDisabled(this.o.daysOfWeekDisabled);
+
+		this.fillDow();
+		this.fillMonths();
+
+		this._allow_update = true;
+
+		this.update();
+		this.showMode();
+
+		if(this.isInline) {
+			this.show();
+		}
+	};
+
+	Datepicker.prototype = {
+		constructor: Datepicker,
+
+		_process_options: function(opts){
+			// Store raw options for reference
+			this._o = $.extend({}, this._o, opts);
+			// Processed options
+			var o = this.o = $.extend({}, this._o);
+
+			// Check if "de-DE" style date is available, if not language should
+			// fallback to 2 letter code eg "de"
+			var lang = o.language;
+			if (!dates[lang]) {
+				lang = lang.split('-')[0];
+				if (!dates[lang])
+					lang = defaults.language;
+			}
+			o.language = lang;
+
+			switch(o.startView){
+				case 2:
+				case 'decade':
+					o.startView = 2;
+					break;
+				case 1:
+				case 'year':
+					o.startView = 1;
+					break;
+				default:
+					o.startView = 0;
+			}
+
+			switch (o.minViewMode) {
+				case 1:
+				case 'months':
+					o.minViewMode = 1;
+					break;
+				case 2:
+				case 'years':
+					o.minViewMode = 2;
+					break;
+				default:
+					o.minViewMode = 0;
+			}
+
+			o.startView = Math.max(o.startView, o.minViewMode);
+
+			o.weekStart %= 7;
+			o.weekEnd = ((o.weekStart + 6) % 7);
+
+			var format = DPGlobal.parseFormat(o.format)
+			if (o.startDate !== -Infinity) {
+				o.startDate = DPGlobal.parseDate(o.startDate, format, o.language);
+			}
+			if (o.endDate !== Infinity) {
+				o.endDate = DPGlobal.parseDate(o.endDate, format, o.language);
+			}
+
+			o.daysOfWeekDisabled = o.daysOfWeekDisabled||[];
+			if (!$.isArray(o.daysOfWeekDisabled))
+				o.daysOfWeekDisabled = o.daysOfWeekDisabled.split(/[,\s]*/);
+			o.daysOfWeekDisabled = $.map(o.daysOfWeekDisabled, function (d) {
+				return parseInt(d, 10);
+			});
+		},
+		_events: [],
+		_secondaryEvents: [],
+		_applyEvents: function(evs){
+			for (var i=0, el, ev; i<evs.length; i++){
+				el = evs[i][0];
+				ev = evs[i][1];
+				el.on(ev);
+			}
+		},
+		_unapplyEvents: function(evs){
+			for (var i=0, el, ev; i<evs.length; i++){
+				el = evs[i][0];
+				ev = evs[i][1];
+				el.off(ev);
+			}
+		},
+		_buildEvents: function(){
+			if (this.isInput) { // single input
+				this._events = [
+					[this.element, {
+						focus: $.proxy(this.show, this),
+						keyup: $.proxy(this.update, this),
+						keydown: $.proxy(this.keydown, this)
+					}]
+				];
+			}
+			else if (this.component && this.hasInput){ // component: input + button
+				this._events = [
+					// For components that are not readonly, allow keyboard nav
+					[this.element.find('input'), {
+						focus: $.proxy(this.show, this),
+						keyup: $.proxy(this.update, this),
+						keydown: $.proxy(this.keydown, this)
+					}],
+					[this.component, {
+						click: $.proxy(this.show, this)
+					}]
+				];
+			}
+			else if (this.element.is('div')) {  // inline datepicker
+				this.isInline = true;
+			}
+			else {
+				this._events = [
+					[this.element, {
+						click: $.proxy(this.show, this)
+					}]
+				];
+			}
+
+			this._secondaryEvents = [
+				[this.picker, {
+					click: $.proxy(this.click, this)
+				}],
+				[$(window), {
+					resize: $.proxy(this.place, this)
+				}],
+				[$(document), {
+					mousedown: $.proxy(function (e) {
+						// Clicked outside the datepicker, hide it
+						if (!(
+							this.element.is(e.target) ||
+							this.element.find(e.target).size() ||
+							this.picker.is(e.target) ||
+							this.picker.find(e.target).size()
+						)) {
+							this.hide();
+						}
+					}, this)
+				}]
+			];
+		},
+		_attachEvents: function(){
+			this._detachEvents();
+			this._applyEvents(this._events);
+		},
+		_detachEvents: function(){
+			this._unapplyEvents(this._events);
+		},
+		_attachSecondaryEvents: function(){
+			this._detachSecondaryEvents();
+			this._applyEvents(this._secondaryEvents);
+		},
+		_detachSecondaryEvents: function(){
+			this._unapplyEvents(this._secondaryEvents);
+		},
+		_trigger: function(event, altdate){
+			var date = altdate || this.date,
+				local_date = new Date(date.getTime() + (date.getTimezoneOffset()*60000));
+
+			this.element.trigger({
+				type: event,
+				date: local_date,
+				format: $.proxy(function(altformat){
+					var format = altformat || this.o.format;
+					return DPGlobal.formatDate(date, format, this.o.language);
+				}, this)
+			});
+		},
+
+		show: function(e) {
+			if (!this.isInline)
+				this.picker.appendTo('body');
+			this.picker.show();
+			this.height = this.component ? this.component.outerHeight() : this.element.outerHeight();
+			this.place();
+			this._attachSecondaryEvents();
+			if (e) {
+				e.preventDefault();
+			}
+			this._trigger('show');
+		},
+
+		hide: function(e){
+			if(this.isInline) return;
+			if (!this.picker.is(':visible')) return;
+			this.picker.hide().detach();
+			this._detachSecondaryEvents();
+			this.viewMode = this.o.startView;
+			this.showMode();
+
+			if (
+				this.o.forceParse &&
+				(
+					this.isInput && this.element.val() ||
+					this.hasInput && this.element.find('input').val()
+				)
+			)
+				this.setValue();
+			this._trigger('hide');
+		},
+
+		remove: function() {
+			this.hide();
+			this._detachEvents();
+			this._detachSecondaryEvents();
+			this.picker.remove();
+			delete this.element.data().datepicker;
+			if (!this.isInput) {
+				delete this.element.data().date;
+			}
+		},
+
+		getDate: function() {
+			var d = this.getUTCDate();
+			return new Date(d.getTime() + (d.getTimezoneOffset()*60000));
+		},
+
+		getUTCDate: function() {
+			return this.date;
+		},
+
+		setDate: function(d) {
+			this.setUTCDate(new Date(d.getTime() - (d.getTimezoneOffset()*60000)));
+		},
+
+		setUTCDate: function(d) {
+			this.date = d;
+			this.setValue();
+		},
+
+		setValue: function() {
+			var formatted = this.getFormattedDate();
+			if (!this.isInput) {
+				if (this.component){
+					this.element.find('input').val(formatted);
+				}
+			} else {
+				this.element.val(formatted);
+			}
+		},
+
+		getFormattedDate: function(format) {
+			if (format === undefined)
+				format = this.o.format;
+			return DPGlobal.formatDate(this.date, format, this.o.language);
+		},
+
+		setStartDate: function(startDate){
+			this._process_options({startDate: startDate});
+			this.update();
+			this.updateNavArrows();
+		},
+
+		setEndDate: function(endDate){
+			this._process_options({endDate: endDate});
+			this.update();
+			this.updateNavArrows();
+		},
+
+		setDaysOfWeekDisabled: function(daysOfWeekDisabled){
+			this._process_options({daysOfWeekDisabled: daysOfWeekDisabled});
+			this.update();
+			this.updateNavArrows();
+		},
+
+		place: function(){
+						if(this.isInline) return;
+			var zIndex = parseInt(this.element.parents().filter(function() {
+							return $(this).css('z-index') != 'auto';
+						}).first().css('z-index'))+10;
+			var offset = this.component ? this.component.parent().offset() : this.element.offset();
+			var height = this.component ? this.component.outerHeight(true) : this.element.outerHeight(true);
+			this.picker.css({
+				top: offset.top + height,
+				left: offset.left,
+				zIndex: zIndex
+			});
+		},
+
+		_allow_update: true,
+		update: function(){
+			if (!this._allow_update) return;
+
+			var date, fromArgs = false;
+			if(arguments && arguments.length && (typeof arguments[0] === 'string' || arguments[0] instanceof Date)) {
+				date = arguments[0];
+				fromArgs = true;
+			} else {
+				date = this.isInput ? this.element.val() : this.element.data('date') || this.element.find('input').val();
+				delete this.element.data().date;
+			}
+
+			this.date = DPGlobal.parseDate(date, this.o.format, this.o.language);
+
+			if(fromArgs) this.setValue();
+
+			if (this.date < this.o.startDate) {
+				this.viewDate = new Date(this.o.startDate);
+			} else if (this.date > this.o.endDate) {
+				this.viewDate = new Date(this.o.endDate);
+			} else {
+				this.viewDate = new Date(this.date);
+			}
+			this.fill();
+		},
+
+		fillDow: function(){
+			var dowCnt = this.o.weekStart,
+			html = '<tr>';
+			if(this.o.calendarWeeks){
+				var cell = '<th class="cw">&nbsp;</th>';
+				html += cell;
+				this.picker.find('.datepicker-days thead tr:first-child').prepend(cell);
+			}
+			while (dowCnt < this.o.weekStart + 7) {
+				html += '<th class="dow">'+dates[this.o.language].daysMin[(dowCnt++)%7]+'</th>';
+			}
+			html += '</tr>';
+			this.picker.find('.datepicker-days thead').append(html);
+		},
+
+		fillMonths: function(){
+			var html = '',
+			i = 0;
+			while (i < 12) {
+				html += '<span class="month">'+dates[this.o.language].monthsShort[i++]+'</span>';
+			}
+			this.picker.find('.datepicker-months td').html(html);
+		},
+
+		setRange: function(range){
+			if (!range || !range.length)
+				delete this.range;
+			else
+				this.range = $.map(range, function(d){ return d.valueOf(); });
+			this.fill();
+		},
+
+		getClassNames: function(date){
+			var cls = [],
+				year = this.viewDate.getUTCFullYear(),
+				month = this.viewDate.getUTCMonth(),
+				currentDate = this.date.valueOf(),
+				today = new Date();
+			if (date.getUTCFullYear() < year || (date.getUTCFullYear() == year && date.getUTCMonth() < month)) {
+				cls.push('old');
+			} else if (date.getUTCFullYear() > year || (date.getUTCFullYear() == year && date.getUTCMonth() > month)) {
+				cls.push('new');
+			}
+			// Compare internal UTC date with local today, not UTC today
+			if (this.o.todayHighlight &&
+				date.getUTCFullYear() == today.getFullYear() &&
+				date.getUTCMonth() == today.getMonth() &&
+				date.getUTCDate() == today.getDate()) {
+				cls.push('today');
+			}
+			if (currentDate && date.valueOf() == currentDate) {
+				cls.push('active');
+			}
+			if (date.valueOf() < this.o.startDate || date.valueOf() > this.o.endDate ||
+				$.inArray(date.getUTCDay(), this.o.daysOfWeekDisabled) !== -1) {
+				cls.push('disabled');
+			}
+			if (this.range){
+				if (date > this.range[0] && date < this.range[this.range.length-1]){
+					cls.push('range');
+				}
+				if ($.inArray(date.valueOf(), this.range) != -1){
+					cls.push('selected');
+				}
+			}
+			return cls;
+		},
+
+		fill: function() {
+			var d = new Date(this.viewDate),
+				year = d.getUTCFullYear(),
+				month = d.getUTCMonth(),
+				startYear = this.o.startDate !== -Infinity ? this.o.startDate.getUTCFullYear() : -Infinity,
+				startMonth = this.o.startDate !== -Infinity ? this.o.startDate.getUTCMonth() : -Infinity,
+				endYear = this.o.endDate !== Infinity ? this.o.endDate.getUTCFullYear() : Infinity,
+				endMonth = this.o.endDate !== Infinity ? this.o.endDate.getUTCMonth() : Infinity,
+				currentDate = this.date && this.date.valueOf(),
+				tooltip;
+			this.picker.find('.datepicker-days thead th.datepicker-switch')
+						.text(dates[this.o.language].months[month]+' '+year);
+			this.picker.find('tfoot th.today')
+						.text(dates[this.o.language].today)
+						.toggle(this.o.todayBtn !== false);
+			this.picker.find('tfoot th.clear')
+						.text(dates[this.o.language].clear)
+						.toggle(this.o.clearBtn !== false);
+			this.updateNavArrows();
+			this.fillMonths();
+			var prevMonth = UTCDate(year, month-1, 28,0,0,0,0),
+				day = DPGlobal.getDaysInMonth(prevMonth.getUTCFullYear(), prevMonth.getUTCMonth());
+			prevMonth.setUTCDate(day);
+			prevMonth.setUTCDate(day - (prevMonth.getUTCDay() - this.o.weekStart + 7)%7);
+			var nextMonth = new Date(prevMonth);
+			nextMonth.setUTCDate(nextMonth.getUTCDate() + 42);
+			nextMonth = nextMonth.valueOf();
+			var html = [];
+			var clsName;
+			while(prevMonth.valueOf() < nextMonth) {
+				if (prevMonth.getUTCDay() == this.o.weekStart) {
+					html.push('<tr>');
+					if(this.o.calendarWeeks){
+						// ISO 8601: First week contains first thursday.
+						// ISO also states week starts on Monday, but we can be more abstract here.
+						var
+							// Start of current week: based on weekstart/current date
+							ws = new Date(+prevMonth + (this.o.weekStart - prevMonth.getUTCDay() - 7) % 7 * 864e5),
+							// Thursday of this week
+							th = new Date(+ws + (7 + 4 - ws.getUTCDay()) % 7 * 864e5),
+							// First Thursday of year, year from thursday
+							yth = new Date(+(yth = UTCDate(th.getUTCFullYear(), 0, 1)) + (7 + 4 - yth.getUTCDay())%7*864e5),
+							// Calendar week: ms between thursdays, div ms per day, div 7 days
+							calWeek =  (th - yth) / 864e5 / 7 + 1;
+						html.push('<td class="cw">'+ calWeek +'</td>');
+
+					}
+				}
+				clsName = this.getClassNames(prevMonth);
+				clsName.push('day');
+
+				var before = this.o.beforeShowDay(prevMonth);
+				if (before === undefined)
+					before = {};
+				else if (typeof(before) === 'boolean')
+					before = {enabled: before};
+				else if (typeof(before) === 'string')
+					before = {classes: before};
+				if (before.enabled === false)
+					clsName.push('disabled');
+				if (before.classes)
+					clsName = clsName.concat(before.classes.split(/\s+/));
+				if (before.tooltip)
+					tooltip = before.tooltip;
+
+				clsName = $.unique(clsName);
+				html.push('<td class="'+clsName.join(' ')+'"' + (tooltip ? ' title="'+tooltip+'"' : '') + '>'+prevMonth.getUTCDate() + '</td>');
+				if (prevMonth.getUTCDay() == this.o.weekEnd) {
+					html.push('</tr>');
+				}
+				prevMonth.setUTCDate(prevMonth.getUTCDate()+1);
+			}
+			this.picker.find('.datepicker-days tbody').empty().append(html.join(''));
+			var currentYear = this.date && this.date.getUTCFullYear();
+
+			var months = this.picker.find('.datepicker-months')
+						.find('th:eq(1)')
+							.text(year)
+							.end()
+						.find('span').removeClass('active');
+			if (currentYear && currentYear == year) {
+				months.eq(this.date.getUTCMonth()).addClass('active');
+			}
+			if (year < startYear || year > endYear) {
+				months.addClass('disabled');
+			}
+			if (year == startYear) {
+				months.slice(0, startMonth).addClass('disabled');
+			}
+			if (year == endYear) {
+				months.slice(endMonth+1).addClass('disabled');
+			}
+
+			html = '';
+			year = parseInt(year/10, 10) * 10;
+			var yearCont = this.picker.find('.datepicker-years')
+								.find('th:eq(1)')
+									.text(year + '-' + (year + 9))
+									.end()
+								.find('td');
+			year -= 1;
+			for (var i = -1; i < 11; i++) {
+				html += '<span class="year'+(i == -1 ? ' old' : i == 10 ? ' new' : '')+(currentYear == year ? ' active' : '')+(year < startYear || year > endYear ? ' disabled' : '')+'">'+year+'</span>';
+				year += 1;
+			}
+			yearCont.html(html);
+		},
+
+		updateNavArrows: function() {
+			if (!this._allow_update) return;
+
+			var d = new Date(this.viewDate),
+				year = d.getUTCFullYear(),
+				month = d.getUTCMonth();
+			switch (this.viewMode) {
+				case 0:
+					if (this.o.startDate !== -Infinity && year <= this.o.startDate.getUTCFullYear() && month <= this.o.startDate.getUTCMonth()) {
+						this.picker.find('.prev').css({visibility: 'hidden'});
+					} else {
+						this.picker.find('.prev').css({visibility: 'visible'});
+					}
+					if (this.o.endDate !== Infinity && year >= this.o.endDate.getUTCFullYear() && month >= this.o.endDate.getUTCMonth()) {
+						this.picker.find('.next').css({visibility: 'hidden'});
+					} else {
+						this.picker.find('.next').css({visibility: 'visible'});
+					}
+					break;
+				case 1:
+				case 2:
+					if (this.o.startDate !== -Infinity && year <= this.o.startDate.getUTCFullYear()) {
+						this.picker.find('.prev').css({visibility: 'hidden'});
+					} else {
+						this.picker.find('.prev').css({visibility: 'visible'});
+					}
+					if (this.o.endDate !== Infinity && year >= this.o.endDate.getUTCFullYear()) {
+						this.picker.find('.next').css({visibility: 'hidden'});
+					} else {
+						this.picker.find('.next').css({visibility: 'visible'});
+					}
+					break;
+			}
+		},
+
+		click: function(e) {
+			e.preventDefault();
+			var target = $(e.target).closest('span, td, th');
+			if (target.length == 1) {
+				switch(target[0].nodeName.toLowerCase()) {
+					case 'th':
+						switch(target[0].className) {
+							case 'datepicker-switch':
+								this.showMode(1);
+								break;
+							case 'prev':
+							case 'next':
+								var dir = DPGlobal.modes[this.viewMode].navStep * (target[0].className == 'prev' ? -1 : 1);
+								switch(this.viewMode){
+									case 0:
+										this.viewDate = this.moveMonth(this.viewDate, dir);
+										break;
+									case 1:
+									case 2:
+										this.viewDate = this.moveYear(this.viewDate, dir);
+										break;
+								}
+								this.fill();
+								break;
+							case 'today':
+								var date = new Date();
+								date = UTCDate(date.getFullYear(), date.getMonth(), date.getDate(), 0, 0, 0);
+
+								this.showMode(-2);
+								var which = this.o.todayBtn == 'linked' ? null : 'view';
+								this._setDate(date, which);
+								break;
+							case 'clear':
+								var element;
+								if (this.isInput)
+									element = this.element;
+								else if (this.component)
+									element = this.element.find('input');
+								if (element)
+									element.val("").change();
+								this._trigger('changeDate');
+								this.update();
+								if (this.o.autoclose)
+									this.hide();
+								break;
+						}
+						break;
+					case 'span':
+						if (!target.is('.disabled')) {
+							this.viewDate.setUTCDate(1);
+							if (target.is('.month')) {
+								var day = 1;
+								var month = target.parent().find('span').index(target);
+								var year = this.viewDate.getUTCFullYear();
+								this.viewDate.setUTCMonth(month);
+								this._trigger('changeMonth', this.viewDate);
+								if (this.o.minViewMode === 1) {
+									this._setDate(UTCDate(year, month, day,0,0,0,0));
+								}
+							} else {
+								var year = parseInt(target.text(), 10)||0;
+								var day = 1;
+								var month = 0;
+								this.viewDate.setUTCFullYear(year);
+								this._trigger('changeYear', this.viewDate);
+								if (this.o.minViewMode === 2) {
+									this._setDate(UTCDate(year, month, day,0,0,0,0));
+								}
+							}
+							this.showMode(-1);
+							this.fill();
+						}
+						break;
+					case 'td':
+						if (target.is('.day') && !target.is('.disabled')){
+							var day = parseInt(target.text(), 10)||1;
+							var year = this.viewDate.getUTCFullYear(),
+								month = this.viewDate.getUTCMonth();
+							if (target.is('.old')) {
+								if (month === 0) {
+									month = 11;
+									year -= 1;
+								} else {
+									month -= 1;
+								}
+							} else if (target.is('.new')) {
+								if (month == 11) {
+									month = 0;
+									year += 1;
+								} else {
+									month += 1;
+								}
+							}
+							this._setDate(UTCDate(year, month, day,0,0,0,0));
+						}
+						break;
+				}
+			}
+		},
+
+		_setDate: function(date, which){
+			if (!which || which == 'date')
+				this.date = new Date(date);
+			if (!which || which  == 'view')
+				this.viewDate = new Date(date);
+			this.fill();
+			this.setValue();
+			this._trigger('changeDate');
+			var element;
+			if (this.isInput) {
+				element = this.element;
+			} else if (this.component){
+				element = this.element.find('input');
+			}
+			if (element) {
+				element.change();
+				if (this.o.autoclose && (!which || which == 'date')) {
+					this.hide();
+				}
+			}
+		},
+
+		moveMonth: function(date, dir){
+			if (!dir) return date;
+			var new_date = new Date(date.valueOf()),
+				day = new_date.getUTCDate(),
+				month = new_date.getUTCMonth(),
+				mag = Math.abs(dir),
+				new_month, test;
+			dir = dir > 0 ? 1 : -1;
+			if (mag == 1){
+				test = dir == -1
+					// If going back one month, make sure month is not current month
+					// (eg, Mar 31 -> Feb 31 == Feb 28, not Mar 02)
+					? function(){ return new_date.getUTCMonth() == month; }
+					// If going forward one month, make sure month is as expected
+					// (eg, Jan 31 -> Feb 31 == Feb 28, not Mar 02)
+					: function(){ return new_date.getUTCMonth() != new_month; };
+				new_month = month + dir;
+				new_date.setUTCMonth(new_month);
+				// Dec -> Jan (12) or Jan -> Dec (-1) -- limit expected date to 0-11
+				if (new_month < 0 || new_month > 11)
+					new_month = (new_month + 12) % 12;
+			} else {
+				// For magnitudes >1, move one month at a time...
+				for (var i=0; i<mag; i++)
+					// ...which might decrease the day (eg, Jan 31 to Feb 28, etc)...
+					new_date = this.moveMonth(new_date, dir);
+				// ...then reset the day, keeping it in the new month
+				new_month = new_date.getUTCMonth();
+				new_date.setUTCDate(day);
+				test = function(){ return new_month != new_date.getUTCMonth(); };
+			}
+			// Common date-resetting loop -- if date is beyond end of month, make it
+			// end of month
+			while (test()){
+				new_date.setUTCDate(--day);
+				new_date.setUTCMonth(new_month);
+			}
+			return new_date;
+		},
+
+		moveYear: function(date, dir){
+			return this.moveMonth(date, dir*12);
+		},
+
+		dateWithinRange: function(date){
+			return date >= this.o.startDate && date <= this.o.endDate;
+		},
+
+		keydown: function(e){
+			if (this.picker.is(':not(:visible)')){
+				if (e.keyCode == 27) // allow escape to hide and re-show picker
+					this.show();
+				return;
+			}
+			var dateChanged = false,
+				dir, day, month,
+				newDate, newViewDate;
+			switch(e.keyCode){
+				case 27: // escape
+					this.hide();
+					e.preventDefault();
+					break;
+				case 37: // left
+				case 39: // right
+					if (!this.o.keyboardNavigation) break;
+					dir = e.keyCode == 37 ? -1 : 1;
+					if (e.ctrlKey){
+						newDate = this.moveYear(this.date, dir);
+						newViewDate = this.moveYear(this.viewDate, dir);
+					} else if (e.shiftKey){
+						newDate = this.moveMonth(this.date, dir);
+						newViewDate = this.moveMonth(this.viewDate, dir);
+					} else {
+						newDate = new Date(this.date);
+						newDate.setUTCDate(this.date.getUTCDate() + dir);
+						newViewDate = new Date(this.viewDate);
+						newViewDate.setUTCDate(this.viewDate.getUTCDate() + dir);
+					}
+					if (this.dateWithinRange(newDate)){
+						this.date = newDate;
+						this.viewDate = newViewDate;
+						this.setValue();
+						this.update();
+						e.preventDefault();
+						dateChanged = true;
+					}
+					break;
+				case 38: // up
+				case 40: // down
+					if (!this.o.keyboardNavigation) break;
+					dir = e.keyCode == 38 ? -1 : 1;
+					if (e.ctrlKey){
+						newDate = this.moveYear(this.date, dir);
+						newViewDate = this.moveYear(this.viewDate, dir);
+					} else if (e.shiftKey){
+						newDate = this.moveMonth(this.date, dir);
+						newViewDate = this.moveMonth(this.viewDate, dir);
+					} else {
+						newDate = new Date(this.date);
+						newDate.setUTCDate(this.date.getUTCDate() + dir * 7);
+						newViewDate = new Date(this.viewDate);
+						newViewDate.setUTCDate(this.viewDate.getUTCDate() + dir * 7);
+					}
+					if (this.dateWithinRange(newDate)){
+						this.date = newDate;
+						this.viewDate = newViewDate;
+						this.setValue();
+						this.update();
+						e.preventDefault();
+						dateChanged = true;
+					}
+					break;
+				case 13: // enter
+					this.hide();
+					e.preventDefault();
+					break;
+				case 9: // tab
+					this.hide();
+					break;
+			}
+			if (dateChanged){
+				this._trigger('changeDate');
+				var element;
+				if (this.isInput) {
+					element = this.element;
+				} else if (this.component){
+					element = this.element.find('input');
+				}
+				if (element) {
+					element.change();
+				}
+			}
+		},
+
+		showMode: function(dir) {
+			if (dir) {
+				this.viewMode = Math.max(this.o.minViewMode, Math.min(2, this.viewMode + dir));
+			}
+			/*
+				vitalets: fixing bug of very special conditions:
+				jquery 1.7.1 + webkit + show inline datepicker in bootstrap popover.
+				Method show() does not set display css correctly and datepicker is not shown.
+				Changed to .css('display', 'block') solve the problem.
+				See https://github.com/vitalets/x-editable/issues/37
+
+				In jquery 1.7.2+ everything works fine.
+			*/
+			//this.picker.find('>div').hide().filter('.datepicker-'+DPGlobal.modes[this.viewMode].clsName).show();
+			this.picker.find('>div').hide().filter('.datepicker-'+DPGlobal.modes[this.viewMode].clsName).css('display', 'block');
+			this.updateNavArrows();
+		}
+	};
+
+	var DateRangePicker = function(element, options){
+		this.element = $(element);
+		this.inputs = $.map(options.inputs, function(i){ return i.jquery ? i[0] : i; });
+		delete options.inputs;
+
+		$(this.inputs)
+			.datepicker(options)
+			.bind('changeDate', $.proxy(this.dateUpdated, this));
+
+		this.pickers = $.map(this.inputs, function(i){ return $(i).data('datepicker'); });
+		this.updateDates();
+	};
+	DateRangePicker.prototype = {
+		updateDates: function(){
+			this.dates = $.map(this.pickers, function(i){ return i.date; });
+			this.updateRanges();
+		},
+		updateRanges: function(){
+			var range = $.map(this.dates, function(d){ return d.valueOf(); });
+			$.each(this.pickers, function(i, p){
+				p.setRange(range);
+			});
+		},
+		dateUpdated: function(e){
+			var dp = $(e.target).data('datepicker'),
+				new_date = dp.getUTCDate(),
+				i = $.inArray(e.target, this.inputs),
+				l = this.inputs.length;
+			if (i == -1) return;
+
+			if (new_date < this.dates[i]){
+				// Date being moved earlier/left
+				while (i>=0 && new_date < this.dates[i]){
+					this.pickers[i--].setUTCDate(new_date);
+				}
+			}
+			else if (new_date > this.dates[i]){
+				// Date being moved later/right
+				while (i<l && new_date > this.dates[i]){
+					this.pickers[i++].setUTCDate(new_date);
+				}
+			}
+			this.updateDates();
+		},
+		remove: function(){
+			$.map(this.pickers, function(p){ p.remove(); });
+			delete this.element.data().datepicker;
+		}
+	};
+
+	function opts_from_el(el, prefix){
+		// Derive options from element data-attrs
+		var data = $(el).data(),
+			out = {}, inkey,
+			replace = new RegExp('^' + prefix.toLowerCase() + '([A-Z])'),
+			prefix = new RegExp('^' + prefix.toLowerCase());
+		for (var key in data)
+			if (prefix.test(key)){
+				inkey = key.replace(replace, function(_,a){ return a.toLowerCase(); });
+				out[inkey] = data[key];
+			}
+		return out;
+	}
+
+	function opts_from_locale(lang){
+		// Derive options from locale plugins
+		var out = {};
+		// Check if "de-DE" style date is available, if not language should
+		// fallback to 2 letter code eg "de"
+		if (!dates[lang]) {
+			lang = lang.split('-')[0]
+			if (!dates[lang])
+				return;
+		}
+		var d = dates[lang];
+		$.each(locale_opts, function(i,k){
+			if (k in d)
+				out[k] = d[k];
+		});
+		return out;
+	}
+
+	var old = $.fn.datepicker;
+	var datepicker = $.fn.datepicker = function ( option ) {
+		var args = Array.apply(null, arguments);
+		args.shift();
+		var internal_return,
+			this_return;
+		this.each(function () {
+			var $this = $(this),
+				data = $this.data('datepicker'),
+				options = typeof option == 'object' && option;
+			if (!data) {
+				var elopts = opts_from_el(this, 'date'),
+					// Preliminary otions
+					xopts = $.extend({}, defaults, elopts, options),
+					locopts = opts_from_locale(xopts.language),
+					// Options priority: js args, data-attrs, locales, defaults
+					opts = $.extend({}, defaults, locopts, elopts, options);
+				if ($this.is('.input-daterange') || opts.inputs){
+					var ropts = {
+						inputs: opts.inputs || $this.find('input').toArray()
+					};
+					$this.data('datepicker', (data = new DateRangePicker(this, $.extend(opts, ropts))));
+				}
+				else{
+					$this.data('datepicker', (data = new Datepicker(this, opts)));
+				}
+			}
+			if (typeof option == 'string' && typeof data[option] == 'function') {
+				internal_return = data[option].apply(data, args);
+				if (internal_return !== undefined)
+					return false;
+			}
+		});
+		if (internal_return !== undefined)
+			return internal_return;
+		else
+			return this;
+	};
+
+	var defaults = $.fn.datepicker.defaults = {
+		autoclose: false,
+		beforeShowDay: $.noop,
+		calendarWeeks: false,
+		clearBtn: false,
+		daysOfWeekDisabled: [],
+		endDate: Infinity,
+		forceParse: true,
+		format: 'mm/dd/yyyy',
+		keyboardNavigation: true,
+		language: 'en',
+		minViewMode: 0,
+		rtl: false,
+		startDate: -Infinity,
+		startView: 0,
+		todayBtn: false,
+		todayHighlight: false,
+		weekStart: 0
+	};
+	var locale_opts = $.fn.datepicker.locale_opts = [
+		'format',
+		'rtl',
+		'weekStart'
+	];
+	$.fn.datepicker.Constructor = Datepicker;
+	var dates = $.fn.datepicker.dates = {
+		en: {
+			days: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"],
+			daysShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
+			daysMin: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa", "Su"],
+			months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
+			monthsShort: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
+			today: "Today",
+			clear: "Clear"
+		}
+	};
+
+	var DPGlobal = {
+		modes: [
+			{
+				clsName: 'days',
+				navFnc: 'Month',
+				navStep: 1
+			},
+			{
+				clsName: 'months',
+				navFnc: 'FullYear',
+				navStep: 1
+			},
+			{
+				clsName: 'years',
+				navFnc: 'FullYear',
+				navStep: 10
+		}],
+		isLeapYear: function (year) {
+			return (((year % 4 === 0) && (year % 100 !== 0)) || (year % 400 === 0));
+		},
+		getDaysInMonth: function (year, month) {
+			return [31, (DPGlobal.isLeapYear(year) ? 29 : 28), 31, 30, 31, 30, 31, 31, 30, 31, 30, 31][month];
+		},
+		validParts: /dd?|DD?|mm?|MM?|yy(?:yy)?/g,
+		nonpunctuation: /[^ -\/:-@\[\u3400-\u9fff-`{-~\t\n\r]+/g,
+		parseFormat: function(format){
+			// IE treats \0 as a string end in inputs (truncating the value),
+			// so it's a bad format delimiter, anyway
+			var separators = format.replace(this.validParts, '\0').split('\0'),
+				parts = format.match(this.validParts);
+			if (!separators || !separators.length || !parts || parts.length === 0){
+				throw new Error("Invalid date format.");
+			}
+			return {separators: separators, parts: parts};
+		},
+		parseDate: function(date, format, language) {
+			if (date instanceof Date) return date;
+			if (typeof format === 'string')
+				format = DPGlobal.parseFormat(format);
+			if (/^[\-+]\d+[dmwy]([\s,]+[\-+]\d+[dmwy])*$/.test(date)) {
+				var part_re = /([\-+]\d+)([dmwy])/,
+					parts = date.match(/([\-+]\d+)([dmwy])/g),
+					part, dir;
+				date = new Date();
+				for (var i=0; i<parts.length; i++) {
+					part = part_re.exec(parts[i]);
+					dir = parseInt(part[1]);
+					switch(part[2]){
+						case 'd':
+							date.setUTCDate(date.getUTCDate() + dir);
+							break;
+						case 'm':
+							date = Datepicker.prototype.moveMonth.call(Datepicker.prototype, date, dir);
+							break;
+						case 'w':
+							date.setUTCDate(date.getUTCDate() + dir * 7);
+							break;
+						case 'y':
+							date = Datepicker.prototype.moveYear.call(Datepicker.prototype, date, dir);
+							break;
+					}
+				}
+				return UTCDate(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate(), 0, 0, 0);
+			}
+			var parts = date && date.match(this.nonpunctuation) || [],
+				date = new Date(),
+				parsed = {},
+				setters_order = ['yyyy', 'yy', 'M', 'MM', 'm', 'mm', 'd', 'dd'],
+				setters_map = {
+					yyyy: function(d,v){ return d.setUTCFullYear(v); },
+					yy: function(d,v){ return d.setUTCFullYear(2000+v); },
+					m: function(d,v){
+						v -= 1;
+						while (v<0) v += 12;
+						v %= 12;
+						d.setUTCMonth(v);
+						while (d.getUTCMonth() != v)
+							d.setUTCDate(d.getUTCDate()-1);
+						return d;
+					},
+					d: function(d,v){ return d.setUTCDate(v); }
+				},
+				val, filtered, part;
+			setters_map['M'] = setters_map['MM'] = setters_map['mm'] = setters_map['m'];
+			setters_map['dd'] = setters_map['d'];
+			date = UTCDate(date.getFullYear(), date.getMonth(), date.getDate(), 0, 0, 0);
+			var fparts = format.parts.slice();
+			// Remove noop parts
+			if (parts.length != fparts.length) {
+				fparts = $(fparts).filter(function(i,p){
+					return $.inArray(p, setters_order) !== -1;
+				}).toArray();
+			}
+			// Process remainder
+			if (parts.length == fparts.length) {
+				for (var i=0, cnt = fparts.length; i < cnt; i++) {
+					val = parseInt(parts[i], 10);
+					part = fparts[i];
+					if (isNaN(val)) {
+						switch(part) {
+							case 'MM':
+								filtered = $(dates[language].months).filter(function(){
+									var m = this.slice(0, parts[i].length),
+										p = parts[i].slice(0, m.length);
+									return m == p;
+								});
+								val = $.inArray(filtered[0], dates[language].months) + 1;
+								break;
+							case 'M':
+								filtered = $(dates[language].monthsShort).filter(function(){
+									var m = this.slice(0, parts[i].length),
+										p = parts[i].slice(0, m.length);
+									return m == p;
+								});
+								val = $.inArray(filtered[0], dates[language].monthsShort) + 1;
+								break;
+						}
+					}
+					parsed[part] = val;
+				}
+				for (var i=0, s; i<setters_order.length; i++){
+					s = setters_order[i];
+					if (s in parsed && !isNaN(parsed[s]))
+						setters_map[s](date, parsed[s]);
+				}
+			}
+			return date;
+		},
+		formatDate: function(date, format, language){
+			if (typeof format === 'string')
+				format = DPGlobal.parseFormat(format);
+			var val = {
+				d: date.getUTCDate(),
+				D: dates[language].daysShort[date.getUTCDay()],
+				DD: dates[language].days[date.getUTCDay()],
+				m: date.getUTCMonth() + 1,
+				M: dates[language].monthsShort[date.getUTCMonth()],
+				MM: dates[language].months[date.getUTCMonth()],
+				yy: date.getUTCFullYear().toString().substring(2),
+				yyyy: date.getUTCFullYear()
+			};
+			val.dd = (val.d < 10 ? '0' : '') + val.d;
+			val.mm = (val.m < 10 ? '0' : '') + val.m;
+			var date = [],
+				seps = $.extend([], format.separators);
+			for (var i=0, cnt = format.parts.length; i <= cnt; i++) {
+				if (seps.length)
+					date.push(seps.shift());
+				date.push(val[format.parts[i]]);
+			}
+			return date.join('');
+		},
+		headTemplate: '<thead>'+
+							'<tr>'+
+								'<th class="prev"><i class="icon-arrow-left"/></th>'+
+								'<th colspan="5" class="datepicker-switch"></th>'+
+								'<th class="next"><i class="icon-arrow-right"/></th>'+
+							'</tr>'+
+						'</thead>',
+		contTemplate: '<tbody><tr><td colspan="7"></td></tr></tbody>',
+		footTemplate: '<tfoot><tr><th colspan="7" class="today"></th></tr><tr><th colspan="7" class="clear"></th></tr></tfoot>'
+	};
+	DPGlobal.template = '<div class="datepicker">'+
+							'<div class="datepicker-days">'+
+								'<table class=" table-condensed">'+
+									DPGlobal.headTemplate+
+									'<tbody></tbody>'+
+									DPGlobal.footTemplate+
+								'</table>'+
+							'</div>'+
+							'<div class="datepicker-months">'+
+								'<table class="table-condensed">'+
+									DPGlobal.headTemplate+
+									DPGlobal.contTemplate+
+									DPGlobal.footTemplate+
+								'</table>'+
+							'</div>'+
+							'<div class="datepicker-years">'+
+								'<table class="table-condensed">'+
+									DPGlobal.headTemplate+
+									DPGlobal.contTemplate+
+									DPGlobal.footTemplate+
+								'</table>'+
+							'</div>'+
+						'</div>';
+
+	$.fn.datepicker.DPGlobal = DPGlobal;
+
+
+	/* DATEPICKER NO CONFLICT
+	* =================== */
+
+	$.fn.datepicker.noConflict = function(){
+		$.fn.datepicker = old;
+		return this;
+	};
+
+
+	/* DATEPICKER DATA-API
+	* ================== */
+
+	$(document).on(
+		'focus.datepicker.data-api click.datepicker.data-api',
+		'[data-provide="datepicker"]',
+		function(e){
+			var $this = $(this);
+			if ($this.data('datepicker')) return;
+			e.preventDefault();
+			// component click requires us to explicitly show it
+			datepicker.call($this, 'show');
+		}
+	);
+	$(function(){
+		//$('[data-provide="datepicker-inline"]').datepicker();
+        //vit: changed to support noConflict()
+        datepicker.call($('[data-provide="datepicker-inline"]'));
+	});
+
+}( window.jQuery ));
+
+/**
+Bootstrap-datepicker.  
+Description and examples: https://github.com/eternicode/bootstrap-datepicker.  
+For **i18n** you should include js file from here: https://github.com/eternicode/bootstrap-datepicker/tree/master/js/locales
+and set `language` option.  
+Since 1.4.0 date has different appearance in **popup** and **inline** modes. 
+
+@class date
+@extends abstractinput
+@final
+@example
+<a href="#" id="dob" data-type="date" data-pk="1" data-url="/post" data-title="Select date">15/05/1984</a>
+<script>
+$(function(){
+    $('#dob').editable({
+        format: 'yyyy-mm-dd',    
+        viewformat: 'dd/mm/yyyy',    
+        datepicker: {
+                weekStart: 1
+           }
+        }
+    });
+});
+</script>
+**/
+(function ($) {
+    "use strict";
+    
+    //store bootstrap-datepicker as bdateicker to exclude conflict with jQuery UI one
+    $.fn.bdatepicker = $.fn.datepicker.noConflict();
+    if(!$.fn.datepicker) { //if there were no other datepickers, keep also original name
+        $.fn.datepicker = $.fn.bdatepicker;    
+    }    
+    
+    var Date = function (options) {
+        this.init('date', options, Date.defaults);
+        this.initPicker(options, Date.defaults);
+    };
+
+    $.fn.editableutils.inherit(Date, $.fn.editabletypes.abstractinput);    
+    
+    $.extend(Date.prototype, {
+        initPicker: function(options, defaults) {
+            //'format' is set directly from settings or data-* attributes
+
+            //by default viewformat equals to format
+            if(!this.options.viewformat) {
+                this.options.viewformat = this.options.format;
+            }
+            
+            //try parse datepicker config defined as json string in data-datepicker
+            options.datepicker = $.fn.editableutils.tryParseJson(options.datepicker, true);
+            
+            //overriding datepicker config (as by default jQuery extend() is not recursive)
+            //since 1.4 datepicker internally uses viewformat instead of format. Format is for submit only
+            this.options.datepicker = $.extend({}, defaults.datepicker, options.datepicker, {
+                format: this.options.viewformat
+            });
+            
+            //language
+            this.options.datepicker.language = this.options.datepicker.language || 'en'; 
+
+            //store DPglobal
+            this.dpg = $.fn.bdatepicker.DPGlobal; 
+
+            //store parsed formats
+            this.parsedFormat = this.dpg.parseFormat(this.options.format);
+            this.parsedViewFormat = this.dpg.parseFormat(this.options.viewformat);            
+        },
+        
+        render: function () {
+            this.$input.bdatepicker(this.options.datepicker);
+            
+            //"clear" link
+            if(this.options.clear) {
+                this.$clear = $('<a href="#"></a>').html(this.options.clear).click($.proxy(function(e){
+                    e.preventDefault();
+                    e.stopPropagation();
+                    this.clear();
+                }, this));
+                
+                this.$tpl.parent().append($('<div class="editable-clear">').append(this.$clear));  
+            }                
+        },
+        
+        value2html: function(value, element) {
+           var text = value ? this.dpg.formatDate(value, this.parsedViewFormat, this.options.datepicker.language) : '';
+           Date.superclass.value2html.call(this, text, element); 
+        },
+
+        html2value: function(html) {
+            return this.parseDate(html, this.parsedViewFormat);
+        },   
+
+        value2str: function(value) {
+            return value ? this.dpg.formatDate(value, this.parsedFormat, this.options.datepicker.language) : '';
+        }, 
+
+        str2value: function(str) {
+            return this.parseDate(str, this.parsedFormat);
+        }, 
+
+        value2submit: function(value) {
+            return this.value2str(value);
+        },                    
+
+        value2input: function(value) {
+            this.$input.bdatepicker('update', value);
+        },
+
+        input2value: function() { 
+            return this.$input.data('datepicker').date;
+        },       
+
+        activate: function() {
+        },
+
+        clear:  function() {
+            this.$input.data('datepicker').date = null;
+            this.$input.find('.active').removeClass('active');
+            if(!this.options.showbuttons) {
+                this.$input.closest('form').submit(); 
+            }
+        },
+
+        autosubmit: function() {
+            this.$input.on('mouseup', '.day', function(e){
+                if($(e.currentTarget).is('.old') || $(e.currentTarget).is('.new')) {
+                    return;
+                }
+                var $form = $(this).closest('form');
+                setTimeout(function() {
+                    $form.submit();
+                }, 200);
+            });
+           //changedate is not suitable as it triggered when showing datepicker. see #149
+           /*
+           this.$input.on('changeDate', function(e){
+               var $form = $(this).closest('form');
+               setTimeout(function() {
+                   $form.submit();
+               }, 200);
+           });
+           */
+       },
+       
+       /*
+        For incorrect date bootstrap-datepicker returns current date that is not suitable
+        for datefield.
+        This function returns null for incorrect date.  
+       */
+       parseDate: function(str, format) {
+           var date = null, formattedBack;
+           if(str) {
+               date = this.dpg.parseDate(str, format, this.options.datepicker.language);
+               if(typeof str === 'string') {
+                   formattedBack = this.dpg.formatDate(date, format, this.options.datepicker.language);
+                   if(str !== formattedBack) {
+                       date = null;
+                   }
+               }
+           }
+           return date;
+       }
+
+    });
+
+    Date.defaults = $.extend({}, $.fn.editabletypes.abstractinput.defaults, {
+        /**
+        @property tpl 
+        @default <div></div>
+        **/         
+        tpl:'<div class="editable-date well"></div>',
+        /**
+        @property inputclass 
+        @default null
+        **/
+        inputclass: null,
+        /**
+        Format used for sending value to server. Also applied when converting date from <code>data-value</code> attribute.<br>
+        Possible tokens are: <code>d, dd, m, mm, yy, yyyy</code>  
+
+        @property format 
+        @type string
+        @default yyyy-mm-dd
+        **/
+        format:'yyyy-mm-dd',
+        /**
+        Format used for displaying date. Also applied when converting date from element's text on init.   
+        If not specified equals to <code>format</code>
+
+        @property viewformat 
+        @type string
+        @default null
+        **/
+        viewformat: null,
+        /**
+        Configuration of datepicker.
+        Full list of options: http://bootstrap-datepicker.readthedocs.org/en/latest/options.html
+
+        @property datepicker 
+        @type object
+        @default {
+            weekStart: 0,
+            startView: 0,
+            minViewMode: 0,
+            autoclose: false
+        }
+        **/
+        datepicker:{
+            weekStart: 0,
+            startView: 0,
+            minViewMode: 0,
+            autoclose: false
+        },
+        /**
+        Text shown as clear date button. 
+        If <code>false</code> clear button will not be rendered.
+
+        @property clear 
+        @type boolean|string
+        @default 'x clear'
+        **/
+        clear: '&times; clear'
+    });
+
+    $.fn.editabletypes.date = Date;
+
+}(window.jQuery));
+
+/**
+Bootstrap datefield input - modification for inline mode.
+Shows normal <input type="text"> and binds popup datepicker.  
+Automatically shown in inline mode.
+
+@class datefield
+@extends date
+
+@since 1.4.0
+**/
+(function ($) {
+    "use strict";
+    
+    var DateField = function (options) {
+        this.init('datefield', options, DateField.defaults);
+        this.initPicker(options, DateField.defaults);
+    };
+
+    $.fn.editableutils.inherit(DateField, $.fn.editabletypes.date);    
+    
+    $.extend(DateField.prototype, {
+        render: function () {
+            this.$input = this.$tpl.find('input');
+            this.setClass();
+            this.setAttr('placeholder');
+    
+            //bootstrap-datepicker is set `bdateicker` to exclude conflict with jQuery UI one. (in date.js)        
+            this.$tpl.bdatepicker(this.options.datepicker);
+            
+            //need to disable original event handlers
+            this.$input.off('focus keydown');
+            
+            //update value of datepicker
+            this.$input.keyup($.proxy(function(){
+               this.$tpl.removeData('date');
+               this.$tpl.bdatepicker('update');
+            }, this));
+            
+        },   
+        
+       value2input: function(value) {
+           this.$input.val(value ? this.dpg.formatDate(value, this.parsedViewFormat, this.options.datepicker.language) : '');
+           this.$tpl.bdatepicker('update');
+       },
+        
+       input2value: function() { 
+           return this.html2value(this.$input.val());
+       },              
+        
+       activate: function() {
+           $.fn.editabletypes.text.prototype.activate.call(this);
+       },
+       
+       autosubmit: function() {
+         //reset autosubmit to empty  
+       }
+    });
+    
+    DateField.defaults = $.extend({}, $.fn.editabletypes.date.defaults, {
+        /**
+        @property tpl 
+        **/         
+        tpl:'<div class="input-append date"><input type="text"/><span class="add-on"><i class="icon-th"></i></span></div>',
+        /**
+        @property inputclass 
+        @default 'input-small'
+        **/         
+        inputclass: 'input-small',
+        
+        /* datepicker config */
+        datepicker: {
+            weekStart: 0,
+            startView: 0,
+            minViewMode: 0,
+            autoclose: true
+        }
+    });
+    
+    $.fn.editabletypes.datefield = DateField;
+
+}(window.jQuery));
+/**
+Bootstrap-datetimepicker.  
+Based on [smalot bootstrap-datetimepicker plugin](https://github.com/smalot/bootstrap-datetimepicker). 
+Before usage you should manually include dependent js and css:
+
+    <link href="css/datetimepicker.css" rel="stylesheet" type="text/css"></link> 
+    <script src="js/bootstrap-datetimepicker.js"></script>
+
+For **i18n** you should include js file from here: https://github.com/smalot/bootstrap-datetimepicker/tree/master/js/locales
+and set `language` option.  
+
+@class datetime
+@extends abstractinput
+@final
+@since 1.4.4
+@example
+<a href="#" id="last_seen" data-type="datetime" data-pk="1" data-url="/post" title="Select date & time">15/03/2013 12:45</a>
+<script>
+$(function(){
+    $('#last_seen').editable({
+        format: 'yyyy-mm-dd hh:ii',    
+        viewformat: 'dd/mm/yyyy hh:ii',    
+        datetimepicker: {
+                weekStart: 1
+           }
+        }
+    });
+});
+</script>
+**/
+(function ($) {
+    "use strict";
+
+    var DateTime = function (options) {
+        this.init('datetime', options, DateTime.defaults);
+        this.initPicker(options, DateTime.defaults);
+    };
+
+    $.fn.editableutils.inherit(DateTime, $.fn.editabletypes.abstractinput);
+
+    $.extend(DateTime.prototype, {
+        initPicker: function(options, defaults) {
+            //'format' is set directly from settings or data-* attributes
+
+            //by default viewformat equals to format
+            if(!this.options.viewformat) {
+                this.options.viewformat = this.options.format;
+            }
+            
+            //try parse datetimepicker config defined as json string in data-datetimepicker
+            options.datetimepicker = $.fn.editableutils.tryParseJson(options.datetimepicker, true);
+
+            //overriding datetimepicker config (as by default jQuery extend() is not recursive)
+            //since 1.4 datetimepicker internally uses viewformat instead of format. Format is for submit only
+            this.options.datetimepicker = $.extend({}, defaults.datetimepicker, options.datetimepicker, {
+                format: this.options.viewformat
+            });
+
+            //language
+            this.options.datetimepicker.language = this.options.datetimepicker.language || 'en'; 
+
+            //store DPglobal
+            this.dpg = $.fn.datetimepicker.DPGlobal; 
+
+            //store parsed formats
+            this.parsedFormat = this.dpg.parseFormat(this.options.format, this.options.formatType);
+            this.parsedViewFormat = this.dpg.parseFormat(this.options.viewformat, this.options.formatType);
+        },
+
+        render: function () {
+            this.$input.datetimepicker(this.options.datetimepicker);
+
+            //adjust container position when viewMode changes
+            //see https://github.com/smalot/bootstrap-datetimepicker/pull/80
+            this.$input.on('changeMode', function(e) {
+                var f = $(this).closest('form').parent();
+                //timeout here, otherwise container changes position before form has new size
+                setTimeout(function(){
+                    f.triggerHandler('resize');
+                }, 0);
+            });
+
+            //"clear" link
+            if(this.options.clear) {
+                this.$clear = $('<a href="#"></a>').html(this.options.clear).click($.proxy(function(e){
+                    e.preventDefault();
+                    e.stopPropagation();
+                    this.clear();
+                }, this));
+
+                this.$tpl.parent().append($('<div class="editable-clear">').append(this.$clear));  
+            }
+        },
+
+        value2html: function(value, element) {
+            //formatDate works with UTCDate!
+            var text = value ? this.dpg.formatDate(this.toUTC(value), this.parsedViewFormat, this.options.datetimepicker.language, this.options.formatType) : '';
+            if(element) {
+                DateTime.superclass.value2html.call(this, text, element);
+            } else {
+                return text;
+            }
+        },
+
+        html2value: function(html) {
+            //parseDate return utc date!
+            var value = this.parseDate(html, this.parsedViewFormat); 
+            return value ? this.fromUTC(value) : null;
+        },
+
+        value2str: function(value) {
+            //formatDate works with UTCDate!
+            return value ? this.dpg.formatDate(this.toUTC(value), this.parsedFormat, this.options.datetimepicker.language, this.options.formatType) : '';
+       },
+
+       str2value: function(str) {
+           //parseDate return utc date!
+           var value = this.parseDate(str, this.parsedFormat);
+           return value ? this.fromUTC(value) : null;
+       },
+
+       value2submit: function(value) {
+           return this.value2str(value);
+       },
+
+       value2input: function(value) {
+           if(value) {
+             this.$input.data('datetimepicker').setDate(value);
+           }
+       },
+
+       input2value: function() { 
+           //date may be cleared, in that case getDate() triggers error
+           var dt = this.$input.data('datetimepicker');
+           return dt.date ? dt.getDate() : null;
+       },
+
+       activate: function() {
+       },
+
+       clear: function() {
+          this.$input.data('datetimepicker').date = null;
+          this.$input.find('.active').removeClass('active');
+          if(!this.options.showbuttons) {
+             this.$input.closest('form').submit(); 
+          }          
+       },
+
+       autosubmit: function() {
+           this.$input.on('mouseup', '.minute', function(e){
+               var $form = $(this).closest('form');
+               setTimeout(function() {
+                   $form.submit();
+               }, 200);
+           });
+       },
+
+       //convert date from local to utc
+       toUTC: function(value) {
+         return value ? new Date(value.valueOf() - value.getTimezoneOffset() * 60000) : value;  
+       },
+
+       //convert date from utc to local
+       fromUTC: function(value) {
+         return value ? new Date(value.valueOf() + value.getTimezoneOffset() * 60000) : value;  
+       },
+
+       /*
+        For incorrect date bootstrap-datetimepicker returns current date that is not suitable
+        for datetimefield.
+        This function returns null for incorrect date.  
+       */
+       parseDate: function(str, format) {
+           var date = null, formattedBack;
+           if(str) {
+               date = this.dpg.parseDate(str, format, this.options.datetimepicker.language, this.options.formatType);
+               if(typeof str === 'string') {
+                   formattedBack = this.dpg.formatDate(date, format, this.options.datetimepicker.language, this.options.formatType);
+                   if(str !== formattedBack) {
+                       date = null;
+                   } 
+               }
+           }
+           return date;
+       }
+
+    });
+
+    DateTime.defaults = $.extend({}, $.fn.editabletypes.abstractinput.defaults, {
+        /**
+        @property tpl 
+        @default <div></div>
+        **/         
+        tpl:'<div class="editable-date well"></div>',
+        /**
+        @property inputclass 
+        @default null
+        **/
+        inputclass: null,
+        /**
+        Format used for sending value to server. Also applied when converting date from <code>data-value</code> attribute.<br>
+        Possible tokens are: <code>d, dd, m, mm, yy, yyyy, h, i</code>  
+        
+        @property format 
+        @type string
+        @default yyyy-mm-dd hh:ii
+        **/         
+        format:'yyyy-mm-dd hh:ii',
+        formatType:'standard',
+        /**
+        Format used for displaying date. Also applied when converting date from element's text on init.   
+        If not specified equals to <code>format</code>
+        
+        @property viewformat 
+        @type string
+        @default null
+        **/
+        viewformat: null,
+        /**
+        Configuration of datetimepicker.
+        Full list of options: https://github.com/smalot/bootstrap-datetimepicker
+
+        @property datetimepicker 
+        @type object
+        @default { }
+        **/
+        datetimepicker:{
+            todayHighlight: false,
+            autoclose: false
+        },
+        /**
+        Text shown as clear date button. 
+        If <code>false</code> clear button will not be rendered.
+
+        @property clear 
+        @type boolean|string
+        @default 'x clear'
+        **/
+        clear: '&times; clear'
+    });
+
+    $.fn.editabletypes.datetime = DateTime;
+
+}(window.jQuery));
+/**
+Bootstrap datetimefield input - datetime input for inline mode.
+Shows normal <input type="text"> and binds popup datetimepicker.  
+Automatically shown in inline mode.
+
+@class datetimefield
+@extends datetime
+
+**/
+(function ($) {
+    "use strict";
+    
+    var DateTimeField = function (options) {
+        this.init('datetimefield', options, DateTimeField.defaults);
+        this.initPicker(options, DateTimeField.defaults);
+    };
+
+    $.fn.editableutils.inherit(DateTimeField, $.fn.editabletypes.datetime);
+    
+    $.extend(DateTimeField.prototype, {
+        render: function () {
+            this.$input = this.$tpl.find('input');
+            this.setClass();
+            this.setAttr('placeholder');
+            
+            this.$tpl.datetimepicker(this.options.datetimepicker);
+            
+            //need to disable original event handlers
+            this.$input.off('focus keydown');
+            
+            //update value of datepicker
+            this.$input.keyup($.proxy(function(){
+               this.$tpl.removeData('date');
+               this.$tpl.datetimepicker('update');
+            }, this));
+            
+        },   
+      
+       value2input: function(value) {
+           this.$input.val(this.value2html(value));
+           this.$tpl.datetimepicker('update');
+       },
+        
+       input2value: function() { 
+           return this.html2value(this.$input.val());
+       },              
+        
+       activate: function() {
+           $.fn.editabletypes.text.prototype.activate.call(this);
+       },
+       
+       autosubmit: function() {
+         //reset autosubmit to empty  
+       }
+    });
+    
+    DateTimeField.defaults = $.extend({}, $.fn.editabletypes.datetime.defaults, {
+        /**
+        @property tpl 
+        **/         
+        tpl:'<div class="input-append date"><input type="text"/><span class="add-on"><i class="icon-th"></i></span></div>',
+        /**
+        @property inputclass 
+        @default 'input-medium'
+        **/         
+        inputclass: 'input-medium',
+        
+        /* datetimepicker config */
+        datetimepicker:{
+            todayHighlight: false,
+            autoclose: true
+        }
+    });
+    
+    $.fn.editabletypes.datetimefield = DateTimeField;
+
+}(window.jQuery));
diff --git a/js/dynamicRowStudent.js b/js/dynamicRowStudent.js
new file mode 100644
index 0000000..35a01ed
--- /dev/null
+++ b/js/dynamicRowStudent.js
@@ -0,0 +1,179 @@
+var exprTable;
+var rowIndex;
+var rowID;
+var numExpressions;
+var correctedArray = [];
+var expressionID;
+var exprIDs = []; // On page load: fill with values
+var is_altered = [];
+var worksheetID;
+var enrollmentID;
+
+
+$(function(){
+    $.getScript('/js/spin.js', function() {
+         
+    });
+    enrollmentID = document.getElementById('EnrollmentID').innerHTML;
+    numExpressions = parseInt(document.getElementById('NumExpressions').innerHTML);
+    //exprIDs = document.getElementByID('ExpressionIDs');
+    //alert(numExpressions);
+    var $tb = $(this).find(".table");
+    
+    for(i = 0; i < numExpressions; i++) {
+        correctedArray[i] = 'n/a';
+        is_altered[i] = 0;
+    }
+    
+    $('.table tr').each(function (i, row) {
+        exprIDs[i - 1] = $(row).find(".expr").attr('id');
+        //started counting at index 1.
+    });
+    //alert(exprIDs[9]);
+    $("button[name='Clear']").on('click',function(e) {
+        e.preventDefault();
+        $("input[name=CorrectedExpr]").val("");
+        
+    });
+    $("button[name='Edit']").on('click',function(e) {
+        e.preventDefault();
+        $("#SubmitExpr").attr("disabled", false);
+        $("#CorrectedExpr").attr("disabled", false);
+        
+        var $row = $(this).closest("tr");
+        rowID = $row.attr('id');
+        rowIndex = $row.find(".nr").text();
+        var expr = $row.find(".expr").text();
+        var corr = $row.find(".corr").text();
+        
+        exprIDs[rowID] = $row.find(".expr").attr('id');
+        
+        $("textarea[name=OriginalExpression]").val(expr);
+        $("input[name=CorrectedExpr]").val(corr);
+        document.getElementById("ExprID").innerHTML = "- Working on Expression: #" + rowIndex;
+    });
+
+    
+    $('input[name="CorrectedExpr"]').keypress(function(e){
+        if (e.which == 13) {
+            $("#SubmitExpr").click();
+            return false;
+        }
+    });
+
+    $('#SubmitExpr').on('click',function(e) {
+        e.preventDefault();   
+        $("#SubmitExpr").attr("disabled", true);
+        $("#CorrectedExpr").attr("disabled", true);
+        
+        
+        document.getElementById("ExprID").innerHTML = " - Load new expression";
+        var corrExpr = $("input[name='CorrectedExpr']").val();
+        var exprID = $("#expressionID").val();
+        var row = $(document).find("button").closest('tr');
+        //Dont know why the index of the correction td is 9, there must be more children than //there are tds, there are actually a total of 15 children
+        document.getElementById(rowID).childNodes[9].innerHTML = corrExpr;
+        correctedArray[rowID] = corrExpr;
+        is_altered[rowID] = 1;
+        $("input[name='CorrectedExpr']").val("");
+        $("textarea[name='OriginalExpression']").val("");
+    });
+    
+    
+    $('#Update').on('click',function(e){
+        e.preventDefault();
+        var is_changed = false;
+        for(i = 0; i < numExpressions; i++) {
+            if (is_altered[i])
+                is_changed = true;
+        }
+        if (!is_changed) {
+            alert("Make a correction before updating!");
+            return false;
+        }
+        var opts = {
+                  lines: 13 // The number of lines to draw
+                , length: 36 // The length of each line
+                , width: 12 // The line thickness
+                , radius: 36 // The radius of the inner circle
+                , scale: 0.15 // Scales overall size of the spinner
+                , corners: 1 // Corner roundness (0..1)
+                , color: '#000' // #rgb or #rrggbb or array of colors
+                , opacity: 0.45 // Opacity of the lines
+                , rotate: 0 // The rotation offset
+                , direction: 1 // 1: clockwise, -1: counterclockwise
+                , speed: 1.2 // Rounds per second
+                , trail: 59 // Afterglow percentage
+                , fps: 20 // Frames per second when using setTimeout() as a fallback for CSS
+                , zIndex: 2e9 // The z-index (defaults to 2000000000)
+                , className: 'spinner' // The CSS class to assign to the spinner
+                , top: '75%' // Top position relative to parent
+                , left: '50%' // Left position relative to parent
+                , shadow: false // Whether to render a shadow
+                , hwaccel: false // Whether to use hardware acceleration
+                , position: 'absolute' // Element positioning
+            }
+        var target = $(this).closest("td").find("div[name='updatespinner']");
+        var spinner = new Spinner(opts).spin();
+        target.append(spinner.el);
+        $(":button").prop("disabled", true);
+
+        
+        worksheetID = document.getElementById('WorksheetID').innerHTML;
+        
+        $.ajax({
+            type: "POST",
+            url: "WriteCorrections.php",
+            data: {
+                "worksheetID"   : worksheetID,
+                "expressionIDs" : exprIDs,
+                "correctedText" : correctedArray,
+                "isAltered"     : is_altered,
+                "enrollmentID"  : enrollmentID
+            },
+            success: function(data) {
+                            
+                $.ajax({
+                    type : "POST",
+                    url: "index.php",
+                    data: {
+                        "worksheetID" : worksheetID  
+                    },
+                    success: function(data) {
+                        location.reload();
+                    }
+                });
+            }
+        });
+    });
+    
+    $(document).on('click', "button[name='SelectExpression']", function(e){
+        var expressionid = $(this).closest("form").find("input[name=expressionID]").val();
+        var worksheetid = $(this).closest("form").find("input[name=worksheetID]").val();
+        var courseid = $(this).closest("form").find("input[name=courseID]").val();
+        var newexpressionnumber = $(this).closest("form").find("input[name=newexpressionnumber]").val();
+        $.ajax({
+            type: "POST",
+            url: "PopulateEditor.php",
+            data: {'expressionID' : expressionid,
+                   'courseID' : courseid, 
+                   'worksheetID' : worksheetid, 
+                   'expressionNum' : newexpressionnumber
+                  },
+                   
+            success: function(data){ 
+                $("div[name='ExpressionEditor']").empty();
+                $("div[name='ExpressionEditor']").html(data);
+            }
+        });
+    });
+    
+    $(document).ready(function() {
+        $("#myTable tr").each(function() {
+            var sentence_number = $(this).find("td[name=sentence_number]").val();
+            var studentID = $(this).find("td[name=studentID]").val();
+            var Expression = $(this).find("td[name=Expression]").val();
+            var assign = $(this).find("td[name=assign]").val();
+        });
+    });
+});
diff --git a/js/dynamicRowTeacher.js b/js/dynamicRowTeacher.js
new file mode 100644
index 0000000..27d7e21
--- /dev/null
+++ b/js/dynamicRowTeacher.js
@@ -0,0 +1,142 @@
+$(function(){
+    // Find a <table> element with id="myTable":
+    var exprTable = document.getElementById("myTable");
+    var corrExpr;
+    var exprHead;
+    
+    var sentence_numbers = new Array();
+    var student_first_name
+    
+    $("#WorksheetOverview tbody").append("<tr><td>...</td></tr>");
+    /*$(document).onload...*/
+    
+    $("#SaveWorksheet").on('click', function(e){
+        alert("Worksheet saved!"); 
+    });
+    
+    $('#EditExpression').on('click',function(e) {
+        var exprRow = exprTable.getElementsByTagName("tr");
+        var expr = exprTable.getElementsByTagName("td");
+        /*var std = expr.getElementsByTagName("option");*/
+        /*document.getElementById("ExprToEdit").innerHTML = expr[1].innerHTML;*/
+        /*document.getElementById("ExprID").innerHTML = expr[0].innerHTML;*/
+        /*$(std[0]).val(expr[0].innerHTML);*/
+        $("#CorrectedExpr").val(expr[2].innerHTML);
+        $("#VocabCorr").val(expr[3].innerHTML);
+        $("#PronCorr").val(expr[3].innerHTML);
+    });
+    
+    $('#SubmitExpr').on('click',function(e){
+        corrExpr = document.getElementById("CorrectedExpr").value;
+        corrVocab = document.getElementById("VocabCorr").value;
+        corrPron = document.getElementById("PronCorr").value;
+        document.getElementById("ExpressionStatus").innerHTML='Complete';
+        document.getElementById("ExprToEdit").innerHTML=corrExpr;
+        document.getElementById("Vocab").innerHTML=corrVocab;
+        document.getElementById("Pronunciation").innerHTML=corrPron;
+        $("#CorrectedExpr").val("");
+        $("#VocabCorr").val("");
+        $("#PronCorr").val("");
+    });
+    
+    $(document).on('click', "button[name='SelectExpression']", function(e){
+        var expressionid = $(this).closest("form").find("input[name=expressionID]").val();
+        var worksheetid = $(this).closest("form").find("input[name=worksheetID]").val();
+        var courseid = $(this).closest("form").find("input[name=courseID]").val();
+        var newexpressionnumber = $(this).closest("form").find("input[name=newexpressionnumber]").val();
+        $.ajax({
+            type: "POST",
+            url: "PopulateEditor.php",
+            data: {'expressionID' : expressionid,
+                   'courseID' : courseid, 
+                   'worksheetID' : worksheetid, 
+                   'expressionNum' : newexpressionnumber
+                  },
+                   
+            success: function(data){ 
+                $("div[name='ExpressionEditor']").empty();
+                $("div[name='ExpressionEditor']").html(data);
+            }
+        });
+    });
+    
+    $(document).on('click', "button[name='NewExpression']", function(e){
+        var worksheetID = $(this).closest("form").find("input[name=worksheetID]").val();
+        var courseID = $(this).closest("form").find("input[name=courseID]").val();
+        var expressionNum = $("input[name=newexpressionnumber]").val();
+        $.ajax({
+            type: "POST",
+            url: "NewExpression.php",
+            data: {
+                "worksheetID": worksheetID,
+                "newexpressionnumber": expressionNum,
+                "courseID": courseID
+            },
+                   
+            success: function(data){ 
+                $("div[name='ExpressionEditor']").empty();
+                $("div[name='ExpressionEditor']").html(data);
+            }
+        });
+    });
+    
+    $(document).on('click', 'button[name="SaveExpression"]', function(e){
+        e.preventDefault();
+        
+        var parentForm = $(this).closest("form");
+        var Expression = $(parentForm).find("input[name=Expression]").val();
+        var ContextVocab = $(parentForm).find("input[name=ContextVocab]").val();
+        var Pronunciation = $(parentForm).find("input[name=Pronunciation]").val();
+        var studentID = $(parentForm).find("select[name=selectstudent]").prop("selected", true).val();         if (studentID == 0) {
+            alert("Pick a student!");
+            return false;
+        }
+        if ( (Expression.length == 0) && (ContextVocab == 0) && (Pronunciation == 0)) {
+            alert("Enter some data");
+            return false;
+        }
+        var AllDo = 0;;
+        if ($(parentForm).find("input[name=alldo][value=all]").is(":checked"))
+            AllDo = 1;
+        var expressionNum = $(parentForm).find("input[name=newexpressionnumber]").val();
+        var worksheetID = $(parentForm).find("input[name=worksheetID]").val();
+        
+        var courseID = $(parentForm).find("input[name=courseID]").val();
+        var expressionID = $(parentForm).find("input[name=expressionID]").val();
+        $.ajax({
+            type: "POST",
+            url: "SaveExpression.php",
+            data: {
+                "Expression": Expression,
+                "ContextVocab": ContextVocab,
+                "Pronunciation": Pronunciation,
+                "studentID": studentID,
+                "AllDo": AllDo,
+                "expressionNum": expressionNum,
+                "worksheetID": worksheetID,
+                "courseID": courseID,
+                "expressionID": expressionID
+            },
+                   
+            success: function(data){ 
+                /*$("div[name='ExpressionEditor']").empty();
+                $("tbody[name='ExpressionTable']").empty();
+                $("tbody[name='ExpressionTable']").html(data);*/
+                location.reload();
+            }
+        });
+    });
+    /*$("tr").each(function(index) {
+        if (index !=0) {
+            $row = $(this);
+            
+            var id = $row.find("td:first").text();
+            
+            if (id.indexOf(value) != 0) {
+                $(this).hide();
+            } else {
+                $(this).show();
+            }
+        }
+    });*/
+});
diff --git a/js/getText.js b/js/getText.js
new file mode 100644
index 0000000..74a4360
--- /dev/null
+++ b/js/getText.js
@@ -0,0 +1,24 @@
+
+$(function(){
+    var clickValidArea = false;
+    
+    
+    $("div[name='highlightrange']").on("click", function(e){
+        
+        $("div[name='highlightrange']").on('mouseup', function(e) {
+            var value = (document.all) ? document.selection.createRange().text : document.getSelection();
+            var expressionid = $(this).closest("td").find("input[name='expressionid']").val();
+            var expressionnumber = $(this).closest("td").find("input[name='expressionnumber']").val();
+            
+            if ( (String(value).length))
+            {
+                $("#editorexpression").val(value);
+                $("#editorexpressionid").val(expressionid);
+                $("#editorexpressionnumber").empty();
+                $("#editorexpressionnumber").append(expressionnumber);
+            }
+                
+            
+        });
+    });
+});
\ No newline at end of file
diff --git a/js/spin.js b/js/spin.js
new file mode 100644
index 0000000..1a3258d
--- /dev/null
+++ b/js/spin.js
@@ -0,0 +1,377 @@
+/**
+ * Copyright (c) 2011-2014 Felix Gnass
+ * Licensed under the MIT license
+ * http://spin.js.org/
+ *
+ * Example:
+    var opts = {
+      lines: 12             // The number of lines to draw
+    , length: 7             // The length of each line
+    , width: 5              // The line thickness
+    , radius: 10            // The radius of the inner circle
+    , scale: 1.0            // Scales overall size of the spinner
+    , corners: 1            // Roundness (0..1)
+    , color: '#000'         // #rgb or #rrggbb
+    , opacity: 1/4          // Opacity of the lines
+    , rotate: 0             // Rotation offset
+    , direction: 1          // 1: clockwise, -1: counterclockwise
+    , speed: 1              // Rounds per second
+    , trail: 100            // Afterglow percentage
+    , fps: 20               // Frames per second when using setTimeout()
+    , zIndex: 2e9           // Use a high z-index by default
+    , className: 'spinner'  // CSS class to assign to the element
+    , top: '50%'            // center vertically
+    , left: '50%'           // center horizontally
+    , shadow: false         // Whether to render a shadow
+    , hwaccel: false        // Whether to use hardware acceleration (might be buggy)
+    , position: 'absolute'  // Element positioning
+    }
+    var target = document.getElementById('foo')
+    var spinner = new Spinner(opts).spin(target)
+ */
+;(function (root, factory) {
+
+  /* CommonJS */
+  if (typeof module == 'object' && module.exports) module.exports = factory()
+
+  /* AMD module */
+  else if (typeof define == 'function' && define.amd) define(factory)
+
+  /* Browser global */
+  else root.Spinner = factory()
+}(this, function () {
+  "use strict"
+
+  var prefixes = ['webkit', 'Moz', 'ms', 'O'] /* Vendor prefixes */
+    , animations = {} /* Animation rules keyed by their name */
+    , useCssAnimations /* Whether to use CSS animations or setTimeout */
+    , sheet /* A stylesheet to hold the @keyframe or VML rules. */
+
+  /**
+   * Utility function to create elements. If no tag name is given,
+   * a DIV is created. Optionally properties can be passed.
+   */
+  function createEl (tag, prop) {
+    var el = document.createElement(tag || 'div')
+      , n
+
+    for (n in prop) el[n] = prop[n]
+    return el
+  }
+
+  /**
+   * Appends children and returns the parent.
+   */
+  function ins (parent /* child1, child2, ...*/) {
+    for (var i = 1, n = arguments.length; i < n; i++) {
+      parent.appendChild(arguments[i])
+    }
+
+    return parent
+  }
+
+  /**
+   * Creates an opacity keyframe animation rule and returns its name.
+   * Since most mobile Webkits have timing issues with animation-delay,
+   * we create separate rules for each line/segment.
+   */
+  function addAnimation (alpha, trail, i, lines) {
+    var name = ['opacity', trail, ~~(alpha * 100), i, lines].join('-')
+      , start = 0.01 + i/lines * 100
+      , z = Math.max(1 - (1-alpha) / trail * (100-start), alpha)
+      , prefix = useCssAnimations.substring(0, useCssAnimations.indexOf('Animation')).toLowerCase()
+      , pre = prefix && '-' + prefix + '-' || ''
+
+    if (!animations[name]) {
+      sheet.insertRule(
+        '@' + pre + 'keyframes ' + name + '{' +
+        '0%{opacity:' + z + '}' +
+        start + '%{opacity:' + alpha + '}' +
+        (start+0.01) + '%{opacity:1}' +
+        (start+trail) % 100 + '%{opacity:' + alpha + '}' +
+        '100%{opacity:' + z + '}' +
+        '}', sheet.cssRules.length)
+
+      animations[name] = 1
+    }
+
+    return name
+  }
+
+  /**
+   * Tries various vendor prefixes and returns the first supported property.
+   */
+  function vendor (el, prop) {
+    var s = el.style
+      , pp
+      , i
+
+    prop = prop.charAt(0).toUpperCase() + prop.slice(1)
+    if (s[prop] !== undefined) return prop
+    for (i = 0; i < prefixes.length; i++) {
+      pp = prefixes[i]+prop
+      if (s[pp] !== undefined) return pp
+    }
+  }
+
+  /**
+   * Sets multiple style properties at once.
+   */
+  function css (el, prop) {
+    for (var n in prop) {
+      el.style[vendor(el, n) || n] = prop[n]
+    }
+
+    return el
+  }
+
+  /**
+   * Fills in default values.
+   */
+  function merge (obj) {
+    for (var i = 1; i < arguments.length; i++) {
+      var def = arguments[i]
+      for (var n in def) {
+        if (obj[n] === undefined) obj[n] = def[n]
+      }
+    }
+    return obj
+  }
+
+  /**
+   * Returns the line color from the given string or array.
+   */
+  function getColor (color, idx) {
+    return typeof color == 'string' ? color : color[idx % color.length]
+  }
+
+  // Built-in defaults
+
+  var defaults = {
+    lines: 12             // The number of lines to draw
+  , length: 7             // The length of each line
+  , width: 5              // The line thickness
+  , radius: 10            // The radius of the inner circle
+  , scale: 1.0            // Scales overall size of the spinner
+  , corners: 1            // Roundness (0..1)
+  , color: '#000'         // #rgb or #rrggbb
+  , opacity: 1/4          // Opacity of the lines
+  , rotate: 0             // Rotation offset
+  , direction: 1          // 1: clockwise, -1: counterclockwise
+  , speed: 1              // Rounds per second
+  , trail: 100            // Afterglow percentage
+  , fps: 20               // Frames per second when using setTimeout()
+  , zIndex: 2e9           // Use a high z-index by default
+  , className: 'spinner'  // CSS class to assign to the element
+  , top: '50%'            // center vertically
+  , left: '50%'           // center horizontally
+  , shadow: false         // Whether to render a shadow
+  , hwaccel: false        // Whether to use hardware acceleration (might be buggy)
+  , position: 'absolute'  // Element positioning
+  }
+
+  /** The constructor */
+  function Spinner (o) {
+    this.opts = merge(o || {}, Spinner.defaults, defaults)
+  }
+
+  // Global defaults that override the built-ins:
+  Spinner.defaults = {}
+
+  merge(Spinner.prototype, {
+    /**
+     * Adds the spinner to the given target element. If this instance is already
+     * spinning, it is automatically removed from its previous target b calling
+     * stop() internally.
+     */
+    spin: function (target) {
+      this.stop()
+
+      var self = this
+        , o = self.opts
+        , el = self.el = createEl(null, {className: o.className})
+
+      css(el, {
+        position: o.position
+      , width: 0
+      , zIndex: o.zIndex
+      , left: o.left
+      , top: o.top
+      })
+
+      if (target) {
+        target.insertBefore(el, target.firstChild || null)
+      }
+
+      el.setAttribute('role', 'progressbar')
+      self.lines(el, self.opts)
+
+      if (!useCssAnimations) {
+        // No CSS animation support, use setTimeout() instead
+        var i = 0
+          , start = (o.lines - 1) * (1 - o.direction) / 2
+          , alpha
+          , fps = o.fps
+          , f = fps / o.speed
+          , ostep = (1 - o.opacity) / (f * o.trail / 100)
+          , astep = f / o.lines
+
+        ;(function anim () {
+          i++
+          for (var j = 0; j < o.lines; j++) {
+            alpha = Math.max(1 - (i + (o.lines - j) * astep) % f * ostep, o.opacity)
+
+            self.opacity(el, j * o.direction + start, alpha, o)
+          }
+          self.timeout = self.el && setTimeout(anim, ~~(1000 / fps))
+        })()
+      }
+      return self
+    }
+
+    /**
+     * Stops and removes the Spinner.
+     */
+  , stop: function () {
+      var el = this.el
+      if (el) {
+        clearTimeout(this.timeout)
+        if (el.parentNode) el.parentNode.removeChild(el)
+        this.el = undefined
+      }
+      return this
+    }
+
+    /**
+     * Internal method that draws the individual lines. Will be overwritten
+     * in VML fallback mode below.
+     */
+  , lines: function (el, o) {
+      var i = 0
+        , start = (o.lines - 1) * (1 - o.direction) / 2
+        , seg
+
+      function fill (color, shadow) {
+        return css(createEl(), {
+          position: 'absolute'
+        , width: o.scale * (o.length + o.width) + 'px'
+        , height: o.scale * o.width + 'px'
+        , background: color
+        , boxShadow: shadow
+        , transformOrigin: 'left'
+        , transform: 'rotate(' + ~~(360/o.lines*i + o.rotate) + 'deg) translate(' + o.scale*o.radius + 'px' + ',0)'
+        , borderRadius: (o.corners * o.scale * o.width >> 1) + 'px'
+        })
+      }
+
+      for (; i < o.lines; i++) {
+        seg = css(createEl(), {
+          position: 'absolute'
+        , top: 1 + ~(o.scale * o.width / 2) + 'px'
+        , transform: o.hwaccel ? 'translate3d(0,0,0)' : ''
+        , opacity: o.opacity
+        , animation: useCssAnimations && addAnimation(o.opacity, o.trail, start + i * o.direction, o.lines) + ' ' + 1 / o.speed + 's linear infinite'
+        })
+
+        if (o.shadow) ins(seg, css(fill('#000', '0 0 4px #000'), {top: '2px'}))
+        ins(el, ins(seg, fill(getColor(o.color, i), '0 0 1px rgba(0,0,0,.1)')))
+      }
+      return el
+    }
+
+    /**
+     * Internal method that adjusts the opacity of a single line.
+     * Will be overwritten in VML fallback mode below.
+     */
+  , opacity: function (el, i, val) {
+      if (i < el.childNodes.length) el.childNodes[i].style.opacity = val
+    }
+
+  })
+
+
+  function initVML () {
+
+    /* Utility function to create a VML tag */
+    function vml (tag, attr) {
+      return createEl('<' + tag + ' xmlns="urn:schemas-microsoft.com:vml" class="spin-vml">', attr)
+    }
+
+    // No CSS transforms but VML support, add a CSS rule for VML elements:
+    sheet.addRule('.spin-vml', 'behavior:url(#default#VML)')
+
+    Spinner.prototype.lines = function (el, o) {
+      var r = o.scale * (o.length + o.width)
+        , s = o.scale * 2 * r
+
+      function grp () {
+        return css(
+          vml('group', {
+            coordsize: s + ' ' + s
+          , coordorigin: -r + ' ' + -r
+          })
+        , { width: s, height: s }
+        )
+      }
+
+      var margin = -(o.width + o.length) * o.scale * 2 + 'px'
+        , g = css(grp(), {position: 'absolute', top: margin, left: margin})
+        , i
+
+      function seg (i, dx, filter) {
+        ins(
+          g
+        , ins(
+            css(grp(), {rotation: 360 / o.lines * i + 'deg', left: ~~dx})
+          , ins(
+              css(
+                vml('roundrect', {arcsize: o.corners})
+              , { width: r
+                , height: o.scale * o.width
+                , left: o.scale * o.radius
+                , top: -o.scale * o.width >> 1
+                , filter: filter
+                }
+              )
+            , vml('fill', {color: getColor(o.color, i), opacity: o.opacity})
+            , vml('stroke', {opacity: 0}) // transparent stroke to fix color bleeding upon opacity change
+            )
+          )
+        )
+      }
+
+      if (o.shadow)
+        for (i = 1; i <= o.lines; i++) {
+          seg(i, -2, 'progid:DXImageTransform.Microsoft.Blur(pixelradius=2,makeshadow=1,shadowopacity=.3)')
+        }
+
+      for (i = 1; i <= o.lines; i++) seg(i)
+      return ins(el, g)
+    }
+
+    Spinner.prototype.opacity = function (el, i, val, o) {
+      var c = el.firstChild
+      o = o.shadow && o.lines || 0
+      if (c && i + o < c.childNodes.length) {
+        c = c.childNodes[i + o]; c = c && c.firstChild; c = c && c.firstChild
+        if (c) c.opacity = val
+      }
+    }
+  }
+
+  if (typeof document !== 'undefined') {
+    sheet = (function () {
+      var el = createEl('style', {type : 'text/css'})
+      ins(document.getElementsByTagName('head')[0], el)
+      return el.sheet || el.styleSheet
+    }())
+
+    var probe = css(createEl('group'), {behavior: 'url(#default#VML)'})
+
+    if (!vendor(probe, 'transform') && probe.adj) initVML()
+    else useCssAnimations = vendor(probe, 'animation')
+  }
+
+  return Spinner
+
+}));
diff --git a/media/Audio/sample.mp3 b/media/Audio/sample.mp3
new file mode 100644
index 0000000..d99cf47
Binary files /dev/null and b/media/Audio/sample.mp3 differ
diff --git a/media/circle-loading-gif.gif b/media/circle-loading-gif.gif
new file mode 100644
index 0000000..fc02192
Binary files /dev/null and b/media/circle-loading-gif.gif differ
diff --git a/media/logo_1.png b/media/logo_1.png
new file mode 100644
index 0000000..ccfd05d
Binary files /dev/null and b/media/logo_1.png differ
diff --git a/package.json b/package.json
index 017cd6e..605ab9c 100644
--- a/package.json
+++ b/package.json
@@ -4,31 +4,31 @@
   "main": "dist/js/bootstrap-select.js",
   "description": "A custom <select> for Bootstrap using button dropdown as replacement",
   "version": "1.7.2",
-  "homepage": "https://silviomoreto.github.io/bootstrap-select",
+  "homepage": "//silviomoreto.github.io/bootstrap-select",
   "author": {
     "name": "Silvio Moreto",
-    "url": "https://github.com/silviomoreto"
+    "url": "//github.com/silviomoreto"
   },
   "contributors": [
     {
       "name": "Silvio Moreto",
-      "url": "https://github.com/silviomoreto"
+      "url": "//github.com/silviomoreto"
     },
     {
       "name": "Ana Carolina",
-      "url": "https://github.com/anacarolinats"
+      "url": "//github.com/anacarolinats"
     },
     {
       "name": "caseyjhol",
-      "url": "https://github.com/caseyjhol"
+      "url": "//github.com/caseyjhol"
     },
     {
       "name": "Matt Bryson",
-      "url": "https://github.com/mattbryson"
+      "url": "//github.com/mattbryson"
     },
     {
       "name": "t0xicCode",
-      "url": "https://github.com/t0xicCode"
+      "url": "//github.com/t0xicCode"
     }
   ],
   "repository": {
@@ -37,7 +37,7 @@
   },
   "license": {
     "type": "MIT",
-    "url": "https://github.com/silviomoreto/bootstrap-select/blob/master/LICENSE"
+    "url": "//github.com/silviomoreto/bootstrap-select/blob/master/LICENSE"
   },
   "dependencies": {
     "jquery": ">=1.8"
diff --git a/queries.php b/queries.php
new file mode 100644
index 0000000..75d3e34
--- /dev/null
+++ b/queries.php
@@ -0,0 +1,111 @@
+<?php
+include_once 'base.php';
+function get_expression_query_string($words, $PoS, $offsets)
+{
+    $num_words = count($words);
+    $num_tags = count($PoS);
+    $query_length = max($num_words, $num_tags);
+    
+    $query = "";
+    $params = array();
+    
+    $query .= "SELECT Ex.ExpressionID, Ex.Expression, Ex.[Context/Vocabulary], Ex.Topic_ID FROM Expressions Ex, Dictionary D, SequentialWords SW WHERE Ex.ExpressionID in (SELECT ) ";
+    
+    for($i = 0; $i < $query_length; $i++)
+    {
+        $word = $words[$i];
+        $tag = $PoS[$i];
+        if ( (count($word) == 0 ) && (count($tag) == 0 ) )
+            continue;
+        if ( count($word) == 0)
+        {
+            $query .= "D.PoS = ? OR";
+            $params .= $tag;
+            
+        }
+    }
+    
+}
+
+function get_dictionary_entries($words, $tags)
+{
+    $query = "SELECT WordID, Form, PoS, Frequency FROM Dictionary WHERE ";
+    $options = array( "Scrollable" => 'static' );
+    $num_words = count($words);
+    $num_tags = count($tags);
+    $input_length = max($num_words, $num_tags);
+    
+    $query_length = 0;
+    $num_tags = 0;
+    $num_words = 0;
+    
+    for ($i = 0; $i < $input_length; $i++)
+    {
+        if ( (strlen($words[$i]) > 0) || (strlen($tags[$i]) > 0))
+            $query_length++;
+        if ( strlen($words[$i]) > 0)
+            $num_words++;
+        if ( strlen($tags[$i]) > 0)
+            $num_tags++;
+    }
+    $params = array();
+    for ($i = 0; $i < $query_length - 1; $i++)
+    {
+        if ( (strlen($words[$i]) > 0) && (strlen($tags[$i]) > 0))
+        {
+            $query .= "(Form = ? AND PoS = ?) OR ";
+            $params[] = $words[$i];
+            $params[] = $tags[$i];
+        }
+        elseif (strlen($words[$i]) > 0)
+        {
+            $query .= "(Form = ?) OR ";
+            $params[] = $words[$i];
+        }
+        elseif (strlen($tags[$i]) > 0)
+        {
+            $query .= "(PoS = ?) OR ";
+            $params[] = $tags[$i];
+        }
+    }
+    
+    // Last instance
+    if ( $query_length > 0 )
+    {
+        if ( (strlen($words[$query_length - 1]) > 0) && (strlen($tags[$query_length - 1]) > 0))
+        {
+            $query .= "(Form = ? AND PoS = ?)";
+            $params[] = $words[$i];
+            $params[] = $tags[$i];
+        }
+        elseif (strlen($words[$query_length - 1]) > 0)
+        {
+            $query .= "(Form = ?)";
+            $params[] = $words[$i];
+        }
+        elseif (strlen($tags[$query_length - 1]) > 0)
+        {
+            $query .="(PoS = ?)";
+            $params[] = $tags[$i];
+        }
+    }
+    /*$stmt = sqlsrv_query($con, $query, $params, $options);
+    if ($stmt === false)
+        die (print_r(sqlsrv_errors(), true));
+    $ids = [];
+    $forms = [];
+    $tags = [];
+    $freq = [];
+    while (sqlsrv_fetch($stmt) === true)
+    {
+        $ids = sqlsrv_get_field($stmt, 0);
+        $forms = sqlsrv_get_field($stmt, 1);
+        $tags = sqlsrv_get_field($stmt, 2);
+        $freq = sqlsrv_get_field($stmt, 3);
+    }
+    $result = array($ids, $forms, $tags, $freq);
+    return $result;
+    */
+    return array($query, $params);
+}
+?>
\ No newline at end of file
diff --git a/register.php b/register.php
index e3934ac..dacc48b 100644
--- a/register.php
+++ b/register.php
@@ -12,7 +12,7 @@
         <link href="css/bootstrap.css" rel="stylesheet">
         
         <!-- Header File -->
-        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+        <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
         <script>
             $(function(){
                 $("#header").load("header.html");
@@ -27,6 +27,8 @@
                 {
                     $username = $_POST['username'];
                     $password = md5($_POST['password'] . $salt);
+                    $firstname = $_POST['firstname'];
+                    $lastname = $_POST['lastname'];
                     
                     
                     $login_sql = "SELECT * FROM SiteUsers WHERE username = ?";
@@ -43,8 +45,8 @@
                     }
                     else
                     {
-                        $params = array($username, $password);
-                        $registerquery = sqlsrv_query($con, "INSERT INTO SiteUsers (username, password, date_added) VALUES(?,?, GETDATE())", $params, $options);
+                        $params = array($username, $password, $firstname, $lastname);
+                        $registerquery = sqlsrv_query($con, "INSERT INTO SiteUsers (username, password, firstname, lastname, date_added) VALUES(?,?,?,?, GETDATE())", $params, $options);
                         
                         if($registerquery === false)
                         {
@@ -67,6 +69,8 @@
                     <p>Please enter your details below to register.</p>
                     <form method="post" action="register.php" name="registerform" id="registerform">
                     <fieldset>
+                        <label for="firstname">First Name:</label><input type="text" name="firstname" id="firstname" /><br />
+                        <label for="lastname">Last Name:</label><input type="text" name="lastname" id="lastname" /><br />
                         <label for="username">Username:</label><input type="text" name="username" id="username" /><br />
                         
                         <label for="password">Password:</label><input type="password" name="password" id="password" /><br />
diff --git a/resetpassword.php b/resetpassword.php
index e69de29..5de3b84 100644
--- a/resetpassword.php
+++ b/resetpassword.php
@@ -0,0 +1,86 @@
+<?php include "base.php"; ?>
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+        <title>Gonzaga Small Talk</title>
+
+        <!-- Bootstrap -->
+        <link href="css/bootstrap.css" rel="stylesheet">
+        
+        <!-- Header File -->
+        <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+        <script>
+            $(function(){
+                $("#header").load("header.html");
+            });
+        </script>
+    </head>
+    
+    <body>
+        <div id="main">
+            <?php
+                if(!empty($_POST['email']))
+                {
+                    $email = $_POST['email'];
+                    
+                    $checkemail_sql = "SELECT * FROM SiteUsers WHERE email = ?";
+                    
+                    $params = array($email);
+                    $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+                    
+                    $checkemail = sqlsrv_query($con, $checkemail_sql, $params, $options);
+                    
+                    if(sqlsrv_num_rows($checkemail) == 1)
+                    {
+                        $subject = "Gonzaga Smalltalk ELC Password Reset";
+                        $message = "<html>
+                            <head>
+                            <title>Password Reset</title>
+                            </head>
+                            <body>
+                            <p>This email has been sent because you requested to have your password reset on the Gonzaga Smalltalk site. If you did not request to have your password changed, please disregard and delete this email.</p>
+                            <p>Link to password reset form</p>
+                            </body>
+                            </html>";
+                        $headers  = 'MIME-Version: 1.0' . "\r\n";
+                        $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
+                        $headers .= 'To: ' . $email . "\r\n";
+                        $headers .= 'From: passwordreset@gonzagasmalltalk.azurewebsites.net' . "\r\n";
+                        if(mail($email, $subject, $message, $headers))
+                        {
+                            echo "<h1>Reset Email Sent</h1>";
+                            echo "<p>A confirmation email has been sent to " . $email . ".  Please follow the instructions in the email to reset your password.</p>";
+                        }
+                        else
+                        {
+                            echo "<h1>Email Failed</h1>";
+                            echo "<p>The confirmation email failed to send. <a href=\"resetpassword.php\">Please try again</a>.</p>";
+                        }
+                    }
+                    else
+                    {
+                      echo "<h1>Error</h1>";
+                      echo "<p>That email does not appear to be registered. <a href=\"resetpassword.php\">Please try again.</a></p>";
+                    }
+                }
+                else
+                {
+                    ?>             
+                    <h1>Forgot Your Password?</h1>
+                    <p>Please enter your email address.  An email will be sent with a link to reset your password.</p>
+                    <form method="post" action="resetpassword.php" name="resetform" id="resetform">
+                    <fieldset>
+                        <label for="email">Email Address:</label><input type="text" name="email" id="email" /><br />
+                        <input type="submit" name="reset" id="reset" id="reset" value="Send Email" />
+                    </fieldset>
+                    </form>         
+                    <?php
+                }
+            ?>
+        </div>
+    </body>
+</html>
\ No newline at end of file
diff --git a/sendemailtest.php b/sendemailtest.php
new file mode 100644
index 0000000..83a7721
--- /dev/null
+++ b/sendemailtest.php
@@ -0,0 +1,71 @@
+<?php include "base.php"; ?>
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+        <title>Gonzaga Small Talk</title>
+
+        <!-- Bootstrap -->
+        <link href="css/bootstrap.css" rel="stylesheet">
+        
+        <!-- Header File -->
+        <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+        <script>
+            $(function(){
+                $("#header").load("header.html");
+            });
+        </script>
+    </head>
+    
+    <body>
+        <div id="main">
+            <?php
+                if(!empty($_POST['email']))
+                {
+                    $email = $_POST['email'];
+                    
+                        $subject = "Gonzaga Smalltalk ELC Password Reset";
+                        $message = "<html>
+                            <head>
+                            <title>Password Reset</title>
+                            </head>
+                            <body>
+                            <p>This email has been sent because you requested to have your password reset on the Gonzaga Smalltalk site. If you did not request to have your password changed, please disregard and delete this email.</p>
+                            <p>Link to password reset form</p>
+                            </body>
+                            </html>";
+                        $headers  = 'MIME-Version: 1.0' . "\r\n";
+                        $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
+                        $headers .= 'To: ' . $email . "\r\n";
+                        $headers .= 'From: passwordreset@gonzagasmalltalk.azurewebsites.net' . "\r\n";
+                        if(mail($email, $subject, $message, $headers))
+                        {
+                            echo "<h1>Reset Email Sent</h1>";
+                            echo "<p>A confirmation email has been sent to " . $email . ".  Please follow the instructions in the email to reset your password.</p>";
+                        }
+                        else
+                        {
+                            echo "<h1>Email Failed</h1>";
+                            echo "<p>The confirmation email failed to send. <a href=\"sendemailtest.php\">Please try again</a>.</p>";
+                        }
+                }
+                else
+                {
+                    ?>             
+                    <h1>Forgot Your Password?</h1>
+                    <p>Please enter your email address.  An email will be sent with a link to reset your password.</p>
+                    <form method="post" action="sendemailtest.php" name="resetform" id="resetform">
+                    <fieldset>
+                        <label for="email">Email Address:</label><input type="text" name="email" id="email" /><br />
+                        <input type="submit" name="reset" id="reset" id="reset" value="Send Email" />
+                    </fieldset>
+                    </form>         
+                    <?php
+                }
+            ?>
+        </div>
+    </body>
+</html>
\ No newline at end of file
diff --git a/sidebar.php b/sidebar.php
index b3d4b5d..3cc60a4 100644
--- a/sidebar.php
+++ b/sidebar.php
@@ -15,14 +15,44 @@
                 display:inline-block;
                 padding:2px;
             }
+            
         </style>
     </head>
     
     <?php
     if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
     {
+        $params = array($_SESSION['Username']);
+        $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+        $ListRolesQuery = "SELECT DISTINCT R.Role, R.Designation, R.RoleID, R.Type FROM Roles as R, RoleInstances as RI WHERE RI.SiteUsername = ? AND RI.RoleID = R.RoleID ORDER BY R.RoleID, R.Designation, R.Type";
+        $stmt = sqlsrv_query($con, $ListRolesQuery, $params, $options);
+        if( $stmt === false ) {
+             die( print_r( sqlsrv_errors(), true));
+        }
+
+        // Make the first (and in this case, only) row of the result set available for reading.
+        $RolesList = [];
+        $Designations = [];
+        $AccessPriv = [];
+        $NumRoles = 0;
+        while( sqlsrv_fetch( $stmt ) === true) {
+            $RolesList[] = sqlsrv_get_field( $stmt, 0);
+            $Designations[] = sqlsrv_get_field( $stmt, 1);
+            $AccessPriv[] = sqlsrv_get_field( $stmt, 3);
+            $NumRoles += 1;
+        }
         if($_SESSION['Role'] == 'Admin')
         {
+            $params = array($_SESSION['Institution']);
+            $options = array( "Scrollable" => 'static' );
+            $instIDQuery = "SELECT InstitutionID FROM Institutions WHERE InstitutionName = ?";
+            $stmt = sqlsrv_query ( $con, $instIDQuery, $params, $options );
+            if ( $stmt === false )
+                die (print_r(sqlsrv_errors(), true));
+            if ( sqlsrv_fetch ($stmt) === true)
+                $institutionID = sqlsrv_get_field( $stmt, 0);
+            
+            
             ?>
             <body>
                 <div id="wrapper">
@@ -32,39 +62,73 @@
                     <nav class="navbar navbar-inverse navbar-fixed-top" id="sidebar-wrapper" role="navigation">
                         <ul class="nav sidebar-nav">
                             <li class="sidebar-brand">
-                                <a href="/Admin/Home/">Admin Home</a>
-                            </li>
-                            <li class="dropdown">
-                              <a href="/admin/ManageCourses/" class="dropdown-toggle" data-toggle="dropdown">Manage Courses<span class="caret"></span></a>
-                              <ul class="dropdown-menu" role="menu">
-                                <li><a href="/Admin/ManageCourses/CreateCourse/">   Create Course</a>
-                                    <a href="/Admin/ManageCourses/ViewCourse/"> View Course</a></li>
-                              </ul>
-                            </li>
-                            <li class="dropdown">
-                              <a href="/admin/ManageTeachers/" class="dropdown-toggle" data-toggle="dropdown">Manage Teachers<span class="caret"></span></a>
-                              <ul class="dropdown-menu" role="menu">
-                                <li><a href="/Admin/ManageTeachers/CreateTeacher/"> Create Teacher</a>
-                                <a href="/admin/ManageTeachers/ViewTeacherProfile/">    View Teacher Profile</a></li>
-                              </ul>
-                            </li>
-                            <li class="dropdown">
-                              <a href="/admin/ManageStudents/" class="dropdown-toggle" data-toggle="dropdown">Manage Students<span class="caret"></span></a>
-                              <ul class="dropdown-menu" role="menu">
-                                <li><a href="/admin/ManageStudents/CreateStudent/"> Create Student</a>
-                                <a href="/admin/ManageStudents/ViewStudentProfile/">    View Student Profile</a></li>
-                              </ul>
+                                <a href="/Admin/Home/">Smalltalk</a>
                             </li>
                             <li>
-                                <a class="dropdown-toggle" data-toggle="dropdown">Manage Corpus<span class="caret"></span></a>
+                                <a class="dropdown-toggle" data-toggle="dropdown"><?=$_SESSION['Username']?><span class="caret"></span></a>
                                 <ul class="dropdown-menu" role="menu">
-                                    <li><a href="/Admin/ManageCorpus/">Home</a>
-                                        <a href="/Admin/ManageCorpus/ReviewChanges/">Review Changes</a>
+
+                                    <li>
+        <?php   
+            $count = 0;
+            foreach($RolesList as $ListedRole)
+            {
+                if ($ListedRole == $_SESSION['Role'])
+                {
+        ?>
+                                        <a style="text-decoration:underline"><?=$ListedRole?> <small class="text-muted"><?=$Designations[$count]?></small></a>
+        <?php
+                }
+                else
+                {
+        ?>
+                                        <a href="/ChangeRole.php?q=<?=$ListedRole?>&t=<?=$AccessPriv[$count]?>"><?=$ListedRole?> <small class="text-muted"><?=$Designations[$count]?></small></a>
+        <?php
+                }
+                $count++;
+            }
+        ?>
+                
                                     </li>
                               </ul>
                             </li>
+                            <li class="nav-divider"></li>
+                            <li><a href="/Admin/SiteUsers/">Site Users</a></li>
+                            </li>
+                            <li class="dropdown">
+                                <a class="dropdown-toggle" data-toggle="dropdown">Site Activity<span class="caret"></span></a>
+                                <ul class="dropdown-menu" role="menu">
+                                  <li>
+                                    <?php
+            if ($_SESSION['AccessType'] == 'Super')
+            {
+                ?>
+                <a href="/Admin/ManageInstitutions/">Institutions <small class="text-muted">Superuser</small></a>
+                <?php
+            }
+            else
+            {
+                if ( ($_SESSION['Designation'] == 'Primary') || ($_SESSION['Designation'] == 'Developer'))
+                {
+                    ?>
+                                    <a href="/Admin/ManageInstitutions/ViewInstitution/?in=<?=$institutionID?>"><?=$_SESSION['Institution']?></a>
+                                    <?php
+                }
+            }
+            ?>
+                                    <a href="/Admin/ManageCorpus/">Corpus</a>
+                                    <a href="/Admin/ManageCourses/">Courses</a>
+                                </li>
+                            </ul>
+            <?php
+            
+                
+                                    ?>
+                                    
+                                    
+                            
                             <li>
-                                <a href="/corpus/">Corpus</a>
+                                <a href="/corpus/Search/">Corpus</a>
                             </li>
                             <li>
                                 <a class="dropdown-toggle" data-toggle="dropdown">Archive<span class="caret"></span></a>
@@ -75,6 +139,15 @@
                                     </li>
                               </ul>
                             </li>
+                            
+                            <li class="nav-divider"></li>
+                            <li>
+                                <a href="#">Change Password</a>
+                            </li>
+                            <li>
+                                <a href="/Logout.php">Logout</a>
+                            </li>
+                            
                         </ul>
                     </nav>
                     <!-- /#sidebar-wrapper -->
@@ -89,7 +162,7 @@
                     </div>-->
                     <!-- /#page-content-wrapper -->
                 </div>
-                <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+                <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
                 <!-- Include all compiled plugins (below), or include individual files as needed -->
                 <script src="js/bootstrap.min.js"></script>
                 <script src="js/SidebarPractice.js"></script>
@@ -119,6 +192,7 @@
             
             $institutions = [];
             $institution_ids = [];
+            $num_institutions = sqlsrv_num_rows($stmt);
             while( sqlsrv_fetch( $stmt ) === true) {
                 $institutions[] = sqlsrv_get_field( $stmt, 0);
                 $institution_ids[] = sqlsrv_get_field( $stmt, 1);
@@ -133,25 +207,66 @@
                     <nav class="navbar navbar-inverse navbar-fixed-top" id="sidebar-wrapper" role="navigation">
                         <ul class="nav sidebar-nav">
                             <li class="sidebar-brand">
-                                <a href="/teacher/Home/">Teacher Home</a>
+                                <a href="/teacher/Home/">Home</a>
                             </li>
+                            <li>
+                                <a class="dropdown-toggle" data-toggle="dropdown"><?=$_SESSION['Username']?><span class="caret"></span></a>
+                                <ul class="dropdown-menu" role="menu">
+<!--
+                                    <li class="dropdown-header">My Roles</li>
+-->
+                                    <li>
+                                         <?php      
+                $count = 0;
+        foreach($RolesList as $ListedRole)
+        {
+            if ($ListedRole == $_SESSION['Role'])
+            {
+            ?>
+                        <strong><a><?=$ListedRole?> <small class="text-muted"><?=$Designations[$count]?></small></a></strong>
+                                
+            <?php
+            }
+            else
+            {
+                ?>
+                                        <a href="/ChangeRole.php?q=<?=$ListedRole?>&t=<?=$AccessPriv[$count]?>"><?=$ListedRole?> <small class="text-muted"><?=$Designations[$count]?></small></a>
+                                        <?php
+                    
+            }
+            $count++;
+        }
+        ?>
+                
+                                    </li>
+                              </ul>
+                            </li>
+                            <li class="nav-divider"></li>
+                            <?php
+            for($i = 0; $i < $num_institutions; $i++)
+            {
+                ?>
                             <li class="dropdown">
-                              <a href="/teacher/MyInstitutions/" class="dropdown-toggle" data-toggle="dropdown">My Institutions<span class="caret"></span></a>
+                              <a href="/teacher/MyInstitutions/" class="dropdown-toggle" data-toggle="dropdown"><?=$institutions[$i]?><span class="caret"></span></a>
                               <ul class="dropdown-menu" role="menu">
-                                  <?php
-            $i = 0;
-            foreach($institutions as $inst)
-            {
+                                  <li>
+                                      <?php
+                    echo "<form method=\"POST\" action=\"/Teacher/MyCourses/\" name=\"courses{$i}\" id=\"courses{$i}\"><input hidden name=\"institutionid\" id=\"institutionid\" value=\"$institution_ids[$i]\"><a href=\"#\" onClick=\"document.courses{$i}.submit();return false\">Courses</a></form>";
                 ?>
-                                <li><a href="/teacher/MyCourses/?in=<?=$institution_ids[$i]?>"><?=$inst?></a></li>  
                                   <?php
-                    $i += 1;
-            }
-                   ?>             
+                    echo "<form method=\"POST\" action=\"/Teacher/MyStudents/\" name=\"students{$i}\" id=\"students{$i}\">
+                    <input hidden name=\"institutionid\" id=\"institutionid\" value=\"$institution_ids[$i]\"><a href=\"#\" onClick=\"document.students{$i}.submit();return false\">Students</a></form>";
+                ?>
+                                      
+                                  </li>
                               </ul>
                             </li>
+                            <?php
+                $i += 1;
+            }
+                            ?>
                             <li>
-                                <a href="/teacher/Archive/">Archive</a>
+                                <a href="/teacher/Archive/Students/">Archive</a>
                                 
                             </li>
                             <li>
@@ -161,12 +276,19 @@
                                         <a href="/Corpus/Search/">Search</a></li>
                                 </ul>
                             </li>
+                            <li class="nav-divider"></li>
+                            <li>
+                                <a href="#">Change Password</a>
+                            </li>
+                            <li>
+                                <a href="/Logout.php">Logout</a>
+                            </li>
                             
                         </ul>
                     </nav>
                     <!-- /#page-content-wrapper -->
                 </div>
-                <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+                <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
                 <!-- Include all compiled plugins (below), or include individual files as needed -->
                 <script src="js/bootstrap.min.js"></script>
                 <script src="js/SidebarPractice.js"></script>
@@ -194,27 +316,93 @@
                     <nav class="navbar navbar-inverse navbar-fixed-top" id="sidebar-wrapper" role="navigation">
                         <ul class="nav sidebar-nav">
                             <li class="sidebar-brand">
-                                <a href="/student/home/">Student Home</a>
+                                <a href="/student/home/">Home</a>
+                            </li>
+                            <li class="dropdown">
+                                <a class="dropdown-toggle" data-toggle="dropdown"><?=$_SESSION['Username']?><span class="caret"></span></a>
+                                <?php
+                if ($NumRoles == 1)
+                {
+                    ?>
+                                <ul class="dropdown-menu" role="menu">
+                                    
+                                    <li><a>Role: Student</a>
+                                    <a>School: Gonzaga</a></li>
+                                </ul>
+                                <?php
+                }
+                else
+                {
+                    ?>
+                                <ul class="dropdown-menu" role="menu">
+<!--
+                                    <li class="dropdown-header">My Roles:</li>
+-->
+                                    <li>
+                                    <?php
+                    $count=0;
+                    foreach($RolesList as $ListedRole)
+                    {
+                        if ($ListedRole == $_SESSION['Role'])
+                        {
+                            ?>
+                                        <strong><a><?=$ListedRole?> <small class="text-muted"><?=$Designations[$count]?></small></a></strong>
+                                        <?php
+                        }
+                        else
+                        {
+                            ?>
+                                        <a href="/ChangeRole.php?q=<?=$ListedRole?>&t=<?=$AccessPriv[$count]?>"><?=$ListedRole?> <small class="text-muted"><?=$Designations[$count]?></small></a>
+                                        <?php
+                        }
+                         $count++;   
+                        
+                    }?>
+                                    
+                                    </li>
+                                </ul>
+                    <?php
+                }?>
+                                
+                                
+                            
                             </li>
+                            <!--<li class="nav-divider"></li>
                             <li class="dropdown">
                                 <a href="/student/MyCourses/" class="dropdown-toggle" data-toggle="dropdown">My Courses<span class="caret"></span></a>
                                 <ul class="dropdown-menu" role="menu">
-                                    <li><a href="/student/MyCourses/ViewCourse/">   View Course</a>
+                                    <li>
+                                        <a href="/Student/MyCourses/">Courses Home</a>
+                                        <div class="nav-divider"></div>
+                                        <a href="/Student/MyCourses/ViewCourse/?cid=">Course 1</a>
+                                        <a href="/Student/MyCourses/ViewCourse/?cid=">Course 2</a>
+                                        <a href="/Student/MyCourses/ViewCourse/?cid=">Course 3</a>
                                     </li>
                                 </ul>
                             </li>
                             <li class="dropdown">
                                 <a href="/student/MyTeachers/" class="dropdown-toggle" data-toggle="dropdown">My Teachers<span class="caret"></span></a>
                                 <ul class="dropdown-menu" role="menu">
-                                    <li><a href="/student/MyTeachers/ViewTeacherProfile/">   View Teacher Profile</a></li>
+                                    <li>
+                                        <a href="/student/MyTeachers/">Teachers Home</a>
+                                        <div class="nav-divider"></div>
+                                        <a href="/student/MyTeachers/ViewTeacherProfile/">   Teacher 1</a>
+                                    <a href="/student/MyTeachers/ViewTeacherProfile/">Teacher 2</a>
+                                    <a href="/student/MyTeachers/ViewTeacherProfile/">Teacher 3</a></li>
                                 </ul>
-                            </li>
+                            </li>-->
+<!--
+                            <li><a href="#">Practice!</a></li>
+-->
+                            <li class="nav-divider"></li>
+                            <li><a href="#">Change Password</a></li>
+                            <li><a href="/Logout.php">Logout</a></li>
                         </ul>
                     </nav>
                     <!-- /#sidebar-wrapper -->
 
                 </div>
-                <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+                <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
                 <!-- Include all compiled plugins (below), or include individual files as needed -->
                 <script src="js/bootstrap.min.js"></script>
                 <script src="js/SidebarPractice.js"></script>
diff --git a/speechtest.html b/speechtest.html
index 2c89b61..a3f991d 100644
--- a/speechtest.html
+++ b/speechtest.html
@@ -18,7 +18,7 @@
     <title>
       Chrome Browser
     </title>
-    <link href="https://plus.google.com/100585555255542998765" rel="publisher">
+    <link href="//plus.google.com/100585555255542998765" rel="publisher">
     <link href="//www.google.com/images/icons/product/chrome-32.png" rel="icon" type="image/ico">
     <link href="//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&amp;subset=latin" rel=
     "stylesheet">
@@ -87,7 +87,7 @@
 a.c1 {font-weight: normal;}
     </style>
  
-    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script>
         $(function(){
             $("#header").load("header.html");
@@ -181,7 +181,7 @@
   window.___gcfg = { lang: 'en' };
   (function() {
     var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
-    po.src = 'https://apis.google.com/js/plusone.js';
+    po.src = '//apis.google.com/js/plusone.js';
     var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
   })();
 
diff --git a/sql/scripts.php b/sql/scripts.php
new file mode 100644
index 0000000..d2709f7
--- /dev/null
+++ b/sql/scripts.php
@@ -0,0 +1,107 @@
+<?php
+
+/* Table Aliases */
+$Aliases = [
+    "Teachers" => "T",
+    "Students" => "S",
+    "Administrators" => "A",
+    "SiteUsers" => "SU",
+    "RoleInstances" => "RI",
+    "Roles" => "R",
+    "TeachingInstances" => "TI",
+    "Expressions" => "E",
+    "Enrollment" => "En",
+    "Courses" => "TC",
+    "Class Names" => "CN",
+    "Worksheets" => "W",
+    "Session" => "S", 
+    "SessionNames" => "SN",
+    "Languages" => "L",
+    "Countries" => "C",
+];
+
+/* Column Names */
+$TeachersColumns = [
+    'TeacherID',
+    'FirstName', 
+    'LastName', 
+    'SiteUsername',
+    'RoleInstanceID',
+    'Email'
+];
+
+$StudentsColumns = [
+    'StudentID',
+    'FirstName',
+    'LastName',
+    'Email',
+    'EmailAlt',
+    'RoleInstanceID'  
+];
+    
+$AdministratorsColumns = [
+    'AdministratorID',
+    'FirstName',
+    'LastName',
+    'Email',
+    'RoleInstanceID'
+    
+];
+
+function getPage($stmt, $pageNum, $rowsPerPage)
+{
+        $offset = ($pageNum - 1) * $rowsPerPage;
+        $rows = array();
+        $i = 0;
+        while(($row = sqlsrv_fetch_array($stmt, 
+                                        SQLSRV_FETCH_NUMERIC,
+                                        SQLSRV_SCROLL_ABSOLUTE,
+                                        $offset + $i))
+              && $i < $rowsPerPage)
+        {
+            array_push($rows, $row);
+            $i++;
+        }
+        return $rows;
+}   
+
+/* TeacherInfo: Return Array of SELECTed column-values FROM table_list */
+function InsertQuery( $target_table, $insert_columns, $insert_values)
+{
+    $params = array();
+    foreach($insert_values as $val)
+        $params[] = $val;
+    
+    $options = array( "Scrollable" => 'static' );
+    
+    foreach($select_list as $column)
+    {
+        $
+    }
+    
+    
+}
+
+/* Return User Role Information 
+
+
+*/
+function SelectSingular($source_tables, $select_tables, $select_columns, $filter_set)
+{
+    $params = array($username);
+    foreach($filter_set as $filter_var)
+        $params[] = $filter_var;
+    $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET );
+    $statement = "";
+}
+
+function SelectMultiple($source_tables, $select_tables, $select_columns, $filter_set)
+{
+    $params = array($username);
+    foreach($filter_set as $filter_var)
+        $params[] = $filter_var;
+    $options = array( "Scrollable" => 'static' );
+    $statement = "";
+}
+?>
+
diff --git a/student/Archive/Courses/index.php b/student/Archive/Courses/index.php
deleted file mode 100644
index 1d82f49..0000000
--- a/student/Archive/Courses/index.php
+++ /dev/null
@@ -1,106 +0,0 @@
-<!-- Archive Courses (index.html) for Student account -->
-<?php include "../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-
-    <!-- Including Header -->
-    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-        
- <?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Student')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-?>        
-       
-<body>
-    <div id="header"></div>
-    <div id="wrapper">
-        <div id="sidebar"></div>
-        <div id="page-content-wrapper">
-            <div class="container-fluid">
-                <div class="row">
-                    <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                        <!-- BEGIN PAGE CONTENT -->
-                        <h2>Search Courses</h2>
-                        <p>Archive (search courses) access for student user.  Provides a window with search functionality for searching all non-active courses for a given student ID. </p>
-        
-                        <!-- END PAGE CONTENT -->
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-    <!-- Include all compiled plugins (below), or include individual files as needed -->
-    <script src="/js/bootstrap.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-    $("#menu-toggle").click(function(e) {
-        e.preventDefault();
-        $("#wrapper").toggleClass("toggled");
-    });
-    </script>
-</body>
-    <?php
-    }
-}
-    
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-</html>
diff --git a/student/Archive/Expressions/index.php b/student/Archive/Expressions/index.php
deleted file mode 100644
index ecd56db..0000000
--- a/student/Archive/Expressions/index.php
+++ /dev/null
@@ -1,106 +0,0 @@
-<!-- Archive Home (index.html) for Student account -->
-<?php include "../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-    
-    <!-- Including Header -->
-    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-        
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Student')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-?>        
-
-<body>
-    <div id="header"></div>
-    <div id="wrapper">
-        <div id="sidebar"></div>
-        <div id="page-content-wrapper">
-            <div class="container-fluid">
-                <div class="row">
-                    <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                                    <span class="hamb-top"></span>
-                                    <span class="hamb-middle"></span>
-                                    <span class="hamb-bottom"></span>
-                                </button>
-                        <!-- BEGIN PAGE CONTENT -->
-                        <h2>Search Expressions</h2>
-                        <p>Archive (search expressions) access for student user.  Provides a window with search functionality for searching all previously entered expressions for a given student ID. </p>
-        
-                        <!-- END PAGE CONTENT -->
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-    <!-- Include all compiled plugins (below), or include individual files as needed -->
-    <script src="/js/bootstrap.min.js"></script>
-    <script src="/js/bootstrap-datepicker.js"></script>
-    <script>
-    $("#menu-toggle").click(function(e) {
-        e.preventDefault();
-        $("#wrapper").toggleClass("toggled");
-    });
-    </script>
-</body>
-    <?php
-    }
-}
-    
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-</html>
diff --git a/student/Archive/Worksheets/index.php b/student/Archive/Worksheets/index.php
deleted file mode 100644
index 5e76dea..0000000
--- a/student/Archive/Worksheets/index.php
+++ /dev/null
@@ -1,106 +0,0 @@
-<!-- Archive: Search Worksheets (index.html) for Student account -->
-<?php include "../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-    
-    <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-        
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Student')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-?>        
-
-<body>
-    <div id="header"></div>
-    <div id="wrapper">
-        <div id="sidebar"></div>
-        <div id="page-content-wrapper">
-            <div class="container-fluid">
-                <div class="row">
-                    <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                                    <span class="hamb-top"></span>
-                                    <span class="hamb-middle"></span>
-                                    <span class="hamb-bottom"></span>
-                                </button>
-                        <!-- BEGIN PAGE CONTENT -->
-                        <h2>Search Worksheets</h2>
-                        <p>Archive (search worksheets) access for student user.  Provides a window with search functionality for searching all previously submitted worksheets for a given student ID. </p>
-        
-                        <!-- END PAGE CONTENT -->
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-    <!-- Include all compiled plugins (below), or include individual files as needed -->
-    <script src="/js/bootstrap.min.js"></script>
-    <script src="/js/bootstrap-datepicker.js"></script>
-    <script>
-    $("#menu-toggle").click(function(e) {
-        e.preventDefault();
-        $("#wrapper").toggleClass("toggled");
-    });
-    </script>
-</body>
-    <?php
-    }
-}
-    
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-</html>
diff --git a/student/Archive/index.php b/student/Archive/index.php
deleted file mode 100644
index 7019c33..0000000
--- a/student/Archive/index.php
+++ /dev/null
@@ -1,105 +0,0 @@
-<!-- Archive Home (index.html) for Student account -->
-<?php include "../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-    
-    <!-- Including Header -->
-    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-        
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Student')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-?>
-
-<body>
-    <div id="header"></div>
-    <div id="wrapper">
-        <div id="sidebar"></div>
-        <div id="page-content-wrapper">
-            <div class="container-fluid">
-                <div class="row">
-                    <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                        <!-- BEGIN PAGE CONTENT -->
-                        <h2>Student Name: Archive</h2>
-                        <p>Archive access home for student user.  Through this page, the student will be able to view all non-active courses, and therefore review his/her progress.  Links will be provided in the Archive Sidebar for navigation to different sections of the Archive, including courses, worksheets, and expressions (search functionality included in each)  </p>
-        
-                        <!-- END PAGE CONTENT -->
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-    <!-- Include all compiled plugins (below), or include individual files as needed -->
-    <script src="/js/bootstrap.min.js"></script>
-    <script>
-    $("#menu-toggle").click(function(e) {
-        e.preventDefault();
-        $("#wrapper").toggleClass("toggled");
-    });
-    </script>
-</body>
-    <?php
-    }
-}
-    
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-</html>
\ No newline at end of file
diff --git a/student/MyCourses/ViewCourse/EditWorksheet/index.php b/student/MyCourses/ViewCourse/EditWorksheet/index.php
deleted file mode 100644
index 41ba7c4..0000000
--- a/student/MyCourses/ViewCourse/EditWorksheet/index.php
+++ /dev/null
@@ -1,110 +0,0 @@
-<!-- Edit Worksheet page (index.html) for Student account -->
-<?php include "../../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-    
-    <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-        
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Student')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-?>
-
-<body>
-    <div id="header"></div>
-    <div id="wrapper">
-        <div id="sidebar"></div>
-        <div id="page-content-wrapper">
-            <div class="container-fluid">
-                <div class="row">
-                    <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                        <!-- BEGIN PAGE CONTENT -->
-                        <h2>Documentation:</h2>
-                        <audio controls>
-                            <source src="/media/testaudio.mp3" type="audio/mpeg">
-                        Your browser does not support the audio element
-                        </audio>
-                        <p>For the student, this will provide an editing window/form that the student will fill out.  The contents of this page will allow for text as well as audio data entry, and will eventually contain a speech to text module.  Students will be permitted to submit multiple versions of the assignment, and this tracking data will be both displayed in the window and entered in with each new submission</p>
-                        <p> Standard navbars</p>
-        
-                        <!-- END PAGE CONTENT -->
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-        <!-- Include all compiled plugins (below), or include individual files as needed -->
-        <script src="/js/bootstrap.min.js"></script>
-        <script>
-        $("#menu-toggle").click(function(e) {
-            e.preventDefault();
-            $("#wrapper").toggleClass("toggled");
-        });
-        </script>
-      </body>
-    <?php
-    }
-}
-    
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-</html>
\ No newline at end of file
diff --git a/student/MyCourses/ViewCourse/ViewWorksheet/index.php b/student/MyCourses/ViewCourse/ViewWorksheet/index.php
index 826e4b1..7f607ff 100644
--- a/student/MyCourses/ViewCourse/ViewWorksheet/index.php
+++ b/student/MyCourses/ViewCourse/ViewWorksheet/index.php
@@ -16,7 +16,7 @@
     <link href="/css/SidebarPractice.css" rel="stylesheet">
     
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -80,7 +80,7 @@
     </div>
 
     <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
     <!-- Include all compiled plugins (below), or include individual files as needed -->
     <script src="/js/bootstrap.min.js"></script>
     <script>
diff --git a/student/MyCourses/ViewCourse/WorksheetEditor/WriteCorrections.php b/student/MyCourses/ViewCourse/WorksheetEditor/WriteCorrections.php
new file mode 100644
index 0000000..3c7cc75
--- /dev/null
+++ b/student/MyCourses/ViewCourse/WorksheetEditor/WriteCorrections.php
@@ -0,0 +1,78 @@
+<?php
+include '../../../../base.php';
+
+if (isset($_POST['worksheetID']) && isset($_POST['expressionIDs']) && isset($_POST['correctedText']) && isset($_POST['enrollmentID']) && isset($_POST['isAltered']))
+{
+    $worksheetID = $_POST['worksheetID'];
+    $expressionIDs = $_POST['expressionIDs'];
+    $correctedText = $_POST['correctedText'];
+    $enrollmentID = $_POST['enrollmentID'];
+    $isAltered = $_POST['isAltered'];
+    
+    
+    $params = array($worksheetID, $enrollmentID);
+    $options = array("Scrollable" => 'static');
+    $getattemptnumberSQL = "SELECT count(AttemptNumber) 
+                         FROM StudentSubmissions 
+                         WHERE WorksheetID = ? AND EnrollmentID = ?";
+    $getattemptnumber = sqlsrv_query($con, $getattemptnumberSQL, $params, $options);
+    if ($getattemptnumber === false)
+        die(print_r(sqlsrv_errors(), true));
+    if (sqlsrv_fetch($getattemptnumber) === true)
+        $attemptNumber = sqlsrv_get_field($getattemptnumber, 0);
+    $attemptNumber = $attemptNumber + 1;
+
+/*
+     Write to student submissions 
+*/
+    $params = array($enrollmentID, $worksheetID, $attemptNumber);
+    $studentsubmissionsSQL = "INSERT INTO StudentSubmissions VALUES (?, ?, ?, 0, GETDATE())";
+    $studentsubmissions = sqlsrv_query($con, $studentsubmissionsSQL, $params, $options);
+    if ($studentsubmissions === false)
+        die(print_r(sqlsrv_errors(), true));
+
+    $getstudentsubmissionidSQL = "SELECT DISTINCT StudentSubmissionID FROM StudentSubmissions
+                            WHERE EnrollmentID = ? AND
+                                  WorksheetID = ? AND
+                                  AttemptNumber = ?";
+    $getstudentsubmissionid = sqlsrv_query($con, $getstudentsubmissionidSQL, $params, $options);
+    if ($getstudentsubmissionid === false)
+        die(print_r(sqlsrv_errors(), true));
+    while(sqlsrv_fetch($getstudentsubmissionid) === true)
+        $studentsubmissionid = sqlsrv_get_field($getstudentsubmissionid, 0);
+
+    
+    
+    
+    $studentattemptsSQL = "INSERT INTO StudentAttempts (ExpressionID, StudentSubmissionID, ReformulationText, AttemptNumber, completed) VALUES ";
+    $numExpressions = count($expressionIDs);
+    //echo "$numExpressions";
+    //echo "($expressionIDs[0], $studentsubmissionid, $correctedText[0])";
+    for($i = 0; $i < $numExpressions; $i++)
+    {
+        if ($i == $numExpressions - 1)
+        {
+            if ($isAltered[$i] == 1)
+                $studentattemptsSQL = $studentattemptsSQL . "($expressionIDs[$i], $studentsubmissionid, '$correctedText[$i]', $attemptNumber, 1)";
+            else
+                $studentattemptsSQL = substr($studentattemptsSQL, 0, strlen($studentattemptsSQL) - 2);
+        }
+        else
+        {
+            if ($isAltered[$i] == 1)
+                $studentattemptsSQL = $studentattemptsSQL . "($expressionIDs[$i], $studentsubmissionid, '$correctedText[$i]', $attemptNumber, 1), ";
+        }
+         //echo "$i"; 
+    }
+/*
+    echo "$studentattemptsSQL";
+*/
+    $studentattempts = sqlsrv_query($con, $studentattemptsSQL, $params, $options);
+    if ($studentattempts === false)
+        die(print_r(sqlsrv_errors(), true));
+}
+else
+{
+    echo "Data Error";
+}
+?>
\ No newline at end of file
diff --git a/student/MyCourses/ViewCourse/WorksheetEditor/index.php b/student/MyCourses/ViewCourse/WorksheetEditor/index.php
new file mode 100644
index 0000000..880ff0a
--- /dev/null
+++ b/student/MyCourses/ViewCourse/WorksheetEditor/index.php
@@ -0,0 +1,356 @@
+<!-- Edit Worksheet (index.php) for Student account -->
+
+<?php include "../../../../base.php"; ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.min.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+    
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script type="text/javascript" src="/js/dynamicRowStudent.js"></script>
+    <script type="text/javascript" src="/js/spin.js"></script>
+
+    <style>
+        .glyphicon:before {
+            visibility: visible;
+        }
+        .glyphicon.glyphicon-star-empty:checked:before {
+            content: "\e006";
+        }
+        input[type=checkbox].glyphicon{
+            visibility: hidden;
+
+        }
+        .mycontent-left {
+            border-right: 1px solid #333;
+        }
+    </style>
+    
+    <script>
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+    
+    <!-- Background Setup -->
+    <style>
+        .dropdown-backdrop {
+            position: static;
+        } 
+    </style>
+</head>
+        
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if($_SESSION['Role'] != 'Student')
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        $worksheetID = isset($_POST['worksheetID']) ? $_POST['worksheetID'] : 0;
+        $courseID = isset($_POST['courseID']) ? $_POST['courseID'] : 0;
+
+        if (($worksheetID == 0) || ($courseID == 0))
+            echo "<meta http-equiv='refresh' content='0;/' />";
+        
+        $params = array($worksheetID);
+        $options = array( "Scrollable" => 'static' );
+        $worksheetinfoSQL = "SELECT W.WorksheetNumber, CONVERT(VARCHAR(11), W.Date, 106), T.Topic
+                             FROM Worksheets W, Topics T
+                             WHERE W.WorksheetID = ? AND
+                                   T.TopicID = W.TopicID";
+        $worksheetinfo = sqlsrv_query($con, $worksheetinfoSQL, $params, $options);
+        if ($worksheetinfo === false)
+            die(print_r(sqlsrv_errors(), true));
+        if (sqlsrv_fetch($worksheetinfo) === true)
+        {
+            $worksheet_number = sqlsrv_get_field($worksheetinfo, 0);
+            $date = sqlsrv_get_field($worksheetinfo, 1);
+            $topic = sqlsrv_get_field($worksheetinfo, 2);
+        }
+        
+        $params = array($_SESSION['Username']);
+        $getenrollmentidSQL = "SELECT ER.EnrollmentID
+                                FROM Enrollment ER, Students S, SiteUsers SU
+                                WHERE SU.username = S.SiteUsername AND
+                                    ER.StudentID = S.StudentID AND
+                                    SU.username = ?";
+        $getenrollmentid = sqlsrv_query($con, $getenrollmentidSQL, $params, $options);
+        if ($getenrollmentid === false)
+            die(print_r(sqlsrv_errors(), true));
+        if(sqlsrv_fetch($getenrollmentid) === true)
+            $myEnrollmentID = sqlsrv_get_field($getenrollmentid, 0);
+        
+        $params = array($worksheetID, $myEnrollmentID);
+        $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+        $worksheetexpressionsSQL = "
+SELECT DISTINCT E.SentenceNumber, S.StudentID, S.FirstName, S.LastName, E.Expression, E.ExpressionID, E.AllDo
+FROM Expressions E, Students S, Enrollment ER, StudentSubmissions SS, StudentAttempts SA
+WHERE E.WorksheetID = ? AND
+      (E.AllDo = 1 OR E.EnrollmentID = ?) AND
+      ER.StudentID = E.StudentID AND
+      S.StudentID = ER.StudentID
+ORDER BY E.SentenceNumber";
+        $worksheetexpressions = sqlsrv_query($con, $worksheetexpressionsSQL, $params, $options);
+        if ($worksheetexpressions === false)
+            die(print_r(sqlsrv_errors(), true));
+        
+        $num_expressions = sqlsrv_num_rows($worksheetexpressions);
+        $new_expression_number = $num_expressions + 1;
+        $sent_numbers = [];
+        $student_expression_ids = [];
+        $first_names = [];
+        $last_names = [];
+        $expressions = [];
+        $ids = [];
+        $alldos = [];
+        $attempt_numbers = [];
+        
+        while(sqlsrv_fetch($worksheetexpressions) === true)
+        {
+            $sent_numbers[] = sqlsrv_get_field($worksheetexpressions, 0);
+            $student_expression_ids[] = sqlsrv_get_field($worksheetexpressions, 1);
+            $first_names[] = sqlsrv_get_field($worksheetexpressions,2);
+            $last_names[] = sqlsrv_get_field($worksheetexpressions, 3);
+            $expressions[] = sqlsrv_get_field($worksheetexpressions, 4);
+            $ids[] = sqlsrv_get_field($worksheetexpressions, 5);
+            $alldos[] = sqlsrv_get_field($worksheetexpressions, 6);
+            $attempt_numbers[] = sqlsrv_get_field($worksheetexpressions, 7);
+            $correctedExpr[] = "";
+        }
+        
+        $params = array($worksheetID, $myEnrollmentID);
+        $allcorrectionsSQL = "
+SELECT SA.ReformulationText, SA.AttemptNumber, SA.ExpressionID
+FROM StudentAttempts SA, StudentSubmissions SS
+WHERE SS.WorksheetID = ? AND
+	  SS.EnrollmentID = ? AND
+	  SA.StudentSubmissionID = SS.StudentSubmissionID";
+        $allcorrections = sqlsrv_query($con, $allcorrectionsSQL, $params, $options);
+        if ($allcorrections === false)
+            die(print_r(sqlsrv_errors(), true));
+        $all_reformulation_texts = [];
+        $all_reformulation_attempts = [];
+        $all_reformulation_exprIDs = [];
+        $num_all_reformulations = sqlsrv_num_rows($allcorrections);
+        while(sqlsrv_fetch($allcorrections) === true)
+        {
+            $all_reformulation_texts[] = sqlsrv_get_field($allcorrections, 0);
+            $all_reformulation_attempts[] = sqlsrv_get_field($allcorrections, 1);
+            $all_reformulation_exprIDs[] = sqlsrv_get_field($allcorrections, 2);
+        }
+        
+        /* Select among corrections for most recent */
+        
+        
+        for ($j = 0; $j < $num_expressions; $j++)
+        {
+            for ($i = 0; $i < $num_all_reformulations; $i++)
+            {
+                if (($ids[$j] == $all_reformulation_exprIDs[$i]))// && ($attempt_numbers[$j] == $all_reformulation_attempts[$i]))
+                {
+                    if ($all_reformulation_texts[$i] != 'n/a')
+                        $correctedExpr[$j] = $all_reformulation_texts[$i];
+                }
+                    
+            }
+        }
+                
+        $coursestudentsSQL = "SELECT ER.StudentID 
+                              FROM Enrollment as ER, Worksheets as W, Courses C 
+                              WHERE W.WorksheetID = ? AND
+                                    C.CourseID = W.CourseID AND
+                                    ER.CourseID = C.CourseID";
+        $coursestudents = sqlsrv_query($con, $coursestudentsSQL, $params, $options);
+        if ($coursestudents === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_students = sqlsrv_num_rows($coursestudents);
+        $studentsids = [];
+        while(sqlsrv_fetch($coursestudents) === true)
+            $studentsids[] = sqlsrv_get_field($coursestudents, 0);
+        
+        
+    ?>
+    
+<body>
+    <section class="container-fluid col-xs-12">                     
+        <!--body-->
+        <div id="wrapper">
+            <div id="sidebar"></div>
+            <div id="page-content-wrapper">
+                <div class="container-fluid">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                        <span class="hamb-top"></span>
+                        <span class="hamb-middle"></span>
+                        <span class="hamb-bottom"></span>
+                    </button>
+                    <!-- BEGIN PAGE CONTENT -->
+                    <div class="col-xs-12">
+                        <div class="row">
+                            
+                            <div class="col-md-12">
+                                <div class="row">
+                                    <div class="col-md-1" name="updatespinner">
+                                        
+                                    </div>
+                                    <div class="col-sm-4">
+                                        <strong>
+                                            <span>
+                                                Worksheet #<?=$worksheet_number?><br>
+                                                Date: <?=$date?><br>
+                                                Topic: <?=$topic?>
+                                            </span>
+                                        </strong>
+                                        
+                                    </div>
+                                    
+                                    <div class="col-md-1 pull-right">
+                                        <button class="btn btn-primary btn-lg pull-right" type="button" id="Update">Submit Worksheet</button>
+                                    </div>
+                                    
+                                </div>
+                                
+                            </div>
+                            
+                        </div>
+                        <hr>
+                        <div class="row">
+                            
+                            <div class="col-sm-8">
+                                <div class="panel panel-primary" style="max-height:600px;overflow-y:scroll">
+                                <div class="panel-heading">Worksheet Overview</div>
+                                    <div class="panel-body">
+<?php
+    echo "<div style=\"display:none\" id=\"WorksheetID\">$worksheetID</div>";
+    echo "<div style=\"display:none\" id=\"EnrollmentID\">$myEnrollmentID</div>";
+    echo "<div style=\"display:none\" id=\"NumExpressions\">$num_expressions</div>";
+    //echo "<div style=\"display:none\" id=\"ExpressionIDs\" value=\"$ids\"></div>";
+?>
+                                        <table class="table" id="myTable" >
+                                            <thead>
+                                                <tr>
+                                                    <th>Expression</th>
+                                                    <th>Correction</th>
+                                                    <th><span class="glyphicon glyphicon-arrow-right" style="font-size:20px;left:10px;"></span></th>
+                                                    <th>Assigned</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody name="ExpressionTable">
+<?php 
+        for($i = 0; $i < $num_expressions; $i++)
+        {
+            echo "<tr id=\"$i\">
+                      <td style=\"display:none\" value=\"Here is context\" name=\"context\"></td>
+                      <td style=\"display:none\" value=\"Here is pronunciation\" name=\"pronunciation\"></td>
+                      <td style=\"display:none\" name=\"number\" class=\"nr\">$sent_numbers[$i]</td>
+                      
+                      <td id=\"$ids[$i]\" name=\"expression\" class=\"expr\">$expressions[$i]</td>
+                      
+                      <td name=\"corrected\" class=\"corr\">$correctedExpr[$i]</td>
+                      <td>
+                        <button value=\"$i\" type=\"button\" name=\"Edit\" class=\"btn btn-primary\">Edit</button>
+                      </td>
+                      <td>";
+            if ($alldos[$i] == 1)
+                echo "All-Do";
+            else
+                echo "Mine";
+            echo "
+                </td>
+
+                </tr>";
+        }
+?>
+
+
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-sm-4">
+                                <div class="panel panel-primary" style="top-margin:40px;">
+                                    <div class="panel-heading" id="ExprHeading">Expression Edit Window
+                                        <span id="ExprID" class=""></span>
+                                    </div>
+                                    <div class="panel-body">
+                                        <strong>Original Expression:</strong>
+                                        <textarea disabled id="ExprToEdit" name="OriginalExpression" class="form-control" class="col-xs-12">Click an Edit Button to begin!
+                                        </textarea>
+                                        <input hidden id="expressionID"/>
+                                        <form role="form">
+                                            <div class="form-group">
+                                                <label for="CorrectedExpr">Correction:</label>
+                                                <input type="text" class="form-control" name="CorrectedExpr" id="CorrectedExpr" disabled placeholder="Enter the correct expression here" />
+                                                <!---->
+                                            </div>
+                                        </form>
+                                        <div class="row">
+                                            <div class="col-md-12">
+                                                <button type="button" name="Clear" class="btn btn-danger">Clear</button>
+                                                <button id="SubmitExpr" disabled type="button" class="btn btn-primary pull-right">Save</button>
+                                            </div>
+                                            
+                                        </div>
+                                                
+                                    </div>
+                                </div>
+                            </div>
+                            
+                        </div>
+                        
+                        
+                    </div>
+                    <!-- END PAGE CONTENT -->
+                </div>
+            </div>
+        </div>
+    </section>
+        
+    <script src="//code.jquery.com/jquery.js"></script>
+    <script src="/js/bootstrap.min.js"></script>
+    <script>
+    $('.dropdown-toggle').click(function(e) {
+        e.preventDefault();
+        setTimeout($.proxy(function() {
+            if ('ontouchstart' in document.documentElement) {
+                $(this).siblings('.dropdown-backdrop').off().remove();
+            }
+        }, this), 0);
+    });
+    </script>
+    </body>
+
+        
+    <?php
+    }
+}
+    
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+</html>
\ No newline at end of file
diff --git a/student/MyCourses/ViewCourse/WriteCorrections.php b/student/MyCourses/ViewCourse/WriteCorrections.php
new file mode 100644
index 0000000..0eadd05
--- /dev/null
+++ b/student/MyCourses/ViewCourse/WriteCorrections.php
@@ -0,0 +1,49 @@
+<?php
+include '../../../base.php';
+
+echo "Brian is drinking coffee";
+/*if (isset($_POST['worksheetID']) && isset($_POST['expressionIDs']) && isset($_POST['correctedText']) && isset($_POST['enrollmentID']) )
+{
+    $worksheetID = $_POST['worksheetID'];
+    $expressionIDs[] = $_POST['expressionIDs'];
+    $correctedText[] = $_POST['correctedText'];
+    $enrollmentID = $_POST['enrollmentID'];
+    $params = array($enrollmentID, $worksheetID);
+    $options = array("Scrollable" => 'static');
+    echo "FUCK OFF";
+
+    $studentsubmissionsSQL = "INSERT INTO StudentSubmissions (?, ?, 1, 0, GETDATE())";
+    $studentsubmissions = sqlsrv_query($con, $studentsubmissionsSQL, $params, $options);
+    if ($studentsubmissionsid === false)
+        die(print_r(sqlsrv_errors(), true));
+
+    $getstudentsubmissionidSQL = "SELECT StudentSubmissionID FROM StudentSubmissions
+                            WHERE EnrollmentID = ? AND
+                                  WorksheetID = ? AND
+                                  AttemptNumber = 1";
+    $getstudentsubmissionid = sqlsrv_query($con, $studentsubmissionidSQL, $params, $options);
+    if ($getstudentsubmissionid === false)
+        die(print_r(sqlsrv_errors(), true));
+    while(sqlsrv_fetch($getstudentsubmissionid) === true)
+        $studentsubmissionid = sqlsrv_get_field($getstudentsubmissionid, 0);
+
+    $studentattemptsSQL = "INSERT INTO StudentAttempts (ExpressionID, StudentSubmissionID, ReformulationText) VALUES ";
+    for($i = 0; $i < $expressionIDs.count(); $i++)
+    {
+        if ($i == $expressionIDs.count() - 1)
+        {
+            $studentattemptsSQL = $studentattemptsSQL . "($expressionIDs[$i], $studentsubmissionid, $correctedText[$i])";    
+        }
+
+        $studentattemptsSQL = $studentattemptsSQL . "($expressionIDs[$i], $studentsubmissionid, $correctedText[$i]), ";
+    }
+    echo "$studentattemptsSQL";
+    $studentattempts = sqlsrv_query($con, $studentattemptsSQL, $params, $options);
+    if ($studentattempts === false)
+        die(print_r(sqlsrv_errors(), true));
+}
+else
+{
+    echo "Data Error";
+}*/
+?>
\ No newline at end of file
diff --git a/student/MyCourses/ViewCourse/index.php b/student/MyCourses/ViewCourse/index.php
index e6f27ec..ed68ca2 100644
--- a/student/MyCourses/ViewCourse/index.php
+++ b/student/MyCourses/ViewCourse/index.php
@@ -14,9 +14,10 @@
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
     
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -27,16 +28,7 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
+
 </head>
         
  <?php
@@ -52,26 +44,134 @@
     }
     else
     {
+    $courseID = isset($_POST['courseID']) ? $_POST['courseID'] : 0;
+    if ($courseID == 0)
+            echo "<meta http-equiv='refresh' content='10;../' />";
 ?>       
 
 <body>
-    <div id="header"></div>
     <div id="wrapper">
         <div id="sidebar"></div>
         <div id="page-content-wrapper">
-            <div class="container-fluid">
-                <div class="row">
-                    <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+            <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                             <span class="hamb-top"></span>
                             <span class="hamb-middle"></span>
                             <span class="hamb-bottom"></span>
                         </button>
-                        <!-- BEGIN PAGE CONTENT -->
-                        <h2>Course Name</h2>
-                        <p>Course "home page" which contains the same basic information as Teacher/MyCourses/ViewCourse/.  This page will provide links to course worksheets, general course information, and a link to the teacher's profile page.  </p>
-                        <p>Standard Student sidebar, standard header bar</p>
-                        <!-- END PAGE CONTENT -->
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-lg-3">
+                        <div class="panel panel-primary">
+                            <div class="panel-heading">
+                                <h3>Course Info</h3>
+                            </div>
+                            <div class="panel-body">
+                                <p>Course Number: ELCT 101</p>
+                                <p>Course Title: Basic Oral Communication</p>
+                                <p>Session: Fall II 2015</p>
+                                <p>Teacher: Hunter</p>
+                            </div>
+                            
+                        </div>
+                    </div>
+                    <!--<div class="col-lg-6">
+                        <div class="panel panel-primary" style="min-height: 300px;max-height: 300px; ">
+                            <div class="panel-heading">
+                                <h3>Course Activity</h3>
+                            </div>
+                            <div class="panel-body">
+                                <table class="table table-hover">
+                                    <thead>
+                                        <tr>
+                                            <th>Date</th>
+                                            <th>Type</th>
+                                            <th>Status</th>
+                                            <th>Go To</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr>
+                                            <td>1/3/2016</td>
+                                            <td>New Worksheet</td>
+                                            <td>Not yet viewed</td>
+                                            <td><a href="#">View Worksheet</a></td>
+                                        </tr>
+                                        <tr>
+                                            <td>1/10/2016</td>
+                                            <td>Feedback posted</td>
+                                            <td>Viewed</td>
+                                            <td><a href="#">View Feedback</a></td>
+                                        </tr>
+                                    </tbody>
+                                </table>
+                            </div>
+                            
+                        </div>-->
+                    </div>
+                    
+                </div>
+                <div class="row">
+                    <div class="col-lg-9">
+                        <div class="panel panel-primary">
+                            <div class="panel-heading">
+                                <h4>Worksheets</h4>
+                            </div>
+                            <div class="panel-body">
+                                <table class="table table-hover">
+                                    <thead>
+                                        <tr>
+                                            <th>#</th>
+                                            <th>Date</th>
+                                            <th>Topic</th>
+                                            <th>Status</th>
+                                            <th>Feedback</th>
+                                            <th>Open Editor</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+        <?php
+            $params = array($_SESSION['Username'], $courseID);
+            $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+            $studentworksheetsSQL = "SELECT W. WorksheetNumber, CONVERT(VARCHAR(11), W.Date,106), T.Topic, W.WorksheetID
+                                        FROM Worksheets W, Topics T, Courses C, Enrollment ER, Students S
+                                        WHERE S.SiteUsername = ? AND
+                                              ER.StudentID = S.StudentID AND
+                                              W.CourseID = ER.CourseID AND
+                                              W.EditStatus = 'Released' AND
+                                              W.IsDeleted = 0 AND
+											  C.CourseID = ? AND
+                                              T.TopicID = W.TopicID";
+                $studentworksheets = sqlsrv_query($con, $studentworksheetsSQL, $params, $options);
+                if ($studentworksheets === false)
+                                            die(print_r(sqlsrv_errors(), true));
+                                        $num_worksheets = sqlsrv_num_rows($studentworksheets);
+
+                                        $worksheetIDs = [];
+                                        $worksheet_numbers = [];
+                                        $dates = [];
+                                        $topics = [];
+                                        while(sqlsrv_fetch($studentworksheets) === true)
+                                        {
+                                            $worksheet_numbers[] = sqlsrv_get_field($studentworksheets, 0);
+                                            $dates[] = sqlsrv_get_field($studentworksheets, 1);
+                                            $topics[] = sqlsrv_get_field($studentworksheets, 2);
+                                            $worksheetIDs[] = sqlsrv_get_field($studentworksheets, 3);
+                                        }
+            for($i = 0; $i < $num_worksheets; $i++)
+        {
+            echo "<tr>";
+            echo "<td>$worksheet_numbers[$i]</td>";
+            echo "<td>$dates[$i]</td>";
+            echo "<td>$topics[$i]</td>";
+            echo "<td>-</td>";
+            echo "<td>-</td>";
+            echo "<td><form method=\"POST\" action=\"WorksheetEditor/\" name=\"WorksheetEditor\"><input hidden type=\"text\" name=\"worksheetID\" value=\"$worksheetIDs[$i]\"><input hidden type=\"text\" value=\"$courseID\" name =\"courseID\"><button class=\"btn btn-primary\">Edit Worksheet</button></form></td></tr>";
+        }
+        ?>
+                                    </tbody>
+                                </table>
+                            </div>
+                        </div>
                     </div>
                 </div>
             </div>
@@ -79,7 +179,7 @@
     </div>
 
     <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
     <!-- Include all compiled plugins (below), or include individual files as needed -->
     <script src="/js/bootstrap.min.js"></script>
     <script>
@@ -92,7 +192,7 @@
     <?php
     }
 }
-    
+
 else
 {
     ?>
diff --git a/student/MyCourses/index.php b/student/MyCourses/index.php
index bb2c987..120a8b6 100644
--- a/student/MyCourses/index.php
+++ b/student/MyCourses/index.php
@@ -14,9 +14,10 @@
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
     
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -27,16 +28,7 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
+    
 </head>
         
 <?php
@@ -55,23 +47,90 @@
 ?>        
 
 <body>
-    <div id="header"></div>
     <div id="wrapper">
         <div id="sidebar"></div>
         <div id="page-content-wrapper">
-            <div class="container-fluid">
-                <div class="row">
-                    <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+            <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                             <span class="hamb-top"></span>
                             <span class="hamb-middle"></span>
                             <span class="hamb-bottom"></span>
                         </button>
-                        <!-- BEGIN PAGE CONTENT -->
-                        <h2>Courses</h2>
-                <p>For the student user, this page displays a list of links to a course page, each link containing the name/ID of the course.  These courses are pulled by a SQL query that retrieves all active, enrolled courses of the student user name, which is accessed from the session data  </p>
-                <p>Standard Student sidebar, standard header bar</p>
-                        <!-- END PAGE CONTENT -->
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-lg-8 col-xs-12 col-md-8">
+                        <div class="panel panel-primary">
+                            <div class="panel-heading">
+                                <h3>Courses</h3>
+                            </div>
+                            <div class="panel-body">
+                                <table class="table table-hover">
+                                    <thead>
+                                        <tr>
+                                            <th>Course Number</th>
+                                            <th>Course Name</th>
+                                            <th>Session Name</th>
+                                            <th>Teacher</th>
+                                            <th>Visit Course Page</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+<?php
+        $params = array($_SESSION['Username']);
+        $options = array( "Scrollable" => 'static' );
+        $coursesSQL = "SELECT CT.CourseName, CT.CourseTypeName, ST.SessionName, SI.Year, T.FirstName, T.LastName, C.CourseID
+                       FROM CourseTypes CT, SessionType ST, SessionInstance SI, Students S, Courses C, Enrollment ER, Teachers T, TeachingInstance TI
+                       WHERE S.SiteUsername = ? AND
+                             ER.StudentID = S.StudentID AND
+                             C.CourseID = ER.CourseID AND
+                             C.TeachingInstanceID = TI.TeachingInstanceID AND
+                             TI.TeacherID = T.TeacherID AND
+                             SI.SessionInstanceID = C.SessionInstanceID AND
+                             ST.SessionTypeID = SI.SessionTypeID AND
+                             CT.CourseTypesID = C.CourseTypesID";
+        $courses = sqlsrv_query($con, $coursesSQL, $params, $options);
+        if ($courses === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_courses = sqlsrv_num_rows($courses);
+        $course_numbers = [];
+        $course_names = [];
+        $session_names = [];
+        $years = [];
+        $teacher_firstnames = [];
+        $teacher_lastnames = [];
+        $course_ids = [];
+        while(sqlsrv_fetch($courses) === true)
+        {
+            $course_numbers[] = sqlsrv_get_field($courses, 0);
+            $course_names[] = sqlsrv_get_field($courses, 1);
+            $session_names[] = sqlsrv_get_field($courses, 2);
+            $years[] = sqlsrv_get_field($courses, 3);
+            $teacher_firstnames[] = sqlsrv_get_field($courses, 4);
+            $teacher_lastnames[] = sqlsrv_get_field($courses, 5);
+            $course_ids[] = sqlsrv_get_field($courses, 6);
+        }
+        for ($i = 0; $i < $num_courses; $i++)
+        {
+            echo "<tr><td>$course_numbers[$i]</td>
+                      <td>$course_names[$i]</td>
+                      <td>$session_names[$i] $years[$i]</td>
+                      <td>$teacher_firstnames[$i] $teacher_lastnames[$i]</td>
+                      <td><form method=\"POST\" action=\"ViewCourse/\" name=\"courseid{$i}\">
+                            <input hidden type=\"text\" name=\"courseID\" value=\"$course_ids[$i]\">
+                            <button class=\"btn btn-primary\">View Course</button>
+                          </form>
+                      </td>
+                    </tr>";
+        }
+?>
+        
+                                    </tbody>
+                                </table>
+                            </div>
+                        
+                        </div>   
+                        
+                    
+                
                     </div>
                 </div>
             </div>
@@ -79,7 +138,7 @@
     </div>
 
     <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
     <!-- Include all compiled plugins (below), or include individual files as needed -->
     <script src="/js/bootstrap.min.js"></script>
     <script>
diff --git a/student/MyTeachers/ViewTeacher/index.php b/student/MyTeachers/ViewTeacher/index.php
new file mode 100644
index 0000000..8932c9c
--- /dev/null
+++ b/student/MyTeachers/ViewTeacher/index.php
@@ -0,0 +1,141 @@
+<!-- View Teacher Profile page (index.html) for Student account -->
+<?php include "../../../base.php"; ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
+    
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+  
+</head>
+        
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if($_SESSION['Role'] != 'Student')
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+?>
+
+<body>
+    <div id="wrapper">
+        <div id="sidebar"></div>
+        <div id="page-content-wrapper">
+            <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                            <span class="hamb-top"></span>
+                            <span class="hamb-middle"></span>
+                            <span class="hamb-bottom"></span>
+                        </button>
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-lg-9">
+                        <div class="panel panel-primary">
+                            <div class="panel-heading">
+                                <h4>Teacher Info</h4>
+                            </div>
+                            <div class="panel-body">
+                                <p>Name:</p>
+                                <p>Institution(s):</p>
+                                <p>Active with Smalltalk:</p>
+                            </div>
+                        </div>
+                        
+                    </div>
+                    <div class="col-lg-9">
+                        <div class="panel panel-primary">
+                            <div class="panel-heading">
+                                <h4>Recent Courses</h4>
+                            </div>
+                            <div class="panel-body">
+                                <table class="table table-hover">
+                                    <thead>
+                                        <tr>
+                                            <th>Institution</th>
+                                            <th>Course Number</th>
+                                            <th>Course Name</th>
+                                            <th>Session</th>
+                                            <th>Course Page</th> 
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr>
+                                            <td>Gonzaga University</td>
+                                            <td>ELCT 106</td>
+                                            <td>Advanced Oral Communication</td>
+                                            <td>Summer II 2013</td>
+                                            <td><a href="/Student/MyCourses/ViewCourse/">Visit Course Page</a></td>
+                                        </tr>
+                                        <tr>
+                                            <td>Gonzaga University</td>
+                                            <td>ELCT 105</td>
+                                            <td>Advanced Oral Communication</td>
+                                            <td>Summer I 2013</td>
+                                            <td>Not Enrolled</td>
+                                        </tr>
+                                        
+                                    </tbody>
+                                </table>
+                            </div>
+                        </div>
+                        
+                        
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+    <!-- Include all compiled plugins (below), or include individual files as needed -->
+    <script src="/js/bootstrap.min.js"></script>
+    <script>
+    $("#menu-toggle").click(function(e) {
+        e.preventDefault();
+        $("#wrapper").toggleClass("toggled");
+    });
+    </script>
+</body>
+    <?php
+    }
+}
+    
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+</html>
\ No newline at end of file
diff --git a/student/MyTeachers/ViewTeacherProfile/index.php b/student/MyTeachers/ViewTeacherProfile/index.php
deleted file mode 100644
index df42281..0000000
--- a/student/MyTeachers/ViewTeacherProfile/index.php
+++ /dev/null
@@ -1,106 +0,0 @@
-<!-- View Teacher Profile page (index.html) for Student account -->
-<?php include "../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-    
-    <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-        
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Student')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-?>
-
-<body>
-    <div id="header"></div>
-    <div id="wrapper">
-        <div id="sidebar"></div>
-        <div id="page-content-wrapper">
-            <div class="container-fluid">
-                <div class="row">
-                    <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                        <!-- BEGIN PAGE CONTENT -->
-                        <h2>Documentation:</h2>
-                        <p>For the student user, this page will provide a viewable profile for a given teacher, displaying scheduling, office hours, contact information, and active courses</p>
-                        <p>Standard student navbars</p>
-        
-                        <!-- END PAGE CONTENT -->
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-    <!-- Include all compiled plugins (below), or include individual files as needed -->
-    <script src="/js/bootstrap.min.js"></script>
-    <script>
-    $("#menu-toggle").click(function(e) {
-        e.preventDefault();
-        $("#wrapper").toggleClass("toggled");
-    });
-    </script>
-</body>
-    <?php
-    }
-}
-    
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-</html>
\ No newline at end of file
diff --git a/student/MyTeachers/index.php b/student/MyTeachers/index.php
index b4a3bbf..0541381 100644
--- a/student/MyTeachers/index.php
+++ b/student/MyTeachers/index.php
@@ -14,9 +14,10 @@
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
     
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -27,16 +28,7 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
+    
 </head>
         
 <?php
@@ -55,24 +47,46 @@
 ?>
 
 <body>
-    <div id="header"></div>
     <div id="wrapper">
         <div id="sidebar"></div>
         <div id="page-content-wrapper">
-            <div class="container-fluid">
-                <div class="row">
-                    <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+            <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
                             <span class="hamb-top"></span>
                             <span class="hamb-middle"></span>
                             <span class="hamb-bottom"></span>
                         </button>
-                        <!-- BEGIN PAGE CONTENT -->
-                        <h2>Documentation:</h2>
-                        <p>This page has lesser priority.  This will provide students a review of teachers that the student is with at the time.  More importantly, this will provide the path for looking at ViewTeacherProfile, which will be necessary for student features</p>
-                        <p>standard student navbars</p>
-        
-                        <!-- END PAGE CONTENT -->
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-lg-6">
+                        <div class="panel panel-primary" style="min-height: 450px;max-height: 450px;">
+                            <div class="panel-heading">
+                                <h3>Teachers</h3>
+                            </div>
+                            <div class="panel-body">
+                                <table class="table table-hover">
+                                    <thead>
+                                        <tr>
+                                            <th>Teacher Name</th>
+                                            <th>Status</th>
+                                            <th>Visit Page</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr>
+                                            <td>Bob Loblaw</td>
+                                            <td>Active</td>
+                                            <td><a href="ViewTeacher/">View Teacher</a></td>
+                                        </tr>
+                                        <tr>
+                                            <td>Not Bob</td>
+                                            <td>Previous</td>
+                                            <td><a href="ViewTeacher">View Teacher</a></td>
+                                        </tr>
+                                    </tbody>
+                                </table>
+                            </div>
+                        </div>
+                        
                     </div>
                 </div>
             </div>
@@ -80,7 +94,7 @@
     </div>
 
     <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
     <!-- Include all compiled plugins (below), or include individual files as needed -->
     <script src="/js/bootstrap.min.js"></script>
     <script>
diff --git a/student/home/Profile/index.php b/student/home/Profile/index.php
deleted file mode 100644
index a250ded..0000000
--- a/student/home/Profile/index.php
+++ /dev/null
@@ -1,107 +0,0 @@
-<!-- Profile Page (index.html) for Student account -->
-<?php include "../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-    
-    <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-    
-     <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Student')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-?>
-    
-<body>
-    <div id="header"></div>
-    <div id="wrapper">
-        <div id="sidebar"></div>
-        <div id="page-content-wrapper">
-            <div class="container-fluid">
-                <div class="row">
-                    <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                        <!-- BEGIN PAGE CONTENT -->
-                        <h2>Documentation:</h2>
-                        <p>Page will provide the student user the ability to review one's own profile.  In the first form, this will include contact information and active courses.  In the advanced form, this will include progress track and graphical representation of progress.</p>
-                        <p>Standard student sidebar</p>
-                        <p>Standard header navigation bar</p>
-        
-                        <!-- END PAGE CONTENT -->
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-    <!-- Include all compiled plugins (below), or include individual files as needed -->
-    <script src="/js/bootstrap.min.js"></script>
-    <script>
-    $("#menu-toggle").click(function(e) {
-        e.preventDefault();
-        $("#wrapper").toggleClass("toggled");
-    });
-    </script>
-</body>
-    <?php
-    }
-}
-    
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-</html>
\ No newline at end of file
diff --git a/student/home/index.php b/student/home/index.php
index 69b542f..b4abb97 100644
--- a/student/home/index.php
+++ b/student/home/index.php
@@ -14,9 +14,11 @@
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
     <link href="/css/SidebarPractice.css" rel="stylesheet">
-    
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
+
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -26,17 +28,6 @@
             $("#sidebar").load("/sidebar.php");
         });
     </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
         
 <?php
@@ -51,36 +42,170 @@
         <?php
     }
     else
-    {
-    ?>        
+    { $username = $_SESSION['Username'];
+        $role = $_SESSION['Role'];
+        $params = array( $username, $role);
+        $options = array( "Scrollable" => 'static' );
+        $UserInfoQuery = "
+        SELECT R.Designation, I.InstitutionName
+        FROM RoleInstances as RI, Roles as R, Institutions as I, Students as S
+        WHERE  RI.SiteUsername = ? AND
+	           R.RoleID = RI.RoleID AND
+		       R.Role = ? AND
+		       I.InstitutionID = S.InstitutionID";
+        $stmt = sqlsrv_query($con, $UserInfoQuery, $params, $options);
+        if ( $stmt === false)
+            die( print_r( sqlsrv_errors(), true));
+        $Designation = "";
+        $Institution = "";
+        if ( sqlsrv_fetch( $stmt ) === true)
+        {
+            $Designation = sqlsrv_get_field( $stmt, 0);
+            $Institution = sqlsrv_get_field( $stmt, 1);
+        }
+        ?>
+        <body>
+<!--
+            <div id="header"></div>           
+-->
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                        <span class="hamb-top"></span>
+                        <span class="hamb-middle"></span>
+                        <span class="hamb-bottom"></span>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
+                                <div class="panel panel-default">
+                                    <div class="panel-heading">
+                                        <h1>Student Home</h1>
+                                    </div>
+                                    <div class="panel-body">
+                                        <p><?=$_SESSION['FirstName']?> <?=$_SESSION['LastName']?></p>
+                                        <p>Role:  Student <small class="text-muted"><?=$Designation?></small></p>
+                                        <p>Institution: <?=$Institution?></p>
+                                    </div>
+                                </div> 
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-md-10">
+                                <div class="panel panel-default">
+                                    <div class="panel-heading">
+                                        <h4>My Courses</h4>
+                                    </div>
+                                    <div class="panel-body" style="min-height: 146px; max-height: 146px;">
+                                        <table class="table table-hover" data-link="row">
+                                            <thead>
+                                                <tr>
+                                                    <th>Course Name</th>
+                                                    <th>Teacher</th>
+                                                    <th>Session</th> 
+                                                    <th>Go To</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+<?php
+     $params = array($_SESSION['Username']);
+     $options = array( "Scrollable" => 'static' );
+     $coursesSQL = "SELECT C.CourseID, CT.Level, T.FirstName, T.LastName, ST.SessionName, SI.Year
+                    FROM Courses C, CourseTypes CT, TeachingInstance TI, Teachers T, SessionType ST, SessionInstance SI, Enrollment ER, Students S
+                    WHERE S.SiteUsername = ? AND
+                          ER.StudentID = S.StudentID AND
+                          C.CourseID = ER.CourseID AND
+                          CT.CourseTypesID = C.CourseTypesID AND
+                          TI.TeachingInstanceID = C.TeachingInstanceID AND
+                          T.TeacherID = TI.TeacherID AND
+                          SI.SessionInstanceID = C.SessionInstanceID AND
+                          ST.SessionTypeID = SI.SessionTypeID";
+     $courses = sqlsrv_query($con, $coursesSQL, $params, $options);
+     if ($courses === false)
+         die(print_r(sqlsrv_errors(), true));
+     $course_ids = [];
+     $course_levels = [];
+     $teacher_firstnames = [];
+     $teacher_lastnames = [];
+     $session_names = [];
+     $years = [];
+     
+     $num_courses = sqlsrv_num_rows($courses);
+     while (sqlsrv_fetch($courses) === true)
+     {
+         $course_ids[] = sqlsrv_get_field($courses, 0);
+         $course_levels[] = sqlsrv_get_field($courses, 1);
+         $teacher_firstnames[] = sqlsrv_get_field($courses, 2);
+         $teacher_lastnames[] = sqlsrv_get_field($courses, 3);
+         $session_names[] = sqlsrv_get_field($courses, 4);
 
-    <body>
-        <div id="header"></div>
-        <div id="wrapper">
-            <div id = "sidebar"></div>
-            <div id="page-content-wrapper">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-lg-12">
-                            <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                                <span class="hamb-top"></span>
-                                <span class="hamb-middle"></span>
-                                <span class="hamb-bottom"></span>
-                            </button>
-                            <!-- BEGIN PAGE CONTENT -->
-                            <h1><?=$_SESSION['FirstName']?> <?=$_SESSION['LastName']?></h1>
-                            <p>Page provides student user home.  Eventual content will be a site activity queue, listing all relevant course postings by teachers.  </p>
-                            <p>Sidebar will include student navigation: Home, Courses {Worksheets}, My Archive {courses {worksheets}}</p>
-                            <p>Nav bar will include basic account access (same regardless of role)</p>
-                            <!-- END PAGE CONTENT -->
+         $years[] = sqlsrv_get_field($courses, 5);
+     }
+     for ($i = 0; $i < $num_courses; $i++)
+     {
+         echo "<tr><td>$course_levels[$i]</td>
+                   <td>$teacher_firstnames[$i] $teacher_lastnames[$i]</td>
+                   <td>$session_names[$i] $years[$i]</td>
+                   <td><form method=\"POST\" action=\"/Student/MyCourses/ViewCourse/\" name=\"course{$i}\">
+                         <input hidden type=\"text\" name=\"courseID\" value=\"$course_ids[$i]\">
+                         <button class=\"btn btn-primary\">Course Page</button>
+                       </form>
+                    </td>
+                </tr>";
+    
+     }
+     ?>
+     
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                            
                         </div>
+                        <!--<div class="row">
+                            <div class="col-lg-8 col-md-8 col-sm-12">
+                                <div class="panel panel-default">
+                                    <div class="panel-heading">
+                                        <h4>My Activity Queue</h4>
+                                    </div>
+                                    <div class="panel-body" style="min-height: 250px;max-height: 250px;">
+                                        
+                                        <table class="table">
+                                            <thead>
+                                                <tr>
+                                                    <th>Date</th>
+                                                    <th>Course Name</th>
+                                                    <th>Action Type</th>
+                                                    <th>Status</th>
+                                                    <th>Link</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>2/1/2016</td>
+                                                    <td>101 A</td>
+                                                    <td>New Worksheet Posted</td>
+                                                    <td class="text-danger">Incomplete</td>
+                                                    <td><form method="POST" action="/Student/MyCourses/ViewCourse/WorksheetEditor/"
+                                                              >
+                                                            <button type="submit" class="btn btn-primary">Complete it</button>
+                                                        </form></td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>-->
                     </div>
                 </div>
+
             </div>
-        </div>
 
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="/js/bootstrap.min.js"></script>
         <script>
diff --git a/teacher/Archive/Courses/ViewCourse/ViewWorksheet/AnnotationEditor/index.php b/teacher/Archive/Courses/ViewCourse/ViewWorksheet/AnnotationEditor/index.php
new file mode 100644
index 0000000..5c2b9cb
--- /dev/null
+++ b/teacher/Archive/Courses/ViewCourse/ViewWorksheet/AnnotationEditor/index.php
@@ -0,0 +1,246 @@
+<?php 
+include "../../../../../base.php";
+?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
+    <!-- Including Header -->
+    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+    
+</head>
+
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if($_SESSION['Role'] != 'Teacher')
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        $courseID = isset($_GET['courseID']) ? $_GET['courseID'] : 0;
+        $worksheetNum = isset($_GET['worksheetNum']) ? $_GET['worksheetNum'] : 0;
+        if ($courseID == 0 && $worksheetNum == 0)
+            echo "<meta http-equiv='refresh' content='0;../../' />";
+        else
+        {
+        ?>
+        <body>
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <div class="container-fluid">
+                        
+                        <div class="row">
+                            <div class="col-lg-5">
+                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                                    <span class="hamb-top"></span>
+                                    <span class="hamb-middle"></span>
+                                    <span class="hamb-bottom"></span>
+                                </button>
+                                <div class="panel panel-primary" >
+                                    <div class="panel-heading">
+                                        Course Details
+                                    </div>
+                                    <div class="panel-body">
+                                        <?php
+            $params = array($courseID);
+            $options = array( "Scrollable" => 'static');
+            $courseInfoQuery = "
+              SELECT TC.CoursesID, CN.ClassName, TC.Section, T.FirstName, T.LastName, SN.SessionName, I.InstitutionName
+            FROM Courses as TC, [Class Names] as CN, Teachers as T, Sessions as Ss, SessionNames as SN, Institutions as I
+            WHERE TC.CoursesID = ? AND
+                  CN.ClassNamesID = TC.ClassNamesID AND
+                  T.TeacherID = TC.InstructorID AND
+                  Ss.SessionsID = TC.SessionID AND
+                  SN.SessionsID = Ss.SessionsID";
+            $stmt = sqlsrv_query( $con, $courseInfoQuery, $params, $options);
+            if ($stmt === false)
+                die(print_r(sqlsrv_errors(), true));
+            if (sqlsrv_fetch($stmt) === true)
+            {
+                $ClassName = sqlsrv_get_field($stmt, 1);
+                $Section = sqlsrv_get_field($stmt, 2);
+                $FirstName = sqlsrv_get_field($stmt, 3);
+                $LastName = sqlsrv_get_field($stmt, 4);
+                $Session = sqlsrv_get_field($stmt, 5);
+                $Institution = sqlsrv_get_field($stmt, 6);
+                
+                
+            }
+            echo "<p>Class Name: $ClassName</p><p>Section: $Section</p><p>Teacher: $FirstName $LastName</p><p>Session: $Session</p><p>Hosting Institution: $Institution</p>";
+            
+            
+            
+            
+                                        ?>
+                                        
+                                    </div>
+                                </div>
+                                
+                                
+                            </div>
+                            <div class="col-lg-5">
+                                <div class="panel panel-primary" style="min-height:220px">
+                                    <div class="panel-heading">
+                                        Worksheet Details
+                                    </div>
+                                    <div class="panel-body">
+                                        <?php
+            $params = array($courseID, $worksheetNum, $courseID, $worksheetNum);
+            $options = array( "Scrollable" => 'static');
+            $worksheetInfoQuery = "
+              SELECT DISTINCT [TO].Topic, LEFT(CONVERT(VARCHAR, E.Date, 120), 10) 
+		      FROM Expressions as E, Topics as [TO]
+              WHERE E.[Teachers&ClassesID] = ? AND
+                  E.[Worksheet#] = ? AND
+				  [TO].Topic_ID = E.[Topic_ID] AND
+                  E.Date = (SELECT min(Date) FROM Expressions WHERE [Teachers&ClassesID] = ? AND [Worksheet#] = ?)";
+            $stmt = sqlsrv_query( $con, $worksheetInfoQuery, $params, $options);
+            if ($stmt === false)
+                die(print_r(sqlsrv_errors(), true));
+            if (sqlsrv_fetch($stmt) === true)
+            {
+                $topic = sqlsrv_get_field($stmt, 0);
+                $date = sqlsrv_get_field($stmt, 1);
+            }
+            echo "<p>Topic: $topic</p><p>Date: $date";
+            ?>
+                                    </div>
+                                </div>
+                                
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-10">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">Worksheet display</div>
+                                    <!-- Select Rows Per Page -->
+                                    <div class="dropdown">
+                                        <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                                            Select rows per page
+                                            <span class="caret"></span>
+                                        </button>
+                                        <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
+                                            <li><a href="?pp=10&courseID=<?=$courseID?>&worksheetNum=<?=$worksheetNum?>">10</a></li>
+                                            <li><a href="?pp=20&courseID=<?=$courseID?>&worksheetNum=<?=$worksheetNum?>">20</a></li>
+                                            <li><a href="?pp=30&courseID=<?=$courseID?>&worksheetNum=<?=$worksheetNum?>">30</a></li>
+                                            <li><a href="?pp=50&courseID=<?=$courseID?>&worksheetNum=<?=$worksheetNum?>">50</a></li>
+                                            
+                                        </ul>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table">
+                                            <thead>
+                                                <tr>
+                                                    <td>Sentence Number</td>
+                                                    <td>Student</td>
+                                                    <td>Expression</td>
+                                                    <td>Context/Vocab</td>
+                                                    <td>Pronunciation</td>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+        <?php
+            $params = array($courseID, $worksheetNum);
+            $options = array( "Scrollable" => 'static' );
+            $query = 
+       "SELECT E.[Sentence number], S.[LastName], E.Expression, E.[Context/Vocabulary], E.[Pronunciation], E.StudentID
+        FROM Expressions as E, 
+             Students as S, 
+	         Country as C
+        WHERE E.[Teachers&ClassesID] = ? AND
+              E.[Worksheet#] = ? AND
+		      S.ID = E.StudentID AND
+		      C.ID = S.Citizenship
+        ORDER BY [Sentence number]";
+            $stmt = sqlsrv_query($con, $query, $params, $options);
+            if (!$stmt)
+                die( print_r( sqlsrv_errors(), true));
+            
+            $rowsPerPage = isset($_GET['pp']) ? $_GET['pp'] : 10;
+            $rowsReturned = sqlsrv_num_rows($stmt);
+            if($rowsReturned === false)
+                die(print_r( sqlsrv_errors(), true));
+            elseif($rowsReturned == 0)
+            {
+                echo "No rows returned.";
+                exit();
+            }
+            else
+            {
+                $numOfPages = ceil($rowsReturned/$rowsPerPage);
+            }
+            
+            $pageNum = isset($_GET['pageNum']) ? $_GET['pageNum'] : 1;
+            $page = Pagination::getPage($stmt, $pageNum, $rowsPerPage);
+            foreach($page as $row)
+            {
+                $studentPageLink = "/Admin/Archive/Students/ViewStudent/?studentID=$row[5]";
+                echo "<tr><td>$row[0]</td><td><a href='$studentPageLink'>$row[1]</a></td><td>$row[2]</td><td>$row[3]</td><td>$row[4]</td></tr>";
+            }
+            echo "</tbody></table>";
+            $modulator = 3;
+            Pagination::pageLinksArchiveWorksheet($numOfPages, $pageNum, $rowsPerPage, $rowsReturned, $modulator, $courseID, $worksheetNum);
+            ?>
+
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <!-- Include all compiled plugins (below), or include individual files as needed -->
+            <script src="/js/bootstrap.min.js"></script>
+            <script>
+            $("#menu-toggle").click(function(e) {
+                e.preventDefault();
+                $("#wrapper").toggleClass("toggled");
+            });
+            </script>
+        </body> 
+        <?php  
+        }
+    }
+}
+
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+
+</html>
diff --git a/teacher/Archive/Courses/ViewCourse/ViewWorksheet/index.php b/teacher/Archive/Courses/ViewCourse/ViewWorksheet/index.php
new file mode 100644
index 0000000..71c151b
--- /dev/null
+++ b/teacher/Archive/Courses/ViewCourse/ViewWorksheet/index.php
@@ -0,0 +1,246 @@
+<?php 
+include "../../../../../base.php";
+?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+    
+</head>
+
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if($_SESSION['Role'] != 'Teacher')
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        $courseID = isset($_GET['courseID']) ? $_GET['courseID'] : 0;
+        $worksheetNum = isset($_GET['worksheetNum']) ? $_GET['worksheetNum'] : 0;
+        if ($courseID == 0 && $worksheetNum == 0)
+            echo "<meta http-equiv='refresh' content='0;../../' />";
+        else
+        {
+        ?>
+        <body>
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <div class="container-fluid">
+                        
+                        <div class="row">
+                            <div class="col-lg-5">
+                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                                    <span class="hamb-top"></span>
+                                    <span class="hamb-middle"></span>
+                                    <span class="hamb-bottom"></span>
+                                </button>
+                                <div class="panel panel-primary" >
+                                    <div class="panel-heading">
+                                        Course Details
+                                    </div>
+                                    <div class="panel-body">
+                                        <?php
+            $params = array($courseID);
+            $options = array( "Scrollable" => 'static');
+            $courseInfoQuery = "
+              SELECT TC.CoursesID, CN.ClassName, TC.Section, T.FirstName, T.LastName, SN.SessionName, I.InstitutionName
+            FROM Courses as TC, [Class Names] as CN, Teachers as T, Sessions as Ss, SessionNames as SN, Institutions as I
+            WHERE TC.CoursesID = ? AND
+                  CN.ClassNamesID = TC.ClassNamesID AND
+                  T.TeacherID = TC.InstructorID AND
+                  Ss.SessionsID = TC.SessionID AND
+                  SN.SessionsID = Ss.SessionsID";
+            $stmt = sqlsrv_query( $con, $courseInfoQuery, $params, $options);
+            if ($stmt === false)
+                die(print_r(sqlsrv_errors(), true));
+            if (sqlsrv_fetch($stmt) === true)
+            {
+                $ClassName = sqlsrv_get_field($stmt, 1);
+                $Section = sqlsrv_get_field($stmt, 2);
+                $FirstName = sqlsrv_get_field($stmt, 3);
+                $LastName = sqlsrv_get_field($stmt, 4);
+                $Session = sqlsrv_get_field($stmt, 5);
+                $Institution = sqlsrv_get_field($stmt, 6);
+                
+                
+            }
+            echo "<p>Class Name: $ClassName</p><p>Section: $Section</p><p>Teacher: $FirstName $LastName</p><p>Session: $Session</p><p>Hosting Institution: $Institution</p>";
+            
+            
+            
+            
+                                        ?>
+                                        
+                                    </div>
+                                </div>
+                                
+                                
+                            </div>
+                            <div class="col-lg-5">
+                                <div class="panel panel-primary" style="min-height:220px">
+                                    <div class="panel-heading">
+                                        Worksheet Details
+                                    </div>
+                                    <div class="panel-body">
+                                        <?php
+            $params = array($courseID, $worksheetNum, $courseID, $worksheetNum);
+            $options = array( "Scrollable" => 'static');
+            $worksheetInfoQuery = "
+              SELECT DISTINCT [TO].Topic, LEFT(CONVERT(VARCHAR, E.Date, 120), 10) 
+		      FROM Expressions as E, Topics as [TO]
+              WHERE E.[Teachers&ClassesID] = ? AND
+                  E.[Worksheet#] = ? AND
+				  [TO].Topic_ID = E.[Topic_ID] AND
+                  E.Date = (SELECT min(Date) FROM Expressions WHERE [Teachers&ClassesID] = ? AND [Worksheet#] = ?)";
+            $stmt = sqlsrv_query( $con, $worksheetInfoQuery, $params, $options);
+            if ($stmt === false)
+                die(print_r(sqlsrv_errors(), true));
+            if (sqlsrv_fetch($stmt) === true)
+            {
+                $topic = sqlsrv_get_field($stmt, 0);
+                $date = sqlsrv_get_field($stmt, 1);
+            }
+            echo "<p>Topic: $topic</p><p>Date: $date";
+            ?>
+                                    </div>
+                                </div>
+                                
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-10">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">Worksheet display</div>
+                                    <!-- Select Rows Per Page -->
+                                    <div class="dropdown">
+                                        <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                                            Select rows per page
+                                            <span class="caret"></span>
+                                        </button>
+                                        <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
+                                            <li><a href="?pp=10&courseID=<?=$courseID?>&worksheetNum=<?=$worksheetNum?>">10</a></li>
+                                            <li><a href="?pp=20&courseID=<?=$courseID?>&worksheetNum=<?=$worksheetNum?>">20</a></li>
+                                            <li><a href="?pp=30&courseID=<?=$courseID?>&worksheetNum=<?=$worksheetNum?>">30</a></li>
+                                            <li><a href="?pp=50&courseID=<?=$courseID?>&worksheetNum=<?=$worksheetNum?>">50</a></li>
+                                            
+                                        </ul>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table">
+                                            <thead>
+                                                <tr>
+                                                    <td>Sentence Number</td>
+                                                    <td>Student</td>
+                                                    <td>Expression</td>
+                                                    <td>Context/Vocab</td>
+                                                    <td>Pronunciation</td>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+        <?php
+            $params = array($courseID, $worksheetNum);
+            $options = array( "Scrollable" => 'static' );
+            $query = 
+       "SELECT E.[Sentence number], S.[LastName], E.Expression, E.[Context/Vocabulary], E.[Pronunciation], E.StudentID
+        FROM Expressions as E, 
+             Students as S, 
+	         Country as C
+        WHERE E.[Teachers&ClassesID] = ? AND
+              E.[Worksheet#] = ? AND
+		      S.ID = E.StudentID AND
+		      C.ID = S.Citizenship
+        ORDER BY [Sentence number]";
+            $stmt = sqlsrv_query($con, $query, $params, $options);
+            if (!$stmt)
+                die( print_r( sqlsrv_errors(), true));
+            
+            $rowsPerPage = isset($_GET['pp']) ? $_GET['pp'] : 10;
+            $rowsReturned = sqlsrv_num_rows($stmt);
+            if($rowsReturned === false)
+                die(print_r( sqlsrv_errors(), true));
+            elseif($rowsReturned == 0)
+            {
+                echo "No rows returned.";
+                exit();
+            }
+            else
+            {
+                $numOfPages = ceil($rowsReturned/$rowsPerPage);
+            }
+            
+            $pageNum = isset($_GET['pageNum']) ? $_GET['pageNum'] : 1;
+            $page = Pagination::getPage($stmt, $pageNum, $rowsPerPage);
+            foreach($page as $row)
+            {
+                $studentPageLink = "/Admin/Archive/Students/ViewStudent/?studentID=$row[5]";
+                echo "<tr><td>$row[0]</td><td><a href='$studentPageLink'>$row[1]</a></td><td>$row[2]</td><td>$row[3]</td><td>$row[4]</td></tr>";
+            }
+            echo "</tbody></table>";
+            $modulator = 3;
+            Pagination::pageLinksArchiveWorksheet($numOfPages, $pageNum, $rowsPerPage, $rowsReturned, $modulator, $courseID, $worksheetNum);
+            ?>
+
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <!-- Include all compiled plugins (below), or include individual files as needed -->
+            <script src="/js/bootstrap.min.js"></script>
+            <script>
+            $("#menu-toggle").click(function(e) {
+                e.preventDefault();
+                $("#wrapper").toggleClass("toggled");
+            });
+            </script>
+        </body> 
+        <?php  
+        }
+    }
+}
+
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+
+</html>
diff --git a/teacher/Archive/Courses/ViewCourse/index.php b/teacher/Archive/Courses/ViewCourse/index.php
new file mode 100644
index 0000000..6e1bcdb
--- /dev/null
+++ b/teacher/Archive/Courses/ViewCourse/index.php
@@ -0,0 +1,187 @@
+<?php 
+include "../../../../base.php";
+?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+
+</head>
+
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if($_SESSION['Role'] != 'Teacher')
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        $courseID = isset($_GET['courseID']) ? $_GET['courseID'] : 0;
+        if ($courseID == 0)
+            echo "<meta http-equiv='refresh' content=0;../";
+        else
+        {
+        ?>
+        <body>
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                                    <span class="hamb-top"></span>
+                                    <span class="hamb-middle"></span>
+                                    <span class="hamb-bottom"></span>
+                                </button>
+                    <div class="container-fluid">
+                        
+                        <div class="row">
+                            <div class="col-lg-3">
+                                
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">Course Info</div>
+                                    <div class="panel-body">
+                                    <?php
+            $params = array($courseID);
+            $options = array( "Scrollable" => 'static');
+            $courseInfoQuery = "
+            SELECT TC.CoursesID, CN.ClassName, TC.Section, T.FirstName, T.LastName, SN.SessionName, I.InstitutionName
+            FROM Courses as TC, [Class Names] as CN, Teachers as T, Sessions as Ss, SessionNames as SN, Institutions as I
+            WHERE TC.CoursesID = ? AND
+                  CN.ClassNamesID = TC.ClassNamesID AND
+                  T.TeacherID = TC.InstructorID AND
+                  Ss.SessionsID = TC.SessionID AND
+                  SN.SessionsID = Ss.SessionsID";
+            $stmt = sqlsrv_query($con, $courseInfoQuery, $params, $options);
+            if ($stmt === false)
+                die(print_r(sqlsrv_errors(), true));
+            if (sqlsrv_fetch($stmt) === true)
+            {
+                $ClassName = sqlsrv_get_field($stmt, 1);
+                $Section = sqlsrv_get_field($stmt, 2);
+                $FirstName = sqlsrv_get_field($stmt, 3);
+                $LastName = sqlsrv_get_field($stmt, 4);
+                $Session = sqlsrv_get_field($stmt, 5);
+                $Institution = sqlsrv_get_field($stmt, 6);
+                
+            }
+            echo "<p>Class Name: $ClassName</p><p>Section: $Section</p><p>Teacher: $FirstName $LastName</p><p>Session: $Session</p><p>Hosting Institution: $Institution</p>";
+                                        
+                                        
+                                        ?>
+                                    
+                                    </div>
+                                </div>
+                                
+                                
+                            </div>
+                            <div class="col-lg-4">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">Worksheet display</div>
+                                    <div class="panel-body">
+                                        <table class="table">
+                                            <thead>
+                                                <tr>
+                                                    <td>Worksheet Number</td>
+                                                    <td>Link to worksheet page</td>
+                                                    <td>Annotate this worksheet</td>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+        <?php
+            $params = array($courseID);
+            $options = array( "Scrollable" => 'static' );
+            $query = "SELECT [Worksheet#], [Teachers&ClassesID] FROM Expressions WHERE [Teachers&ClassesID] = ? GROUP BY [Worksheet#],[Teachers&ClassesID]";
+            $stmt = sqlsrv_query($con, $query, $params, $options);
+            if (!$stmt)
+                die( print_r( sqlsrv_errors(), true));
+            
+            $rowsPerPage = 10;
+            $rowsReturned = sqlsrv_num_rows($stmt);
+            if($rowsReturned === false)
+                die(print_r( sqlsrv_errors(), true));
+            elseif($rowsReturned == 0)
+            {
+                echo "No rows returned.";
+                exit();
+            }
+            else
+            {
+                $numOfPages = ceil($rowsReturned/$rowsPerPage);
+            }
+            
+            $pageNum = isset($_GET['pageNum']) ? $_GET['pageNum'] : 1;
+            $page = Pagination::getPage($stmt, $pageNum, $rowsPerPage);
+            foreach($page as $row)
+            {
+                $worksheetPageLink = "ViewWorksheet/?courseID=$row[1]&worksheetNum=$row[0]";
+                $annotationPageLink = "ViewWorksheet/AnnotationEditor/?courseID=$row[1]&worksheetNum=$row[0]";
+                echo "<tr><td>$row[0]</td><td><a href='$worksheetPageLink'>Worksheet Page</a></td><td><a href='$annotationPageLink'>Annotation Editor</a></td></tr>";
+            }
+        ?>
+            
+            
+            
+                                            </tbody>
+                                        </table>
+
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <!-- Include all compiled plugins (below), or include individual files as needed -->
+            <script src="/js/bootstrap.min.js"></script>
+            <script>
+            $("#menu-toggle").click(function(e) {
+                e.preventDefault();
+                $("#wrapper").toggleClass("toggled");
+            });
+            </script>
+        </body> 
+        <?php  
+        }
+    }
+}
+
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+
+</html>
diff --git a/teacher/Archive/Courses/index.php b/teacher/Archive/Courses/index.php
deleted file mode 100644
index c568d71..0000000
--- a/teacher/Archive/Courses/index.php
+++ /dev/null
@@ -1,107 +0,0 @@
-
-<!-- Archive/Courses for Teacher account -->
-<?php include "../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-    
-    <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-        
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Teacher')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-    ?>        
-
-    <body>
-        <div id="header"></div>
-        <div id="wrapper">
-            <div id = "sidebar"></div>
-            <div id="page-content-wrapper">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                            <!-- BEGIN PAGE CONTENT -->
-                            <h2>Search Courses</h2>
-                            <p>Search access for teacher user.  Through this page, the teacher will be able to search for (based on semester, time, type, teacher, etc) all courses in the DB.  This replicated functionality in the Access App  </p>
-                            <!-- END PAGE CONTENT -->
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-        <!-- Include all compiled plugins (below), or include individual files as needed -->
-        <script src="/js/bootstrap.min.js"></script>
-        <script>
-        $("#menu-toggle").click(function(e) {
-            e.preventDefault();
-            $("#wrapper").toggleClass("toggled");
-        });
-        </script>
-    </body>
-    <?php
-    }
-}
-    
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-</html>
-
-
diff --git a/teacher/Archive/Students/ViewStudent/index.php b/teacher/Archive/Students/ViewStudent/index.php
new file mode 100644
index 0000000..b8b3e62
--- /dev/null
+++ b/teacher/Archive/Students/ViewStudent/index.php
@@ -0,0 +1,206 @@
+<?php 
+include "../../../../base.php";
+?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
+
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+</head>
+
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if($_SESSION['Role'] != 'Teacher')
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        $studentID = isset($_POST['studentID']) ? $_POST['studentID'] : 0;
+        if ($studentID == 0)
+            echo "<meta http-equiv='refresh' content=0;../";
+        
+        $studentfirstname = isset($_POST['studentfirstname']) ? $_POST['studentfirstname'] : '';
+        $studentlastname = isset($_POST['studentlastname']) ? $_POST['studentlastname'] : '';
+        
+        $params = array($studentID);
+        $options = array("Scrollable" => 'static' );
+        $studentinfoSQL = "SELECT CONVERT(VARCHAR(11), SU.date_added,106), ST.SessionName, SI.Year
+                           FROM Students S, SiteUsers SU, SessionType ST, SessionInstance SI, Enrollment ER, Courses C
+                           WHERE S.StudentID = ? AND
+                                 SU.username = S.SiteUsername AND
+                                 ER.StudentID = S.StudentID AND
+                                 C.CourseID = ER.CourseID AND
+                                 SI.SessionInstanceID = C.SessionInstanceID AND
+                                 ST.SessionTypeID = SI.SessionTypeID";
+        $studentinfo = sqlsrv_query($con, $studentinfoSQL, $params, $options);
+        if ($studentinfo === false)
+            die(print_r(sqlsrv_errors(), true));
+        if (sqlsrv_fetch($studentinfo) === true)
+        {
+            $last_session = sqlsrv_get_field($studentinfo, 0);
+            $date_added = sqlsrv_get_field($studentinfo, 1);
+            $year_added = sqlsrv_get_field($studentinfo, 2);
+            
+        }
+        
+        ?>
+        <body>
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                                    <span class="hamb-top"></span>
+                                    <span class="hamb-middle"></span>
+                                    <span class="hamb-bottom"></span>
+                    </button>
+                    <div class="container-fluid">
+                        
+                        <div class="row">
+                            <div class="col-md-12">
+                                <h4><?php echo "$studentfirstname $studentlastname";?></h4>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-3 col-md-3 col-sm-3">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">Student Information</div>
+                                    <div class="panel-body">
+                                        <p>Last Active Session: <?=$date_added?> <?=$year_added?></p>
+                                        <p>Joined SmallTalk: <?=$last_session?></p>
+                                        
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-lg-7 col-md-7 col-sm-7">        
+                                <div class="panel panel-primary" style="min-height: 300px;max-height: 300px; ">
+                                    <div class="panel-heading">
+                                        Statistics/Performance Review
+                                    </div>
+                                </div>
+                            </div>
+                            
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-10 col-md-10">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">Student Expressions</div>
+                                    <div class="panel-body">    
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Expression</th>
+                                                    <th>Context/Vocab</th>
+                                                    <th>Session</th>
+                                                    <th>Course</th>
+                                                    <th>Worksheet Number</th>
+                                                    <th>Worksheet</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+    <?php
+            $params = array($studentID);
+            $studentexpressionsSQL = "SELECT E.Expression, E.[Context/Vocabulary], ST.SessionName, SI.Year, CT.CourseName, W.WorksheetNumber, W.WorksheetID
+            FROM Expressions E, SessionType ST, SessionInstance SI, CourseTypes CT, Courses C,  Worksheets W, Enrollment ER
+            WHERE ER.StudentID = ? AND
+                  C.CourseID = ER.CourseID AND
+                  W.CourseID = C.CourseID AND
+                  E.WorksheetID = W.WorksheetID AND
+                  E.EnrollmentID = ER.EnrollmentID AND
+                  CT.CourseTypesID = C.CourseTypesID AND
+                  SI.SessionInstanceID = C.SessionInstanceID AND
+                  ST.SessionTypeID = SI.SessionTypeID";
+            $studentexpressions = sqlsrv_query($con, $studentexpressionsSQL, $params, $options);
+            if ($studentexpressions === false)
+                die(print_r(sqlsrv_errors(), true));
+            $numexpressions = sqlsrv_num_rows($studentexpressions);
+            $expressions = [];
+            $contexts = [];
+            $sessionnames = [];
+            $years = [];
+            $coursenames = [];
+            $worksheetnums = [];
+            $worksheetids = [];
+            while (sqlsrv_fetch($studentexpressions) === true)
+            {
+                $expressions[] = sqlsrv_get_field($studentexpressions, 0);
+                $contexts[] = sqlsrv_get_field($studentexpressions, 1);
+                $sessionnames[] = sqlsrv_get_field($studentexpressions, 2);
+                $years[] = sqlsrv_get_field($studentexpressions, 3);
+                $coursenames[] = sqlsrv_get_field($studentexpressions, 4);
+                $worksheetnums[] = sqlsrv_get_field($studentexpressions, 5);
+                $worksheetids[] = sqlsrv_get_field($studentexpressions, 6);
+            }
+        for($i = 0; $i < $numexpressions; $i++)
+            echo "<tr><td>$expressions[$i]</td>
+                      <td>$contexts[$i]</td>
+                      <td>$sessionnames[$i] $years[$i]</td>
+                      <td>$coursenames[$i]</td>
+                      <td>$worksheetnums[$i]</td>
+                      <td><form method=\"POST\" action=\"/teacher/Archive/Courses/ViewCourse/ViewWorksheet/\" name=\"worksheet{$worksheetids[$i]}\">
+                      <input hidden type=\"text\" value=\"$worksheetids[$i]\" name =\"worksheetID\">
+                      <button class=\"btn btn-primary\">View Worksheet</button></form></td></tr>";
+        ?>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <!-- Include all compiled plugins (below), or include individual files as needed -->
+            <script src="/js/bootstrap.min.js"></script>
+            <script>
+            $("#menu-toggle").click(function(e) {
+                e.preventDefault();
+                $("#wrapper").toggleClass("toggled");
+            });
+            </script>
+        </body> 
+        <?php 
+        }
+}
+
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+
+</html>
diff --git a/teacher/Archive/Students/index.php b/teacher/Archive/Students/index.php
new file mode 100644
index 0000000..432c370
--- /dev/null
+++ b/teacher/Archive/Students/index.php
@@ -0,0 +1,184 @@
+<?php 
+include "../../../base.php";
+?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
+
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+</head>
+
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if($_SESSION['Role'] != 'Teacher')
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        ?>
+        <body>
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                                    <span class="hamb-top"></span>
+                                    <span class="hamb-middle"></span>
+                                    <span class="hamb-bottom"></span>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-10">
+                                
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">Search for a Student</div>
+                                    <div class="panel-body">
+                                        <form method="POST" id="filterTeachers" action="">
+                                            <div class="form-group row">
+                                                <div class="col-lg-10">
+                                                    <label>Start Typing a Student Name:<input class="form-control" id="LastName" type="text" placeholder="Student Last Name" /></label>    
+                                                </div> 
+                                            </div>
+                                        </form>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col-lg-10 col-md-10 col-sm-10 col-xs-10">
+                                
+                                <div class="panel panel-primary" style="max-height:600px;">
+                                    <div class="panel-heading">Students</div>
+                                    
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Name</th>
+                                                    <th>Last Active Session</th>
+                                                    <th>Go To</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+<?php
+        $params = array($_SESSION['Username']);
+        $options = array( "Scrollable" => 'static' );
+        $mystudentsSQL = "SELECT S.FirstName, S.LastName, S.StudentID, ST.SessionName, SI.Year
+                          FROM Students as S, SessionType as ST, SessionInstance as SI, TeachingInstance as TI, Enrollment as ER, Courses as C
+                          WHERE TI.SiteUsername = ? AND
+                                C.TeachingInstanceID = TI.TeachingInstanceID AND
+                                ER.CourseID = C.CourseID AND
+                                S.StudentID = ER.StudentID AND
+                                SI.SessionInstanceID = C.SessionInstanceID AND
+                                ST.SessionTypeID = SI.SessionTypeID";
+        $mystudents = sqlsrv_query($con, $mystudentsSQL, $params, $options);
+        if ($mystudents === false)
+            die(print_r(sqlsrv_errors(), true));
+        $numstudents = sqlsrv_num_rows($mystudents);
+        $firstnames = [];
+        $lastnames = [];
+        $ids = [];
+        $sessionnames = [];
+        $years = [];
+        while (sqlsrv_fetch($mystudents) === true)
+        {
+            $firstnames[] = sqlsrv_get_field($mystudents, 0);
+            $lastnames[] = sqlsrv_get_field($mystudents, 1);
+            $ids[] = sqlsrv_get_field($mystudents, 2);
+            $sessionnames[] = sqlsrv_get_field($mystudents, 3);
+            $years[] = sqlsrv_get_field($mystudents, 4);
+        }
+        for($i = 0; $i < $numstudents; $i++)
+        {
+            $id = $ids[$i];
+            echo "<tr>
+                      <td>$firstnames[$i] $lastnames[$i]</td>
+                      <td>$sessionnames[$i] $years[$i]</td>
+                      <td><form method=\"POST\" action=\"ViewStudent/\" name=\"student{$id}\" id=\"student{$id}\">
+                            <input hidden type=\"text\" value=\"$id\" name=\"studentID\">
+                            <input hidden type=\"text\" value=\"$firstnames[$i]\" name=\"studentfirstname\">
+                            <input hidden type=\"text\" value=\"$lastnames[$i]\" name=\"studentlastname\">
+                            <button class=\"btn btn-primary\">Student Page</button></form></td></tr>";
+        
+        }
+        ?>
+                                                <!--<tr>
+                                                    <td>Good Student</td>
+                                                    <td>Fall II 2014</td>
+                                                    <td>Advanced Oral Communication</td>
+                                                    <td><a href='ViewStudent/?sid=1'>Student Page</a></td>
+                                                </tr>
+                                                <tr>
+                                                    <td>Bad Student</td>
+                                                    <td>Fall I 2014</td>
+                                                    <td>Basic Oral Communication</td>
+                                                    <td><a href='ViewStudent/?sid=1'>Student Page</a></td>
+                                                </tr>-->
+                                                
+                                            </tbody>
+                                        </table>
+
+
+                                            
+                                    </div>
+                                </div>
+                                
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+            <!-- Include all compiled plugins (below), or include individual files as needed -->
+            <script src="/js/bootstrap.min.js"></script>
+            <script>
+            $("#menu-toggle").click(function(e) {
+                e.preventDefault();
+                $("#wrapper").toggleClass("toggled");
+            });
+            </script>
+        </body> 
+        <?php        
+    }
+}
+
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+
+</html>
diff --git a/teacher/ChangePassword.php b/teacher/ChangePassword.php
new file mode 100644
index 0000000..a96768f
--- /dev/null
+++ b/teacher/ChangePassword.php
@@ -0,0 +1,148 @@
+<!-- Home (index.html) for Teacher account -->
+<?php include "../base.php"; ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
+    
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+</head>
+        
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if($_SESSION['Role'] != 'Teacher')
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        $params = array($_SESSION['Username']);
+        $options = array( "Scrollable" => 'static' );
+        $getPasswordQuery = "SELECT password FROM SiteUsers WHERE username = ?";
+        $stmt = sqlsrv_query($con, $getPasswordQuery, $params, $options);
+        if ($stmt === false)
+            die (print_r(sqlsrv_errors(), true));
+        if (sqlsrv_fetch($stmt) === true)
+            $password = sqlsrv_get_field($stmt, 0);
+        
+        
+        ?>
+        <body>
+
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                        <span class="hamb-top"></span>
+                        <span class="hamb-middle"></span>
+                        <span class="hamb-bottom"></span>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-sm-8 col-md-6">
+                                <div class="panel panel-default">
+                                    <div class="panel-heading">
+                                        Reset Password
+                                    </div>
+                                    <div class="panel-body">
+                                        <form method="POST" id="confirmPassword" autocomplete="Off" AutoCompleteType="Disabled">
+                                            <div class="form-group row">
+                                                <div class="col-xs-6">
+                                                    <label for="currentPassword">Enter Password:</label>
+                                                    <input type="password" class="form-control" id="currentPassword" name="currentPassword" autocomplete="Off">
+                                                    <input hidden type="text" id="password" value="<?=$password?>">
+                                                </div>
+                                                <div class="col-xs-2" id="checkmark"></div>
+                                            </div>
+                                        </form>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+            </div>
+
+        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <!-- Include all compiled plugins (below), or include individual files as needed -->
+        <script src="/js/bootstrap.min.js"></script>
+        <script>
+        $("#menu-toggle").click(function(e) {
+            e.preventDefault();
+            $("#wrapper").toggleClass("toggled");
+        });
+        </script>
+        <script>
+        $(document).ready(function(){
+            $("input").blur(function(){
+                
+                var password = document.getElementById("password").value;
+                var currentpassword = document.getElementById("currentPassword").value;
+                if ( password !== ""){
+                    if (password === currentpassword){
+                        ConfirmPassword();}
+                    else {
+                        DenyPassword();
+                    }
+                }   
+                
+                
+            });
+        });
+        function ConfirmPassword(){
+            $("#checkmark").empty();
+            var span = $('<span />').addClass('glyphicon glyphicon-ok').css("font-size", "25px");
+            $("#checkmark").append(span);
+            
+        }
+        function DenyPassword(){
+            $("#checkmark").empty();
+            var span = $('<span />').addClass('glyphicon glyphicon-remove').css("font-size", "25px");
+            $("#checkmark").append(span);
+        }
+        </script>
+    </body>
+    <?php
+    }
+}
+    
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+</html>
diff --git a/teacher/Home/Profile/index.php b/teacher/Home/Profile/index.php
deleted file mode 100644
index 354d032..0000000
--- a/teacher/Home/Profile/index.php
+++ /dev/null
@@ -1,105 +0,0 @@
-<!-- Archive Home (index.html) for Teacher account -->
-
-<?php include "../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-    
-    <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-        
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Teacher')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-    ?>        
-
-    <body>
-        <div id="header"></div>
-        <div id="wrapper">
-            <div id = "sidebar"></div>
-            <div id="page-content-wrapper">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                            <!-- BEGIN PAGE CONTENT -->
-                            <p>Documentation:</p>
-                            <p>Provides Teacher user with view of own profile, for reviewing purposes.</p>
-                            <!-- END PAGE CONTENT -->
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-        <!-- Include all compiled plugins (below), or include individual files as needed -->
-        <script src="/js/bootstrap.min.js"></script>
-        <script>
-        $("#menu-toggle").click(function(e) {
-            e.preventDefault();
-            $("#wrapper").toggleClass("toggled");
-        });
-        </script>
-    </body>
-    <?php
-    }
-}
-    
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-</html>
diff --git a/teacher/Home/index.php b/teacher/Home/index.php
index 8444b99..ba58845 100644
--- a/teacher/Home/index.php
+++ b/teacher/Home/index.php
@@ -14,9 +14,11 @@
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
     
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -27,16 +29,6 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
         
 <?php
@@ -52,33 +44,263 @@
     }
     else
     {
-    ?>        
-
-    <body>
-        <div id="header"></div>
-        <div id="wrapper">
-            <div id = "sidebar"></div>
-            <div id="page-content-wrapper">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                            <!-- BEGIN PAGE CONTENT -->
-                            <h1><?=$_SESSION['FirstName']?> <?=$_SESSION['LastName']?></h1>
-                            <p>Page provides teacher user home.  Eventual content will be a site activity queue, listing all relevant course events from students.  </p>
-                            <!-- END PAGE CONTENT -->
+        $username = $_SESSION['Username'];
+        $role = $_SESSION['Role'];
+        $params = array( $username, $role);
+        $options = array( "Scrollable" => 'static' );
+        $UserInfoQuery = "
+        SELECT R.Designation 
+        FROM RoleInstances as RI, Roles as R 
+        WHERE  RI.SiteUsername = ? AND 
+               R.Role = ? AND 
+               R.RoleID = RI.RoleID";
+        $stmt = sqlsrv_query($con, $UserInfoQuery, $params, $options);
+        if ( $stmt === false)
+            die( print_r( sqlsrv_errors(), true));
+        $Designation = "";
+        $Institution = "";
+        if ( sqlsrv_fetch( $stmt ) === true)
+        {
+            $Designation = sqlsrv_get_field( $stmt, 0);
+        }
+        ?>
+        <body>
+<!--
+            <div id="header"></div>           
+-->
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                        <span class="hamb-top"></span>
+                        <span class="hamb-middle"></span>
+                        <span class="hamb-bottom"></span>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-8 col-md-8">
+                                <h3><?php echo $_SESSION['firstname'] . " " . $_SESSION['lastname']; ?></h3>
+                                
+                            </div>
+                        </div>
+                        <div class="row">
+                            
+                            <div class="col-lg-5 col-md-6 col-sm-7">
+                                <div class="panel panel-default" style="min-height:600px;">
+                                    <div class="panel-heading">
+                                        <div class="row">
+                                            <div class="col-xs-10">
+                                                <h4>Active Courses</h4>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="panel-body" style="min-height: 150px; max-height: 150px;">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Course</th>
+                                                    <th>Section</th>
+                                                    <th>Session</th>
+                                                    <th>Institution</th>
+                                                    <th>Go To</th>
+                                                </tr>
+                                            </thead>
+                                                         
+                                            <tbody>
+                                                <?php
+                                                $activecoursesSQL = "SELECT CT.CourseName, C.Section, I.InstitutionName, ST.SessionName, C.CourseID
+                                                FROM Courses as C, TeachingInstance as TI, SessionType as ST, SessionInstance as SI, Institutions as I, CourseTypes as CT
+                                                WHERE C.TeachingInstanceID = TI.TeachingInstanceID
+                                                AND TI.SiteUsername = ?
+                                                AND C.SessionInstanceID = SI.SessionInstanceID
+                                                AND SI.SessionTypeID = ST.SessionTypeID
+                                                AND C.InstitutionID = I.InstitutionID
+                                                AND CT.CourseTypesID = C.CourseTypesID
+                                                AND C.Status = 'Active'";
+                                                
+                                                $params = array($_SESSION['Username']);
+                                                $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+                                                
+                                                $activecourses = sqlsrv_query($con, $activecoursesSQL, $params, $options);
+                                                if($activecourses === false)
+                                                    die (print_r(sqlsrv_errors(), true));
+                                                $resultlength = sqlsrv_num_rows($activecourses);
+                                                if($resultlength == 0)
+                                                {
+                                                    echo "No Active Courses!";
+                                                }
+                                                else
+                                                {
+                                                    $coursenames = [];
+                                                    $sections = [];
+                                                    $institutions = [];
+                                                    $sessions = [];
+                                                    $courseids = [];
+                                                    while(sqlsrv_fetch($activecourses) === true)
+                                                    {
+                                                        $coursenames[] = sqlsrv_get_field($activecourses, 0);
+                                                        $sections[] = sqlsrv_get_field($activecourses, 1);
+                                                        $institutions[] = sqlsrv_get_field($activecourses, 2);
+                                                        $sessions[] = sqlsrv_get_field($activecourses, 3);
+                                                        $courseids[] = sqlsrv_get_field($activecourses, 4);
+                                                    }
+                                                    for ($i = 0; $i < $resultlength; $i++)
+                                                    {
+                                                        echo "<tr><td>$coursenames[$i]</td><td>$sections[$i]</td><td>$sessions[$i]</td><td>$institutions[$i]</td><td><form method=\"post\" action=\"/Teacher/MyCourses/ViewCourse/\" name=\"activecourselink{$i}\" id=\"activecourselink{$i}\"><input hidden type=\"text\" name=\"courseID\" value=\"$courseids[$i]\"><button class=\"btn btn-primary\">Course Page</button></form>
+                                                        </td></tr>";
+                                                    }
+                                                }
+                                                
+                                                ?>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-lg-4 col-md-6 col-sm-5">
+                                <div class="panel panel-default" style="min-height:600px; max-height:600px;overflow-y:auto">
+                                    <div class="panel-heading">
+                                        <div class="row">
+                                            <div class="col-xs-10">
+                                                    <h4>My Students</h4>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="panel-body">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Name</th>
+                                                    <th>Course</th>
+                                                    <th>Institution</th>
+                                                    <th>Go To</th>
+                                                </tr>
+                                            </thead>
+                                        
+                                                
+                                            <tbody>
+                                                <?php
+                                                $mystudentsSQL = "SELECT DISTINCT ER.EnrollmentID, S.LastName, S.FirstName, I.InstitutionName, CT.CourseName, C.CourseID
+                                                FROM Courses as C, TeachingInstance as TI, Students as S, Institutions as I, Enrollment as ER, CourseTypes as CT
+                                                WHERE TI.SiteUsername = ?
+                                                AND C.TeachingInstanceID = TI.TeachingInstanceID
+                                                AND C.Status = 'Active'
+                                                AND ER.CourseID = C.CourseID
+                                                AND S.StudentID = ER.StudentID
+                                                AND I.InstitutionID = S.InstitutionID
+                                                AND CT.CourseTypesID = C.CourseTypesID";
+                                                
+                                                $params = array($_SESSION['Username']);
+                                                $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+                                                
+                                                $mystudents = sqlsrv_query($con, $mystudentsSQL, $params, $options);
+                                                if($mystudents === false)
+                                                    die (print_r(sqlsrv_errors(), true));
+                                                $resultlength = sqlsrv_num_rows($mystudents);
+                                                if($resultlength == 0)
+                                                {
+                                                    echo "No Enrolled Students!";
+                                                }
+                                                else
+                                                {
+                                                    $enrollmentids = [];
+                                                    $studentlastnames = [];
+                                                    $studentfirstnames = [];
+                                                    $institutions = [];
+                                                    $coursenames = [];
+                                                    $courseids = [];
+                                                    while(sqlsrv_fetch($mystudents) === true)
+                                                    {
+                                                        $enrollmentids[] = sqlsrv_get_field($mystudents, 0);
+                                                        $studentlastnames[] = sqlsrv_get_field($mystudents, 1);
+                                                        $studentfirstnames[] = sqlsrv_get_field($mystudents, 2);
+                                                        $institutions[] = sqlsrv_get_field($mystudents, 3);
+                                                        $coursenames[] = sqlsrv_get_field($mystudents, 4);
+                                                        $courseids[] = sqlsrv_get_field($mystudents, 5);
+                                                    }
+                                                    for ($i = 0; $i < $resultlength; $i++)
+                                                    {
+                                                        echo "<tr><td>$studentfirstnames[$i] $studentlastnames[$i]</td><td>$coursenames[$i]</td><td>$institutions[$i]</td><td><form method=\"post\" action=\"/Teacher/MyCourses/ViewCourse/Students/ViewStudentProfile/\" name=\"mystudentlink{$i}\" id=\"mystudentlink{$i}\"><input hidden type=\"text\" name=\"enrollmentID\" value=\"$enrollmentids[$i]\"><input hidden type=\"text\" name=\"courseID\" value=\"$courseids[$i]\"><button class=\"btn btn-primary\">Student Page</button></form>
+                                                        </td></tr>";
+                                                    }
+                                                }
+                                                
+                                                ?>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                            
                         </div>
+                        <!--<div class="row">
+                            <div class="col-lg-8 col-md-8">
+                                <div class="panel panel-default">
+                                    <div class="panel-heading">
+                                        <h4>My Site Activity Queue</h4>
+                                    </div>
+                                    <div class="panel-body" style="min-height: 250px;max-height: 250px;">
+                                        <form method="POST" id="filterActivityQueue" action="">
+                                            <div class="form-group row">
+                                                <div class="col-lg-3 col-md-3 col-sm-4">
+                                                    <select class="form-control">
+                                                        <option selected="selected">--Institution--</option>
+                                                        <option>Gonzaga</option>
+                                                        <option>Spokane Falls CC</option>
+                                                    </select>
+                                                </div>
+                                                <div class="col-lg-3 col-md-3 col-sm-4">
+                                                    <select class="form-control" style="display:inline">
+                                                        <option selected="selected">--Course--</option>
+                                                        <option>Course Info</option>
+                                                        <option>Course Info</option>
+                                                        <option>Course Info</option>
+                                                    </select>
+                                                </div>
+                                                <div class="col-lg-3 col-md-3 col-sm-4">
+                                                    <select class="form-control">
+                                                        <option selected="selected">--Action Type--</option>
+                                                        <option>Submitted Worksheet</option>
+                                                        <option>Question</option>
+                                                        <option>Submitted Other</option>
+                                                    </select>
+                                                </div>
+                                                <button type="submit" class="btn btn-primary">Filter Activity Queue</button>
+                                            </div>
+                                        </form>
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Date</th>
+                                                    <th>Institution</th>
+                                                    <th>Course</th>
+                                                    <th>Action Type</th>
+                                                    <th>User</th>
+                                                    
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>1/28/2016</td>
+                                                    <td>Gonzaga University</td>
+                                                    <td>Seminar: Spring I 2016</td>
+                                                    <td><a href="/Teacher/MyCourses/ViewCourse/ViewWorksheet/ViewSubmission/">Worksheet Submission</a></td>
+                                                    
+                                                    <td><a href="/Teacher/MyStudents/ViewStudentProfile/">Student Name</a></td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>-->
                     </div>
                 </div>
+
             </div>
-        </div>
 
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="/js/bootstrap.min.js"></script>
         <script>
diff --git a/teacher/MyCourses/Students/index.php b/teacher/MyCourses/Students/index.php
deleted file mode 100644
index c7dcde3..0000000
--- a/teacher/MyCourses/Students/index.php
+++ /dev/null
@@ -1,105 +0,0 @@
-<!-- View students (index.php) for basic Teacher account -->
-
-<?php include "../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-    
-    <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-        
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Teacher')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-    ?>        
-
-    <body>
-        <div id="header"></div>
-        <div id="wrapper">
-            <div id = "sidebar"></div>
-            <div id="page-content-wrapper">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                            <!-- BEGIN PAGE CONTENT -->
-                            <h2>My Students</h2>
-                            <p>For a given teacher, will list all active students (according to active courses) and display a link to each student's profile view  </p>
-                            <!-- END PAGE CONTENT -->
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-        <!-- Include all compiled plugins (below), or include individual files as needed -->
-        <script src="/js/bootstrap.min.js"></script>
-        <script>
-        $("#menu-toggle").click(function(e) {
-            e.preventDefault();
-            $("#wrapper").toggleClass("toggled");
-        });
-        </script>
-    </body>
-    <?php
-    }
-}
-    
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-</html>
diff --git a/teacher/MyCourses/ViewCourse/CreateWorksheet.php b/teacher/MyCourses/ViewCourse/CreateWorksheet.php
new file mode 100644
index 0000000..bf3b52c
--- /dev/null
+++ b/teacher/MyCourses/ViewCourse/CreateWorksheet.php
@@ -0,0 +1,81 @@
+<?php
+
+include '../../../base.php';
+
+function get_topic_id($topic)
+{
+    $params = array($topic);
+    $options = array( "Scrollable" => 'static');
+    $addTopicSQL = "INSERT into Topics Values (?)";
+    $getTopicIDSQL = "SELECT TOP 1 TopicID FROM Topics 
+                        WHERE Topic = ?
+                        ORDER BY TopicID Desc";
+    $TopicID = 0;
+    $addTopic = sqlsrv_query($con, $addTopicSQL, $params, $options);
+    if($addTopic === false)
+        die(print_r(sqlsrv_errors(), true));
+    
+    $getTopicID = sqlsrv_query($con, $getTopicIDSQL, $params, $options);
+    if($getTopicID === false)
+        die(print_r(sqlsrv_errors(), true));
+    if(sqlsrv_fetch($getTopicID) === true)
+        $TopicID = sqlsrv_get_field($getTopicID, 0);
+    return $TopicID;
+}
+
+if ((isset($_POST['worksheet_number'])) && (isset($_POST['topic'])))
+{
+    $original = isset($_POST['worksheetTypeOriginal']) ? $_POST['worksheetTypeOriginal'] : 'off';
+    $text_ref = isset($_POST['worksheetTypeText']) ? $_POST['worksheetTypeText'] : 'off';
+    $audio_ref = isset($_POST['worksheetTypeAudio']) ? $_POST['worksheetTypeAudio'] : 'off';
+    
+    
+    $original_bool = 0;
+    $text_ref_bool = 0;
+    $audio_ref_bool = 0;
+    if ($original != 'off')
+        $original_bool = 1;
+    if ($text_ref != 'off')
+        $text_ref_bool = 1;
+    if ($audio_ref != 'off')
+        $audio_ref_bool = 1;
+    
+    $params = array($_POST['topic']);
+    $options = array( "Scrollable" => 'static');
+    $addTopicSQL = "INSERT into Topics Values (?)";
+    $getTopicIDSQL = "SELECT TOP 1 TopicID FROM Topics 
+                        WHERE Topic = ?
+                        ORDER BY TopicID Desc";
+    $TopicID = 887;
+    $addTopic = sqlsrv_query($con, $addTopicSQL, $params, $options);
+    if($addTopic === false)
+        die(print_r(sqlsrv_errors(), true));
+    
+    $getTopicID = sqlsrv_query($con, $getTopicIDSQL, $params, $options);
+    if($getTopicID === false)
+        die(print_r(sqlsrv_errors(), true));
+    if(sqlsrv_fetch($getTopicID) === true)
+        $TopicID = sqlsrv_get_field($getTopicID, 0);
+    if (strlen($_POST['topic']) == 0)
+        $TopicID = 887;
+    
+    $params = array($_POST['courseid'], $_POST['worksheet_number'], $TopicID, $original_bool, $text_ref_bool, $audio_ref_bool);
+    $options = array( "Scrollable" => 'static');
+    
+    $newworksheetSQL = "INSERT INTO Worksheets (
+            [Date]
+           ,[CourseID]
+           ,[WorksheetNumber]
+           ,[EditStatus]
+           ,[TopicID]
+           ,[DisplayOriginal]
+           ,[DisplayTextReformulation]
+           ,[DisplayAudioReformulation]
+           ,[IsDeleted]) VALUES (GETDATE(), ?, ?, 'Unreleased', ?, ?, ?, ?, 0)";
+    
+    $newworksheet = sqlsrv_query($con, $newworksheetSQL, $params, $options);
+    if($newworksheet === false)
+        die(print_r(sqlsrv_errors(), true));
+}
+
+?>
\ No newline at end of file
diff --git a/teacher/MyCourses/ViewCourse/CreateWorksheet/gethint.php b/teacher/MyCourses/ViewCourse/CreateWorksheet/gethint.php
deleted file mode 100644
index bbed73c..0000000
--- a/teacher/MyCourses/ViewCourse/CreateWorksheet/gethint.php
+++ /dev/null
@@ -1,56 +0,0 @@
-<?php
-// Array with names
-$a[] = "Anna";
-$a[] = "Brittany";
-$a[] = "Cinderella";
-$a[] = "Diana";
-$a[] = "Eva";
-$a[] = "Fiona";
-$a[] = "Gunda";
-$a[] = "Hege";
-$a[] = "Inga";
-$a[] = "Johanna";
-$a[] = "Kitty";
-$a[] = "Linda";
-$a[] = "Nina";
-$a[] = "Ophelia";
-$a[] = "Petunia";
-$a[] = "Amanda";
-$a[] = "Raquel";
-$a[] = "Cindy";
-$a[] = "Doris";
-$a[] = "Eve";
-$a[] = "Evita";
-$a[] = "Sunniva";
-$a[] = "Tove";
-$a[] = "Unni";
-$a[] = "Violet";
-$a[] = "Liza";
-$a[] = "Elizabeth";
-$a[] = "Ellen";
-$a[] = "Wenche";
-$a[] = "Vicky";
-
-// get the q parameter from URL
-$q = $_REQUEST["q"];
-
-$hint = "";
-
-// lookup all hints from array if $q is different from "" 
-if ($q !== "") {
-    $q = strtolower($q);
-    $len=strlen($q);
-    foreach($a as $name) {
-        if (stristr($q, substr($name, 0, $len))) {
-            if ($hint === "") {
-                $hint = $name;
-            } else {
-                $hint .= ", $name";
-            }
-        }
-    }
-}
-
-// Output "no suggestion" if no hint was found or output correct values 
-echo $hint === "" ? "no suggestion" : $hint;
-?>
\ No newline at end of file
diff --git a/teacher/MyCourses/ViewCourse/CreateWorksheet/index.php b/teacher/MyCourses/ViewCourse/CreateWorksheet/index.php
deleted file mode 100644
index 3c2d0bd..0000000
--- a/teacher/MyCourses/ViewCourse/CreateWorksheet/index.php
+++ /dev/null
@@ -1,161 +0,0 @@
-<!-- Create Worksheet (index.php) for Teacher account -->
-
-<?php include "../../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-    
-    <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-        
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'Teacher')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-        
-        
-    ?>        
-
-    <body>
-        <div id="header"></div>
-        <div id="wrapper">
-            <div id = "sidebar"></div>
-            <div id="page-content-wrapper">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                            <!-- BEGIN PAGE CONTENT -->
-                            <h1>Course Title: Create Worksheet #</h1>
-                            <div class="panel panel-primary">
-                                <div class="panel-heading">Enter Worksheet Information</div>
-                                <div class="panel-body">
-                                    <p>Enter <strong>topic</strong>, enter <strong>date</strong>, verify <strong>level</strong> (extracted from course number)</p>
-                                </div> 
-                            </div>
-    
-                            <div class="well">
-                            <form id="Worksheet" method="post" action="#submit-expression" class="form-horizontal">
-                                <div class="form-group">
-                                    <div class="col-xs-3">
-                                        <form action="">
-                                        Student: <input type="text" onkeyup="showHint(this.value)"></form>
-                                        <p>Suggestions: <span id="txtHint"></span></p>
-                                    </div>
-                                    <!--<div class="col-xs-6">
-                                        <input type="text" class="form-control" name="Expression" placeholder="Enter Expression" />
-                                    </div>
-                                    <div class="col-xs-3">
-                                        <input type="text" class="form-control" name="Expression" placeholder="Context/Vocab" />
-                                    </div>
-                                <div class="col-xs-1">
-                                    <button type="button" class="btn btn-default"></button>
-                                </div>    -->
-                                </div>
-                            </form>
-                            </div>
-                            <div class="panel panel-default">
-                                <div class="panel-heading">Expression Template</div>
-                                <div class="panel-body">
-                                    <p>Sentence number, Dropdown{Select Student}, Text Entry{Enter Expression}, Text Entry{Enter Context/Vocab}, Submit</p>
-                                    <p>On submit: disable submit, print "Submitted"</p>
-                                </div>
-                            </div>                   
-                             
-                            <!-- END PAGE CONTENT -->
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-        <!-- Include all compiled plugins (below), or include individual files as needed -->
-        <script src="/js/bootstrap.min.js"></script>
-        <script>
-        $("#menu-toggle").click(function(e) {
-            e.preventDefault();
-            $("#wrapper").toggleClass("toggled");
-        });
-        </script>
-        <script>
-       
-        function showHint(str) {
-            if (str.length == 0) { 
-                document.getElementById("txtHint").innerHTML = "";
-                return;
-            } else {
-                var xmlhttp = new XMLHttpRequest();
-                xmlhttp.onreadystatechange = function() {
-                    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
-                        document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
-                    }
-                };
-                xmlhttp.open("GET", "ChangeRole.php?q=" + str, true);
-                xmlhttp.send();
-            }
-        }
-        
-        </script>
-        
-    </body>
-    <?php
-    }
-}
-    
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-</html>
\ No newline at end of file
diff --git a/teacher/MyCourses/ViewCourse/CreateWorksheet/submit_expression.php b/teacher/MyCourses/ViewCourse/CreateWorksheet/submit_expression.php
deleted file mode 100644
index 26ed6bc..0000000
--- a/teacher/MyCourses/ViewCourse/CreateWorksheet/submit_expression.php
+++ /dev/null
@@ -1,5 +0,0 @@
-<?php
-
-echo "Hello World";
-
-?>
\ No newline at end of file
diff --git a/teacher/MyCourses/ViewCourse/DeleteWorksheet.php b/teacher/MyCourses/ViewCourse/DeleteWorksheet.php
new file mode 100644
index 0000000..6882d08
--- /dev/null
+++ b/teacher/MyCourses/ViewCourse/DeleteWorksheet.php
@@ -0,0 +1,13 @@
+<?php
+
+include '../../../base.php';
+
+if(isset($_POST['worksheetID']))
+{
+    $params = array($_POST['worksheetID']);
+    $options = array( "Scrollable" => 'static' );
+    $deleteworksheetSQL = "UPDATE Worksheets SET IsDeleted = 1 WHERE WorksheetID = ?";
+    $deleteworksheet = sqlsrv_query($con, $deleteworksheetSQL, $params, $options);
+    if ($deleteworksheet === false)
+        die(print_r(sqlsrv_errors(), true));
+}
\ No newline at end of file
diff --git a/teacher/MyCourses/ViewCourse/PublishWorksheet.php b/teacher/MyCourses/ViewCourse/PublishWorksheet.php
new file mode 100644
index 0000000..2246fb0
--- /dev/null
+++ b/teacher/MyCourses/ViewCourse/PublishWorksheet.php
@@ -0,0 +1,18 @@
+<?php
+    include '../../../base.php';
+
+    if (isset($_POST['worksheetID']))
+    {
+        $worksheetID = $_POST['worksheetID'];
+        $params = array($worksheetID);
+        $options = array("Scrollable" => 'static');
+        $publishworksheetSQL = "UPDATE Worksheets SET EditStatus='Released' WHERE WorksheetID = ?";
+        $publishworksheet = sqlsrv_query($con, $publishworksheetSQL, $params, $options);
+        if ($publishworksheet === false)
+            die(print_r(sqlsrv_errors(), true));
+    }
+    else
+    {
+        echo "Data Error";
+    }
+?>
\ No newline at end of file
diff --git a/teacher/MyCourses/ViewCourse/Students/ViewStudentProfile/index.php b/teacher/MyCourses/ViewCourse/Students/ViewStudentProfile/index.php
new file mode 100644
index 0000000..e852e5e
--- /dev/null
+++ b/teacher/MyCourses/ViewCourse/Students/ViewStudentProfile/index.php
@@ -0,0 +1,205 @@
+<!-- View student profile (index.php) for Teacher account -->
+
+<?php include "../../../../../base.php"; ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet">
+    
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+</head>
+        
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if($_SESSION['Role'] != 'Teacher')
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+        $courseID = isset($_POST['courseID']) ? $_POST['courseID'] : 0;
+        $enrollmentID = isset($_POST['enrollmentID']) ? $_POST['enrollmentID'] : 0;
+        if (($courseID == 0) || ($enrollmentID == 0))
+            echo "<meta http-equiv='refresh' content='0;../' />";
+    ?>        
+
+    <body>
+        <div id="wrapper">
+            <div id = "sidebar"></div>
+            <div id="page-content-wrapper">
+                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <span class="hamb-top"></span>
+                    <span class="hamb-middle"></span>
+                    <span class="hamb-bottom"></span>
+                </button>
+                <div class="container-fluid">
+                    <div class="row">
+                        <div class="col-lg-4 col-md-6">
+                            <div class="panel panel-primary" style="min-height:250px;max-height:250px">
+                                <div class="panel-heading">
+                                    <h4>Student Info</h4>
+                                </div>
+                                <div class="panel-body">
+                                    <p>Name:</p>
+                                    <p>Institution:</p>
+                                    <p>Courses completed:</p>
+                                    <p>Sessions Active in Smalltalk:</p>
+                                </div>
+                                    
+                            </div>
+                        </div>
+                        <div class="col-lg-4 col-md-6">
+                            <div class="panel panel-primary" style="min-height:250px;max-height:250px;overflow-y:scroll">
+                                <div class="panel-heading">
+                                    <h4>Courses Taken</h4>
+                                </div>
+                                <div class="panel-body">
+                                    <table class="table table-hover">
+                                        <thead>
+                                            <tr>
+                                                <th>Course Name</th>
+                                                <th>Instructor</th>
+                                                <th>Status</th>
+                                                <th>Go To</th>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+                                            <tr>
+                                                <td>ELCT 101</td>
+                                                <td>Hunter</td>
+                                                <td>Completed</td>
+                                                <td><a href="/Teacher/Archive/Courses/ViewCourse/">Course in Archive</a></td>
+                                            </tr>
+                                            <tr>
+                                                <td>ELCT 102</td>
+                                                <td>Teacher Name</td>
+                                                <td>Ongoing</td>
+                                                <td><a href="/Teacher/MyCourses/ViewCourse/">View My Course</a></td>
+                                            </tr>
+                                        </tbody>
+                                    </table>
+                                </div>
+                                    
+                            </div>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col-lg-8 col-md-10">
+                            <div class="panel panel-primary">
+                                <div class="panel-heading">
+                                    Submitted Worksheets
+                                </div>
+                                <div class="panel-body">
+                                    <table class="table table-hover">
+                                        <thead>
+                                            <tr>
+                                                <th>Course Name</th>
+                                                <th>Worksheet Number</th>
+                                                <th>Performance</th>
+                                                <th>Go To</th>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+        <?php
+            $params = array($courseID, $enrollmentID);
+            $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+            $worksheetsubmissionsSQL = "SELECT CT.CourseName, WS.WorksheetNumber, SS.StudentSubmissionID, WS.WorksheetID
+            FROM CourseTypes CT, Courses C, Enrollment ER, Worksheets WS, StudentSubmissions SS
+            WHERE C.CourseID = ? AND
+                  ER.EnrollmentID = ? AND
+				  ER.CourseID = C.CourseID AND
+                  WS.CourseID = C.CourseID AND
+                  C.CourseTypesID = CT.CourseTypesID AND
+                  SS.EnrollmentID = ER.EnrollmentID AND
+                  SS.WorksheetID = WS.WorksheetID";
+            $worksheetsubmissions = sqlsrv_query($con, $worksheetsubmissionsSQL, $params, $options);
+            if($worksheetsubmissions === false)
+                die (print_r(sqlsrv_errors(), true));
+            $resultlength = sqlsrv_num_rows($worksheetsubmissions);
+            if($resultlength == 0)
+            {
+                echo "No Submissions!";
+            }
+            else
+            {
+                $coursenames = [];
+                $worksheetnumbers = [];
+                $studentsubmissionids = [];
+                $worksheetids = [];
+                while(sqlsrv_fetch($worksheetsubmissions) === true)
+                {
+                    $coursenames[] = sqlsrv_get_field($worksheetsubmissions, 0);
+                    $worksheetnumbers[] = sqlsrv_get_field($worksheetsubmissions, 1);
+                    $studentsubmissionids[] = sqlsrv_get_field($worksheetsubmissions, 2);
+                    $worksheetids[] = sqlsrv_get_field($worksheetsubmissions, 3);
+                }
+                for ($i = 0; $i < $resultlength; $i++)
+                {
+                    echo "<tr><td>$coursenames[$i]</td><td>$worksheetnumbers[$i]</td><td>TBD</td><td><form method =\"post\" action=\"/Teacher/MyCourses/ViewCourse/ViewWorksheet/ViewSubmission/\" name=\"viewsubmissionlink{$i}\" id=\"viewsubmissionlink{$i}\"><input hidden type=\"text\" name=\"worksheetID\" value=\"$worksheetids[$i]\"><input hidden type=\"text\" name=\"submissionID\" value=\"$studentsubmissionids[$i]\"><button class=\"btn btn-primary\">View Submission</button></form></td></tr>";
+                }
+            }
+        ?>
+                                        </tbody>
+                                    </table>
+                                </div>
+                            </div>
+                           
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <!-- Include all compiled plugins (below), or include individual files as needed -->
+        <script src="/js/bootstrap.min.js"></script>
+        <script>
+        $("#menu-toggle").click(function(e) {
+            e.preventDefault();
+            $("#wrapper").toggleClass("toggled");
+        });
+        </script>
+    </body>
+    <?php
+    }
+}
+    
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+</html>
+
diff --git a/teacher/MyCourses/ViewCourse/Students/index.php b/teacher/MyCourses/ViewCourse/Students/index.php
new file mode 100644
index 0000000..68d7fb7
--- /dev/null
+++ b/teacher/MyCourses/ViewCourse/Students/index.php
@@ -0,0 +1,128 @@
+<!-- View students (index.php) for basic Teacher account -->
+
+<?php include "../../../../base.php"; ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <title> Gonzaga Small Talk</title>
+
+    <!-- Bootstrap -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/simple-sidebar.css" rel="stylesheet">
+    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
+    <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
+    
+    <!-- Including Header -->
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script>
+        $(function(){
+            $("#header").load("/header.php");
+        });
+        $(function(){
+            $("#sidebar").load("/sidebar.php");
+        });
+    </script>
+
+</head>
+        
+<?php
+if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
+{
+    if($_SESSION['Role'] != 'Teacher')
+    {
+        ?>
+        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
+        <p>Click <a href="/">here</a> if you don't want to wait</p>
+        <meta http-equiv='refresh' content='5;/' />
+        <?php
+    }
+    else
+    {
+    ?>        
+
+    <body>
+        <div id="wrapper">
+            <div id = "sidebar"></div>
+            <div id="page-content-wrapper">
+            <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                <span class="hamb-top"></span>
+                <span class="hamb-middle"></span>
+                <span class="hamb-bottom"></span>
+            </button>
+                <div class="container-fluid">
+                    <div class="row">
+                        <div class="col-md-8">
+                            <div class="panel panel-primary">
+                                <div class="panel-heading">
+                                    <h4>Course Details</h4>
+                                </div>
+                                <div class="panel-body">
+                                    <p>Course Name:</p>
+                                    <p>Institution:</p>
+                                    <p>Session:</p>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col-md-8">
+                            <div class="panel panel-primary">
+                                <div class="panel-heading">
+                                    <h4>Students</h4>
+                                </div>
+                                <div class="panel-body">
+                                    <table class="table table-hover">
+                                        <thead>
+                                            <tr>
+                                                <th>Name</th>
+                                                <th>Worksheets Completed</th>
+                                                <th>Go To</th>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+                                            <tr>
+                                                <td>Stu Dent</td>
+                                                <td>4/6</td>
+                                                <td><a href="ViewStudentProfile/?sid=">Review Student</a></td>
+                                            </tr>
+                                        </tbody>
+                                    </table>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <!-- Include all compiled plugins (below), or include individual files as needed -->
+        <script src="/js/bootstrap.min.js"></script>
+        <script>
+        $("#menu-toggle").click(function(e) {
+            e.preventDefault();
+            $("#wrapper").toggleClass("toggled");
+        });
+        </script>
+    </body>
+    <?php
+    }
+}
+    
+else
+{
+    ?>
+    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
+    <p>Click <a href="/">here</a> if you don't want to wait</p>
+    <meta http-equiv='refresh' content='5;/' />
+    <?php
+}
+?>
+</html>
diff --git a/teacher/Archive/index.php b/teacher/MyCourses/ViewCourse/ViewWorksheet/AnnotationEditor/index.php
similarity index 63%
rename from teacher/Archive/index.php
rename to teacher/MyCourses/ViewCourse/ViewWorksheet/AnnotationEditor/index.php
index 0638667..b29c5eb 100644
--- a/teacher/Archive/index.php
+++ b/teacher/MyCourses/ViewCourse/ViewWorksheet/AnnotationEditor/index.php
@@ -1,6 +1,6 @@
-<!-- Archive Home (index.html) for Teacher account -->
+<!-- View Worksheet (index.php) for Teacher account -->
 
-<?php include "../../base.php"; ?>
+<?php include "../../../../base.php"; ?>
 <!DOCTYPE html>
 <html lang="en">
 <head>
@@ -17,7 +17,7 @@
     <link href="/css/SidebarPractice.css" rel="stylesheet">
     
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -69,8 +69,32 @@
                             <span class="hamb-bottom"></span>
                         </button>
                             <!-- BEGIN PAGE CONTENT -->
-                            <h2>Teacher Name: Archive</h2>
-                            <p>Archive access home for teacher user.  Through this page, the teacher will be able to view all non-active courses (decision to be made: all courses, or only those that are taught by that particular teacher?).  Links will be provided in the Archive Sidebar for navigation to different sections of the Archive, including courses, worksheets, and expressions (search functionality included in each)  </p>
+                            <h1>Course Title: Edit Worksheet #_</h1>
+                            
+                            <!-- Worksheet Info -->
+                            <div class="panel panel-primary col-lg-4">
+                                <div class="panel-heading">Worksheet Information</div>
+                                <div class="panel-body">
+                                    <p>Topic, level, date</p>
+                                </div> 
+                            </div>
+                            
+                            <!-- Worksheet contents -->
+                            <div class="panel panel-primary col-lg-12">
+                                <div class="panel-heading">Display Original worksheet expressions</div>
+                                <div class="panel-body">
+                                    <p>Sentence number, student, expression, context/vocab</p>
+                                </div> 
+                            </div>
+                            
+                            <!-- Student submissions -->
+                            <div class="panel panel-primary col-lg-12">
+                                <div class="panel-heading">Submissions</div>
+                                <div class="panel-body">
+                                    <p>Student(link), date, view submission(link)</p>
+                                </div> 
+                            </div>
+                                                   
                             <!-- END PAGE CONTENT -->
                         </div>
                     </div>
@@ -79,7 +103,7 @@
         </div>
 
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="/js/bootstrap.min.js"></script>
         <script>
@@ -102,4 +126,4 @@
     <?php
 }
 ?>
-</html>
+</html>
\ No newline at end of file
diff --git a/teacher/MyCourses/ViewCourse/ViewWorksheet/ViewSubmission/index.php b/teacher/MyCourses/ViewCourse/ViewWorksheet/ViewSubmission/index.php
index 662f051..842663b 100644
--- a/teacher/MyCourses/ViewCourse/ViewWorksheet/ViewSubmission/index.php
+++ b/teacher/MyCourses/ViewCourse/ViewWorksheet/ViewSubmission/index.php
@@ -15,29 +15,40 @@
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
     
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
         $(function(){
             $("#sidebar").load("/sidebar.php");
         });
     </script>
-
-    <!-- Background Setup -->
     <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
+    .divider {
+        width:100%;
+        text-align:center;
+        height:inherit;
+    }
+
+    .divider hr {
+        margin-left:auto;
+        margin-right:auto;
+        width:45%;
+        
+
+    }
+
+    .left {
+        float:left;
+    }
+
+    .right {
+        float:right;
+    }
     </style>
+
 </head>
         
 <?php
@@ -53,46 +64,189 @@
     }
     else
     {
+        $worksheetID = isset($_POST['worksheetID']) ? $_POST['worksheetID'] : 0;
+        $studentsubmissionID = isset($_POST['submissionID']) ? $_POST['submissionID'] : 0;
     ?>        
 
     <body>
-        <div id="header"></div>
         <div id="wrapper">
             <div id = "sidebar"></div>
             <div id="page-content-wrapper">
+                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <span class="hamb-top"></span>
+                    <span class="hamb-middle"></span>
+                    <span class="hamb-bottom"></span>
+                </button>
                 <div class="container-fluid">
                     <div class="row">
-                        <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
+                        <div class="col-md-10">
+                        
                             <!-- BEGIN PAGE CONTENT -->
                             <div class="panel panel-primary">
-                                <div class="panel-heading">Submission Information</div>
+                                <div class="panel-heading">Submission Details and Statistics</div>
                                 <div class="panel-body">
-                                    <p>Student name, date of submission</p>
+    <?php
+        echo "$worksheetID $studentsubmissionID";
+        $params = array($worksheetID, $studentsubmissionID);
+        $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+        $submissioninfoSQL = "SELECT S.FirstName, S.LastName, CONVERT(VARCHAR(11), SS.Date,106), CT.CourseName, WS.WorksheetNumber, SS. AttemptNumber, TP.Topic
+            FROM Students S, Enrollment ER, Worksheets WS, Topics TP, StudentSubmissions SS, Courses C, CourseTypes CT
+            WHERE WS.WorksheetID = ? AND
+                  WS.WorksheetID = SS.WorksheetID AND
+                  SS.StudentSubmissionID = ? AND
+                  SS.EnrollmentID = ER.EnrollmentID AND
+                  ER.StudentID = S.StudentID AND
+                  TP.TopicID = WS.TopicID AND
+                  WS.CourseID = C.CourseID AND
+                  C.CourseTypesID = CT.CourseTypesID";
+        $submissioninfo = sqlsrv_query($con, $submissioninfoSQL, $params, $options);
+        if($submissioninfo === false)
+            die (print_r(sqlsrv_errors(), true));
+        sqlsrv_fetch($submissioninfo);
+        $firstname = sqlsrv_get_field($submissioninfo, 0);
+        $lastname = sqlsrv_get_field($submissioninfo, 1);
+        $date = sqlsrv_get_field($submissioninfo, 2);
+        $coursename = sqlsrv_get_field($submissioninfo, 3);
+        $worksheetnumber = sqlsrv_get_field($submissioninfo, 4);
+        $attemptnumber = sqlsrv_get_field($submissioninfo, 5);
+        $topic = sqlsrv_get_field($submissioninfo, 6);
+                              echo "<p>Student name: $firstname $lastname</p>
+                                    <p>Date: $date</p>
+                                    <p>$coursename: Worksheet #$worksheetnumber Attempt $attemptnumber</p>
+                                    <p>Topic: $topic</p>";
+        ?>
                                 </div> 
                             </div>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col-md-10">
+    
+                            <div class="panel panel-default">
+                                <div class="panel-heading">Submitted Sentences</div>
+                                <div class="panel-body">
+    <?php
+        $params = array[$worksheetID, $studentsubmissionID];
+        $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+        $submissionreformulationsSQL = "SELECT EX.SentenceNumber, EX.Expression, EX.[Context/Vocabulary], RF.ReformulationText, SA.ReformulationText, EX.AllDo
+        FROM Expressions EX, Reformulations RF, StudentAttempts SA, StudentSubmissions SS
+        WHERE EX.WorksheetID = ? AND
+        SS.WorksheetID = EX.WorksheetID AND
+        RF.WorksheetID = EX.WorksheetID AND
+        SS.StudentSubmissionID = ? AND
+        SA.StudentSubmissionID = SS.StudentSubmissionID";
+        
+        $submissionreformulations = sqlsrv_query($con, $submissionreformulationsSQL, $params, $options);
+        if ($submissionreformulations === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_expressions = sqlsrv_num_rows($submissionreformulations);
+        
+        $sentencenumbers = [];
+        $expressions = [];
+        $contexts = [];
+        $answers = [];
+        $studentreformulations = [];
+        $alldos = [];
+        
+        while(sqlsrv_fetch($submissionreformulations) === true)
+        {
+            $sentencenumbers[] = sqlsrv_get_field($submissionreformulations, 0);
+            $expressions[] = sqlsrv_get_field($submissionreformulations, 1);
+            $contexts[] = sqlsrv_get_field($submissionreformulations, 2);
+            $answers[] = sqlsrv_get_field($submissionreformulations, 3);
+            $studentreformulations[] = sqlsrv_get_field($submissionreformulations, 4);
+            $alldos[] = sqlsrv_get_field($submissionreformulations, 5);
+        }
+        
+        ?>
+                                    <div class="panel-group" id="accordian">
     <?php
-        for ($i = 1; $i <= 10; $i++) // from i = 1 to number of expressions submitted (all starred, all of own authorship)
+        for($i = 0 ; $i < num_expressions ; $i++)
         {
+            
     ?>
-                            <div class="panel panel-default">
-                                <div class="panel-heading">Expression <?=$i?></div>
-                                <div class="panel-body">
-                                    <p>Display sentence number, Text Display[Original Expression], Text Display[Enter Context/Vocab]</p>
-                                    <p>Text Display[Student], Text Display[Submitted text]</p>
-                                    
+                                        <div class="panel">
+                                            <div class="panel-heading">
+                                                <h3 class="panel-title">
+                                                   <a class="accordian-toggle" data-toggle="collapse" data-parent="#accordian" href="#collapse<?php echo"$i";?>" style="width:60%">
+                                                        <span>Sentence #<?php echo "sentencenumbers[$i]";?></span>
+                                                    </a>
+                                                    <?php if ($alldos[$i])
+                                                        echo "<span class=\"glyphicon glyphicon-star pull-right\" style=\"font-size:20px; \"></span>";
+                                                        else echo "<span class=\"pull-right\">Authored</span>";?>
+                                                </h3>
+                                            </div>
+                                            <div id="collapse<?php echo"$i";?>" class="panel-collapse collapse">
+                                                <div class="panel-body">
+                                                    
+                                                    <table width="100%">
+                                                      <td><hr /></td>
+                                                      <td style="width:1px; padding: 0 10px; white-space: nowrap;"><strong>Original</strong></td>
+                                                      <td><hr /></td>
+                                                    </table>
+                                                    <div class="row">
+                                                        <div class="col-sm-7" >
+                                                            <textarea class="form-control" disabled><?php echo "$expressions[$i]";?></textarea>
+                                                        </div>
+                                                        <div class="col-sm-4 col-xs-11">
+                                                            <textarea class="form-control" disabled>Context/Vocab: <?php echo "$context[$i]";?></textarea>
+                                                        </div>
+                                                        
+                                                        
+                                                    </div>
+                                                    
+                                                    <table width="100%">
+                                                      <td><hr /></td>
+                                                      <td style="width:1px; padding: 0 10px; white-space: nowrap;"><strong>Corrected</strong></td>
+                                                      <td><hr /></td>
+                                                    </table>
+                                                    <div class="row">
+                                                        <div class="col-sm-6 col-md-8">
+                                                            <textarea class="form-control" disabled><?php echo "$answers[$i]";?></textarea>
+                                                        </div>
+                                                        <div class="col-sm-6 col-md-4">
+                                                            <audio controls title="Reformulation">
+                                                                <source src="/Media/Audio/sample.mp3" type="audio/mpeg">
+                                                                Your Browser does not support this audio element
+                                                            </audio>
+                                                        </div>
+                                                    </div>
+                                                    <table width="100%">
+                                                      <td><hr /></td>
+                                                      <td style="width:1px; padding: 0 10px; white-space: nowrap;"><strong>Submitted</strong></td>
+                                                      <td><hr /></td>
+                                                    </table>
+                                                    <div class="row">
+                                                        <div class="col-sm-6 col-md-8">
+                                                            <textarea class="form-control" disabled ><?php echo "$studentreformulations[$i]";?></textarea>
+                                                        </div>
+                                                        <div class="col-sm-6 col-md-4">
+                                                            <audio controls title="Reformulation">
+                                                                <source src="/Media/Audio/sample.mp3" type="audio/mpeg">
+                                                                Your Browser does not support this audio element
+                                                            </audio>
+                                                        </div>
+                                                        
+                                                    </div>
+                                                    <table width="100%">
+                                                      <td><hr /></td>
+                                                      <td style="width:1px; padding: 0 10px; white-space: nowrap;"><strong>Assessment</strong></td>
+                                                      <td><hr /></td>
+                                                    </table>
+                                                    <div class="row">
+                                                        <div class="col-sm-12">
+                                                            <textarea class="form-control">Comments Go Here!</textarea>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                        <?php
+        }
+        ?>
+                                    </div>                              
                                 </div>
                             </div>
-    <?php              
-        }
-    ?>
-                            
-                             
-                            <!-- END PAGE CONTENT -->
                         </div>
                     </div>
                 </div>
@@ -100,7 +254,7 @@
         </div>
 
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="/js/bootstrap.min.js"></script>
         <script>
diff --git a/teacher/MyCourses/ViewCourse/ViewWorksheet/index.php b/teacher/MyCourses/ViewCourse/ViewWorksheet/index.php
index 8bd86d8..72304e1 100644
--- a/teacher/MyCourses/ViewCourse/ViewWorksheet/index.php
+++ b/teacher/MyCourses/ViewCourse/ViewWorksheet/index.php
@@ -15,35 +15,23 @@
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
     
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
         $(function(){
             $("#sidebar").load("/sidebar.php");
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
         
 <?php
 if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
 {
-    if($_SESSION['Role'] != 'teacher')
+    if($_SESSION['Role'] != 'Teacher')
     {
         ?>
         <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
@@ -53,45 +41,170 @@
     }
     else
     {
+        $worksheetID = isset($_POST['worksheetID']) ? $_POST['worksheetID'] : 0;
+        if ($worksheetID == 0)
+            echo "<meta http-equiv='refresh' content='40;/' />";
+        $worksheetDate = isset($_POST['worksheetDate']) ? $_POST['worksheetDate'] : 0;
+        $worksheetTopic = isset($_POST['worksheetTopic']) ? $_POST['worksheetTopic'] : 0;
+        $worksheetStatus = isset($_POST['worksheetStatus']) ? $_POST['worksheetStatus'] : 0;
+        $worksheetNumber = isset($_POST['worksheetNumber']) ? $_POST['worksheetNumber'] : 0;
+        $className = isset($_POST['className']) ? $_POST['className'] : 0;
+        $params = array($worksheetID);
+        $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+        $worksheetexpressionsSQL = "SELECT E.SentenceNumber, S.StudentID, S.FirstName, S.LastName, E.Expression, E.ExpressionID, E.AllDo
+                                    FROM Expressions E, Students S, Enrollment ER
+                                    WHERE E.WorksheetID = ? AND
+                                          ER.StudentID = E.StudentID AND
+                                          S.StudentID = ER.StudentID 
+                                    ORDER BY E.SentenceNumber";
+        $worksheetexpressions = sqlsrv_query($con, $worksheetexpressionsSQL, $params, $options);
+        if ($worksheetexpressions === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_expressions = sqlsrv_num_rows($worksheetexpressions);
+        $new_expression_number = $num_expressions + 1;
+        $sent_numbers = [];
+        $student_expression_ids = [];
+        $first_names = [];
+        $last_names = [];
+        $expressions = [];
+        $ids = [];
+        $alldos = [];
+        while(sqlsrv_fetch($worksheetexpressions) === true)
+        {
+            $sent_numbers[] = sqlsrv_get_field($worksheetexpressions, 0);
+            $student_expression_ids[] = sqlsrv_get_field($worksheetexpressions, 1);
+            $first_names[] = sqlsrv_get_field($worksheetexpressions,2);
+            $last_names[] = sqlsrv_get_field($worksheetexpressions, 3);
+            $expressions[] = sqlsrv_get_field($worksheetexpressions, 4);
+            $ids[] = sqlsrv_get_field($worksheetexpressions, 5);
+            $alldos[] = sqlsrv_get_field($worksheetexpressions, 6);
+        }
+        
+        $worksheetsubmissionsSQL = "SELECT S.FirstName, S.LastName, SS.StudentSubmissionID, CONVERT(VARCHAR(11), SS.Date,106), SS.AttemptNumber
+        FROM Students S, Enrollment ER, StudentSubmissions SS
+        WHERE SS.WorksheetID = ? AND
+              ER.EnrollmentID = SS.EnrollmentID AND
+              S.StudentID = ER.StudentID";
+        $worksheetsubmissions = sqlsrv_query($con, $worksheetsubmissionsSQL, $params, $options);
+        if($worksheetsubmissions === false)
+            die(print_r(sqlsrv_errors(),true));
+        $num_submissions = sqlsrv_num_rows($worksheetsubmissions);
+        $sub_first_names = [];
+        $sub_last_names = [];
+        $sub_ids = [];
+        $sub_dates = [];
+        $sub_attempts = [];
+        while(sqlsrv_fetch($worksheetsubmissions) === true)
+        {
+            $sub_first_names[] = sqlsrv_get_field($worksheetsubmissions, 0);
+            $sub_last_names[] = sqlsrv_get_field($worksheetsubmissions, 1);
+            $sub_ids[] = sqlsrv_get_field($worksheetsubmissions, 2);
+            $sub_dates[] = sqlsrv_get_field($worksheetsubmissions, 3);
+            $sub_attempts[] = sqlsrv_get_field($worksheetsubmissions, 4);
+        }
     ?>        
 
     <body>
-        <div id="header"></div>
         <div id="wrapper">
             <div id = "sidebar"></div>
             <div id="page-content-wrapper">
+                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <span class="hamb-top"></span>
+                    <span class="hamb-middle"></span>
+                    <span class="hamb-bottom"></span>
+                </button>
                 <div class="container-fluid">
                     <div class="row">
-                        <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                            <!-- BEGIN PAGE CONTENT -->
-                            <h1>Course Title: Edit Worksheet #_</h1>
-                            
+                        <div class="col-xs-6">
+                            <h1>Edit Worksheet<form method="POST" name="AnnotationEditorOpen" id="AnnotationEditorOpen">
+                                <input hidden type="text" id="worksheetID" name="worksheetID">
+                                <button class="btn btn-lg btn-primary" type="submit">Annotate</button>
+                            </form></h1>
+                        </div>
+                        
+                    </div>
+                    <div class="row">
+                        <div class="col-sm-4">
                             <!-- Worksheet Info -->
-                            <div class="panel panel-primary col-lg-4">
-                                <div class="panel-heading">Worksheet Information</div>
+                            <div class="panel panel-primary">
+                                <div class="panel-heading">Worksheet Info</div>
                                 <div class="panel-body">
-                                    <p>Topic, level, date</p>
+                                    <?php
+                                    echo "
+                                    <h2>Course: $className</h2>
+                                    <h5>Worksheet Number: $worksheetNumber</h5>
+                                    <h5>Date: $worksheetDate</h5>
+                                    <h5>Topic: $worksheetTopic</h5>";?>
                                 </div> 
                             </div>
+                        </div>
+                        <div class="col-sm-8">
                             
                             <!-- Worksheet contents -->
-                            <div class="panel panel-primary col-lg-12">
-                                <div class="panel-heading">Display Original worksheet expressions</div>
+                            <div class="panel panel-primary" style="min-height:400pxs;max-height-400px; overflow-y:scroll">
+                                <div class="panel-heading">Worksheet Expressions</div>
                                 <div class="panel-body">
-                                    <p>Sentence number, student, expression, context/vocab</p>
+                                    <table class="table table-hover">
+                                        <thead>
+                                            <tr>
+                                                <th>#</th>
+                                                <th>Student</th>
+                                                <th>Expression</th>
+                                                <th>All-Do</th>
+                                            </tr>
+                                        </thead>
+                                        <tbody name="ExpressionTable">
+<?php
+        for($i = 0; $i < $num_expressions; $i++)
+        {
+            echo "<tr>
+                        <td>$sent_numbers[$i]</td>
+                        <td>$first_names[$i] $last_names[$i]</td>
+                        <td>$expressions[$i]</td>
+                        <td>";
+            if ($alldos[$i] == 1)
+                echo "<span class=\"glyphicon glyphicon-ok\"></span>";
+            else
+                echo "<span class=\"glyphicon glyphicon-remove\"></span>";
+            echo "
+                </td></tr>";
+        }
+?>
+                                        </tbody>
+                                    </table>
+                                    
                                 </div> 
                             </div>
-                            
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col-xs-12">
                             <!-- Student submissions -->
-                            <div class="panel panel-primary col-lg-12">
+                            <div class="panel panel-primary">
                                 <div class="panel-heading">Submissions</div>
                                 <div class="panel-body">
-                                    <p>Student(link), date, view submission(link)</p>
+                                    <table class="table table-hover">
+                                        <thead>
+                                            <tr>
+                                                <th>Student</th>
+                                                <th>Attempt #</th>
+                                                <th>Date</th>
+                                                <th>Go To</th>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+<?php
+        for($i = 0; $i < $num_submissions; $i++)
+        {
+            echo "<tr>
+                        <td>$sub_first_names[$i] $sub_last_names[$i] </td>
+                        <td>$sub_attempts[$i] </td>
+                        <td>$sub_dates[$i] </td>
+                        <td><form method=\"POST\" action=\"ViewSubmission/\" name=\"ViewSubmission\"><input hidden type=\"text\" name=\"submissionID\" value=\"$sub_ids[$i]\"><input hidden type=\"text\" name=\"worksheetID\" value=\"$worksheetID\"><button class=\"btn btn-primary\">View Submission</button></form></td>";
+        }
+?>
+                                        </tbody>
+                                    </table>
                                 </div> 
                             </div>
                                                    
@@ -103,7 +216,7 @@
         </div>
 
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="/js/bootstrap.min.js"></script>
         <script>
diff --git a/teacher/MyCourses/ViewCourse/WorksheetEditor/NewExpression.php b/teacher/MyCourses/ViewCourse/WorksheetEditor/NewExpression.php
new file mode 100644
index 0000000..7c8013f
--- /dev/null
+++ b/teacher/MyCourses/ViewCourse/WorksheetEditor/NewExpression.php
@@ -0,0 +1,99 @@
+<?php
+
+include '../../../../base.php';
+
+if ((isset($_POST['worksheetID'])) && (isset($_POST['courseID'])))
+{
+    $sentence_number = isset($_POST['newexpressionnumber']) ? $_POST['newexpressionnumber'] : 0;
+    $worksheetID = $_POST['worksheetID'];
+    $courseID = $_POST['courseID'];
+    $params = array($worksheetID);
+    $options = array("Scrollable" => 'static');
+    $coursestudentsSQL = "SELECT S.StudentID, S.FirstName, S.LastName
+                          FROM Enrollment as ER, Worksheets as W, Courses C, Students S
+                          WHERE W.WorksheetID = ? AND
+                                C.CourseID = W.CourseID AND
+                                ER.CourseID = C.CourseID AND
+                                S.StudentID = ER.StudentID";
+    $coursestudents = sqlsrv_query($con, $coursestudentsSQL, $params, $options);
+    if ($coursestudents === false)
+        die(print_r(sqlsrv_errors(), true));
+    $num_students = sqlsrv_num_rows($coursestudents);
+    $studentsids = [];
+    $first_names = [];
+    $last_names = [];
+    while(sqlsrv_fetch($coursestudents) === true)
+    {
+        $studentids[] = sqlsrv_get_field($coursestudents, 0);
+        $first_names[] = sqlsrv_get_field($coursestudents, 1);
+        $last_names[] = sqlsrv_get_field($coursestudents, 2);
+    }
+    
+    
+
+echo "
+<div class=\"panel-body\">
+    <div class=\"control-group controls\" id=\"fields\">
+        <form>
+            <input hidden type=\"text\" name=\"newexpressionnumber\" value=\"$sentence_number\">
+            <input hidden type=\"text\" name=\"worksheetID\" value=\"$worksheetID\">
+            <input hidden type=\"text\" name=\"courseID\" value=\"$courseID\">
+            <div class=\"form-group row\">
+                
+                <div class=\"col-xs-4 col-md-6\">
+                    <h4 style=\"text-decoration:underline\">Sentence #$sentence_number</h4>
+                    <label>Student:
+                    <select class=\"form-control\" name=\"selectstudent\">
+                        <option  selected=\"selected\" value=\"0\">--Select Student--</option>";
+for($i = 0; $i < $num_students; $i++)
+    echo "<option value=\"$studentids[$i]\">$first_names[$i] $last_names[$i]</option>";
+echo "                       
+                    </select></label>
+                </div>
+                <div class=\"col-xs-2\">
+                    <div class=\"radio\">
+                        <label><input type=\"radio\" value=\"all\" name=\"alldo\">All-Do</label>
+                    </div>
+                    <div class=\"radio\">
+                        <label><input type=\"radio\" value=\"individual\" name=\"alldo\" checked=\"checked\">Individual</label>
+                    </div>
+
+                    
+                </div>
+            </div>
+            <div class=\"form-group row\">
+                <div class=\"col-md-8 col-xs-12\">
+                    <label for=\"CorrectedExpr\">Expression:</label>
+                        <input type=\"text\" class=\"form-control\" name=\"Expression\">
+                </div>
+            </div>
+            <div class=\"form-group row\">
+                <div class=\"col-md-5 col-xs-7\">
+                    <label for=\"ContextVocab\">Context/Vocab: </label>
+                    <input name=\"ContextVocab\"  type=\"text\" class=\"form-control\">
+                </div>
+                <div class=\"col-md-3 col-xs-5\">
+                    <label for=\"PronCorr\">Pronunciation:</label>
+                    <input type=\"text\"  class=\"form-control\" name=\"Pronunciation\">
+                </div>
+            </div>
+            
+            <div class=\"form-group row\">
+                <div class=\"col-xs-12\">
+                    <div class=\"btn-group\" role=\"group\">
+                        <button type=\"button\" name=\"SaveExpression\"  class=\"btn btn-primary\">Save</button>
+                    </div>";
+                   /*<div class=\"btn-group\" role=\"group\">
+                        <button type=\"button\" id=\"SaveAndCreateNewExpression\"  class=\"btn btn-primary\">Save and Create a New Expression</button>
+                    </div>*/
+echo "
+                </div>
+            </div>
+        </form>
+    </div>
+</div>
+";
+
+    
+}
+?>
\ No newline at end of file
diff --git a/teacher/MyCourses/ViewCourse/WorksheetEditor/PopulateEditor.php b/teacher/MyCourses/ViewCourse/WorksheetEditor/PopulateEditor.php
new file mode 100644
index 0000000..7b50898
--- /dev/null
+++ b/teacher/MyCourses/ViewCourse/WorksheetEditor/PopulateEditor.php
@@ -0,0 +1,136 @@
+<?php 
+require_once ('../../../../base.php');
+//test connection speed.. require vs include
+
+if ((isset($_POST['expressionID'])) && (isset($_POST['courseID'])) && (isset($_POST['worksheetID'])))
+{
+    
+    $courseID = $_POST['courseID'];
+    $worksheetID = $_POST['worksheetID'];
+    $expressionID = $_POST['expressionID'];
+    $params = array($expressionID);
+
+    $options = array("Scrollable" => 'static');
+    $coursestudentsSQL = "SELECT S.StudentID, S.FirstName, S.LastName
+                          FROM Expressions as E, Enrollment as ER, Worksheets as W, Courses C, Students S
+                          WHERE E.ExpressionID = ? AND
+                                W.WorksheetID = E.WorksheetID AND
+                                C.CourseID = W.CourseID AND
+                                ER.CourseID = C.CourseID AND
+                                S.StudentID = ER.StudentID";
+    $coursestudents = sqlsrv_query($con, $coursestudentsSQL, $params, $options);
+    if ($coursestudents === false)
+        die(print_r(sqlsrv_errors(), true));
+    $num_students = sqlsrv_num_rows($coursestudents);
+    $studentsids = [];
+    $first_names = [];
+    $last_names = [];
+    while(sqlsrv_fetch($coursestudents) === true)
+    {
+        $studentids[] = sqlsrv_get_field($coursestudents, 0);
+        $first_names[] = sqlsrv_get_field($coursestudents, 1);
+        $last_names[] = sqlsrv_get_field($coursestudents, 2);
+    }
+    
+    $expressiondataSQL = "SELECT E.Expression, E.[Context/Vocabulary], E.Pronunciation, S.StudentID, S.FirstName, S.LastName, E.AllDo, E.[SentenceNumber]
+                          FROM Expressions E, Students S
+                          WHERE E.ExpressionID = ? AND
+                                S.StudentID = E.StudentID";
+    $expressiondata = sqlsrv_query($con, $expressiondataSQL, $params, $options);
+    if ($expressiondata === false)
+        die(print_r(sqlsrv_errors(), true));
+    if (sqlsrv_fetch($expressiondata) === true)
+    {
+        $expression = sqlsrv_get_field($expressiondata, 0);
+        $context = sqlsrv_get_field($expressiondata, 1);
+        $pronunciation = sqlsrv_get_field($expressiondata, 2);
+        $selected_student_id = sqlsrv_get_field($expressiondata, 3);
+        $selected_first_name = sqlsrv_get_field($expressiondata, 4);
+        $selected_last_name = sqlsrv_get_field($expressiondata, 5);
+        $alldo = sqlsrv_get_field($expressiondata, 6);
+        $sentence_number = sqlsrv_get_field($expressiondata, 7);
+    }  
+
+    
+
+echo "
+<div class=\"panel-body\">
+    <div class=\"control-group controls\" id=\"fields\">
+        <form>
+            <input hidden type=\"text\" name=\"courseID\" value=\"$courseID\">
+            <input hidden type=\"text\" name=\"worksheetID\" value=\"$worksheetID\">
+            <input hidden type=\"text\" name=\"newexpressionnumber\" value=\"$sentence_number\">
+            <input hidden type=\"text\" name=\"expressionID\" value=\"$expressionID\">
+            
+            <div class=\"form-group row\">
+                
+                <div class=\"col-xs-4 col-md-6\">
+                    <h4 style=\"text-decoration:underline\">Sentence #$sentence_number</h4>
+                    <label>Student:
+                    <select class=\"form-control\" name=\"selectstudent\">
+                        <option  selected=\"selected\" value=\"$selected_student_id\">$selected_first_name $selected_last_name</option>";
+for($i = 0; $i < $num_students; $i++)
+{
+    if ($studentids[$i] != $selected_student_id)
+        echo "<option value=\"$studentids[$i]\">$first_names[$i] $last_names[$i]</option>";
+}
+echo "                       
+                    </select></label>
+                </div>
+                <div class=\"col-xs-2\">";
+if ($alldo == 1)
+{
+    echo "<div class=\"radio\">
+                        <label><input type=\"radio\" name=\"alldo\" checked=\"checked\">All-Do</label>
+                    </div>
+                    <div class=\"radio\">
+                        <label><input type=\"radio\" name=\"alldo\" >Individual</label>
+                    </div>";
+}
+else
+{
+    echo "<div class=\"radio\">
+                        <label><input type=\"radio\" name=\"alldo\">All-Do</label>
+                    </div>
+                    <div class=\"radio\">
+                        <label><input type=\"radio\" name=\"alldo\" checked=\"checked\">Individual</label>
+                    </div>";
+}
+echo "
+                    
+                </div>
+            </div>
+            <div class=\"form-group row\">
+                <div class=\"col-md-8 col-xs-12\">
+                    <label for=\"CorrectedExpr\">Expression:</label>
+                        <input type=\"text\" value=\"$expression\" class=\"form-control\" id=\"CorrectedExpr\" name=\"Expression\">
+                </div>
+            </div>
+            <div class=\"form-group row\">
+                <div class=\"col-md-5 col-xs-7\">
+                    <label for=\"ContextVocab\">Context/Vocab: </label>
+                    <input id=\"ContextVocab\" name=\"ContextVocab\" value=\"$context\" type=\"text\" class=\"form-control\">
+                </div>
+                <div class=\"col-md-3 col-xs-5\">
+                    <label for=\"PronCorr\">Pronunciation:</label>
+                    <input type=\"text\" value=\"$pronunciation\" class=\"form-control\" id=\"PronCorr\" name=\"Pronunciation\">
+                </div>
+            </div>
+            
+            <div class=\"form-group row\">
+                <div class=\"col-xs-12\">
+                    <div class=\"btn-group\" role=\"group\">
+                        <button type=\"button\" id=\"Save\"  name=\"SaveExpression\" class=\"btn btn-primary\">Save</button>
+                    </div>
+                    <div class=\"btn-group\" role=\"group\">
+                        <button type=\"button\" id=\"SaveAndCreateNew\" name=\"SaveAndCreateNew\" class=\"btn btn-primary\">Save and Create a New Expression</button>
+                    </div>
+
+                </div>
+            </div>
+        </form>
+    </div>
+</div>
+";
+}
+?>
\ No newline at end of file
diff --git a/teacher/MyCourses/ViewCourse/WorksheetEditor/SaveExpression.php b/teacher/MyCourses/ViewCourse/WorksheetEditor/SaveExpression.php
new file mode 100644
index 0000000..197d7d1
--- /dev/null
+++ b/teacher/MyCourses/ViewCourse/WorksheetEditor/SaveExpression.php
@@ -0,0 +1,97 @@
+<?php
+
+include '../../../../base.php';
+
+if ((isset($_POST['Expression'])) && (isset($_POST['ContextVocab'])) && (isset($_POST['Pronunciation'])) && (isset($_POST['studentID'])) && (isset($_POST['AllDo'])) && (isset($_POST['expressionNum'])) && (isset($_POST['worksheetID'])) && (isset($_POST['courseID'])))
+{
+    
+    
+    $Expression = $_POST['Expression'];
+    $ContextVocab = $_POST['ContextVocab'];
+    $Pronunciation = $_POST['Pronunciation'];
+    $StudentID = $_POST['studentID'];
+    $AllDo = $_POST['AllDo'];
+    $Number = $_POST['expressionNum'];
+    $worksheetID = $_POST['worksheetID'];
+    $courseID = $_POST['courseID'];
+    $expressionID = isset($_POST['expressionID']) ? $_POST['expressionID'] : 0;
+    
+    
+    $options = array( "Scrollable" => 'static' );
+    if ($expressionID == 0) 
+    {
+        $writeexpressionSQL = "INSERT INTO Expressions(Date, StudentID, Expression, Pronunciation, [Context/Vocabulary], SentenceNumber, CourseID, AllDo, WorksheetID, IsDeleted) VALUES (GETDATE(), ?, ?, ?, ?, ?, ?, ?, ?, 0)";
+        $params = array($StudentID, $Expression, $Pronunciation, $ContextVocab, $Number, $courseID, $AllDo, $worksheetID);
+    }
+    else 
+    {
+        $writeexpressionSQL = "UPDATE Expressions SET Date = GETDATE(), StudentID = ?, Expression = ?, Pronunciation = ?, [Context/Vocabulary] = ?, SentenceNumber = ?, CourseID = ?, AllDo = ?, WorksheetID = ?, IsDeleted = 0 
+        WHERE ExpressionID = ?";
+        $params = array($StudentID, $Expression, $Pronunciation, $ContextVocab, $Number, $courseID, $AllDo, $worksheetID, $expressionID);
+    }
+    
+    $writeexpression = sqlsrv_query($con, $writeexpressionSQL, $params, $options);
+    if ($writeexpression === false)
+        die(print_r(sqlsrv_errors(), true));
+    
+    /* Retrieve all expressions for the worksheet, and echo them to the calling page */
+    $params = array($worksheetID);
+    $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+    $worksheetexpressionsSQL = "SELECT E.SentenceNumber, S.StudentID, S.FirstName, S.LastName, E.Expression, E.ExpressionID, E.AllDo
+                                FROM Expressions E, Students S, Enrollment ER
+                                WHERE E.WorksheetID = ? AND
+                                      ER.StudentID = E.StudentID AND
+                                      S.StudentID = ER.StudentID 
+                                ORDER BY E.SentenceNumber";
+    $worksheetexpressions = sqlsrv_query($con, $worksheetexpressionsSQL, $params, $options);
+    if ($worksheetexpressions === false)
+        die(print_r(sqlsrv_errors(), true));
+    $num_expressions = sqlsrv_num_rows($worksheetexpressions);
+    $new_expression_number = $num_expressions + 1;
+    $sent_numbers = [];
+    $student_expression_ids = [];
+    $first_names = [];
+    $last_names = [];
+    $expressions = [];
+    $ids = [];
+    $alldos = [];
+    while(sqlsrv_fetch($worksheetexpressions) === true)
+    {
+        $sent_numbers[] = sqlsrv_get_field($worksheetexpressions, 0);
+        $student_expression_ids[] = sqlsrv_get_field($worksheetexpressions, 1);
+        $first_names[] = sqlsrv_get_field($worksheetexpressions,2);
+        $last_names[] = sqlsrv_get_field($worksheetexpressions, 3);
+        $expressions[] = sqlsrv_get_field($worksheetexpressions, 4);
+        $ids[] = sqlsrv_get_field($worksheetexpressions, 5);
+        $alldos[] = sqlsrv_get_field($worksheetexpressions, 6);
+    }
+
+    for($i = 0; $i < $num_expressions; $i++)
+    {
+        echo "<tr>
+                  <td>$sent_numbers[$i]</td>
+                  <td>$first_names[$i] $last_names[$i]</td>
+                  <td>$expressions[$i]</td>
+                  <td>";
+        if ($alldos[$i] == 1)
+            echo "<span class=\"glyphicon glyphicon-ok\"></span>";
+        else
+            echo "<span class=\"glyphicon glyphicon-remove\"></span>";
+        echo "
+            </td>
+                  <td><form method=\"POST\" name=\"expressions{$i}\">
+                          <input hidden type=\"text\" name=\"expressionID\" value=\"$ids[$i]\">
+                          <input hidden type=\"text\" name=\"studentID\" value=\"$student_expression_ids[$i]\">
+                          <input hidden type=\"text\" name=\"firstname\" value=\"$first_names[$i]\">
+                          <input hidden type=\"text\" name=\"lastname\" value=\"$last_names[$i]\">
+                          <input hidden type=\"text\" name=\"worksheetID\" value=\"$worksheetID\">
+                          <input hidden type=\"text\" name=\"courseID\" value=\"$courseID\">
+                          <input hidden type=\"text\" name=\"newexpressionnumber\" value=\"$new_expression_number\">
+                          <button type=\"button\" name=\"SelectExpression\" class=\"btn btn-primary\">Edit</button>
+                      </form>
+                  </td>
+               </tr>";
+    }
+
+}
+?>
\ No newline at end of file
diff --git a/teacher/MyCourses/ViewCourse/WorksheetEditor/index.php b/teacher/MyCourses/ViewCourse/WorksheetEditor/index.php
index 4a46d62..49c58e5 100644
--- a/teacher/MyCourses/ViewCourse/WorksheetEditor/index.php
+++ b/teacher/MyCourses/ViewCourse/WorksheetEditor/index.php
@@ -17,12 +17,12 @@
     <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
     
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script type="text/javascript" src="/js/dynamicRowTeacher.js"></script>
+    
+    
     <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
         $(function(){
             $("#sidebar").load("/sidebar.php");
         });
@@ -30,7 +30,9 @@
 
     <!-- Background Setup -->
     <style>
-      
+        .dropdown-backdrop {
+            position: static;
+        }
     </style>
 </head>
         
@@ -47,140 +49,186 @@
     }
     else
     {
-        $params = array($_SESSION['Username']);
+        $worksheetID = isset($_POST['worksheetID']) ? $_POST['worksheetID'] : 0;
+        $courseID = isset($_POST['courseID']) ? $_POST['courseID'] : 0;
+        if (($worksheetID == 0) || ($courseID == 0))
+            echo "<meta http-equiv='refresh' content='0;/' />";
+        $worksheetDate = isset($_POST['worksheetDate']) ? $_POST['worksheetDate'] : 0;
+        $worksheetTopic = isset($_POST['worksheetTopic']) ? $_POST['worksheetTopic'] : 0;
+        $worksheetStatus = isset($_POST['worksheetStatus']) ? $_POST['worksheetStatus'] : 0;
+         $worksheetNumber = isset($_POST['worksheetNumber']) ? $_POST['worksheetNumber'] : 0;
+        $className = isset($_POST['className']) ? $_POST['className'] : 0;
+        $params = array($worksheetID);
         $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
-        $ListRolesQuery = "SELECT DISTINCT R.Role, RI.RoleID FROM Roles as R, RoleInstances as RI WHERE RI.SiteUsername = ? AND RI.RoleID = R.RoleID ORDER BY RI.RoleID";
-        $stmt = sqlsrv_query($con, $ListRolesQuery, $params, $options);
-        if( $stmt === false ) {
-             die( print_r( sqlsrv_errors(), true));
-        }
-
-        // Make the first (and in this case, only) row of the result set available for reading.
-        $RolesList = [];
-        while( sqlsrv_fetch( $stmt ) === true) {
-             $RolesList[] = sqlsrv_get_field( $stmt, 0);
+        $worksheetexpressionsSQL = "SELECT E.SentenceNumber, S.StudentID, S.FirstName, S.LastName, E.Expression, E.ExpressionID, E.AllDo
+                                    FROM Expressions E, Students S, Enrollment ER
+                                    WHERE E.WorksheetID = ? AND
+                                          ER.StudentID = E.StudentID AND
+                                          S.StudentID = ER.StudentID 
+                                    ORDER BY E.SentenceNumber";
+        $worksheetexpressions = sqlsrv_query($con, $worksheetexpressionsSQL, $params, $options);
+        if ($worksheetexpressions === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_expressions = sqlsrv_num_rows($worksheetexpressions);
+        $new_expression_number = $num_expressions + 1;
+        $sent_numbers = [];
+        $student_expression_ids = [];
+        $first_names = [];
+        $last_names = [];
+        $expressions = [];
+        $ids = [];
+        $alldos = [];
+        while(sqlsrv_fetch($worksheetexpressions) === true)
+        {
+            $sent_numbers[] = sqlsrv_get_field($worksheetexpressions, 0);
+            $student_expression_ids[] = sqlsrv_get_field($worksheetexpressions, 1);
+            $first_names[] = sqlsrv_get_field($worksheetexpressions,2);
+            $last_names[] = sqlsrv_get_field($worksheetexpressions, 3);
+            $expressions[] = sqlsrv_get_field($worksheetexpressions, 4);
+            $ids[] = sqlsrv_get_field($worksheetexpressions, 5);
+            $alldos[] = sqlsrv_get_field($worksheetexpressions, 6);
         }
+        
+        $coursestudentsSQL = "SELECT ER.StudentID 
+                              FROM Enrollment as ER, Worksheets as W, Courses C 
+                              WHERE W.WorksheetID = ? AND
+                                    C.CourseID = W.CourseID AND
+                                    ER.CourseID = C.CourseID";
+        $coursestudents = sqlsrv_query($con, $coursestudentsSQL, $params, $options);
+        if ($coursestudents === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_students = sqlsrv_num_rows($coursestudents);
+        $studentsids = [];
+        while(sqlsrv_fetch($coursestudents) === true)
+            $studentids[] = sqlsrv_get_field($coursestudents, 0);
     ?>        
 
-    <body>
-        
-        <nav class="navbar navbar-inverse" role="navigation">
-            <!-- Brand and toggle get grouped for better mobile display -->
-                <div class="navbar-header">
-                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex8-collapse">
-                        <span class="sr-only">Toggle navigation</span>
-                        <span class="icon-bar"></span>
-                        <span class="icon-bar"></span>
-                        <span class="icon-bar"></span>
+<body>
+    <section class="container-fluid col-xs-12">                     
+        <!--body-->
+        <div id="wrapper">
+            <div id="sidebar"></div>
+            <div id="page-content-wrapper">
+                <div class="container-fluid">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                        <span class="hamb-top"></span>
+                        <span class="hamb-middle"></span>
+                        <span class="hamb-bottom"></span>
                     </button>
-                <a class="navbar-brand" href="/"><img src="/media/logo.jpeg" style="width:200px;height:40px;"></a>
-                </div>
-
-                <!-- Collect the nav links, forms, and other content for toggling -->
-                <div class="collapse navbar-collapse navbar-ex1-collapse right-offset">
-                <ul class="nav navbar-nav navbar-right">
-                  <li class="dropdown">
-                    <a class="dropdown-toggle" data-toggle="dropdown" href="#" id="dropdownMenu">
-                      <span class="glyphicon glyphicon-user"></span> <?=$_SESSION['Username']?> <b class="caret"></b>
-                    </a>
-                      
-                    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
-                        <li><a href="/<?=$_SESSION['Role']?>/Home/Profile/">My Profile</a></li>
-                        <li><a href="#">Change Password</a></li>
-                        <li class="divider">My Roles</li>
-                         <?php                    
-        foreach($RolesList as $ListedRole)
-        {
-            if ($ListedRole == $_SESSION['Role'])
-            {
-            ?>
-                        <li><a><strong><?=$ListedRole?></strong></a></li>
-                                
-            <?php
-            }
-            else
-            {
-                ?>
-                <li><a href="/ChangeRole.php?q=<?=$ListedRole?>"><?=$ListedRole?></a></li>
-                <?php
-            }
-        }
-        ?>
-                        <li class="divider"></li>
-                        <li><a href="/logout.php">Log out</a></li>
-                    </ul>
-          
+                    <!-- BEGIN PAGE CONTENT -->
+                    <div class="col-xs-12">
+                        <div class="row">
                             
-                </li>
-                             
-                </ul>
-                </div><!-- /.navbar-collapse -->
-            </nav>
-        <section class="container col-xs-12">
-            <!--navbar-->
-                     
-            <!--body-->
-            <div id="wrapper">
-                
-                <div id = "sidebar"></div>
-                <div id="page-content-wrapper">
-                        <div class="container-fluid">
-                            <div class="row">
-                                <div class="col-lg-12">
-                                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                                    <span class="hamb-top"></span>
-                                    <span class="hamb-middle"></span>
-                                    <span class="hamb-bottom"></span>
-                                </button>
-                                    <!-- BEGIN PAGE CONTENT -->
-                                    <div class="row">
-                        <div class="col-lg-12">
-                            <div class="panel panel-default">
-                                <div class="panel-heading">Details</div>
-                                <div class="panel-body">
-                                    <h2 class="page-header">Course 121</h2>
-                                    <h5>Worksheet #1</h5>
-                                    <h5>Date: 3/2/16</h5>
-                                    <h5>Topic: English</h5>
+                            <h1 class="pull-right"><button type="button" class="btn btn-lg btn-primary pull-right" id="SaveWorksheet">Save Worksheet</button></h1>
+                        </div>
+                        <hr>
+                        <div class="row">
+                            <div class="col-xs-4">
+                                <div class="panel panel-primary">
+                                    <div class="panel-heading">Worksheet Info</div>
+                                    <div class="panel-body">
+                                        <div class="col-xs-8">
+                                            <?php
+                                            echo "
+                                            <h3>Course: $className</h3>
+                                            <h5>Worksheet Number: $worksheetNumber</h5>
+                                            <h5>Date: $worksheetDate</h5>
+                                            <h5>Topic: $worksheetTopic</h5>";?>
+                                        </div>
+                                        
+                                    </div>
                                 </div>
                             </div>
-
-                            <div class="panel panel-default">
-                                <div class="panel-heading">Worksheet</div>
-                                <div class="panel-body">
-                                    <div class="modal-dialog">
-                                        <!--<div class="modal-content">
-                                            <div class="modal-header">
-                                                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
-                                                <h4 class="modal-title" id="myModalLabel">Modal Heading</h4>
-                                            </div>
-                                            <div class="modal-body">
-
+                            <div class="col-xs-8">
+                                <div class="panel panel-primary" style="max-height:300px;overflow-y:scroll">
+                                <div class="panel-heading">Worksheet Overview</div>
+                                    <div class="panel-body">
+                                        <div class="row">
+                                            <div class="col-md-10">
+                                                <form method="POST" name="newexpression">
+                                                    <input hidden type="text" name="newexpressionnumber" value="<?=$new_expression_number?>">
+                                                    <input hidden type="text" name="courseID" value="<?=$courseID?>">
+                                                    <input hidden type="text" name="worksheetID" value="<?=$worksheetID?>">
+                                                    <button type="button" name="NewExpression" class="btn btn-primary">
+                                                        New Expression
+                                                    </button>
+                                                </form>
                                             </div>
-                                            <div class="modal-footer">
-                                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
-                                                <button type="button" class="btn btn-primary">Save changes</button>
-                                            </div>
-
-                                        </div>--><!-- /.modal-content -->
+                                        </div>
+                                        <hr>
+                                        <table class="table" id="myTable" >
+                                            <thead>
+                                                <tr>
+                                                    <th>#</th>
+                                                    <th>Student</th>
+                                                    <th>Expression</th>
+                                                    <th>All-Do</th>
+                                                    <th>Action</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody name="ExpressionTable">
+<?php 
+        for($i = 0; $i < $num_expressions; $i++)
+        {
+            $pass_array = array($ids[$i], $student_expression_ids[$i], $first_names[$i], $last_names[$i]);
+            echo "<tr>
+                      <td>$sent_numbers[$i]</td>
+                      <td>$first_names[$i] $last_names[$i]</td>
+                      <td>$expressions[$i]</td>
+                      <td>";
+            if ($alldos[$i] == 1)
+                echo "<span class=\"glyphicon glyphicon-ok\"></span>";
+            else
+                echo "<span class=\"glyphicon glyphicon-remove\"></span>";
+            echo "
+                </td>
+                      <td><form method=\"POST\" name=\"expressions{$i}\">
+                              <input hidden type=\"text\" name=\"expressionID\" value=\"$ids[$i]\">
+                              <input hidden type=\"text\" name=\"studentID\" value=\"$student_expression_ids[$i]\">
+                              <input hidden type=\"text\" name=\"firstname\" value=\"$first_names[$i]\">
+                              <input hidden type=\"text\" name=\"lastname\" value=\"$last_names[$i]\">
+                              <input hidden type=\"text\" name=\"courseID\" value=\"$courseID\">
+                              <input hidden type=\"text\" name=\"worksheetID\" value=\"$worksheetID\">
+                              <input hidden type=\"text\" name=\"newexpressionnumber\" value=\"$new_expression_number\">
+                              <button value=\"$ids[$i]\" type=\"button\" name=\"SelectExpression\" class=\"btn btn-primary\">Edit</button>
+                          </form>
+                      </td>
+                   </tr>";
+        }
+?>
+                                                
+                                            </tbody>
+                                        </table>
                                     </div>
                                 </div>
                             </div>
                         </div>
-                        </div>
-                                    <!-- END PAGE CONTENT -->
-                                </div>
+                        <div class="panel panel-primary" style="min-height:450px;">
+                            <div class="panel-heading"><h4>Expression Editor</h4></div>
+                            <div name="ExpressionEditor">
+                                
                             </div>
                         </div>
                     </div>
+                    <!-- END PAGE CONTENT -->
+                </div>
             </div>
-            
-        </section>
+        </div>
+    </section>
         
-        <script src="http://code.jquery.com/jquery.js"></script>
-        <script src="/flatUI/js/bootstrap.min.js"></script>
-        
-        </body>
+    <script src="//code.jquery.com/jquery.js"></script>
+    <script src="/js/bootstrap.min.js"></script>
+    <script>
+    $('.dropdown-toggle').click(function(e) {
+        e.preventDefault();
+        setTimeout($.proxy(function() {
+            if ('ontouchstart' in document.documentElement) {
+                $(this).siblings('.dropdown-backdrop').off().remove();
+            }
+        }, this), 0);
+    });
+    </script>
+</body>
     <?php
     }
 }
diff --git a/teacher/MyCourses/ViewCourse/index.php b/teacher/MyCourses/ViewCourse/index.php
index 34d1b29..87120d1 100644
--- a/teacher/MyCourses/ViewCourse/index.php
+++ b/teacher/MyCourses/ViewCourse/index.php
@@ -14,29 +14,18 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet">
     
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
+    <script type="text/javascript" src="/js/spin.js"></script>
     <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
         $(function(){
             $("#sidebar").load("/sidebar.php");
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
         
 <?php
@@ -52,41 +41,267 @@
     }
     else
     {
+        $courseID = isset($_POST['courseID']) ? $_POST['courseID'] : 0;
+        if ($courseID == 0)
+            echo "<meta http-equiv='refresh' content='0;../' />";
+    
     ?>        
 
     <body>
-        <div id="header"></div>
         <div id="wrapper">
             <div id = "sidebar"></div>
             <div id="page-content-wrapper">
+                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <span class="hamb-top"></span>
+                    <span class="hamb-middle"></span>
+                    <span class="hamb-bottom"></span>
+                </button>
                 <div class="container-fluid">
                     <div class="row">
-                        <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                            <!-- BEGIN PAGE CONTENT -->
-                            <h1>Course Title</h1>
-                            
-                            <!-- Worksheet Listing -->
-                            <p>Print Course information: ___</p>
+                        <div class="col-lg-4 col-md-4 col-sm-6">
                             <div class="panel panel-primary">
-                                <div class="panel-heading">Worksheets</div>
-                                <button class="btn btn-default" type="button" id="CreateWorksheet"><a href="WorksheetEditor/">New Worksheet</a></button>
+                                <div class="panel-heading">
+                                    <h4>Course Info</h4>
+                                </div>
                                 <div class="panel-body">
-                                    <p>Will iterate through worksheets, providing a viewing link (to review submissions), an edit button, a 'publish' button, the worksheet status "in progress/published", and date created. </p>
+                                    <?php
+                                        $courseinfoSQL = "SELECT CT.CourseName, I.InstitutionName, ST.SessionName, SI.Year, C.Section
+                                        From Courses as C, SessionType as ST, SessionInstance as SI, Institutions as I, CourseTypes as CT
+                                        WHERE C.CourseID = ?
+                                        AND CT.CourseTypesID = C.CourseTypesID
+                                        AND I.InstitutionID = C.InstitutionID
+                                        AND SI.SessionInstanceID = C.SessionInstanceID
+                                        AND ST.SessionTypeID = SI.SessionTypeID";
+                                        $params = array($courseID);
+                                        $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+        
+                                        $courseinfo = sqlsrv_query($con, $courseinfoSQL, $params, $options);
+                                        if ( $courseinfo === false)
+                                            die( print_r( sqlsrv_errors(), true));
+                                        $length = sqlsrv_num_rows($courseinfo);
+
+                                        if (sqlsrv_fetch( $courseinfo ) === true) 
+                                        {
+                                            $ClassName = sqlsrv_get_field( $courseinfo, 0);
+                                            $InstitutionName = sqlsrv_get_field( $courseinfo, 1);
+                                            $SessionName = sqlsrv_get_field( $courseinfo, 2);
+                                            $SessionYear = sqlsrv_get_field( $courseinfo, 3);
+                                            $Section = sqlsrv_get_field( $courseinfo, 4);
+                                        }
+                                        $WorksheetsSQL = "
+                                        SELECT W.WorksheetID, W.WorksheetNumber, W.EditStatus, CONVERT(VARCHAR(11), W.Date,106), T.Topic
+                                        FROM Worksheets W, Topics T
+                                        WHERE W.CourseID = ? AND
+                                              W.IsDeleted = 0 AND
+                                              T.TopicID = W.TopicID
+                                              ORDER BY W.WorksheetNumber DESC";
+                                        $params = array($courseID);
+                                        $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+                                        $worksheets = sqlsrv_query($con, $WorksheetsSQL, $params, $options);
+                                        if ($worksheets === false)
+                                            die(print_r(sqlsrv_errors(), true));
+                                        $num_worksheets = sqlsrv_num_rows($worksheets);
+                                        $new_worksheet_number = $num_worksheets + 1;
+                                        $today = date("F j, Y"); 
+
+                                        $worksheetIDs = [];
+                                        $worksheet_numbers = [];
+                                        $statuses = [];
+                                        $dates = [];
+                                        $topics = [];
+                                        while(sqlsrv_fetch($worksheets) === true)
+                                        {
+                                            $worksheetIDs[] = sqlsrv_get_field($worksheets, 0);
+                                            $worksheet_numbers[] = sqlsrv_get_field($worksheets, 1);
+                                            $statuses[] = sqlsrv_get_field($worksheets, 2);
+                                            $dates[] = sqlsrv_get_field($worksheets, 3);
+                                            $topics[] = sqlsrv_get_field($worksheets, 4);
+                                        }
+
+                                    echo "<p>Name: $ClassName</p>
+                                    <p>Institution: $InstitutionName</p>
+                                    <p>Session: $SessionName $SessionYear</p>
+                                    <p>Section: $Section</p>";
+                                    ?>
                                 </div>
                             </div>
-                            
-                            <!-- Student listing -->
                             <div class="panel panel-primary">
-                                <div class="panel-heading">Students</div>
+                                <div class="panel-heading">
+                                    New Worksheet
+                                </div>
+                                <div class="panel-body">
+                                    <form method="POST" action="WorksheetEditor/" name="NewWorksheet">  
+                                        <input type="hidden" name="worksheet_number" value="<?=$new_worksheet_number?>">
+                                        <input type="hidden" id="courseID" name="courseID" value="<?=$courseID?>">
+                                        <div class="form-group row">
+                                            <div class="col-md-12">
+                                                <div class="row">
+                                                    <div class="col-md-12">
+                                                        <h4>Worksheet # <?=$new_worksheet_number?><span class="pull-right"><?=$today?></span></h4>
+                                                    </div>
+                                                </div>
+                                                <div class="row">
+                                                    <div class="col-md-10">
+                                                        <input class="form-control" type="text" name="topic" placeholder="Enter Topic">
+                                                    </div>
+                                                </div>
+                                                <br>
+                                                <h4>My Students Will See:</h4>
+                                                <div class="checkbox">
+                                                    <label><input type="checkbox" name="worksheetTypeOriginal" checked="checked"> Original Expression</label>
+                                                </div>
+                                                <div class="checkbox">
+                                                    <label><input type="checkbox" name="worksheetTypeText" value="TextReform" checked="checked">  Text Reformulation</label>
+                                                </div>
+                                                <div class="checkbox">
+                                                    <label><input type="checkbox" name="worksheetTypeAudio" value="AudioReform" checked="checked">  Audio Reformulation</label>
+                                                </div>
+                                            </div>
+                                        </div>
+                                        <div class="row">
+                                            <div class="btn-group" class="col-md-3">
+                                                <button type="button" name="newworksheet" class="btn btn-primary">Create New Worksheet</button>
+                                            </div>
+                                            <div name="createnewspinner" class="col-md-1" style="left:50%; top:18px;">                                                
+                                            </div>                
+                                        </div>
+                                    </form>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-lg-6 col-md-6 col-sm-6">
+                            <div class="panel panel-primary" style="min-height:578px;max-height:578px;">
+                                <div class="panel-heading">
+                                    <h4>Students</h4>
+                                </div>
+                                <div class="panel-body">
+                                    <?php
+        $params = array($courseID);
+        $options = array( "Scrollable" => 'static' );
+        $coursestudentsSQL = "SELECT S.FirstName, S.LastName, S.StudentID, ER.EnrollmentID
+                              FROM Students as S, Enrollment as ER, Courses as C
+                              WHERE C.CourseID = ? AND
+                                    ER.CourseID = C.CourseID AND
+                                    S.StudentID = ER.StudentID";
+        $coursestudents = sqlsrv_query($con, $coursestudentsSQL, $params, $options);
+        if ($coursestudents === false)
+            die(print_r(sqlsrv_errors(), true));
+        $num_students = sqlsrv_num_rows($coursestudents);
+        $firstnames = [];
+        $lastnames = [];
+        $ids = [];
+        while (sqlsrv_fetch($coursestudents) === true)
+        {
+            $firstnames[] = sqlsrv_get_field($coursestudents, 0);
+            $lastnames[] = sqlsrv_get_field($coursestudents, 1);
+            $studentids[] = sqlsrv_get_field($coursestudents, 2);
+            $enrollmentids[] = sqlsrv_get_field($coursestudents, 3);
+        }
+        ?>
+        
+                                    <table class="table table-hover">
+                                        <thead>
+                                            <tr>
+                                                <th>Name</th>
+                                                <th>Go To</th>
+                                                <th>Go To Archive</th>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+        <?php
+        for($i = 0; $i < $num_students; $i++)
+        {
+            echo "<tr>";
+            echo "<td>$firstnames[$i] $lastnames[$i]</td>";
+            echo "<td>
+                    <form method=\"POST\" action=\"/Teacher/MyCourses/ViewCourse/Students/ViewStudentProfile/\" name=\"studentview{$i}\">
+                      <input hidden type=\"text\" name=\"enrollmentID\" value=\"$enrollmentids[$i]\">
+                      <input hidden type=\"text\" name=\"courseID\" value=\"$courseID\">
+                      <button class=\"btn btn-primary\">Student Page</button>
+                    </form>
+                  </td>";
+            echo "<td>
+                    <form method=\"POST\" action=\"/Teacher/Archive/Students/ViewStudent/\" name=\"archivepage{$i}\">
+                      <input hidden type=\"text\" name=\"studentID\" value=\"$studentids[$i]\">
+                      <button class=\"btn btn-primary\">Archive Page</button>
+                    </form>
+                  </td>";
+        }?>
+                                        </tbody>
+                                    </table>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col-lg-10 col-md-10">
+                            <!-- Worksheet Listing -->
+                            
+                            <div class="panel panel-primary" style="min-height:400px;">
+                                <div class="panel-heading">Worksheets</div>
+                                
                                 <div class="panel-body">
-                                    <p>Will iterate through students, giving brief summary stats (worksheets completed, incomplete worksheets, etc), a link to each students profile, and an option to search that student in the archive</p>
+                                    <table class="table table-hover">
+                                        <thead>
+                                            <tr>
+                                                <th>#</th>
+                                                <th>Date</th>
+                                                <th>Topic</th>
+                                                <th>Status</th>
+                                                <th>Go To</th>
+                                                <th>Perform an Action</th>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+                                            <?php
+        $username = $_SESSION['Username'];
+        for($i = 0; $i < $num_worksheets; $i++)
+        {
+            echo "<tr>";
+            echo "<td>$worksheet_numbers[$i]</td>";
+            echo "<td>$dates[$i]</td>";
+            echo "<td>$topics[$i]</td>";
+            echo "<td>$statuses[$i]</td>";
+            if ($statuses[$i] == "Released")
+            {
+                echo "<td><form method=\"POST\" action=\"ViewWorksheet/\" name=\"ViewWorksheet\"><input hidden type=\"text\" name=\"worksheetID\" value=\"$worksheetIDs[$i]\"><input hidden type=\"text\" name=\"courseID\" value=\"$courseID\">
+                <input hidden type=\"text\" name=\"worksheetDate\" value=\"$dates[$i]\">
+                <input hidden type=\"text\" name=\"worksheetTopic\" value=\"$topics[$i]\"><input hidden type=\"text\" name=\"worksheetStatus\" value=\"$statuses[$i]\">
+                <input hidden type=\"text\" name=\"className\" value=\"$ClassName\"><input hidden type=\"text\" name=\"worksheetNumber\" value=\"$worksheet_numbers[$i]\"><button class=\"btn btn-primary\">Review</button></form></td>";
+            }
+            else
+            {
+                echo "<td><form method=\"POST\" action=\"WorksheetEditor/\" name=\"EditWorksheet\"><input hidden type=\"text\" name=\"worksheetID\" value=\"$worksheetIDs[$i]\"><input hidden type=\"text\" name=\"courseID\" value=\"$courseID\">
+                <input hidden type=\"text\" name=\"worksheetDate\" value=\"$dates[$i]\">
+                <input hidden type=\"text\" name=\"worksheetTopic\" value=\"$topics[$i]\"><input hidden type=\"text\" name=\"worksheetStatus\" value=\"$statuses[$i]\">
+                <input hidden type=\"text\" name=\"className\" value=\"$ClassName\"><input hidden type=\"text\" name=\"worksheetNumber\" value=\"$worksheet_numbers[$i]\"><button class=\"btn btn-primary\">Edit</button></form></td>";
+            }
+            echo "<td style=\"width:275px;\"><div class=\"row\"><div class=\"col-xs-4\">
+                    <form method=\"POST\" name=\"publishworksheet{$i}\" action=\"PublishWorksheet.php\">
+                      <input hidden type=\"text\" name=\"worksheetID\" value=\"$worksheetIDs[$i]\">";
+            if ($statuses[$i] == "Released")
+                echo "<button type=\"button\" disabled class=\"btn btn-primary\">Published</button>";
+            else
+                echo "<button type=\"button\" name=\"publishworksheet\" class=\"btn btn-primary\">Publish</button>";
+            echo "</form></div>
+                    <div class=\"col-xs-4\">
+                    <form method=\"POST\" name=\"deleteworksheet{$i}\" action=\"DeleteWorksheet.php\">
+                      <input hidden type=\"text\" name=\"worksheetID\" value=\"$worksheetIDs[$i]\">
+                      <input hidden type=\"text\" name=\"courseID\" value=\"$courseID\">
+                      <button type=\"button\" name=\"deleteworksheet\" class=\"btn btn-danger\">Delete</button>
+                    </form></div>";
+            echo "<div class=\"col-xs-1\" name=\"deletespinner\" style=\"top:15px;\">
+                    </div>
+                  </div></td>";
+            echo "</tr>";
+        }
+        ?>
+                                        </tbody>
+                                    </table>
                                 </div>
                             </div>
+                            
+                            
                             <!-- END PAGE CONTENT -->
                         </div>
                     </div>
@@ -95,7 +310,7 @@
         </div>
 
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="/js/bootstrap.min.js"></script>
         <script>
@@ -103,7 +318,180 @@
             e.preventDefault();
             $("#wrapper").toggleClass("toggled");
         });
-        </script>
+        
+        $("button[name='deleteworksheet']").on("click", function(e){
+            e.preventDefault();
+            var memberForm = $(this).closest("form");
+            var worksheetID = $(memberForm).find("input[name='worksheetID']").val();
+            
+            var opts = {
+                  lines: 13 // The number of lines to draw
+                , length: 36 // The length of each line
+                , width: 12 // The line thickness
+                , radius: 36 // The radius of the inner circle
+                , scale: 0.15 // Scales overall size of the spinner
+                , corners: 1 // Corner roundness (0..1)
+                , color: '#000' // #rgb or #rrggbb or array of colors
+                , opacity: 0.45 // Opacity of the lines
+                , rotate: 0 // The rotation offset
+                , direction: 1 // 1: clockwise, -1: counterclockwise
+                , speed: 1.2 // Rounds per second
+                , trail: 59 // Afterglow percentage
+                , fps: 20 // Frames per second when using setTimeout() as a fallback for CSS
+                , zIndex: 2e9 // The z-index (defaults to 2000000000)
+                , className: 'spinner' // The CSS class to assign to the spinner
+                , top: '75%' // Top position relative to parent
+                , left: '50%' // Left position relative to parent
+                , shadow: false // Whether to render a shadow
+                , hwaccel: false // Whether to use hardware acceleration
+                , position: 'absolute' // Element positioning
+            }
+            var target = $(this).closest("td").find("div[name='deletespinner']");
+            var spinner = new Spinner(opts).spin();
+            target.append(spinner.el);
+            $(":button").prop("disabled", true);
+            $.ajax({
+                type: "POST",
+                url: "DeleteWorksheet.php",
+                data: {
+                    "worksheetID":worksheetID
+                },
+                success: function(data) {
+                    var courseID = $("#courseID").val();
+                    $.ajax({
+                        type: "POST",
+                        url: "index.php",
+                        data: {
+                            "courseID":courseID
+                        },
+                        success: function(data) {
+                            location.reload();
+                        }
+                    });
+                }
+            });
+        });
+            
+        
+        $("button[name='newworksheet']").on("click", function(e) {
+            e.preventDefault();
+            var topic = $("input[name='topic']").val();
+            var courseid = $("input[name='courseID']").val();
+            var worksheetnumber = $("input[name='worksheet_number']").val();
+            var original = $("input[name='worksheetTypeOriginal']").val();
+            var text = $("input[name='worksheetTypeText']").val();
+            var audio = $("input[name='worksheetTypeAudio']").val();
+            
+            
+            var opts = {
+                  lines: 13 // The number of lines to draw
+                , length: 36 // The length of each line
+                , width: 12 // The line thickness
+                , radius: 36 // The radius of the inner circle
+                , scale: 0.25 // Scales overall size of the spinner
+                , corners: 1 // Corner roundness (0..1)
+                , color: '#000' // #rgb or #rrggbb or array of colors
+                , opacity: 0.45 // Opacity of the lines
+                , rotate: 0 // The rotation offset
+                , direction: 1 // 1: clockwise, -1: counterclockwise
+                , speed: 1.2 // Rounds per second
+                , trail: 59 // Afterglow percentage
+                , fps: 20 // Frames per second when using setTimeout() as a fallback for CSS
+                , zIndex: 2e9 // The z-index (defaults to 2000000000)
+                , className: 'spinner' // The CSS class to assign to the spinner
+                , top: '75%' // Top position relative to parent
+                , left: '50%' // Left position relative to parent
+                , shadow: false // Whether to render a shadow
+                , hwaccel: false // Whether to use hardware acceleration
+                , position: 'absolute' // Element positioning
+            }
+            var target = $("div[name='createnewspinner']");
+            var spinner = new Spinner(opts).spin();
+            target.append(spinner.el);
+            $(":button").prop("disabled", true);
+            
+            $.ajax({
+                type: "POST",
+                url: "CreateWorksheet.php",
+                data: {
+                    "topic":topic,
+                    "worksheet_number":worksheetnumber,
+                    "worksheetTypeOriginal":original,
+                    "worksheetTypeText":text,
+                    "worksheetTypeAudio":audio,
+                    "courseid":courseid
+                },
+                success: function(data){
+                    var courseID = $("#courseID").val();
+                    $.ajax({
+                        type: "POST",
+                        url: "index.php",
+                        data: {
+                            "courseID":courseID
+                        },
+                        success: function(data) {
+                            location.reload();
+                        }
+
+                    });
+                }
+            });
+        });
+            
+        $("button[name='publishworksheet']").on("click", function(e) {
+            var opts = {
+                  lines: 13 // The number of lines to draw
+                , length: 36 // The length of each line
+                , width: 12 // The line thickness
+                , radius: 36 // The radius of the inner circle
+                , scale: 0.15 // Scales overall size of the spinner
+                , corners: 1 // Corner roundness (0..1)
+                , color: '#000' // #rgb or #rrggbb or array of colors
+                , opacity: 0.45 // Opacity of the lines
+                , rotate: 0 // The rotation offset
+                , direction: 1 // 1: clockwise, -1: counterclockwise
+                , speed: 1.2 // Rounds per second
+                , trail: 59 // Afterglow percentage
+                , fps: 20 // Frames per second when using setTimeout() as a fallback for CSS
+                , zIndex: 2e9 // The z-index (defaults to 2000000000)
+                , className: 'spinner' // The CSS class to assign to the spinner
+                , top: '75%' // Top position relative to parent
+                , left: '50%' // Left position relative to parent
+                , shadow: false // Whether to render a shadow
+                , hwaccel: false // Whether to use hardware acceleration
+                , position: 'absolute' // Element positioning
+            }
+            var target = $(this).closest("td").find("div[name='deletespinner']");
+            var spinner = new Spinner(opts).spin();
+            target.append(spinner.el);
+
+            $(":button").prop("disabled", true);
+
+            var parentForm = $(this).closest("form");
+            var worksheetID = $(parentForm).find("input[name=worksheetID]").val();
+            $.ajax({
+                type: "POST",
+                url: "PublishWorksheet.php",
+                data: {
+                    "worksheetID": worksheetID
+                },
+                success: function(data){
+                    var courseID = $("#courseID").val();
+                    $.ajax({
+                        type: "POST",
+                        url: "index.php",
+                        data: {
+                            "courseID":courseID
+                        },
+                        success: function(data) {
+                            location.reload();
+                        }
+
+                    });
+                }
+            });
+    });
+    </script>
     </body>
     <?php
     }
diff --git a/teacher/MyCourses/index.php b/teacher/MyCourses/index.php
index 318ec6e..9dfba0b 100644
--- a/teacher/MyCourses/index.php
+++ b/teacher/MyCourses/index.php
@@ -1,5 +1,4 @@
-<!-- Courses Home (index.php) for Teacher account -->
-
+<!-- Home (index.html) for Teacher account -->
 <?php include "../../base.php"; ?>
 <!DOCTYPE html>
 <html lang="en">
@@ -15,9 +14,11 @@
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/flatUI/css/theme.css" rel="stylesheet" media="screen">
+
     
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -28,16 +29,6 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
 </head>
         
 <?php
@@ -53,102 +44,262 @@
     }
     else
     {
-        $institutionID = isset($_GET['in']) ? $_GET['in'] : 0; // Default Institution = 1
-        if ($institutionID == 0)
-            echo "Error passing GET variable -in-";
-        
-        
-    ?>        
-
-    <body>
-        <div id="header"></div>
-        <div id="wrapper">
-            <div id = "sidebar"></div>
-            <div id="page-content-wrapper">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                            <!-- BEGIN PAGE CONTENT -->
-                            
-                            
-                            <?php
         $username = $_SESSION['Username'];
-        $params = array($username);
-        $teacherIDQuery = "SELECT TeacherID FROM Teachers WHERE [SiteUsername] = ?";
-        
+        $role = $_SESSION['Role'];
+        $params = array( $username, $role);
         $options = array( "Scrollable" => 'static' );
-        $stmt = sqlsrv_query($con, $teacherIDQuery, $params, $options);
-        if( $stmt === false ) {
-            die( print_r( sqlsrv_errors(), true));
-        }
-
-        $teacherID = 0;
-        if ( sqlsrv_fetch( $stmt ) === true) {
-            $teacherID = sqlsrv_get_field( $stmt, 0);
-        }
-        $params = array($institutionID, $teacherID);
-        $options = array( "Scrollable" => 'static' );
-        $CoursesQuery = "
-        SELECT TC.CoursesID, CN.ClassName, TC.Section, SN.SessionName
-        FROM TeachersCourses as TC, [Class Names] as CN, [Sessions] as S, SessionNames as SN
-        WHERE TC.InstitutionID = ? AND
-	          TC.InstructorID = ? AND
-		      CN.ClassNamesID = TC.ClassNamesID AND
-		      TC.SessionID > 100 AND
-		      SN.SessionsID = TC.SessionID
-              GROUP BY TC.CoursesID, CN.ClassName, TC.Section, SN.SessionName";
-        $stmt = sqlsrv_query($con, $CoursesQuery, $params, $options);
-        
-        $courseID = [];
-        $ClassNames = [];
-        $Sections = [];
-        $SessionNames = [];
+        $UserInfoQuery = "
+        SELECT R.Designation 
+        FROM RoleInstances as RI, Roles as R 
+        WHERE  RI.SiteUsername = ? AND 
+               R.Role = ? AND 
+               R.RoleID = RI.RoleID";
+        $stmt = sqlsrv_query($con, $UserInfoQuery, $params, $options);
         if ( $stmt === false)
             die( print_r( sqlsrv_errors(), true));
-        while (sqlsrv_fetch( $stmt ) === true) {
-            $courseID[] = sqlsrv_get_field( $stmt, 0);
-            $ClassNames[] = sqlsrv_get_field( $stmt, 1);
-            $Sections[] = sqlsrv_get_field( $stmt, 2);
-            $SessionNames[] = sqlsrv_get_field( $stmt, 3);
-        }
-        $length = sqlsrv_num_rows ($stmt);
-        echo "<h1>Courses</h1>";
-
-        for ($i = 0; $i < $length; $i++)
+        $Designation = "";
+        $Institution = "";
+        if ( sqlsrv_fetch( $stmt ) === true)
         {
-            ?>
-                            <div class="row">
-                                <div class="panel panel-primary col-xs-4">
+            $Designation = sqlsrv_get_field( $stmt, 0);
+        }
+        ?>
+        <body>
+<!--
+            <div id="header"></div>           
+-->
+            <div id="wrapper">
+                <div id="sidebar"></div>
+                <div id="page-content-wrapper">
+                    <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                        <span class="hamb-top"></span>
+                        <span class="hamb-middle"></span>
+                        <span class="hamb-bottom"></span>
+                    </button>
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col-lg-8 col-md-8">
+                                <h3><?php echo $_SESSION['firstname'] . " " . $_SESSION['lastname']; ?></h3>
+                                
+                            </div>
+                        </div>
+                        <div class="row">
+                            
+                            <div class="col-lg-5 col-md-6 col-sm-7">
+                                <div class="panel panel-default" style="min-height:600px;">
+                                    <div class="panel-heading">
+                                        <div class="row">
+                                            <div class="col-xs-10">
+                                                <h4>Active Courses <a href="/Teacher/MyCourses/"><i class="glyphicon glyphicon-new-window"></i></a></h4>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="panel-body" style="min-height: 150px; max-height: 150px;">
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Course</th>
+                                                    <th>Section</th>
+                                                    <th>Session</th>
+                                                    <th>Institution</th>
+                                                    <th>Go To</th>
+                                                </tr>
+                                            </thead>
+                                                         
+                                            <tbody>
+                                                <?php
+                                                $activecoursesSQL = "SELECT CT.CourseName, C.Section, I.InstitutionName, ST.SessionName, C.CourseID
+                                                FROM Courses as C, TeachingInstance as TI, SessionType as ST, SessionInstance as SI, Institutions as I, CourseTypes as CT
+                                                WHERE C.TeachingInstanceID = TI.TeachingInstanceID
+                                                AND TI.SiteUsername = ?
+                                                AND C.SessionInstanceID = SI.SessionInstanceID
+                                                AND SI.SessionTypeID = ST.SessionTypeID
+                                                AND C.InstitutionID = I.InstitutionID
+                                                AND CT.CourseTypesID = C.CourseTypesID
+                                                AND C.Status = 'Active'";
+                                                
+                                                $params = array($_SESSION['Username']);
+                                                $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+                                                
+                                                $activecourses = sqlsrv_query($con, $activecoursesSQL, $params, $options);
+                                                if($activecourses === false)
+                                                    die (print_r(sqlsrv_errors(), true));
+                                                $resultlength = sqlsrv_num_rows($activecourses);
+                                                if($resultlength == 0)
+                                                {
+                                                    echo "No Active Courses!";
+                                                }
+                                                else
+                                                {
+                                                    $coursenames = [];
+                                                    $sections = [];
+                                                    $institutions = [];
+                                                    $sessions = [];
+                                                    $courseids = [];
+                                                    while(sqlsrv_fetch($activecourses) === true)
+                                                    {
+                                                        $coursenames[] = sqlsrv_get_field($activecourses, 0);
+                                                        $sections[] = sqlsrv_get_field($activecourses, 1);
+                                                        $institutions[] = sqlsrv_get_field($activecourses, 2);
+                                                        $sessions[] = sqlsrv_get_field($activecourses, 3);
+                                                        $courseids[] = sqlsrv_get_field($activecourses, 4);
+                                                    }
+                                                    for ($i = 0; $i < $resultlength; $i++)
+                                                    {
+                                                        echo "<tr><td>$coursenames[$i]</td><td>$sections[$i]</td><td>$sessions[$i]</td><td>$institutions[$i]</td><td><form method=\"post\" action=\"/Teacher/MyCourses/ViewCourse/\" name=\"activecourselink{$i}\" id=\"activecourselink{$i}\"><input hidden type=\"text\" name=\"courseID\" value=\"$courseids[$i]\"><button class=\"btn btn-primary\">Course Page</button></form>
+                                                        </td></tr>";
+                                                    }
+                                                }
+                                                
+                                                ?>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-lg-4 col-md-6 col-sm-5">
+                                <div class="panel panel-default" style="min-height:600px;">
+                                    <div class="panel-heading">
+                                        <div class="row">
+                                            <div class="col-xs-10">
+                                                    <h4>My Students <a href="/Teacher/MyStudents/"><i class="glyphicon glyphicon-new-window"></i></a></h4>
+                                            </div>
+                                        </div>
+                                    </div>
                                     <div class="panel-body">
-                                        <p>Class Name: <?=$ClassNames[$i]?></p>
-                                        <p>Section: <?=$Sections[$i]?></p>
-                                        <p>Session: <?=$SessionNames[$i]?></p>
-                                        <u1 class="list=group">
-                                            <li class="list-group-item"><a href="ViewCourse/?c=<?=$courseID[$i]?>">Course Page</a></li>
-
-
-                                    </u1>
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Name</th>
+                                                    <th>Course</th>
+                                                    <th>Institution</th>
+                                                    <th>Go To</th>
+                                                </tr>
+                                            </thead>
+                                        
+                                                
+                                            <tbody>
+                                                <?php
+                                                $mystudentsSQL = "SELECT ER.EnrollmentID, S.LastName, S.FirstName, I.InstitutionName, CT.CourseName, C.CourseID
+                                                FROM Courses as C, TeachingInstance as TI, Students as S, Institutions as I, Enrollment as ER, CourseTypes as CT
+                                                WHERE TI.SiteUsername = ?
+                                                AND C.TeachingInstanceID = TI.TeachingInstanceID
+                                                AND ER.CourseID = C.CourseID
+                                                AND S.StudentID = ER.StudentID
+                                                AND I.InstitutionID = S.InstitutionID
+                                                AND CT.CourseTypesID = C.CourseTypesID";
+                                                
+                                                $params = array($_SESSION['Username']);
+                                                $options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET);
+                                                
+                                                $mystudents = sqlsrv_query($con, $mystudentsSQL, $params, $options);
+                                                if($mystudents === false)
+                                                    die (print_r(sqlsrv_errors(), true));
+                                                $resultlength = sqlsrv_num_rows($mystudents);
+                                                if($resultlength == 0)
+                                                {
+                                                    echo "No Enrolled Students!";
+                                                }
+                                                else
+                                                {
+                                                    $enrollmentids = [];
+                                                    $studentlastnames = [];
+                                                    $studentfirstnames = [];
+                                                    $institutions = [];
+                                                    $coursenames = [];
+                                                    $courseids = [];
+                                                    while(sqlsrv_fetch($mystudents) === true)
+                                                    {
+                                                        $enrollmentids[] = sqlsrv_get_field($mystudents, 0);
+                                                        $studentlastnames[] = sqlsrv_get_field($mystudents, 1);
+                                                        $studentfirstnames[] = sqlsrv_get_field($mystudents, 2);
+                                                        $institutions[] = sqlsrv_get_field($mystudents, 3);
+                                                        $coursenames[] = sqlsrv_get_field($mystudents, 4);
+                                                        $courseids[] = sqlsrv_get_field($mystudents, 5);
+                                                    }
+                                                    for ($i = 0; $i < $resultlength; $i++)
+                                                    {
+                                                        echo "<tr><td>$studentfirstnames[$i] $studentlastnames[$i]</td><td>$coursenames[$i]</td><td>$institutions[$i]</td><td><form method=\"post\" action=\"/Teacher/MyCourses/ViewCourse/Students/ViewStudentProfile/\" name=\"mystudentlink{$i}\" id=\"mystudentlink{$i}\"><input hidden type=\"text\" name=\"enrollmentID\" value=\"$enrollmentids[$i]\"><input hidden type=\"text\" name=\"courseID\" value=\"$courseids[$i]\"><button class=\"btn btn-primary\">Student Page</button></form>
+                                                        </td></tr>";
+                                                    }
+                                                }
+                                                
+                                                ?>
+                                            </tbody>
+                                        </table>
                                     </div>
-
                                 </div>
                             </div>
-                            <?php
-        }
-        ?>
-                            <!-- END PAGE CONTENT -->
+                            
                         </div>
+                        <!--<div class="row">
+                            <div class="col-lg-8 col-md-8">
+                                <div class="panel panel-default">
+                                    <div class="panel-heading">
+                                        <h4>My Site Activity Queue</h4>
+                                    </div>
+                                    <div class="panel-body" style="min-height: 250px;max-height: 250px;">
+                                        <form method="POST" id="filterActivityQueue" action="">
+                                            <div class="form-group row">
+                                                <div class="col-lg-3 col-md-3 col-sm-4">
+                                                    <select class="form-control">
+                                                        <option selected="selected">--Institution--</option>
+                                                        <option>Gonzaga</option>
+                                                        <option>Spokane Falls CC</option>
+                                                    </select>
+                                                </div>
+                                                <div class="col-lg-3 col-md-3 col-sm-4">
+                                                    <select class="form-control" style="display:inline">
+                                                        <option selected="selected">--Course--</option>
+                                                        <option>Course Info</option>
+                                                        <option>Course Info</option>
+                                                        <option>Course Info</option>
+                                                    </select>
+                                                </div>
+                                                <div class="col-lg-3 col-md-3 col-sm-4">
+                                                    <select class="form-control">
+                                                        <option selected="selected">--Action Type--</option>
+                                                        <option>Submitted Worksheet</option>
+                                                        <option>Question</option>
+                                                        <option>Submitted Other</option>
+                                                    </select>
+                                                </div>
+                                                <button type="submit" class="btn btn-primary">Filter Activity Queue</button>
+                                            </div>
+                                        </form>
+                                        <table class="table table-hover">
+                                            <thead>
+                                                <tr>
+                                                    <th>Date</th>
+                                                    <th>Institution</th>
+                                                    <th>Course</th>
+                                                    <th>Action Type</th>
+                                                    <th>User</th>
+                                                    
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr>
+                                                    <td>1/28/2016</td>
+                                                    <td>Gonzaga University</td>
+                                                    <td>Seminar: Spring I 2016</td>
+                                                    <td><a href="/Teacher/MyCourses/ViewCourse/ViewWorksheet/ViewSubmission/">Worksheet Submission</a></td>
+                                                    
+                                                    <td><a href="/Teacher/MyStudents/ViewStudentProfile/">Student Name</a></td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>-->
                     </div>
                 </div>
+
             </div>
-        </div>
 
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="/js/bootstrap.min.js"></script>
         <script>
diff --git a/teacher/MyCourses/Students/ViewStudentProfile/index.php b/teacher/MyStudents/ViewStudent/index.php
similarity index 94%
rename from teacher/MyCourses/Students/ViewStudentProfile/index.php
rename to teacher/MyStudents/ViewStudent/index.php
index 5ae2ea1..96c0db5 100644
--- a/teacher/MyCourses/Students/ViewStudentProfile/index.php
+++ b/teacher/MyStudents/ViewStudent/index.php
@@ -17,7 +17,7 @@
     <link href="/css/SidebarPractice.css" rel="stylesheet">
     
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -79,7 +79,7 @@
         </div>
 
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="/js/bootstrap.min.js"></script>
         <script>
diff --git a/teacher/MyStudents/ViewStudentProfile/index.php b/teacher/MyStudents/ViewStudentProfile/index.php
deleted file mode 100644
index d8009a6..0000000
--- a/teacher/MyStudents/ViewStudentProfile/index.php
+++ /dev/null
@@ -1,105 +0,0 @@
-<!-- View student profile (index.php) for Teacher account -->
-
-<?php include "../../../base.php"; ?>
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <title> Gonzaga Small Talk</title>
-
-    <!-- Bootstrap -->
-    <link href="/css/bootstrap.css" rel="stylesheet">
-    <link href="/css/simple-sidebar.css" rel="stylesheet">
-    <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
-    <link href="/css/SidebarPractice.css" rel="stylesheet">
-    
-    <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/SidebarPractice.js"></script>
-    <script>
-        $(function(){
-            $("#header").load("/header.php");
-        });
-        $(function(){
-            $("#sidebar").load("/sidebar.php");
-        });
-    </script>
-
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
-</head>
-        
-<?php
-if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
-{
-    if($_SESSION['Role'] != 'teacher')
-    {
-        ?>
-        <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
-        <p>Click <a href="/">here</a> if you don't want to wait</p>
-        <meta http-equiv='refresh' content='5;/' />
-        <?php
-    }
-    else
-    {
-    ?>        
-
-    <body>
-        <div id="header"></div>
-        <div id="wrapper">
-            <div id = "sidebar"></div>
-            <div id="page-content-wrapper">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                            <!-- BEGIN PAGE CONTENT -->
-                            <h2> Insert Student Name</h2>
-                            <p>Requires form submission from teacher/mystudents for student ID.  Will display student progress, history, and lists of worksheet and expressions that have been entered by the student, in chronological order  </p>
-                            <!-- END PAGE CONTENT -->
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-        <!-- Include all compiled plugins (below), or include individual files as needed -->
-        <script src="/js/bootstrap.min.js"></script>
-        <script>
-        $("#menu-toggle").click(function(e) {
-            e.preventDefault();
-            $("#wrapper").toggleClass("toggled");
-        });
-        </script>
-    </body>
-    <?php
-    }
-}
-    
-else
-{
-    ?>
-    <p>Oops! You are not logged in.  Redirecting to log-in in 5 seconds</p>
-    <p>Click <a href="/">here</a> if you don't want to wait</p>
-    <meta http-equiv='refresh' content='5;/' />
-    <?php
-}
-?>
-</html>
diff --git a/teacher/MyStudents/index.php b/teacher/MyStudents/index.php
index 88bba36..6239ea4 100644
--- a/teacher/MyStudents/index.php
+++ b/teacher/MyStudents/index.php
@@ -15,9 +15,10 @@
     <link href="/css/simple-sidebar.css" rel="stylesheet">
     <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
     <link href="/css/SidebarPractice.css" rel="stylesheet">
+    <link href="/FlatUI/css/theme.css" rel="stylesheet" media="screen">
     
     <!-- Including Header -->
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script type="text/javascript" src="/js/SidebarPractice.js"></script>
     <script>
         $(function(){
@@ -28,22 +29,13 @@
         });
     </script>
 
-    <!-- Background Setup -->
-    <style>
-        body{
-            background: url(/media/gonzagasmalltalk_background.png) no-repeat center center fixed;
-                -webkit-background-size: cover;
-                -moz-background-size: cover;
-                -o-background-size: cover;
-                background-size: auto;
-        }
-    </style>
+   
 </head>
         
 <?php
 if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Username']))
 {
-    if($_SESSION['Role'] != 'teacher')
+    if($_SESSION['Role'] != 'Teacher')
     {
         ?>
         <p>You do not have permission to view this page.  Redirecting in 5 seconds</p>
@@ -53,25 +45,59 @@
     }
     else
     {
+        $institutionID = isset($_POST['institutionid']) ? $_POST['institutionid'] : 0;
+        
+        if ($institutionID == 0)
+        {
+            $params = array($_SESSION['Username']);
+            $options = array("Scrollable" => 'static');
+            $CoursesQuery = "SELECT S.StudentID, S.FirstName, S.LastName, CT.CourseName, I.InsitutionName
+            FROM Students S, Courses C, CourseTypes CT, EnrollmentER, Institutions I, TeachingInstance TI
+            WHERE"
+        }
     ?>        
 
     <body>
-        <div id="header"></div>
         <div id="wrapper">
             <div id = "sidebar"></div>
             <div id="page-content-wrapper">
+                <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
+                    <span class="hamb-top"></span>
+                    <span class="hamb-middle"></span>
+                    <span class="hamb-bottom"></span>
+                </button>
                 <div class="container-fluid">
                     <div class="row">
-                        <div class="col-lg-12">
-                        <button type="button" class="hamburger is-closed" data-toggle="offcanvas">
-                            <span class="hamb-top"></span>
-                            <span class="hamb-middle"></span>
-                            <span class="hamb-bottom"></span>
-                        </button>
-                            <!-- BEGIN PAGE CONTENT -->
-                            <h2>My Students</h2>
-                            <p>For a given teacher, will list all active students (according to active courses) and display a link to each student's profile view  </p>
-                            <!-- END PAGE CONTENT -->
+                        <div class="col-lg-10">
+                            <h3>My Students</h3>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col-lg-10 col-md-10">
+                            <div class="panel panel-primary">
+                                <div class="panel-body">
+                                    <table class="table table-hover">
+                                        <thead>
+                                            <tr>
+                                                <th>Name</th>
+                                                <th>Institution</th>
+                                                <th>Current Course</th>
+                                                <th>Go To</th>
+                                                <th>Go To</th>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+                                            <tr>
+                                                <td>Stu Dent</td>
+                                                <td>Gonzaga University</td>
+                                                <td>ELCT 103</td>
+                                                <td><a href="/Teacher/Archive/Students/ViewStudent/">Archive Page</a></td>
+                                                <td><a href="/Teacher/MyCourses/ViewCourse/Students/ViewStudentProfile/?sid=">View in Course</a></td>
+                                            </tr>
+                                        </tbody>
+                                    </table>
+                                </div>
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -79,7 +105,7 @@
         </div>
 
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="/js/bootstrap.min.js"></script>
         <script>
diff --git a/teacher/MyStudents/oldDBaccess.html b/teacher/MyStudents/oldDBaccess.html
index 30287b7..94e1d90 100644
--- a/teacher/MyStudents/oldDBaccess.html
+++ b/teacher/MyStudents/oldDBaccess.html
@@ -36,7 +36,7 @@
     <link href="/css/bootstrap.css" rel="stylesheet">
     <link href="/css/datepicker.css" rel="stylesheet">
     <link rel="stylesheet/less" type="text/css" href="/datepicker.less" />
-    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script>
         $(function(){
             $("#header").load("header.html");
@@ -78,7 +78,7 @@ <h4 class="panel-title">
                                     </tr>
                                     <tr>
                                         <td>
-                                            <span></span><a href="http://www.jquery2dotnet.com">Messages</a>
+                                            <span></span><a href="//www.jquery2dotnet.com">Messages</a>
                                             <span class="badge">12</span>
                                         </td>
                                     </tr>
@@ -109,7 +109,7 @@ <h1>Expressions</h1>
 
 
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="/js/bootstrap.min.js"></script>
         <script src="/js/bootstrap-datepicker.js"></script>
diff --git a/testindex.php b/testindex.php
index 4c4bb80..f0c75c3 100644
--- a/testindex.php
+++ b/testindex.php
@@ -92,7 +92,7 @@
         
 
     <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
     <!-- Include all compiled plugins (below), or include individual files as needed -->
     <script src="js/bootstrap.min.js"></script>
   </body>
diff --git a/vendor/composer/ClassLoader.php b/vendor/composer/ClassLoader.php
index ff6ecfb..172e7e1 100644
--- a/vendor/composer/ClassLoader.php
+++ b/vendor/composer/ClassLoader.php
@@ -313,7 +313,7 @@ public function loadClass($class)
      */
     public function findFile($class)
     {
-        // work around for PHP 5.3.0 - 5.3.2 https://bugs.php.net/50731
+        // work around for PHP 5.3.0 - 5.3.2 //bugs.php.net/50731
         if ('\\' == $class[0]) {
             $class = substr($class, 1);
         }
diff --git a/web.config b/web.config
index fa36518..9177f82 100644
--- a/web.config
+++ b/web.config
@@ -1,9 +1,12 @@
-<?xml version="1.0" encoding="UTF-8"?>
+<?xml version="1.0" encoding="utf-8"?>
 <configuration>
+  <configSections>
+        <!-- For more information on Entity Framework configuration, visit http://go.microsoft.com/fwlink/?LinkID=237468 -->
+    </configSections>
   <system.webServer>
     <rewrite>
       <rules>
-        <rule name="Force HTTPS" enabled="false">
+        <rule name="Force HTTPS" enabled="true">
           <match url="(.*)" ignoreCase="false" />
           <conditions>
             <add input="{HTTPS}" pattern="off" />
@@ -13,4 +16,8 @@
       </rules>
     </rewrite>
   </system.webServer>
+  <system.web>
+    <compilation targetFramework="4.0" />
+    <pages controlRenderingCompatibilityVersion="3.5" clientIDMode="AutoID" />
+  </system.web>
 </configuration>
\ No newline at end of file
diff --git a/worksheet.html b/worksheet.html
index 135190c..bf7830f 100644
--- a/worksheet.html
+++ b/worksheet.html
@@ -112,7 +112,7 @@
                 </div>-->
 
         <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
         <!-- Include all compiled plugins (below), or include individual files as needed -->
         <script src="js/bootstrap.min.js"></script>
         <script src="js/worksheet.js"></script>