@charset "UTF-8";
@font-face {
  font-family: "Dosis";
  src: url("/assets/Dosis.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
body {
  margin: 0;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 13.5px;
  background: #262626;
  color: #ccc;
  overflow: hidden;
}

#blackout, #cropper-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 100000;
  opacity: 0;
  visibility: hidden;
  transition: opacity 250ms;
}
#blackout.on, #cropper-container.on {
  opacity: 1;
  visibility: visible;
}

.blackout, #cropper-screen {
  position: absolute;
  width: 100%;
  height: 100vh;
  background: #000;
  opacity: 0.6;
}

.spinner {
  position: absolute;
  display: block;
  margin: auto;
  text-align: center;
  width: 120px;
  opacity: 0.85;
  left: calc(50vw - 60px);
  top: calc(50vh - 100px);
}

#cropper {
  position: relative;
  margin: auto;
  margin-top: 40px;
  text-align: center;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC");
}

#cropper-image, #cropper-crop-box-image {
  width: 100%;
}

#cropper-shade {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #000;
  opacity: 0.5;
}

#cropper-crop-box {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

#cropper-view-box {
  overflow: hidden;
  width: 100%;
  height: 100%;
  cursor: grab;
}

#cropper-handle-ne, #cropper-handle-se, #cropper-handle-sw, #cropper-handle-nw {
  position: absolute;
  background: #fff;
  width: 6px;
  height: 6px;
  opacity: 0.75;
}

#cropper-handle-ne {
  cursor: nesw-resize;
  right: -3px;
  top: -3px;
}

#cropper-handle-se {
  cursor: nwse-resize;
  right: -3px;
  bottom: -3px;
}

#cropper-handle-sw {
  cursor: nesw-resize;
  left: -3px;
  bottom: -3px;
}

#cropper-handle-nw {
  cursor: nwse-resize;
  left: -3px;
  top: -3px;
}

#cropper-buttons {
  text-align: center;
  position: relative;
  margin: auto;
  z-index: 100000;
  background: #00000080;
  padding: 10px;
}

#cropper-cancel, #cropper-save {
  display: inline-block;
  margin: 0 4px;
}

#cropper-canvas {
  display: none;
  position: absolute;
  z-index: 100000;
}

#freespace {
  position: relative;
  overflow-y: scroll;
  overflow-x: hidden;
  height: calc(100vh - 50px);
  background: #2f2f2f;
  display: none;
}

@media (min-width: 720px) {
  #freespace {
    overflow: auto;
    height: auto;
  }

  .pane {
    overflow-y: scroll;
  }
  .pane::-webkit-scrollbar {
    width: 1em;
  }
  .pane::-webkit-scrollbar-track {
    background: #1e1e1e;
  }
  .pane::-webkit-scrollbar-thumb {
    background-color: #0c0c0c;
  }
}
#pane1 {
  overflow-x: hidden;
  height: calc(100vh - 58px);
  padding: 10px;
}

#pane2 {
  display: none;
  float: right;
  width: 500px;
  height: calc(100vh - 38px);
  padding-left: 20px;
  background: #2f2f2f;
}

@media (min-width: 1200px) {
  #pane2 {
    width: 640px;
  }
}
h1, h2, h3, h4 {
  font-family: "Dosis", sans-serif;
  color: #ddd;
  font-weight: normal;
}

.form {
  border-collapse: separate;
  border-spacing: 5px;
  margin-left: -5px;
  margin-bottom: 12px;
}
.form th {
  background: #444;
  color: #ccc;
  font-weight: normal;
  padding: 5px 10px;
  text-align: left;
}
.form td {
  min-width: 280px;
}
.form td.form-checkbox-cell {
  min-width: 1px;
}

.form-field-no-edit {
  padding: 6px 10px;
  background: #444;
  line-height: 1.5;
}

select, input, textarea {
  border: 1px solid #000;
  background-color: #222;
  color: #ddd;
  outline: none;
}
select:focus, input:focus, textarea:focus {
  border-color: #666;
}

select {
  padding: 6px 3px;
}

textarea {
  margin-bottom: -5px;
}

input, textarea {
  padding: 7px;
  border-radius: 0px;
  font-size: inherit;
  font-family: inherit;
}

input[type=checkbox] {
  height: 24px;
}

input[type=text], textarea {
  width: 100%;
}

input[type=file] {
  display: none;
}

@media (min-width: 500px) {
  input[type=text], textarea {
    max-width: 300px;
  }
}
input[type=text].on {
  border-color: #006c95;
  background-color: #006c95;
  color: #eee;
}
input[type=text].on:focus {
  border-color: #1a7cdf;
}

input[type=text]:disabled {
  color: #666;
  border-color: #181818;
}

.submit, .delete, .action, .cancel {
  color: #fff;
  border: none;
  outline: none;
  padding: 7px;
  font-size: 1.05em;
  width: 90px;
  border-radius: 4px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

.submit {
  margin-right: 5px;
  background: #007a5e;
}
.submit:hover {
  background: #009270;
}
.submit:disabled {
  background: #333;
  cursor: default;
}

.delete {
  background: #ac3434;
}
.delete:hover {
  background: #c73c3c;
}

.action {
  background: #006c95;
}
.action:hover {
  background: #1a7cdf;
}

.cancel {
  background: #555;
}
.cancel:hover {
  background: #666;
}

.spacer {
  padding-bottom: 5px;
}

#new-version-notification {
  display: none;
  position: absolute;
  right: 15px;
  bottom: 15px;
  background: #4f4f4f;
  border: 1px solid #666;
  color: #fff;
  padding: 6px 12px;
  border-radius: 4px;
  width: 220px;
  z-index: 1000;
}
#new-version-notification.show {
  display: block;
}
@media (min-width: 450px) {
  #new-version-notification {
    width: auto;
    right: 35px;
    bottom: 20px;
  }
}

#new-version-reload {
  background: none;
  border: none;
  outline: none;
  cursor: pointer;
  text-transform: uppercase;
  font-weight: bold;
  color: #a1f8ac;
}

.info-icon {
  width: 15px;
  vertical-align: text-top;
}

.tooltip-text {
  display: none;
}

.tooltip {
  opacity: 0;
  position: absolute;
  background: #5e3966;
  border: 1px solid #2d1c31;
  width: 220px;
  padding: 5px 8px;
  border-radius: 3px;
  box-shadow: #000 -1px 2px 2px;
  transition: opacity 100ms;
}
.tooltip ul {
  margin: 0;
  margin-top: 6px;
  margin-bottom: 3px;
  padding-inline-start: 26px;
}

.inline-help {
  color: #999;
  margin-left: 3px;
  vertical-align: middle;
}
.inline-help:hover {
  color: #ccc;
}
.inline-help.hide-on-mobile {
  display: none;
}
@media (min-width: 500px) {
  .inline-help.hide-on-mobile {
    display: inline;
  }
}

@media (min-width: 500px) {
  .mobile-help {
    display: none;
  }
}

.progress-bar, .progress-bar-inner {
  height: 24px;
}

.progress-bar {
  background: #171717;
  overflow: hidden;
  width: 240px;
  border-radius: 9px;
  padding: 5px;
  margin-bottom: 15px;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.08);
}

.progress-bar-inner {
  width: 0%;
  border-radius: 6px;
  background-color: #008abe;
  background-size: 30px 30px;
  background-image: linear-gradient(135deg, 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);
  animation: animate-stripes 1.5s linear infinite;
  transition: 0.5s linear;
  transition-property: width;
}

@keyframes animate-stripes {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 60px 0;
  }
}
.header-banner {
  padding: 8px 12px;
  font-size: 16px;
  font-family: "Dosis", sans-serif;
  background: #191919;
  border-bottom: 1px solid #000;
  color: #e9e9e9;
}

#header-banner-location img {
  width: 18px;
  vertical-align: sub;
}

.home-button {
  font-size: inherit;
  font-family: inherit;
  color: inherit;
  background: none;
  outline: none;
  border: none;
  cursor: pointer;
}

