body {
   font-family: 'Open Sans', sans-serif;
   background-color: #f7f7f7;
   position: relative;
   margin: 0px;
   font-size: 12px;
   padding: 0px;
}

.page-content>.row {
   margin-left: 0px !important;
   margin-right: 0px !important;
   margin-top: 30px;
}

/* Footer */
a {
   color: #000;
   text-decoration: none;
}

a:hover,
a:focus {
   color: #000;
   text-decoration: none;
}

a:focus {
   outline: thin dotted;
   outline: 5px auto -webkit-focus-ring-color;
   outline-offset: -2px;
}

footer {
   background-color: #2c3742;
   box-shadow: inset 0px 0px 3px #111;
   color: #fff;
   font-size: 14px;
   line-height: 25px;
   padding: 10px 0px 10px 0px;
   bottom: 0px;
}

footer a {
   color: #eee;
   text-decoration: none;
   border-bottom: 1px dotted #888;
}

footer a:hover {
   color: #aaa;
   text-decoration: none;
   border: 0px;
}

footer hr {
   margin-top: 10px;
   margin-bottom: 10px;
   border-top: #000 1px solid;
   border-bottom: #212121 1px solid;
}

footer .copy {
   font-size: 13px;
   margin: 15px 0px;
}

/* Logo & Navigation */

.header {
   height: 50px;
   background-color: #2c3742;
}

.header .logo h1 {
   font-size: 30px;
   margin: 0px;
   padding: 10px 0px;
}

.header .logo h1 a {
   color: #fff;
   font-family: 'Open Sans Condensed', sans-serif;
}

.header .logo h1 a:hover {
   color: #fff;
   text-decoration: none;
   border: 0px;
}

.header .form {
   margin-top: 10px;
   width: 100%;
   max-width: 300px;
   margin: 10px auto;
}

.header .navbar * {
   box-shadow: none !important;
}

.header .navbar .label {
   font-size: 12px;
   padding: 4px 8px;
   margin: 0px 2px;
   border-radius: 15px !important;
}

.header .navbar {
   background: none !important;
   border: 0px !important;
}

.header .navbar i {
   margin-right: 3px;
}

.header .navbar .nav>li>a {
   color: #fff !important;
   font-size: 13px !important;
   border-bottom: 0px !important;
   margin-top: 0px !important;
   font-weight: bold;
}

.header .navbar-nav>.open>a,
.header .navbar-nav>.open>a:hover,
.header .navbar-nav>.open>a:focus {
   background: none !important;
}

.header .navbar-collapse {
   border: 0px !important;
}

.header .navbar-header {
   width: 43px;
   margin: 0 auto;
}

.header .navbar-header button {
   color: #fff !important;
   padding: 5px 10px;
}

.header .navbar-toggle {
   background-color: #1dc1da !important;
   border: 1px solid #0fa6bc !important;
}

.header .navbar-toggle:hover,
.header .navbar-toggle:focus {
   background-color: #0fa6bc !important;
   border: 1px solid #0fa6bc !important;
}

.header .dropdown-menu {
   border-radius: 6px !important;
   background: #fff !important;
}

.header .dropdown-menu li {
   font-size: 13px;
   padding: 6px 15px;
   border-bottom: 1px dashed #f3f3f3;
}

.header .dropdown-menu li a {
   color: #888;
   padding-left: 0px !important;
}

.header .dropdown-menu li:last-child {
   border: 0px;
}

.header .dropdown-menu li a:hover {
   background: none !important;
   color: #666 !important;
   border: 0px !important;
}

.header .dropdown-big {
   min-width: 300px;
}

.header .dropdown-big .dropdown-head {
   padding: 7px 15px;
   background: #fcfcfc;
   border-bottom: 1px solid #ddd;
   margin-top: -5px;
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
}

.header .dropdown-big .dropdown-title {
   font-size: 13px;
   font-weight: bold;
   color: #999;
}

.header .dropdown-big .dropdown-body {
   background: #fff;
}

.header .dropdown-big .dropdown-foot {
   padding: 7px 15px;
   background: #fcfcfc;
   border-top: 1px solid #ddd;
   margin-bottom: -5px;
   border-bottom-left-radius: 5px;
   border-bottom-right-radius: 5px;
   font-size: 12px;
}

.header .dropdown-big .dropdown-foot a {
   color: #888;
}

.header .dropdown-big .dropdown-foot a:hover {
   color: #555;
   border-bottom: 0px;
}

