#popupcontent h3 {
  border-bottom: 1px solid #ccc;
  font-family: Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;
  padding: 10px 0;
}
#top-nav ul li a .popup {
  position: absolute;
  top: 0;
  left: 50%;
  font-size: 11px;
  background: #f5b000;
  color: white;
  padding: 3px 7px;
  line-height: 1;
  box-shadow: 1px 1px 1px #333;
}
#top-nav ul li a .popup:after {
  content: '';
  display: inline-block;
  text-indent: -999999em;
  background-position: 0 -6397px;
  width: 7px;
  height: 7px;
  position: absolute;
  bottom: -7px;
  left: 0;
}
#top-nav ul li a span {
  vertical-align: top;
}
#top-nav ul li a .icon-burger-menu {
  margin-top: -2px;
}
#top-nav ul li a .icon-search {
  margin-top: -3.5px;
}
#top-nav ul li a .icon-notification {
  margin-top: -6px;
}
#top-nav ul li a .avatar-wrap {
  margin: -9px 10px 0;
  display: inline-block;
}
#top-nav ul li a .avatar-wrap:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
#top-nav ul li a .icon-menu-indicator-bottom {
  margin-top: 4px;
}
#top-nav ul li.hover > a {
  background-position: 0 0;
  background-repeat: repeat-x;
  color: #0f4166;
}
#top-nav ul li .sub-menu {
  position: absolute;
  top: 47px;
  z-index: 2000;
}

#app-name-scrolled {
  float: left;
  display: inline-block;
  text-indent: -999999em;
  background-position: 0 -14px;
  width: 86px;
  height: 14px;
  margin: 20px 30px;
  display: none;
}

#main-nav-expand .sub-menu {
  width: 255px;
  left: 0;
  background: white;
  font-family: Helvetica, Arial, sans-serif;
  box-shadow: 2px 0 5px #c1c1c1;
  display: none;
  z-index: 300;
  overflow-x: hidden;
  overflow-y: scroll;
}
#main-nav-expand .sub-menu .pseudo-title a {
  background: #f9f9f9;
  border-bottom: 1px solid #c9c9c9;
}
#main-nav-expand .sub-menu .pseudo-title a .label {
  font-size: 14px;
  font-weight: bold;
}
#main-nav-expand .sub-menu li {
  border-right: none;
  border-bottom: 1px solid #c9c9c9;
  border-left: none;
  border-top: none;
  width: 100%;
  position: relative;
}
#main-nav-expand .sub-menu li.separator {
  border-top: 1px solid #c9c9c9;
  border-bottom: 1px solid #c9c9c9;
  display: block;
  height: 1px;
  content: '';
  margin-top: -1px;
}
#main-nav-expand .sub-menu li a {
  color: #0f4166;
  width: 205px;
  padding: 25px 25px 20px;
  height: auto;
}
#main-nav-expand .sub-menu li a .icon {
  float: left;
  margin: -5px 10px 0 0;
  display: none;
}
#main-nav-expand .sub-menu li a .label {
  float: left;
  width: 200px;
  font-size: 14px;
  font-family: Helvetica, Arial, sans-serif;
}
#main-nav-expand .sub-menu li a:hover {
  background: #eff6fb;
}
#main-nav-expand .sub-menu li.faved a {
  border-bottom: 1px solid #efefef;
}
#main-nav-expand .sub-menu li.faved a:after {
  display: none;
}
#main-nav-expand .sub-menu li .sub-menu-icon {
  display: block;
  height: 19px;
  position: absolute;
  right: 10px;
  top: 23px;
  width: 11px;
  background-position: 0 -2795px;
}
#main-nav-expand .has-sub a span {
  font-weight: bold;
}