#header-banner-app-title {
  display: none;
}
#header-banner-app-title.home {
  display: inline;
}
@media (min-width: 500px) {
  #header-banner-app-title {
    display: inline;
  }
}

#header-banner-app-icon img {
  width: 18px;
  vertical-align: sub;
}

#header-banner-user {
  float: right;
  position: relative;
  margin: -8px -12px;
  padding: 9px 13px;
  z-index: 1;
  cursor: pointer;
  display: none;
}
#header-banner-user.show {
  display: block;
}
#header-banner-user.open {
  background: #fff;
  color: #000;
}

#header-banner-user-menu {
  position: absolute;
  right: 0;
  top: 38px;
  box-shadow: -1.5px 1.5px 2px #000;
  width: 145px;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 14px;
  display: none;
}
#header-banner-user-menu.show {
  display: block;
}

.header-banner-user-arrow {
  font-size: 12px;
}

.header-banner-user-menu-item {
  cursor: pointer;
  background: #fff;
  color: #333;
  padding: 7px 10px;
  border-top: 1px solid #ddd;
  display: none;
}
.header-banner-user-menu-item:hover {
  background: #f2f2f2;
}
.header-banner-user-menu-item.show {
  display: block;
}
.header-banner-user-menu-item.header-banner-user-switch {
  display: block;
}
.header-banner-user-menu-item i {
  vertical-align: middle;
  display: inline-block;
  width: 18px;
}
.header-banner-user-menu-item i.icon-plus {
  font-size: 12px;
}

.header-banner-namespace-switch {
  display: flex;
  align-items: center;
}
.header-banner-namespace-switch i {
  margin-right: 4px;
}

.manager-items, .manager-item-add {
  max-width: 100%;
  margin-bottom: 8px;
  border-collapse: collapse;
}
.manager-items tr, .manager-item-add tr {
  border-bottom: 1px solid #3e3e3e;
}
.manager-items td, .manager-item-add td {
  position: relative;
}

.manager-list-title {
  background: #000;
  color: #ddd;
  padding: 10px;
  margin-left: 1px;
  margin-bottom: 2px;
}

.manager-list-title-quantity {
  float: right;
}

.manager-item {
  width: 280px;
  display: block;
  background: none;
  border: none;
  outline: none;
  padding: 10px;
  text-align: left;
  color: #ccc;
  cursor: pointer;
}
.manager-item:hover {
  background: #333;
  color: #fff;
}
.manager-item.inactive {
  color: #666;
}
.manager-item.inactive:hover {
  color: #aaa;
}
.manager-item.inactive.selected {
  color: #fff;
}
.manager-item.selected {
  background: #006c95;
  color: #fff;
}
.manager-item:disabled {
  background: #ddd;
  color: #888;
  cursor: default;
}
.manager-item-add .manager-item {
  background: #007a5e;
  color: #fff;
}
.manager-item-add .manager-item:hover {
  background: #009270;
}
.manager-item-add .manager-item.selected {
  background: #009270;
}

.manager-item-timeblock {
  width: 200px;
  color: #777;
  padding-left: 10px;
}

.manager-item-assign-time {
  width: 26px;
  cursor: pointer;
}
.manager-item-assign-time img {
  width: 100%;
  vertical-align: middle;
  opacity: 30%;
}
.manager-item-assign-time:hover img {
  opacity: 85%;
}

.manager-editor {
  margin-bottom: 60px;
}

.manager-status {
  margin-top: 10px;
}

.manager-saved {
  color: #00c295;
}

.manager-access-failed {
  color: #f67171;
}

.manager-container {
  position: relative;
}

.manager-disable-screen {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: #333;
  opacity: 0.6;
  z-index: 2;
}

.activity-image, .ew-image, .settings-adviser-meeting-image {
  width: 100px;
  display: block;
  margin-bottom: 5px;
  border-radius: 3px;
}

.activity-image-button, .ew-image-button, .settings-namespace-icon-button, .settings-adviser-meeting-image-button {
  width: 100px;
  padding: 5px 8px;
  border-radius: 3px;
  background: #e6e6e6;
  color: #222;
}
.activity-image-button:hover, .ew-image-button:hover, .settings-namespace-icon-button:hover, .settings-adviser-meeting-image-button:hover {
  background: #ccc;
}

.activity-nth-week-container {
  margin: 4px 0;
  margin-left: 8px;
}

.autocomplete {
  position: relative;
  width: 100%;
  max-width: 300px;
}

input.autocomplete-text {
  color: #ddd;
}
.on input.autocomplete-text {
  background-color: #006c95;
  color: #fff;
}
input.autocomplete-text:disabled {
  background-color: #316478;
  border-color: #316478;
  color: #cbe6ef;
  -webkit-text-fill-color: #cbe6ef;
  opacity: 1;
}

.autocomplete-edit {
  position: absolute;
  display: none;
  font-size: 17px;
  right: 6.5px;
  top: 3px;
  padding: 0 7px;
  padding-top: 3px;
  border-radius: 3px;
  background: #007a5e;
  cursor: pointer;
  color: #9fdfd0;
}
.autocomplete-edit:hover {
  color: #fff;
}
.on .autocomplete-edit {
  display: block;
}

.autocomplete-items {
  position: absolute;
  border: none;
  z-index: 99;
  top: 100%;
  left: 0;
  right: 0;
}
.autocomplete-items div {
  background-color: #222;
  border: none;
  border-top: 1px solid #404040;
  color: #d0d0d0;
  padding: 10px;
  width: calc(100% - 4px);
  cursor: pointer;
}
.autocomplete-items div:hover {
  background-color: #2f2f2f;
  color: #eee;
}
.autocomplete-items div.autocomplete-active {
  background-color: #006c95 !important;
  color: #fff;
}

.autocomplete .timeblock-editor {
  display: none;
}
.autocomplete.on .timeblock-editor {
  display: block;
  padding: 7px;
  padding-top: 4px;
  margin-top: -1px;
  border-radius: 0;
  background-color: #007a5e;
  width: calc(100% - 14px);
}
@media (min-width: 500px) {
  .autocomplete.on .timeblock-editor {
    width: calc(100% - 17px);
  }
}
.autocomplete.on .timeblock-editor .timeblock-edit-start-time, .autocomplete.on .timeblock-editor .timeblock-edit-end-time {
  width: 60px;
}

.autocomplete-timeblock-warning {
  display: none;
}
.autocomplete.on .autocomplete-timeblock-warning.on {
  display: block;
  background: #005b47;
  color: #ddd;
  margin-top: 6px;
  padding: 3px 5px;
  border-radius: 3px;
  font-size: 13px;
}
.autocomplete.on .autocomplete-timeblock-warning.on img {
  width: 16px;
  margin-right: 6px;
  vertical-align: bottom;
}

.timeblock-editor {
  max-width: 500px;
  padding: 5px;
  border-radius: 3px;
  background: #555;
  color: #ccc;
}
.timeblock-editor input, .timeblock-editor select {
  background: #222;
}
.timeblock-editor .timeblock-edit-day {
  padding: 6px 3px;
  margin-right: 6px;
}
.timeblock-editor .timeblock-edit-start-time, .timeblock-editor .timeblock-edit-end-time {
  width: 67px;
}
.timeblock-editor .timeblock-edit-person {
  display: inline-block;
  width: 164px;
  margin-right: 21px;
}
.timeblock-editor .timeblock-edit-person input[type=text].on {
  border-color: #003c53;
}

