@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i");
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
body {
  line-height: 1;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-webkit-keyframes grow {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.2);
    transform: scale(0.2);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes grow {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.2);
    transform: scale(0.2);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@-webkit-keyframes message {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes message {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes processing {
  0% {
    left: -100%;
  }
  50% {
    left: 0%;
  }
  100% {
    left: 100%;
  }
}
@keyframes processing {
  0% {
    left: -100%;
  }
  50% {
    left: 0%;
  }
  100% {
    left: 100%;
  }
}
@-webkit-keyframes bounce {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    -webkit-transform: translate3d(0, 50px, 0);
    transform: translate3d(0, 50px, 0);
  }
}
@keyframes bounce {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    -webkit-transform: translate3d(0, 50px, 0);
    transform: translate3d(0, 50px, 0);
  }
}
@-webkit-keyframes loader {
  0% {
    -webkit-transform: rotateZ(0);
    transform: rotateZ(0);
  }
  100% {
    -webkit-transform: rotateZ(360deg);
    transform: rotateZ(360deg);
  }
}
@keyframes loader {
  0% {
    -webkit-transform: rotateZ(0);
    transform: rotateZ(0);
  }
  100% {
    -webkit-transform: rotateZ(360deg);
    transform: rotateZ(360deg);
  }
}
@font-face {
  font-family: "icons";
  src: url("/fonts/icons.eot?k5w82x");
  src: url("/fonts/icons.eot?k5w82x#iefix") format("embedded-opentype"),
    url("/fonts/icons.ttf?k5w82x") format("truetype"),
    url("/fonts/icons.woff?k5w82x") format("woff"),
    url("/fonts/icons.svg?k5w82x#icons") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"],
[class*=" icon-"] {
  font-family: "icons" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-coupon:before {
  content: "\e915";
}
.icon-stack:before {
  content: "\e911";
}
.icon-accept:before {
  content: "\e90b";
}
.icon-down-arrow:before {
  content: "\e90a";
}
.icon-year:before {
  content: "\e907";
}
.icon-owner:before {
  content: "\e908";
}
.icon-chair:before {
  content: "\e909";
}
.icon-dispute:before {
  content: "\e902";
}
.icon-parking-lot:before {
  content: "\e900";
}
.icon-bill:before {
  content: "\e901";
}
.icon-payment:before {
  content: "\e903";
}
.icon-cancel:before {
  content: "\e905";
}
.icon-parking-location:before {
  content: "\e906";
}
.icon-send:before {
  content: "\e91b";
}
.icon-mail:before {
  content: "\e912";
}
.icon-link:before {
  content: "\e919";
}
.icon-trash:before {
  content: "\73";
}
.icon-close:before {
  content: "\e904";
}
.icon-add-image:before {
  content: "\e90c";
}
.icon-close-light:before {
  content: "\e90d";
}
.icon-copy:before {
  content: "\e90e";
}
.icon-eye:before {
  content: "\e90f";
}
.icon-mailbox:before {
  content: "\e910";
}
.icon-zip:before {
  content: "\e913";
}
.icon-download:before {
  content: "\e914";
}
.icon-add:before {
  content: "\e916";
}
.icon-star:before {
  content: "\e917";
}
.icon-envelope:before {
  content: "\e929";
}
.icon-logout:before {
  content: "\e92b";
}
.icon-settings:before {
  content: "\e92c";
}
.icon-home:before {
  content: "\e92d";
}
.icon-admin:before {
  content: "\e92e";
}
.icon-close-menu:before {
  content: "\e936";
}
.icon-open-menu:before {
  content: "\e937";
}
.icon-refresh:before {
  content: "\e938";
}
.icon-select:before {
  content: "\e93b";
}
.icon-more:before {
  content: "\e93d";
}
.icon-site-text:before {
  content: "\e942";
}
.icon-site-settings:before {
  content: "\e944";
}
.icon-edit:before {
  content: "\e947";
}
.icon-clipboard:before {
  content: "\e94c";
}
.icon-upload:before {
  content: "\e953";
}
.icon-icon_check:before {
  content: "\57";
}
.icon-settings1:before {
  content: "\e92f";
}
.icon-cart:before {
  content: "\e91a";
}
.icon-eye:before {
  content: "\1F441";
}
* {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
}
html,
body {
  height: 100%;
}
.clearfix,
.modal form,
.fields {
  zoom: 1;
}
.clearfix:before,
.modal form:before,
.fields:before {
  content: "";
  display: block;
}
.clearfix:after,
.modal form:after,
.fields:after {
  content: "";
  display: table;
  clear: both;
}
body {
  color: #2f323a;
  font-family: "Open Sans", sans-serif;
  background: #edeff5;
}
body.sidebar-open {
  overflow: hidden;
}
.loading-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  z-index: 5000;
  display: none;
}
.loading-overlay.visible {
  display: block;
}
.loading {
  position: fixed;
  top: 50%;
  left: 50%;
  background: white;
  border-radius: 10px;
  overflow: hidden;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  display: none;
  z-index: 5000;
  box-shadow: 0 0 10px rgba(71, 76, 88, 0.1);
}
.loading.visible {
  display: block;
}
.loading a {
  padding: 20px;
  text-decoration: none;
  display: block;
}
.loading a:hover {
  background: #fbfbfb;
}
.loading img {
  display: block;
  margin: auto;
}
.loading span {
  text-align: center;
  display: block;
  font-size: 14px;
  font-weight: 300;
  color: #9da5be;
}
.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(157, 165, 190, 0.6);
  z-index: 1500;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.overlay.visible {
  opacity: 1;
  pointer-events: all;
}
.modal {
  position: absolute;
  top: -350px;
  left: 50%;
  z-index: 1500;
  width: 650px;
  background: white;
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
    0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
  -webkit-transform: translatex(-50%);
  transform: translatex(-50%);
  opacity: 0;
  pointer-events: none;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.modal .checkboxes {
  padding: 20px;
}
.modal .checkboxes.no-padding-top {
  padding-top: 0;
}
.modal.absolute {
  position: absolute;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .modal {
    width: 90%;
    position: absolute;
  }
}
.modal.on-top {
  z-index: 2000;
}
.modal.onTop {
  z-index: 2000;
}
.modal.visible {
  -webkit-transform: translate(-50%, 550px);
  transform: translate(-50%, 550px);
  opacity: 1;
  pointer-events: all;
}
.modal header {
  height: 60px;
  position: relative;
}
.modal header h6 {
  line-height: 60px;
  font-weight: 300;
  font-size: 24px;
  padding-left: 30px;
  color: #5093e1;
  margin: 0;
  text-align: left;
  color: #474c58;
}
.modal header h4 {
  line-height: 60px;
  font-weight: 300;
  font-size: 24px;
  padding-left: 20px;
  color: #5093e1;
  color: #474c58;
}
.modal header a {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  font-size: 14px;
  color: #9da5be;
  text-decoration: none;
  border-radius: 50%;
  -webkit-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
}
.modal header a:after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  background: #f6f7fa;
  border-radius: 50%;
  z-index: -1;
  top: 0;
  left: 0;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
  opacity: 0;
}
.modal header a:hover {
  color: #474c58;
}
.modal header a:hover:after {
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}
.modal footer,
.modal .buttons {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  flex-direction: row-reverse;
  -webkit-box-pack: start;
  justify-content: flex-start;
  margin: 0;
  padding: 20px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .modal footer,
  .modal .buttons {
    white-space: nowrap;
    overflow-y: visible;
    overflow-x: auto;
  }
  .modal footer::-webkit-scrollbar,
  .modal .buttons::-webkit-scrollbar {
    display: none;
  }
}
.modal footer.buttons,
.modal .buttons.buttons {
  border-radius: 5px;
}
.modal footer.margin-top,
.modal .buttons.margin-top {
  margin-top: 20px;
}
.modal footer.margin-bottom,
.modal .buttons.margin-bottom {
  margin-bottom: 20px;
}
.modal footer input[type="submit"],
.modal footer .button,
.modal .buttons input[type="submit"],
.modal .buttons .button {
  height: 40px;
  display: block;
  border-radius: 4px;
  font-family: "Open Sans", sans-serif;
  font-weight: 500;
  color: #5093e1;
  text-transform: uppercase;
  padding: 0 30px;
  margin: 0 0 0 10px;
  cursor: pointer;
  outline: none;
  text-decoration: none;
  line-height: 40px;
  font-size: 14px;
  background: #5093e1;
  color: white;
  border: none;
}
.modal footer input[type="submit"]:hover,
.modal footer .button:hover,
.modal .buttons input[type="submit"]:hover,
.modal .buttons .button:hover {
  box-shadow: 0 1px 2px 0 rgba(80, 147, 225, 0.451),
    0 1px 3px 1px rgba(80, 147, 225, 0.302);
}
.modal footer input[type="submit"].secondary,
.modal footer .button.secondary,
.modal .buttons input[type="submit"].secondary,
.modal .buttons .button.secondary {
  color: #474c58;
  background: none;
  position: relative;
}
.modal footer input[type="submit"].secondary:after,
.modal footer .button.secondary:after,
.modal .buttons input[type="submit"].secondary:after,
.modal .buttons .button.secondary:after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  background: #f6f7fa;
  border-radius: 4px;
  z-index: -1;
  top: 0;
  left: 0;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
  opacity: 0;
}
.modal footer input[type="submit"].secondary:hover,
.modal footer .button.secondary:hover,
.modal .buttons input[type="submit"].secondary:hover,
.modal .buttons .button.secondary:hover {
  box-shadow: none;
}
.modal footer input[type="submit"].secondary:hover:after,
.modal footer .button.secondary:hover:after,
.modal .buttons input[type="submit"].secondary:hover:after,
.modal .buttons .button.secondary:hover:after {
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}
.modal .center-button {
  text-align: center;
}
.modal .center-button.margin-bottom {
  margin-bottom: 20px;
}
.modal .center-button a {
  background: #5093e1;
  color: white;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 12px;
  padding: 0 20px;
  border-radius: 36px;
  line-height: 36px;
  display: inline-block;
  cursor: pointer;
}
.modal .center-button a:hover {
  background: #2578d9;
}
.modal h6 {
  text-align: center;
  font-weight: 700;
  margin: 20px 0 10px;
  color: #8b96b9;
}
.modal .no-padding-top {
  padding-top: 0;
}
.modal .no-padding-bottom {
  padding-bottom: 0;
}
.modal .fields {
  padding: 20px 20px 0 20px;
}
.modal .fields.margin-bottom {
  margin-bottom: 20px;
}
.modal .fields li {
  margin-bottom: 15px;
}
.modal .fields li.no-margin-bottom {
  margin-bottom: 0;
}
.modal .fields li.half {
  width: 48%;
  margin-right: 4%;
}
.modal .fields li.last {
  margin-right: 0;
}
.modal .fields li:nth-last-child(1) {
  margin-bottom: 0;
}
.modal .fields .buttons {
  clear: both;
  height: 60px;
  background: #f6f7fa;
  text-align: right;
  border-radius: 5px;
}
.modal .fields .buttons input[type="file"] {
  display: none;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .modal .fields .buttons {
    white-space: nowrap;
    overflow-y: visible;
    overflow-x: auto;
  }
  .modal .fields .buttons::-webkit-scrollbar {
    display: none;
  }
}
.modal .fields .buttons a,
.modal .fields .buttons input[type="submit"] {
  height: 40px;
  display: block;
  border: 2px solid #e7e8e9;
  background: white;
  border-radius: 5px;
  font-family: "Open Sans", sans-serif;
  font-weight: 700;
  color: #5093e1;
  text-transform: uppercase;
  padding: 0 30px;
  float: right;
  margin: 10px;
  cursor: pointer;
  outline: none;
  text-decoration: none;
  line-height: 36px;
  font-size: 11px;
}
.modal .fields .buttons a:hover,
.modal .fields .buttons input[type="submit"]:hover {
  color: white;
  background: #5093e1;
}
.modal .fields .buttons a.hidden,
.modal .fields .buttons input[type="submit"].hidden {
  display: none;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .modal .fields .buttons a,
  .modal .fields .buttons input[type="submit"] {
    display: inline-block;
    float: none;
  }
}
.modal .fields .upload-status .status {
  font-size: 14px;
  color: #8b96b9;
  font-weight: 300;
  display: block;
  margin-bottom: 5px;
}
.modal .padded {
  padding: 20px;
}
.modal .padded li {
  margin-bottom: 15px;
}
.modal .modal-content.flex {
  display: -webkit-box;
  display: flex;
}
.modal .modal-content.no-flex {
  display: block;
}
.modal .modal-content.padding {
  padding: 20px 30px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .modal .modal-content {
    display: block;
    width: 100%;
  }
}
.modal .modal-content p.error-message,
.modal .modal-content p.success-message,
.modal .modal-content p.message {
  padding: 30px;
  font-size: 18px;
  line-height: 1.4;
  color: #474c58;
}
.modal .modal-content .centered {
  text-align: center;
}
.modal .modal-content .light {
  font-weight: 300;
}
.modal .modal-content ul.details-list {
  padding: 30px;
}
.modal .modal-content ul.details-list li {
  font-size: 18px;
  margin-bottom: 5px;
  -webkit-columns: #474c58;
  -moz-columns: #474c58;
  columns: #474c58;
  line-height: 1.4;
}
.modal .modal-content .fields {
  -webkit-box-flex: 1;
  flex: 1;
  padding: 20px 20px 0 20px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .modal .modal-content .fields {
    width: 100%;
    padding: 20px;
  }
}
.modal .modal-content .fields.no-padding {
  padding: 0;
}
.modal .modal-content .fields li {
  margin-bottom: 15px;
}
.modal .modal-content .fields li.no-margin-bottom {
  margin-bottom: 0;
}
.modal .modal-content .fields li.half {
  width: 48%;
  margin-right: 4%;
}
.modal .modal-content .fields li.third-x2 {
  width: 66%;
  margin-right: 2%;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .modal .modal-content .fields li.third-x2 {
    width: 100%;
    margin-right: 0;
  }
}
.modal .modal-content .fields li.third {
  width: 32%;
  margin-right: 2%;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .modal .modal-content .fields li.third {
    width: 100%;
    margin-right: 0;
  }
}
.modal .modal-content .fields li.fifth {
  width: 18.4%;
  margin-right: 2%;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .modal .modal-content .fields li.fifth {
    width: 100%;
    margin-right: 0;
  }
}
.modal .modal-content .fields li.last {
  margin-right: 0;
}
.modal .modal-content .fields li.hidden {
  display: none;
}
.modal .modal-content .notice-message {
  background: #f6f7fa;
  color: #000000;
  padding: 10px;
  font-size: 14px;
  border-radius: 5px;
  line-height: 1.4;
  font-weight: 300;
  margin-left: 20px;
  margin-right: 20px;
}
.modal .modal-content .notice-message.centered {
  text-align: center;
}
.modal .modal-content .notice-message.hidden {
  display: none;
}
.modal .modal-content .notice-message.margin-bottom {
  margin-bottom: 20px;
}
.modal .modal-content .notice-message.margin-top {
  margin-top: 20px;
}
.modal .modal-content .notice-message.small-margin-bottom {
  margin-bottom: 10px;
}
.modal .modal-content .notice-message.small-margin-top {
  margin-top: 10px;
}
.modal .modal-content .notice-message.no-side-margin,
.modal .modal-content .notice-message.no-side-margins {
  margin-left: 0;
  margin-right: 0;
}
aside.sidebar {
  width: 250px;
  background: #2f323a;
  position: fixed;
  height: 100%;
  z-index: 1000;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
}
.not-active-year {
  background: #ad4242 !important;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  aside.sidebar {
    width: 70%;
    max-width: 300px;
    display: block;
    overflow: auto;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -webkit-transform: translate(-100%, 0);
    transform: translate(-100%, 0);
  }
  aside.sidebar.sidebar-open {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
aside.sidebar h1 {
  padding: 20px;
}
aside.sidebar h1 a {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  text-decoration: none;
}
aside.sidebar h1 a img {
  height: 40px;
}
aside.sidebar h1 a span {
  padding-left: 20px;
  color: white;
  font-weight: 300;
  font-size: 18px;
}
aside.sidebar h1 a span em {
  padding-top: 2px;
  display: block;
  font-size: 12px;
}
aside.sidebar nav {
  -webkit-box-flex: 1;
  flex: 1;
  padding: 20px 10px;
  /* scrolling with out scroll bar */
  overflow-y: auto;
  overflow-x: hidden;
}
/* nice scroll bar */
aside.sidebar nav::-webkit-scrollbar {
  width: 5px;
  background-color: #2f323a;
}
aside.sidebar nav::-webkit-scrollbar-thumb {
  background-color: #a2a7b0;
}
aside.sidebar nav::-webkit-scrollbar-track {
  background-color: #2f323a;
}
aside.not-active-year nav::-webkit-scrollbar {
  background-color: #ad4242 !important;
}
aside.not-active-year nav::-webkit-scrollbar-thumb {
  background-color: #eb5f5f !important;
}
aside.not-active-year nav::-webkit-scrollbar-track {
  background-color: #ad4242 !important;
}

aside.sidebar ul li {
  margin-bottom: 10px;
}
aside.sidebar ul li a {
  display: block;
  color: #d1d7e9;
  text-decoration: none;
  font-size: 14px;
  padding: 10px;
  border-radius: 50px;
}
aside.sidebar ul li a.active {
  background: #181a1e;
  color: white;
}
aside.sidebar ul li a:hover {
  color: white;
}
aside.sidebar ul li a span {
  margin-left: 20px;
  font-weight: 300;
}
aside.sidebar footer {
  padding: 20px 10px;
  background: #3d4148;
}
aside.sidebar footer p {
  color: #d1d7e9;
  font-size: 12px;
  text-align: center;
  line-height: 1.4;
  font-weight: 300;
}
.sidebar-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: red;
  z-index: 1000;
  background: rgba(157, 165, 190, 0.6);
  opacity: 0;
  pointer-events: none;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.sidebar-overlay.sidebar-open {
  opacity: 1;
  pointer-events: all;
}
.sidebar-overlay a {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 46px;
  height: 46px;
  text-align: center;
  line-height: 46px;
  font-size: 18px;
  border-radius: 50px;
  color: #474c58;
  text-decoration: none;
}
.sidebar-overlay a:hover {
  background: #f6f7fa;
  color: #5093e1;
}
.container {
  width: calc(100% - 250px);
  margin-left: 250px;
  height: 100%;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .container {
    width: 100%;
    margin-left: 0;
  }
}
body.sidebar-collapsed aside.sidebar { width: 60px; }
body.sidebar-collapsed aside.sidebar h1 span,
body.sidebar-collapsed aside.sidebar nav span,
body.sidebar-collapsed aside.sidebar footer span { display: none; }
body.sidebar-collapsed aside.sidebar h1 a img { display: none; }
body.sidebar-collapsed .container { width: calc(100% - 60px); margin-left: 60px; }
.collapse-sidebar-btn { cursor: pointer; margin-right: 12px; font-size: 18px; color: inherit; text-decoration: none; position: relative; z-index: 101; display: inline-block; padding: 0 8px; border-radius: 4px; }
.container .page.fixed {
  padding-top: 100px;
  overflow-x: hidden;
  min-height: 100vh;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .container .page.fixed {
    padding-top: 50px;
    width: 100%;
    overflow-x: hidden;
  }
}
header.main {
  height: 100px;
  background: white;
  padding-top: 20px;
  border-bottom: 2px solid #edeff5;
  position: relative;
}
header.main.fixed {
  position: fixed;
  width: calc(100% - 250px);
  z-index: 100;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  header.main.fixed {
    width: 100%;
  }
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  header.main {
    height: 50px;
    padding-top: 10px;
    width: 100%;
  }
}
header.main .open-sidebar {
  display: none;
  position: absolute;
  top: 2px;
  left: 2px;
  width: 46px;
  height: 46px;
  text-align: center;
  line-height: 46px;
  font-size: 18px;
  border-radius: 50px;
  color: #474c58;
  text-decoration: none;
}
header.main .open-sidebar:hover {
  background: #f6f7fa;
  color: #5093e1;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  header.main .open-sidebar {
    display: block;
  }
}
header.main h1 {
  text-align: center;
  font-size: 24px;
  font-weight: 300;
  padding: 10px;
  color: #8b96b9;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  header.main h1 {
    font-size: 14px;
  }
}
header.main h1 i {
  padding: 0 10px;
  color: #edeff5;
}
header.main h1 span {
  color: #5093e1;
}
.page-padding {
  margin: 40px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .page-padding {
    margin: 10px;
  }
}
.fields.padding-top {
  padding-top: 20px;
}
.fields li {
  position: relative;
  float: left;
  width: 100%;
}
.fields li.half {
  width: 49%;
  margin-right: 2%;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .fields li.half {
    width: 100%;
    margin-right: 0;
  }
}
.fields li.third_x2 {
  width: 66%;
  margin-right: 2%;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .fields li.third_x2 {
    width: 100%;
    margin-right: 0;
  }
}
.fields li.third-x2 {
  width: 66%;
  margin-right: 2%;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .fields li.third-x2 {
    width: 100%;
    margin-right: 0;
  }
}
.fields li.third {
  width: 32%;
  margin-right: 2%;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .fields li.third {
    width: 100%;
    margin-right: 0;
  }
}
.fields li.quarter {
  width: 23.5%;
  margin-right: 2%;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .fields li.quarter {
    width: 100%;
    margin-right: 0;
  }
}
.fields li.last {
  margin-right: 0;
}
.fields li.clear {
  clear: both;
}
.fields li.radio-option {
  margin-bottom: 15px;
}
.fields li.radio-option.inline {
  width: auto;
  margin-right: 10px;
}
.fields li.radio-option:nth-last-child(1) {
  margin-bottom: 0;
}
.fields li.radio-option input {
  display: none;
}
.fields li.radio-option label {
  cursor: pointer;
  font-weight: 300;
  color: #474c58;
  margin-right: 15px;
  display: block;
  line-height: 1.4;
  position: relative;
  padding-left: 30px;
}
.fields li.radio-option input.error + label {
  color: #f65177;
}
.fields li.radio-option input + label:before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  vertical-align: middle;
  background: #e1e3e4;
  border: 5px solid #e1e3e4;
  border-radius: 20px;
  position: absolute;
  top: 0;
  left: 0;
}
.fields li.radio-option input[type="checkbox"] + label:before {
  border-radius: 5px;
}
.fields li.radio-option input.required + label:after {
  content: " *";
  color: #f65177;
}
.fields li.radio-option input:checked + label:before {
  background: #5093e1;
}
.fields li.select select {
  height: 40px;
  border: 1px solid #d1d7e9;
  border-radius: 5px;
  width: 100%;
  outline: none;
  padding: 0 15px;
  font-size: 14px;
  color: #2f323a;
  background: white;
  font-family: "Open Sans", sans-serif;
  font-weight: 300;
}
.fields li.select select:focus {
  border: 1px solid #9da5be;
}
.fields li.select select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px white inset;
}
.fields li.select-wrap select {
  height: 40px;
  border: 1px solid #d1d7e9;
  border-radius: 5px;
  outline: none;
  padding: 0 15px;
  color: #2f323a;
  background: none;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  border-radius: 0;
  width: 32%;
  float: left;
}
.fields li.select-wrap select.third {
  width: 32%;
  margin-right: 2%;
}
.fields li.select-wrap select.last {
  margin-right: 0;
}
.fields li.select-tall select {
  height: 100px;
}
.fields li input[type="text"],
.fields li input[type="password"],
.fields li input[type="email"],
.fields li input[type="tel"],
.fields li select.input,
.fields li textarea {
  height: 40px;
  border: 1px solid #d1d7e9;
  border-radius: 5px;
  width: 100%;
  outline: none;
  padding: 0 10px;
  font-size: 14px;
  color: #2f323a;
  background: none;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  font-weight: 300;
}
.fields li input[type="text"]::-webkit-input-placeholder,
.fields li input[type="password"]::-webkit-input-placeholder,
.fields li input[type="email"]::-webkit-input-placeholder,
.fields li input[type="tel"]::-webkit-input-placeholder,
.fields li select.input::-webkit-input-placeholder,
.fields li textarea::-webkit-input-placeholder {
  color: #9da5be;
}
.fields li input[type="text"]:-moz-placeholder,
.fields li input[type="password"]:-moz-placeholder,
.fields li input[type="email"]:-moz-placeholder,
.fields li input[type="tel"]:-moz-placeholder,
.fields li select.input:-moz-placeholder,
.fields li textarea:-moz-placeholder {
  color: #9da5be;
}
.fields li input[type="text"]::-moz-placeholder,
.fields li input[type="password"]::-moz-placeholder,
.fields li input[type="email"]::-moz-placeholder,
.fields li input[type="tel"]::-moz-placeholder,
.fields li select.input::-moz-placeholder,
.fields li textarea::-moz-placeholder {
  color: #9da5be;
}
.fields li input[type="text"]:-ms-input-placeholder,
.fields li input[type="password"]:-ms-input-placeholder,
.fields li input[type="email"]:-ms-input-placeholder,
.fields li input[type="tel"]:-ms-input-placeholder,
.fields li select.input:-ms-input-placeholder,
.fields li textarea:-ms-input-placeholder {
  color: #9da5be;
}
.fields li input[type="text"]:focus,
.fields li input[type="password"]:focus,
.fields li input[type="email"]:focus,
.fields li input[type="tel"]:focus,
.fields li select.input:focus,
.fields li textarea:focus {
  border: 1px solid #9da5be;
}
.fields li input[type="text"]:-webkit-autofill,
.fields li input[type="password"]:-webkit-autofill,
.fields li input[type="email"]:-webkit-autofill,
.fields li input[type="tel"]:-webkit-autofill,
.fields li select.input:-webkit-autofill,
.fields li textarea:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px white inset;
}
.fields li input[type="text"].error,
.fields li input[type="password"].error,
.fields li input[type="email"].error,
.fields li input[type="tel"].error,
.fields li select.input.error,
.fields li textarea.error {
  border: 1px solid #f65177;
  box-shadow: 0 0 10px rgba(246, 81, 119, 0.9);
}
.fields li textarea {
  max-width: 100%;
  min-width: 100%;
  height: 100px;
  padding: 10px 15px;
}
.fields li textarea.extra-padding {
  padding-top: 20px;
}
.fields li textarea.tall {
  height: 300px;
}
.fields li.filled span,
.fields li input:focus + span,
.fields li textarea:focus + span {
  top: -8px;
  font-size: 10px;
}
.fields li .required + span:after {
  content: " *";
  color: #f65177;
}
.fields li span {
  position: absolute;
  top: 10px;
  font-size: 14px;
  color: #9da5be;
  left: 7px;
  background: white;
  padding: 3px;
  font-weight: 300;
  pointer-events: none;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  max-width: calc(100% - 14px);
}
.fields li a.forgot {
  position: absolute;
  top: 0px;
  right: 10px;
  font-size: 14px;
  color: #9da5be;
  font-weight: 300;
  font-size: 12px;
  font-style: italic;
  text-decoration: none;
}
.fields li a.forgot:hover {
  color: #474c58;
}
.fields li a.password-eye-icon {
  position: absolute;
  top: 13px;
  right: 10px;
  font-size: 14px;
  color: #9da5be;
  font-weight: 300;
  font-size: 12px;
  font-style: italic;
  text-decoration: none;
}
.fields li a.password-eye-icon:hover {
  color: #474c58;
}
.file-uploader {
  height: 40px;
}
.file-uploader.uploading .upload-progress {
  display: block;
}
.file-uploader.uploading .file {
  display: none;
}
.file-uploader.no-remove .file .meta .remove-file {
  display: none !important;
}
.file-uploader input[type="file"] {
  display: none;
}
.file-uploader a.button {
  height: 40px;
  border: 2px solid #e7e8e9;
  background: white;
  border-radius: 5px;
  font-family: "Open Sans", sans-serif;
  font-weight: 700;
  color: #5093e1;
  text-transform: uppercase;
  padding: 0 20px;
  display: inline-block;
  cursor: pointer;
  outline: none;
  text-decoration: none;
  line-height: 36px;
  font-size: 11px;
}
.file-uploader a.button:hover {
  color: white;
  background: #5093e1;
}
.file-uploader .upload-progress {
  margin: 12px 0;
  height: 16px;
  border-radius: 16px;
  background: white;
  border: 2px solid #f6f7fa;
  overflow: hidden;
  display: none;
}
.file-uploader .upload-progress .progress-bar {
  background: white;
  border: 1px solid white;
  width: 100%;
  height: 12px;
  border-radius: 12px;
  position: relative;
}
.file-uploader .upload-progress .progress-bar .current-progress {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 0%;
  background: #5093e1;
  height: 10px;
  border-radius: 10px;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.file-uploader .file {
  display: -webkit-box;
  display: flex;
}
.file-uploader .file.has-file .meta .remove-file {
  display: inline-block;
}
.file-uploader .file .meta {
  -webkit-box-flex: 1;
  flex: 1;
  margin-right: 10px;
}
.file-uploader .file .meta h4 {
  font-size: 16px;
  color: #474c58;
  margin-bottom: 5px;
}
.file-uploader .file .meta .remove-file {
  float: left;
  margin-right: 5px;
  color: #d1d7e9;
  text-decoration: none;
  display: none;
}
.file-uploader .file .meta .remove-file:hover {
  color: #f65177;
}
.file-uploader .file .meta p {
  color: #d1d7e9;
  font-size: 12px;
  font-weight: 300;
  line-height: 16px;
}
.files-uploader {
  margin-bottom: 20px;
}
.files-uploader.no-remove .files .file .meta .remove-file {
  display: none !important;
}
.files-uploader input[type="file"] {
  display: none;
}
.files-uploader a.button {
  height: 40px;
  border: 2px solid #e7e8e9;
  background: white;
  border-radius: 5px;
  font-family: "Open Sans", sans-serif;
  font-weight: 700;
  color: #5093e1;
  text-transform: uppercase;
  padding: 0 20px;
  display: inline-block;
  cursor: pointer;
  outline: none;
  text-decoration: none;
  line-height: 36px;
  font-size: 11px;
}
.files-uploader a.button:hover {
  color: white;
  background: #5093e1;
}
.files-uploader .uploader {
  display: -webkit-box;
  display: flex;
}
.files-uploader .uploader .meta {
  -webkit-box-flex: 1;
  flex: 1;
  margin-right: 10px;
}
.files-uploader .uploader .meta h4 {
  font-size: 18px;
  color: #474c58;
  margin-bottom: 5px;
  font-weight: normal;
}
.files-uploader .uploader .meta p {
  color: #d1d7e9;
  line-height: 16px;
  font-size: 16px;
}
.files-uploader .files {
  padding-top: 10px;
}
.files-uploader .files .file {
  margin-bottom: 10px;
}
.files-uploader .files .file.uploading .upload-progress {
  display: block;
}
.files-uploader .files .file.uploading .meta {
  display: none;
}
.files-uploader .files .file.has-file .meta .remove-file {
  display: inline-block;
}
.files-uploader .files .file .upload-progress {
  height: 16px;
  border-radius: 16px;
  background: white;
  border: 2px solid #f6f7fa;
  overflow: hidden;
  display: none;
}
.files-uploader .files .file .upload-progress .progress-bar {
  background: white;
  border: 1px solid white;
  width: 100%;
  height: 12px;
  border-radius: 12px;
  position: relative;
}
.files-uploader .files .file .upload-progress .progress-bar .current-progress {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 0%;
  background: #5093e1;
  height: 10px;
  border-radius: 10px;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.files-uploader .files .file .meta h4 {
  font-size: 18px;
  color: #2f323a;
  margin-bottom: 5px;
  font-weight: normal;
}
.files-uploader .files .file .meta .remove-file {
  float: left;
  margin-right: 5px;
  color: #d1d7e9;
  text-decoration: none;
  display: none;
}
.files-uploader .files .file .meta .remove-file:hover {
  color: #f65177;
}
.files-uploader .files .file .meta p {
  color: #d1d7e9;
  line-height: 16px;
  font-size: 16px;
  margin-bottom: 0;
}
.input-wrapper {
  position: relative;
}
.input-wrapper input[type="text"],
.input-wrapper input[type="password"],
.input-wrapper input[type="email"],
.input-wrapper input[type="tel"],
.input-wrapper select.input,
.input-wrapper textarea {
  height: 40px;
  border: 1px solid #d1d7e9;
  border-radius: 5px;
  width: 100%;
  outline: none;
  padding: 0 15px;
  font-size: 14px;
  color: #2f323a;
  background: none;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  font-weight: 300;
}
.input-wrapper input[type="text"]::-webkit-input-placeholder,
.input-wrapper input[type="password"]::-webkit-input-placeholder,
.input-wrapper input[type="email"]::-webkit-input-placeholder,
.input-wrapper input[type="tel"]::-webkit-input-placeholder,
.input-wrapper select.input::-webkit-input-placeholder,
.input-wrapper textarea::-webkit-input-placeholder {
  color: #9da5be;
}
.input-wrapper input[type="text"]:-moz-placeholder,
.input-wrapper input[type="password"]:-moz-placeholder,
.input-wrapper input[type="email"]:-moz-placeholder,
.input-wrapper input[type="tel"]:-moz-placeholder,
.input-wrapper select.input:-moz-placeholder,
.input-wrapper textarea:-moz-placeholder {
  color: #9da5be;
}
.input-wrapper input[type="text"]::-moz-placeholder,
.input-wrapper input[type="password"]::-moz-placeholder,
.input-wrapper input[type="email"]::-moz-placeholder,
.input-wrapper input[type="tel"]::-moz-placeholder,
.input-wrapper select.input::-moz-placeholder,
.input-wrapper textarea::-moz-placeholder {
  color: #9da5be;
}
.input-wrapper input[type="text"]:-ms-input-placeholder,
.input-wrapper input[type="password"]:-ms-input-placeholder,
.input-wrapper input[type="email"]:-ms-input-placeholder,
.input-wrapper input[type="tel"]:-ms-input-placeholder,
.input-wrapper select.input:-ms-input-placeholder,
.input-wrapper textarea:-ms-input-placeholder {
  color: #9da5be;
}
.input-wrapper input[type="text"]:focus,
.input-wrapper input[type="password"]:focus,
.input-wrapper input[type="email"]:focus,
.input-wrapper input[type="tel"]:focus,
.input-wrapper select.input:focus,
.input-wrapper textarea:focus {
  border: 1px solid #9da5be;
}
.input-wrapper input[type="text"]:-webkit-autofill,
.input-wrapper input[type="password"]:-webkit-autofill,
.input-wrapper input[type="email"]:-webkit-autofill,
.input-wrapper input[type="tel"]:-webkit-autofill,
.input-wrapper select.input:-webkit-autofill,
.input-wrapper textarea:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px white inset;
}
.input-wrapper input[type="text"].error,
.input-wrapper input[type="password"].error,
.input-wrapper input[type="email"].error,
.input-wrapper input[type="tel"].error,
.input-wrapper select.input.error,
.input-wrapper textarea.error {
  border: 1px solid #f65177;
}
.input-wrapper.filled span,
.input-wrapper input:focus + span,
.input-wrapper textarea:focus + span {
  top: -8px;
  font-size: 10px;
}
.input-wrapper .required + span:after {
  content: " *";
  color: #f65177;
}
.input-wrapper span {
  position: absolute;
  top: 10px;
  font-size: 14px;
  color: #9da5be;
  left: 7px;
  background: white;
  padding: 3px;
  font-weight: 300;
  pointer-events: none;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.search-wrapper {
  background: white;
  border-radius: 5px;
  overflow: hidden;
  margin-bottom: 40px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .search-wrapper {
    margin-bottom: 10px;
  }
}
.search-wrapper.searching .input-wrapper {
  opacity: 0;
  visibility: hidden;
}
.search-wrapper.searching .advanced-search {
  display: block;
}
.search-wrapper .search-bar {
  min-height: 60px;
  padding: 10px;
}
.search-wrapper .search-bar.flex {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
}
.search-wrapper .search-bar .input-wrapper {
  width: 300px;
  max-width: calc(100% - 50px);
}
@media only screen and (min-width: 521px) and (max-width: 819px),
  only screen and (max-width: 520px) {
  .search-wrapper .search-bar .input-wrapper {
    width: auto;
    max-width: auto;
    -webkit-box-flex: 1;
    flex: 1;
    margin-right: 10px;
  }
  .search-wrapper .search-bar.flex {
    flex-direction: column
  }

}
.search-wrapper .search-bar nav a.button {
  height: 40px;
  border: 2px solid #e7e8e9;
  background: white;
  border-radius: 5px;
  font-family: "Open Sans", sans-serif;
  font-weight: 700;
  color: #5093e1;
  text-transform: uppercase;
  padding: 0 20px;
  display: inline-block;
  margin: 0 5px;
  cursor: pointer;
  outline: none;
  text-decoration: none;
  line-height: 36px;
  font-size: 11px;
}
.search-wrapper .search-bar nav a.button.small-padding {
  padding: 0 10px;
}
.search-wrapper .search-bar nav a.button:hover {
  color: white;
  background: #5093e1;
}
.search-wrapper .search-bar nav a.button.hidden {
  display: none;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .search-wrapper .search-bar nav a.button {
    display: inline-block;
    float: none;
    margin: 0;
  }
}
.search-wrapper .search-bar nav .total-results {
  display: inline-block;
  line-height: 40px;
  vertical-align: top;
  margin-right: 10px;
  color: #e7e8e9;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .search-wrapper .search-bar nav .total-results {
    display: none;
  }
}
.search-wrapper .search-bar .button-icon {
  display: inline-block;
  width: 40px;
  height: 40px;
  font-size: 24px;
  text-decoration: none;
  line-height: 40px;
  text-align: center;
  color: #5093e1;
  border-radius: 5px;
  vertical-align: middle;
}
.search-wrapper .search-bar .button-icon:hover {
  background: #e7e8e9;
}
.search-wrapper .advanced-search {
  display: none;
}
.search-wrapper .advanced-search .search-options {
  border-top: 1px solid #fbfbfb;
  padding: 30px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .search-wrapper .advanced-search .search-options {
    padding: 10px;
  }
}
.search-wrapper .advanced-search .search-options .fields li {
  margin-bottom: 15px;
}
.search-wrapper footer,
.search-wrapper .buttons {
  clear: both;
  height: 60px;
  background: #f6f7fa;
  text-align: right;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .search-wrapper footer,
  .search-wrapper .buttons {
    white-space: nowrap;
    overflow-y: visible;
    overflow-x: auto;
  }
  .search-wrapper footer::-webkit-scrollbar,
  .search-wrapper .buttons::-webkit-scrollbar {
    display: none;
  }
}
.search-wrapper footer.margin-bottom,
.search-wrapper .buttons.margin-bottom {
  margin-bottom: 20px;
}
.search-wrapper footer a,
.search-wrapper footer input[type="submit"],
.search-wrapper .buttons a,
.search-wrapper .buttons input[type="submit"] {
  height: 40px;
  display: block;
  border: 2px solid #e7e8e9;
  background: white;
  border-radius: 5px;
  font-family: "Open Sans", sans-serif;
  font-weight: 700;
  color: #5093e1;
  text-transform: uppercase;
  padding: 0 30px;
  float: right;
  margin: 10px;
  cursor: pointer;
  outline: none;
  text-decoration: none;
  line-height: 36px;
  font-size: 11px;
}
.search-wrapper footer a.small-padding,
.search-wrapper footer input[type="submit"].small-padding,
.search-wrapper .buttons a.small-padding,
.search-wrapper .buttons input[type="submit"].small-padding {
  padding: 0 10px;
}
.search-wrapper footer a:hover,
.search-wrapper footer input[type="submit"]:hover,
.search-wrapper .buttons a:hover,
.search-wrapper .buttons input[type="submit"]:hover {
  color: white;
  background: #5093e1;
}
.search-wrapper footer a.hidden,
.search-wrapper footer input[type="submit"].hidden,
.search-wrapper .buttons a.hidden,
.search-wrapper .buttons input[type="submit"].hidden {
  display: none;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .search-wrapper footer a,
  .search-wrapper footer input[type="submit"],
  .search-wrapper .buttons a,
  .search-wrapper .buttons input[type="submit"] {
    display: inline-block;
    float: none;
  }
}
.search-filter {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  justify-content: space-between;
  margin-bottom: 40px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .search-filter {
    display: block;
    margin-bottom: 20px;
  }
}
.search-filter .filters {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  /* align-items: center; */
  flex-wrap: wrap;
  margin-bottom: 10px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .search-filter .filters {
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
  }
}
.search-filter .filters .filter-wrapper {
  margin:  0 20px 15px 0;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .search-filter .filters .filter-wrapper {
    display: block;
    margin-bottom: 20px;
  }
}
.search-filter .filters .filter-wrapper:nth-last-of-type(1) {
  margin-right: 0;
}
.search-filter .filters .filter-wrapper p,
.search-filter .filters .filter-wrapper .sort-title {
  color: #474c58;
  margin-right: 10px;
  padding-top: 4px;
  white-space: nowrap;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .search-filter .filters .filter-wrapper p,
  .search-filter .filters .filter-wrapper .sort-title {
    padding: 0;
    margin: 0 0 10px 0;
  }
}
.search-filter .filters .dropdown-wrapper {
  position: relative;
}
.search-filter .filters .dropdown-wrapper[data-color="green"] .open-dropdown {
  background: #50c14e;
  color: white;
}
.search-filter .filters .dropdown-wrapper[data-color="orange"] .open-dropdown {
  background: #f6a526;
  color: white;
}
.search-filter .filters .dropdown-wrapper[data-color="red"] .open-dropdown {
  background: #f65177;
  color: white;
}
.search-filter .filters .dropdown-wrapper[data-color="blue"] .open-dropdown {
  background: #5093e1;
  color: white;
}
.search-filter .filters .dropdown-wrapper[data-color="yellow"] .open-dropdown {
  background: #dfe150;
  color: white;
}
.search-filter .filters .dropdown-wrapper[data-color="grey"] .open-dropdown {
  background: #9da5be;
  color: white;
}
.search-filter .filters .dropdown-wrapper.opened .open-dropdown .arrow {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.search-filter .filters .dropdown-wrapper.opened .dropdown {
  top: calc(100% + 5px);
  pointer-events: all;
  opacity: 1;
}
.search-filter .filters .dropdown-wrapper .open-dropdown {
  color: #474c58;
  font-weight: 600;
  font-size: 14px;
  white-space: nowrap;
  text-decoration: none;
  background: white;
  padding: 10px 20px;
  border-radius: 50px;
  text-transform: uppercase;
  display: inline-block;
}
.search-filter .filters .dropdown-wrapper .open-dropdown .arrow {
  font-size: 8px;
  display: inline-block;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  vertical-align: middle;
  margin-left: 5px;
}
.search-filter .filters .dropdown-wrapper .dropdown {
  position: absolute;
  left: 0;
  background: white;
  min-width: 100%;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  top: 0;
  opacity: 0;
  pointer-events: none;
  z-index: 2;
  box-shadow: 0px 9px 15px 0px rgba(0, 1, 1, 0.1);
  border-radius: 5px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .search-filter .filters .dropdown-wrapper .dropdown {
    min-width: auto;
  }
}
.search-filter .filters .dropdown-wrapper .dropdown ul li a {
  display: block;
  line-height: 40px;
  font-size: 14px;
  color: #2f323a;
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 1px solid #edeff5;
  padding: 0 20px;
}
.search-filter .filters .dropdown-wrapper .dropdown ul li a.active {
  font-weight: 700;
}
.search-filter .filters .dropdown-wrapper .dropdown ul li a:hover {
  background: #edeff5;
}
.search-filter .filters .dropdown-wrapper .dropdown ul li a span.color {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 10px;
  margin-right: 5px;
  background: transparent;
}
.search-filter .filters .date-dropdown-wrapper form{
  color: #474c58;
  font-weight: 600;
  font-size: 14px;
  white-space: nowrap;
  text-decoration: none;
  background: white;
  padding: 10px 20px;
  border-radius: 50px;
  text-transform: uppercase;
  display: inline-block;
}

.search-filter .filters .date-dropdown-wrapper form label {
 margin-left: 5px;
 font-size: 12px;
}
.search-filter .filters .date-dropdown-wrapper form input{
  border: 1px solid #d1d7e9;
  border-radius: 5px;
  outline: none;
  padding: 0 15px;
  font-size: 12px;
  color: #2f323a;
  background: none;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  font-weight: 300;
}

.search-filter .filters .date-dropdown-wrapper form button[type="submit"]{
  color: #474c58;
  font-weight: 600;
  font-size: 12px;
  white-space: nowrap;
  text-decoration: none;
  background: white;
  padding: 4px 15px 4px 15px;
  border: 1px solid #d1d7e9;
  border-radius: 50px;
  text-transform: uppercase;
  display: inline-block;
  margin-left: 10px;
  cursor: pointer;
}

.search-filter .clear-filter a{
  color: #474c58;
  font-weight: 600;
  font-size: 14px;
  white-space: nowrap;
  text-decoration: none;
  background: white;
  padding: 15px 20px;
  border-radius: 50px;
  text-transform: uppercase;
  display: flex;

}

.search-filter
  .filters
  .dropdown-wrapper
  .dropdown
  ul
  li
  a
  span.color[data-color="green"] {
  background: #50c14e;
}
.search-filter
  .filters
  .dropdown-wrapper
  .dropdown
  ul
  li
  a
  span.color[data-color="orange"] {
  background: #f6a526;
}
.search-filter
  .filters
  .dropdown-wrapper
  .dropdown
  ul
  li
  a
  span.color[data-color="red"] {
  background: #f65177;
}
.search-filter
  .filters
  .dropdown-wrapper
  .dropdown
  ul
  li
  a
  span.color[data-color="blue"] {
  background: #5093e1;
}
.search-filter
  .filters
  .dropdown-wrapper
  .dropdown
  ul
  li
  a
  span.color[data-color="yellow"] {
  background: #dfe150;
}
.search-filter
  .filters
  .dropdown-wrapper
  .dropdown
  ul
  li
  a
  span.color[data-color="grey"] {
  background: #9da5be;
}
.search-filter .search {
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  flex-wrap: wrap;
}
.search-filter .search .reports-button {
  background: #fff;
  color: #474c58;
  border-radius: 50px;
  padding: 14px 20px;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  white-space: nowrap;
  text-decoration: none;
  display: inline-block;
  margin-left: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.search-filter .search .total-sum{
  background: #fff;
  color: #474c58;
  border-radius: 50px;
  padding: 14px 30px;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  white-space: nowrap;
  text-decoration: none;
  display: inline-block;
  margin-left: 20px;
  display: flex;
  align-items: center;
  justify-content: center;

}
.search-filter .search input[type="text"] {
  height: 40px;
  border: none;
  outline: none;
  border-radius: 40px;
  padding: 0 20px;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  -webkit-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
  width: 100%;
}
.search-filter .search input[type="text"]:focus {
  box-shadow: 0px 9px 15px 0px rgba(0, 1, 1, 0.1);
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .search-filter .search input[type="text"]:focus {
    box-shadow: none;
  }
}
.table-wrapper {
  position: relative;
}
@media only screen and (max-width: 520px),
  only screen and (min-width: 521px) and (max-width: 719px) {
  .table-wrapper .card-details .standard-grey-wrapper {
    padding-top: 10px;
  }
}
.table-wrapper .menu-wrapper {
  width: 30px;
}
.table-wrapper .menu-wrapper.opened .menu {
  -webkit-transform: translate(0, 0px);
  transform: translate(0, 0px);
  opacity: 1;
  pointer-events: all;
}
.table-wrapper .menu-wrapper .open-menu {
  color: #9da5be;
  text-decoration: none;
  vertical-align: middle;
}
.table-wrapper .menu-wrapper .open-menu:hover {
  color: #474c58;
}
.table-wrapper .menu-wrapper .menu {
  position: absolute;
  background: white;
  border-radius: 5px;
  padding: 5px;
  width: auto;
  position: absolute;
  top: 0;
  -webkit-transform: translate(0, 50px);
  transform: translate(0, 50px);
  z-index: 2;
  box-shadow: 0 0 10px rgba(71, 76, 88, 0.2);
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity 0.3s ease-in-out,
    -webkit-transform 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out,
    -webkit-transform 0.3s ease-in-out;
}
.table-wrapper .menu-wrapper .menu li a {
  display: block;
  padding: 10px 20px 10px 5px;
  border-radius: 5px;
  font-size: 12px;
  color: #2f323a;
  text-decoration: none;
  white-space: nowrap;
  outline: none;
}
.table-wrapper .menu-wrapper .menu li a:hover {
  background: #f6f7fa;
}
.table-wrapper .menu-wrapper .menu li a span.icon {
  display: inline-block;
  width: 15px;
  height: 15px;
  vertical-align: middle;
  margin-right: 10px;
  font-size: 15px;
}
.table-wrapper .menu-wrapper .menu li a span.icon[data-color="green"] {
  color: #50c14e;
}
.table-wrapper .menu-wrapper .menu li a span.icon[data-color="orange"] {
  color: #f6a526;
}
.table-wrapper .menu-wrapper .menu li a span.icon[data-color="red"] {
  color: #f65177;
}
.table-wrapper .menu-wrapper .menu li a span.icon[data-color="blue"] {
  color: #5093e1;
}
.table-wrapper .menu-wrapper .menu li a span.icon[data-color="yellow"] {
  color: #dfe150;
}
.table-wrapper .menu-wrapper .menu li a span.icon[data-color="grey"] {
  color: #9da5be;
}
.standard-grey-wrapper {
  background: white;
  padding: 30px;
  border-radius: 5px;
  margin-bottom: 40px;
  overflow: auto;
}
.standard-grey-wrapper.no-padding {
  padding: 0;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .standard-grey-wrapper {
    margin-bottom: 20px;
  }
}
.standard-grey-wrapper.no-margin-bottom {
  margin-bottom: 0;
}
.standard-grey {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 8px;
}
.standard-grey thead th {
  height: 40px;
  text-align: left;
  color: #474c58;
  padding: 0 8px;
}
.standard-grey thead th a {
  text-decoration: none;
  color: #474c58;
}
.standard-grey thead th a:hover {
  text-decoration: underline;
}
.standard-grey thead th.icon {
  text-align: center;
  width: 40px;
}
.standard-grey thead th.icon a {
  text-decoration: none;
  color: #9da5be;
  vertical-align: middle;
  cursor: pointer;
}
.standard-grey thead th.icon a:hover,
.standard-grey thead th.icon a.active {
  color: #5093e1;
}
.standard-grey tbody tr.selected td.icon .active-blue,
.standard-grey tfoot tr.selected td.icon .active-blue {
  color: #5093e1;
}
.standard-grey tbody tr.selected td.icon .active-blue:hover,
.standard-grey tfoot tr.selected td.icon .active-blue:hover {
  color: #5093e1;
}
.standard-grey tbody tr.link-row:hover td,
.standard-grey tfoot tr.link-row:hover td {
  background: #e7e8e9;
}
.standard-grey tbody tr.link-row:hover td .colors-group span.color,
.standard-grey tfoot tr.link-row:hover td .colors-group span.color {
  border: 2px solid #e7e8e9;
}
.standard-grey tbody tr td,
.standard-grey tfoot tr td {
  color: #474c58;
  line-height: 1.2;
  background: #edeff5;
  padding: 10px 8px;
  vertical-align: middle;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .standard-grey tbody tr td,
  .standard-grey tfoot tr td {
    white-space: nowrap;
  }
}
.standard-grey tbody tr td:nth-of-type(1),
.standard-grey tfoot tr td:nth-of-type(1) {
  border-radius: 5px 0 0 5px;
}
.standard-grey tbody tr td:nth-last-of-type(1),
.standard-grey tfoot tr td:nth-last-of-type(1) {
  border-radius: 0 5px 5px 0;
}
.standard-grey tbody tr td.no-padding,
.standard-grey tfoot tr td.no-padding {
  padding: 10px 0;
}
.standard-grey tbody tr td.padding-sides,
.standard-grey tfoot tr td.padding-sides {
  padding-right: 10px;
  padding-left: 10px;
}
.standard-grey tbody tr td.nowrap,
.standard-grey tfoot tr td.nowrap {
  white-space: nowrap;
}
.standard-grey tbody tr td.center,
.standard-grey tfoot tr td.center {
  text-align: center;
}
.standard-grey tbody tr td.link-padding,
.standard-grey tfoot tr td.link-padding {
  padding: 0;
}
.standard-grey tbody tr td.link-padding a,
.standard-grey tfoot tr td.link-padding a {
  outline: none;
  display: block;
  padding: 10px 8px;
  color: #474c58;
  text-decoration: none;
}
.standard-grey tbody tr td.icon,
.standard-grey tfoot tr td.icon {
  width: 40px;
  text-align: center;
}
.standard-grey tbody tr td.icon .active-blue,
.standard-grey tfoot tr td.icon .active-blue {
  color: #9da5be;
}
.standard-grey tbody tr td.icon .active-blue:hover,
.standard-grey tfoot tr td.icon .active-blue:hover {
  color: #474c58;
}
.standard-grey tbody tr td.icon .active-blue.active,
.standard-grey tbody tr td.icon .active-blue:hover.active,
.standard-grey tfoot tr td.icon .active-blue.active,
.standard-grey tfoot tr td.icon .active-blue:hover.active {
  color: #5093e1;
}
.standard-grey tbody tr td.icon .hover-red:hover,
.standard-grey tfoot tr td.icon .hover-red:hover {
  color: #f65177;
}
.standard-grey tbody tr td .small-text,
.standard-grey tfoot tr td .small-text {
  font-size: 12px;
  display: block;
  color: #9da5be;
  line-height: 1.4;
}
.standard-grey tbody tr td span.highlight,
.standard-grey tfoot tr td span.highlight {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 3px;
  color: white;
}
.standard-grey tbody tr td span.highlight[data-color="green"],
.standard-grey tfoot tr td span.highlight[data-color="green"] {
  background: #50c14e;
}
.standard-grey tbody tr td span.highlight[data-color="red"],
.standard-grey tfoot tr td span.highlight[data-color="red"] {
  background: #f65177;
}
.standard-grey tbody tr td span.highlight[data-color="blue"],
.standard-grey tfoot tr td span.highlight[data-color="blue"] {
  background: #5093e1;
}
.standard-grey tbody tr td span.highlight[data-color="yellow"],
.standard-grey tfoot tr td span.highlight[data-color="yellow"] {
  background: #dfe150;
}
.standard-grey tbody tr td span.highlight[data-color="orange"],
.standard-grey tfoot tr td span.highlight[data-color="orange"] {
  background: #f6a526;
}
.standard-grey tbody tr td span.highlight[data-color="grey"],
.standard-grey tfoot tr td span.highlight[data-color="grey"] {
  background: #9da5be;
}
.standard-grey tbody tr td a.highlight,
.standard-grey tfoot tr td a.highlight {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 3px;
  color: white;
  text-decoration: none;
}
.standard-grey tbody tr td a.highlight[data-color="green"],
.standard-grey tfoot tr td a.highlight[data-color="green"] {
  background: #50c14e;
}
.standard-grey tbody tr td a.highlight[data-color="red"],
.standard-grey tfoot tr td a.highlight[data-color="red"] {
  background: #f65177;
}
.standard-grey tbody tr td a.highlight[data-color="blue"],
.standard-grey tfoot tr td a.highlight[data-color="blue"] {
  background: #5093e1;
}
.standard-grey tbody tr td a.highlight[data-color="yellow"],
.standard-grey tfoot tr td a.highlight[data-color="yellow"] {
  background: #dfe150;
}
.standard-grey tbody tr td a.highlight[data-color="orange"],
.standard-grey tfoot tr td a.highlight[data-color="orange"] {
  background: #f6a526;
}
.standard-grey tbody tr td a.highlight[data-color="grey"],
.standard-grey tfoot tr td a.highlight[data-color="grey"] {
  background: #9da5be;
}
.standard-grey tbody tr td a.highlight:hover[data-color="green"],
.standard-grey tfoot tr td a.highlight:hover[data-color="green"] {
  background: #3ba339;
}
.standard-grey tbody tr td a.highlight:hover[data-color="red"],
.standard-grey tfoot tr td a.highlight:hover[data-color="red"] {
  background: #f32151;
}
.standard-grey tbody tr td a.highlight:hover[data-color="blue"],
.standard-grey tfoot tr td a.highlight:hover[data-color="blue"] {
  background: #2578d9;
}
.standard-grey tbody tr td a.highlight:hover[data-color="yellow"],
.standard-grey tfoot tr td a.highlight:hover[data-color="yellow"] {
  background: #d6d925;
}
.standard-grey tbody tr td a.highlight:hover[data-color="orange"],
.standard-grey tfoot tr td a.highlight:hover[data-color="orange"] {
  background: #e08c09;
}
.standard-grey tbody tr td a.highlight:hover[data-color="grey"],
.standard-grey tfoot tr td a.highlight:hover[data-color="grey"] {
  background: #7e89aa;
}
.standard-grey tbody tr td span.color,
.standard-grey tfoot tr td span.color {
  display: inline-block;
  width: 15px;
  height: 15px;
  border-radius: 15px;
  margin-right: 5px;
  background: black;
}
.standard-grey tbody tr td span.color[data-color="green"],
.standard-grey tfoot tr td span.color[data-color="green"] {
  background: #50c14e;
}
.standard-grey tbody tr td span.color[data-color="orange"],
.standard-grey tfoot tr td span.color[data-color="orange"] {
  background: #f6a526;
}
.standard-grey tbody tr td span.color[data-color="red"],
.standard-grey tfoot tr td span.color[data-color="red"] {
  background: #f65177;
}
.standard-grey tbody tr td span.color[data-color="blue"],
.standard-grey tfoot tr td span.color[data-color="blue"] {
  background: #5093e1;
}
.standard-grey tbody tr td span.color[data-color="yellow"],
.standard-grey tfoot tr td span.color[data-color="yellow"] {
  background: #dfe150;
}
.standard-grey tbody tr td span.color[data-color="grey"],
.standard-grey tfoot tr td span.color[data-color="grey"] {
  background: #9da5be;
}
.standard-grey tbody tr td .colors-group,
.standard-grey tfoot tr td .colors-group {
  display: inline-block;
  vertical-align: middle;
  font-size: 0;
}
.standard-grey tbody tr td .colors-group span.color,
.standard-grey tfoot tr td .colors-group span.color {
  width: 13px;
  height: 13px;
  border: 2px solid #edeff5;
  margin-right: -5px;
}
.pagination {
  height: 60px;
  background: white;
  border-radius: 5px;
}
.pagination ul {
  text-align: center;
  font-size: 0;
}
.pagination ul li {
  margin: 10px;
  font-size: 11px;
  display: inline-block;
  height: 40px;
  line-height: 40px;
  text-transform: uppercase;
  font-weight: 700;
  background: white;
  border-radius: 5px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .pagination ul li.mobile-hide {
    display: none;
  }
}
.pagination ul li.current-page {
  padding: 0 15px;
  background: #5093e1;
  color: white;
}
.pagination ul li a {
  box-sizing: border-box;
  border-radius: 5px;
  display: block;
  padding: 0 15px;
  text-decoration: none;
  background: white;
  border: 2px solid #e7e8e9;
  color: #5093e1;
  height: 40px;
  line-height: 36px;
}
.pagination ul li a:hover {
  background: #5093e1;
  color: white;
}
.card {
  width: 600px;
  max-width: 100%;
  background: white;
  border-radius: 5px;
  overflow: hidden;
  margin-bottom: 40px;
}
.card.wide-700 {
  widows: 700px;
}
.card:nth-last-of-type(1) {
  margin-bottom: 0;
}
.card.visible {
  overflow: initial;
}
.card.closeable[data-mode="closed"] header {
  border-bottom: 0;
}
.card.closeable[data-mode="closed"] .card-details,
.card.closeable[data-mode="closed"] footer {
  display: none;
}
.card.closeable[data-mode="opened"] header .toggle-closeable i {
  -webkit-transform: rotate(-180deg);
  transform: rotate(-180deg);
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .card {
    margin-bottom: 10px;
  }
}
.card form {
  width: 100%;
}
.card header {
  border-bottom: 2px solid #fbfbfb;
}
.card header h4 {
  line-height: 60px;
  font-weight: 300;
  font-size: 24px;
  padding-left: 30px;
  color: #5093e1;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .card header h4 {
    font-size: 14px;
    padding-left: 20px;
    line-height: 40px;
  }
}
.card header h4.toggle-closeable {
  padding: 0;
}
.card header h4.toggle-closeable a {
  display: block;
  padding: 0 30px;
  text-decoration: none;
  color: #5093e1;
  line-height: 60px;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  align-items: center;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .card header h4.toggle-closeable a {
    line-height: 40px;
    padding: 0 20px;
  }
}
.card header h4.toggle-closeable a i {
  color: #e7e8e9;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.card .card-details.padding {
  padding: 30px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .card .card-details.padding {
    padding: 10px;
  }
}
.card .card-details.padding-small {
  padding: 15px;
}
.card .card-details.flex {
  display: -webkit-box;
  display: flex;
}
.card .card-details .standard-grey-wrapper {
  margin-bottom: 0;
}
.card .card-details .standard-grey-wrapper.margin-bottom {
  margin-bottom: 20px;
}
.card .card-details .standard-grey-wrapper.margin-bottom-small {
  margin-bottom: 10px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .card .card-details .standard-grey-wrapper {
    padding: 10px 0 0;
    margin: 0 10px;
  }
}
.card .card-details .details-list.table {
  display: table;
}
.card .card-details .details-list.table li {
  display: table-row;
}
.card .card-details .details-list.table li span,
.card .card-details .details-list.table li a {
  display: table-cell;
  margin-bottom: 5px;
  margin-left: 5px;
  vertical-align: top;
}
.card .card-details .details-list.margin-bottom {
  margin-bottom: 20px;
}
.card .card-details .details-list.margin-bottom-small,
.card .card-details .details-list.small-margin-bottom {
  margin-bottom: 10px;
}
.card .card-details .details-list.padding {
  padding-left: 20px;
}
.card .card-details .details-list dt {
  line-height: 1.4;
  color: #9da5be;
  font-weight: 700;
}
.card .card-details .details-list dd {
  line-height: 1.4;
  margin-bottom: 20px;
  color: #9da5be;
  font-weight: 300;
}
.card .card-details .details-list li {
  line-height: 1.4;
  margin-bottom: 5px;
  color: #9da5be;
  font-weight: 300;
}
.card .card-details .details-list li a {
  color: #9da5be;
}
.card .card-details .details-list li a:hover {
  color: #5093e1;
}
.card .card-details .details-list li span.padding {
  padding: 3px 0;
}
.card .card-details .details-list li span.highlight {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 3px;
  color: white;
}
.card .card-details .details-list li span.highlight[data-color="green"] {
  background: #50c14e;
}
.card .card-details .details-list li span.highlight[data-color="red"] {
  background: #f65177;
}
.card .card-details .details-list li span.highlight[data-color="blue"] {
  background: #5093e1;
}
.card .card-details .details-list li span.highlight[data-color="yellow"] {
  background: #dfe150;
}
.card .card-details .details-list li span.highlight[data-color="orange"] {
  background: #f6a526;
}
.card .card-details .details-list li span.highlight[data-color="grey"] {
  background: #9da5be;
}
.card .card-details .details-list li span.highlight[data-color="white"] {
  background: white;
  color: #9da5be;
}
.card .card-details .details-list li a.highlight {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 3px;
  color: white;
  text-decoration: none;
}
.card .card-details .details-list li a.highlight[data-color="green"] {
  background: #50c14e;
}
.card .card-details .details-list li a.highlight[data-color="red"] {
  background: #f65177;
}
.card .card-details .details-list li a.highlight[data-color="blue"] {
  background: #5093e1;
}
.card .card-details .details-list li a.highlight[data-color="yellow"] {
  background: #dfe150;
}
.card .card-details .details-list li a.highlight[data-color="orange"] {
  background: #f6a526;
}
.card .card-details .details-list li a.highlight[data-color="grey"] {
  background: #9da5be;
}
.card .card-details .details-list li a.highlight[data-color="white"] {
  background: white;
  color: #9da5be;
}
.card .card-details .details-list li a.highlight:hover[data-color="green"] {
  background: #3ba339;
}
.card .card-details .details-list li a.highlight:hover[data-color="red"] {
  background: #f32151;
}
.card .card-details .details-list li a.highlight:hover[data-color="blue"] {
  background: #2578d9;
}
.card .card-details .details-list li a.highlight:hover[data-color="yellow"] {
  background: #d6d925;
}
.card .card-details .details-list li a.highlight:hover[data-color="orange"] {
  background: #e08c09;
}
.card .card-details .details-list li a.highlight:hover[data-color="grey"] {
  background: #7e89aa;
}
.card .card-details .details-list li span.color {
  display: inline-block;
  width: 15px;
  height: 15px;
  border-radius: 15px;
  margin-right: 5px;
  background: black;
}
.card .card-details .details-list li span.color[data-color="green"] {
  background: #50c14e;
}
.card .card-details .details-list li span.color[data-color="red"] {
  background: #f65177;
}
.card .card-details .details-list li span.color[data-color="blue"] {
  background: #5093e1;
}
.card .card-details .details-list li span.color[data-color="yellow"] {
  background: #dfe150;
}
.card .card-details .details-list li span.color[data-color="orange"] {
  background: #f6a526;
}
.card .card-details .details-list li span.color[data-color="grey"] {
  background: #9da5be;
}
.card .card-details .large-icon {
  text-align: center;
  margin-bottom: 20px;
}
.card .card-details .large-icon i {
  font-size: 48px;
  color: #5093e1;
}
.card .card-details p.message {
  font-size: 18px;
  line-height: 1.4;
}
.card .card-details p.message.margin-bottom {
  margin-bottom: 20px;
}
.card .card-details p.message.small-margin-bottom {
  margin-bottom: 10px;
}
.card .card-details p.message.centered {
  text-align: center;
}
.card .card-details .notice-message {
  background: #f6f7fa;
  color: #9da5be;
  padding: 10px;
  font-size: 14px;
  border-radius: 5px;
  line-height: 1.4;
  font-weight: 300;
}
.card .card-details .notice-message.centered {
  text-align: center;
}
.card .card-details .notice-message.hidden {
  display: none;
}
.card .card-details .notice-message.margin-bottom {
  margin-bottom: 20px;
}
.card .card-details .notice-message.small-margin-bottom {
  margin-bottom: 10px;
}
.card .card-details p.light-message {
  font-size: 18px;
  line-height: 1.4;
  color: #9da5be;
  font-weight: 300;
}
.card .card-details p.light-message.margin-bottom {
  margin-bottom: 20px;
}
.card .card-details p.light-message.small-margin-bottom {
  margin-bottom: 10px;
}
.card .card-details p.light-message.centered {
  text-align: center;
}
.card .card-details p.light-message.hidden {
  display: none;
}
.card .card-details h6 {
  color: #9da5be;
  font-size: 18px;
  font-weight: 300;
  line-height: 36px;
  border-bottom: 1px solid #e7e8e9;
  text-align: center;
}
.card .card-details ul.fields.padding {
  padding: 30px;
}
.card .card-details ul.fields li {
  margin-bottom: 15px;
}
.card .card-details ul.fields li.no-margin-bottom {
  margin-bottom: 0;
}
.card .card-details ul.fields li.hidden {
  display: none;
}
.card .card-details ul.fields li.buttons {
  border-radius: 5px;
}
.card .card-details ul.fields li.buttons input[type="file"] {
  display: none;
}
.card .card-details ul.fields li.upload-status p {
  font-size: 14px;
}
.card .card-details ul.fields li p {
  color: #9da5be;
  font-weight: 300;
  line-height: 1.4;
}
.card .card-details ul.fields li p.centered {
  text-align: center;
}
.card .center-button {
  text-align: center;
}
.card .center-button.margin-bottom {
  margin-bottom: 20px;
}
.card .center-button a {
  background: #5093e1;
  color: white;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 12px;
  padding: 0 20px;
  border-radius: 36px;
  line-height: 36px;
  display: inline-block;
  cursor: pointer;
}
.card .center-button a[data-color="green"] {
  background: #50c14e;
}
.card .center-button a[data-color="red"] {
  background: #f65177;
}
.card .center-button a[data-color="blue"] {
  background: #5093e1;
}
.card .center-button a[data-color="yellow"] {
  background: #dfe150;
}
.card .center-button a[data-color="orange"] {
  background: #f6a526;
}
.card .center-button a[data-color="grey"] {
  background: #9da5be;
}
.card .center-button a:hover {
  background: #2578d9;
}
.card .center-button a:hover[data-color="green"] {
  background: #3ba339;
}
.card .center-button a:hover[data-color="red"] {
  background: #f32151;
}
.card .center-button a:hover[data-color="blue"] {
  background: #2578d9;
}
.card .center-button a:hover[data-color="yellow"] {
  background: #d6d925;
}
.card .center-button a:hover[data-color="orange"] {
  background: #e08c09;
}
.card .center-button a:hover[data-color="grey"] {
  background: #7e89aa;
}
.card .center-button a.margin {
  margin: 0 10px;
}
.card .center-button a.margin:first-child {
  margin-left: 0;
}
.card .center-button a.margin:last-child {
  margin-right: 0;
}
.card footer,
.card .buttons {
  clear: both;
  height: 60px;
  background: #f6f7fa;
  text-align: right;
  white-space: nowrap;
  padding: 0 5px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .card footer,
  .card .buttons {
    white-space: nowrap;
    overflow-y: visible;
    overflow-x: auto;
  }
  .card footer::-webkit-scrollbar,
  .card .buttons::-webkit-scrollbar {
    display: none;
  }
}
.card footer.margin-bottom,
.card .buttons.margin-bottom {
  margin-bottom: 20px;
}
.card footer.margin-top,
.card .buttons.margin-top {
  margin-top: 20px;
}
.card footer.rounded,
.card .buttons.rounded {
  border-radius: 5px;
}
.card footer a,
.card footer input[type="submit"],
.card .buttons a,
.card .buttons input[type="submit"] {
  height: 40px;
  border: 2px solid #e7e8e9;
  background: white;
  border-radius: 5px;
  font-family: "Open Sans", sans-serif;
  font-weight: 700;
  color: #5093e1;
  text-transform: uppercase;
  padding: 0 20px;
  display: inline-block;
  margin: 10px 5px;
  cursor: pointer;
  outline: none;
  text-decoration: none;
  line-height: 36px;
  font-size: 11px;
}
.card footer a.small-padding,
.card footer input[type="submit"].small-padding,
.card .buttons a.small-padding,
.card .buttons input[type="submit"].small-padding {
  padding: 0 10px;
}
.card footer a:hover,
.card footer input[type="submit"]:hover,
.card .buttons a:hover,
.card .buttons input[type="submit"]:hover {
  color: white;
  background: #5093e1;
}
.card footer a.hidden,
.card footer input[type="submit"].hidden,
.card .buttons a.hidden,
.card .buttons input[type="submit"].hidden {
  display: none;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .card footer a,
  .card footer input[type="submit"],
  .card .buttons a,
  .card .buttons input[type="submit"] {
    display: inline-block;
    float: none;
  }
}
.card footer .uploading-button,
.card .buttons .uploading-button {
  position: relative;
  padding: 0;
}
.card footer .uploading-button:hover,
.card .buttons .uploading-button:hover {
  background: white;
  color: #8b96b9;
}
.card footer .uploading-button .text,
.card .buttons .uploading-button .text {
  position: relative;
  z-index: 100;
  display: block;
  padding: 0 30px;
  border-radius: 3px;
}
.card footer .uploading-button .uploading,
.card .buttons .uploading-button .uploading {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: white;
  border-radius: 5px;
}
.card footer .uploading-button .percent,
.card .buttons .uploading-button .percent {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 0%;
  background: #e7e8e9;
}
.notifications {
  position: fixed;
  right: 20px;
  top: 20px;
  z-index: 20000;
}
.notifications ul li {
  display: -webkit-box;
  display: flex;
  background: white;
  border-radius: 5px;
  box-shadow: 0 0 10px #9da5be;
  overflow: hidden;
  width: 380px;
  margin-bottom: 10px;
  max-width: 85vw;
}
.notifications ul li figure {
  width: 80px;
  height: 80px;
  padding: 20px;
}
.notifications ul li figure img {
  width: 40px;
  height: 40px;
  -o-object-fit: contain;
  object-fit: contain;
}
.notifications ul li .notification {
  border-left: 1px solid #e7e8e9;
  padding: 10px 10px 10px 20px;
  -webkit-box-flex: 1;
  flex: 1;
}
.notifications ul li .notification header {
  display: -webkit-box;
  display: flex;
  margin-bottom: 5px;
}
.notifications ul li .notification header h3 {
  -webkit-box-flex: 1;
  flex: 1;
  color: #5093e1;
  font-weight: 300;
  font-size: 18px;
}
.notifications ul li .notification header .close-notification {
  color: #d1d7e9;
  text-decoration: none;
  cursor: pointer;
}
.notifications ul li .notification header .close-notification:hover {
  color: #474c58;
}
.notifications ul li .notification p {
  color: #9da5be;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 300;
}
.collector {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 1000;
  background: white;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(157, 165, 190, 0.2);
  width: 380px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  -webkit-transform: translate(0, 30%);
  transform: translate(0, 30%);
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .collector {
    max-width: 80%;
  }
}
.collector.visible {
  opacity: 1;
  pointer-events: all;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}
.collector .collection {
  display: -webkit-box;
  display: flex;
}
.collector .collection figure {
  width: 80px;
  height: 80px;
  padding: 20px;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .collector .collection figure {
    width: 60px;
    padding: 15px;
  }
}
.collector .collection figure .icon {
  font-size: 40px;
  color: #5093e1;
  text-align: center;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .collector .collection figure .icon {
    font-size: 28px;
  }
}
.collector .collection .collection-details {
  padding: 10px;
}
.collector footer {
  border-top: 1px solid #fbfbfb;
}
.collector footer ul {
  display: -webkit-box;
  display: flex;
}
.collector footer ul li {
  -webkit-box-flex: 1;
  flex: 1;
}
.collector footer ul li a {
  display: block;
  padding: 10px 5px 10px 5px;
  font-size: 12px;
  color: #2f323a;
  text-decoration: none;
  white-space: nowrap;
  outline: none;
  text-align: center;
}
.collector footer ul li a:hover {
  background: #f6f7fa;
}
.collector footer ul li a span.icon {
  display: inline-block;
  width: 15px;
  height: 15px;
  vertical-align: middle;
  font-size: 15px;
}
.collector footer ul li a span.icon[data-color="green"] {
  color: #50c14e;
}
.collector footer ul li a span.icon[data-color="orange"] {
  color: #f6a526;
}
.collector footer ul li a span.icon[data-color="red"] {
  color: #f65177;
}
.collector footer ul li a span.icon[data-color="blue"] {
  color: #5093e1;
}
.collector footer ul li a span.icon[data-color="yellow"] {
  color: #dfe150;
}
.collector footer ul li a span.icon[data-color="grey"] {
  color: #9da5be;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .collector .details-list {
    font-size: 14px;
  }
}
.collector .details-list.table {
  display: table;
}
.collector .details-list.table li {
  display: table-row;
}
.collector .details-list.table li span,
.collector .details-list.table li a {
  display: table-cell;
  margin-bottom: 5px;
  margin-left: 5px;
}
.collector .details-list.row-highlight li span,
.collector .details-list.row-highlight li a {
  margin-bottom: 10px;
}
.collector .details-list.margin-bottom {
  margin-bottom: 20px;
}
.collector .details-list.padding {
  padding-left: 20px;
}
.collector .details-list dt {
  line-height: 1.4;
  color: #9da5be;
  font-weight: 700;
}
.collector .details-list dd {
  line-height: 1.4;
  margin-bottom: 20px;
  color: #9da5be;
  font-weight: 300;
}
.collector .details-list li {
  line-height: 1.4;
  margin-bottom: 5px;
  color: #9da5be;
  font-weight: 300;
}
.collector .details-list li a {
  color: #9da5be;
}
.collector .details-list li a:hover {
  color: #5093e1;
}
.collector .details-list li span.highlight {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 3px;
  color: white;
}
.collector .details-list li span.highlight[data-color="green"] {
  background: #50c14e;
}
.collector .details-list li span.highlight[data-color="red"] {
  background: #f65177;
}
.collector .details-list li span.highlight[data-color="blue"] {
  background: #5093e1;
}
.collector .details-list li span.highlight[data-color="yellow"] {
  background: #dfe150;
}
.collector .details-list li span.highlight[data-color="orange"] {
  background: #f6a526;
}
.collector .details-list li span.highlight[data-color="grey"] {
  background: #9da5be;
}
.collector .details-list li span.highlight[data-color="white"] {
  background: white;
  color: #9da5be;
}
.collector .details-list li a.highlight {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 3px;
  color: white;
  text-decoration: none;
}
.collector .details-list li a.highlight[data-color="green"] {
  background: #50c14e;
}
.collector .details-list li a.highlight[data-color="red"] {
  background: #f65177;
}
.collector .details-list li a.highlight[data-color="blue"] {
  background: #5093e1;
}
.collector .details-list li a.highlight[data-color="yellow"] {
  background: #dfe150;
}
.collector .details-list li a.highlight[data-color="orange"] {
  background: #f6a526;
}
.collector .details-list li a.highlight[data-color="grey"] {
  background: #9da5be;
}
.collector .details-list li a.highlight[data-color="white"] {
  background: white;
  color: #9da5be;
}
.collector .details-list li a.highlight:hover[data-color="green"] {
  background: #3ba339;
}
.collector .details-list li a.highlight:hover[data-color="red"] {
  background: #f32151;
}
.collector .details-list li a.highlight:hover[data-color="blue"] {
  background: #2578d9;
}
.collector .details-list li a.highlight:hover[data-color="yellow"] {
  background: #d6d925;
}
.collector .details-list li a.highlight:hover[data-color="orange"] {
  background: #e08c09;
}
.collector .details-list li a.highlight:hover[data-color="grey"] {
  background: #7e89aa;
}
.collector .details-list li span.color {
  display: inline-block;
  width: 15px;
  height: 15px;
  border-radius: 15px;
  margin-right: 5px;
  background: black;
}
.collector .details-list li span.color[data-color="green"] {
  background: #50c14e;
}
.collector .details-list li span.color[data-color="red"] {
  background: #f65177;
}
.collector .details-list li span.color[data-color="blue"] {
  background: #5093e1;
}
.collector .details-list li span.color[data-color="yellow"] {
  background: #dfe150;
}
.collector .details-list li span.color[data-color="orange"] {
  background: #f6a526;
}
.collector .details-list li span.color[data-color="grey"] {
  background: #9da5be;
}
.slideout-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(157, 165, 190, 0.6);
  z-index: 1000;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.slideout-overlay.visible {
  opacity: 1;
  pointer-events: all;
}
.slideout {
  position: fixed;
  width: 350px;
  height: 100%;
  top: 0;
  right: 0;
  background: white;
  z-index: 1000;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  box-shadow: 0 0 0 rgba(71, 76, 88, 0);
  -webkit-transform: translate(100%, 0);
  transform: translate(100%, 0);
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .slideout {
    width: 100%;
  }
}
.slideout.visible {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}
.slideout header {
  height: 60px;
  padding: 0 30px;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  align-items: center;
  background: #2f323a;
}
.slideout header h4 {
  color: white;
  font-size: 18px;
  font-weight: 300;
}
.slideout header .close-slideout {
  color: #d1d7e9;
  font-size: 18px;
  text-decoration: none;
}
.slideout header .close-slideout:hover {
  color: white;
}
.slideout .slideout-content-wrapper {
  -webkit-box-flex: 1;
  flex: 1;
  overflow: auto;
}
.slideout .slideout-content.padding {
  padding: 20px 30px;
}
.slideout .slideout-content p.message {
  font-size: 14px;
  font-weight: 300;
  color: #474c58;
  line-height: 1.4;
}
.slideout .slideout-content p.message.margin-bottom {
  margin-bottom: 20px;
}
.slideout .slideout-content p.message.small-margin-bottom {
  margin-bottom: 10px;
}
.slideout .slideout-content h5 {
  color: #5093e1;
  font-weight: 300;
  line-height: 1.4;
}
.slideout .slideout-content h5.margin-bottom {
  margin-bottom: 20px;
}
.slideout .slideout-content h5.small-margin-bottom {
  margin-bottom: 10px;
}
.slideout .slideout-content ul.fields li {
  margin-bottom: 15px;
}
.slideout .slideout-content ul.fields li.hidden {
  display: none;
}
.slideout .button,
.slideout input[type="submit"] {
  background: #5093e1;
  padding: 0 20px;
  border-radius: 50px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  color: white;
  text-decoration: none;
  height: 36px;
  line-height: 36px;
  display: inline-block;
  outline: none;
  border: none;
  cursor: pointer;
}
.slideout .button.margin-bottom,
.slideout input[type="submit"].margin-bottom {
  margin-bottom: 20px;
}
.slideout .button:hover,
.slideout input[type="submit"]:hover {
  background: #474c58;
}
.selector-wrapper {
  padding: 0 20px;
}
.selector {
  position: relative;
}
.selector.margin-bottom {
  margin-bottom: 15px;
}
.selector input {
  height: 40px;
  border: 1px solid #d1d7e9;
  border-radius: 5px;
  width: 100%;
  outline: none;
  padding: 0 10px;
  font-size: 14px;
  color: #2f323a;
  background: none;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  font-weight: 300;
}
.selector input::-webkit-input-placeholder {
  color: #9da5be;
}
.selector input:-moz-placeholder {
  color: #9da5be;
}
.selector input::-moz-placeholder {
  color: #9da5be;
}
.selector input:-ms-input-placeholder {
  color: #9da5be;
}
.selector input:focus {
  border: 1px solid #9da5be;
}
.selector .selector-results {
  position: absolute;
  z-index: 100;
  width: 100%;
  background: white;
  box-shadow: 0 0 10px rgba(71, 76, 88, 0.2);
  top: 100%;
  border-radius: 5px;
  overflow: hidden;
  padding: 5px;
}
.selector .selector-results.hidden {
  display: none;
}
.selector .selector-results ul {
  max-height: calc(48px * 3);
  overflow: auto;
}
.selector .selector-results ul li.selected a {
  background: #f6f7fa;
}
.selector .selector-results ul li a {
  display: block;
  padding: 10px 20px 10px 5px;
  border-radius: 5px;
  font-size: 12px;
  color: #2f323a;
  text-decoration: none;
  white-space: nowrap;
  outline: none;
  cursor: pointer;
  line-height: 1.4;
}
.selector .selector-results ul li a:hover {
  background: #f6f7fa;
}
.selector .selector-results ul li a span.icon {
  display: inline-block;
  width: 15px;
  height: 15px;
  vertical-align: middle;
  margin-right: 10px;
  font-size: 15px;
}
.selector .selector-results ul li a span.icon[data-color="green"] {
  color: #50c14e;
}
.selector .selector-results ul li a span.icon[data-color="orange"] {
  color: #f6a526;
}
.selector .selector-results ul li a span.icon[data-color="red"] {
  color: #f65177;
}
.selector .selector-results ul li a span.icon[data-color="blue"] {
  color: #5093e1;
}
.selector .selector-results ul li a span.icon[data-color="yellow"] {
  color: #dfe150;
}
.selector .selector-results ul li a span.icon[data-color="grey"] {
  color: #9da5be;
}
* {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.card-group-wrapper {
  margin-bottom: 40px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .card-group-wrapper {
    margin-bottom: 10px;
  }
}
.card-group-wrapper.flex {
  display: -webkit-box;
  display: flex;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .card-group-wrapper.flex {
    display: block;
  }
}
@media only screen and (min-width: 720px) and (max-width: 959px) {
  .card-group-wrapper.flex.max-tablet {
    display: block;
  }
  .card-group-wrapper.flex.max-tablet .card {
    margin-bottom: 10px;
  }
}
.card-group-wrapper.flex .card {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  margin-bottom: 0;
  margin-right: 40px;
  -webkit-box-flex: 1;
  flex: 1;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .card-group-wrapper.flex .card {
    width: 100%;
    margin-right: 0;
    margin-bottom: 10px;
  }
}
.card-group-wrapper.flex .card:nth-last-of-type(1) {
  margin-right: 0;
}
.card-group-wrapper.flex .card .card-details {
  -webkit-box-flex: 1;
  flex: 1;
}
.card-group-wrapper.flex .card form.flex {
  -webkit-box-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
}
.chart-graph {
  background: white;
  overflow: hidden;
  border-radius: 5px;
  margin-bottom: 40px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .chart-graph {
    margin-bottom: 10px;
  }
}
.chart-graph header {
  border-bottom: 2px solid #fbfbfb;
}
.chart-graph header h4 {
  line-height: 60px;
  font-weight: 300;
  font-size: 24px;
  padding-left: 30px;
  color: #5093e1;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .chart-graph header h4 {
    font-size: 14px;
    padding-left: 20px;
    line-height: 40px;
  }
}
.chart-graph header h4 span {
  color: #9da5be;
  font-weight: 300;
}
.chart-graph .chart-wrapper {
  width: 100%;
  height: 250px;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .chart-graph .chart-wrapper {
    height: 150px;
  }
}
.chart-graph .chart-wrapper canvas {
  border-radius: 0 0 5px 5px;
}
.card-details .files-list li {
  margin-bottom: 10px;
  position: relative;
  white-space: nowrap;
}
.card-details .files-list li:hover .delete-file-trigger {
  opacity: 1;
}
.card-details .files-list li.header {
  padding-top: 10px;
}
.card-details .files-list li.header:first-child {
  padding-top: 0;
}
.card-details .files-list li.pending nav {
  display: none;
}
.card-details .files-list li.pending span.color {
  -webkit-animation: grow 1s infinite;
  animation: grow 1s infinite;
}
.card-details .files-list li .delete-file-trigger {
  opacity: 0;
  position: absolute;
  top: 0;
  left: -30px;
  width: 30px;
  height: 100%;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  text-decoration: none;
  color: #9da5be;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .card-details .files-list li .delete-file-trigger {
    position: static;
    opacity: 1;
    display: inline-block;
    vertical-align: middle;
    width: auto;
    padding: 5px 5px 0 0;
  }
}
.card-details .files-list li .delete-file-trigger:hover {
  color: #f65177;
}
.card-details .files-list li .flex {
  display: -webkit-inline-box;
  display: inline-flex;
  -webkit-box-align: center;
  align-items: center;
  text-decoration: none;
  vertical-align: top;
}
.card-details .files-list li .flex figure {
  display: inline-block;
  width: 25px;
  height: 25px;
  margin-right: 10px;
}
.card-details .files-list li .flex figure img {
  width: 25px;
  height: 25px;
  -o-object-fit: contain;
  object-fit: contain;
}
.card-details .files-list li .flex span {
  display: inline-block;
  color: #474c58;
}
.card-details .files-list li .flex span.color {
  display: inline-block;
  width: 15px;
  height: 15px;
  border-radius: 15px;
  margin-right: 5px;
  background: black;
}
.card-details .files-list li .flex span.color.small {
  width: 10px;
  height: 10px;
  border-radius: 10px;
}
.card-details .files-list li .flex span.color[data-color="green"] {
  background: #50c14e;
}
.card-details .files-list li .flex span.color[data-color="red"] {
  background: #f65177;
}
.card-details .files-list li .flex span.color[data-color="blue"] {
  background: #5093e1;
}
.card-details .files-list li .flex span.color[data-color="yellow"] {
  background: #dfe150;
}
.card-details .files-list li .flex span.color[data-color="orange"] {
  background: #f6a526;
}
.card-details .files-list li .flex span.color[data-color="grey"] {
  background: #9da5be;
}
.card-details .files-list li .flex span.color[data-color="white"] {
  background: white;
}
.card-details .files-list li a.flex:hover span {
  color: #5093e1;
}
.card-details.max-250 {
  max-height: 250px;
  overflow: auto;
}
.card-details.max-250.plus-60 {
  max-height: 310px;
}
.card.disabled {
  pointer-events: none;
  opacity: 0.5;
}
.card.full {
  width: 100%;
}
.card.full.visible {
  overflow: initial;
}
.stats-group {
  padding: 10px 30px;
  display: -webkit-box;
  display: flex;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .stats-group {
    flex-wrap: wrap;
    padding: 10px;
  }
}
.stats-group .stat {
  -webkit-box-flex: 1;
  flex: 1;
  text-align: center;
  padding: 20px 0;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .stats-group .stat {
    width: 50%;
    width: 33.3333333333%;
    -webkit-box-flex: 1;
    flex: auto;
    margin-bottom: 20px;
  }
  .stats-group .stat:nth-last-of-type(1),
  .stats-group .stat:nth-last-of-type(2),
  .stats-group .stat:nth-last-of-type(3) {
    margin-bottom: 0;
  }
}
.stats-group .stat h3 {
  font-size: 28px;
  font-weight: 300;
  color: #5093e1;
  margin-bottom: 5px;
}
.stats-group .stat p {
  font-size: 14px;
  color: #9da5be;
  font-weight: 300;
}
.stats-group a.stat {
  text-decoration: none;
  border-radius: 5px;
}
.stats-group a.stat:hover {
  background: #fbfbfb;
}
.standard-grey tbody tr td.icon-padding a {
  text-decoration: none;
  color: #9da5be;
}
.standard-grey tbody tr td.icon-padding a:hover {
  color: #2f323a;
}
.card .error-message {
  background: #f65177;
  padding: 20px;
  border-radius: 5px;
  text-align: center;
  color: white;
  font-weight: 300;
  display: none;
}
.card .meta-wrapper {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
}
.card .meta-wrapper .meta h1 {
  font-size: 20px;
  color: #474c58;
  font-weight: 700;
  margin-bottom: 5px;
}
.card .meta-wrapper .meta a {
  color: #474c58;
  text-decoration: none;
}
.card .meta-wrapper .meta a:hover {
  color: #9da5be;
}
.card .meta-wrapper .meta h2 {
  font-size: 18px;
}
/* "M66E — Men's E", under the occupant's name on /admin/year-seat/{id}, and
   a link into the map (see Seats\SeatMapLocator). Quiet on purpose: it is a
   fact about the record plus a way out of it, not an action competing with
   the status pill next to it. .is-unplaced is the same line without the
   anchor, for a chair that has no cell on the map yet -- it still tells you
   the seat number, which this page otherwise never showed. */