#profile-expand .sub-menu {
  right: -1px;
  width: 256px;
  border: 1px solid #c9c9c9;
  border-top: none;
  display: none;
}
#profile-expand .sub-menu li {
  border: none;
  background: #f9f9f9;
  display: block;
  width: 100%;
}
#profile-expand .sub-menu li a {
  background: none;
}
#profile-expand .sub-menu li a:hover {
  background: none;
}
#profile-expand .sub-menu li.link a {
  background: #e8e8e8;
  display: block;
  width: 216px;
  color: #666;
  padding: 10px 20px;
  border-bottom: 1px solid #c9c9c9;
}
#profile-expand .sub-menu li.card {
  padding: 20px;
  width: 216px;
}
#profile-expand .sub-menu li.card .avatar-wrap {
  float: left;
  width: 80px;
  padding: 4px;
  background: white;
  border: 1px solid #cdcdcd;
  margin: 0 10px 0 0;
}
#profile-expand .sub-menu li.card .avatar-wrap .avatar {
  width: 100%;
  float: left;
}
#profile-expand .sub-menu li.card .credential {
  float: left;
  width: 115px;
}
#profile-expand .sub-menu li.card .credential a {
  padding: 0;
}
#profile-expand .sub-menu li.card .credential .name {
  text-transform: uppercase;
  color: #0f4166;
  margin: 4px 0 4px 0;
  display: block;
  font-size: 14px;
}
#profile-expand .sub-menu li.card .credential .email {
  font: 12px Georgia, Times New Roman;
  margin-bottom: 35px;
  display: block;
}
#profile-expand .sub-menu li.card .credential .email a {
  color: #777;
}
#profile-expand .sub-menu li.card .credential .link {
  font: 12px Georgia, Times New Roman;
  color: #777;
  text-decoration: underline;
  margin: 0 0 5px;
}
#profile-expand .sub-menu li.card .credential .link:hover {
  color: #f5b000;
}
#profile-expand .sub-menu li.logout a {
  border-top: 1px solid #c9c9c9;
  background: #f5b000;
  width: 216px;
  text-transform: uppercase;
  text-align: center;
  padding: 15px 20px;
  color: white;
}
#profile-expand .sub-menu li.logout a:hover {
  color: #0f4166;
}

#notification-expand .sub-menu {
  right: -200px;
  width: 400px;
  border: 1px solid #c9c9c9;
  border-top: none;
  display: none;
  background: #f9f9f9;
  color: #666;
}
#notification-expand .sub-menu li.hover,
#notification-expand .sub-menu li {
  border: none;
  display: block;
  width: 100%;
  border-top: 1px solid #e1e3e1;
}
#notification-expand .sub-menu li.hover a,
#notification-expand .sub-menu li a {
  height: auto;
  color: #666;
  width: 360px;
  background: #f9f9f9;
}
#notification-expand .sub-menu li.hover a:after,
#notification-expand .sub-menu li a:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
#notification-expand .sub-menu li.hover a:hover,
#notification-expand .sub-menu li a:hover {
  background: #eff6fb;
}
#notification-expand .sub-menu li.hover a .thumb,
#notification-expand .sub-menu li a .thumb {
  float: left;
  margin: 0 15px 0 0;
  padding: 3px;
  background: white;
  border: 1px solid #c9c9c9;
}
#notification-expand .sub-menu li.hover a .thumb img,
#notification-expand .sub-menu li a .thumb img {
  display: block;
  margin: 0;
}
#notification-expand .sub-menu li.hover a .info,
#notification-expand .sub-menu li a .info {
  float: left;
  width: 285px;
}
#notification-expand .sub-menu li.hover a .info .title,
#notification-expand .sub-menu li a .info .title {
  display: block;
  font: 14px Georgia, Times New Roman;
  margin: 0 0 2px;
  line-height: 1.3;
}
#notification-expand .sub-menu li.hover a .info .date,
#notification-expand .sub-menu li a .info .date {
  font-weight: lighter;
  font-size: 11px;
}
#notification-expand .sub-menu li.hover.title,
#notification-expand .sub-menu li.title {
  background: #e7e7e7;
  border-top: none;
}
#notification-expand .sub-menu li.hover.title span,
#notification-expand .sub-menu li.title span {
  padding: 10px 20px;
  display: block;
}
#notification-expand .sub-menu li.hover.all,
#notification-expand .sub-menu li.all {
  border-top: 1px solid #c9c9c9;
}
#notification-expand .sub-menu li.hover.all a,
#notification-expand .sub-menu li.all a {
  background: #b8b8b8;
  padding: 15px 20px;
  text-align: center;
  text-transform: uppercase;
}
#notification-expand .sub-menu li.hover.all a:hover,
#notification-expand .sub-menu li.all a:hover {
  background: #f5b000;
}