@font-face {
  font-family: "icomoon";
  src: url("/assets/icomoon/icomoon.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
[class^=icon-], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-paper-plane:before {
  content: "";
}

.icon-game-controller:before {
  content: "";
}

.icon-home:before {
  content: "";
}

.icon-quill:before {
  content: "";
}

.icon-alarm:before {
  content: "";
}

.icon-calendar:before {
  content: "";
}

.icon-user:before {
  content: "";
}

.icon-users:before {
  content: "";
}

.icon-cog:before {
  content: "";
}

.icon-warning:before {
  content: "";
}

.icon-cross:before {
  content: "";
}

.icon-checkmark:before {
  content: "";
}

.icon-checkbox-checked:before {
  content: "";
}

.icon-share2:before {
  content: "";
}

.icon-hour-glass:before {
  content: "";
}

.icon-spinner4:before {
  content: "";
}

.icon-plus:before {
  content: "";
}

.icon-exit:before {
  content: "";
}

.icon-loop2:before {
  content: "";
}

.icon-circle-down:before {
  content: "";
}

.icon-soccer-ball:before {
  content: "";
}

.icon-download:before {
  content: "";
}

.icon-flag:before {
  content: "";
}

.icon-lightbulb-o:before {
  content: "";
}

.icon-pencil:before {
  content: "";
}

.icon-bin:before {
  content: "";
}

.icon-vote:before {
  content: "";
}

.icon-book:before {
  content: "";
}

.icon-stats-bars:before {
  content: "";
}

.icon-stats-bars2:before {
  content: "";
}

.icon-stats-dots:before {
  content: "";
}

.icon-pie-chart:before {
  content: "";
}

.icon-ticket:before {
  content: "";
}

.icon-help-with-circle:before {
  content: "";
}

.icon-menu:before {
  content: "";
}

.icon-recycle:before {
  content: "";
}

.icon-arrow-bold-down:before {
  content: "";
}

.icon-bug:before {
  content: "";
}

.icon-plus:before {
  content: "";
}

.icon-clipboard:before {
  content: "";
}

.icon-magnifying-glass:before {
  content: "";
}

.icon-double-arrow:before {
  content: "";
}

.icon-info:before {
  content: "";
}

.icon-chat:before {
  content: "";
}

.icon-star-empty:before {
  content: "";
}

.icon-star-full:before {
  content: "";
}

.icon-chart-pie:before {
  content: "";
}

.home-page {
  max-width: 600px;
  padding: 5px;
}
.home-page button {
  cursor: pointer;
  display: inline-block;
  position: relative;
  font-size: 14px;
  font-family: "Dosis", sans-serif;
  width: 130px;
  margin-right: 7px;
  margin-bottom: 12px;
  padding-top: 20px;
  padding-bottom: 14px;
  background: #02728e;
  color: #eee;
  border: none;
  outline: none;
}
.home-page button i {
  font-size: 30px;
  display: block;
  margin-bottom: -4px;
}
.home-page button:hover {
  background: #0084a5;
}
.home-page button:disabled {
  cursor: default;
  color: #777;
}

@media (max-width: 425px) {
  .home-page button {
    width: calc(50% - 10px);
  }
}
.entry-page {
  text-align: center;
}

.entry-message {
  margin: 20px auto;
  max-width: 380px;
}

#home-event-workshop {
  background: #007a4c;
}
#home-event-workshop:hover {
  background: #008a55;
}
#home-event-workshop:disabled {
  background: #243f36;
}

#home-voting-booth {
  background: #b86703;
}
#home-voting-booth:hover {
  background: #cf7404;
}
#home-voting-booth:disabled {
  background: #4f3c24;
}

#home-signup {
  background: #aa485f;
}
#home-signup:hover {
  background: #c0546d;
}
#home-signup:disabled {
  background: #58313a;
}

#home-schedule {
  background: #78478b;
}
#home-schedule:hover {
  background: #89509f;
}
#home-schedule:disabled {
  background: #47354e;
}

#home-my-restrictions {
  background: #5354a5;
}
#home-my-restrictions:hover {
  background: #5d5fc0;
}

#home-attendance:disabled {
  background: #2c474e;
}
#home-attendance:disabled:hover {
  background: #2c474e;
}

#home-info {
  background: #555;
  color: #ccc;
}
#home-info:hover {
  background: #666;
  color: #fff;
}

.week-tool {
  margin-bottom: 25px;
  margin-right: 20px;
}

.week-tool hr {
  border-color: #666;
  margin-top: 15px;
}

.week-date {
  color-scheme: dark;
}

.week-tool-button {
  display: block;
  position: relative;
  z-index: 1;
  float: right;
  color: white;
  border: none;
  outline: none;
  border-radius: 4px;
  padding: 6px 11px;
  padding-top: 9px;
  margin-top: 1px;
  margin-left: 8px;
  font-size: 18px;
  cursor: pointer;
}

.week-tool-button.auto-scheduler-button {
  padding: 1px 6.5px;
  padding-top: 7px;
  background: #c67700;
}
.week-tool-button.auto-scheduler-button:hover {
  background: #dd8500;
}
.week-tool-button.auto-scheduler-button img {
  width: 24px;
}

.delete-week-button {
  background: #ac3434;
}
.delete-week-button:hover {
  background: #c73c3c;
}

.week-settings-button {
  background: #007a80;
}
.week-settings-button:hover {
  background: #02858c;
}

.calendar-export-button {
  background: #fff;
  padding: 6.8px;
  padding-bottom: 0;
  z-index: 10;
}
.calendar-export-button:hover {
  background: #eee;
}
.calendar-export-button img {
  width: 25px;
}

.calendar-export-icon {
  width: 25px;
  margin-bottom: -5px;
  margin-right: 9px;
}

.calendar-export-begin-button {
  width: 160px;
  padding: 13px;
  font-size: 1.1em;
  display: block;
  margin-bottom: 10px;
}
.calendar-export-begin-button:disabled {
  background: #444;
  color: #aaa;
}

.calendar-export-completed {
  margin-top: 12px;
  margin-bottom: 6px;
  color: #fff;
}
.calendar-export-completed i {
  color: #009270;
  background: #fff;
  border-radius: 3px;
  margin-right: 2px;
}

.calendar-export-instructions {
  padding-left: 20px;
  padding-bottom: 5px;
  margin-bottom: 17px;
  border-bottom: 1px solid #777;
}
.calendar-export-instructions li {
  margin-bottom: 4px;
}
.calendar-export-instructions p {
  margin-left: -14px;
}

.calendar-export-progress img {
  width: 40px;
  margin-right: 2px;
}
.calendar-export-progress span {
  font-size: 1.1em;
  line-height: 40px;
  vertical-align: top;
}
.calendar-export-progress strong {
  color: #fff;
}

.calendar-export-review h3 {
  border-top: 1px solid #777;
  padding-top: 15px;
  margin-bottom: 0;
}
.calendar-export-review p {
  margin-top: 8px;
}

.calendar-export-review-results {
  margin-top: 12px;
}
.calendar-export-review-results ul {
  padding-left: 20px;
}
.calendar-export-review-results li {
  margin-bottom: 2px;
}

.week-tool h2 i {
  font-size: 18px;
}

.week-tool h2 img {
  width: 24px;
  vertical-align: bottom;
}

.auto-scheduler-download-log {
  display: block;
  margin-top: 16px;
  width: 130px;
}

.alerts {
  border-collapse: collapse;
}
.alerts tr {
  border-bottom: 1px solid #444;
}

.alert {
  display: block;
  background: none;
  border: none;
  outline: none;
  padding: 10px 0;
  text-align: left;
  color: #bbb;
}
.alert.verbose {
  color: #888;
}
.alert img {
  width: 20px;
  height: 20px;
  vertical-align: middle;
}

.alert-message {
  display: inline-block;
  padding-left: 10px;
  width: calc(100% - 40px);
  vertical-align: middle;
}

.auto-scheduler-report {
  color: #fff;
  font-size: 14px;
  padding: 7px 4px;
  padding-right: 16px;
  margin-top: 15px;
  border-radius: 4px;
  max-width: 168.5px;
  text-align: center;
}

.week-delete {
  width: 110px;
}

.event-time-recommendations {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 45px);
  margin-bottom: 0 !important;
}
.event-time-recommendations h2 {
  flex: 0 0 auto;
}

