@page {
  size: landscape;
}
html,
body {
  background: transparent none no-repeat;
  font-family: 'Nunito Variable', sans-serif;
  margin: 0;
  padding: 0;
  font-size: 16px;
  color: var(--text-color);
  line-height: 2;
  position: relative;
}
p,
p > span,
label,
.span,
.p,
textarea,
li {
  font-size: inherit;
  margin: 14px 0 0 0;
  color: var(--text-color);
}
span {
  font-size: inherit;
  color: inherit;
}
h1,
.h1 {
  font-size: 24px;
  font-weight: 600;
  margin: 22px 0 0;
  color: var(--text-color);
}
h2,
.h2 {
  font-size: 20px;
  font-weight: 400;
  color: var(--text-color);
  margin: 20px 0 0;
}
h3,
h3 > span,
.h3 {
  font-size: 18px;
  font-weight: 400;
  color: var(--text-color);
  margin: 18px 0 0;
}
h4,
h4 > span,
.h4 {
  font-size: 14px;
  font-weight: 800;
  color: var(--text-color);
  margin: 14px 0 6px;
}
h5,
h5 > span,
.h5 {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-color);
  margin: 12px 0 4px;
}
label {
  line-height: 28px;
}
label span {
  user-select: none;
}
label.ui-button.editable {
  border-color: #aaf;
}
label.ui-button.droppable {
  background: #dfd;
}
label.ui-button.drophover {
  background: #fff;
}
a,
.link {
  text-decoration: none;
  line-height: inherit;
  cursor: pointer;
  outline: none;
  font-size: inherit;
  border-bottom: 1px solid var(--link-underline-color);
  color: inherit;
}
a:hover,
.link:hover {
  border-bottom: 1px solid var(--text-color-editable);
  color: var(--text-color-editable);
}
a.ui-corner-all,
.link.ui-corner-all {
  border-bottom: none;
}
a img,
.link img {
  border: none;
  outline: none;
}
h1 a,
h2 a,
h3 a,
h4 a {
  color: inherit;
  font-size: inherit;
}
table {
  background-color: transparent;
  margin: 0;
}
th {
  background-color: transparent;
  font-weight: bold;
  text-align: left;
}
fieldset {
  border-style: none;
  margin: 0;
  padding: 0;
}
code {
  margin: 0;
  padding: 0;
  display: inline;
  font-size: 14px;
  line-height: 14px;
  color: var(--text-color-editable);
  font-family: var(--monospace-font);
}
hr {
  clear: both;
  width: 100%;
}
hr.notContent {
  width: 100%;
}
div.hr {
  margin: 3rem 0;
  border-top: 1px solid #c0c0c0;
}
div.ui-widget-overlay {
  position: fixed;
}
button {
  padding: 0 6px;
  cursor: pointer;
}
button.block {
  display: block;
  margin: 5px 0;
}
input.inPlaceEditor {
  border: 1px dotted #bbb;
}
input.search {
  width: 180px;
  font-size: 12px;
  color: var(--text-color);
  padding: 3px 5px;
  margin: 0;
  border: 1px dotted #776;
}
input.search:first-child {
  opacity: 0.5;
}
.dropdown.editable {
  cursor: pointer !important;
  user-select: none;
}
.dropdown.editable ul {
  display: none;
  position: absolute;
  border: inherit;
  border-radius: inherit;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  padding: 0;
  background-color: #fff;
  z-index: 1;
}
.dropdown.editable ul li {
  list-style: none;
  line-height: 1;
  padding: 0.5em 1em;
  margin: 0;
  cursor: pointer;
}
.dropdown.editable ul li:first-child {
  padding-top: 0.75em;
}
.dropdown.editable ul li:last-child {
  padding-bottom: 0.7em;
}
.dropdown.editable ul li:before {
  content: none !important;
}
.dropdown.editable ul li:hover {
  background-color: #e9ecef;
}
.dropdown.editable ul li.selected {
  background-color: #e9ecef;
  cursor: default;
}
.dropdown.editable i {
  display: none;
}
.dropdown.editable:focus,
.dropdown.editable.active {
  border: 1px solid #eee;
  padding-right: 0.5em;
  padding-left: 0.5em;
  border-radius: var(--form-border-radius, 0.5rem);
}
.dropdown.editable:focus i,
.dropdown.editable.active i {
  display: inline;
  margin-left: 1em;
}
.dropdown:focus {
  opacity: 1;
}
.dropdown:focus ul {
  display: block;
}
pre {
  background-color: #ccc;
  padding: 1rem;
}
.monospace {
  font-family: var(--monospace-font);
}
blockquote {
  margin: 1.5rem 0 !important;
  padding-left: 1.3rem;
  padding-right: 1.3rem;
  border-left: solid 3px var(--text-color);
}
blockquote > * {
  margin: -0.25em 0 -0.25em 1rem !important;
  font-style: normal;
  font-size: 1.3em;
  line-height: 1.62;
}
.dialog-box {
  --dialogFontFamily: 'Nunito Variable', sans-serif;
}
@media print {
  .noPrint {
    display: none;
  }
}
.fullWidth {
  width: 100%;
}
.grey,
.optional,
.ui-widget label.grey {
  color: #999;
}
.dashed {
  border: 1px dashed #999;
}
.border {
  border: 1px solid #ddd;
}
.hide {
  display: none;
}
.error,
span.error {
  font-size: 18px;
  color: #f00;
  text-shadow: 0 0 10px #fff;
}
.success,
span.success {
  font-size: 20px;
  color: #008066;
  text-shadow: 0 0 10px #fff;
}
.client {
  color: var(--client-color);
}
.subconsultant {
  color: var(--subconsultant-color);
}
.small,
span.small {
  font-size: 0.8rem !important;
  font-weight: normal;
}
.centre {
  text-align: center !important;
}
.clear {
  clear: both;
  height: 0;
  display: block;
}
.alignRight {
  text-align: right;
}
.alignCenter {
  text-align: center;
}
.highlight {
  border: 1px solid #f00;
  padding: 0 3px 0 3px;
}
.btn-xxs.btn-outline-danger {
  opacity: 0.4;
}
.btn-xxs.btn-outline-danger:hover {
  opacity: 1;
}
img.border {
  border: 2px solid var(--text-color);
}
img.sortIcon {
  width: 10px;
  cursor: pointer;
}
img.sortIcon.disabled {
  cursor: auto;
  opacity: 0.3;
}
.inherit {
  font-size: inherit;
  color: inherit;
  font-weight: inherit;
  display: inherit;
  border: inherit;
}
.invisible {
  visibility: hidden;
}
img[align=left] {
  margin: 0 20px 0 0;
}
img[align=right] {
  margin: 0 0 0 20px;
}
img[style~="left;"],
img.left {
  float: left;
  margin: 0 20px 0 0;
}
img[style~="right;"],
img.right {
  float: right;
  margin: 0 0 0 20px;
}
span.fa-question-circle {
  font-size: 14px;
  vertical-align: middle;
  cursor: pointer;
}
span.fa-question-circle:hover {
  opacity: 0.8;
}
.errorMessage {
  padding: 10px;
  border: 1px solid #ebccd1;
  color: #a94442;
  background-color: #f2dede;
  border-radius: 5px;
  margin: 20px 0 0 0;
}
.warningMessage {
  padding: 10px;
  border: 1px solid #faebcc;
  color: #8a6d3b;
  background-color: #fcf8e3;
  border-radius: 5px;
  margin: 20px 0 0 0;
}
#pageContainer {
  position: relative;
  padding: var(--page-padding-y) 0 var(--page-padding-y) var(--page-padding-x);
  width: var(--page-content-width);
}
body#support section#billing > main .invoices,
header.appHeader {
  position: relative;
  color: var(--text-color);
}
body#support section#billing > main .invoices .headingRow,
header.appHeader .headingRow {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  margin: calc(var(--page-padding-y) * -1) 0 calc(var(--page-padding-y) * -1) calc(var(--page-padding-x) * -1);
}
body#support section#billing > main .invoices .headingRow > *,
header.appHeader .headingRow > * {
  margin: var(--page-padding-y) var(--page-padding-x);
}
body#support section#billing > main .invoices .headingRow > *:last-child,
header.appHeader .headingRow > *:last-child {
  margin-right: 0 /* allow space for scrollbar - avoid horizontal overflow  */;
}
body#support section#billing > main .invoices .headingRow > h1,
header.appHeader .headingRow > h1 {
  flex: 1;
  font-size: var(--page-heading-h1-size) !important;
  font-weight: var(--page-heading-h1-weight);
  max-width: calc(100% - 6rem) /* keep close button on the same line for mobile */;
}
body#support section#billing > main .invoices .headingRow > h1 .app-icon,
header.appHeader .headingRow > h1 .app-icon {
  font-size: var(--page-heading-app-icon-size);
  height: var(--page-heading-app-icon-size);
  vertical-align: middle;
  opacity: 0.75 /* hack to make black images have same text color */;
  margin: -0.25rem 0.5rem 0 0;
}
body#support section#billing > main .invoices .headingRow > h1 i.app-icon,
header.appHeader .headingRow > h1 i.app-icon {
  opacity: 1;
  vertical-align: inherit;
}
body#support section#billing > main .invoices .headingRow > h1 a .app-icon,
header.appHeader .headingRow > h1 a .app-icon {
  opacity: 1;
}
body#support section#billing > main .invoices .headingRow > h1 a .app-icon i,
header.appHeader .headingRow > h1 a .app-icon i {
  opacity: 1;
}
body#support section#billing > main .invoices .headingRow a,
header.appHeader .headingRow a {
  opacity: 0.74;
  color: #001 !important;
  border-bottom: 1px dotted #bbc !important;
  text-shadow: 0.2rem 0.2rem 0.4rem #ccc;
}
body#support section#billing > main .invoices .headingRow a:hover,
header.appHeader .headingRow a:hover {
  opacity: 1;
  text-shadow: none;
  border-bottom: none;
}
body#support section#billing > main .invoices .headingRow .searchBar,
header.appHeader .headingRow .searchBar {
  display: inline-block;
  max-width: calc(100% - 6rem);
}
body#support section#billing > main .invoices .backButtonTop,
header.appHeader .backButtonTop {
  height: 36px;
  padding: 4px;
  opacity: 0.75;
  cursor: pointer;
  fill: #666;
  filter: var(--filter-drop-shadow);
}
body#support section#billing > main .invoices .backButtonTop:hover,
header.appHeader .backButtonTop:hover {
  opacity: 1;
  filter: none;
}
.searchButton {
  display: none;
}
#serverMessageWindow {
  position: fixed;
  top: 150px;
  right: 400px;
  z-index: 30;
}
#mainContentContainer {
  position: relative;
  width: 100%;
  margin: 0 0 1em 0;
  min-height: 300px;
}
#mainContentContainer h1.heading {
  font-size: 22px;
  font-weight: 700;
}
#mainContentContainer p#errorMessage {
  margin: 24px 0 0 40px;
}
#userProfile #mainContentContainer {
  min-height: 400px;
  padding: 4vh 2vw;
}
#userProfile #bgImageLinkUrl {
  display: none;
}
#userProfile #bgImageContainer {
  display: none;
}
#userProfile .tabContent {
  overflow: auto;
  background-color: #fff;
  height: 80%;
}
#userProfile .businessCard a.users-fullname span {
  color: #554;
}
#userProfile .slideshow {
  background-color: transparent;
}
#userProfile .tabDefaultCheckbox {
  width: auto;
  right: 0;
  top: 5px;
}
.profilePicContainer .profilePic {
  width: 95%;
  max-width: 640px;
  aspect-ratio: 1;
  border-radius: 30%;
  overflow: hidden;
  box-shadow: 0 0 1px #666;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  margin-top: 40px;
}
.profilePicContainer .profilePic.trackAvailability {
  cursor: pointer;
  opacity: 0.5;
  border: 4px solid var(--bs-danger) !important;
}
.profilePicContainer .profilePic.trackAvailability.atWork {
  opacity: 1;
  border: 4px solid var(--bs-success) !important;
}
.profilePicContainer .profilePicControls {
  display: flex;
  width: 95%;
  max-width: 640px;
  justify-content: space-between;
  font-size: 24px;
  padding: 0 0 1rem 1rem;
}
#imageResizeArea.croppie-container .cr-vp-circle {
  border-radius: 30%;
}
#finder #mainContentContainer {
  min-height: 900px;
}
#wiki #mainContentContainer {
  border-top: 1px solid #eee;
}
#wiki #mainContentContainer h1.heading {
  margin: 0 0 0 0;
}
#blank-view #mainContentContainer h1.heading {
  display: none;
}
.toolbar {
  right: 0;
  top: 0;
  position: absolute;
  margin: 0;
  float: none;
}
#default2View #mainContentContainer h1.heading,
#awards-view #mainContentContainer h1.heading,
#contracts #mainContentContainer h1.heading,
#contact-view #mainContentContainer h1.heading,
#search-view #mainContentContainer h1.heading {
  margin: -66px 40px 80px 0;
}
#staffDirectory .searchBox {
  width: 36%;
  max-width: 250px;
  min-width: 148px;
}
#staffDirectory div.groupMembers {
  border-top: 1px solid #eee;
  margin: 0;
}
#mainContentBody {
  position: relative;
}
#mainContentBody,
#default2View,
#search-view #mainContentBody {
  margin: 10px 33% 20px 0;
}
@media (max-width: 799px) {
  #mainContentBody,
  #default2View,
  #search-view #mainContentBody {
    margin-right: 0;
  }
}
#blog #mainContentBody,
#events #mainContentBody {
  margin: 0 35% 0 0;
}
#crm #mainContentBody,
#awards-view #mainContentBody,
#contracts #mainContentBody,
#wiki #mainContentBody,
#admin-view #mainContentBody,
#newsletter #mainContentBody {
  margin: 0;
}
#default-view #mainContentBody {
  margin-top: 40px;
}
#mainContentBody ul,
#xEditingArea ul {
  margin: 0;
  padding: 0;
}
#mainContentBody ul li,
#xEditingArea ul li {
  list-style: none;
}
#mainContentBody ul li:before,
#xEditingArea ul li:before {
  content: "» ";
}
#search-view #contentTarget a h3,
a h3 span {
  display: inline;
  color: #257;
}
.wideBody #mainContentBody {
  margin: 0;
}
label.error span,
span.error {
  color: #f00;
}
#userDetails label {
  font-size: 11px;
}
#userDetails img.userImage {
  max-width: 50%;
}
.smallButtons label,
label.smallButtons {
  margin: 0 0 5px 0;
  height: auto;
  padding: 0;
}
.smallButtons label span,
label.smallButtons span,
.smallButtons button span,
button.smallButtons span,
.smallButtons span.ui-button-text {
  font-size: 12px;
  margin: 0;
  padding: 1px 5px 1px 5px;
}
.tabDefaultCheckbox {
  position: absolute;
  width: 80px;
  right: -83px;
  top: 0;
}
.tabDefaultCheckbox a {
  border: none;
}
#contact-view h2,
#contact-view p,
#contact-view textarea,
#contact-view input {
  margin: 0 0 7px 0;
}
#contact-view .passportPhoto {
  height: 145px;
}
p.copyright {
  float: right;
}
#userProfile #pageFooter,
#finder #pageFooter,
#awards-view #pageFooter {
  margin-top: 0;
  border-top: none;
}
#contracts.stageproject .headingRow h1 button,
#contracts.stageproject .headingRow h1 img.jsHoverÏ {
  display: none;
}
#contracts #mainContentContainer {
  padding: 2rem 0;
}
#contracts #mainContentContainer th {
  font-weight: 600;
}
#contracts #contractStaff td {
  max-width: 70vw;
}
#contracts #projectAdministrators heading,
#contracts #groupMembers heading {
  padding: 0 10px 10px 0;
  white-space: nowrap;
}
#contracts #projectAdministrators heading span.subconsultant,
#contracts #groupMembers heading span.subconsultant {
  font-weight: bolder;
}
#contracts #projectAdministrators .people,
#contracts #groupMembers .people {
  display: flex;
  flex-wrap: wrap;
}
#contracts #projectAdministrators .people .person,
#contracts #groupMembers .people .person {
  display: flex;
  align-items: center;
  margin: 1rem 2rem 1rem 0;
  padding: 0 1.5rem 0 0;
  background-color: #f8f8f8;
  border-radius: 1rem;
}
#contracts #projectAdministrators .people .person > div,
#contracts #groupMembers .people .person > div {
  padding: 0.5em;
}
#contracts #projectAdministrators .people .person .profilePic,
#contracts #groupMembers .people .person .profilePic {
  display: flex;
  flex-shrink: 0;
  cursor: pointer;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  white-space: nowrap;
  width: 60px;
  height: 60px;
  border-radius: inherit;
  overflow: hidden;
  opacity: 0.7;
  color: #fff;
  background-color: #444;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  margin: 0 0.5rem 0 0;
}
#contracts #projectAdministrators .people .person .profilePic:hover,
#contracts #groupMembers .people .person .profilePic:hover {
  opacity: 1;
}
#contracts label {
  margin: 0;
  font-weight: normal;
}
#contracts .topBorder {
  border-top: 1px solid #ccc;
}
#contracts .topBorder.collapsed {
  border-top: none;
}
#contracts .project-color {
  display: inline-block;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  margin: 0 0.5vw -7px 0;
}
#contracts #invoicesContainer {
  width: 100%;
}
#contracts #invoicesContainer img.thumbnail,
#contracts #invoicesContainer button.uploadButton {
  height: 20px;
}
#contracts #invoicesContainer img.launchUploaderButton {
  margin-left: 3px;
}
#contracts #invoices {
  width: 100%;
}
#contracts #subconsultantList th {
  padding: 0 15px 0 0;
  border-bottom: 1px dotted #c0c0c0;
}
#contracts #subconsultantList td {
  padding: 5px 15px 5px 0;
}
#contracts #subconsultantList tfoot td.topBorder {
  border-top: 1px dotted #c0c0c0;
}
#contracts #subconsultantList th:last-child,
#contracts #subconsultantList td:last-child {
  padding-right: 0;
}
#contracts .client {
  color: var(--client-color);
}
#contracts .subconsultant {
  color: var(--subconsultant-color);
}
body#support {
  --square-section-dimension: 640px;
  background-color: #fff;
  width: 100vw;
  margin: 0 auto;
  overflow-x: hidden;
  color: var(--text-color-inverted);
  font-family: 'Nunito Variable', sans-serif;
  text-align: center;
  display: flex;
  flex-wrap: wrap;
}
@media (max-width: 479px) {
  body#support header > img {
    height: 2.5rem;
  }
  body#support #banner > img {
    display: none;
  }
}
@media (max-width: 899px) {
  body#support {
    --square-section-dimension: 100vw;
    font-size: 14px;
  }
  body#support .page i:nth-child(1) {
    background-color: #fff;
  }
}
@media (min-width: 900px) and (max-width: 1499px) {
  body#support {
    --square-section-dimension: 50vw;
  }
  body#support .page i:nth-child(1),
  body#support .page i:nth-child(2) {
    background-color: #fff;
  }
}
@media (min-width: 1500px) and (max-width: 2099px) {
  body#support {
    --square-section-dimension: 33.33vw;
  }
  body#support .page i:nth-child(1),
  body#support .page i:nth-child(2),
  body#support .page i:nth-child(3) {
    background-color: #fff;
  }
}
@media (min-width: 2100px) and (max-width: 2699px) {
  body#support {
    --square-section-dimension: 25vw;
  }
  body#support .page i:nth-child(1),
  body#support .page i:nth-child(2),
  body#support .page i:nth-child(3),
  body#support .page i:nth-child(4) {
    background-color: #fff;
  }
}
body#support h1,
body#support h2,
body#support h3,
body#support p,
body#support label {
  margin: 0;
  color: var(--text-color-inverted);
}
body#support h1 {
  font-weight: 900;
  font-size: 3.6rem;
  line-height: 0.91;
}
body#support h2 {
  font-size: 2.8em;
  font-weight: 700;
}
body#support h3 {
  font-size: 1.4em;
  font-weight: 400;
  margin: 1rem 4vw;
}
body#support a,
body#support a:link,
body#support a:visited,
body#support a:active {
  text-decoration: none;
  color: var(--text-color-inverted);
  border-bottom-color: transparent;
}
body#support a[target=_blank] {
  border-bottom-color: var(--text-color-inverted);
}
body#support a[target=_blank]:hover {
  border-bottom-color: transparent;
}
body#support .hidden {
  display: none;
}
body#support .btn {
  font-family: 'Quantico', sans-serif;
}
body#support object.graphic {
  position: absolute;
  width: 100%;
  padding: 0;
  object-fit: cover;
  opacity: 0.4;
}
body#support header {
  padding: var(--page-padding-y) var(--page-padding-x);
  margin-top: -0.5rem;
  position: absolute;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100vw;
}
body#support header > * {
  height: 3.5rem;
}
body#support header .close-button {
  height: 1.75rem;
  width: 1.75rem;
  background: transparent url("data:image/svg+xml,%3csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20viewBox=%270%200%2016%2016%27%20fill=%27%23FFF%27%3e%3cpath%20d=%27M.293.293a1%201%200%20011.414%200L8%206.586%2014.293.293a1%201%200%20111.414%201.414L9.414%208l6.293%206.293a1%201%200%2001-1.414%201.414L8%209.414l-6.293%206.293a1%201%200%2001-1.414-1.414L6.586%208%20.293%201.707a1%201%200%20010-1.414z%27/%3e%3c/svg%3e") center/1em auto no-repeat;
  background-size: contain;
  opacity: 1;
}
body#support section {
  position: relative;
  padding: 0;
  height: var(--square-section-dimension);
  max-height: 100vw;
  display: flex;
  overflow: visible;
  flex-shrink: 0.9;
  transition: margin, opacity 500ms cubic-bezier(0.445, 0.05, 0.55, 0.95) /* easeInOutSine */;
}
body#support section > main {
  display: none;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: center;
  width: var(--square-section-dimension);
  height: 100%;
  position: relative;
  padding: 4%;
}
body#support section > main button[type="submit"] {
  margin: 2vw 0 0 auto;
  box-shadow: none;
}
body#support section > main:first-child {
  display: flex;
}
body#support section > main input {
  border: none;
}
body#support section > main textarea {
  border: none;
  margin: 2vw 0;
}
body#support section > main .alert {
  text-align: left;
}
body#support section > main .alert a {
  color: inherit;
  text-decoration: underline;
}
body#support section.selected > main {
  display: flex;
  padding-bottom: 4rem;
}
body#support section.blurred {
  opacity: 0.3;
}
body#support section > .page {
  display: none;
  position: absolute;
  width: 100vw;
  bottom: 1rem;
  text-align: center;
  user-select: none;
}
body#support section > .page > i {
  width: 12px;
  height: 12px;
  border-radius: 6px;
  border: 2px solid rgba(255,255,255,0.5);
  margin: 0 0.3em;
  display: inline-block;
}
body#support section > .back,
body#support section > .next {
  display: none;
  position: absolute;
  bottom: 1rem;
  font-size: 2.5em;
  cursor: pointer;
}
body#support section > .back {
  left: 0.3em;
}
body#support section > .next {
  left: calc(100vw - 1.5em);
}
body#support section:not(.selected) .show-on-select {
  display: none;
}
body#support section#banner {
  flex-basis: 100%;
  justify-content: center;
  background-color: #2d2d2d;
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
}
body#support section#banner > div {
  width: auto;
  display: flex;
  flex-direction: column;
}
body#support section#banner > div.customer {
  align-items: center;
  justify-content: space-evenly;
}
@media (min-width: 900px) {
  body#support section#banner > div.customer {
    margin-left: -25%;
  }
}
body#support section#banner > div.customer > * {
  opacity: 0.75;
}
body#support section#banner > div.customer h1 {
  font-size: 3em;
  text-shadow: 0 0 2px #000;
}
body#support section#banner > div.customer .logo {
  height: 3rem;
  max-height: 33%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center top;
}
body#support section#banner > div.customer .logo:hover {
  opacity: 1;
}
body#support section#banner > div.customer .logo img {
  height: inherit;
}
body#support section#issue > main:nth-child(1) {
  background-color: #9b2819;
}
body#support section#issue > main:nth-child(2) {
  background-color: #053f6b;
}
body#support section#issue > main:nth-child(3) {
  background-color: #005a41;
}
body#support section#issue > main:nth-child(3) .uploads {
  background-color: #fff;
  border-radius: 0.25rem;
  padding: 1rem;
}
body#support section#issue > main button[type="submit"] {
  margin: 2rem auto 0 auto;
}
body#support section#feature > main:nth-child(1) {
  background-color: #342071;
}
body#support section#feature > main:nth-child(1) h2 {
  margin-bottom: 2vw;
}
body#support section#feature > main:nth-child(2) {
  background-color: #b92228;
}
body#support section#feature > main:nth-child(3) {
  background-color: #31636e;
  text-align: left;
  align-items: flex-start;
}
body#support section#feature > main:nth-child(3) h3 {
  margin: 0 auto;
}
body#support section#feature > main:nth-child(4) {
  background-color: #67778a;
}
body#support section#feature > main:nth-child(5) {
  background-color: #385898;
}
body#support section#feature > main .form-check {
  line-height: var(--bs-body-line-height);
}
body#support section#feature > main .form-check label {
  line-height: 1;
  margin: 0;
}
body#support section#feature > main .form-check {
  margin: 1rem 0 0 2rem;
}
body#support section#feature > main .form-check .form-control {
  display: inline;
  width: auto;
  margin-left: 1em;
}
body#support section#feature > main .form-check input[name="timescale"] {
  margin-top: -2px;
  max-width: 75%;
}
body#support section#billing > main {
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 2rem;
}
body#support section#billing > main .detail {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2rem;
}
body#support section#billing > main .detail .subscription-battery-container {
  pointer-events: none;
}
body#support section#billing > main .detail .subscription-battery-container .body {
  box-shadow: none;
}
body#support section#billing > main .detail .btn-link {
  color: #fff;
  flex-grow: 0;
}
body#support section#billing > main:nth-child(1) {
  background-color: #003f6b;
}
body#support section#billing > main:nth-child(2) {
  background-color: #67778a;
}
body#support section#billing > main:nth-child(3) {
  background-color: #385898;
}
body#support section#referrals > main:nth-child(1) {
  background-color: #c97f00;
}
body#support section#referrals > main:nth-child(2) {
  background-color: #9e7705;
  padding-top: 1rem;
  padding-bottom: 1rem;
}
body#support section#referrals > main:nth-child(2) > * {
  margin-top: 0.25em;
  margin-bottom: 0.25em;
}
body#support section#referrals > main:nth-child(2) textarea {
  flex-basis: 20em;
}
body#support section#referrals > main:nth-child(2) button[type="submit"] {
  margin-top: 1rem;
}
body#support section#survey {
  display: none;
}
body#support section#survey > main:nth-child(1) {
  background-color: #673ab7;
  justify-content: center;
}
body#support section#contact > main:nth-child(1) {
  background-color: #3b8191;
}
body#support section#contact > main:nth-child(1) textarea {
  height: 12em;
}
body#support section#contact > main:nth-child(2) {
  background-color: #4f5b6a;
  justify-content: center;
}
body#support section#contact > main:nth-child(2) .profilePic {
  width: 120px;
  height: 120px;
  flex-shrink: 0;
  border-radius: 30%;
  overflow: hidden;
  background-size: cover;
  margin: 1vw;
  opacity: 0.7;
}
body#support section#contact > main:nth-child(2) .popup-calendar.btn {
  margin-top: 0.5em;
  box-shadow: none;
}
body#support section#status h1,
body#support section#status h2,
body#support section#status h3 {
  color: var(--text-color-light);
  opacity: 1;
}
body#support section#status > main {
  justify-content: center;
}
body#support section#status > main.developer {
  border-left: 1px solid #eee;
  position: relative;
  text-align: center;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