#search-expand.focused {
  background-position: 0 0;
  background-repeat: repeat-x;
  color: #0f4166;
}
#search-expand.focused .icon-search {
  background-position: 0 -4547px;
}
#search-expand #search-form {
  display: none;
}

#search-form {
  float: left;
}
#search-form input[type="text"] {
  background: none;
  border: none;
  border-bottom: 1px solid #c9c9c9;
  margin-top: 5px;
  margin-right: 20px;
  padding: 7px 15px;
  width: 0;
}

.hover .sub-menu {
  display: block;
}

.scrolled #top-nav {
  position: fixed;
  width: 960px;
  top: 0;
}
.scrolled #top-nav-placeholder {
  display: block;
}
.scrolled #main-nav-expand .sub-menu {
  left: -146px;
}
.scrolled #app-name-scrolled {
  display: block;
}

#user-role {
  display: block;
  border-bottom: 1px solid white;
  background: #e2e2e2;
  overflow: hidden;
}
#user-role:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
#user-role.expanded .title:after {
  display: none;
}

#current-user-role {
  background: #f5b000;
  color: white;
  font-family: Helvetica, Arial, sans-serif;
  float: left;
  width: 230px;
  border-right: 1px solid white;
  position: relative;
  z-index: 100;
}
#current-user-role .inside {
  margin: 10px 10px 13px 37px;
  height: 39px;
}
#current-user-role .pre-title {
  font-size: 14px;
  margin: 0 0 1px 0;
}
#current-user-role .title {
  font-size: 24px;
  position: relative;
  /*
          &:after{
              content: '';
              @include sprite_replace_text( user-role-pointer, 12, 11 );
              position: absolute;
              top: 7px;
              right: 0;
              }*/
            }

            #switch-role {
              float: left;
              width: 730px;
              margin-left: -730px;
              background: #f5b000;
              font-family: Helvetica, Arial, sans-serif;
              color: white;
              position: relative;
              z-index: 80;
            }
            #switch-role:after {
              content: ".";
              display: block;
              height: 0;
              clear: both;
              visibility: hidden;
            }
            #switch-role a {
              color: white;
              text-decoration: none;
            }
            #switch-role a:hover {
              text-decoration: underline;
            }
            #switch-role .inside {
              margin: 10px 10px 13px 0;
              padding: 0 0 0 37px;
              height: 39px;
              border-left: 1px solid white;
            }
            #switch-role .title {
              font-size: 14px;
            }
            #switch-role ul li {
              float: left;
              font-size: 24px;
              padding: 0 15px 0 20px;
              position: relative;
            }
            #switch-role ul li:after {
              content: '';
              display: block;
              width: 7px;
              height: 7px;
              background: white;
              position: absolute;
              top: 7px;
              left: 0;
              border-radius: 50%;
            }
            #switch-role ul li:first-child {
              padding: 0 15px 0 0;
            }
            #switch-role ul li:first-child:after {
              display: none;
            }

            #user-info {
              background: #e2e2e2;
            }
            #user-info .inside {
              padding: 20px;
            }
            #user-info .inside:after {
              content: ".";
              display: block;
              height: 0;
              clear: both;
              visibility: hidden;
            }
            #user-info .inside .avatar-wrap {
              float: left;
              width: 212px;
              margin: 0 20px 0 0;
            }
            #user-info .inside .avatar-wrap img {
              width: 100%;
            }
            #user-info .inside .info {
              float: left;
              width: 687px;
              padding: 45px 0 0 0;
              color: #787a70;
            }
            #user-info .inside .info .name {
              font-family: Helvetica, Arial, sans-serif;
              font-size: 24px;
              color: #61428c;
              font-weight: bold;
              margin: 0 0 3px 0;
            }
            #user-info .inside .info .faculty {
              font-family: Helvetica, Arial, sans-serif;
              font-size: 16px;
            }
            #user-info .inside .info .dreams {
              margin: 17px 0 0 0;
              padding: 17px 0 0 0;
              border-top: 1px solid white;
              line-height: 1.4;
              font-size: 13px;
            }
            #user-info .inside .info .dreams h4 {
              font-family: Helvetica, Arial, sans-serif;
              font-size: 16px;
              margin: 0 0 5px 0;
            }

            #upcoming-agenda {
              display: block;
              height: 60px;
              border-top: 1px solid #c9c9c9;
              border-bottom: 1px solid #c9c9c9;
              background: #f2f2f2;
              color: #666;
            }
            #upcoming-agenda:after {
              content: ".";
              display: block;
              height: 0;
              clear: both;
              visibility: hidden;
            }
            #upcoming-agenda .section-title {
              float: left;
              font-family: Helvetica, Arial, sans-serif;
              font-size: 18px;
              padding: 24px 32px 18px;
              height: 18px;
              border-right: 1px solid #c9c9c9;
              line-height: 1;
            }
            #upcoming-agenda .section-title span {
              vertical-align: top;
            }
            #upcoming-agenda .section-title .icon {
              margin: -6px 5px 0 0;
            }
            #upcoming-agenda .section-content {
              float: left;
              width: 728px;
              position: relative;
            }
            #upcoming-agenda .section-content .nav {
              position: absolute;
              top: 15px;
            }
            #upcoming-agenda .section-content .nav.previous {
              left: 15px;
            }
            #upcoming-agenda .section-content .nav.next {
              right: 15px;
            }

            #agenda-list {
              display: block;
              padding: 0 50px;
              font-family: Helvetica, Arial, sans-serif;
              font-size: 12px;
              height: 60px;
              overflow: hidden;
            }
            #agenda-list li {
              display: block;
              height: 60px;
              width: 100%;
            }
            #agenda-list li a {
              color: #666;
              display: block;
              height: 60px;
              width: 100%;
            }
            #agenda-list li a .column {
              float: left;
              width: 23%;
              margin: 15px 0;
              border-left: 1px solid #c9c9c9;
              height: 30px;
            }
            #agenda-list li a .column:first-child {
              border-left: none;
            }
            #agenda-list li a .column:last-child {
              width: 30%;
            }
            #agenda-list li a .column span {
              display: block;
              padding: 0 20px;
            }
            #agenda-list li a .column span.top {
              padding-bottom: 5px;
            }

            #body-nav, #supernav {
              font-family: Helvetica, Arial, sans-serif;
              font-size: 16px;
              color: #a1a1a2;
              border-bottom: 1px solid #c9c9c9;
            }
            #body-nav ul, #supernav ul {
              padding: 40px 40px 0;
            }
            #body-nav ul:after, #supernav ul:after {
              content: ".";
              display: block;
              height: 0;
              clear: both;
              visibility: hidden;
            }
            #body-nav ul li, #supernav ul li {
              float: left;
            }
            #body-nav ul li a, #supernav ul li a {
              float: left;
              color: #a1a1a2;
              position: relative;
              padding: 5px 15px 5px;
              border-bottom: 5px solid white;
              border-left: 1px solid #a1a1a2;
              margin-bottom: 25px;
            }
            #body-nav ul li:first-child a, #supernav ul li:first-child a {
              border-left: none;
              padding-left: 0;
            }
            #body-nav ul li:hover, #body-nav ul li.active, #body-nav ul li.current, #supernav ul li:hover, #supernav ul li.active, #supernav ul li.current {
              border-bottom: 5px solid #0f4166;
            }
            #body-nav ul li:hover a, #body-nav ul li.active a, #body-nav ul li.current a, #supernav ul li:hover a, #supernav ul li.active a, #supernav ul li.current a {
              color: #0f4166;
            }
            #body-nav ul li:hover a:after, #body-nav ul li.active a:after, #body-nav ul li.current a:after, #supernav ul li:hover a:after, #supernav ul li.active a:after, #supernav ul li.current a:after {
              content: '';
              display: block;
              display: inline-block;
              text-indent: -999999em;
              background-position: 0 -84px;
              width: 14px;
              height: 7px;
              position: absolute;
              bottom: -42px;
              left: 50%;
              margin-left: -7px;
            }

            #widgets {
              padding: 15px 0;
            }
            #widgets:after {
              content: ".";
              display: block;
              height: 0;
              clear: both;
              visibility: hidden;
            }
            #widgets .row {
              display: block;
              margin: 15px 15px 0;
            }
            #widgets .row:first-child {
              margin-top: 0;
            }
            #widgets .row:after {
              content: ".";
              display: block;
              height: 0;
              clear: both;
              visibility: hidden;
            }
            #widgets .widget {
              float: left;
              width: 300px;
              height: 300px;
              margin: 0 0 0 15px;
              color: #666;
              font-family: Helvetica, Arial, sans-serif;
              position: relative;
            }
            #widgets .widget.two-third {
              width: 615px;
            }
            #widgets .widget:first-child {
              margin-left: 0;
            }
            #widgets .widget .inside {
              background: #f6f6f6;
              border: 1px solid #c9c9c9;
              padding: 20px;
              height: 258px;
            }
            #widgets .widget .widget-header {
              border-bottom: 1px solid #c9c9c9;
              display: block;
              padding: 0 0 10px 0;
              margin: 0 0 10px 0;
            }
            #widgets .widget .widget-icon {
              float: left;
              border-right: 1px solid #c9c9c9;
              padding: 0 10px 0 0;
              margin: 0 10px 0 0;
            }
            #widgets .widget .widget-title {
              font-family: Helvetica, Arial, sans-serif;
              font-size: 17px;
              margin-bottom: 2px;
              color: #61428c;
            }
            #widgets .widget .widget-desc {
              font-size: 12px;
            }
            #widgets .widget .widget-body {
              display: block;
              width: 100%;
              height: 210px;
            }
            #widgets .widget .widget-body.has-footer {
              height: 160px;
            }
            #widgets .widget .widget-footer {
              position: absolute;
              bottom: 15px;
              left: 0;
              display: block;
              width: 100%;
            }
            #widgets .widget .widget-footer .widget-footer-inside {
              display: block;
              padding: 15px 0 0;
              margin: 0 20px;
              border-top: 1px solid #c9c9c9;
              text-align: center;
            }
            #widgets .widget .widget-footer .widget-footer-inside.no-border-top {
              border-top: none;
            }
            #widgets .widget .widget-footer .widget-footer-inside .icon-decreasing,
            #widgets .widget .widget-footer .widget-footer-inside .icon-increasing {
              margin-bottom: -4px;
              margin-right: 5px;
            }
            #widgets .widget .widget-footer a {
              color: #0f4166;
            }
            #widgets .widget.todolist .widget-footer-inside {
              text-align: right;
            }
            #widgets .widget.todolist .widget-footer-inside .button {
              margin-left: 10px;
            }
            #widgets .widget.avatars .widget-body ul {
              float: left;
              margin: 10px 0 0 3px;
            }
            #widgets .widget.avatars .widget-body ul li {
              float: left;
              margin: 0 5px 5px 0;
            }
            #widgets .widget.avatars .widget-body ul li a {
              float: left;
              width: 40px;
              height: 40px;
              padding: 2px;
              border: 1px solid #c9c9c9;
              background: white;
            }
            #widgets .widget.avatars .widget-body ul li a img {
              margin: 0;
              width: 100%;
            }

            #widgets-control .inside {
              background: #f6f6f6;
              border: 1px solid #c9c9c9;
              margin: 0 15px 60px;
              padding: 10px 20px;
            }
            #widgets-control .inside:after {
              content: ".";
              display: block;
              height: 0;
              clear: both;
              visibility: hidden;
            }
            #widgets-control ul {
              float: right;
            }
            #widgets-control ul li {
              float: left;
              padding: 0 20px;
              border-right: 1px solid #c9c9c9;
            }
            #widgets-control ul li:first-child {
              padding-left: 0;
            }
            #widgets-control ul li:last-child {
              padding-right: 0;
              border-right: none;
            }
            #widgets-control ul li a {
              float: left;
              font-family: Helvetica, Arial, sans-serif;
              margin-bottom: 7px;
              color: #666;
            }
            #widgets-control ul li a:hover {
              color: #f5b000;
            }
            #widgets-control ul li a .icon {
              margin: 5px 5px -7px 0;
            }

            #gpa-wheel {
              display: block;
              width: 154px;
              height: 151px;
              background-position: 0 -501px;
              margin: 20px auto 0;
            }
            #gpa-wheel.gpa-1 {
              background-position: 0 -652px;
            }
            #gpa-wheel.gpa-2 {
              background-position: 0 -954px;
            }
            #gpa-wheel.gpa-3 {
              background-position: 0 -1105px;
            }
            #gpa-wheel.gpa-4 {
              background-position: 0 -1256px;
            }
            #gpa-wheel.gpa-5 {
              background-position: 0 -1407px;
            }
            #gpa-wheel.gpa-6 {
              background-position: 0 -1558px;
            }
            #gpa-wheel.gpa-7 {
              background-position: 0 -1709px;
            }
            #gpa-wheel.gpa-8 {
              background-position: 0 -1860px;
            }
            #gpa-wheel.gpa-9 {
              background-position: 0 -2011px;
            }
            #gpa-wheel.gpa-10 {
              background-position: 0 -803px;
            }
            #gpa-wheel .label {
              font: 30px Helvetica, Arial, sans-serif;
              color: #666;
              display: block;
              text-align: center;
              padding: 60px 0;
            }

            .yourcredit .row {
              display: block;
              margin: 25px 0 0 !important;
            }
            .yourcredit .row:after {
              content: ".";
              display: block;
              height: 0;
              clear: both;
              visibility: hidden;
            }
            .yourcredit .row .column {
              float: left;
              font-family: Helvetica, Arial, sans-serif;
              vertical-align: middle;
            }
            .yourcredit .row .column.icon-wrap {
              width: 42px;
              margin-top: 2px;
            }
            .yourcredit .row .column.credit-count {
              font-size: 48px;
              width: 141px;
              text-align: center;
            }
            .yourcredit .row .column.credit-label {
              font-size: 14px;
              margin-top: 15px;
            }

            #performance-meter {
              display: inline-block;
              text-indent: -999999em;
              background-position: 0 -4946px;
              width: 183px;
              height: 99px;
              display: block;
              margin: 25px auto 0;
            }
            #performance-meter.performance-1 {
              background-position: 0 -5045px;
            }
            #performance-meter.performance-2 {
              background-position: 0 -5243px;
            }
            #performance-meter.performance-3 {
              background-position: 0 -5342px;
            }
            #performance-meter.performance-4 {
              background-position: 0 -5441px;
            }
            #performance-meter.performance-5 {
              background-position: 0 -5540px;
            }
            #performance-meter.performance-6 {
              background-position: 0 -5639px;
            }
            #performance-meter.performance-7 {
              background-position: 0 -5738px;
            }
            #performance-meter.performance-8 {
              background-position: 0 -5837px;
            }
            #performance-meter.performance-9 {
              background-position: 0 -5936px;
            }
            #performance-meter.performance-10 {
              background-position: 0 -5144px;
            }

            #performance-legend {
              display: block;
              height: 42px;
              position: relative;
              margin: 5px 0 0;
            }
            #performance-legend .icon {
              position: absolute;
              top: 0;
            }
            #performance-legend .icon-indicator-sad {
              left: 25px;
            }
            #performance-legend .icon-indicator-smile {
              right: 25px;
            }

            .widget.attendance .row {
              border-top: 1px solid #c9c9c9;
              padding: 20px 0;
              margin: 0 !important;
            }
            .widget.attendance .row:first-child {
              border-top: none;
            }
            .widget.attendance .row:after {
              content: ".";
              display: block;
              height: 0;
              clear: both;
              visibility: hidden;
            }
            .widget.attendance .row .column {
              float: left;
            }
            .widget.attendance .row .column.icon-wrap {
              width: 42px;
              margin: 0 20px 0 0;
            }
            .widget.attendance .row .column.label {
              width: 196px;
              font-size: 12px;
              color: #666;
              line-height: 1.3;
            }
            .widget.attendance .row .column.label a {
              color: #666;
            }
            .widget.attendance .row .column.label a:hover {
              text-decoration: underline;
            }

            #body .inside {
              padding: 20px 40px 20px;
              display: block;
            }
            #body .row {
              width: 100%;
            }
            #body .row:after {
              content: ".";
              display: block;
              height: 0;
              clear: both;
              visibility: hidden;
            }
            #body .row .column {
              float: left;
              width: 280px;
              margin: 0 0 20px 20px;
            }
            #body .row .column.two-third {
              width: 580px;
            }
            #body .row .column.two-third.center {
              margin-left: 150px;
            }
            #body .row .column.three-third {
              width: 880px;
            }
            #body .row .column.has-border .inside {
              border: 1px solid #c9c9c9;
              background: #efefef;
            }
            #body .row .column:first-child {
              margin-left: 0;
            }
            #body .row .column .inside {
              padding: 15px;
            }

            #body-components {
              min-height: 500px;
            }

            .section {
              padding: 20px 40px;
            }
            .section.contenthead h1 {
              margin: 0;
            }

            .supercontent {
              background: #f9f9f9;
              border-bottom: 1px solid #c9c9c9;
              line-height: 1.6;
              padding: 20px 40px;
            }
            .supercontent h2 {
              font-size: 20px;
            }

            .styled-content, .section {
              font-family: Georgia, Times New Roman;
              line-height: 1.6;
            }
            .styled-content h1, .styled-content h2, .styled-content h3, .styled-content h4, .styled-content h5, .styled-content h6, .section h1, .section h2, .section h3, .section h4, .section h5, .section h6 {
              font-family: Helvetica, Arial, sans-serif;
              margin-top: 15px;
              margin-bottom: 10px;
            }
            .styled-content h1, .section h1 {
              font-size: 24px;
            }
            .styled-content h2, .section h2 {
              font-size: 20px;
            }
            .styled-content h3, .section h3 {
              font-size: 17px;
            }
            .styled-content h5, .section h5 {
              font-size: 11px;
            }
            .styled-content h6, .section h6 {
              font-size: 9px;
            }
            .styled-content strong, .section strong {
              font-weight: bold;
            }
            .styled-content em, .section em {
              font-style: italic;
            }
            .styled-content p, .styled-content ul, .styled-content ol, .section p, .section ul, .section ol {
              margin-bottom: 15px;
            }
            .styled-content li, .section li {
              margin: 0 0 10px 20px;
            }
            .styled-content li ul, .styled-content li ol, .section li ul, .section li ol {
              margin: 10px 0 0 0;
            }
            .styled-content li ul li, .styled-content li ol li, .section li ul li, .section li ol li {
              margin: 0 0 5px 20px;
            }
            .styled-content ul li, .section ul li {
              list-style: disc;
            }
            .styled-content ol li, .section ol li {
              list-style: decimal;
            }
            .styled-content a, .section a {
              color: #0f4166;
            }
            .styled-content a:hover, .section a:hover {
              color: #f5b000;
            }
            .styled-content pre,
            .styled-content code, .section pre,
            .section code {
              font-family: Consolas, monaco, monospace;
            }
            .styled-content pre, .section pre {
              background: red;
              padding: 0;
              margin: 0;
            }
            .styled-content blockquote, .section blockquote {
              font-size: 1.4em;
              padding: 20px 40px 10px;
              border-left: 5px solid #999;
              background: #efefef;
            }
            .styled-content label, .section label {
              color: #888;
              font: 0.9em Helvetica, Arial, sans-serif;
              display: block;
              margin: 0 0 7px 0;
            }
            .styled-content input[type="text"],
            .styled-content input[type="email"],
            .styled-content input[type="password"],
            .styled-content textarea, .section input[type="text"],
            .section input[type="email"],
            .section input[type="password"],
            .section textarea {
              width: 97.5%;
              -moz-box-sizing: border-box;
              -webkit-box-sizing: border-box;
              box-sizing: border-box;
            }
            .styled-content .custom-select, .section .custom-select {
              width: 100%;
            }
            .styled-content .custom-select .ffSelectWrapper, .section .custom-select .ffSelectWrapper {
              width: 100%;
              margin: 0;
            }

            /* Popup using Formalhaut */
            .popup-border {
              border: 0px solid #ccc;
              border-radius: 10px;
              position: absolute;
              z-index: 11005;
              padding: 15px;
              background: #fff;
            }

            .popup-background {
              position: absolute;
              z-index: 11000;
              top: 0;
              left: 0;
              width: 100%;
              height: 100%;
              background: rgba(0, 0, 0, 0.7);
            }

            .popup-full-wrap {
              position: fixed;
              top: 0;
              left: 0;
              z-index: 10999;
              opacity: 0;
            }

            .popup-inner-wrap {
              position: absolute;
              z-index: 11001;
              overflow: auto;
            }

            .popup-second-inner-wrap {
              padding: 30px 0;
            }


            .popup-close-button:focus, .popup-close-button:hover {
              color: #000;
              text-decoration: none;
              cursor: pointer;
              filter: alpha(opacity=50);
              opacity: .5;
            }
            button.popup-close-button {
              -webkit-appearance: none;
              padding: 0;
              cursor: pointer;
              background: 0 0;
              border: 0;
            }
            .popup-close-button {
              float: right;
              font-size: 16px;
              font-weight: 700;
              line-height: 1;
              color: #000;
              text-shadow: 0 1px 0 #fff;
              filter: alpha(opacity=20);
              opacity: .2;
            }
            .modal-content {
              padding: 20px;
            }
            .looptemplate {
              display: none;
            }

            .looptemplate2 {
              display: none;
            }

            .col-md-12 .dataTables_wrapper{
              overflow-y: hidden;
              padding-right: 10px;
              /*overflow: auto;*/
            }
            .col-md-12 div div div div{
              margin-bottom: 10px;
            }
            .edit-label .card-label {
              float: left;
              height: 30px;
              margin: 0 10px 10px 0;
              width: 34px;
            }
            .card-label {
              height: 40px;
              width: 40px;
              border-radius: 3px;
              color: #fff;
              display: block;
              font-weight: 700;
              overflow-x: hidden;
              padding: 13px;
              margin: 3px;
              position: relative;
              text-overflow: ellipsis;
              text-shadow: 0 0 5px rgba(0,0,0,.2),0 0 2px #000;
              white-space: nowrap;
            }