.event-time-recommendations-info {
  flex: 0 0 auto;
  background: #1a1a1a;
  padding: 10px;
  margin-top: -5px;
}
.event-time-recommendations-info .event-time-recommendations-activity-name {
  font-weight: bold;
  color: #ddd;
}
.event-time-recommendations-info .ar-event-people-group {
  color: #bbb;
}

.event-time-recommendations-body {
  flex: 1 1 auto;
  margin-top: 5px;
  overflow-y: hidden;
}

.event-time-recommendations-times, .event-time-recommendations-penalties {
  height: 100%;
}

.event-time-recommendations-times {
  width: 46%;
  max-width: 260px;
  float: left;
}

.event-time-recommendations-penalties {
  overflow-x: hidden;
  background: #282828;
}
.event-time-recommendations-penalties p {
  padding: 0 15px;
  color: #999;
}

#ew-people-pane, #schedule-weeks-pane, #mr-people-pane {
  background: #2f2f2f;
  padding: 10px;
  font-size: 13.5px;
}
.edit-mode #ew-people-pane, .edit-mode #schedule-weeks-pane, .edit-mode #mr-people-pane {
  display: none !important;
}

#ew-events-pane, #schedule-events-pane, #mr-restrictions-pane {
  background: #252525;
  padding-left: 15px;
}
.edit-mode #ew-events-pane, .edit-mode #schedule-events-pane, .edit-mode #mr-restrictions-pane {
  display: none !important;
}

#ew-editor-pane, #schedule-event-pane, #mr-editor-pane {
  position: relative;
  padding-left: 10px;
  display: none;
}
.edit-mode #ew-editor-pane, .edit-mode #schedule-event-pane, .edit-mode #mr-editor-pane {
  display: block;
}

#ew-editor-pane, #schedule-event-pane {
  width: 100%;
}

#mr-editor-pane {
  width: calc(100% - 30px);
}

@media (max-width: 499px) {
  #ew-editor-pane, #schedule-event-pane .manager-editor, #mr-editor-pane {
    font-size: 13px;
  }
  #ew-editor-pane textarea, #schedule-event-pane .manager-editor textarea, #mr-editor-pane textarea {
    font-size: 13px;
  }
  #ew-editor-pane .form th, #schedule-event-pane .manager-editor .form th, #mr-editor-pane .form th {
    width: 1px;
    padding: 4px 6px;
  }
  #ew-editor-pane .form td, #schedule-event-pane .manager-editor .form td, #mr-editor-pane .form td {
    min-width: 0;
    width: calc(100vw - 36px);
  }
  #ew-editor-pane .ew-input, #ew-editor-pane .schedule-input, #ew-editor-pane .autocomplete input[type=text], #schedule-event-pane .manager-editor .ew-input, #schedule-event-pane .manager-editor .schedule-input, #schedule-event-pane .manager-editor .autocomplete input[type=text], #mr-editor-pane .ew-input, #mr-editor-pane .schedule-input, #mr-editor-pane .autocomplete input[type=text] {
    width: calc(100% - 30px);
  }
  #ew-editor-pane .timeblock-editor, #schedule-event-pane .manager-editor .timeblock-editor, #mr-editor-pane .timeblock-editor {
    width: calc(100% - 23px);
  }
  #ew-editor-pane .timeblock-editor .timeblock-edit-day, #schedule-event-pane .manager-editor .timeblock-editor .timeblock-edit-day, #mr-editor-pane .timeblock-editor .timeblock-edit-day {
    display: block;
    width: 198.5px;
    margin-right: 0;
    margin-bottom: 6px;
  }
}
@media (min-width: 500px) {
  #ew-people-pane, #schedule-weeks-pane, #mr-people-pane {
    max-width: 330px;
  }

  #ew-events-pane, #schedule-events-pane {
    max-width: 330px;
  }

  #ew-editor-pane, #schedule-event-pane, #mr-editor-pane {
    padding-left: 20px;
  }
}
@media (min-width: 720px) {
  #ew-people-pane, #schedule-weeks-pane, #mr-people-pane {
    float: left;
    overflow-x: hidden;
    height: calc(100vh - 58px);
    width: 100%;
  }

  #ew-events-pane, #schedule-events-pane, #mr-restrictions-pane {
    float: left;
    max-width: 340px;
    height: calc(100vh - 38px);
    width: 100%;
    padding-left: 20px;
  }
}
@media (min-width: 1200px) {
  .edit-mode #ew-people-pane, .edit-mode #schedule-weeks-pane, .edit-mode #mr-people-pane, .edit-mode #ew-events-pane, .edit-mode #schedule-events-pane, .edit-mode #mr-restrictions-pane {
    display: block !important;
  }

  #ew-editor-pane, #schedule-event-pane, #mr-editor-pane {
    display: block;
    height: 100vh;
    width: auto;
  }
}
.ew-closed {
  margin-top: calc(40vh - 40px);
  text-align: center;
}

.ew-events-header, .ew-person-single-header {
  background: #006c95;
  font-family: "Dosis", sans-serif;
  font-size: 20px;
  text-transform: uppercase;
  text-align: center;
  padding: 15px 20px;
}

.ew-person-single-header {
  margin-left: -10px;
  width: calc(100% - 20px);
}

.ew-events-header {
  margin-left: -15px;
}

@media (min-width: 720px) {
  .ew-events-header {
    display: none;
  }
}
.ew-event-list {
  width: 100%;
  margin: 20px 0;
  border-collapse: collapse;
}

.ew-event {
  display: block;
  position: relative;
  background: #3b3b3b;
  color: #d7d7d7;
  border-radius: 3px;
  padding: 9px 10px;
  width: calc(100% - 36px);
  text-align: left;
}
.ew-event.can-edit {
  padding-right: 40px;
  width: calc(100% - 66px);
}
.ew-event.has-warning {
  padding-right: 60px;
  width: calc(100% - 86px);
}

.ew-event-edit {
  display: none;
  position: absolute;
  font-size: 17px;
  right: 2px;
  top: 2px;
  padding: 4px 10px;
  padding-top: 6px;
  border-radius: 4px;
  color: #aaa;
  cursor: pointer;
}
.ew-event-edit:hover {
  color: #fff;
}
.can-edit .ew-event-edit {
  display: block;
}

.ew-event-info {
  color: #10c097;
  margin-top: 5px;
  margin-bottom: -2px;
}

.ew-event-description {
  color: #909090;
  margin-top: 3px;
}

.ew-event-warning {
  position: absolute;
  right: 36px;
  top: 8px;
}
.ew-event-warning img {
  width: 18px;
}

.ew-sponsors {
  margin: 3px 0;
  width: calc(100% - 20px);
}

.ew-sponsor {
  display: inline-block;
  background: #006c95;
  color: #fff;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 2px 0;
  font-size: 13px;
}

.ew-people, .schedule-weeks, .mr-people {
  margin: 4px 0;
}

.ew-people-person, .schedule-week, .mr-people-person {
  border-bottom: 1px solid #444;
  cursor: pointer;
  width: calc(100% - 25px);
  text-align: left;
  padding: 12px;
  color: #ccc;
}
.ew-people-person:hover, .schedule-week:hover, .mr-people-person:hover {
  background: #3a3a3a;
  color: #fff;
}
.ew-people-person.on, .schedule-week.on, .mr-people-person.on {
  background: #006c95;
  color: #fff;
}

.ew-person-header {
  position: relative;
  background: #555;
  color: #fff;
  padding: 12px 14px;
  margin-top: 5px;
  border-radius: 5px;
}

.ew-person-close, .mr-person-close {
  position: absolute;
  right: 2px;
  top: 2px;
  padding: 9px 14px;
  padding-top: 12px;
  border-radius: 4px;
  color: #ccc;
  cursor: pointer;
}
.ew-person-close:hover, .mr-person-close:hover {
  color: #fff;
}