.header .navbar-nav .caret {
   border-top-color: #fff !important;
   border-bottom-color: #fff !important;
}

.header .navbar-nav>.open>a .caret,
.header .navbar-nav>.open>a:hover .caret,
.header .navbar-nav>.open>a:focus .caret {
   border-top-color: #fff !important;
   border-bottom-color: #fff !important;
}

/* Sidebar navigation */

.content-box,
.content-box-large {
   margin-bottom: 30px;
   background: #fff;
   border-radius: 10px;
   padding: 5px;
   border-left: 1px solid #eee;
   border-top: 1px solid #eee;
   border-right: 2px solid #eee;
   border-bottom: 2px solid #eee;
}

.content-box-large {
   padding: 20px;
}

.box-with-header {
   border-top: none;
   border-top-left-radius: 0px;
   border-top-right-radius: 0px;
}

.content-box-header {
   min-height: 40px;
   font-size: 16px;
   background: #f5f5f5;
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
   padding: 10px;
   border-left: 1px solid #eee;
   border-top: 1px solid #eee;
   border-right: 2px solid #eee;
}

.content-box-header:after {
   clear: both;
}

.sidebar ul.nav,
.sidebar ul.nav ul {
   list-style: none;
   padding: 0px;
   margin: 0px;
}

.sidebar ul.nav ul {
   margin: 0px;
   padding: 0px;
   display: none;
}

.sidebar .nav li.open ul {
   display: block;
}

.sidebar .nav>li {
   margin: 0;
   border-bottom: 1px dashed #eee;
}

.sidebar .nav>li:last-child {
   border-bottom: 0px;
}

.sidebar .nav>li li {
   margin: 0;
}

.sidebar .nav>li li a {
   padding-left: 25px;
}

.sidebar .nav>li>a {
   font-size: 14px;
   line-height: 20px;
   padding: 15px 15px;
   color: #999;
   display: block;
   font-weight: bold;
   background: none;
   text-decoration: none;
   border-top: 0px;
   font-weight: bold;
}

.sidebar .nav>li>a>i {
   margin-right: 5px;
}

.sidebar .nav>li>ul>li>a {
   font-size: 13px;
   line-height: 20px;
   padding: 8px 10px 8px 40px;
   color: #999;
   background: #fff;
   display: block;
   text-decoration: none;
   border-top: 0px;
   font-weight: bold;
}

.sidebar .nav>li>ul>li.active>a {
   background: #fff;
   border-top: 0px;
   color: #555;
}

.sidebar .nav>li>ul>li>a:hover {
   background: #fff;
   color: #555;
   border-bottom: 0px;
}

.sidebar .nav li a:hover,
.sidebar .nav li.current>a {
   background: #fff;
   color: #555;
   border-bottom: 0px;
}

.sidebar .nav li.open>a {
   background: #fff;
   color: #555;
   border-bottom: 1px dashed #eee;
}

.sidebar .nav a .caret {
   float: right;
   width: 0;
   height: 0;
   display: inline-block;
   vertical-align: top;
   border-top: 4px solid #aaa;
   border-right: 4px solid transparent;
   border-left: 4px solid transparent;
   content: "";
   margin-top: 8px;
   margin-left: 2px;
}

.sidebar .nav a:hover .caret {
   border-top-color: #aaa;
}

.sidebar .nav li.open>a>.caret {
   border-top: none;
   border-bottom: 4px solid #aaa !important;
   border-right: 4px solid transparent;
   border-left: 4px solid transparent;
}

.sidebar .nav li.open>a:hover>.caret {
   border-bottom-color: #aaa;
}

.login-bg {
   background: rgba(255, 255, 255, 0);
   background: -webkit-linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
   background: -moz-linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
   background: -ms-linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
   background: -o-linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
   background: linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
   background-color: #eff0f3;
   background-repeat: no-repeat;
   height: 100%;
}

body {
   background-color: #eff0f3;
}

/** Login & Signup **/

.login-wrapper {
   position: absolute;
   left: 0;
   right: 0;
   text-align: center;
}