.card .meta-wrapper .meta .seat-locator {
  margin-top: 8px;
}
.card .meta-wrapper .meta .map-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #9da5be;
}
.card .meta-wrapper .meta a.map-link:hover {
  color: #474c58;
}
.card .meta-wrapper .meta .map-link .icon {
  font-size: 14px;
}
.card .meta-wrapper .status {
  position: relative;
}
.card .meta-wrapper .status.updating .statuses {
  top: 0;
  opacity: 1;
  pointer-events: all;
}
.card .meta-wrapper .status .open-change-status {
  display: inline-block;
  padding: 0 20px;
  height: 40px;
  line-height: 40px;
  border-radius: 25px;
  color: white;
  font-weight: 300;
  margin-bottom: 20px;
  font-size: 14px;
  text-transform: uppercase;
  font-weight: 600;
  text-decoration: none;
}
.card .meta-wrapper .status .open-change-status[data-color="green"] {
  background: #50c14e;
}
.card .meta-wrapper .status .open-change-status[data-color="red"] {
  background: #f65177;
}
.card .meta-wrapper .status .open-change-status[data-color="blue"] {
  background: #5093e1;
}
.card .meta-wrapper .status .open-change-status[data-color="yellow"] {
  background: #dfe150;
}
.card .meta-wrapper .status .open-change-status[data-color="orange"] {
  background: #f6a526;
}
.card .meta-wrapper .status .open-change-status[data-color="grey"] {
  background: #9da5be;
}
.card .meta-wrapper .status .open-change-status:hover[data-color="green"] {
  background: #3ba339;
}
.card .meta-wrapper .status .open-change-status:hover[data-color="red"] {
  background: #f32151;
}
.card .meta-wrapper .status .open-change-status:hover[data-color="blue"] {
  background: #2578d9;
}
.card .meta-wrapper .status .open-change-status:hover[data-color="yellow"] {
  background: #d6d925;
}
.card .meta-wrapper .status .open-change-status:hover[data-color="orange"] {
  background: #e08c09;
}
.card .meta-wrapper .status .open-change-status:hover[data-color="grey"] {
  background: #7e89aa;
}
.card .meta-wrapper .status .statuses {
  position: absolute;
  background: white;
  border-radius: 5px;
  padding: 5px;
  width: auto;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 2;
  box-shadow: 0 0 10px rgba(71, 76, 88, 0.2);
  opacity: 0;
  pointer-events: none;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
@media only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .card .meta-wrapper .status .statuses {
    left: initial;
    right: 0;
  }
}
.card .meta-wrapper .status .statuses li a {
  display: block;
  padding: 10px 20px 10px 5px;
  border-radius: 5px;
  font-size: 12px;
  color: #2f323a;
  text-decoration: none;
  white-space: nowrap;
}
.card .meta-wrapper .status .statuses li a:hover {
  background: #f6f7fa;
}
.card .meta-wrapper .status .statuses li a span.icon {
  display: inline-block;
  width: 15px;
  height: 15px;
  vertical-align: middle;
  margin-right: 10px;
  font-size: 15px;
}
.card .meta-wrapper .status .statuses li a span.icon[data-color="green"] {
  color: #50c14e;
}
.card .meta-wrapper .status .statuses li a span.icon[data-color="orange"] {
  color: #f6a526;
}
.card .meta-wrapper .status .statuses li a span.icon[data-color="red"] {
  color: #f65177;
}
.card .meta-wrapper .status .statuses li a span.icon[data-color="blue"] {
  color: #5093e1;
}
.card .meta-wrapper .status .statuses li a span.icon[data-color="yellow"] {
  color: #dfe150;
}
.card .meta-wrapper .status .statuses li a span.icon[data-color="grey"] {
  color: #9da5be;
}
.card .meta-wrapper .status .statuses li a span.color {
  display: inline-block;
  width: 15px;
  height: 15px;
  border-radius: 15px;
  background: black;
  vertical-align: middle;
  margin-right: 10px;
}
.card .meta-wrapper .status .statuses li a span.color[data-color="green"] {
  background: #50c14e;
}
.card .meta-wrapper .status .statuses li a span.color[data-color="orange"] {
  background: #f6a526;
}
.card .meta-wrapper .status .statuses li a span.color[data-color="red"] {
  background: #f65177;
}
.card .meta-wrapper .status .statuses li a span.color[data-color="blue"] {
  background: #5093e1;
}
.card .meta-wrapper .status .statuses li a span.color[data-color="yellow"] {
  background: #dfe150;
}
.card .meta-wrapper .status .statuses li a span.color[data-color="grey"] {
  background: #9da5be;
}
.setup-items {
  padding: 0 30px;
}
.setup-items.no-padding {
  padding: 0;
}
.setup-items .item {
  position: relative;
}
.setup-items .item.hidden {
  display: none;
}
.setup-items .item:hover .remove-item-trigger,
.setup-items .item:hover .add-item-before-trigger {
  opacity: 1;
}
.setup-items .item .remove-item-trigger {
  position: absolute;
  color: white;
  text-decoration: none;
  background: #e7e8e9;
  padding: 5px;
  font-size: 10px;
  border-radius: 50%;
  top: 5px;
  left: -30px;
  opacity: 0;
  border: 5px solid white;
  outline: none;
}
.setup-items .item .remove-item-trigger:hover {
  background: #f65177;
}
.setup-items .item .add-item-before-trigger {
  position: absolute;
  color: white;
  text-decoration: none;
  background: #e7e8e9;
  padding: 5px;
  font-size: 10px;
  border-radius: 50%;
  top: 5px;
  right: -30px;
  opacity: 0;
  border: 5px solid white;
  outline: none;
}
.setup-items .item .add-item-before-trigger:hover {
  background: #50c14e;
}
.setup-items .item .fields {
  -webkit-box-flex: 1;
  flex: 1;
}
.payments-table-wrapper .flex-wrapper {
  vertical-align: top;
}
.payments-table-wrapper .flex-wrapper .flex {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
}
.payments-table-wrapper .flex-wrapper figure {
  width: 25px;
  height: 25px;
  display: inline-block;
  margin-right: 10px;
  align-self: flex-start;
}
.payments-table-wrapper .flex-wrapper figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}
.payments-table-wrapper .flex-wrapper p {
  font-size: 14px;
  white-space: nowrap;
}
.payments-table-wrapper .flex-wrapper p span {
  font-size: 12px;
  display: block;
  color: #9da5be;
}
.card.add-payment .method.hidden {
  display: none;
}
.card.add-payment .qty-wrapper {
  display: inline-block;
  margin: 0 10px;
  position: relative;
}
.card.add-payment .qty-wrapper input {
  padding: 0 100px 0 15px;
  width: 170px;
  height: 36px;
  border-radius: 36px;
  border: 1px solid #e7e8e9;
  outline: none;
  font-family: "Open Sans", sans-serif;
  font-weight: 300;
}
.card.add-payment .qty-wrapper input:focus {
  border: 1px solid #5093e1;
}
.card.add-payment .qty-wrapper a {
  top: 0;
  position: absolute;
  right: 0;
}
.card.add-payment .mark-as-scheduled {
  display: inline-block;
  margin: 0 10px;
  position: relative;
}
.credit-card {
  position: relative;
}
.credit-card:not([data-type]) .icons .icon[data-type="card"] {
  display: block;
}
.credit-card[data-type="unknown"] .icons .icon[data-type="card"] {
  display: block;
}
.credit-card[data-type="jcb"] .icons .icon[data-type="jcb"] {
  display: block;
}
.credit-card[data-type="diners"] .icons .icon[data-type="diners"] {
  display: block;
}
.credit-card[data-type="discover"] .icons .icon[data-type="discover"] {
  display: block;
}
.credit-card[data-type="amex"] .icons .icon[data-type="amex"] {
  display: block;
}
.credit-card[data-type="mastercard"] .icons .icon[data-type="mastercard"] {
  display: block;
}
.credit-card[data-type="visa"] .icons .icon[data-type="visa"] {
  display: block;
}
.credit-card .icons {
  position: absolute;
  bottom: 0;
  right: 10px;
  width: 25px;
  height: 40px;
}
.credit-card .icons .icon {
  position: absolute;
  top: 50%;
  left: 0;
  width: 25px;
  height: 25px;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  display: none;
}
.credit-card .icons .icon img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}
.year-seat-outer-wrapper {
  display: -webkit-box;
  display: flex;
}
@media only screen and (min-width: 720px) and (max-width: 959px),
  only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .year-seat-outer-wrapper {
    display: block;
  }
}
.year-seat-outer-wrapper .year-seat-messages-wrapper {
  width: 350px;
  flex-shrink: 0;
  margin-right: 40px;
  position: relative;
}
@media only screen and (min-width: 720px) and (max-width: 959px),
  only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .year-seat-outer-wrapper .year-seat-messages-wrapper {
    width: 100%;
  }
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages-inner-wrapper {
  position: fixed;
  height: calc(100vh - 180px);
  width: 350px;
}
@media only screen and (min-width: 720px) and (max-width: 959px),
  only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .year-seat-outer-wrapper
    .year-seat-messages-wrapper
    .year-seat-messages-inner-wrapper {
    position: static;
    width: 100%;
    margin-bottom: 10px;
    height: auto;
  }
}
.year-seat-outer-wrapper .year-seat-messages-wrapper .year-seat-messages {
  background: white;
  border-radius: 5px;
  display: -webkit-box;
  display: flex;
  height: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
}
@media only screen and (min-width: 720px) and (max-width: 959px),
  only screen and (min-width: 521px) and (max-width: 719px),
  only screen and (max-width: 520px) {
  .year-seat-outer-wrapper .year-seat-messages-wrapper .year-seat-messages {
    display: block;
    height: auto;
    width: 100%;
  }
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  header {
  padding: 10px 20px;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  align-items: center;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  header
  .hide-year-seat-messages {
  text-decoration: none;
  color: #9da5be;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  header
  .hide-year-seat-messages:hover {
  color: #474c58;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .card-details {
  -webkit-box-flex: 1;
  flex: 1;
  padding: 10px;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  height: 0;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .messages-wrapper {
  height: 100%;
  overflow: auto;
  width: 100%;
  display: none;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .messages-wrapper.active {
  display: block;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .messages
  li {
  clear: both;
  float: left;
  width: 80%;
  margin-bottom: 10px;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .messages
  li.me {
  float: right;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .messages
  li.me
  p {
  background: rgba(80, 147, 225, 0.4);
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .messages
  li.me
  time {
  text-align: right;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .messages
  li
  p {
  background: rgba(157, 165, 190, 0.4);
  font-size: 14px;
  padding: 8px 10px;
  border-radius: 5px;
  font-weight: 300;
  margin-bottom: 3px;
  overflow-wrap: break-word;
  line-height: 1.3;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .messages
  li
  time {
  display: block;
  color: #8b96b9;
  font-size: 10px;
  font-weight: 300;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .messages
  .processing {
  float: right;
  text-align: right;
  display: none;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .messages
  .processing
  .dots {
  display: inline-block;
  padding: 10px;
  background: rgba(80, 147, 225, 0.4);
  border-radius: 5px;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .messages
  .processing
  .dots
  span {
  line-height: 16px;
  display: inline-block;
  height: 15px;
  width: 15px;
  margin: 0 5px;
  border-radius: 50%;
  background: white;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-name: message;
  animation-name: message;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .messages
  .processing
  .dots
  span:nth-of-type(2) {
  -webkit-animation-delay: 200ms;
  animation-delay: 200ms;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .messages
  .processing
  .dots
  span:nth-of-type(3) {
  -webkit-animation-delay: 400ms;
  animation-delay: 400ms;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  .fields
  li {
  margin: 10px 0;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  footer {
  height: auto;
  padding: 10px;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  footer
  select {
  width: 100%;
  display: block;
  height: 40px;
  border: 2px solid #e7e8e9;
  border-radius: 5px;
  width: 100%;
  outline: none;
  padding: 5px 10px;
  color: #2f323a;
  background: white;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  margin-bottom: 10px;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  footer
  textarea {
  width: 100%;
  height: 80px;
  resize: none;
  border: 2px solid #e7e8e9;
  border-radius: 5px;
  width: 100%;
  outline: none;
  padding: 5px 10px;
  font-size: 14px;
  color: #2f323a;
  background: none;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  font-weight: 300;
  background: white;
}
.year-seat-outer-wrapper
  .year-seat-messages-wrapper
  .year-seat-messages
  footer
  textarea:focus {
  border: 2px solid #5093e1;
}
.year-seat-outer-wrapper .year-seat-wrapper {
  width: 100%;
  overflow: hidden;
}
/*# sourceMappingURL=styles.css.map */
hr {
  border: 1px solid #e0e2e9;
}

/* new changes */
/* .total-pay div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid #e0e2e9;
} */

.select-years {
  display: flex;
  justify-content: left;
  align-items: center;
  padding: 20px 0;
  border-bottom: 1px solid #e0e2e9;
  margin: 0 0 20px 0;
}
.select-years span {
  margin-right: 10px;
}
.select-years select {
  width: 20%;
  height: 40px;
  border: 2px solid #e7e8e9;
  border-radius: 5px;
  outline: none;
  padding: 5px 10px;
  color: #2f323a;
  background: white;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
}
.select-years select {
  width: 20%;
  height: 40px;
  border: 2px solid #e7e8e9;
  border-radius: 5px;
  outline: none;
  padding: 5px 10px;
  color: #2f323a;
  background: white;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
}

/* new cart */
.cart-owner {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 20px 0;
  border-bottom: 1px solid #e0e2e9;
  margin: 0 0 20px 0;
}
.cart-owner div {
  min-height: 375px;
  margin: 3px;
}
.cart-owner div h1 {
  margin-bottom: 20px;
  font-size: 1.3rem;
}

.cart-owner .total-pay {
  padding-left: 5px;
  width: 28%;
}
.cart-owner .total-pay span {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  font-size: 1rem;
  border-bottom: 1px solid #e0e2e9;
}
/* previous season's leftover balance — red when still owed, green when overpaid */
.cart-owner .total-pay span.previous-year-balance h3 {
  font-weight: 600;
  text-align: right;
}
.cart-owner .total-pay span.previous-year-balance[data-state="owes"] h2,
.cart-owner .total-pay span.previous-year-balance[data-state="owes"] h3 {
  color: #f65177;
}
.cart-owner .total-pay span.previous-year-balance[data-state="credit"] h2,
.cart-owner .total-pay span.previous-year-balance[data-state="credit"] h3 {
  color: #50c14e;
}
/* list */
.cart-owner .list {
  width: 30%;
  border-right: 1px solid #e0e2e9;
}
.cart-owner .list h1 {
  margin-bottom: 20px;
}
.cart-owner .list ul {
  display: flex;
  flex-direction: column;
  list-style: none;
  padding: 0;
  margin: 0;
  max-height: 375px;
  overflow-y: auto;
  overflow-x: hidden;
}
.cart-owner .list ul::-webkit-scrollbar {
  width: 5px;
}
.cart-owner .list ul::-webkit-scrollbar-track {
  background: #f1f1f1;
}
.cart-owner .list ul::-webkit-scrollbar-thumb {
  background: #888;
}
.cart-owner .list ul::-webkit-scrollbar-thumb:hover {
  background: #555;
}
.cart-owner .list ul li {
  border-bottom: 1px solid #e0e2e9;
  display: flex;
  justify-content: space-between;
}
.cart-owner .list ul li:hover {
  background: #f5f5f5;
}
.cart-owner .list ul li.active {
  background: #f5f5f5;
}
.cart-owner .list ul li span:nth-child(1) {
  width: 70%;
}
.cart-owner .list ul li span:nth-child(2) {
  width: 30%;
}
.cart-owner .list ul li span {
  height: 100%;
  padding: 10px 3px;
  cursor: pointer;
}
/* cart */
.cart-owner .cart {
  width: 42%;
  padding-left: 15px;
  border-right: 1px solid #e0e2e9;
}
.cart-owner .cart h1 {
  margin-bottom: 20px;
}
.cart-owner .cart ul {
  list-style: none;
  padding: 0;
  margin: 0;
  max-height: 375px;
  overflow-y: auto;
  overflow-x: hidden;
}
.cart-owner .cart ul::-webkit-scrollbar {
  width: 5px;
}
.cart-owner .cart ul::-webkit-scrollbar-track {
  background: #f1f1f1;
}
.cart-owner .cart ul::-webkit-scrollbar-thumb {
  background: #888;
}
.cart-owner .cart ul::-webkit-scrollbar-thumb:hover {
  background: #555;
}

.cart-owner .cart ul li {
  display: grid;
  grid-template-columns: repeat(2, 1fr) 0.3fr;
  grid-template-rows: 0.7fr 1fr;
  grid-column-gap: 15px;
  grid-row-gap: 15px;

  width: 100%;
  padding-top: 5px;
  margin-bottom: 10px;
  border-bottom: 1px solid #e0e2e9;
}
.cart-owner .cart ul li span:nth-child(1) {
  grid-area: 1 / 1 / 2 / 2;
}
.cart-owner .cart ul li span:nth-child(2) {
  grid-area: 1 / 2 / 2 / 3;
}
.cart-owner .cart ul li span.delete {
  grid-area: 1 / 3 / 3 / 4;
}
.cart-owner .cart ul li span:last-child {
  grid-area: 2 / 1 / 3 / 3;
}

.cart-owner .cart ul li span:not(:last-child) {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.cart-owner .cart ul li span:nth-child(2) {
  justify-content: flex-end;
}

.cart-owner .cart ul li span.delete {
  justify-content: center;
}

.cart-owner .cart ul li span.note textarea {
  width: 100%;
  height: 100%;
  /* margin-top: -15px; */
  /* resize: none; */
  border: 2px solid #e7e8e9;
  border-radius: 5px;
  outline: none;
  /* padding: 5px 10px; */
  color: #2f323a;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  font-weight: 300;
  background: white;
}
.cart-owner .cart ul li span.note textarea:focus {
  border: 1px solid #9da5be;
}

.cart-owner .cart ul li .note textarea.required + span::after {
  content: " *";
  color: #f65177;
}
.cart-owner .cart ul li .note span {
  position: relative;
  top: -75px;
  left: 7px;
  font-size: 14px;
  background: white;
  color: #9da5be;
  font-weight: 300;
  pointer-events: none;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  max-width: calc(100% - 14px);
}

.cart-owner .cart ul li span input {
  width: 85%;
  height: 100%;
  border: 2px solid #e7e8e9;
  border-radius: 5px;
  outline: none;
  color: #2f323a;
  background: white;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
}
.cart-owner .cart ul li span input:focus {
  border: 2px solid #5093e1;
}
.cart-owner .cart ul li span input[type="number"]::-webkit-inner-spin-button,
.cart-owner .cart ul li span input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.cart-owner .cart ul li span input[type="number"] {
  -moz-appearance: textfield;
}
.cart-owner .cart .icon-cart {
  margin-right: 10px;
}
/* media query in 950px max  */
@media screen and (max-width: 950px) {
  .cart-owner {
    flex-direction: column;
    align-items: center;
  }
  .cart-owner div {
    width: 100%;
    margin-top: 20px;
  }
  .cart-owner .list {
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #e0e2e9;
  }
  .cart-owner .cart {
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #e0e2e9;
  }
  .cart-owner .total-pay {
    width: 100%;
  }
  .cart-owner .total-pay span {
    width: 100%;
  }
  .cart-owner .total-pay span:last-child {
    border-bottom: none;
  }
}
.clickable {
  cursor: pointer;
}

.BH {
  position: absolute;
  top: 15px;
  right: 10px;
  width: 20px;
  height: 20px;
  font-size: 0.8rem;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

/* titles-table */
.titles-table {
  margin-bottom: -10px;
}
.titles-table header {
  display: flex;
  flex-direction: row;
  padding: 10px 0 20px 20px;
  border-bottom: 1px solid #e0e2e9;
}
.titles-table header h4 {
  height: 55px;
  padding: 0 10px;
  text-align: center;
  margin: 0 5px;
  background: linear-gradient(to bottom, #f6f7fa 0%, #fff 100%);
  border-bottom: none;
  border-radius: 5px 5px 0 0;
  cursor: pointer;
}
.titles-table header h4.active {
  background: #edeff5;
  border-radius: 5px;
}
.titles-table header h4:hover {
  background: #edeff5;
  border-radius: 5px;
}
@media screen and (max-width: 950px) {
  .titles-table header h4 {
    height: 40px;
  }
}
.bold {
  font-weight: bold;
}

/* seat-map-arrange */
.arrange-tile {
  position: absolute;
  cursor: move;
}
/* Mirrors the customer-facing .room-boundary rule (public/views/seat-map.php)
   — a simple visual frame around the "Live now" reference panel's already-compacted
   layout, sized from its own real bounding box (referenceContentSize), not a precise
   floor plan. .reference-canvas is already position:relative via referenceCanvasStyle()
   in seat-map-arrange.js, so no extra positioning is needed here.
   inset:0 here, NOT the customer version's inset:-20px: the customer's .area-list
   sits in an auto-sized, overflow:auto, flex-centered container that has natural
   breathing room around it, so a -20px outward bleed just shows as extra margin.
   .reference-viewport here is a FIXED 300x300 box with overflow:hidden and no
   centering — .reference-canvas is top/left-anchored and its scaled width already
   matches the viewport's own width for width-constrained layouts. Verified live:
   with -20px, the top/left/right edges of the frame land outside the 300x300 box
   and get clipped away entirely, leaving only a fragment of the bottom edge
   visible — not "a bordered rectangle around the arrangement". inset:0 hugs the
   content's own bounding box exactly, so the full frame stays inside the clip. */
.room-boundary {
  position: absolute;
  inset: 0;
  border: 2px solid #cbd2e0;
  border-radius: 12px;
  pointer-events: none;
  z-index: -1;
}
.arrange-tile.selected {
  outline: 2px solid #2f5d8a;
  outline-offset: 2px;
}
/* Shared by both admin arranging tools (areas and blocks) — the shape
   itself is absolutely positioned to fill the tile (see the page's own
   .arrange-tile > div:first-child rule), so the label needs its own
   explicit positioning rather than relying on normal in-flow placement
   after it. Sits outside the shape, to the right, vertically centered —
   the shape's own silhouette is what conveys the area/block's footprint,
   so the name reads as an external caption rather than overlapping text. */
.arrange-tile-label {
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 8px;
  white-space: nowrap;
  font-size: 12px;
  color: #1f2430;
  pointer-events: none;
}
.arrange-tile-label.draggable-label {
  pointer-events: auto;
  cursor: move;
}
/* Mirrors .arrange-tile.selected's own outline treatment — a label being
   dragged previously had no persistent visual state at all (confirmed
   live: nothing distinguished "this label is selected/movable" from
   "just idle text"), unlike a tile's own clear selected-outline +
   nudge-arrow toolbar. Padding+background (not just an outline around
   bare text) so the frame reads as a real box around the label, not a
   thin line hugging the letterforms. */
.arrange-tile-label.draggable-label.selected {
  outline: 2px solid #2f5d8a;
  outline-offset: 2px;
  background: #fff;
  padding: 2px 4px;
  border-radius: 3px;
}
.save-bar { display: flex; align-items: center; gap: 10px; margin: 10px 0; }
.unsaved-indicator { color: #9a5b00; font-size: 13px; }
.arrange-btn { display: inline-block; padding: 6px 12px; border: 1px solid #cbd2e0; background: #f6f7fa; border-radius: 4px; cursor: pointer; font-size: 13px; color: #1f2430; text-decoration: none; }
.arrange-btn:hover { background: #edf1f7; border-color: #2f5d8a; }
.arrange-btn-primary { background: #2f5d8a; border-color: #2f5d8a; color: #fff; }
.arrange-btn-primary:hover { background: #244766; border-color: #244766; }
.arrange-toolbar { display: flex; align-items: center; gap: 8px; min-height: 32px; }
.arrange-toolbar-label { font-weight: 600; margin-right: 4px; color: #1f2430; }
.arrange-page-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.arrange-page-header h1 { margin: 0; }
.arrange-section-toggle { margin: 0; display: flex; gap: 8px; }
.add-popup-overlay { position: fixed; inset: 0; background: rgba(31,36,48,0.4); z-index: 1000; }
.add-popup { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1001; background: #fff; border-radius: 8px; box-shadow: 0 8px 30px rgba(0,0,0,0.2); width: 320px; max-height: 80vh; overflow-y: auto; }
.add-popup header { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid #dde1e8; }
.add-popup header h3 { margin: 0; font-size: 15px; }
.add-popup header a.close { cursor: pointer; color: #667085; font-size: 18px; text-decoration: none; }
.add-popup-content { padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.add-popup-tabs { display: flex; gap: 6px; margin: 0 0 6px; }
.add-popup-tabs a { flex: 1; text-align: center; padding: 6px 0; border: 1px solid #cbd2e0; border-radius: 4px; text-decoration: none; color: #1f2430; font-size: 13px; cursor: pointer; }
.add-popup-tabs a.active { background: #2f5d8a; border-color: #2f5d8a; color: #fff; }
.add-popup-content label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: #1f2430; }
.add-popup-content input[type="text"], .add-popup-content input[type="number"], .add-popup-content select { border: 1px solid #cbd2e0; border-radius: 4px; padding: 6px 8px; font-size: 13px; }
.add-popup-content input[type="checkbox"] { width: auto; }
.arrange-tile-empty { border: 1px dashed #cbd2e0; background: #f6f7fa; }
.arrange-toolbar-field { display: flex; align-items: center; gap: 4px; font-size: 12px; color: #1f2430; }
.arrange-btn-danger { border-color: #c0392b; color: #c0392b; }
.arrange-btn-danger:hover { background: #fdecea; }
.arrange-page-actions { display: flex; gap: 8px; margin-bottom: 10px; }
.arrange-advanced { margin-top: 14px; padding-top: 10px; border-top: 1px solid #dde1e8; }
.arrange-advanced summary { cursor: pointer; font-size: 12px; color: #667085; text-transform: uppercase; letter-spacing: 0.03em; }

/* ---------------------------------------------------------------- logs page */
.logs .log-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 15px;
}
.logs .log-filters label {
  display: flex;
  flex-direction: column;
}
.logs .log-filters label span {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #667085;
  margin-bottom: 5px;
}
.logs .log-filters select {
  height: 40px;
  min-width: 130px;
  border: 2px solid #e7e8e9;
  border-radius: 5px;
  outline: none;
  padding: 5px 10px;
  color: #2f323a;
  background: white;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
}
.logs .log-filters input[type="submit"] {
  height: 40px;
  padding: 0 20px;
  border: 0;
  border-radius: 5px;
  background: #5093e1;
  color: white;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  cursor: pointer;
}
.logs .log-filters input[type="submit"]:hover {
  background: #3f7bc0;
}
.logs .log-filters .download-log {
  height: 40px;
  display: inline-flex;
  align-items: center;
  color: #5093e1;
  text-decoration: none;
  font-size: 14px;
}
.logs .log-filters .download-log .icon-download {
  margin-right: 6px;
}
.logs .log-path {
  margin-top: 15px;
  font-size: 12px;
  color: #667085;
  line-height: 1.6;
}
.logs .log-path code {
  font-family: Menlo, Consolas, monospace;
  background: #f4f5f7;
  border-radius: 3px;
  padding: 2px 5px;
  word-break: break-all;
}
.logs .logs-table .log-date {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.logs .logs-table .log-message {
  max-width: 620px;
}
.logs .logs-table .log-message p {
  word-break: break-word;
}
.logs .logs-table .log-message details {
  margin-top: 6px;
}
.logs .logs-table .log-message summary {
  cursor: pointer;
  font-size: 12px;
  color: #667085;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.logs .logs-table .log-trace {
  margin-top: 6px;
  padding: 10px;
  background: #f4f5f7;
  border-radius: 3px;
  font-family: Menlo, Consolas, monospace;
  font-size: 11px;
  line-height: 1.6;
  white-space: pre-wrap;
  word-break: break-all;
}
.logs .logs-table .log-where p,
.logs .logs-table .log-request p {
  word-break: break-all;
}

/* ── Seats: chairs that are not for sale ───────────────────────────────
   /admin/seats used to mark these with grey small print under the seat
   number, which nobody found while scanning a page of hundreds of rows.
   The state now reads as a red badge on its own line, and the row itself
   is dimmed so a block of retired chairs is visible at a glance without
   reading any of them. Markup is rendered by views/admin/seats.php and
   re-inserted live by applySeatActive() in admins/functions.min.js —
   keep the three in step. */
.standard-grey tbody tr td span.highlight.not-for-sale-badge {
  display: inline-block;
  margin-top: 4px;
  padding: 2px 7px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.2px;
  white-space: nowrap;
}
/* Muted, not struck through or greyed to unreadable: an admin still has to
   read the owner and seat name on these rows to decide anything about them.
   Done with `color` on the text nodes rather than `opacity` on the row —
   opacity composites the whole subtree, which would drag the badge and the
   Actions menu down with it and leave no way to lift them back out. */
.standard-grey tbody tr.seat.is-not-for-sale td p {
  color: #a7adbd;
}

/* ── Clickable rows ────────────────────────────────────────────────────
   Rows that open their record on click, marked by the two opt-in attributes
   admins/clickable-rows.js reads: data-row-href on a row that navigates,
   data-row-open on a table whose rows open a modal. The hover fill is the
   same #e7e8e9 the older .link-row rows use, so a list does not change
   colour depending on which mechanism opens it. Keep these selectors and
   that script's in step: a row that highlights and shows a pointer has to
   actually open something, and vice versa. */
.standard-grey tbody tr[data-row-href],
.standard-grey[data-row-open] tbody tr {
  cursor: pointer;
}
.standard-grey tbody tr[data-row-href]:hover td,
.standard-grey[data-row-open] tbody tr:hover td {
  background: #e7e8e9;
}
.standard-grey tbody tr[data-row-href]:hover td .colors-group span.color,
.standard-grey[data-row-open] tbody tr:hover td .colors-group span.color {
  border: 2px solid #e7e8e9;
}
/* The cells the row must not swallow: the Actions dropdown and the
   select-row checkbox keep their own cursor so it stays obvious they are
   separate targets. */
.standard-grey tbody tr[data-row-href] td.menu-wrapper,
.standard-grey[data-row-open] tbody tr td.menu-wrapper,
.standard-grey tbody tr[data-row-href] td.icon,
.standard-grey[data-row-open] tbody tr td.icon {
  cursor: default;
}

/* ---------------------------------------------------------------------------
   Sidebar submenus
   ---------------------------------------------------------------------------
   Appended, not compiled from styles.scss -- this file is ahead of the SCSS
   and recompiling over it would drop everything added since it was last built
   (see CLAUDE.md).

   Used by the Emails group in views/templates/admin-index.php. A parent <li>
   carries .has-submenu, and .open when it should be expanded; the server adds
   .open when the current page is one of the children, so the submenu is never
   hiding the page you are on.
   --------------------------------------------------------------------------- */

aside.sidebar ul li.has-submenu > a.submenu-toggle {
  position: relative;
  cursor: pointer;
}

/* the chevron, drawn rather than iconed: the icon font here has no caret and
   a rotated border is one rule instead of a new glyph */
aside.sidebar ul li.has-submenu > a.submenu-toggle .submenu-arrow {
  position: absolute;
  right: 16px;
  top: 50%;
  width: 6px;
  height: 6px;
  margin-top: -4px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform 0.15s ease;
  opacity: 0.7;
}

aside.sidebar ul li.has-submenu.open > a.submenu-toggle .submenu-arrow {
  transform: rotate(-135deg);
}

aside.sidebar ul li.has-submenu > ul.submenu {
  display: none;
  margin: 6px 0 0 0;
  padding: 0;
  list-style: none;
}

aside.sidebar ul li.has-submenu.open > ul.submenu {
  display: block;
}

aside.sidebar ul li.has-submenu > ul.submenu > li {
  margin-bottom: 4px;
}

/* Indented from the parent, and carrying an icon of its own -- so the child
   icons sit in their own column just right of the parent icons rather than
   lining up with them, which is what makes the nesting read at a glance. */
aside.sidebar ul li.has-submenu > ul.submenu > li > a {
  padding: 8px 10px 8px 26px;
  font-size: 13px;
}

aside.sidebar ul li.has-submenu > ul.submenu > li > a i {
  font-size: 13px;
  opacity: 0.85;
}

aside.sidebar ul li.has-submenu > ul.submenu > li > a span {
  margin-left: 14px;
}

/* Collapsed sidebar: labels are hidden and there is no room to indent, so the
   submenu is always shown and the parent's chevron goes away. Without this the
   three email pages would be unreachable whenever the sidebar is collapsed. */
body.sidebar-collapsed aside.sidebar ul li.has-submenu > ul.submenu {
  display: block;
}

body.sidebar-collapsed aside.sidebar ul li.has-submenu > a.submenu-toggle .submenu-arrow {
  display: none;
}

body.sidebar-collapsed aside.sidebar ul li.has-submenu > ul.submenu > li > a {
  padding-left: 10px;
}

/* ---------------------------------------------------------------------------
   Dashboard stats on a phone
   ---------------------------------------------------------------------------
   The tiles were three-to-a-row below 720px while the figure inside stayed at
   28px. "$421,985.56" is eleven characters; in a third of a 375px screen that
   is about 118px of column holding about 190px of text, so each amount ran
   straight over the one beside it and over the "Pending" label underneath.

   Two to a row and a smaller figure. The count and the amount are left to wrap
   on their own -- they must NOT be forced onto separate lines, because the
   markup is `(<span>221</span>) <span>$192,027.75</span>` and making the spans
   block-level would strand the brackets on lines of their own.
   --------------------------------------------------------------------------- */

/* Wrap at every width, not just on a phone. The row is seven tiles with
   flex:1 and nothing stopping them shrinking, so the overlap is not a
   mobile bug -- it is just most obvious there. A browser window of about
   800px gives each tile some 90px to hold "$192,027.47" at 28px, and the
   figures ran over each other on the desktop too. A flex-basis lets them
   sit on one row when there is room and wrap when there is not. */
.stats-group {
  flex-wrap: wrap;
  /* a part-filled last row reads as deliberate rather than left over */
  justify-content: center;
}

.stats-group .stat {
  -webkit-box-flex: 1;
  flex: 1 1 165px;
  /* 165px, not less: "$192,027.47" at the 28px below measures about
     157px, and at a 150px floor the two money tiles were still touching
     at 1024px -- by two pixels, but touching. */
  min-width: 165px;
  /* Without a cap the odd tile left on the last row grows to fill it:
     seven tiles on a 1600px screen wrapped 6 + 1, and that one was
     1195px wide with "Partial Paid Seats" marooned in the middle of it. */
  max-width: 33%;
}

@media only screen and (max-width: 719px) {
  /* min-width is cleared here or it would fight the 50% below and force
     one tile per row on a 375px screen */
  .stats-group .stat {
    width: 50%;
    -webkit-box-flex: 0;
    flex: 0 0 50%;
    min-width: 0;
    max-width: none;
  }

  .stats-group .stat h3 {
    font-size: 22px;
    line-height: 1.25;
    /* last resort: a figure wider than its column wraps inside it rather than
       spilling over the tile next door */
    word-wrap: break-word;
    overflow-wrap: break-word;
  }

  .stats-group .stat p {
    font-size: 13px;
  }
}

/* the narrow end of the range -- iPhone SE and similar */
@media only screen and (max-width: 400px) {
  .stats-group .stat h3 {
    font-size: 19px;
  }
}

/* ---------------------------------------------------------------------------
   Admin header below 720px
   ---------------------------------------------------------------------------
   Three faults, one cause. The header carries two menu buttons: `.open-sidebar`
   (the drawer toggle, shown only on small screens) and `.collapse-sidebar-btn`
   (the ☰ that narrows the 250px rail to 60px on a desktop). Nothing ever hid
   the second one, so below 720px:

     - both were drawn, one over the other, which is the "duplicate" button;
     - `.collapse-sidebar-btn` is inline-block and therefore IN the flow, so it
       took a line of its own and pushed the <h1> down out of the 50px header
       -- the title sat below the bar instead of in it;
     - and it painted on top of `.open-sidebar`, so a tap landed on the collapse
       button and toggled a class that means nothing when the sidebar is a
       drawer. That is why the menu would not open.

   Hiding it below 720px fixes all three: collapsing a rail that is already a
   slide-in drawer is not a thing anyone can want.
   --------------------------------------------------------------------------- */

@media only screen and (max-width: 719px) {
  .collapse-sidebar-btn {
    display: none;
  }

  /* Centre the title in the space actually left over -- between the drawer
     button on the left and the ב"ה on the right -- rather than across the whole
     bar, where a long page name runs under one or the other. */
  header.main h1 {
    padding-left: 52px;
    padding-right: 34px;
    line-height: 1.4;
  }

  /* `sidebar-collapsed` is remembered in localStorage and re-applied on every
     page, whatever the screen. On a phone it would open the drawer with every
     label hidden and the logo gone, because those rules do not ask how wide the
     screen is. The drawer is not the collapsed rail, so undo the lot of it. */
  body.sidebar-collapsed aside.sidebar {
    width: 70%;
  }

  body.sidebar-collapsed aside.sidebar h1 span,
  body.sidebar-collapsed aside.sidebar nav span,
  body.sidebar-collapsed aside.sidebar footer span {
    display: inline;
  }

  body.sidebar-collapsed aside.sidebar h1 a img {
    display: inline-block;
  }

  body.sidebar-collapsed .container {
    width: 100%;
    margin-left: 0;
  }

  /* the submenus follow the same reasoning: on a phone they are ordinary
     nested lists again, open or shut on their own */
  body.sidebar-collapsed aside.sidebar ul li.has-submenu > ul.submenu {
    display: none;
  }

  body.sidebar-collapsed aside.sidebar ul li.has-submenu.open > ul.submenu {
    display: block;
  }

  body.sidebar-collapsed aside.sidebar ul li.has-submenu > a.submenu-toggle .submenu-arrow {
    display: block;
  }

  body.sidebar-collapsed aside.sidebar ul li.has-submenu > ul.submenu > li > a {
    padding-left: 26px;
  }
}

/* ── Year seat page: the Actions menu in the record header ─────────────
   /admin/year-seat/{id} had no way to reach the things the year-seats list
   offers on every row -- changing the owner meant going back to the list and
   finding the seat again. The menu is YearSeat::buttons('page'); the handlers
   are in js/admin/newJS/year-seat.js.

   The panel's other Actions menus are inside a table cell and positioned by
   hand in JS (see .open-seat-menu and friends), because a <td> is not a
   positioning context. This one sits in the card header next to the status
   pill, so it is placed in CSS and needs no JS for it. */
.card .meta-wrapper .meta-actions {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: start;
  align-items: flex-start;
}
.card .meta-wrapper .meta-actions .year-seat-actions {
  position: relative;
  margin-left: 15px;
}
.card .meta-wrapper .year-seat-actions .open-menu {
  display: block;
  padding: 5px 0 5px 5px;
  font-size: 16px;
  color: #9da5be;
  text-decoration: none;
  outline: none;
}
.card .meta-wrapper .year-seat-actions .open-menu:hover {
  color: #474c58;
}
.card .meta-wrapper .year-seat-actions .menu {
  position: absolute;
  top: 100%;
  right: 0;
  background: white;
  border-radius: 5px;
  padding: 5px;
  width: auto;
  z-index: 2;
  box-shadow: 0 0 10px rgba(71, 76, 88, 0.2);
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out;
}
.card .meta-wrapper .year-seat-actions.opened .menu {
  opacity: 1;
  pointer-events: all;
}
.card .meta-wrapper .year-seat-actions .menu li a {
  display: block;
  padding: 10px 20px 10px 5px;
  border-radius: 5px;
  font-size: 12px;
  color: #2f323a;
  text-decoration: none;
  white-space: nowrap;
  outline: none;
}
.card .meta-wrapper .year-seat-actions .menu li a:hover {
  background: #f6f7fa;
  color: #2f323a;
}
.card .meta-wrapper .year-seat-actions .menu li a span.icon {
  display: inline-block;
  width: 15px;
  height: 15px;
  vertical-align: middle;
  margin-right: 10px;
  font-size: 15px;
}
.card .meta-wrapper .year-seat-actions .menu li a span.icon[data-color="green"] {
  color: #50c14e;
}
.card .meta-wrapper .year-seat-actions .menu li a span.icon[data-color="orange"] {
  color: #f6a526;
}
.card .meta-wrapper .year-seat-actions .menu li a span.icon[data-color="red"] {
  color: #f65177;
}
.card .meta-wrapper .year-seat-actions .menu li a span.icon[data-color="blue"] {
  color: #5093e1;
}
.card .meta-wrapper .year-seat-actions .menu li a span.icon[data-color="yellow"] {
  color: #dfe150;
}
.card .meta-wrapper .year-seat-actions .menu li a span.icon[data-color="grey"] {
  color: #9da5be;
}
/* Same red badge /admin/seats puts on a retired chair's row, on the seat
   locator line here. The table's own rule is scoped to a <td>. */
.card .meta-wrapper .meta .seat-locator span.highlight.not-for-sale-badge {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 7px;
  border-radius: 3px;
  background: #f65177;
  color: white;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.2px;
  white-space: nowrap;
  vertical-align: middle;
}

/* ---------------------------------------------------------------------------
   Bulk actions bar
   ---------------------------------------------------------------------------
   Appended, not compiled from styles.scss -- this file is ahead of the SCSS
   and recompiling over it would drop everything added since it was last built
   (see CLAUDE.md).

   The bar sits between a list's filters and its table, written by the view
   immediately before the <table> it acts on, and is shown by
   admins/bulk-payments.js only while rows are selected. It is hidden rather
   than disabled when nothing is chosen: an always-present Delete button above
   a table of payments is an invitation nobody needs.

   The select column itself needs no rules -- it reuses th.icon / td.icon and
   tr.selected td.icon .active-blue, which the table styles already carry for
   /admin/year-seats.
   --------------------------------------------------------------------------- */

.bulk-actions {
  display: none;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 10px;
  padding: 10px 16px;
  border: 2px solid #e7e8e9;
  border-radius: 5px;
  background: #f7f8fa;
}

.bulk-actions.visible {
  display: flex;
}

.bulk-actions .bulk-actions-count {
  margin: 0;
  color: #474c58;
  font-size: 13px;
}

.bulk-actions .bulk-actions-count span {
  font-weight: 700;
}

.bulk-actions .bulk-actions-buttons {
  display: flex;
  align-items: center;
  gap: 8px;
}

.bulk-actions .bulk-actions-buttons a {
  height: 34px;
  line-height: 30px;
  padding: 0 16px;
  border: 2px solid #e7e8e9;
  border-radius: 5px;
  background: white;
  font-family: "Open Sans", sans-serif;
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  text-decoration: none;
  color: #5093e1;
  cursor: pointer;
}

.bulk-actions .bulk-actions-buttons a:hover {
  border-color: #5093e1;
}

/* The one destructive action in the bar wears the same red the row menu's
   Delete does, so it is not a click away from looking like Clear. */
.bulk-actions .bulk-actions-buttons a[data-color="red"] {
  color: #f65177;
}

.bulk-actions .bulk-actions-buttons a[data-color="red"]:hover {
  border-color: #f65177;
  background: #f65177;
  color: white;
}

/* A selected row keeps its fill while the pointer is elsewhere -- the tick
   turning blue is easy to lose in a long list, and the hover rule for
   data-row-open rows would otherwise be the only feedback. It is written
   after those rules so it wins on a hovered row too. */
.standard-grey tbody tr.payment.selected td {
  background: #eaf2fc;
}