.ew-person-events {
  margin-top: 15px;
  margin-bottom: 20px;
}
.ew-person-events .autocomplete {
  max-width: none;
}
.ew-person-events input.autocomplete-text {
  background-color: #1e1e1e;
  border: none;
  outline: none;
  width: calc(100% - 14px);
}
.ew-person-events input.autocomplete-text:disabled {
  background-color: #456e64;
}
.ew-person-events .autocomplete-items div {
  width: calc(100% - 24px);
}
.ew-person-events .autocomplete-items div.autocomplete-active {
  background-color: #007a5e !important;
}
.ew-person-events .autocomplete.on input.autocomplete-text {
  background-color: #007a5e;
}

@media (min-width: 500px) {
  .ew-person-events .autocomplete-edit {
    right: 18px;
  }
}
@media (min-width: 720px) {
  .ew-person-events .autocomplete-edit {
    right: 6.5px;
  }
}

.ew-suggestions {
  margin-bottom: 20px;
}

.ew-suggestions-header {
  margin-top: 5px;
  margin-bottom: 8px;
  margin-left: 4px;
  color: #aaa;
}

.ew-suggestion {
  padding: 8px 10px;
  margin-top: 8px;
  border-radius: 2px;
}
.ew-suggestion.strong {
  background: #3f3f3f;
  color: #eee;
}
.ew-suggestion.weak {
  background: #393939;
  color: #d8d8d8;
}

.ew-instructions {
  color: #777;
  width: calc(100% - 15px);
  margin-top: 3px;
  margin-bottom: 5px;
}

@media (min-width: 500px) {
  .ew-instructions {
    width: 400px;
  }
}
.ew-editor-close, .schedule-event-close {
  position: absolute;
  top: -5px;
  right: 20px;
  font-size: 18px;
  color: #aaa;
  padding: 7px 11px;
  padding-top: 10px;
}
.ew-editor-close:hover, .schedule-event-close:hover {
  color: #fff;
}
@media (min-width: 500px) {
  .ew-editor-close, .schedule-event-close {
    right: 45px;
  }
}
@media (min-width: 720px) {
  .ew-editor-close, .schedule-event-close {
    top: 12px;
  }
}
@media (min-width: 1200px) {
  .ew-editor-close, .schedule-event-close {
    display: none;
  }
}

.ew-character-limit {
  text-align: right;
  padding-right: 20px;
}
.ew-character-limit.over {
  color: #ff7070;
}
@media (min-width: 500px) {
  .ew-character-limit {
    padding-right: 5px;
  }
}

.ew-warning {
  background: #e6d932;
  color: #000;
  vertical-align: middle;
  padding: 10px 15px;
  width: calc(100% - 30px);
  margin-top: 8px;
}

.event-selector {
  overflow-x: hidden;
  background: #272727;
  height: calc(100vh - 60px);
  padding: 10px;
  max-width: calc(100% - 20px);
  width: 360px;
}

@media (max-width: 500px) {
  .voting-booth {
    width: auto;
  }
}
.es-clock-full {
  margin-top: calc(40vh - 40px);
  text-align: center;
}
.es-clock-full .es-clock-time-dynamic, .es-clock-full .es-clock-time-static {
  margin-top: 8px;
  font-weight: bold;
}
.es-clock-full .es-clock-time-dynamic {
  font-size: 17px;
  color: #69b4ff;
}
.es-clock-full .es-clock-time-static {
  font-size: 15px;
}

.es-clock-small, .es-category {
  padding: 10px 14px;
  margin-bottom: 8px;
  margin-left: -10px;
  width: 100%;
  color: #eee;
}

.es-clock-small {
  margin-top: -10px;
}

.es-category {
  font-family: "Dosis", sans-serif;
  font-size: 17px;
  text-transform: uppercase;
}

.voting-booth .es-clock-small, .es-category {
  background: #006c95;
}

.signup .es-clock-small {
  margin-bottom: 0;
}

.es-clock-small .es-clock-time-dynamic {
  display: inline;
  font-weight: bold;
}

.es-event {
  margin-bottom: 8px;
  background: #3f3f3f;
  border-radius: 4px;
  overflow: hidden;
  position: relative;
  min-height: 100px;
}
.es-event.shaded {
  background: #505050;
}
.es-event.on {
  background: #007a5e;
}
.es-event.on.warning {
  background: #9b9739;
}

.es-event-image {
  display: none;
  background: #353535;
  width: 100px;
  height: 100%;
  position: absolute;
}
.es-event-image img {
  width: 100%;
}
.show-images .es-event-image {
  display: block;
}

.es-event-body {
  padding: 5px 8px;
  padding-top: 2px;
}
.show-images .es-event-body {
  padding-left: 110px;
}

.es-event-header {
  font-family: "Dosis", sans-serif;
  font-size: 16px;
}
.on .es-event-header {
  color: #fff;
}

.es-event-time, .es-event-max-participants {
  margin: 2px 4px;
  margin-bottom: 5px;
  font-weight: bold;
  font-size: 14px;
}

.es-event-time {
  color: #60d3b9;
}
.on .es-event-time {
  color: #8af4dc;
}
.on.warning .es-event-time {
  color: #fffba0;
}

.es-event-time-warning {
  width: 16px;
}

.es-event-max-participants {
  color: #d0bd33;
}
.on .es-event-max-participants {
  color: #eee;
}

.es-event-time-day, .es-event-duration {
  font-weight: normal;
  color: #48a892;
}
.on .es-event-time-day, .on .es-event-duration {
  color: #52c9ae;
}
.es-event-time-day i, .es-event-duration i {
  font-size: 0.9em;
  margin-left: 4px;
  margin-right: 2px;
}

.es-event-time-day.small, .es-event-duration {
  font-size: 0.9em;
}

.es-event-location, .es-event-link, .es-event-broken-link {
  margin: 3px 4px;
  margin-top: -3px;
  color: #ccc;
}
.on .es-event-location, .on .es-event-link, .on .es-event-broken-link {
  color: #eee;
}
.es-event-location a, .es-event-link a, .es-event-broken-link a {
  color: #5ccaff;
  font-weight: bold;
}

.es-event-broken-link {
  color: #ff4d4d;
}
.on .es-event-broken-link {
  color: #ff6d6d;
}
.es-event-broken-link img {
  width: 14px;
  vertical-align: middle;
}

.es-vote {
  vertical-align: middle;
}

.es-event-title {
  display: inline-block;
  vertical-align: middle;
  margin-left: 4px;
  max-width: calc(100% - 30px);
  line-height: 1;
  padding: 3px 0;
}
.disabled .es-event-title {
  color: #999;
}
.on .es-event-title {
  color: #fff;
}
.es-event-title.has-checkbox {
  max-width: calc(100% - 50px);
}

.es-sponsors {
  width: calc(100% - 20px);
}

.es-sponsor {
  display: inline-block;
  background: #333;
  color: #bbb;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 2px 0;
  font-size: 13px;
}
.on .es-sponsor {
  background: #005b47;
  color: #ccc;
}
.on.warning .es-sponsor {
  background: #76722d;
  color: #e0e0e0;
}

.es-event-description {
  color: #aaa;
  margin: 1px 3px;
  margin-bottom: 4px;
  font-size: 13px;
}
.on .es-event-description {
  color: #d9d9d9;
}
.on.warning .es-event-description {
  color: #eee;
}

#schedule-events-pane {
  padding-left: 10px !important;
}
#schedule-events-pane .es-category {
  width: auto;
}
#schedule-events-pane .es-event {
  width: calc(100% - 10px);
}
@media (min-width: 720px) {
  #schedule-events-pane {
    padding-left: 5px !important;
  }
  #schedule-events-pane .es-category {
    padding-left: 18px;
  }
  #schedule-events-pane .es-event {
    width: calc(100% - 5px);
  }
}

.schedule-events {
  padding-top: 12px;
}

.schedule-events-event {
  border-bottom: 1px solid #383838;
  cursor: pointer;
  width: calc(100% - 45px);
  text-align: left;
  padding: 12px;
  color: #c5c5c5;
}
.schedule-events-event:hover {
  background: #333;
  color: #fff;
}
.schedule-events-event.on {
  background: #006c95;
  color: #fff;
}