.login-wrapper .box {
   margin: 0 auto;
   padding: 30px 0 30px;
   float: none;
   -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 3px, rgba(0, 0, 0, 0.35) 0 0 1px;
   -moz-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 3px, rgba(0, 0, 0, 0.35) 0 0 1px;
   -ms-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 3px, rgba(0, 0, 0, 0.35) 0 0 1px;
   -o-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 3px, rgba(0, 0, 0, 0.35) 0 0 1px;
   box-shadow: rgba(0, 0, 0, 0.4) 0 1px 3px, rgba(0, 0, 0, 0.35) 0 0 1px;
   background: #fff;
   -webkit-border-radius: 6px;
   -moz-border-radius: 6px;
   -ms-border-radius: 6px;
   -o-border-radius: 6px;
   border-radius: 6px;
}

.login-wrapper .box .content-wrap {
   width: 82%;
   margin: 0 auto;
}

.login-wrapper .box h6 {
   text-transform: uppercase;
   margin-bottom: 35px;
   font-size: 18px;
   font-weight: 600;
}

.login-wrapper .box input[type="text"],
.login-wrapper .box input[type="password"] {
   font-size: 15px;
   height: 40px;
   margin-bottom: 10px;
   border-color: #b2bfc7;
   padding-left: 12px;
}

.login-wrapper .box input[type="text"]:focus,
.login-wrapper .box input[type="password"]:focus {
   border: 1px solid #28a0e5;
   outline: none;
   -webkit-box-shadow: inset 0 1px 2px #ddd, 0px 0 5px #28a0e5;
   -moz-box-shadow: inset 0 1px 2px #ddd, 0px 0 5px #28a0e5;
   -ms-box-shadow: inset 0 1px 2px #ddd, 0px 0 5px #28a0e5;
   -o-box-shadow: inset 0 1px 2px #ddd, 0px 0 5px #28a0e5;
   box-shadow: inset 0 1px 2px #dddddd, 0px 0 5px #28a0e5;
}

.login-wrapper .box input[type="password"] {
   margin-bottom: 10px;
}

.login-wrapper .box .action {
   position: relative;
   top: 30px;
   padding: 15px 0px;
}

.login-wrapper .box .signup {
   text-transform: uppercase;
   font-size: 13px;
   padding: 7px 25px;
   border-radius: 5px;
}

.login-wrapper .already {
   margin: 0 auto;
   float: none;
   text-align: center;
   font-size: 13px;
   margin-top: 30px;
}

.login-wrapper .already p {
   display: inline-block;
   color: #222;
}

.login-wrapper .already a {
   color: #222;
   margin-left: 7px;
   border-bottom: 1px solid;
}

.login-wrapper .already a:hover {
   text-decoration: none;
   color: #000;
   border-bottom-color: #000;
}


.login-wrapper .box .social {
   margin: 0 auto;
   width: 90%;
}