body#support section#status > main.developer border-right,
body#support section#status > main.developer h2,
body#support section#status > main.developer p,
body#support section#status > main.developer a {
  color: #000;
  margin: 0.5rem 0;
  opacity: 0.75;
}
body#support section#status > main.developer border-right:hover,
body#support section#status > main.developer h2:hover,
body#support section#status > main.developer p:hover,
body#support section#status > main.developer a:hover {
  opacity: 1;
}
body#support section#status > main.developer img {
  height: 60px;
}
@media (max-width: 899px) {
  body#support section#status > main.developer {
    display: none;
  }
}
body#support .calendly-overlay {
  background-color: var(--modalBackgroundColor, rgba(170,170,170,0.8));
  backdrop-filter: blur(2px);
}
body#support .calendly-overlay .calendly-popup-close {
  top: 75px;
  right: 25px;
}
#loading-progress-bar {
  position: fixed;
  top: 0;
  left: 0;
  width: 0;
  height: 2px;
  background-color: #1884ff;
  transition: width 500mS linear, opacity 1S linear;
}
#staffDirectory {
  position: relative;
  background-color: #fff;
}
#staffDirectory button.toggleGroup,
#staffDirectory button.availability,
#staffDirectory button.offBoard {
  padding-left: 1.25rem;
  padding-right: 0.75rem;
}
#staffDirectory button.toggleGroup .fa-check,
#staffDirectory button.availability .fa-check,
#staffDirectory button.offBoard .fa-check {
  display: none;
}
#staffDirectory button.toggleGroup.active,
#staffDirectory button.availability.active,
#staffDirectory button.offBoard.active {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
#staffDirectory button.toggleGroup.active .fa-check,
#staffDirectory button.availability.active .fa-check,
#staffDirectory button.offBoard.active .fa-check {
  display: inline;
}
#staffDirectory #filters {
  display: flex;
  white-space: nowrap;
  flex-wrap: wrap;
  justify-content: flex-end;
  margin-top: 2rem;
}
#staffDirectory #filters > * {
  margin: 1em 0 0 2vw;
}
#staffDirectory #filters > *:first-child {
  margin-left: 0;
}
#staffDirectory #filters .input-group-text {
  background-color: #fff !important;
  border-right: none;
}
#staffDirectory #users {
  position: relative;
  margin-top: 4rem;
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  align-items: flex-start;
}
#staffDirectory #users .user {
  flex-basis: 360px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  margin: 1rem 1vw;
}
#staffDirectory #users .user[class*="hidden-by-"] {
  display: none;
}
#staffDirectory #users .user .profilePic {
  width: 240px;
  aspect-ratio: 1;
  margin: 1rem auto;
  border-radius: 30%;
  overflow: hidden;
  background-color: #444;
  background-position: center center;
  background-size: cover;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 4rem;
  color: #fff;
}
#staffDirectory #users .user .contactInfo {
  position: relative;
  max-width: 360px;
  text-align: center;
}
#staffDirectory #users .user .contactInfo > * {
  margin: 0 0.5rem;
}
#staffDirectory #users .user .contactInfo br {
  flex-basis: 100%;
}
#staffDirectory #users .user .contactInfo .userContentLinks {
  min-width: 240px;
  text-align: center;
  margin: 0 auto;
  padding: 0.25rem 1rem;
}
#staffDirectory #users .user .contactInfo .userContentLinks .divider {
  width: 100px;
  border-top: 1px solid #c0c0c0;
  margin: 0.5rem auto 0 auto;
}
#staffDirectory #users .user .contactInfo p,
#staffDirectory #users .user .contactInfo span {
  font-size: 14px;
  display: inline-block;
}
#staffDirectory #users .user .contactInfo .fullName {
  font-size: 18px;
}
#staffDirectory #users .user .contactInfo .suffix,
#staffDirectory #users .user .contactInfo .role {
  font-size: 13px;
}
#staffDirectory #users .user .contactInfo a {
  border: none;
}
#staffDirectory #users .user .contactInfo a.email,
#staffDirectory #users .user .contactInfo a.phone {
  white-space: nowrap;
}
.showAvailability .user {
  opacity: 0.5;
}
.showAvailability .user .profilePic {
  border: 4px solid var(--bs-danger) !important;
}
.showAvailability .user.atWork {
  opacity: 1;
}
.showAvailability .user.atWork .profilePic {
  border: 4px solid var(--bs-success) !important;
  filter: grayscale(0);
}
@media (max-width: 639px) {
  #staffDirectory #filters {
    margin: auto;
    justify-content: flex-end;
    width: 100%;
  }
}
@media (min-width: 640px) {
  #staffDirectory .groupMembers > .user {
    flex-basis: 50%;
    max-width: 50%;
  }
}
@media (min-width: 1000px) {
  #staffDirectory .groupMembers > .user {
    flex-basis: 33.3%;
    max-width: 33.3%;
  }
}
@media (min-width: 1400px) {
  #staffDirectory .groupMembers > .user {
    flex-basis: 25%;
    max-width: 25%;
  }
}
body#blog.posts header,
body#blog.posts .pageHeading,
body#blog.posts #blogPostToolbar,
body#blog.posts #copyright {
  color: var(--text-color-light);
}
body#blog.posts #blogPostToolbar {
  background-color: #666;
  border: none;
  padding: 1vw;
}
body#blog.posts .ck-content {
  background-color: #fff;
}
body#blog.post {
  margin: 0 auto;
  width: 47.6rem;
  max-width: 100%;
}
#blog #mainContentContainer,
#blog #mainContentBody {
  margin: 1rem 0;
}
#blog #mainContentContainer .pageToolbar,
#blog #mainContentBody .pageToolbar,
#blog #mainContentContainer .pageHeading,
#blog #mainContentBody .pageHeading,
#blog #mainContentContainer h1.heading,
#blog #mainContentBody h1.heading {
  display: none;
}
#blog #mainContentContainer .categoriesList,
#blog #mainContentBody .categoriesList {
  margin: 2rem 0;
  justify-content: center;
  font-weight: 400;
  line-height: 1.5;
  font-size: 1rem;
}
#blog #mainContentContainer .categoriesList > *,
#blog #mainContentBody .categoriesList > * {
  margin: 1rem 0.5rem;
  background-color: var(--bs-yellow);
  border: 1px solid var(--bs-yellow);
  padding: 0 1rem;
  border-radius: 1rem;
}
#blog #mainContentContainer .categoriesList > *:not(.selected):hover a,
#blog #mainContentBody .categoriesList > *:not(.selected):hover a {
  color: #fff;
}
#blog #mainContentContainer .categoriesList > * .selected,
#blog #mainContentBody .categoriesList > * .selected {
  font-weight: bold;
  user-select: none;
}
#blog #mainContentContainer .categoriesList .addCategoryButton,
#blog #mainContentBody .categoriesList .addCategoryButton {
  padding: 0.2rem 1rem;
  font-size: 1rem !important;
  font-weight: 400;
  line-height: 1.5;
  border: 1px solid var(--bs-green);
  border-radius: 1rem;
  background-color: transparent;
  box-shadow: none;
}
#blog #mainContentContainer .categoriesList .addCategoryButton:not(.selected):hover,
#blog #mainContentBody .categoriesList .addCategoryButton:not(.selected):hover {
  background-color: var(--bs-green);
  color: var(--bs-light);
}
#blog .categories a {
  opacity: 0.7;
  border: none;
  line-height: 3em;
  text-transform: uppercase;
  padding: 0 1em;
}
#blog .posts {
  margin: 0;
  width: 100%;
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  text-align: center;
}
#blog .posts .ck-content {
  text-align: initial;
}
@media (min-width: 2000px) {
  #blog .posts {
    padding: 1rem 0;
  }
}
#blog .posts h1 {
  text-align: center;
  margin-bottom: 1em;
}
#blog .posts > h2 {
  font-size: 4.4vw;
  font-weight: 700;
  margin-bottom: 5vw;
  flex-basis: 100%;
}
@media (max-width: 800px) {
  #blog .posts > h2 {
    font-size: 2.2rem;
  }
}
#blog .posts > p {
  width: 100%;
}
#blog .posts .preview {
  position: relative;
  margin: 2.1vw auto;
  width: 77vw;
  height: 25vw;
  display: flex;
  align-items: center;
  border-radius: 1rem;
  border: 1px solid #ccc;
  overflow: hidden;
  background-color: #fff;
  cursor: pointer;
}
@media (max-width: 799px) {
  #blog .posts .preview {
    margin: 3rem auto;
    flex-wrap: wrap;
    height: auto;
  }
}
@media (min-width: 1700px) {
  #blog .posts .preview {
    width: 36vw;
    height: 12vw;
  }
}
@media (min-width: 3700px) {
  #blog .posts .preview {
    margin: 1vw auto;
    width: 30vw;
    height: 10vw;
  }
}
#blog .posts .preview .introImage {
  background-image: none !important;
  height: inherit;
}
@media (max-width: 799px) {
  #blog .posts .preview .introImage {
    width: 100%;
    height: auto;
  }
}
#blog .posts .preview .introImage img {
  height: inherit;
}
@media (max-width: 799px) {
  #blog .posts .preview .introImage img {
    height: auto;
    max-height: initial;
    width: 100%;
  }
}
#blog .posts .preview.controls {
  background-color: transparent;
  justify-content: center;
}
#blog .posts .preview.controls h3.heading {
  font-size: 1.5rem;
  color: var(--bs-success) !important;
}
#blog .posts .preview.controls h3.heading * {
  font-size: inherit;
  color: inherit;
}
#blog .posts .preview.controls.signup {
  display: none;
}
#blog .posts .preview .blurb {
  margin: 0 auto;
  padding: 0 10%;
  color: var(--text-color-dark);
  font-size: 0.65rem;
  font-weight: 400;
  line-height: 1.6;
}
@media (max-width: 799px) {
  #blog .posts .preview .blurb {
    margin: 2rem auto;
  }
}
@media (min-width: 1700px) {
  #blog .posts .preview .blurb {
    padding: 0 2vw;
  }
}
#blog .posts .preview .blurb h3 {
  font-size: 206%;
  text-transform: uppercase;
  margin-bottom: 1em;
}
#blog .posts .preview .blurb h3 a {
  border: none;
}
#blog .posts .preview .blurb .arrow {
  display: none;
}
#blog .posts .preview .blurb .more {
  color: var(--bs-success) !important;
}
#blog .posts .preview .blurb .more * {
  color: inherit;
}
#blog .posts .preview .blurb .more i {
  display: none;
}
#blog .posts a.more {
  margin-top: 3rem;
  border: none;
  flex-basis: 100%;
}