.schedule-event-details {
  position: absolute;
  right: 7px;
  top: 3px;
  font-size: 20px;
  cursor: pointer;
  color: #ccc;
  z-index: 2;
}
.schedule-event-details:hover {
  color: #eee;
}

.schedule-events-event-time {
  color: #777;
}
.on .schedule-events-event-time {
  color: #8db8c8;
}

.schedule-input {
  color: #bbb !important;
  -webkit-text-fill-color: #bbb;
  opacity: 1;
  border: none;
}

.schedule-sponsors-autocomplete-container .form-field-no-edit,
.schedule-voters-autocomplete-container .form-field-no-edit,
.schedule-participants-autocomplete-container .form-field-no-edit,
.schedule-delegation-autocomplete-container .form-field-no-edit {
  background: #222;
  color: #222;
  width: 100%;
  padding: 7px;
}

.schedule-event-shade {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.44;
  z-index: 1;
}

.es-category.schedule-day-shade {
  background: #144c62;
  color: #91acb6;
}

.es-category#schedule-unscheduled-events-header {
  text-transform: lowercase;
  cursor: pointer;
}
.es-category#schedule-unscheduled-events-header:hover {
  background: #007aaa;
}
.es-category#schedule-unscheduled-events-header.on {
  text-transform: uppercase;
  cursor: default;
}
.es-category#schedule-unscheduled-events-header.on:hover {
  background: #006c95;
}
.es-category#schedule-unscheduled-events-header i {
  margin-left: 5px;
}

.es-category#schedule-add-event {
  cursor: pointer;
  text-transform: none;
  background: #aa485f;
}
.es-category#schedule-add-event:hover {
  background: #c0546d;
}

.schedule-add-event-activity-autocomplete-container {
  margin: 15px 0;
  width: 317px;
}
.schedule-add-event-activity-autocomplete-container .autocomplete {
  max-width: none;
}
.schedule-add-event-activity-autocomplete-container .timeblock-editor {
  margin-top: 10px !important;
  background: #555 !important;
}

.schedule-add-event-save:disabled {
  color: #777;
  background: #444;
}

.schedule-add-event-warning {
  margin-bottom: 15px;
  display: none;
}
.schedule-add-event-warning.on {
  display: block;
}
.schedule-add-event-warning img {
  width: 16px;
  margin-right: 6px;
  vertical-align: bottom;
}

.es-category#schedule-report, .auto-scheduler-report {
  cursor: pointer;
  text-transform: none;
  background: #906d3c;
}
.es-category#schedule-report:hover, .auto-scheduler-report:hover {
  background: #a27a41;
}
.es-category#schedule-report img, .auto-scheduler-report img {
  width: 20px;
  vertical-align: middle;
  margin-right: 4px;
}

#schedule-unscheduled-events {
  display: none;
}

.schedule-event-next {
  border-top: 2px solid #f00;
  padding-top: 4px;
}

.schedule-scroll-button {
  display: none;
  background: #774695;
  margin-left: -10px;
  padding: 13px 0;
  text-align: center;
  position: fixed;
  max-width: inherit;
  width: 100%;
  bottom: 0;
  z-index: 3;
  color: #eee;
  font-family: "Dosis", sans-serif;
  font-size: 16px;
  cursor: pointer;
}

.schedule-scroll-arrow-container {
  display: inline-block;
  position: relative;
  width: 18px;
  height: 16px;
}

.schedule-scroll-arrow {
  display: inline-block;
  position: absolute;
  left: 0;
  top: 1px;
  animation-name: scroll-arrow;
  animation-duration: 0.8s;
  animation-delay: 0s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

@keyframes scroll-arrow {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(0, 4px);
  }
}
.reports {
  overflow-x: hidden;
  background: #272727;
  height: calc(100vh - 60px);
  padding: 10px;
  max-width: calc(100% - 20px);
  width: 360px;
}

.report-button {
  cursor: pointer;
  display: inline-block;
  font-size: 14px;
  font-family: "Dosis", sans-serif;
  width: 80px;
  margin-right: 5px;
  margin-bottom: 8px;
  padding-top: 13px;
  padding-bottom: 9px;
  border-radius: 4px;
  background: #505050;
  color: #eee;
  border: none;
  outline: none;
}
.report-button i {
  font-size: 26px;
  display: block;
  margin-bottom: -8px;
}
.report-button:hover {
  background: #585858;
}
.report-button.on {
  background: #007a5e;
}

.reports-help-text {
  color: #aaa;
}

.report-metrics th {
  white-space: nowrap;
}
.report-metrics .form td {
  min-width: auto;
  width: 100%;
}
.report-metrics .form td input {
  color: #ddd;
  width: calc(100% - 20px);
}

.mr-people {
  border-bottom: 10px solid #222;
}

#mr-restrictions-pane {
  padding: 0;
}

@media (min-width: 500px) {
  #mr-restrictions-pane {
    max-width: 360px;
  }
}
#mr-editor-pane h2 {
  font-family: "Dosis", sans-serif;
}
#mr-editor-pane .timeblock-editor {
  max-width: 312px;
}
#mr-editor-pane .form {
  margin-bottom: 0;
}

.mr-warning {
  display: none;
  background: #e6d932;
  padding: 10px 15px;
}
.mr-warning img {
  width: 22px;
  margin-right: 7px;
  vertical-align: middle;
}
.mr-warning .mr-warning-text {
  display: inline-block;
  color: #000;
  width: calc(100% - 40px);
  vertical-align: middle;
}

.mr-ease-of-accommodation {
  display: none;
  background: #333;
  color: #aaa;
  padding: 10px;
}

.mr-restrictions-header {
  background: #000;
  color: #ddd;
  padding: 10px;
  font-family: "Dosis", sans-serif;
  font-size: 17px;
  text-align: center;
}

.mr-preferences {
  margin: 10px;
}
.mr-preferences input {
  width: 70px;
}
.mr-preferences .form td {
  min-width: auto;
}

.mr-one-time-restrictions, .mr-repeating-restrictions {
  padding: 10px;
}

.mr-restriction {
  background: #3a3a3a;
  margin-bottom: 8px;
  padding: 7px 9px;
  padding-right: 45px;
  position: relative;
  border-radius: 3px;
}
.mr-restriction h3 {
  font-family: "Dosis", sans-serif;
  font-weight: normal;
  margin: 0;
  margin-bottom: 5px;
}
.mr-restriction.active {
  background: #006c95;
  color: #fff;
}

.mr-edit-button {
  background: none;
  border: none;
  position: absolute;
  top: 5px;
  right: 5px;
  color: #ddd;
  padding: 5px 6px;
  font-size: 16px;
}
.mr-edit-button:hover {
  color: #fff;
  cursor: pointer;
}
.active .mr-edit-button {
  color: #fff;
}

.mr-add {
  width: 190px;
}
.mr-add i {
  font-size: 11px;
  margin-right: 4px;
}

.mr-editor-timeblock-container {
  margin-bottom: 5px;
}

.mr-disabled, .activity-disabled {
  position: relative;
}

.mr-shade, .activity-shade {
  display: none;
  background: #2f2f2f;
  opacity: 0.9;
  z-index: 10000;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.mr-disabled .mr-shade, .activity-disabled .mr-shade, .mr-disabled .activity-shade, .activity-disabled .activity-shade {
  display: block;
}

.mr-editor-nth-week-container {
  margin-left: 8px;
}

.mr-editor-alternating-week-container {
  margin-top: 4px;
  margin-bottom: 12px;
}

.mr-save:disabled {
  color: #777;
  background: #444;
}

@media (max-width: 719px) {
  .mr-people.muted {
    border-bottom: none;
  }
  .mr-people.muted .mr-people-person {
    display: none;
  }
  .mr-people.muted .mr-people-person.selected {
    display: block;
    position: relative;
    background: #555;
    color: #fff;
    padding: 12px 14px;
    margin-top: 5px;
    border-radius: 5px;
  }

  #mr-restrictions-pane {
    height: 100%;
    overflow-y: scroll;
  }
}
@media (min-width: 720px) {
  .mr-people-person.selected {
    background: #006c95;
    color: #fff;
  }
  .mr-people-person .mr-person-close {
    display: none;
  }
}
#att-menu-pane {
  height: calc(100vh - 42px);
  padding: 10px;
  width: 190px;
  float: left;
  background: #282828;
  border-right: 1px solid #111;
}