.login-wrapper .box .social a.face_login {
   background: #6887c4;
   background: -moz-linear-gradient(top, #6887c4 0%, #4566a9 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #6887c4), color-stop(100%, #4566a9));
   background: -webkit-linear-gradient(top, #6887c4 0%, #4566a9 100%);
   background: -o-linear-gradient(top, #6887c4 0%, #4566a9 100%);
   background: -ms-linear-gradient(top, #6887c4 0%, #4566a9 100%);
   background: linear-gradient(to bottom, #6887c4 0%, #4566a9 100%);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6887c4', endColorstr='#4566a9', GradientType=0);
   border: 1px solid #3B4868;
   border-radius: 3px 3px 3px 3px;
   display: inline-block;
   height: 37px;
   overflow: hidden;
   width: 99%;

   text-decoration: none !important;
}

.login-wrapper .box .social a.face_login:hover {
   background: #6887c4;
   background: -moz-linear-gradient(top, #6887c4 0%, #5773AC 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #6887c4), color-stop(100%, #5773AC));
   background: -webkit-linear-gradient(top, #6887c4 0%, #5773AC 100%);
   background: -o-linear-gradient(top, #6887c4 0%, #5773AC 100%);
   background: -ms-linear-gradient(top, #6887c4 0%, #5773AC 100%);
   background: linear-gradient(to bottom, #6887c4 0%, #5773AC 100%);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6887c4', endColorstr='#5773AC', GradientType=0);
}

.login-wrapper .box .social a.face_login span.face_icon {
   background-color: #39599F;
   border-radius: 3px 0 0 3px;
   float: left;
   height: 37px;
   text-align: center;
   width: 51px;
}

.login-wrapper .box .social a.face_login span.face_icon img {
   margin-top: 5px;
}

.login-wrapper .box .social a.face_login span.text {
   color: #FFFFFF;
   float: left;
   font-size: 15px;
   font-weight: bold;
   margin: 6px 0 0 25px;
   text-shadow: 1px 1px 0 #39599F;
}

.login-wrapper .box .division {
   display: inline-block;
   margin: 17px 0 23px;
   position: relative;
   text-align: center;
   width: 100%;
}

.login-wrapper .box .division hr {
   border-color: #E2E2E4;
   border-width: 1px;
   margin: 0;
   position: absolute;
   width: 40%;
}

.login-wrapper .box .division hr.left {
   top: 13px;
}

.login-wrapper .box .division hr.right {
   bottom: 6px;
   right: 0;
}

.login-wrapper .box .division span {
   color: #666666;
   font-size: 18px;
}

.panel-heading>.panel-title,
.content-box-header .panel-title {
   float: left;
   padding: 10px 15px;
   padding-top: 0px;
}

.panel-heading>.panel-title>*,
.content-box-header .panel-title>* {
   margin: 0;
}

.panel-heading>.panel-title>span,
.content-box-header .panel-title>span {
   font-weight: normal;
}

.panel-heading>.panel-options,
.content-box-header .panel-options {
   float: right;
   padding-right: 15px;
}

.panel-heading>.panel-options>a,
.content-box-header .panel-options>a {
   margin-top: 10px;
}

.panel-heading:before,
.panel-heading:after {
   content: " ";
   display: table;

}

.panel-heading:after {
   clear: both;
}

.panel-body {
   clear: both;
}

.panel-heading>.panel-img {
   float: left;
}

.panel-heading>.panel-title {
   display: block;
}

.panel-heading>.panel-title>p {
   font-size: 14px;
}

.panel-heading>.panel-img {
   overflow: hidden;
}

.panel-heading>.panel-img>a>img {
   max-width: 150px;
}

.panel-title>p {
   margin-top: 5px !important;
}

.date {
   color: gray;
   font-size: 12px;
   margin-bottom: 5px !important;
}

.article>.content-box-large>.panel-heading>.panel-title>img {
   display: block;
   margin-bottom: 20px;
   max-height: 400px;
}

.article>.content-box-large>.panel-heading>.panel-title>h1 {
   margin-bottom: 20px;
}

nav {
   float: right;
}

p {
   margin: 0 0 15px !important;
}

.logo>h1 {
   padding: 6px 0px !important;
}

.logo>h1>a>img {
   width: 120px;
}

.logout-link {
   color: white;
   float: right;
   margin-top: 17px;
}

.page-content {
   margin-top: 20px;
}

.gradeA:hover {
   cursor: pointer;
}

#department_select {
   margin-bottom: 5px;
   height: 30px;
   margin-left: -15px;
}

/* Responsive CSS */


/* Mobile phones */
@media (max-width: 480px) {}

/* Tablets */
@media (max-width: 767px) {
   .container {
      width: 100%;
   }

   .header .logo {
      text-align: center;
      padding-bottom: 10px;
   }

   .header .navbar .nav>li>a:hover {
      background: #0fa6bc;
      border-radius: 5px;
   }

   .navbar-toggle {
      margin-right: 0px !important;
   }
}


/* Desktop */

@media (max-width: 991px) {


   .header .logo {
      text-align: center;
      padding-bottom: 10px;
   }

   .header .form {
      margin: 10px auto;
   }

   .sidebar,
   content-box {
      margin-bottom: 30px;
      width: 100%;
      float: none;
      position: relative;
   }

   .mainy {
      margin-left: 0px;
   }

   .sidebar-dropdown {
      display: block;
      text-align: center;
      margin: 0 auto;
      margin-bottom: 10px;
      border-bottom: 1px dashed #eee;
      padding-bottom: 10px;
   }

   .sidebar-dropdown a,
   .sidebar-dropdown a:hover {
      color: #fff;
      background: #16cbe6;
      display: block;
      padding: 6px 12px;
      border-bottom: 0px;
      box-shadow: 0px 0px 1px #0fa6bc;
      border-radius: 10px;
   }
}

.fc-time-grid .fc-slats td {
   height: 2em !important;
}

.category-title {
   margin-left: 20px;
}

.glyphicon {
   float: left;
}

.employee-photo {
   width: 140px;
   height: 140px;
   -webkit-border-radius: 140px;
   -webkit-background-clip: padding-box;
   -moz-border-radius: 140px;
   -moz-background-clip: padding;
   border-radius: 140px;
   background-clip: padding-box;
   background-size: cover;
   /*background-position: center center;*/
}