#att-main-pane {
  overflow: hidden;
}

.att-menu {
  width: 100%;
}

.manager-item.att-report-button, .manager-item.att-week-button {
  width: 100%;
  color: #bbb;
}

.manager-item.att-report-button {
  background: inherit;
  color: #ddd;
}
.manager-item.att-report-button:hover {
  background: #333;
  color: #fff;
}
.manager-item.att-report-button.active {
  background: #78478b;
  color: #fff;
}

.att-week-button.active {
  background: #006c95;
  color: #fff;
}

.att-editor {
  height: calc(100vh - 42px);
}

.att-editor-table, .att-report-table {
  border-collapse: collapse;
  width: 100%;
}
.att-editor-table tr:nth-child(2n+1), .att-report-table tr:nth-child(2n+1) {
  background: #3d3d3d;
}
.att-editor-table tr:nth-child(2n), .att-report-table tr:nth-child(2n) {
  background: #2f2f2f;
}
.att-editor-table th, .att-report-table th {
  background: #006c95;
  font-weight: normal;
  color: #f2f2f2;
}
.att-editor-table th:first-child, .att-editor-table th:last-child, .att-report-table th:first-child, .att-report-table th:last-child {
  text-align: left;
}
.att-editor-table th, .att-editor-table td, .att-report-table th, .att-report-table td {
  padding: 8px;
  padding-left: 13px;
  padding-right: 13px;
  width: 1px;
  white-space: nowrap;
  vertical-align: middle;
}
.att-editor-table th:first-child, .att-editor-table td:first-child, .att-report-table th:first-child, .att-report-table td:first-child {
  border: none;
}
.att-editor-table th:last-child, .att-editor-table td:last-child, .att-report-table th:last-child, .att-report-table td:last-child {
  width: auto;
}

.att-report-table td:last-child {
  max-width: 0;
}

.att-notes-header {
  text-align: left;
}

.att-adviser {
  color: #777;
}

.att-sign-ups {
  text-align: center;
}

.att-box-container {
  text-align: center;
}

.att-box {
  display: inline-block;
  position: relative;
  width: 20px;
  height: 17px;
  margin: 0 4px;
  padding-top: 3px;
  border-radius: 2px;
  font-size: 0.9em;
  vertical-align: middle;
  user-select: none;
  border: 1px solid transparent;
}
.att-editor .att-box {
  cursor: pointer;
}
.att-editor .att-box:hover {
  border-color: #aaa;
}
.att-box svg {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
}

.att-box-0 {
  background: #1e1e1e;
  color: #1e1e1e;
}

.att-box-1 {
  background: #098e58;
  color: #065a30;
}

.att-box--1 {
  background: #be5555;
  color: #713232;
}
.att-box--1 svg {
  display: block;
}

.att-editor-search-container, .att-editor-help {
  background: #0a0a0a;
}

.att-editor-search-container {
  padding: 8px;
  float: left;
}
.att-editor-search-container i {
  font-size: 20px;
  color: #aaa;
  vertical-align: middle;
  margin-left: 5px;
  margin-right: 7px;
}
.att-editor-search-container input {
  width: 200px;
  border: none;
  padding: 8px 10px;
}

.att-editor-help {
  height: 48px;
  text-align: right;
}
.att-editor-help img {
  width: 90px;
  margin-right: 6px;
  margin-left: 16px;
  margin-top: 10px;
}

.att-notes-cell {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

input[type=text].att-notes {
  padding: 6px 8px;
  width: calc(100% - 10px);
  max-width: none;
  border: none;
  color: #ccc;
}

.att-report-menu {
  background: #333;
  width: 195px;
  float: left;
}
.att-report-menu.hide {
  display: none;
}

.att-report-people {
  height: calc(100vh - 93px);
}

.att-report-people-header {
  padding: 10px;
  padding-right: 0;
  background: #111;
  color: #ddd;
}
.att-report-people-header.hide {
  display: none;
}

.att-report-sort {
  background: #2d2d2d;
  border: none;
}

.att-report-person {
  display: block;
  width: 100%;
  padding: 12px 13px;
  text-align: left;
  background: inherit;
  border: none;
  border-bottom: 1px solid #484848;
  color: #d4d4d4;
  position: relative;
  cursor: pointer;
}
.att-report-person:hover {
  background: #393939;
  color: #fff;
}
.att-report-person.active {
  background: #006c95;
  color: #fff;
}

.att-report-person-score {
  display: inline-block;
  padding: 5px;
  width: 46px;
  border-radius: 2px;
  border: 1px solid #2a2a2a;
  color: #fff;
  text-align: center;
  position: absolute;
  right: 13px;
  top: 6px;
  text-shadow: 0px 1px 2px #333;
}
.att-report-person-score.red {
  background: #b6423f;
}
.att-report-person-score.green {
  background: #11834f;
}
.att-report-person-score.yellow {
  background: #b39800;
}
.att-report-person-score.orange {
  background: #b86d28;
}

.att-report-score {
  color: #bbb;
}

.att-report-data {
  overflow-x: hidden;
  height: calc(100vh - 44px);
  background: #222;
  padding-left: 10px;
  position: relative;
}

.att-report-sign-ups {
  text-align: center;
  color: #ff7070;
}
.att-report-sign-ups.enough {
  color: #00c575;
}

.att-report-table {
  margin-bottom: 25px;
}
.att-report-table .inline-help {
  color: #ccc;
}
.att-report-table .inline-help:hover {
  color: #fff;
}

.att-report-data h2 {
  margin: 12px;
}

.att-report-extra-row {
  background: #111 !important;
}

.att-report-load-more-button, .att-report-current-week-button {
  color: #888;
  background: inherit;
  padding: 3px 0;
  border: none;
  cursor: pointer;
}
.att-report-load-more-button:hover, .att-report-current-week-button:hover {
  color: #bbb;
}
.att-report-load-more-button i, .att-report-current-week-button i {
  margin-left: 6px;
  vertical-align: middle;
}

.att-report-inline-notes {
  color: #bbb;
  overflow: hidden;
  text-overflow: ellipsis;
}
.att-report-inline-notes.overflowed {
  cursor: pointer;
}
.att-report-inline-notes.overflowed:hover {
  color: #eee;
}

.att-report-graph-container {
  height: 300px;
}

.adviser-meetings {
  width: 950px;
  height: calc(100vh - 40px);
  background: #333;
}
.adviser-meetings .timeblock-editor {
  background: none;
}

.adviser-meetings-warning {
  background: #e6d932;
  color: #000;
  vertical-align: middle;
  padding: 10px 15px;
  width: calc(100% - 30px);
  margin-bottom: 5px;
}

.adviser-meetings-table {
  border-collapse: collapse;
  width: 100%;
}
.adviser-meetings-table tr:nth-child(2n) {
  background: #3d3d3d;
}
.adviser-meetings-table td.adviser-meetings-person-name {
  padding: 0 15px;
  max-width: 80px;
  overflow: hidden;
}
.adviser-meetings-table td.adviser-meetings-timeblock-container {
  padding: 4px 0;
  white-space: nowrap;
}

.adviser-meetings-repeat {
  width: 100%;
  padding-left: 15px;
}

.adviser-meetings-hidden {
  display: none;
}

.adviser-meeting-nth-week-container, .adviser-meeting-alternating-week-container {
  margin-left: 10px;
}

.ar-no-log {
  padding: 20px;
}

.ar-instructions {
  padding: 20px;
  color: #999;
}

#ar-events-pane, #ar-passes-pane, #ar-times-pane, #ar-penalties-pane {
  height: calc(100vh - 44px);
  float: left;
  overflow-x: hidden;
  background: #282828;
}

#ar-events-pane {
  width: 230px;
}

#ar-passes-pane {
  width: 255px;
}

#ar-times-pane {
  width: 190px;
}

#ar-penalties-pane {
  width: 255px;
}

.ar-week-header {
  padding: 8px 10px;
  background: #444;
  color: #ddd;
}

.ar-sort-box {
  padding: 7px 10px;
  background: #222;
  color: #bbb;
}
.ar-sort-box select {
  background: #1a1a1a;
  color: #c6c6c6;
}

.ar-event, .ar-pass, .ar-time {
  padding: 10px;
  background: #2e2e2e;
  border-bottom: 1px solid #444;
  cursor: pointer;
}
.ar-event:hover, .ar-pass:hover, .ar-time:hover {
  background: #353535;
  color: #eee;
}
.ar-event.on, .ar-pass.on, .ar-time.on {
  background: #006c95;
  color: #fff;
}

.ar-event-invalidity-description {
  padding: 10px;
  background: #2e2e2e;
  border-bottom: 1px solid #444;
}

.ar-event-time, .ar-pass-verbose {
  margin-top: 2px;
  color: #888;
}
.on .ar-event-time, .on .ar-pass-verbose {
  color: #bdd3dc;
}

.ar-pass-name {
  font-weight: bold;
  margin-bottom: 2px;
}

.ar-pass p {
  margin: 0;
  margin-bottom: 2px;
}

.ar-event-people {
  padding: 10px 10px;
  padding-top: 6px;
  border-bottom: 1px solid #444;
  background: #3e3e3e;
}

.ar-event-people-group {
  margin-top: 4px;
}

.ar-time-time {
  margin-bottom: 4px;
}
.winner .ar-time-time {
  color: #30e88d;
}
.on .ar-time-time {
  color: #fff;
}

.ar-time.disqualified {
  color: #888;
}
.ar-time.on {
  color: #fff;
}
.ar-time.winner .ar-time-time, .ar-time.winner .ar-time-score {
  color: #30e88d;
}
.on .ar-time.winner .ar-time-time, .on .ar-time.winner .ar-time-score {
  color: #fff;
}

.ar-time-replacement {
  color: #aaa;
}
.on .ar-time-replacement {
  color: #bdd3dc;
}

.ar-time-pt-description {
  margin-top: 4px;
  color: #888;
}
.on .ar-time-pt-description {
  color: #bdd3dc;
}
.ar-time-pt-description:hover {
  color: #999;
}
.on .ar-time-pt-description:hover {
  color: #bdd3dc;
}

.ar-time-content {
  overflow: hidden;
}

.ar-time-star {
  float: left;
  margin-top: 7px;
  margin-right: 16px;
  font-size: 20px;
}
.ar-time-star .icon-star-empty {
  display: block;
  color: #fff;
  opacity: 55%;
}
.ar-time-star .icon-star-empty:hover {
  opacity: 100%;
}
.ar-time-star .icon-star-full {
  display: none;
}
.ar-time-star.on .icon-star-empty {
  display: none;
}
.ar-time-star.on .icon-star-full {
  display: block;
}

.ar-penalties {
  border-collapse: collapse;
  width: 100%;
}
.ar-penalties tr {
  border-bottom: 1px solid #4a4a4a;
}
.ar-penalties td {
  padding: 8px 10px;
}

.ar-penalty-amount {
  background: #383838;
}

.settings {
  padding: 20px;
  height: calc(100vh - 58px);
  background: #353535;
}

.settings-categories {
  max-width: 190px;
  padding: 10px;
  float: left;
  height: calc(100vh - 58px);
  background: #2c2c2c;
}

.settings-category {
  display: block;
  border: none;
  outline: none;
  text-align: left;
  width: 100%;
  color: inherit;
  background: inherit;
  border-top: 1px solid #444;
  padding: 10px;
  cursor: pointer;
}
.settings-category:hover {
  background: #404040;
  color: #eee;
}
.settings-category.selected {
  background: #006c95;
  color: #fff;
}
.settings-category:disabled {
  color: #666;
  cursor: default;
}
.settings-category:disabled:hover {
  background: inherit;
}

input[type=text].settings-local-day-start, input[type=text].settings-local-day-end {
  width: 67px;
}

.form.settings-sub-form {
  margin-bottom: 0;
}

.settings-locations-form {
  width: 100%;
}
.settings-locations-form th {
  width: 150px;
}

.settings-timeblocks-container {
  max-width: 320px;
  margin-top: 12px;
}

.settings-timeblocks-description {
  max-width: 490px;
}

.settings-namespace-icon-image {
  border-radius: 3px;
  margin-right: 3px;
}

.settings-namespace-icon-button, .settings-adviser-meeting-image-button {
  vertical-align: top;
}

.settings-attendance-form input[type=number] {
  width: 50px;
}
.settings-attendance-form input:disabled {
  background: #2a2a2a;
  color: #444;
}
.settings-attendance-form .list-editor-header input:disabled {
  background: none;
}

.info {
  max-width: 420px;
  margin: auto;
  padding: 20px;
  height: calc(100vh - 78px);
  background: #282828;
}
.info h2 {
  text-align: center;
  border-bottom: 1px solid #666;
  padding-bottom: 15px;
}
.info p {
  font-size: 14px;
  line-height: 1.5;
  margin: 18px 0;
}
.info p strong {
  color: #7be9ff;
}

.cleanup {
  padding: 20px;
  max-width: 340px;
  height: calc(100vh - 78px);
}

.cleanup-button.delete {
  width: 110px;
}

.cleanup-smart-activity-deactivation-button.delete,
.cleanup-custom-housekeeping-button.delete {
  width: 200px;
}

.cleanup-import-button.delete {
  width: 150px;
}

.history {
  padding: 10px;
  height: calc(100vh - 78px);
}

.history-person {
  margin-bottom: 10px;
}

.history-person-report-semester-header {
  background: #222;
  padding: 5px 10px;
  margin: 0;
}

.list-editor-item input.normal, .list-editor-header input.normal {
  width: 260px;
}
.list-editor-item input.short, .list-editor-header input.short {
  width: 160px;
}
.list-editor-item input.xshort, .list-editor-header input.xshort {
  width: 90px;
}
.list-editor-item input.xxshort, .list-editor-header input.xxshort {
  width: 25px;
}

.list-editor-item input {
  margin-right: 5px;
  line-height: 1.25;
}

.list-editor-header input {
  background: none;
  border: 1px solid transparent !important;
  color: #aaa !important;
  padding: 4px;
  margin-right: 11px;
}

.day-checkbox {
  display: inline-block;
  background: #222;
  border: 1px solid #111;
  color: #999;
  padding: 7px;
  margin-right: 4px;
  width: 19px;
  text-align: center;
  cursor: pointer;
}
.day-checkbox:hover {
  color: #ccc;
  background: #282828;
}
.day-checkbox.on {
  background: #007a5e;
  color: #fff;
}
.day-checkbox.on:hover {
  background: #008d6c;
}

#content-container.large-screen-only {
  display: none;
}
@media (min-width: 978px) {
  #content-container.large-screen-only {
    display: block;
  }
}

#small-screen-warning {
  display: none;
}
#small-screen-warning.active {
  display: block;
  text-align: center;
  padding: 35px 0;
}
#small-screen-warning.active img {
  vertical-align: bottom;
  width: 20px;
  margin-right: 5px;
}
@media (min-width: 978px) {
  #small-screen-warning.active {
    display: none;
  }
}

.form-screen-container {
  position: relative;
}

.form-screen {
  display: none;
  position: absolute;
  left: -1px;
  right: 0;
  top: 0;
  bottom: 0;
  background: #353535;
  opacity: 0.7;
}
.manager-editor .form-screen {
  background: #2f2f2f;
}